hiderfong/prop-data-guard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
1773bda06bb3df3663164b68169029fa33fb5253
prop-data-guard/frontend/node_modules/element-plus/dist/index.full.js
T
hiderfong 1773bda06b feat: initial commit - Phase 1 & 2 core features
2026-04-22 17:07:33 +08:00

59570 lines
2.0 MiB
Plaintext
Raw Blame History

/*! Element Plus v2.13.7 */
(function(global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
typeof define === 'function' && define.amd ? define(['exports', 'vue'], factory) :
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.ElementPlus = {}), global.Vue));
})(this, function(exports, vue) {
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
//#region \0rolldown/runtime.js
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __commonJSMin = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
key = keys[i];
if (!__hasOwnProp.call(to, key) && key !== except) {
__defProp(to, key, {
get: ((k) => from[k]).bind(null, key),
enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
});
}
}
}
return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
value: mod,
enumerable: true
}) : target, mod));
//#endregion
//#region ../../packages/utils/dom/aria.ts
const FOCUSABLE_ELEMENT_SELECTORS = `a[href],button:not([disabled]),button:not([hidden]),:not([tabindex="-1"]),input:not([disabled]),input:not([type="hidden"]),select:not([disabled]),textarea:not([disabled])`;
const isShadowRoot$1 = (e) => {
if (typeof ShadowRoot === "undefined") return false;
return e instanceof ShadowRoot;
};
const isHTMLElement$1 = (e) => {
if (typeof Element === "undefined") return false;
return e instanceof Element;
};
/**
* Determine if the testing element is visible on screen no matter if its on the viewport or not
*/
const isVisible = (element) => {
return getComputedStyle(element).position === "fixed" ? false : element.offsetParent !== null;
};
const obtainAllFocusableElements$1 = (element) => {
return Array.from(element.querySelectorAll(FOCUSABLE_ELEMENT_SELECTORS)).filter((item) => isFocusable(item) && isVisible(item));
};
/**
* @desc Determine if target element is focusable
* @param element {HTMLElement}
* @returns {Boolean} true if it is focusable
*/
const isFocusable = (element) => {
if (element.tabIndex > 0 || element.tabIndex === 0 && element.getAttribute("tabIndex") !== null) return true;
if (element.tabIndex < 0 || element.hasAttribute("disabled") || element.getAttribute("aria-disabled") === "true") return false;
switch (element.nodeName) {
case "A": return !!element.href && element.rel !== "ignore";
case "INPUT": return !(element.type === "hidden" || element.type === "file");
case "BUTTON":
case "SELECT":
case "TEXTAREA": return true;
default: return false;
}
};
/**
* Trigger an event
* mouseenter, mouseleave, mouseover, keyup, change, click, etc.
* @param {HTMLElement} elm
* @param {String} name
* @param {*} opts
*/
const triggerEvent = function(elm, name, ...opts) {
let eventName;
if (name.includes("mouse") || name.includes("click")) eventName = "MouseEvents";
else if (name.includes("key")) eventName = "KeyboardEvent";
else eventName = "HTMLEvents";
const evt = document.createEvent(eventName);
evt.initEvent(name, ...opts);
elm.dispatchEvent(evt);
return elm;
};
const isLeaf = (el) => !el.getAttribute("aria-owns");
const getSibling = (el, distance, elClass) => {
const { parentNode } = el;
if (!parentNode) return null;
const siblings = parentNode.querySelectorAll(elClass);
return siblings[Array.prototype.indexOf.call(siblings, el) + distance] || null;
};
const focusElement = (el, options) => {
if (!el || !el.focus) return;
let cleanup = false;
if (isHTMLElement$1(el) && !isFocusable(el) && !el.getAttribute("tabindex")) {
el.setAttribute("tabindex", "-1");
cleanup = true;
}
el.focus(options);
if (isHTMLElement$1(el) && cleanup) el.removeAttribute("tabindex");
};
const focusNode = (el) => {
if (!el) return;
focusElement(el);
!isLeaf(el) && el.click();
};
//#endregion
//#region ../../packages/constants/aria.ts
const EVENT_CODE = {
tab: "Tab",
enter: "Enter",
space: "Space",
left: "ArrowLeft",
up: "ArrowUp",
right: "ArrowRight",
down: "ArrowDown",
esc: "Escape",
delete: "Delete",
backspace: "Backspace",
numpadEnter: "NumpadEnter",
pageUp: "PageUp",
pageDown: "PageDown",
home: "Home",
end: "End"
};
//#endregion
//#region ../../packages/constants/date.ts
const datePickTypes = [
"year",
"years",
"month",
"months",
"date",
"dates",
"week",
"datetime",
"datetimerange",
"daterange",
"monthrange",
"yearrange"
];
const WEEK_DAYS = [
"sun",
"mon",
"tue",
"wed",
"thu",
"fri",
"sat"
];
//#endregion
//#region ../../packages/constants/event.ts
const UPDATE_MODEL_EVENT = "update:modelValue";
const CHANGE_EVENT = "change";
const INPUT_EVENT = "input";
//#endregion
//#region ../../packages/constants/key.ts
const INSTALLED_KEY = Symbol("INSTALLED_KEY");
//#endregion
//#region ../../packages/constants/size.ts
const componentSizes = [
"",
"default",
"small",
"large"
];
const componentSizeMap = {
large: 40,
default: 32,
small: 24
};
//#endregion
//#region ../../packages/constants/column-alignment.ts
const columnAlignment = [
"left",
"center",
"right"
];
//#endregion
//#region ../../packages/constants/form.ts
const MINIMUM_INPUT_WIDTH = 11;
const BORDER_HORIZONTAL_WIDTH = 2;
//#endregion
//#region ../../node_modules/.pnpm/@vueuse+shared@12.0.0_typescript@5.5.4/node_modules/@vueuse/shared/index.mjs
function computedEager(fn, options) {
var _a;
const result = (0, vue.shallowRef)();
(0, vue.watchEffect)(() => {
result.value = fn();
}, {
...options,
flush: (_a = options == null ? void 0 : options.flush) != null ? _a : "sync"
});
return (0, vue.readonly)(result);
}
function tryOnScopeDispose(fn) {
if ((0, vue.getCurrentScope)()) {
(0, vue.onScopeDispose)(fn);
return true;
}
return false;
}
function toValue$1(r) {
return typeof r === "function" ? r() : (0, vue.unref)(r);
}
function toReactive(objectRef) {
if (!(0, vue.isRef)(objectRef)) return (0, vue.reactive)(objectRef);
return (0, vue.reactive)(new Proxy({}, {
get(_, p, receiver) {
return (0, vue.unref)(Reflect.get(objectRef.value, p, receiver));
},
set(_, p, value) {
if ((0, vue.isRef)(objectRef.value[p]) && !(0, vue.isRef)(value)) objectRef.value[p].value = value;
else objectRef.value[p] = value;
return true;
},
deleteProperty(_, p) {
return Reflect.deleteProperty(objectRef.value, p);
},
has(_, p) {
return Reflect.has(objectRef.value, p);
},
ownKeys() {
return Object.keys(objectRef.value);
},
getOwnPropertyDescriptor() {
return {
enumerable: true,
configurable: true
};
}
}));
}
function reactiveComputed(fn) {
return toReactive((0, vue.computed)(fn));
}
const isClient = typeof window !== "undefined" && typeof document !== "undefined";
const isWorker = typeof WorkerGlobalScope !== "undefined" && globalThis instanceof WorkerGlobalScope;
const isDef = (val) => typeof val !== "undefined";
const notNullish = (val) => val != null;
const toString$1 = Object.prototype.toString;
const isObject$2 = (val) => toString$1.call(val) === "[object Object]";
const clamp$2 = (n, min, max) => Math.min(max, Math.max(min, n));
const noop$1 = () => {};
const isIOS = /* @__PURE__ */ getIsIOS();
function getIsIOS() {
var _a, _b;
return isClient && ((_a = window == null ? void 0 : window.navigator) == null ? void 0 : _a.userAgent) && (/iP(?:ad|hone|od)/.test(window.navigator.userAgent) || ((_b = window == null ? void 0 : window.navigator) == null ? void 0 : _b.maxTouchPoints) > 2 && /iPad|Macintosh/.test(window == null ? void 0 : window.navigator.userAgent));
}
function createFilterWrapper(filter, fn) {
function wrapper(...args) {
return new Promise((resolve, reject) => {
Promise.resolve(filter(() => fn.apply(this, args), {
fn,
thisArg: this,
args
})).then(resolve).catch(reject);
});
}
return wrapper;
}
function debounceFilter(ms, options = {}) {
let timer;
let maxTimer;
let lastRejector = noop$1;
const _clearTimeout = (timer2) => {
clearTimeout(timer2);
lastRejector();
lastRejector = noop$1;
};
const filter = (invoke) => {
const duration = toValue$1(ms);
const maxDuration = toValue$1(options.maxWait);
if (timer) _clearTimeout(timer);
if (duration <= 0 || maxDuration !== void 0 && maxDuration <= 0) {
if (maxTimer) {
_clearTimeout(maxTimer);
maxTimer = null;
}
return Promise.resolve(invoke());
}
return new Promise((resolve, reject) => {
lastRejector = options.rejectOnCancel ? reject : resolve;
if (maxDuration && !maxTimer) maxTimer = setTimeout(() => {
if (timer) _clearTimeout(timer);
maxTimer = null;
resolve(invoke());
}, maxDuration);
timer = setTimeout(() => {
if (maxTimer) _clearTimeout(maxTimer);
maxTimer = null;
resolve(invoke());
}, duration);
});
};
return filter;
}
function throttleFilter(...args) {
let lastExec = 0;
let timer;
let isLeading = true;
let lastRejector = noop$1;
let lastValue;
let ms;
let trailing;
let leading;
let rejectOnCancel;
if (!(0, vue.isRef)(args[0]) && typeof args[0] === "object") ({delay: ms, trailing = true, leading = true, rejectOnCancel = false} = args[0]);
else [ms, trailing = true, leading = true, rejectOnCancel = false] = args;
const clear = () => {
if (timer) {
clearTimeout(timer);
timer = void 0;
lastRejector();
lastRejector = noop$1;
}
};
const filter = (_invoke) => {
const duration = toValue$1(ms);
const elapsed = Date.now() - lastExec;
const invoke = () => {
return lastValue = _invoke();
};
clear();
if (duration <= 0) {
lastExec = Date.now();
return invoke();
}
if (elapsed > duration && (leading || !isLeading)) {
lastExec = Date.now();
invoke();
} else if (trailing) lastValue = new Promise((resolve, reject) => {
lastRejector = rejectOnCancel ? reject : resolve;
timer = setTimeout(() => {
lastExec = Date.now();
isLeading = true;
resolve(invoke());
clear();
}, Math.max(0, duration - elapsed));
});
if (!leading && !timer) timer = setTimeout(() => isLeading = true, duration);
isLeading = false;
return lastValue;
};
return filter;
}
function cacheStringFunction$1(fn) {
const cache = /* @__PURE__ */ Object.create(null);
return (str) => {
return cache[str] || (cache[str] = fn(str));
};
}
const hyphenateRE$1 = /\B([A-Z])/g;
const hyphenate$1 = cacheStringFunction$1((str) => str.replace(hyphenateRE$1, "-$1").toLowerCase());
const camelizeRE$1 = /-(\w)/g;
const camelize$1 = cacheStringFunction$1((str) => {
return str.replace(camelizeRE$1, (_, c) => c ? c.toUpperCase() : "");
});
function getLifeCycleTarget(target) {
return target || (0, vue.getCurrentInstance)();
}
function useDebounceFn(fn, ms = 200, options = {}) {
return createFilterWrapper(debounceFilter(ms, options), fn);
}
function refDebounced(value, ms = 200, options = {}) {
const debounced = (0, vue.ref)(value.value);
const updater = useDebounceFn(() => {
debounced.value = value.value;
}, ms, options);
(0, vue.watch)(value, () => updater());
return debounced;
}
function useThrottleFn(fn, ms = 200, trailing = false, leading = true, rejectOnCancel = false) {
return createFilterWrapper(throttleFilter(ms, trailing, leading, rejectOnCancel), fn);
}
function tryOnMounted(fn, sync = true, target) {
if (getLifeCycleTarget()) (0, vue.onMounted)(fn, target);
else if (sync) fn();
else (0, vue.nextTick)(fn);
}
function useTimeoutFn(cb, interval, options = {}) {
const { immediate = true } = options;
const isPending = (0, vue.ref)(false);
let timer = null;
function clear() {
if (timer) {
clearTimeout(timer);
timer = null;
}
}
function stop() {
isPending.value = false;
clear();
}
function start(...args) {
clear();
isPending.value = true;
timer = setTimeout(() => {
isPending.value = false;
timer = null;
cb(...args);
}, toValue$1(interval));
}
if (immediate) {
isPending.value = true;
if (isClient) start();
}
tryOnScopeDispose(stop);
return {
isPending: (0, vue.readonly)(isPending),
start,
stop
};
}
//#endregion
//#region ../../node_modules/.pnpm/@vueuse+core@12.0.0_typescript@5.5.4/node_modules/@vueuse/core/index.mjs
const defaultWindow = isClient ? window : void 0;
const defaultDocument = isClient ? window.document : void 0;
const defaultNavigator = isClient ? window.navigator : void 0;
const defaultLocation = isClient ? window.location : void 0;
function unrefElement(elRef) {
var _a;
const plain = toValue$1(elRef);
return (_a = plain == null ? void 0 : plain.$el) != null ? _a : plain;
}
function useEventListener(...args) {
let target;
let events;
let listeners;
let options;
if (typeof args[0] === "string" || Array.isArray(args[0])) {
[events, listeners, options] = args;
target = defaultWindow;
} else [target, events, listeners, options] = args;
if (!target) return noop$1;
if (!Array.isArray(events)) events = [events];
if (!Array.isArray(listeners)) listeners = [listeners];
const cleanups = [];
const cleanup = () => {
cleanups.forEach((fn) => fn());
cleanups.length = 0;
};
const register = (el, event, listener, options2) => {
el.addEventListener(event, listener, options2);
return () => el.removeEventListener(event, listener, options2);
};
const stopWatch = (0, vue.watch)(() => [unrefElement(target), toValue$1(options)], ([el, options2]) => {
cleanup();
if (!el) return;
const optionsClone = isObject$2(options2) ? { ...options2 } : options2;
cleanups.push(...events.flatMap((event) => {
return listeners.map((listener) => register(el, event, listener, optionsClone));
}));
}, {
immediate: true,
flush: "post"
});
const stop = () => {
stopWatch();
cleanup();
};
tryOnScopeDispose(stop);
return stop;
}
let _iOSWorkaround = false;
function onClickOutside(target, handler, options = {}) {
const { window = defaultWindow, ignore = [], capture = true, detectIframe = false } = options;
if (!window) return noop$1;
if (isIOS && !_iOSWorkaround) {
_iOSWorkaround = true;
Array.from(window.document.body.children).forEach((el) => el.addEventListener("click", noop$1));
window.document.documentElement.addEventListener("click", noop$1);
}
let shouldListen = true;
const shouldIgnore = (event) => {
return toValue$1(ignore).some((target2) => {
if (typeof target2 === "string") return Array.from(window.document.querySelectorAll(target2)).some((el) => el === event.target || event.composedPath().includes(el));
else {
const el = unrefElement(target2);
return el && (event.target === el || event.composedPath().includes(el));
}
});
};
function hasMultipleRoots(target2) {
const vm = toValue$1(target2);
return vm && vm.$.subTree.shapeFlag === 16;
}
function checkMultipleRoots(target2, event) {
const vm = toValue$1(target2);
const children = vm.$.subTree && vm.$.subTree.children;
if (children == null || !Array.isArray(children)) return false;
return children.some((child) => child.el === event.target || event.composedPath().includes(child.el));
}
const listener = (event) => {
const el = unrefElement(target);
if (event.target == null) return;
if (!(el instanceof Element) && hasMultipleRoots(target) && checkMultipleRoots(target, event)) return;
if (!el || el === event.target || event.composedPath().includes(el)) return;
if (event.detail === 0) shouldListen = !shouldIgnore(event);
if (!shouldListen) {
shouldListen = true;
return;
}
handler(event);
};
let isProcessingClick = false;
const cleanup = [
useEventListener(window, "click", (event) => {
if (!isProcessingClick) {
isProcessingClick = true;
setTimeout(() => {
isProcessingClick = false;
}, 0);
listener(event);
}
}, {
passive: true,
capture
}),
useEventListener(window, "pointerdown", (e) => {
const el = unrefElement(target);
shouldListen = !shouldIgnore(e) && !!(el && !e.composedPath().includes(el));
}, { passive: true }),
detectIframe && useEventListener(window, "blur", (event) => {
setTimeout(() => {
var _a;
const el = unrefElement(target);
if (((_a = window.document.activeElement) == null ? void 0 : _a.tagName) === "IFRAME" && !(el == null ? void 0 : el.contains(window.document.activeElement))) handler(event);
}, 0);
})
].filter(Boolean);
const stop = () => cleanup.forEach((fn) => fn());
return stop;
}
function useMounted() {
const isMounted = (0, vue.ref)(false);
const instance = (0, vue.getCurrentInstance)();
if (instance) (0, vue.onMounted)(() => {
isMounted.value = true;
}, instance);
return isMounted;
}
function useSupported(callback) {
const isMounted = useMounted();
return (0, vue.computed)(() => {
isMounted.value;
return Boolean(callback());
});
}
function useMutationObserver(target, callback, options = {}) {
const { window = defaultWindow, ...mutationOptions } = options;
let observer;
const isSupported = useSupported(() => window && "MutationObserver" in window);
const cleanup = () => {
if (observer) {
observer.disconnect();
observer = void 0;
}
};
const targets = (0, vue.computed)(() => {
const value = toValue$1(target);
const items = (Array.isArray(value) ? value : [value]).map(unrefElement).filter(notNullish);
return new Set(items);
});
const stopWatch = (0, vue.watch)(() => targets.value, (targets2) => {
cleanup();
if (isSupported.value && targets2.size) {
observer = new MutationObserver(callback);
targets2.forEach((el) => observer.observe(el, mutationOptions));
}
}, {
immediate: true,
flush: "post"
});
const takeRecords = () => {
return observer == null ? void 0 : observer.takeRecords();
};
const stop = () => {
stopWatch();
cleanup();
};
tryOnScopeDispose(stop);
return {
isSupported,
stop,
takeRecords
};
}
function useActiveElement(options = {}) {
var _a;
const { window = defaultWindow, deep = true, triggerOnRemoval = false } = options;
const document = (_a = options.document) != null ? _a : window == null ? void 0 : window.document;
const getDeepActiveElement = () => {
var _a2;
let element = document == null ? void 0 : document.activeElement;
if (deep) while (element == null ? void 0 : element.shadowRoot) element = (_a2 = element == null ? void 0 : element.shadowRoot) == null ? void 0 : _a2.activeElement;
return element;
};
const activeElement = (0, vue.ref)();
const trigger = () => {
activeElement.value = getDeepActiveElement();
};
if (window) {
useEventListener(window, "blur", (event) => {
if (event.relatedTarget !== null) return;
trigger();
}, true);
useEventListener(window, "focus", trigger, true);
}
if (triggerOnRemoval) useMutationObserver(document, (mutations) => {
mutations.filter((m) => m.removedNodes.length).map((n) => Array.from(n.removedNodes)).flat().forEach((node) => {
if (node === activeElement.value) trigger();
});
}, {
childList: true,
subtree: true
});
trigger();
return activeElement;
}
function useMediaQuery(query, options = {}) {
const { window = defaultWindow } = options;
const isSupported = useSupported(() => window && "matchMedia" in window && typeof window.matchMedia === "function");
let mediaQuery;
const matches = (0, vue.ref)(false);
const handler = (event) => {
matches.value = event.matches;
};
const cleanup = () => {
if (!mediaQuery) return;
if ("removeEventListener" in mediaQuery) mediaQuery.removeEventListener("change", handler);
else mediaQuery.removeListener(handler);
};
const stopWatch = (0, vue.watchEffect)(() => {
if (!isSupported.value) return;
cleanup();
mediaQuery = window.matchMedia(toValue$1(query));
if ("addEventListener" in mediaQuery) mediaQuery.addEventListener("change", handler);
else mediaQuery.addListener(handler);
matches.value = mediaQuery.matches;
});
tryOnScopeDispose(() => {
stopWatch();
cleanup();
mediaQuery = void 0;
});
return matches;
}
function cloneFnJSON(source) {
return JSON.parse(JSON.stringify(source));
}
function useCssVar(prop, target, options = {}) {
const { window = defaultWindow, initialValue, observe = false } = options;
const variable = (0, vue.ref)(initialValue);
const elRef = (0, vue.computed)(() => {
var _a;
return unrefElement(target) || ((_a = window == null ? void 0 : window.document) == null ? void 0 : _a.documentElement);
});
function updateCssVar() {
var _a;
const key = toValue$1(prop);
const el = toValue$1(elRef);
if (el && window && key) variable.value = ((_a = window.getComputedStyle(el).getPropertyValue(key)) == null ? void 0 : _a.trim()) || initialValue;
}
if (observe) useMutationObserver(elRef, updateCssVar, {
attributeFilter: ["style", "class"],
window
});
(0, vue.watch)([elRef, () => toValue$1(prop)], (_, old) => {
if (old[0] && old[1]) old[0].style.removeProperty(old[1]);
updateCssVar();
}, { immediate: true });
(0, vue.watch)(variable, (val) => {
var _a;
const raw_prop = toValue$1(prop);
if (((_a = elRef.value) == null ? void 0 : _a.style) && raw_prop) if (val == null) elRef.value.style.removeProperty(raw_prop);
else elRef.value.style.setProperty(raw_prop, val);
});
return variable;
}
function useDocumentVisibility(options = {}) {
const { document = defaultDocument } = options;
if (!document) return (0, vue.ref)("visible");
const visibility = (0, vue.ref)(document.visibilityState);
useEventListener(document, "visibilitychange", () => {
visibility.value = document.visibilityState;
});
return visibility;
}
function useResizeObserver(target, callback, options = {}) {
const { window = defaultWindow, ...observerOptions } = options;
let observer;
const isSupported = useSupported(() => window && "ResizeObserver" in window);
const cleanup = () => {
if (observer) {
observer.disconnect();
observer = void 0;
}
};
const stopWatch = (0, vue.watch)((0, vue.computed)(() => {
const _targets = toValue$1(target);
return Array.isArray(_targets) ? _targets.map((el) => unrefElement(el)) : [unrefElement(_targets)];
}), (els) => {
cleanup();
if (isSupported.value && window) {
observer = new ResizeObserver(callback);
for (const _el of els) if (_el) observer.observe(_el, observerOptions);
}
}, {
immediate: true,
flush: "post"
});
const stop = () => {
cleanup();
stopWatch();
};
tryOnScopeDispose(stop);
return {
isSupported,
stop
};
}
function useElementBounding(target, options = {}) {
const { reset = true, windowResize = true, windowScroll = true, immediate = true, updateTiming = "sync" } = options;
const height = (0, vue.ref)(0);
const bottom = (0, vue.ref)(0);
const left = (0, vue.ref)(0);
const right = (0, vue.ref)(0);
const top = (0, vue.ref)(0);
const width = (0, vue.ref)(0);
const x = (0, vue.ref)(0);
const y = (0, vue.ref)(0);
function recalculate() {
const el = unrefElement(target);
if (!el) {
if (reset) {
height.value = 0;
bottom.value = 0;
left.value = 0;
right.value = 0;
top.value = 0;
width.value = 0;
x.value = 0;
y.value = 0;
}
return;
}
const rect = el.getBoundingClientRect();
height.value = rect.height;
bottom.value = rect.bottom;
left.value = rect.left;
right.value = rect.right;
top.value = rect.top;
width.value = rect.width;
x.value = rect.x;
y.value = rect.y;
}
function update() {
if (updateTiming === "sync") recalculate();
else if (updateTiming === "next-frame") requestAnimationFrame(() => recalculate());
}
useResizeObserver(target, update);
(0, vue.watch)(() => unrefElement(target), (ele) => !ele && update());
useMutationObserver(target, update, { attributeFilter: ["style", "class"] });
if (windowScroll) useEventListener("scroll", update, {
capture: true,
passive: true
});
if (windowResize) useEventListener("resize", update, { passive: true });
tryOnMounted(() => {
if (immediate) update();
});
return {
height,
bottom,
left,
right,
top,
width,
x,
y,
update
};
}
function useElementSize(target, initialSize = {
width: 0,
height: 0
}, options = {}) {
const { window = defaultWindow, box = "content-box" } = options;
const isSVG = (0, vue.computed)(() => {
var _a, _b;
return (_b = (_a = unrefElement(target)) == null ? void 0 : _a.namespaceURI) == null ? void 0 : _b.includes("svg");
});
const width = (0, vue.ref)(initialSize.width);
const height = (0, vue.ref)(initialSize.height);
const { stop: stop1 } = useResizeObserver(target, ([entry]) => {
const boxSize = box === "border-box" ? entry.borderBoxSize : box === "content-box" ? entry.contentBoxSize : entry.devicePixelContentBoxSize;
if (window && isSVG.value) {
const $elem = unrefElement(target);
if ($elem) {
const rect = $elem.getBoundingClientRect();
width.value = rect.width;
height.value = rect.height;
}
} else if (boxSize) {
const formatBoxSize = Array.isArray(boxSize) ? boxSize : [boxSize];
width.value = formatBoxSize.reduce((acc, { inlineSize }) => acc + inlineSize, 0);
height.value = formatBoxSize.reduce((acc, { blockSize }) => acc + blockSize, 0);
} else {
width.value = entry.contentRect.width;
height.value = entry.contentRect.height;
}
}, options);
tryOnMounted(() => {
const ele = unrefElement(target);
if (ele) {
width.value = "offsetWidth" in ele ? ele.offsetWidth : initialSize.width;
height.value = "offsetHeight" in ele ? ele.offsetHeight : initialSize.height;
}
});
const stop2 = (0, vue.watch)(() => unrefElement(target), (ele) => {
width.value = ele ? initialSize.width : 0;
height.value = ele ? initialSize.height : 0;
});
function stop() {
stop1();
stop2();
}
return {
width,
height,
stop
};
}
function useIntersectionObserver(target, callback, options = {}) {
const { root, rootMargin = "0px", threshold = 0, window = defaultWindow, immediate = true } = options;
const isSupported = useSupported(() => window && "IntersectionObserver" in window);
const targets = (0, vue.computed)(() => {
const _target = toValue$1(target);
return (Array.isArray(_target) ? _target : [_target]).map(unrefElement).filter(notNullish);
});
let cleanup = noop$1;
const isActive = (0, vue.ref)(immediate);
const stopWatch = isSupported.value ? (0, vue.watch)(() => [
targets.value,
unrefElement(root),
isActive.value
], ([targets2, root2]) => {
cleanup();
if (!isActive.value) return;
if (!targets2.length) return;
const observer = new IntersectionObserver(callback, {
root: unrefElement(root2),
rootMargin,
threshold
});
targets2.forEach((el) => el && observer.observe(el));
cleanup = () => {
observer.disconnect();
cleanup = noop$1;
};
}, {
immediate,
flush: "post"
}) : noop$1;
const stop = () => {
cleanup();
stopWatch();
isActive.value = false;
};
tryOnScopeDispose(stop);
return {
isSupported,
isActive,
pause() {
cleanup();
isActive.value = false;
},
resume() {
isActive.value = true;
},
stop
};
}
const DEFAULT_UNITS = [
{
max: 6e4,
value: 1e3,
name: "second"
},
{
max: 276e4,
value: 6e4,
name: "minute"
},
{
max: 72e6,
value: 36e5,
name: "hour"
},
{
max: 5184e5,
value: 864e5,
name: "day"
},
{
max: 24192e5,
value: 6048e5,
name: "week"
},
{
max: 28512e6,
value: 2592e6,
name: "month"
},
{
max: Number.POSITIVE_INFINITY,
value: 31536e6,
name: "year"
}
];
function useVModel(props, key, emit, options = {}) {
var _a, _b, _c;
const { clone = false, passive = false, eventName, deep = false, defaultValue, shouldEmit } = options;
const vm = (0, vue.getCurrentInstance)();
const _emit = emit || (vm == null ? void 0 : vm.emit) || ((_a = vm == null ? void 0 : vm.$emit) == null ? void 0 : _a.bind(vm)) || ((_c = (_b = vm == null ? void 0 : vm.proxy) == null ? void 0 : _b.$emit) == null ? void 0 : _c.bind(vm == null ? void 0 : vm.proxy));
let event = eventName;
if (!key) key = "modelValue";
event = event || `update:${key.toString()}`;
const cloneFn = (val) => !clone ? val : typeof clone === "function" ? clone(val) : cloneFnJSON(val);
const getValue = () => isDef(props[key]) ? cloneFn(props[key]) : defaultValue;
const triggerEmit = (value) => {
if (shouldEmit) {
if (shouldEmit(value)) _emit(event, value);
} else _emit(event, value);
};
if (passive) {
const proxy = (0, vue.ref)(getValue());
let isUpdating = false;
(0, vue.watch)(() => props[key], (v) => {
if (!isUpdating) {
isUpdating = true;
proxy.value = cloneFn(v);
(0, vue.nextTick)(() => isUpdating = false);
}
});
(0, vue.watch)(proxy, (v) => {
if (!isUpdating && (v !== props[key] || deep)) triggerEmit(v);
}, { deep });
return proxy;
} else return (0, vue.computed)({
get() {
return getValue();
},
set(value) {
triggerEmit(value);
}
});
}
function useWindowFocus(options = {}) {
const { window = defaultWindow } = options;
if (!window) return (0, vue.ref)(false);
const focused = (0, vue.ref)(window.document.hasFocus());
useEventListener(window, "blur", () => {
focused.value = false;
});
useEventListener(window, "focus", () => {
focused.value = true;
});
return focused;
}
function useWindowSize(options = {}) {
const { window = defaultWindow, initialWidth = Number.POSITIVE_INFINITY, initialHeight = Number.POSITIVE_INFINITY, listenOrientation = true, includeScrollbar = true, type = "inner" } = options;
const width = (0, vue.ref)(initialWidth);
const height = (0, vue.ref)(initialHeight);
const update = () => {
if (window) if (type === "outer") {
width.value = window.outerWidth;
height.value = window.outerHeight;
} else if (includeScrollbar) {
width.value = window.innerWidth;
height.value = window.innerHeight;
} else {
width.value = window.document.documentElement.clientWidth;
height.value = window.document.documentElement.clientHeight;
}
};
update();
tryOnMounted(update);
useEventListener("resize", update, { passive: true });
if (listenOrientation) (0, vue.watch)(useMediaQuery("(orientation: portrait)"), () => update());
return {
width,
height
};
}
//#endregion
//#region ../../packages/utils/browser.ts
const isFirefox = () => isClient && /firefox/i.test(window.navigator.userAgent);
const isAndroid = () => isClient && /android/i.test(window.navigator.userAgent);
//#endregion
//#region ../../packages/utils/dom/event.ts
const composeEventHandlers = (theirsHandler, oursHandler, { checkForDefaultPrevented = true } = {}) => {
const handleEvent = (event) => {
const shouldPrevent = theirsHandler?.(event);
if (checkForDefaultPrevented === false || !shouldPrevent) return oursHandler?.(event);
};
return handleEvent;
};
const whenMouse = (handler) => {
return (e) => e.pointerType === "mouse" ? handler(e) : void 0;
};
const getEventCode = (event) => {
if (event.code && event.code !== "Unidentified") return event.code;
const key = getEventKey(event);
if (key) {
if (Object.values(EVENT_CODE).includes(key)) return key;
switch (key) {
case " ": return EVENT_CODE.space;
default: return "";
}
}
return "";
};
const getEventKey = (event) => {
let key = event.key && event.key !== "Unidentified" ? event.key : "";
if (!key && event.type === "keyup" && isAndroid()) {
const target = event.target;
key = target.value.charAt(target.selectionStart - 1);
}
return key;
};
//#endregion
//#region ../../packages/utils/dom/position.ts
const getOffsetTop = (el) => {
let offset = 0;
let parent = el;
while (parent) {
offset += parent.offsetTop;
parent = parent.offsetParent;
}
return offset;
};
const getOffsetTopDistance = (el, containerEl) => {
return Math.abs(getOffsetTop(el) - getOffsetTop(containerEl));
};
const getClientXY = (event) => {
let clientX;
let clientY;
if (event.type === "touchend") {
clientY = event.changedTouches[0].clientY;
clientX = event.changedTouches[0].clientX;
} else if (event.type.startsWith("touch")) {
clientY = event.touches[0].clientY;
clientX = event.touches[0].clientX;
} else {
clientY = event.clientY;
clientX = event.clientX;
}
return {
clientX,
clientY
};
};
//#endregion
//#region ../../packages/utils/easings.ts
function easeInOutCubic(t, b, c, d) {
const cc = c - b;
t /= d / 2;
if (t < 1) return cc / 2 * t * t * t + b;
return cc / 2 * ((t -= 2) * t * t + 2) + b;
}
//#endregion
//#region ../../node_modules/.pnpm/@vue+shared@3.5.25/node_modules/@vue/shared/dist/shared.esm-bundler.js
/**
* @vue/shared v3.5.25
* (c) 2018-present Yuxi (Evan) You and Vue contributors
* @license MIT
**/
/* @__NO_SIDE_EFFECTS__ */
function makeMap(str) {
const map = /* @__PURE__ */ Object.create(null);
for (const key of str.split(",")) map[key] = 1;
return (val) => val in map;
}
const NOOP = () => {};
const hasOwnProperty$14 = Object.prototype.hasOwnProperty;
const hasOwn = (val, key) => hasOwnProperty$14.call(val, key);
const isArray$1 = Array.isArray;
const isDate = (val) => toTypeString(val) === "[object Date]";
const isFunction$1 = (val) => typeof val === "function";
const isString = (val) => typeof val === "string";
const isObject$1 = (val) => val !== null && typeof val === "object";
const isPromise = (val) => {
return (isObject$1(val) || isFunction$1(val)) && isFunction$1(val.then) && isFunction$1(val.catch);
};
const objectToString$1 = Object.prototype.toString;
const toTypeString = (value) => objectToString$1.call(value);
const isPlainObject$1 = (val) => toTypeString(val) === "[object Object]";
const cacheStringFunction = (fn) => {
const cache = /* @__PURE__ */ Object.create(null);
return ((str) => {
return cache[str] || (cache[str] = fn(str));
});
};
const camelizeRE = /-\w/g;
const camelize = cacheStringFunction((str) => {
return str.replace(camelizeRE, (c) => c.slice(1).toUpperCase());
});
const hyphenateRE = /\B([A-Z])/g;
const hyphenate = cacheStringFunction((str) => str.replace(hyphenateRE, "-$1").toLowerCase());
const capitalize$1 = cacheStringFunction((str) => {
return str.charAt(0).toUpperCase() + str.slice(1);
});
const toHandlerKey = cacheStringFunction((str) => {
return str ? `on${capitalize$1(str)}` : ``;
});
const specialBooleanAttrs = `itemscope,allowfullscreen,formnovalidate,ismap,nomodule,novalidate,readonly`;
const isBooleanAttr = /* @__PURE__ */ makeMap(specialBooleanAttrs + `,async,autofocus,autoplay,controls,default,defer,disabled,hidden,inert,loop,open,required,reversed,scoped,seamless,checked,muted,multiple,selected`);
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_freeGlobal.js
/** Detect free variable `global` from Node.js. */
var freeGlobal = typeof global == "object" && global && global.Object === Object && global;
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_root.js
/** Detect free variable `self`. */
var freeSelf = typeof self == "object" && self && self.Object === Object && self;
/** Used as a reference to the global object. */
var root = freeGlobal || freeSelf || Function("return this")();
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_Symbol.js
/** Built-in value references. */
var Symbol$1 = root.Symbol;
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_getRawTag.js
/** Used for built-in method references. */
var objectProto$4 = Object.prototype;
/** Used to check objects for own properties. */
var hasOwnProperty$13 = objectProto$4.hasOwnProperty;
/**
* Used to resolve the
* [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
* of values.
*/
var nativeObjectToString$1 = objectProto$4.toString;
/** Built-in value references. */
var symToStringTag$1 = Symbol$1 ? Symbol$1.toStringTag : void 0;
/**
* A specialized version of `baseGetTag` which ignores `Symbol.toStringTag` values.
*
* @private
* @param {*} value The value to query.
* @returns {string} Returns the raw `toStringTag`.
*/
function getRawTag(value) {
var isOwn = hasOwnProperty$13.call(value, symToStringTag$1), tag = value[symToStringTag$1];
try {
value[symToStringTag$1] = void 0;
var unmasked = true;
} catch (e) {}
var result = nativeObjectToString$1.call(value);
if (unmasked) if (isOwn) value[symToStringTag$1] = tag;
else delete value[symToStringTag$1];
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_objectToString.js
/**
* Used to resolve the
* [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
* of values.
*/
var nativeObjectToString = Object.prototype.toString;
/**
* Converts `value` to a string using `Object.prototype.toString`.
*
* @private
* @param {*} value The value to convert.
* @returns {string} Returns the converted string.
*/
function objectToString(value) {
return nativeObjectToString.call(value);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseGetTag.js
/** `Object#toString` result references. */
var nullTag = "[object Null]", undefinedTag = "[object Undefined]";
/** Built-in value references. */
var symToStringTag = Symbol$1 ? Symbol$1.toStringTag : void 0;
/**
* The base implementation of `getTag` without fallbacks for buggy environments.
*
* @private
* @param {*} value The value to query.
* @returns {string} Returns the `toStringTag`.
*/
function baseGetTag(value) {
if (value == null) return value === void 0 ? undefinedTag : nullTag;
return symToStringTag && symToStringTag in Object(value) ? getRawTag(value) : objectToString(value);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/isObjectLike.js
/**
* Checks if `value` is object-like. A value is object-like if it's not `null`
* and has a `typeof` result of "object".
*
* @static
* @memberOf _
* @since 4.0.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is object-like, else `false`.
* @example
*
* _.isObjectLike({});
* // => true
*
* _.isObjectLike([1, 2, 3]);
* // => true
*
* _.isObjectLike(_.noop);
* // => false
*
* _.isObjectLike(null);
* // => false
*/
function isObjectLike(value) {
return value != null && typeof value == "object";
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/isSymbol.js
/** `Object#toString` result references. */
var symbolTag$3 = "[object Symbol]";
/**
* Checks if `value` is classified as a `Symbol` primitive or object.
*
* @static
* @memberOf _
* @since 4.0.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is a symbol, else `false`.
* @example
*
* _.isSymbol(Symbol.iterator);
* // => true
*
* _.isSymbol('abc');
* // => false
*/
function isSymbol(value) {
return typeof value == "symbol" || isObjectLike(value) && baseGetTag(value) == symbolTag$3;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_arrayMap.js
/**
* A specialized version of `_.map` for arrays without support for iteratee
* shorthands.
*
* @private
* @param {Array} [array] The array to iterate over.
* @param {Function} iteratee The function invoked per iteration.
* @returns {Array} Returns the new mapped array.
*/
function arrayMap(array, iteratee) {
var index = -1, length = array == null ? 0 : array.length, result = Array(length);
while (++index < length) result[index] = iteratee(array[index], index, array);
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/isArray.js
/**
* Checks if `value` is classified as an `Array` object.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is an array, else `false`.
* @example
*
* _.isArray([1, 2, 3]);
* // => true
*
* _.isArray(document.body.children);
* // => false
*
* _.isArray('abc');
* // => false
*
* _.isArray(_.noop);
* // => false
*/
var isArray = Array.isArray;
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseToString.js
/** Used as references for various `Number` constants. */
var INFINITY$3 = Infinity;
/** Used to convert symbols to primitives and strings. */
var symbolProto$2 = Symbol$1 ? Symbol$1.prototype : void 0, symbolToString = symbolProto$2 ? symbolProto$2.toString : void 0;
/**
* The base implementation of `_.toString` which doesn't convert nullish
* values to empty strings.
*
* @private
* @param {*} value The value to process.
* @returns {string} Returns the string.
*/
function baseToString(value) {
if (typeof value == "string") return value;
if (isArray(value)) return arrayMap(value, baseToString) + "";
if (isSymbol(value)) return symbolToString ? symbolToString.call(value) : "";
var result = value + "";
return result == "0" && 1 / value == -INFINITY$3 ? "-0" : result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_trimmedEndIndex.js
/** Used to match a single whitespace character. */
var reWhitespace = /\s/;
/**
* Used by `_.trim` and `_.trimEnd` to get the index of the last non-whitespace
* character of `string`.
*
* @private
* @param {string} string The string to inspect.
* @returns {number} Returns the index of the last non-whitespace character.
*/
function trimmedEndIndex(string) {
var index = string.length;
while (index-- && reWhitespace.test(string.charAt(index)));
return index;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseTrim.js
/** Used to match leading whitespace. */
var reTrimStart = /^\s+/;
/**
* The base implementation of `_.trim`.
*
* @private
* @param {string} string The string to trim.
* @returns {string} Returns the trimmed string.
*/
function baseTrim(string) {
return string ? string.slice(0, trimmedEndIndex(string) + 1).replace(reTrimStart, "") : string;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/isObject.js
/**
* Checks if `value` is the
* [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)
* of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)
*
* @static
* @memberOf _
* @since 0.1.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is an object, else `false`.
* @example
*
* _.isObject({});
* // => true
*
* _.isObject([1, 2, 3]);
* // => true
*
* _.isObject(_.noop);
* // => true
*
* _.isObject(null);
* // => false
*/
function isObject(value) {
var type = typeof value;
return value != null && (type == "object" || type == "function");
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/toNumber.js
/** Used as references for various `Number` constants. */
var NAN = NaN;
/** Used to detect bad signed hexadecimal string values. */
var reIsBadHex = /^[-+]0x[0-9a-f]+$/i;
/** Used to detect binary string values. */
var reIsBinary = /^0b[01]+$/i;
/** Used to detect octal string values. */
var reIsOctal = /^0o[0-7]+$/i;
/** Built-in method references without a dependency on `root`. */
var freeParseInt = parseInt;
/**
* Converts `value` to a number.
*
* @static
* @memberOf _
* @since 4.0.0
* @category Lang
* @param {*} value The value to process.
* @returns {number} Returns the number.
* @example
*
* _.toNumber(3.2);
* // => 3.2
*
* _.toNumber(Number.MIN_VALUE);
* // => 5e-324
*
* _.toNumber(Infinity);
* // => Infinity
*
* _.toNumber('3.2');
* // => 3.2
*/
function toNumber(value) {
if (typeof value == "number") return value;
if (isSymbol(value)) return NAN;
if (isObject(value)) {
var other = typeof value.valueOf == "function" ? value.valueOf() : value;
value = isObject(other) ? other + "" : other;
}
if (typeof value != "string") return value === 0 ? value : +value;
value = baseTrim(value);
var isBinary = reIsBinary.test(value);
return isBinary || reIsOctal.test(value) ? freeParseInt(value.slice(2), isBinary ? 2 : 8) : reIsBadHex.test(value) ? NAN : +value;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/toFinite.js
/** Used as references for various `Number` constants. */
var INFINITY$2 = Infinity, MAX_INTEGER = 17976931348623157e292;
/**
* Converts `value` to a finite number.
*
* @static
* @memberOf _
* @since 4.12.0
* @category Lang
* @param {*} value The value to convert.
* @returns {number} Returns the converted number.
* @example
*
* _.toFinite(3.2);
* // => 3.2
*
* _.toFinite(Number.MIN_VALUE);
* // => 5e-324
*
* _.toFinite(Infinity);
* // => 1.7976931348623157e+308
*
* _.toFinite('3.2');
* // => 3.2
*/
function toFinite(value) {
if (!value) return value === 0 ? value : 0;
value = toNumber(value);
if (value === INFINITY$2 || value === -INFINITY$2) return (value < 0 ? -1 : 1) * MAX_INTEGER;
return value === value ? value : 0;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/toInteger.js
/**
* Converts `value` to an integer.
*
* **Note:** This method is loosely based on
* [`ToInteger`](http://www.ecma-international.org/ecma-262/7.0/#sec-tointeger).
*
* @static
* @memberOf _
* @since 4.0.0
* @category Lang
* @param {*} value The value to convert.
* @returns {number} Returns the converted integer.
* @example
*
* _.toInteger(3.2);
* // => 3
*
* _.toInteger(Number.MIN_VALUE);
* // => 0
*
* _.toInteger(Infinity);
* // => 1.7976931348623157e+308
*
* _.toInteger('3.2');
* // => 3
*/
function toInteger(value) {
var result = toFinite(value), remainder = result % 1;
return result === result ? remainder ? result - remainder : result : 0;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/identity.js
/**
* This method returns the first argument it receives.
*
* @static
* @since 0.1.0
* @memberOf _
* @category Util
* @param {*} value Any value.
* @returns {*} Returns `value`.
* @example
*
* var object = { 'a': 1 };
*
* console.log(_.identity(object) === object);
* // => true
*/
function identity(value) {
return value;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/isFunction.js
/** `Object#toString` result references. */
var asyncTag = "[object AsyncFunction]", funcTag$2 = "[object Function]", genTag$1 = "[object GeneratorFunction]", proxyTag = "[object Proxy]";
/**
* Checks if `value` is classified as a `Function` object.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is a function, else `false`.
* @example
*
* _.isFunction(_);
* // => true
*
* _.isFunction(/abc/);
* // => false
*/
function isFunction(value) {
if (!isObject(value)) return false;
var tag = baseGetTag(value);
return tag == funcTag$2 || tag == genTag$1 || tag == asyncTag || tag == proxyTag;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_coreJsData.js
/** Used to detect overreaching core-js shims. */
var coreJsData = root["__core-js_shared__"];
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_isMasked.js
/** Used to detect methods masquerading as native. */
var maskSrcKey = function() {
var uid = /[^.]+$/.exec(coreJsData && coreJsData.keys && coreJsData.keys.IE_PROTO || "");
return uid ? "Symbol(src)_1." + uid : "";
}();
/**
* Checks if `func` has its source masked.
*
* @private
* @param {Function} func The function to check.
* @returns {boolean} Returns `true` if `func` is masked, else `false`.
*/
function isMasked(func) {
return !!maskSrcKey && maskSrcKey in func;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_toSource.js
/** Used to resolve the decompiled source of functions. */
var funcToString$2 = Function.prototype.toString;
/**
* Converts `func` to its source code.
*
* @private
* @param {Function} func The function to convert.
* @returns {string} Returns the source code.
*/
function toSource(func) {
if (func != null) {
try {
return funcToString$2.call(func);
} catch (e) {}
try {
return func + "";
} catch (e) {}
}
return "";
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseIsNative.js
/**
* Used to match `RegExp`
* [syntax characters](http://ecma-international.org/ecma-262/7.0/#sec-patterns).
*/
var reRegExpChar = /[\\^$.*+?()[\]{}|]/g;
/** Used to detect host constructors (Safari). */
var reIsHostCtor = /^\[object .+?Constructor\]$/;
/** Used for built-in method references. */
var funcProto$1 = Function.prototype, objectProto$3 = Object.prototype;
/** Used to resolve the decompiled source of functions. */
var funcToString$1 = funcProto$1.toString;
/** Used to check objects for own properties. */
var hasOwnProperty$12 = objectProto$3.hasOwnProperty;
/** Used to detect if a method is native. */
var reIsNative = RegExp("^" + funcToString$1.call(hasOwnProperty$12).replace(reRegExpChar, "\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, "$1.*?") + "$");
/**
* The base implementation of `_.isNative` without bad shim checks.
*
* @private
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is a native function,
* else `false`.
*/
function baseIsNative(value) {
if (!isObject(value) || isMasked(value)) return false;
return (isFunction(value) ? reIsNative : reIsHostCtor).test(toSource(value));
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_getValue.js
/**
* Gets the value at `key` of `object`.
*
* @private
* @param {Object} [object] The object to query.
* @param {string} key The key of the property to get.
* @returns {*} Returns the property value.
*/
function getValue$1(object, key) {
return object == null ? void 0 : object[key];
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_getNative.js
/**
* Gets the native function at `key` of `object`.
*
* @private
* @param {Object} object The object to query.
* @param {string} key The key of the method to get.
* @returns {*} Returns the function if it's native, else `undefined`.
*/
function getNative(object, key) {
var value = getValue$1(object, key);
return baseIsNative(value) ? value : void 0;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_WeakMap.js
var WeakMap$1 = getNative(root, "WeakMap");
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseCreate.js
/** Built-in value references. */
var objectCreate = Object.create;
/**
* The base implementation of `_.create` without support for assigning
* properties to the created object.
*
* @private
* @param {Object} proto The object to inherit from.
* @returns {Object} Returns the new object.
*/
var baseCreate = function() {
function object() {}
return function(proto) {
if (!isObject(proto)) return {};
if (objectCreate) return objectCreate(proto);
object.prototype = proto;
var result = new object();
object.prototype = void 0;
return result;
};
}();
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_apply.js
/**
* A faster alternative to `Function#apply`, this function invokes `func`
* with the `this` binding of `thisArg` and the arguments of `args`.
*
* @private
* @param {Function} func The function to invoke.
* @param {*} thisArg The `this` binding of `func`.
* @param {Array} args The arguments to invoke `func` with.
* @returns {*} Returns the result of `func`.
*/
function apply(func, thisArg, args) {
switch (args.length) {
case 0: return func.call(thisArg);
case 1: return func.call(thisArg, args[0]);
case 2: return func.call(thisArg, args[0], args[1]);
case 3: return func.call(thisArg, args[0], args[1], args[2]);
}
return func.apply(thisArg, args);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/noop.js
/**
* This method returns `undefined`.
*
* @static
* @memberOf _
* @since 2.3.0
* @category Util
* @example
*
* _.times(2, _.noop);
* // => [undefined, undefined]
*/
function noop() {}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_copyArray.js
/**
* Copies the values of `source` to `array`.
*
* @private
* @param {Array} source The array to copy values from.
* @param {Array} [array=[]] The array to copy values to.
* @returns {Array} Returns `array`.
*/
function copyArray(source, array) {
var index = -1, length = source.length;
array || (array = Array(length));
while (++index < length) array[index] = source[index];
return array;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_shortOut.js
/** Used to detect hot functions by number of calls within a span of milliseconds. */
var HOT_COUNT = 800, HOT_SPAN = 16;
var nativeNow = Date.now;
/**
* Creates a function that'll short out and invoke `identity` instead
* of `func` when it's called `HOT_COUNT` or more times in `HOT_SPAN`
* milliseconds.
*
* @private
* @param {Function} func The function to restrict.
* @returns {Function} Returns the new shortable function.
*/
function shortOut(func) {
var count = 0, lastCalled = 0;
return function() {
var stamp = nativeNow(), remaining = HOT_SPAN - (stamp - lastCalled);
lastCalled = stamp;
if (remaining > 0) {
if (++count >= HOT_COUNT) return arguments[0];
} else count = 0;
return func.apply(void 0, arguments);
};
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/constant.js
/**
* Creates a function that returns `value`.
*
* @static
* @memberOf _
* @since 2.4.0
* @category Util
* @param {*} value The value to return from the new function.
* @returns {Function} Returns the new constant function.
* @example
*
* var objects = _.times(2, _.constant({ 'a': 1 }));
*
* console.log(objects);
* // => [{ 'a': 1 }, { 'a': 1 }]
*
* console.log(objects[0] === objects[1]);
* // => true
*/
function constant(value) {
return function() {
return value;
};
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_defineProperty.js
var defineProperty = function() {
try {
var func = getNative(Object, "defineProperty");
func({}, "", {});
return func;
} catch (e) {}
}();
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseSetToString.js
/**
* The base implementation of `setToString` without support for hot loop shorting.
*
* @private
* @param {Function} func The function to modify.
* @param {Function} string The `toString` result.
* @returns {Function} Returns `func`.
*/
var baseSetToString = !defineProperty ? identity : function(func, string) {
return defineProperty(func, "toString", {
"configurable": true,
"enumerable": false,
"value": constant(string),
"writable": true
});
};
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_setToString.js
/**
* Sets the `toString` method of `func` to return `string`.
*
* @private
* @param {Function} func The function to modify.
* @param {Function} string The `toString` result.
* @returns {Function} Returns `func`.
*/
var setToString = shortOut(baseSetToString);
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_arrayEach.js
/**
* A specialized version of `_.forEach` for arrays without support for
* iteratee shorthands.
*
* @private
* @param {Array} [array] The array to iterate over.
* @param {Function} iteratee The function invoked per iteration.
* @returns {Array} Returns `array`.
*/
function arrayEach(array, iteratee) {
var index = -1, length = array == null ? 0 : array.length;
while (++index < length) if (iteratee(array[index], index, array) === false) break;
return array;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseFindIndex.js
/**
* The base implementation of `_.findIndex` and `_.findLastIndex` without
* support for iteratee shorthands.
*
* @private
* @param {Array} array The array to inspect.
* @param {Function} predicate The function invoked per iteration.
* @param {number} fromIndex The index to search from.
* @param {boolean} [fromRight] Specify iterating from right to left.
* @returns {number} Returns the index of the matched value, else `-1`.
*/
function baseFindIndex(array, predicate, fromIndex, fromRight) {
var length = array.length, index = fromIndex + (fromRight ? 1 : -1);
while (fromRight ? index-- : ++index < length) if (predicate(array[index], index, array)) return index;
return -1;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseIsNaN.js
/**
* The base implementation of `_.isNaN` without support for number objects.
*
* @private
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is `NaN`, else `false`.
*/
function baseIsNaN(value) {
return value !== value;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_strictIndexOf.js
/**
* A specialized version of `_.indexOf` which performs strict equality
* comparisons of values, i.e. `===`.
*
* @private
* @param {Array} array The array to inspect.
* @param {*} value The value to search for.
* @param {number} fromIndex The index to search from.
* @returns {number} Returns the index of the matched value, else `-1`.
*/
function strictIndexOf(array, value, fromIndex) {
var index = fromIndex - 1, length = array.length;
while (++index < length) if (array[index] === value) return index;
return -1;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseIndexOf.js
/**
* The base implementation of `_.indexOf` without `fromIndex` bounds checks.
*
* @private
* @param {Array} array The array to inspect.
* @param {*} value The value to search for.
* @param {number} fromIndex The index to search from.
* @returns {number} Returns the index of the matched value, else `-1`.
*/
function baseIndexOf(array, value, fromIndex) {
return value === value ? strictIndexOf(array, value, fromIndex) : baseFindIndex(array, baseIsNaN, fromIndex);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_arrayIncludes.js
/**
* A specialized version of `_.includes` for arrays without support for
* specifying an index to search from.
*
* @private
* @param {Array} [array] The array to inspect.
* @param {*} target The value to search for.
* @returns {boolean} Returns `true` if `target` is found, else `false`.
*/
function arrayIncludes(array, value) {
return !!(array == null ? 0 : array.length) && baseIndexOf(array, value, 0) > -1;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_isIndex.js
/** Used as references for various `Number` constants. */
var MAX_SAFE_INTEGER$1 = 9007199254740991;
/** Used to detect unsigned integer values. */
var reIsUint = /^(?:0|[1-9]\d*)$/;
/**
* Checks if `value` is a valid array-like index.
*
* @private
* @param {*} value The value to check.
* @param {number} [length=MAX_SAFE_INTEGER] The upper bounds of a valid index.
* @returns {boolean} Returns `true` if `value` is a valid index, else `false`.
*/
function isIndex(value, length) {
var type = typeof value;
length = length == null ? MAX_SAFE_INTEGER$1 : length;
return !!length && (type == "number" || type != "symbol" && reIsUint.test(value)) && value > -1 && value % 1 == 0 && value < length;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseAssignValue.js
/**
* The base implementation of `assignValue` and `assignMergeValue` without
* value checks.
*
* @private
* @param {Object} object The object to modify.
* @param {string} key The key of the property to assign.
* @param {*} value The value to assign.
*/
function baseAssignValue(object, key, value) {
if (key == "__proto__" && defineProperty) defineProperty(object, key, {
"configurable": true,
"enumerable": true,
"value": value,
"writable": true
});
else object[key] = value;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/eq.js
/**
* Performs a
* [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
* comparison between two values to determine if they are equivalent.
*
* @static
* @memberOf _
* @since 4.0.0
* @category Lang
* @param {*} value The value to compare.
* @param {*} other The other value to compare.
* @returns {boolean} Returns `true` if the values are equivalent, else `false`.
* @example
*
* var object = { 'a': 1 };
* var other = { 'a': 1 };
*
* _.eq(object, object);
* // => true
*
* _.eq(object, other);
* // => false
*
* _.eq('a', 'a');
* // => true
*
* _.eq('a', Object('a'));
* // => false
*
* _.eq(NaN, NaN);
* // => true
*/
function eq(value, other) {
return value === other || value !== value && other !== other;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_assignValue.js
/** Used to check objects for own properties. */
var hasOwnProperty$11 = Object.prototype.hasOwnProperty;
/**
* Assigns `value` to `key` of `object` if the existing value is not equivalent
* using [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
* for equality comparisons.
*
* @private
* @param {Object} object The object to modify.
* @param {string} key The key of the property to assign.
* @param {*} value The value to assign.
*/
function assignValue(object, key, value) {
var objValue = object[key];
if (!(hasOwnProperty$11.call(object, key) && eq(objValue, value)) || value === void 0 && !(key in object)) baseAssignValue(object, key, value);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_copyObject.js
/**
* Copies properties of `source` to `object`.
*
* @private
* @param {Object} source The object to copy properties from.
* @param {Array} props The property identifiers to copy.
* @param {Object} [object={}] The object to copy properties to.
* @param {Function} [customizer] The function to customize copied values.
* @returns {Object} Returns `object`.
*/
function copyObject(source, props, object, customizer) {
var isNew = !object;
object || (object = {});
var index = -1, length = props.length;
while (++index < length) {
var key = props[index];
var newValue = customizer ? customizer(object[key], source[key], key, object, source) : void 0;
if (newValue === void 0) newValue = source[key];
if (isNew) baseAssignValue(object, key, newValue);
else assignValue(object, key, newValue);
}
return object;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_overRest.js
var nativeMax$2 = Math.max;
/**
* A specialized version of `baseRest` which transforms the rest array.
*
* @private
* @param {Function} func The function to apply a rest parameter to.
* @param {number} [start=func.length-1] The start position of the rest parameter.
* @param {Function} transform The rest array transform.
* @returns {Function} Returns the new function.
*/
function overRest(func, start, transform) {
start = nativeMax$2(start === void 0 ? func.length - 1 : start, 0);
return function() {
var args = arguments, index = -1, length = nativeMax$2(args.length - start, 0), array = Array(length);
while (++index < length) array[index] = args[start + index];
index = -1;
var otherArgs = Array(start + 1);
while (++index < start) otherArgs[index] = args[index];
otherArgs[start] = transform(array);
return apply(func, this, otherArgs);
};
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseRest.js
/**
* The base implementation of `_.rest` which doesn't validate or coerce arguments.
*
* @private
* @param {Function} func The function to apply a rest parameter to.
* @param {number} [start=func.length-1] The start position of the rest parameter.
* @returns {Function} Returns the new function.
*/
function baseRest(func, start) {
return setToString(overRest(func, start, identity), func + "");
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/isLength.js
/** Used as references for various `Number` constants. */
var MAX_SAFE_INTEGER = 9007199254740991;
/**
* Checks if `value` is a valid array-like length.
*
* **Note:** This method is loosely based on
* [`ToLength`](http://ecma-international.org/ecma-262/7.0/#sec-tolength).
*
* @static
* @memberOf _
* @since 4.0.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is a valid length, else `false`.
* @example
*
* _.isLength(3);
* // => true
*
* _.isLength(Number.MIN_VALUE);
* // => false
*
* _.isLength(Infinity);
* // => false
*
* _.isLength('3');
* // => false
*/
function isLength(value) {
return typeof value == "number" && value > -1 && value % 1 == 0 && value <= MAX_SAFE_INTEGER;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/isArrayLike.js
/**
* Checks if `value` is array-like. A value is considered array-like if it's
* not a function and has a `value.length` that's an integer greater than or
* equal to `0` and less than or equal to `Number.MAX_SAFE_INTEGER`.
*
* @static
* @memberOf _
* @since 4.0.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is array-like, else `false`.
* @example
*
* _.isArrayLike([1, 2, 3]);
* // => true
*
* _.isArrayLike(document.body.children);
* // => true
*
* _.isArrayLike('abc');
* // => true
*
* _.isArrayLike(_.noop);
* // => false
*/
function isArrayLike(value) {
return value != null && isLength(value.length) && !isFunction(value);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_isIterateeCall.js
/**
* Checks if the given arguments are from an iteratee call.
*
* @private
* @param {*} value The potential iteratee value argument.
* @param {*} index The potential iteratee index or key argument.
* @param {*} object The potential iteratee object argument.
* @returns {boolean} Returns `true` if the arguments are from an iteratee call,
* else `false`.
*/
function isIterateeCall(value, index, object) {
if (!isObject(object)) return false;
var type = typeof index;
if (type == "number" ? isArrayLike(object) && isIndex(index, object.length) : type == "string" && index in object) return eq(object[index], value);
return false;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_createAssigner.js
/**
* Creates a function like `_.assign`.
*
* @private
* @param {Function} assigner The function to assign values.
* @returns {Function} Returns the new assigner function.
*/
function createAssigner(assigner) {
return baseRest(function(object, sources) {
var index = -1, length = sources.length, customizer = length > 1 ? sources[length - 1] : void 0, guard = length > 2 ? sources[2] : void 0;
customizer = assigner.length > 3 && typeof customizer == "function" ? (length--, customizer) : void 0;
if (guard && isIterateeCall(sources[0], sources[1], guard)) {
customizer = length < 3 ? void 0 : customizer;
length = 1;
}
object = Object(object);
while (++index < length) {
var source = sources[index];
if (source) assigner(object, source, index, customizer);
}
return object;
});
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_isPrototype.js
/** Used for built-in method references. */
var objectProto$2 = Object.prototype;
/**
* Checks if `value` is likely a prototype object.
*
* @private
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is a prototype, else `false`.
*/
function isPrototype(value) {
var Ctor = value && value.constructor;
return value === (typeof Ctor == "function" && Ctor.prototype || objectProto$2);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseTimes.js
/**
* The base implementation of `_.times` without support for iteratee shorthands
* or max array length checks.
*
* @private
* @param {number} n The number of times to invoke `iteratee`.
* @param {Function} iteratee The function invoked per iteration.
* @returns {Array} Returns the array of results.
*/
function baseTimes(n, iteratee) {
var index = -1, result = Array(n);
while (++index < n) result[index] = iteratee(index);
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseIsArguments.js
/** `Object#toString` result references. */
var argsTag$3 = "[object Arguments]";
/**
* The base implementation of `_.isArguments`.
*
* @private
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is an `arguments` object,
*/
function baseIsArguments(value) {
return isObjectLike(value) && baseGetTag(value) == argsTag$3;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/isArguments.js
/** Used for built-in method references. */
var objectProto$1 = Object.prototype;
/** Used to check objects for own properties. */
var hasOwnProperty$10 = objectProto$1.hasOwnProperty;
/** Built-in value references. */
var propertyIsEnumerable$1 = objectProto$1.propertyIsEnumerable;
/**
* Checks if `value` is likely an `arguments` object.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is an `arguments` object,
* else `false`.
* @example
*
* _.isArguments(function() { return arguments; }());
* // => true
*
* _.isArguments([1, 2, 3]);
* // => false
*/
var isArguments = baseIsArguments(function() {
return arguments;
}()) ? baseIsArguments : function(value) {
return isObjectLike(value) && hasOwnProperty$10.call(value, "callee") && !propertyIsEnumerable$1.call(value, "callee");
};
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/stubFalse.js
/**
* This method returns `false`.
*
* @static
* @memberOf _
* @since 4.13.0
* @category Util
* @returns {boolean} Returns `false`.
* @example
*
* _.times(2, _.stubFalse);
* // => [false, false]
*/
function stubFalse() {
return false;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/isBuffer.js
/** Detect free variable `exports`. */
var freeExports$2 = typeof exports == "object" && exports && !exports.nodeType && exports;
/** Detect free variable `module`. */
var freeModule$2 = freeExports$2 && typeof module == "object" && module && !module.nodeType && module;
/** Built-in value references. */
var Buffer$2 = freeModule$2 && freeModule$2.exports === freeExports$2 ? root.Buffer : void 0;
/**
* Checks if `value` is a buffer.
*
* @static
* @memberOf _
* @since 4.3.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is a buffer, else `false`.
* @example
*
* _.isBuffer(new Buffer(2));
* // => true
*
* _.isBuffer(new Uint8Array(2));
* // => false
*/
var isBuffer = (Buffer$2 ? Buffer$2.isBuffer : void 0) || stubFalse;
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseIsTypedArray.js
/** `Object#toString` result references. */
var argsTag$2 = "[object Arguments]", arrayTag$2 = "[object Array]", boolTag$3 = "[object Boolean]", dateTag$3 = "[object Date]", errorTag$2 = "[object Error]", funcTag$1 = "[object Function]", mapTag$5 = "[object Map]", numberTag$3 = "[object Number]", objectTag$4 = "[object Object]", regexpTag$3 = "[object RegExp]", setTag$5 = "[object Set]", stringTag$3 = "[object String]", weakMapTag$2 = "[object WeakMap]";
var arrayBufferTag$3 = "[object ArrayBuffer]", dataViewTag$4 = "[object DataView]", float32Tag$2 = "[object Float32Array]", float64Tag$2 = "[object Float64Array]", int8Tag$2 = "[object Int8Array]", int16Tag$2 = "[object Int16Array]", int32Tag$2 = "[object Int32Array]", uint8Tag$2 = "[object Uint8Array]", uint8ClampedTag$2 = "[object Uint8ClampedArray]", uint16Tag$2 = "[object Uint16Array]", uint32Tag$2 = "[object Uint32Array]";
/** Used to identify `toStringTag` values of typed arrays. */
var typedArrayTags = {};
typedArrayTags[float32Tag$2] = typedArrayTags[float64Tag$2] = typedArrayTags[int8Tag$2] = typedArrayTags[int16Tag$2] = typedArrayTags[int32Tag$2] = typedArrayTags[uint8Tag$2] = typedArrayTags[uint8ClampedTag$2] = typedArrayTags[uint16Tag$2] = typedArrayTags[uint32Tag$2] = true;
typedArrayTags[argsTag$2] = typedArrayTags[arrayTag$2] = typedArrayTags[arrayBufferTag$3] = typedArrayTags[boolTag$3] = typedArrayTags[dataViewTag$4] = typedArrayTags[dateTag$3] = typedArrayTags[errorTag$2] = typedArrayTags[funcTag$1] = typedArrayTags[mapTag$5] = typedArrayTags[numberTag$3] = typedArrayTags[objectTag$4] = typedArrayTags[regexpTag$3] = typedArrayTags[setTag$5] = typedArrayTags[stringTag$3] = typedArrayTags[weakMapTag$2] = false;
/**
* The base implementation of `_.isTypedArray` without Node.js optimizations.
*
* @private
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is a typed array, else `false`.
*/
function baseIsTypedArray(value) {
return isObjectLike(value) && isLength(value.length) && !!typedArrayTags[baseGetTag(value)];
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseUnary.js
/**
* The base implementation of `_.unary` without support for storing metadata.
*
* @private
* @param {Function} func The function to cap arguments for.
* @returns {Function} Returns the new capped function.
*/
function baseUnary(func) {
return function(value) {
return func(value);
};
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_nodeUtil.js
/** Detect free variable `exports`. */
var freeExports$1 = typeof exports == "object" && exports && !exports.nodeType && exports;
/** Detect free variable `module`. */
var freeModule$1 = freeExports$1 && typeof module == "object" && module && !module.nodeType && module;
/** Detect free variable `process` from Node.js. */
var freeProcess = freeModule$1 && freeModule$1.exports === freeExports$1 && freeGlobal.process;
/** Used to access faster Node.js helpers. */
var nodeUtil = function() {
try {
var types = freeModule$1 && freeModule$1.require && freeModule$1.require("util").types;
if (types) return types;
return freeProcess && freeProcess.binding && freeProcess.binding("util");
} catch (e) {}
}();
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/isTypedArray.js
var nodeIsTypedArray = nodeUtil && nodeUtil.isTypedArray;
/**
* Checks if `value` is classified as a typed array.
*
* @static
* @memberOf _
* @since 3.0.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is a typed array, else `false`.
* @example
*
* _.isTypedArray(new Uint8Array);
* // => true
*
* _.isTypedArray([]);
* // => false
*/
var isTypedArray = nodeIsTypedArray ? baseUnary(nodeIsTypedArray) : baseIsTypedArray;
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_arrayLikeKeys.js
/** Used to check objects for own properties. */
var hasOwnProperty$9 = Object.prototype.hasOwnProperty;
/**
* Creates an array of the enumerable property names of the array-like `value`.
*
* @private
* @param {*} value The value to query.
* @param {boolean} inherited Specify returning inherited property names.
* @returns {Array} Returns the array of property names.
*/
function arrayLikeKeys(value, inherited) {
var isArr = isArray(value), isArg = !isArr && isArguments(value), isBuff = !isArr && !isArg && isBuffer(value), isType = !isArr && !isArg && !isBuff && isTypedArray(value), skipIndexes = isArr || isArg || isBuff || isType, result = skipIndexes ? baseTimes(value.length, String) : [], length = result.length;
for (var key in value) if ((inherited || hasOwnProperty$9.call(value, key)) && !(skipIndexes && (key == "length" || isBuff && (key == "offset" || key == "parent") || isType && (key == "buffer" || key == "byteLength" || key == "byteOffset") || isIndex(key, length)))) result.push(key);
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_overArg.js
/**
* Creates a unary function that invokes `func` with its argument transformed.
*
* @private
* @param {Function} func The function to wrap.
* @param {Function} transform The argument transform.
* @returns {Function} Returns the new function.
*/
function overArg(func, transform) {
return function(arg) {
return func(transform(arg));
};
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_nativeKeys.js
var nativeKeys = overArg(Object.keys, Object);
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseKeys.js
/** Used to check objects for own properties. */
var hasOwnProperty$8 = Object.prototype.hasOwnProperty;
/**
* The base implementation of `_.keys` which doesn't treat sparse arrays as dense.
*
* @private
* @param {Object} object The object to query.
* @returns {Array} Returns the array of property names.
*/
function baseKeys(object) {
if (!isPrototype(object)) return nativeKeys(object);
var result = [];
for (var key in Object(object)) if (hasOwnProperty$8.call(object, key) && key != "constructor") result.push(key);
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/keys.js
/**
* Creates an array of the own enumerable property names of `object`.
*
* **Note:** Non-object values are coerced to objects. See the
* [ES spec](http://ecma-international.org/ecma-262/7.0/#sec-object.keys)
* for more details.
*
* @static
* @since 0.1.0
* @memberOf _
* @category Object
* @param {Object} object The object to query.
* @returns {Array} Returns the array of property names.
* @example
*
* function Foo() {
* this.a = 1;
* this.b = 2;
* }
*
* Foo.prototype.c = 3;
*
* _.keys(new Foo);
* // => ['a', 'b'] (iteration order is not guaranteed)
*
* _.keys('hi');
* // => ['0', '1']
*/
function keys(object) {
return isArrayLike(object) ? arrayLikeKeys(object) : baseKeys(object);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_nativeKeysIn.js
/**
* This function is like
* [`Object.keys`](http://ecma-international.org/ecma-262/7.0/#sec-object.keys)
* except that it includes inherited enumerable properties.
*
* @private
* @param {Object} object The object to query.
* @returns {Array} Returns the array of property names.
*/
function nativeKeysIn(object) {
var result = [];
if (object != null) for (var key in Object(object)) result.push(key);
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseKeysIn.js
/** Used to check objects for own properties. */
var hasOwnProperty$7 = Object.prototype.hasOwnProperty;
/**
* The base implementation of `_.keysIn` which doesn't treat sparse arrays as dense.
*
* @private
* @param {Object} object The object to query.
* @returns {Array} Returns the array of property names.
*/
function baseKeysIn(object) {
if (!isObject(object)) return nativeKeysIn(object);
var isProto = isPrototype(object), result = [];
for (var key in object) if (!(key == "constructor" && (isProto || !hasOwnProperty$7.call(object, key)))) result.push(key);
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/keysIn.js
/**
* Creates an array of the own and inherited enumerable property names of `object`.
*
* **Note:** Non-object values are coerced to objects.
*
* @static
* @memberOf _
* @since 3.0.0
* @category Object
* @param {Object} object The object to query.
* @returns {Array} Returns the array of property names.
* @example
*
* function Foo() {
* this.a = 1;
* this.b = 2;
* }
*
* Foo.prototype.c = 3;
*
* _.keysIn(new Foo);
* // => ['a', 'b', 'c'] (iteration order is not guaranteed)
*/
function keysIn(object) {
return isArrayLike(object) ? arrayLikeKeys(object, true) : baseKeysIn(object);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_isKey.js
/** Used to match property names within property paths. */
var reIsDeepProp = /\.|\[(?:[^[\]]*|(["'])(?:(?!\1)[^\\]|\\.)*?\1)\]/, reIsPlainProp = /^\w*$/;
/**
* Checks if `value` is a property name and not a property path.
*
* @private
* @param {*} value The value to check.
* @param {Object} [object] The object to query keys on.
* @returns {boolean} Returns `true` if `value` is a property name, else `false`.
*/
function isKey(value, object) {
if (isArray(value)) return false;
var type = typeof value;
if (type == "number" || type == "symbol" || type == "boolean" || value == null || isSymbol(value)) return true;
return reIsPlainProp.test(value) || !reIsDeepProp.test(value) || object != null && value in Object(object);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_nativeCreate.js
var nativeCreate = getNative(Object, "create");
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_hashClear.js
/**
* Removes all key-value entries from the hash.
*
* @private
* @name clear
* @memberOf Hash
*/
function hashClear() {
this.__data__ = nativeCreate ? nativeCreate(null) : {};
this.size = 0;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_hashDelete.js
/**
* Removes `key` and its value from the hash.
*
* @private
* @name delete
* @memberOf Hash
* @param {Object} hash The hash to modify.
* @param {string} key The key of the value to remove.
* @returns {boolean} Returns `true` if the entry was removed, else `false`.
*/
function hashDelete(key) {
var result = this.has(key) && delete this.__data__[key];
this.size -= result ? 1 : 0;
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_hashGet.js
/** Used to stand-in for `undefined` hash values. */
var HASH_UNDEFINED$2 = "__lodash_hash_undefined__";
/** Used to check objects for own properties. */
var hasOwnProperty$6 = Object.prototype.hasOwnProperty;
/**
* Gets the hash value for `key`.
*
* @private
* @name get
* @memberOf Hash
* @param {string} key The key of the value to get.
* @returns {*} Returns the entry value.
*/
function hashGet(key) {
var data = this.__data__;
if (nativeCreate) {
var result = data[key];
return result === HASH_UNDEFINED$2 ? void 0 : result;
}
return hasOwnProperty$6.call(data, key) ? data[key] : void 0;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_hashHas.js
/** Used to check objects for own properties. */
var hasOwnProperty$5 = Object.prototype.hasOwnProperty;
/**
* Checks if a hash value for `key` exists.
*
* @private
* @name has
* @memberOf Hash
* @param {string} key The key of the entry to check.
* @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
*/
function hashHas(key) {
var data = this.__data__;
return nativeCreate ? data[key] !== void 0 : hasOwnProperty$5.call(data, key);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_hashSet.js
/** Used to stand-in for `undefined` hash values. */
var HASH_UNDEFINED$1 = "__lodash_hash_undefined__";
/**
* Sets the hash `key` to `value`.
*
* @private
* @name set
* @memberOf Hash
* @param {string} key The key of the value to set.
* @param {*} value The value to set.
* @returns {Object} Returns the hash instance.
*/
function hashSet(key, value) {
var data = this.__data__;
this.size += this.has(key) ? 0 : 1;
data[key] = nativeCreate && value === void 0 ? HASH_UNDEFINED$1 : value;
return this;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_Hash.js
/**
* Creates a hash object.
*
* @private
* @constructor
* @param {Array} [entries] The key-value pairs to cache.
*/
function Hash(entries) {
var index = -1, length = entries == null ? 0 : entries.length;
this.clear();
while (++index < length) {
var entry = entries[index];
this.set(entry[0], entry[1]);
}
}
Hash.prototype.clear = hashClear;
Hash.prototype["delete"] = hashDelete;
Hash.prototype.get = hashGet;
Hash.prototype.has = hashHas;
Hash.prototype.set = hashSet;
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_listCacheClear.js
/**
* Removes all key-value entries from the list cache.
*
* @private
* @name clear
* @memberOf ListCache
*/
function listCacheClear() {
this.__data__ = [];
this.size = 0;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_assocIndexOf.js
/**
* Gets the index at which the `key` is found in `array` of key-value pairs.
*
* @private
* @param {Array} array The array to inspect.
* @param {*} key The key to search for.
* @returns {number} Returns the index of the matched value, else `-1`.
*/
function assocIndexOf(array, key) {
var length = array.length;
while (length--) if (eq(array[length][0], key)) return length;
return -1;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_listCacheDelete.js
/** Built-in value references. */
var splice = Array.prototype.splice;
/**
* Removes `key` and its value from the list cache.
*
* @private
* @name delete
* @memberOf ListCache
* @param {string} key The key of the value to remove.
* @returns {boolean} Returns `true` if the entry was removed, else `false`.
*/
function listCacheDelete(key) {
var data = this.__data__, index = assocIndexOf(data, key);
if (index < 0) return false;
if (index == data.length - 1) data.pop();
else splice.call(data, index, 1);
--this.size;
return true;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_listCacheGet.js
/**
* Gets the list cache value for `key`.
*
* @private
* @name get
* @memberOf ListCache
* @param {string} key The key of the value to get.
* @returns {*} Returns the entry value.
*/
function listCacheGet(key) {
var data = this.__data__, index = assocIndexOf(data, key);
return index < 0 ? void 0 : data[index][1];
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_listCacheHas.js
/**
* Checks if a list cache value for `key` exists.
*
* @private
* @name has
* @memberOf ListCache
* @param {string} key The key of the entry to check.
* @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
*/
function listCacheHas(key) {
return assocIndexOf(this.__data__, key) > -1;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_listCacheSet.js
/**
* Sets the list cache `key` to `value`.
*
* @private
* @name set
* @memberOf ListCache
* @param {string} key The key of the value to set.
* @param {*} value The value to set.
* @returns {Object} Returns the list cache instance.
*/
function listCacheSet(key, value) {
var data = this.__data__, index = assocIndexOf(data, key);
if (index < 0) {
++this.size;
data.push([key, value]);
} else data[index][1] = value;
return this;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_ListCache.js
/**
* Creates an list cache object.
*
* @private
* @constructor
* @param {Array} [entries] The key-value pairs to cache.
*/
function ListCache(entries) {
var index = -1, length = entries == null ? 0 : entries.length;
this.clear();
while (++index < length) {
var entry = entries[index];
this.set(entry[0], entry[1]);
}
}
ListCache.prototype.clear = listCacheClear;
ListCache.prototype["delete"] = listCacheDelete;
ListCache.prototype.get = listCacheGet;
ListCache.prototype.has = listCacheHas;
ListCache.prototype.set = listCacheSet;
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_Map.js
var Map$1 = getNative(root, "Map");
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_mapCacheClear.js
/**
* Removes all key-value entries from the map.
*
* @private
* @name clear
* @memberOf MapCache
*/
function mapCacheClear() {
this.size = 0;
this.__data__ = {
"hash": new Hash(),
"map": new (Map$1 || ListCache)(),
"string": new Hash()
};
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_isKeyable.js
/**
* Checks if `value` is suitable for use as unique object key.
*
* @private
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is suitable, else `false`.
*/
function isKeyable(value) {
var type = typeof value;
return type == "string" || type == "number" || type == "symbol" || type == "boolean" ? value !== "__proto__" : value === null;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_getMapData.js
/**
* Gets the data for `map`.
*
* @private
* @param {Object} map The map to query.
* @param {string} key The reference key.
* @returns {*} Returns the map data.
*/
function getMapData(map, key) {
var data = map.__data__;
return isKeyable(key) ? data[typeof key == "string" ? "string" : "hash"] : data.map;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_mapCacheDelete.js
/**
* Removes `key` and its value from the map.
*
* @private
* @name delete
* @memberOf MapCache
* @param {string} key The key of the value to remove.
* @returns {boolean} Returns `true` if the entry was removed, else `false`.
*/
function mapCacheDelete(key) {
var result = getMapData(this, key)["delete"](key);
this.size -= result ? 1 : 0;
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_mapCacheGet.js
/**
* Gets the map value for `key`.
*
* @private
* @name get
* @memberOf MapCache
* @param {string} key The key of the value to get.
* @returns {*} Returns the entry value.
*/
function mapCacheGet(key) {
return getMapData(this, key).get(key);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_mapCacheHas.js
/**
* Checks if a map value for `key` exists.
*
* @private
* @name has
* @memberOf MapCache
* @param {string} key The key of the entry to check.
* @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
*/
function mapCacheHas(key) {
return getMapData(this, key).has(key);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_mapCacheSet.js
/**
* Sets the map `key` to `value`.
*
* @private
* @name set
* @memberOf MapCache
* @param {string} key The key of the value to set.
* @param {*} value The value to set.
* @returns {Object} Returns the map cache instance.
*/
function mapCacheSet(key, value) {
var data = getMapData(this, key), size = data.size;
data.set(key, value);
this.size += data.size == size ? 0 : 1;
return this;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_MapCache.js
/**
* Creates a map cache object to store key-value pairs.
*
* @private
* @constructor
* @param {Array} [entries] The key-value pairs to cache.
*/
function MapCache(entries) {
var index = -1, length = entries == null ? 0 : entries.length;
this.clear();
while (++index < length) {
var entry = entries[index];
this.set(entry[0], entry[1]);
}
}
MapCache.prototype.clear = mapCacheClear;
MapCache.prototype["delete"] = mapCacheDelete;
MapCache.prototype.get = mapCacheGet;
MapCache.prototype.has = mapCacheHas;
MapCache.prototype.set = mapCacheSet;
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/memoize.js
/** Error message constants. */
var FUNC_ERROR_TEXT$2 = "Expected a function";
/**
* Creates a function that memoizes the result of `func`. If `resolver` is
* provided, it determines the cache key for storing the result based on the
* arguments provided to the memoized function. By default, the first argument
* provided to the memoized function is used as the map cache key. The `func`
* is invoked with the `this` binding of the memoized function.
*
* **Note:** The cache is exposed as the `cache` property on the memoized
* function. Its creation may be customized by replacing the `_.memoize.Cache`
* constructor with one whose instances implement the
* [`Map`](http://ecma-international.org/ecma-262/7.0/#sec-properties-of-the-map-prototype-object)
* method interface of `clear`, `delete`, `get`, `has`, and `set`.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Function
* @param {Function} func The function to have its output memoized.
* @param {Function} [resolver] The function to resolve the cache key.
* @returns {Function} Returns the new memoized function.
* @example
*
* var object = { 'a': 1, 'b': 2 };
* var other = { 'c': 3, 'd': 4 };
*
* var values = _.memoize(_.values);
* values(object);
* // => [1, 2]
*
* values(other);
* // => [3, 4]
*
* object.a = 2;
* values(object);
* // => [1, 2]
*
* // Modify the result cache.
* values.cache.set(object, ['a', 'b']);
* values(object);
* // => ['a', 'b']
*
* // Replace `_.memoize.Cache`.
* _.memoize.Cache = WeakMap;
*/
function memoize(func, resolver) {
if (typeof func != "function" || resolver != null && typeof resolver != "function") throw new TypeError(FUNC_ERROR_TEXT$2);
var memoized = function() {
var args = arguments, key = resolver ? resolver.apply(this, args) : args[0], cache = memoized.cache;
if (cache.has(key)) return cache.get(key);
var result = func.apply(this, args);
memoized.cache = cache.set(key, result) || cache;
return result;
};
memoized.cache = new (memoize.Cache || MapCache)();
return memoized;
}
memoize.Cache = MapCache;
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_memoizeCapped.js
/** Used as the maximum memoize cache size. */
var MAX_MEMOIZE_SIZE = 500;
/**
* A specialized version of `_.memoize` which clears the memoized function's
* cache when it exceeds `MAX_MEMOIZE_SIZE`.
*
* @private
* @param {Function} func The function to have its output memoized.
* @returns {Function} Returns the new memoized function.
*/
function memoizeCapped(func) {
var result = memoize(func, function(key) {
if (cache.size === MAX_MEMOIZE_SIZE) cache.clear();
return key;
});
var cache = result.cache;
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_stringToPath.js
/** Used to match property names within property paths. */
var rePropName = /[^.[\]]+|\[(?:(-?\d+(?:\.\d+)?)|(["'])((?:(?!\2)[^\\]|\\.)*?)\2)\]|(?=(?:\.|\[\])(?:\.|\[\]|$))/g;
/** Used to match backslashes in property paths. */
var reEscapeChar = /\\(\\)?/g;
/**
* Converts `string` to a property path array.
*
* @private
* @param {string} string The string to convert.
* @returns {Array} Returns the property path array.
*/
var stringToPath = memoizeCapped(function(string) {
var result = [];
if (string.charCodeAt(0) === 46) result.push("");
string.replace(rePropName, function(match, number, quote, subString) {
result.push(quote ? subString.replace(reEscapeChar, "$1") : number || match);
});
return result;
});
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/toString.js
/**
* Converts `value` to a string. An empty string is returned for `null`
* and `undefined` values. The sign of `-0` is preserved.
*
* @static
* @memberOf _
* @since 4.0.0
* @category Lang
* @param {*} value The value to convert.
* @returns {string} Returns the converted string.
* @example
*
* _.toString(null);
* // => ''
*
* _.toString(-0);
* // => '-0'
*
* _.toString([1, 2, 3]);
* // => '1,2,3'
*/
function toString(value) {
return value == null ? "" : baseToString(value);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_castPath.js
/**
* Casts `value` to a path array if it's not one.
*
* @private
* @param {*} value The value to inspect.
* @param {Object} [object] The object to query keys on.
* @returns {Array} Returns the cast property path array.
*/
function castPath(value, object) {
if (isArray(value)) return value;
return isKey(value, object) ? [value] : stringToPath(toString(value));
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_toKey.js
/** Used as references for various `Number` constants. */
var INFINITY$1 = Infinity;
/**
* Converts `value` to a string key if it's not a string or symbol.
*
* @private
* @param {*} value The value to inspect.
* @returns {string|symbol} Returns the key.
*/
function toKey(value) {
if (typeof value == "string" || isSymbol(value)) return value;
var result = value + "";
return result == "0" && 1 / value == -INFINITY$1 ? "-0" : result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseGet.js
/**
* The base implementation of `_.get` without support for default values.
*
* @private
* @param {Object} object The object to query.
* @param {Array|string} path The path of the property to get.
* @returns {*} Returns the resolved value.
*/
function baseGet(object, path) {
path = castPath(path, object);
var index = 0, length = path.length;
while (object != null && index < length) object = object[toKey(path[index++])];
return index && index == length ? object : void 0;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/get.js
/**
* Gets the value at `path` of `object`. If the resolved value is
* `undefined`, the `defaultValue` is returned in its place.
*
* @static
* @memberOf _
* @since 3.7.0
* @category Object
* @param {Object} object The object to query.
* @param {Array|string} path The path of the property to get.
* @param {*} [defaultValue] The value returned for `undefined` resolved values.
* @returns {*} Returns the resolved value.
* @example
*
* var object = { 'a': [{ 'b': { 'c': 3 } }] };
*
* _.get(object, 'a[0].b.c');
* // => 3
*
* _.get(object, ['a', '0', 'b', 'c']);
* // => 3
*
* _.get(object, 'a.b.c', 'default');
* // => 'default'
*/
function get(object, path, defaultValue) {
var result = object == null ? void 0 : baseGet(object, path);
return result === void 0 ? defaultValue : result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_arrayPush.js
/**
* Appends the elements of `values` to `array`.
*
* @private
* @param {Array} array The array to modify.
* @param {Array} values The values to append.
* @returns {Array} Returns `array`.
*/
function arrayPush(array, values) {
var index = -1, length = values.length, offset = array.length;
while (++index < length) array[offset + index] = values[index];
return array;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_isFlattenable.js
/** Built-in value references. */
var spreadableSymbol = Symbol$1 ? Symbol$1.isConcatSpreadable : void 0;
/**
* Checks if `value` is a flattenable `arguments` object or array.
*
* @private
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is flattenable, else `false`.
*/
function isFlattenable(value) {
return isArray(value) || isArguments(value) || !!(spreadableSymbol && value && value[spreadableSymbol]);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseFlatten.js
/**
* The base implementation of `_.flatten` with support for restricting flattening.
*
* @private
* @param {Array} array The array to flatten.
* @param {number} depth The maximum recursion depth.
* @param {boolean} [predicate=isFlattenable] The function invoked per iteration.
* @param {boolean} [isStrict] Restrict to values that pass `predicate` checks.
* @param {Array} [result=[]] The initial result value.
* @returns {Array} Returns the new flattened array.
*/
function baseFlatten(array, depth, predicate, isStrict, result) {
var index = -1, length = array.length;
predicate || (predicate = isFlattenable);
result || (result = []);
while (++index < length) {
var value = array[index];
if (depth > 0 && predicate(value)) if (depth > 1) baseFlatten(value, depth - 1, predicate, isStrict, result);
else arrayPush(result, value);
else if (!isStrict) result[result.length] = value;
}
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/flatten.js
/**
* Flattens `array` a single level deep.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Array
* @param {Array} array The array to flatten.
* @returns {Array} Returns the new flattened array.
* @example
*
* _.flatten([1, [2, [3, [4]], 5]]);
* // => [1, 2, [3, [4]], 5]
*/
function flatten(array) {
return (array == null ? 0 : array.length) ? baseFlatten(array, 1) : [];
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_flatRest.js
/**
* A specialized version of `baseRest` which flattens the rest array.
*
* @private
* @param {Function} func The function to apply a rest parameter to.
* @returns {Function} Returns the new function.
*/
function flatRest(func) {
return setToString(overRest(func, void 0, flatten), func + "");
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_getPrototype.js
/** Built-in value references. */
var getPrototype = overArg(Object.getPrototypeOf, Object);
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/isPlainObject.js
/** `Object#toString` result references. */
var objectTag$3 = "[object Object]";
/** Used for built-in method references. */
var funcProto = Function.prototype, objectProto = Object.prototype;
/** Used to resolve the decompiled source of functions. */
var funcToString = funcProto.toString;
/** Used to check objects for own properties. */
var hasOwnProperty$4 = objectProto.hasOwnProperty;
/** Used to infer the `Object` constructor. */
var objectCtorString = funcToString.call(Object);
/**
* Checks if `value` is a plain object, that is, an object created by the
* `Object` constructor or one with a `[[Prototype]]` of `null`.
*
* @static
* @memberOf _
* @since 0.8.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is a plain object, else `false`.
* @example
*
* function Foo() {
* this.a = 1;
* }
*
* _.isPlainObject(new Foo);
* // => false
*
* _.isPlainObject([1, 2, 3]);
* // => false
*
* _.isPlainObject({ 'x': 0, 'y': 0 });
* // => true
*
* _.isPlainObject(Object.create(null));
* // => true
*/
function isPlainObject(value) {
if (!isObjectLike(value) || baseGetTag(value) != objectTag$3) return false;
var proto = getPrototype(value);
if (proto === null) return true;
var Ctor = hasOwnProperty$4.call(proto, "constructor") && proto.constructor;
return typeof Ctor == "function" && Ctor instanceof Ctor && funcToString.call(Ctor) == objectCtorString;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseSlice.js
/**
* The base implementation of `_.slice` without an iteratee call guard.
*
* @private
* @param {Array} array The array to slice.
* @param {number} [start=0] The start position.
* @param {number} [end=array.length] The end position.
* @returns {Array} Returns the slice of `array`.
*/
function baseSlice(array, start, end) {
var index = -1, length = array.length;
if (start < 0) start = -start > length ? 0 : length + start;
end = end > length ? length : end;
if (end < 0) end += length;
length = start > end ? 0 : end - start >>> 0;
start >>>= 0;
var result = Array(length);
while (++index < length) result[index] = array[index + start];
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/castArray.js
/**
* Casts `value` as an array if it's not one.
*
* @static
* @memberOf _
* @since 4.4.0
* @category Lang
* @param {*} value The value to inspect.
* @returns {Array} Returns the cast array.
* @example
*
* _.castArray(1);
* // => [1]
*
* _.castArray({ 'a': 1 });
* // => [{ 'a': 1 }]
*
* _.castArray('abc');
* // => ['abc']
*
* _.castArray(null);
* // => [null]
*
* _.castArray(undefined);
* // => [undefined]
*
* _.castArray();
* // => []
*
* var array = [1, 2, 3];
* console.log(_.castArray(array) === array);
* // => true
*/
function castArray$1() {
if (!arguments.length) return [];
var value = arguments[0];
return isArray(value) ? value : [value];
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseClamp.js
/**
* The base implementation of `_.clamp` which doesn't coerce arguments.
*
* @private
* @param {number} number The number to clamp.
* @param {number} [lower] The lower bound.
* @param {number} upper The upper bound.
* @returns {number} Returns the clamped number.
*/
function baseClamp(number, lower, upper) {
if (number === number) {
if (upper !== void 0) number = number <= upper ? number : upper;
if (lower !== void 0) number = number >= lower ? number : lower;
}
return number;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/clamp.js
/**
* Clamps `number` within the inclusive `lower` and `upper` bounds.
*
* @static
* @memberOf _
* @since 4.0.0
* @category Number
* @param {number} number The number to clamp.
* @param {number} [lower] The lower bound.
* @param {number} upper The upper bound.
* @returns {number} Returns the clamped number.
* @example
*
* _.clamp(-10, -5, 5);
* // => -5
*
* _.clamp(10, -5, 5);
* // => 5
*/
function clamp$1(number, lower, upper) {
if (upper === void 0) {
upper = lower;
lower = void 0;
}
if (upper !== void 0) {
upper = toNumber(upper);
upper = upper === upper ? upper : 0;
}
if (lower !== void 0) {
lower = toNumber(lower);
lower = lower === lower ? lower : 0;
}
return baseClamp(toNumber(number), lower, upper);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_stackClear.js
/**
* Removes all key-value entries from the stack.
*
* @private
* @name clear
* @memberOf Stack
*/
function stackClear() {
this.__data__ = new ListCache();
this.size = 0;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_stackDelete.js
/**
* Removes `key` and its value from the stack.
*
* @private
* @name delete
* @memberOf Stack
* @param {string} key The key of the value to remove.
* @returns {boolean} Returns `true` if the entry was removed, else `false`.
*/
function stackDelete(key) {
var data = this.__data__, result = data["delete"](key);
this.size = data.size;
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_stackGet.js
/**
* Gets the stack value for `key`.
*
* @private
* @name get
* @memberOf Stack
* @param {string} key The key of the value to get.
* @returns {*} Returns the entry value.
*/
function stackGet(key) {
return this.__data__.get(key);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_stackHas.js
/**
* Checks if a stack value for `key` exists.
*
* @private
* @name has
* @memberOf Stack
* @param {string} key The key of the entry to check.
* @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
*/
function stackHas(key) {
return this.__data__.has(key);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_stackSet.js
/** Used as the size to enable large array optimizations. */
var LARGE_ARRAY_SIZE$1 = 200;
/**
* Sets the stack `key` to `value`.
*
* @private
* @name set
* @memberOf Stack
* @param {string} key The key of the value to set.
* @param {*} value The value to set.
* @returns {Object} Returns the stack cache instance.
*/
function stackSet(key, value) {
var data = this.__data__;
if (data instanceof ListCache) {
var pairs = data.__data__;
if (!Map$1 || pairs.length < LARGE_ARRAY_SIZE$1 - 1) {
pairs.push([key, value]);
this.size = ++data.size;
return this;
}
data = this.__data__ = new MapCache(pairs);
}
data.set(key, value);
this.size = data.size;
return this;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_Stack.js
/**
* Creates a stack cache object to store key-value pairs.
*
* @private
* @constructor
* @param {Array} [entries] The key-value pairs to cache.
*/
function Stack(entries) {
this.size = (this.__data__ = new ListCache(entries)).size;
}
Stack.prototype.clear = stackClear;
Stack.prototype["delete"] = stackDelete;
Stack.prototype.get = stackGet;
Stack.prototype.has = stackHas;
Stack.prototype.set = stackSet;
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseAssign.js
/**
* The base implementation of `_.assign` without support for multiple sources
* or `customizer` functions.
*
* @private
* @param {Object} object The destination object.
* @param {Object} source The source object.
* @returns {Object} Returns `object`.
*/
function baseAssign(object, source) {
return object && copyObject(source, keys(source), object);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseAssignIn.js
/**
* The base implementation of `_.assignIn` without support for multiple sources
* or `customizer` functions.
*
* @private
* @param {Object} object The destination object.
* @param {Object} source The source object.
* @returns {Object} Returns `object`.
*/
function baseAssignIn(object, source) {
return object && copyObject(source, keysIn(source), object);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_cloneBuffer.js
/** Detect free variable `exports`. */
var freeExports = typeof exports == "object" && exports && !exports.nodeType && exports;
/** Detect free variable `module`. */
var freeModule = freeExports && typeof module == "object" && module && !module.nodeType && module;
/** Built-in value references. */
var Buffer$1 = freeModule && freeModule.exports === freeExports ? root.Buffer : void 0, allocUnsafe = Buffer$1 ? Buffer$1.allocUnsafe : void 0;
/**
* Creates a clone of `buffer`.
*
* @private
* @param {Buffer} buffer The buffer to clone.
* @param {boolean} [isDeep] Specify a deep clone.
* @returns {Buffer} Returns the cloned buffer.
*/
function cloneBuffer(buffer, isDeep) {
if (isDeep) return buffer.slice();
var length = buffer.length, result = allocUnsafe ? allocUnsafe(length) : new buffer.constructor(length);
buffer.copy(result);
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_arrayFilter.js
/**
* A specialized version of `_.filter` for arrays without support for
* iteratee shorthands.
*
* @private
* @param {Array} [array] The array to iterate over.
* @param {Function} predicate The function invoked per iteration.
* @returns {Array} Returns the new filtered array.
*/
function arrayFilter(array, predicate) {
var index = -1, length = array == null ? 0 : array.length, resIndex = 0, result = [];
while (++index < length) {
var value = array[index];
if (predicate(value, index, array)) result[resIndex++] = value;
}
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/stubArray.js
/**
* This method returns a new empty array.
*
* @static
* @memberOf _
* @since 4.13.0
* @category Util
* @returns {Array} Returns the new empty array.
* @example
*
* var arrays = _.times(2, _.stubArray);
*
* console.log(arrays);
* // => [[], []]
*
* console.log(arrays[0] === arrays[1]);
* // => false
*/
function stubArray() {
return [];
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_getSymbols.js
/** Built-in value references. */
var propertyIsEnumerable = Object.prototype.propertyIsEnumerable;
var nativeGetSymbols = Object.getOwnPropertySymbols;
/**
* Creates an array of the own enumerable symbols of `object`.
*
* @private
* @param {Object} object The object to query.
* @returns {Array} Returns the array of symbols.
*/
var getSymbols = !nativeGetSymbols ? stubArray : function(object) {
if (object == null) return [];
object = Object(object);
return arrayFilter(nativeGetSymbols(object), function(symbol) {
return propertyIsEnumerable.call(object, symbol);
});
};
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_copySymbols.js
/**
* Copies own symbols of `source` to `object`.
*
* @private
* @param {Object} source The object to copy symbols from.
* @param {Object} [object={}] The object to copy symbols to.
* @returns {Object} Returns `object`.
*/
function copySymbols(source, object) {
return copyObject(source, getSymbols(source), object);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_getSymbolsIn.js
/**
* Creates an array of the own and inherited enumerable symbols of `object`.
*
* @private
* @param {Object} object The object to query.
* @returns {Array} Returns the array of symbols.
*/
var getSymbolsIn = !Object.getOwnPropertySymbols ? stubArray : function(object) {
var result = [];
while (object) {
arrayPush(result, getSymbols(object));
object = getPrototype(object);
}
return result;
};
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_copySymbolsIn.js
/**
* Copies own and inherited symbols of `source` to `object`.
*
* @private
* @param {Object} source The object to copy symbols from.
* @param {Object} [object={}] The object to copy symbols to.
* @returns {Object} Returns `object`.
*/
function copySymbolsIn(source, object) {
return copyObject(source, getSymbolsIn(source), object);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseGetAllKeys.js
/**
* The base implementation of `getAllKeys` and `getAllKeysIn` which uses
* `keysFunc` and `symbolsFunc` to get the enumerable property names and
* symbols of `object`.
*
* @private
* @param {Object} object The object to query.
* @param {Function} keysFunc The function to get the keys of `object`.
* @param {Function} symbolsFunc The function to get the symbols of `object`.
* @returns {Array} Returns the array of property names and symbols.
*/
function baseGetAllKeys(object, keysFunc, symbolsFunc) {
var result = keysFunc(object);
return isArray(object) ? result : arrayPush(result, symbolsFunc(object));
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_getAllKeys.js
/**
* Creates an array of own enumerable property names and symbols of `object`.
*
* @private
* @param {Object} object The object to query.
* @returns {Array} Returns the array of property names and symbols.
*/
function getAllKeys(object) {
return baseGetAllKeys(object, keys, getSymbols);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_getAllKeysIn.js
/**
* Creates an array of own and inherited enumerable property names and
* symbols of `object`.
*
* @private
* @param {Object} object The object to query.
* @returns {Array} Returns the array of property names and symbols.
*/
function getAllKeysIn(object) {
return baseGetAllKeys(object, keysIn, getSymbolsIn);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_DataView.js
var DataView = getNative(root, "DataView");
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_Promise.js
var Promise$1 = getNative(root, "Promise");
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_Set.js
var Set$1 = getNative(root, "Set");
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_getTag.js
/** `Object#toString` result references. */
var mapTag$4 = "[object Map]", objectTag$2 = "[object Object]", promiseTag = "[object Promise]", setTag$4 = "[object Set]", weakMapTag$1 = "[object WeakMap]";
var dataViewTag$3 = "[object DataView]";
/** Used to detect maps, sets, and weakmaps. */
var dataViewCtorString = toSource(DataView), mapCtorString = toSource(Map$1), promiseCtorString = toSource(Promise$1), setCtorString = toSource(Set$1), weakMapCtorString = toSource(WeakMap$1);
/**
* Gets the `toStringTag` of `value`.
*
* @private
* @param {*} value The value to query.
* @returns {string} Returns the `toStringTag`.
*/
var getTag = baseGetTag;
if (DataView && getTag(new DataView(/* @__PURE__ */ new ArrayBuffer(1))) != dataViewTag$3 || Map$1 && getTag(new Map$1()) != mapTag$4 || Promise$1 && getTag(Promise$1.resolve()) != promiseTag || Set$1 && getTag(new Set$1()) != setTag$4 || WeakMap$1 && getTag(new WeakMap$1()) != weakMapTag$1) getTag = function(value) {
var result = baseGetTag(value), Ctor = result == objectTag$2 ? value.constructor : void 0, ctorString = Ctor ? toSource(Ctor) : "";
if (ctorString) switch (ctorString) {
case dataViewCtorString: return dataViewTag$3;
case mapCtorString: return mapTag$4;
case promiseCtorString: return promiseTag;
case setCtorString: return setTag$4;
case weakMapCtorString: return weakMapTag$1;
}
return result;
};
var _getTag_default = getTag;
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_initCloneArray.js
/** Used to check objects for own properties. */
var hasOwnProperty$3 = Object.prototype.hasOwnProperty;
/**
* Initializes an array clone.
*
* @private
* @param {Array} array The array to clone.
* @returns {Array} Returns the initialized clone.
*/
function initCloneArray(array) {
var length = array.length, result = new array.constructor(length);
if (length && typeof array[0] == "string" && hasOwnProperty$3.call(array, "index")) {
result.index = array.index;
result.input = array.input;
}
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_Uint8Array.js
/** Built-in value references. */
var Uint8Array$1 = root.Uint8Array;
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_cloneArrayBuffer.js
/**
* Creates a clone of `arrayBuffer`.
*
* @private
* @param {ArrayBuffer} arrayBuffer The array buffer to clone.
* @returns {ArrayBuffer} Returns the cloned array buffer.
*/
function cloneArrayBuffer(arrayBuffer) {
var result = new arrayBuffer.constructor(arrayBuffer.byteLength);
new Uint8Array$1(result).set(new Uint8Array$1(arrayBuffer));
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_cloneDataView.js
/**
* Creates a clone of `dataView`.
*
* @private
* @param {Object} dataView The data view to clone.
* @param {boolean} [isDeep] Specify a deep clone.
* @returns {Object} Returns the cloned data view.
*/
function cloneDataView(dataView, isDeep) {
var buffer = isDeep ? cloneArrayBuffer(dataView.buffer) : dataView.buffer;
return new dataView.constructor(buffer, dataView.byteOffset, dataView.byteLength);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_cloneRegExp.js
/** Used to match `RegExp` flags from their coerced string values. */
var reFlags = /\w*$/;
/**
* Creates a clone of `regexp`.
*
* @private
* @param {Object} regexp The regexp to clone.
* @returns {Object} Returns the cloned regexp.
*/
function cloneRegExp(regexp) {
var result = new regexp.constructor(regexp.source, reFlags.exec(regexp));
result.lastIndex = regexp.lastIndex;
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_cloneSymbol.js
/** Used to convert symbols to primitives and strings. */
var symbolProto$1 = Symbol$1 ? Symbol$1.prototype : void 0, symbolValueOf$1 = symbolProto$1 ? symbolProto$1.valueOf : void 0;
/**
* Creates a clone of the `symbol` object.
*
* @private
* @param {Object} symbol The symbol object to clone.
* @returns {Object} Returns the cloned symbol object.
*/
function cloneSymbol(symbol) {
return symbolValueOf$1 ? Object(symbolValueOf$1.call(symbol)) : {};
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_cloneTypedArray.js
/**
* Creates a clone of `typedArray`.
*
* @private
* @param {Object} typedArray The typed array to clone.
* @param {boolean} [isDeep] Specify a deep clone.
* @returns {Object} Returns the cloned typed array.
*/
function cloneTypedArray(typedArray, isDeep) {
var buffer = isDeep ? cloneArrayBuffer(typedArray.buffer) : typedArray.buffer;
return new typedArray.constructor(buffer, typedArray.byteOffset, typedArray.length);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_initCloneByTag.js
/** `Object#toString` result references. */
var boolTag$2 = "[object Boolean]", dateTag$2 = "[object Date]", mapTag$3 = "[object Map]", numberTag$2 = "[object Number]", regexpTag$2 = "[object RegExp]", setTag$3 = "[object Set]", stringTag$2 = "[object String]", symbolTag$2 = "[object Symbol]";
var arrayBufferTag$2 = "[object ArrayBuffer]", dataViewTag$2 = "[object DataView]", float32Tag$1 = "[object Float32Array]", float64Tag$1 = "[object Float64Array]", int8Tag$1 = "[object Int8Array]", int16Tag$1 = "[object Int16Array]", int32Tag$1 = "[object Int32Array]", uint8Tag$1 = "[object Uint8Array]", uint8ClampedTag$1 = "[object Uint8ClampedArray]", uint16Tag$1 = "[object Uint16Array]", uint32Tag$1 = "[object Uint32Array]";
/**
* Initializes an object clone based on its `toStringTag`.
*
* **Note:** This function only supports cloning values with tags of
* `Boolean`, `Date`, `Error`, `Map`, `Number`, `RegExp`, `Set`, or `String`.
*
* @private
* @param {Object} object The object to clone.
* @param {string} tag The `toStringTag` of the object to clone.
* @param {boolean} [isDeep] Specify a deep clone.
* @returns {Object} Returns the initialized clone.
*/
function initCloneByTag(object, tag, isDeep) {
var Ctor = object.constructor;
switch (tag) {
case arrayBufferTag$2: return cloneArrayBuffer(object);
case boolTag$2:
case dateTag$2: return new Ctor(+object);
case dataViewTag$2: return cloneDataView(object, isDeep);
case float32Tag$1:
case float64Tag$1:
case int8Tag$1:
case int16Tag$1:
case int32Tag$1:
case uint8Tag$1:
case uint8ClampedTag$1:
case uint16Tag$1:
case uint32Tag$1: return cloneTypedArray(object, isDeep);
case mapTag$3: return new Ctor();
case numberTag$2:
case stringTag$2: return new Ctor(object);
case regexpTag$2: return cloneRegExp(object);
case setTag$3: return new Ctor();
case symbolTag$2: return cloneSymbol(object);
}
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_initCloneObject.js
/**
* Initializes an object clone.
*
* @private
* @param {Object} object The object to clone.
* @returns {Object} Returns the initialized clone.
*/
function initCloneObject(object) {
return typeof object.constructor == "function" && !isPrototype(object) ? baseCreate(getPrototype(object)) : {};
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseIsMap.js
/** `Object#toString` result references. */
var mapTag$2 = "[object Map]";
/**
* The base implementation of `_.isMap` without Node.js optimizations.
*
* @private
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is a map, else `false`.
*/
function baseIsMap(value) {
return isObjectLike(value) && _getTag_default(value) == mapTag$2;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/isMap.js
var nodeIsMap = nodeUtil && nodeUtil.isMap;
/**
* Checks if `value` is classified as a `Map` object.
*
* @static
* @memberOf _
* @since 4.3.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is a map, else `false`.
* @example
*
* _.isMap(new Map);
* // => true
*
* _.isMap(new WeakMap);
* // => false
*/
var isMap = nodeIsMap ? baseUnary(nodeIsMap) : baseIsMap;
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseIsSet.js
/** `Object#toString` result references. */
var setTag$2 = "[object Set]";
/**
* The base implementation of `_.isSet` without Node.js optimizations.
*
* @private
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is a set, else `false`.
*/
function baseIsSet(value) {
return isObjectLike(value) && _getTag_default(value) == setTag$2;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/isSet.js
var nodeIsSet = nodeUtil && nodeUtil.isSet;
/**
* Checks if `value` is classified as a `Set` object.
*
* @static
* @memberOf _
* @since 4.3.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is a set, else `false`.
* @example
*
* _.isSet(new Set);
* // => true
*
* _.isSet(new WeakSet);
* // => false
*/
var isSet = nodeIsSet ? baseUnary(nodeIsSet) : baseIsSet;
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseClone.js
/** Used to compose bitmasks for cloning. */
var CLONE_DEEP_FLAG$2 = 1, CLONE_FLAT_FLAG$1 = 2, CLONE_SYMBOLS_FLAG$2 = 4;
/** `Object#toString` result references. */
var argsTag$1 = "[object Arguments]", arrayTag$1 = "[object Array]", boolTag$1 = "[object Boolean]", dateTag$1 = "[object Date]", errorTag$1 = "[object Error]", funcTag = "[object Function]", genTag = "[object GeneratorFunction]", mapTag$1 = "[object Map]", numberTag$1 = "[object Number]", objectTag$1 = "[object Object]", regexpTag$1 = "[object RegExp]", setTag$1 = "[object Set]", stringTag$1 = "[object String]", symbolTag$1 = "[object Symbol]", weakMapTag = "[object WeakMap]";
var arrayBufferTag$1 = "[object ArrayBuffer]", dataViewTag$1 = "[object DataView]", float32Tag = "[object Float32Array]", float64Tag = "[object Float64Array]", int8Tag = "[object Int8Array]", int16Tag = "[object Int16Array]", int32Tag = "[object Int32Array]", uint8Tag = "[object Uint8Array]", uint8ClampedTag = "[object Uint8ClampedArray]", uint16Tag = "[object Uint16Array]", uint32Tag = "[object Uint32Array]";
/** Used to identify `toStringTag` values supported by `_.clone`. */
var cloneableTags = {};
cloneableTags[argsTag$1] = cloneableTags[arrayTag$1] = cloneableTags[arrayBufferTag$1] = cloneableTags[dataViewTag$1] = cloneableTags[boolTag$1] = cloneableTags[dateTag$1] = cloneableTags[float32Tag] = cloneableTags[float64Tag] = cloneableTags[int8Tag] = cloneableTags[int16Tag] = cloneableTags[int32Tag] = cloneableTags[mapTag$1] = cloneableTags[numberTag$1] = cloneableTags[objectTag$1] = cloneableTags[regexpTag$1] = cloneableTags[setTag$1] = cloneableTags[stringTag$1] = cloneableTags[symbolTag$1] = cloneableTags[uint8Tag] = cloneableTags[uint8ClampedTag] = cloneableTags[uint16Tag] = cloneableTags[uint32Tag] = true;
cloneableTags[errorTag$1] = cloneableTags[funcTag] = cloneableTags[weakMapTag] = false;
/**
* The base implementation of `_.clone` and `_.cloneDeep` which tracks
* traversed objects.
*
* @private
* @param {*} value The value to clone.
* @param {boolean} bitmask The bitmask flags.
* 1 - Deep clone
* 2 - Flatten inherited properties
* 4 - Clone symbols
* @param {Function} [customizer] The function to customize cloning.
* @param {string} [key] The key of `value`.
* @param {Object} [object] The parent object of `value`.
* @param {Object} [stack] Tracks traversed objects and their clone counterparts.
* @returns {*} Returns the cloned value.
*/
function baseClone(value, bitmask, customizer, key, object, stack) {
var result, isDeep = bitmask & CLONE_DEEP_FLAG$2, isFlat = bitmask & CLONE_FLAT_FLAG$1, isFull = bitmask & CLONE_SYMBOLS_FLAG$2;
if (customizer) result = object ? customizer(value, key, object, stack) : customizer(value);
if (result !== void 0) return result;
if (!isObject(value)) return value;
var isArr = isArray(value);
if (isArr) {
result = initCloneArray(value);
if (!isDeep) return copyArray(value, result);
} else {
var tag = _getTag_default(value), isFunc = tag == funcTag || tag == genTag;
if (isBuffer(value)) return cloneBuffer(value, isDeep);
if (tag == objectTag$1 || tag == argsTag$1 || isFunc && !object) {
result = isFlat || isFunc ? {} : initCloneObject(value);
if (!isDeep) return isFlat ? copySymbolsIn(value, baseAssignIn(result, value)) : copySymbols(value, baseAssign(result, value));
} else {
if (!cloneableTags[tag]) return object ? value : {};
result = initCloneByTag(value, tag, isDeep);
}
}
stack || (stack = new Stack());
var stacked = stack.get(value);
if (stacked) return stacked;
stack.set(value, result);
if (isSet(value)) value.forEach(function(subValue) {
result.add(baseClone(subValue, bitmask, customizer, subValue, value, stack));
});
else if (isMap(value)) value.forEach(function(subValue, key) {
result.set(key, baseClone(subValue, bitmask, customizer, key, value, stack));
});
var props = isArr ? void 0 : (isFull ? isFlat ? getAllKeysIn : getAllKeys : isFlat ? keysIn : keys)(value);
arrayEach(props || value, function(subValue, key) {
if (props) {
key = subValue;
subValue = value[key];
}
assignValue(result, key, baseClone(subValue, bitmask, customizer, key, value, stack));
});
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/cloneDeep.js
/** Used to compose bitmasks for cloning. */
var CLONE_DEEP_FLAG$1 = 1, CLONE_SYMBOLS_FLAG$1 = 4;
/**
* This method is like `_.clone` except that it recursively clones `value`.
*
* @static
* @memberOf _
* @since 1.0.0
* @category Lang
* @param {*} value The value to recursively clone.
* @returns {*} Returns the deep cloned value.
* @see _.clone
* @example
*
* var objects = [{ 'a': 1 }, { 'b': 2 }];
*
* var deep = _.cloneDeep(objects);
* console.log(deep[0] === objects[0]);
* // => false
*/
function cloneDeep(value) {
return baseClone(value, CLONE_DEEP_FLAG$1 | CLONE_SYMBOLS_FLAG$1);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_setCacheAdd.js
/** Used to stand-in for `undefined` hash values. */
var HASH_UNDEFINED = "__lodash_hash_undefined__";
/**
* Adds `value` to the array cache.
*
* @private
* @name add
* @memberOf SetCache
* @alias push
* @param {*} value The value to cache.
* @returns {Object} Returns the cache instance.
*/
function setCacheAdd(value) {
this.__data__.set(value, HASH_UNDEFINED);
return this;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_setCacheHas.js
/**
* Checks if `value` is in the array cache.
*
* @private
* @name has
* @memberOf SetCache
* @param {*} value The value to search for.
* @returns {number} Returns `true` if `value` is found, else `false`.
*/
function setCacheHas(value) {
return this.__data__.has(value);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_SetCache.js
/**
*
* Creates an array cache object to store unique values.
*
* @private
* @constructor
* @param {Array} [values] The values to cache.
*/
function SetCache(values) {
var index = -1, length = values == null ? 0 : values.length;
this.__data__ = new MapCache();
while (++index < length) this.add(values[index]);
}
SetCache.prototype.add = SetCache.prototype.push = setCacheAdd;
SetCache.prototype.has = setCacheHas;
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_arraySome.js
/**
* A specialized version of `_.some` for arrays without support for iteratee
* shorthands.
*
* @private
* @param {Array} [array] The array to iterate over.
* @param {Function} predicate The function invoked per iteration.
* @returns {boolean} Returns `true` if any element passes the predicate check,
* else `false`.
*/
function arraySome(array, predicate) {
var index = -1, length = array == null ? 0 : array.length;
while (++index < length) if (predicate(array[index], index, array)) return true;
return false;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_cacheHas.js
/**
* Checks if a `cache` value for `key` exists.
*
* @private
* @param {Object} cache The cache to query.
* @param {string} key The key of the entry to check.
* @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
*/
function cacheHas(cache, key) {
return cache.has(key);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_equalArrays.js
/** Used to compose bitmasks for value comparisons. */
var COMPARE_PARTIAL_FLAG$5 = 1, COMPARE_UNORDERED_FLAG$3 = 2;
/**
* A specialized version of `baseIsEqualDeep` for arrays with support for
* partial deep comparisons.
*
* @private
* @param {Array} array The array to compare.
* @param {Array} other The other array to compare.
* @param {number} bitmask The bitmask flags. See `baseIsEqual` for more details.
* @param {Function} customizer The function to customize comparisons.
* @param {Function} equalFunc The function to determine equivalents of values.
* @param {Object} stack Tracks traversed `array` and `other` objects.
* @returns {boolean} Returns `true` if the arrays are equivalent, else `false`.
*/
function equalArrays(array, other, bitmask, customizer, equalFunc, stack) {
var isPartial = bitmask & COMPARE_PARTIAL_FLAG$5, arrLength = array.length, othLength = other.length;
if (arrLength != othLength && !(isPartial && othLength > arrLength)) return false;
var arrStacked = stack.get(array);
var othStacked = stack.get(other);
if (arrStacked && othStacked) return arrStacked == other && othStacked == array;
var index = -1, result = true, seen = bitmask & COMPARE_UNORDERED_FLAG$3 ? new SetCache() : void 0;
stack.set(array, other);
stack.set(other, array);
while (++index < arrLength) {
var arrValue = array[index], othValue = other[index];
if (customizer) var compared = isPartial ? customizer(othValue, arrValue, index, other, array, stack) : customizer(arrValue, othValue, index, array, other, stack);
if (compared !== void 0) {
if (compared) continue;
result = false;
break;
}
if (seen) {
if (!arraySome(other, function(othValue, othIndex) {
if (!cacheHas(seen, othIndex) && (arrValue === othValue || equalFunc(arrValue, othValue, bitmask, customizer, stack))) return seen.push(othIndex);
})) {
result = false;
break;
}
} else if (!(arrValue === othValue || equalFunc(arrValue, othValue, bitmask, customizer, stack))) {
result = false;
break;
}
}
stack["delete"](array);
stack["delete"](other);
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_mapToArray.js
/**
* Converts `map` to its key-value pairs.
*
* @private
* @param {Object} map The map to convert.
* @returns {Array} Returns the key-value pairs.
*/
function mapToArray(map) {
var index = -1, result = Array(map.size);
map.forEach(function(value, key) {
result[++index] = [key, value];
});
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_setToArray.js
/**
* Converts `set` to an array of its values.
*
* @private
* @param {Object} set The set to convert.
* @returns {Array} Returns the values.
*/
function setToArray(set) {
var index = -1, result = Array(set.size);
set.forEach(function(value) {
result[++index] = value;
});
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_equalByTag.js
/** Used to compose bitmasks for value comparisons. */
var COMPARE_PARTIAL_FLAG$4 = 1, COMPARE_UNORDERED_FLAG$2 = 2;
/** `Object#toString` result references. */
var boolTag = "[object Boolean]", dateTag = "[object Date]", errorTag = "[object Error]", mapTag = "[object Map]", numberTag = "[object Number]", regexpTag = "[object RegExp]", setTag = "[object Set]", stringTag = "[object String]", symbolTag = "[object Symbol]";
var arrayBufferTag = "[object ArrayBuffer]", dataViewTag = "[object DataView]";
/** Used to convert symbols to primitives and strings. */
var symbolProto = Symbol$1 ? Symbol$1.prototype : void 0, symbolValueOf = symbolProto ? symbolProto.valueOf : void 0;
/**
* A specialized version of `baseIsEqualDeep` for comparing objects of
* the same `toStringTag`.
*
* **Note:** This function only supports comparing values with tags of
* `Boolean`, `Date`, `Error`, `Number`, `RegExp`, or `String`.
*
* @private
* @param {Object} object The object to compare.
* @param {Object} other The other object to compare.
* @param {string} tag The `toStringTag` of the objects to compare.
* @param {number} bitmask The bitmask flags. See `baseIsEqual` for more details.
* @param {Function} customizer The function to customize comparisons.
* @param {Function} equalFunc The function to determine equivalents of values.
* @param {Object} stack Tracks traversed `object` and `other` objects.
* @returns {boolean} Returns `true` if the objects are equivalent, else `false`.
*/
function equalByTag(object, other, tag, bitmask, customizer, equalFunc, stack) {
switch (tag) {
case dataViewTag:
if (object.byteLength != other.byteLength || object.byteOffset != other.byteOffset) return false;
object = object.buffer;
other = other.buffer;
case arrayBufferTag:
if (object.byteLength != other.byteLength || !equalFunc(new Uint8Array$1(object), new Uint8Array$1(other))) return false;
return true;
case boolTag:
case dateTag:
case numberTag: return eq(+object, +other);
case errorTag: return object.name == other.name && object.message == other.message;
case regexpTag:
case stringTag: return object == other + "";
case mapTag: var convert = mapToArray;
case setTag:
var isPartial = bitmask & COMPARE_PARTIAL_FLAG$4;
convert || (convert = setToArray);
if (object.size != other.size && !isPartial) return false;
var stacked = stack.get(object);
if (stacked) return stacked == other;
bitmask |= COMPARE_UNORDERED_FLAG$2;
stack.set(object, other);
var result = equalArrays(convert(object), convert(other), bitmask, customizer, equalFunc, stack);
stack["delete"](object);
return result;
case symbolTag: if (symbolValueOf) return symbolValueOf.call(object) == symbolValueOf.call(other);
}
return false;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_equalObjects.js
/** Used to compose bitmasks for value comparisons. */
var COMPARE_PARTIAL_FLAG$3 = 1;
/** Used to check objects for own properties. */
var hasOwnProperty$2 = Object.prototype.hasOwnProperty;
/**
* A specialized version of `baseIsEqualDeep` for objects with support for
* partial deep comparisons.
*
* @private
* @param {Object} object The object to compare.
* @param {Object} other The other object to compare.
* @param {number} bitmask The bitmask flags. See `baseIsEqual` for more details.
* @param {Function} customizer The function to customize comparisons.
* @param {Function} equalFunc The function to determine equivalents of values.
* @param {Object} stack Tracks traversed `object` and `other` objects.
* @returns {boolean} Returns `true` if the objects are equivalent, else `false`.
*/
function equalObjects(object, other, bitmask, customizer, equalFunc, stack) {
var isPartial = bitmask & COMPARE_PARTIAL_FLAG$3, objProps = getAllKeys(object), objLength = objProps.length;
if (objLength != getAllKeys(other).length && !isPartial) return false;
var index = objLength;
while (index--) {
var key = objProps[index];
if (!(isPartial ? key in other : hasOwnProperty$2.call(other, key))) return false;
}
var objStacked = stack.get(object);
var othStacked = stack.get(other);
if (objStacked && othStacked) return objStacked == other && othStacked == object;
var result = true;
stack.set(object, other);
stack.set(other, object);
var skipCtor = isPartial;
while (++index < objLength) {
key = objProps[index];
var objValue = object[key], othValue = other[key];
if (customizer) var compared = isPartial ? customizer(othValue, objValue, key, other, object, stack) : customizer(objValue, othValue, key, object, other, stack);
if (!(compared === void 0 ? objValue === othValue || equalFunc(objValue, othValue, bitmask, customizer, stack) : compared)) {
result = false;
break;
}
skipCtor || (skipCtor = key == "constructor");
}
if (result && !skipCtor) {
var objCtor = object.constructor, othCtor = other.constructor;
if (objCtor != othCtor && "constructor" in object && "constructor" in other && !(typeof objCtor == "function" && objCtor instanceof objCtor && typeof othCtor == "function" && othCtor instanceof othCtor)) result = false;
}
stack["delete"](object);
stack["delete"](other);
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseIsEqualDeep.js
/** Used to compose bitmasks for value comparisons. */
var COMPARE_PARTIAL_FLAG$2 = 1;
/** `Object#toString` result references. */
var argsTag = "[object Arguments]", arrayTag = "[object Array]", objectTag = "[object Object]";
/** Used to check objects for own properties. */
var hasOwnProperty$1 = Object.prototype.hasOwnProperty;
/**
* A specialized version of `baseIsEqual` for arrays and objects which performs
* deep comparisons and tracks traversed objects enabling objects with circular
* references to be compared.
*
* @private
* @param {Object} object The object to compare.
* @param {Object} other The other object to compare.
* @param {number} bitmask The bitmask flags. See `baseIsEqual` for more details.
* @param {Function} customizer The function to customize comparisons.
* @param {Function} equalFunc The function to determine equivalents of values.
* @param {Object} [stack] Tracks traversed `object` and `other` objects.
* @returns {boolean} Returns `true` if the objects are equivalent, else `false`.
*/
function baseIsEqualDeep(object, other, bitmask, customizer, equalFunc, stack) {
var objIsArr = isArray(object), othIsArr = isArray(other), objTag = objIsArr ? arrayTag : _getTag_default(object), othTag = othIsArr ? arrayTag : _getTag_default(other);
objTag = objTag == argsTag ? objectTag : objTag;
othTag = othTag == argsTag ? objectTag : othTag;
var objIsObj = objTag == objectTag, othIsObj = othTag == objectTag, isSameTag = objTag == othTag;
if (isSameTag && isBuffer(object)) {
if (!isBuffer(other)) return false;
objIsArr = true;
objIsObj = false;
}
if (isSameTag && !objIsObj) {
stack || (stack = new Stack());
return objIsArr || isTypedArray(object) ? equalArrays(object, other, bitmask, customizer, equalFunc, stack) : equalByTag(object, other, objTag, bitmask, customizer, equalFunc, stack);
}
if (!(bitmask & COMPARE_PARTIAL_FLAG$2)) {
var objIsWrapped = objIsObj && hasOwnProperty$1.call(object, "__wrapped__"), othIsWrapped = othIsObj && hasOwnProperty$1.call(other, "__wrapped__");
if (objIsWrapped || othIsWrapped) {
var objUnwrapped = objIsWrapped ? object.value() : object, othUnwrapped = othIsWrapped ? other.value() : other;
stack || (stack = new Stack());
return equalFunc(objUnwrapped, othUnwrapped, bitmask, customizer, stack);
}
}
if (!isSameTag) return false;
stack || (stack = new Stack());
return equalObjects(object, other, bitmask, customizer, equalFunc, stack);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseIsEqual.js
/**
* The base implementation of `_.isEqual` which supports partial comparisons
* and tracks traversed objects.
*
* @private
* @param {*} value The value to compare.
* @param {*} other The other value to compare.
* @param {boolean} bitmask The bitmask flags.
* 1 - Unordered comparison
* 2 - Partial comparison
* @param {Function} [customizer] The function to customize comparisons.
* @param {Object} [stack] Tracks traversed `value` and `other` objects.
* @returns {boolean} Returns `true` if the values are equivalent, else `false`.
*/
function baseIsEqual(value, other, bitmask, customizer, stack) {
if (value === other) return true;
if (value == null || other == null || !isObjectLike(value) && !isObjectLike(other)) return value !== value && other !== other;
return baseIsEqualDeep(value, other, bitmask, customizer, baseIsEqual, stack);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseIsMatch.js
/** Used to compose bitmasks for value comparisons. */
var COMPARE_PARTIAL_FLAG$1 = 1, COMPARE_UNORDERED_FLAG$1 = 2;
/**
* The base implementation of `_.isMatch` without support for iteratee shorthands.
*
* @private
* @param {Object} object The object to inspect.
* @param {Object} source The object of property values to match.
* @param {Array} matchData The property names, values, and compare flags to match.
* @param {Function} [customizer] The function to customize comparisons.
* @returns {boolean} Returns `true` if `object` is a match, else `false`.
*/
function baseIsMatch(object, source, matchData, customizer) {
var index = matchData.length, length = index, noCustomizer = !customizer;
if (object == null) return !length;
object = Object(object);
while (index--) {
var data = matchData[index];
if (noCustomizer && data[2] ? data[1] !== object[data[0]] : !(data[0] in object)) return false;
}
while (++index < length) {
data = matchData[index];
var key = data[0], objValue = object[key], srcValue = data[1];
if (noCustomizer && data[2]) {
if (objValue === void 0 && !(key in object)) return false;
} else {
var stack = new Stack();
if (customizer) var result = customizer(objValue, srcValue, key, object, source, stack);
if (!(result === void 0 ? baseIsEqual(srcValue, objValue, COMPARE_PARTIAL_FLAG$1 | COMPARE_UNORDERED_FLAG$1, customizer, stack) : result)) return false;
}
}
return true;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_isStrictComparable.js
/**
* Checks if `value` is suitable for strict equality comparisons, i.e. `===`.
*
* @private
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` if suitable for strict
* equality comparisons, else `false`.
*/
function isStrictComparable(value) {
return value === value && !isObject(value);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_getMatchData.js
/**
* Gets the property names, values, and compare flags of `object`.
*
* @private
* @param {Object} object The object to query.
* @returns {Array} Returns the match data of `object`.
*/
function getMatchData(object) {
var result = keys(object), length = result.length;
while (length--) {
var key = result[length], value = object[key];
result[length] = [
key,
value,
isStrictComparable(value)
];
}
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_matchesStrictComparable.js
/**
* A specialized version of `matchesProperty` for source values suitable
* for strict equality comparisons, i.e. `===`.
*
* @private
* @param {string} key The key of the property to get.
* @param {*} srcValue The value to match.
* @returns {Function} Returns the new spec function.
*/
function matchesStrictComparable(key, srcValue) {
return function(object) {
if (object == null) return false;
return object[key] === srcValue && (srcValue !== void 0 || key in Object(object));
};
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseMatches.js
/**
* The base implementation of `_.matches` which doesn't clone `source`.
*
* @private
* @param {Object} source The object of property values to match.
* @returns {Function} Returns the new spec function.
*/
function baseMatches(source) {
var matchData = getMatchData(source);
if (matchData.length == 1 && matchData[0][2]) return matchesStrictComparable(matchData[0][0], matchData[0][1]);
return function(object) {
return object === source || baseIsMatch(object, source, matchData);
};
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseHasIn.js
/**
* The base implementation of `_.hasIn` without support for deep paths.
*
* @private
* @param {Object} [object] The object to query.
* @param {Array|string} key The key to check.
* @returns {boolean} Returns `true` if `key` exists, else `false`.
*/
function baseHasIn(object, key) {
return object != null && key in Object(object);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_hasPath.js
/**
* Checks if `path` exists on `object`.
*
* @private
* @param {Object} object The object to query.
* @param {Array|string} path The path to check.
* @param {Function} hasFunc The function to check properties.
* @returns {boolean} Returns `true` if `path` exists, else `false`.
*/
function hasPath(object, path, hasFunc) {
path = castPath(path, object);
var index = -1, length = path.length, result = false;
while (++index < length) {
var key = toKey(path[index]);
if (!(result = object != null && hasFunc(object, key))) break;
object = object[key];
}
if (result || ++index != length) return result;
length = object == null ? 0 : object.length;
return !!length && isLength(length) && isIndex(key, length) && (isArray(object) || isArguments(object));
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/hasIn.js
/**
* Checks if `path` is a direct or inherited property of `object`.
*
* @static
* @memberOf _
* @since 4.0.0
* @category Object
* @param {Object} object The object to query.
* @param {Array|string} path The path to check.
* @returns {boolean} Returns `true` if `path` exists, else `false`.
* @example
*
* var object = _.create({ 'a': _.create({ 'b': 2 }) });
*
* _.hasIn(object, 'a');
* // => true
*
* _.hasIn(object, 'a.b');
* // => true
*
* _.hasIn(object, ['a', 'b']);
* // => true
*
* _.hasIn(object, 'b');
* // => false
*/
function hasIn(object, path) {
return object != null && hasPath(object, path, baseHasIn);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseMatchesProperty.js
/** Used to compose bitmasks for value comparisons. */
var COMPARE_PARTIAL_FLAG = 1, COMPARE_UNORDERED_FLAG = 2;
/**
* The base implementation of `_.matchesProperty` which doesn't clone `srcValue`.
*
* @private
* @param {string} path The path of the property to get.
* @param {*} srcValue The value to match.
* @returns {Function} Returns the new spec function.
*/
function baseMatchesProperty(path, srcValue) {
if (isKey(path) && isStrictComparable(srcValue)) return matchesStrictComparable(toKey(path), srcValue);
return function(object) {
var objValue = get(object, path);
return objValue === void 0 && objValue === srcValue ? hasIn(object, path) : baseIsEqual(srcValue, objValue, COMPARE_PARTIAL_FLAG | COMPARE_UNORDERED_FLAG);
};
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseProperty.js
/**
* The base implementation of `_.property` without support for deep paths.
*
* @private
* @param {string} key The key of the property to get.
* @returns {Function} Returns the new accessor function.
*/
function baseProperty(key) {
return function(object) {
return object == null ? void 0 : object[key];
};
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_basePropertyDeep.js
/**
* A specialized version of `baseProperty` which supports deep paths.
*
* @private
* @param {Array|string} path The path of the property to get.
* @returns {Function} Returns the new accessor function.
*/
function basePropertyDeep(path) {
return function(object) {
return baseGet(object, path);
};
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/property.js
/**
* Creates a function that returns the value at `path` of a given object.
*
* @static
* @memberOf _
* @since 2.4.0
* @category Util
* @param {Array|string} path The path of the property to get.
* @returns {Function} Returns the new accessor function.
* @example
*
* var objects = [
* { 'a': { 'b': 2 } },
* { 'a': { 'b': 1 } }
* ];
*
* _.map(objects, _.property('a.b'));
* // => [2, 1]
*
* _.map(_.sortBy(objects, _.property(['a', 'b'])), 'a.b');
* // => [1, 2]
*/
function property(path) {
return isKey(path) ? baseProperty(toKey(path)) : basePropertyDeep(path);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseIteratee.js
/**
* The base implementation of `_.iteratee`.
*
* @private
* @param {*} [value=_.identity] The value to convert to an iteratee.
* @returns {Function} Returns the iteratee.
*/
function baseIteratee(value) {
if (typeof value == "function") return value;
if (value == null) return identity;
if (typeof value == "object") return isArray(value) ? baseMatchesProperty(value[0], value[1]) : baseMatches(value);
return property(value);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_createBaseFor.js
/**
* Creates a base function for methods like `_.forIn` and `_.forOwn`.
*
* @private
* @param {boolean} [fromRight] Specify iterating from right to left.
* @returns {Function} Returns the new base function.
*/
function createBaseFor(fromRight) {
return function(object, iteratee, keysFunc) {
var index = -1, iterable = Object(object), props = keysFunc(object), length = props.length;
while (length--) {
var key = props[fromRight ? length : ++index];
if (iteratee(iterable[key], key, iterable) === false) break;
}
return object;
};
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseFor.js
/**
* The base implementation of `baseForOwn` which iterates over `object`
* properties returned by `keysFunc` and invokes `iteratee` for each property.
* Iteratee functions may exit iteration early by explicitly returning `false`.
*
* @private
* @param {Object} object The object to iterate over.
* @param {Function} iteratee The function invoked per iteration.
* @param {Function} keysFunc The function to get the keys of `object`.
* @returns {Object} Returns `object`.
*/
var baseFor = createBaseFor();
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseForOwn.js
/**
* The base implementation of `_.forOwn` without support for iteratee shorthands.
*
* @private
* @param {Object} object The object to iterate over.
* @param {Function} iteratee The function invoked per iteration.
* @returns {Object} Returns `object`.
*/
function baseForOwn(object, iteratee) {
return object && baseFor(object, iteratee, keys);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_createBaseEach.js
/**
* Creates a `baseEach` or `baseEachRight` function.
*
* @private
* @param {Function} eachFunc The function to iterate over a collection.
* @param {boolean} [fromRight] Specify iterating from right to left.
* @returns {Function} Returns the new base function.
*/
function createBaseEach(eachFunc, fromRight) {
return function(collection, iteratee) {
if (collection == null) return collection;
if (!isArrayLike(collection)) return eachFunc(collection, iteratee);
var length = collection.length, index = fromRight ? length : -1, iterable = Object(collection);
while (fromRight ? index-- : ++index < length) if (iteratee(iterable[index], index, iterable) === false) break;
return collection;
};
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseEach.js
/**
* The base implementation of `_.forEach` without support for iteratee shorthands.
*
* @private
* @param {Array|Object} collection The collection to iterate over.
* @param {Function} iteratee The function invoked per iteration.
* @returns {Array|Object} Returns `collection`.
*/
var baseEach = createBaseEach(baseForOwn);
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/now.js
/**
* Gets the timestamp of the number of milliseconds that have elapsed since
* the Unix epoch (1 January 1970 00:00:00 UTC).
*
* @static
* @memberOf _
* @since 2.4.0
* @category Date
* @returns {number} Returns the timestamp.
* @example
*
* _.defer(function(stamp) {
* console.log(_.now() - stamp);
* }, _.now());
* // => Logs the number of milliseconds it took for the deferred invocation.
*/
var now = function() {
return root.Date.now();
};
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/debounce.js
/** Error message constants. */
var FUNC_ERROR_TEXT$1 = "Expected a function";
var nativeMax$1 = Math.max, nativeMin$1 = Math.min;
/**
* Creates a debounced function that delays invoking `func` until after `wait`
* milliseconds have elapsed since the last time the debounced function was
* invoked. The debounced function comes with a `cancel` method to cancel
* delayed `func` invocations and a `flush` method to immediately invoke them.
* Provide `options` to indicate whether `func` should be invoked on the
* leading and/or trailing edge of the `wait` timeout. The `func` is invoked
* with the last arguments provided to the debounced function. Subsequent
* calls to the debounced function return the result of the last `func`
* invocation.
*
* **Note:** If `leading` and `trailing` options are `true`, `func` is
* invoked on the trailing edge of the timeout only if the debounced function
* is invoked more than once during the `wait` timeout.
*
* If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
* until to the next tick, similar to `setTimeout` with a timeout of `0`.
*
* See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
* for details over the differences between `_.debounce` and `_.throttle`.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Function
* @param {Function} func The function to debounce.
* @param {number} [wait=0] The number of milliseconds to delay.
* @param {Object} [options={}] The options object.
* @param {boolean} [options.leading=false]
* Specify invoking on the leading edge of the timeout.
* @param {number} [options.maxWait]
* The maximum time `func` is allowed to be delayed before it's invoked.
* @param {boolean} [options.trailing=true]
* Specify invoking on the trailing edge of the timeout.
* @returns {Function} Returns the new debounced function.
* @example
*
* // Avoid costly calculations while the window size is in flux.
* jQuery(window).on('resize', _.debounce(calculateLayout, 150));
*
* // Invoke `sendMail` when clicked, debouncing subsequent calls.
* jQuery(element).on('click', _.debounce(sendMail, 300, {
* 'leading': true,
* 'trailing': false
* }));
*
* // Ensure `batchLog` is invoked once after 1 second of debounced calls.
* var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });
* var source = new EventSource('/stream');
* jQuery(source).on('message', debounced);
*
* // Cancel the trailing debounced invocation.
* jQuery(window).on('popstate', debounced.cancel);
*/
function debounce(func, wait, options) {
var lastArgs, lastThis, maxWait, result, timerId, lastCallTime, lastInvokeTime = 0, leading = false, maxing = false, trailing = true;
if (typeof func != "function") throw new TypeError(FUNC_ERROR_TEXT$1);
wait = toNumber(wait) || 0;
if (isObject(options)) {
leading = !!options.leading;
maxing = "maxWait" in options;
maxWait = maxing ? nativeMax$1(toNumber(options.maxWait) || 0, wait) : maxWait;
trailing = "trailing" in options ? !!options.trailing : trailing;
}
function invokeFunc(time) {
var args = lastArgs, thisArg = lastThis;
lastArgs = lastThis = void 0;
lastInvokeTime = time;
result = func.apply(thisArg, args);
return result;
}
function leadingEdge(time) {
lastInvokeTime = time;
timerId = setTimeout(timerExpired, wait);
return leading ? invokeFunc(time) : result;
}
function remainingWait(time) {
var timeSinceLastCall = time - lastCallTime, timeSinceLastInvoke = time - lastInvokeTime, timeWaiting = wait - timeSinceLastCall;
return maxing ? nativeMin$1(timeWaiting, maxWait - timeSinceLastInvoke) : timeWaiting;
}
function shouldInvoke(time) {
var timeSinceLastCall = time - lastCallTime, timeSinceLastInvoke = time - lastInvokeTime;
return lastCallTime === void 0 || timeSinceLastCall >= wait || timeSinceLastCall < 0 || maxing && timeSinceLastInvoke >= maxWait;
}
function timerExpired() {
var time = now();
if (shouldInvoke(time)) return trailingEdge(time);
timerId = setTimeout(timerExpired, remainingWait(time));
}
function trailingEdge(time) {
timerId = void 0;
if (trailing && lastArgs) return invokeFunc(time);
lastArgs = lastThis = void 0;
return result;
}
function cancel() {
if (timerId !== void 0) clearTimeout(timerId);
lastInvokeTime = 0;
lastArgs = lastCallTime = lastThis = timerId = void 0;
}
function flush() {
return timerId === void 0 ? result : trailingEdge(now());
}
function debounced() {
var time = now(), isInvoking = shouldInvoke(time);
lastArgs = arguments;
lastThis = this;
lastCallTime = time;
if (isInvoking) {
if (timerId === void 0) return leadingEdge(lastCallTime);
if (maxing) {
clearTimeout(timerId);
timerId = setTimeout(timerExpired, wait);
return invokeFunc(lastCallTime);
}
}
if (timerId === void 0) timerId = setTimeout(timerExpired, wait);
return result;
}
debounced.cancel = cancel;
debounced.flush = flush;
return debounced;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_assignMergeValue.js
/**
* This function is like `assignValue` except that it doesn't assign
* `undefined` values.
*
* @private
* @param {Object} object The object to modify.
* @param {string} key The key of the property to assign.
* @param {*} value The value to assign.
*/
function assignMergeValue(object, key, value) {
if (value !== void 0 && !eq(object[key], value) || value === void 0 && !(key in object)) baseAssignValue(object, key, value);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/isArrayLikeObject.js
/**
* This method is like `_.isArrayLike` except that it also checks if `value`
* is an object.
*
* @static
* @memberOf _
* @since 4.0.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is an array-like object,
* else `false`.
* @example
*
* _.isArrayLikeObject([1, 2, 3]);
* // => true
*
* _.isArrayLikeObject(document.body.children);
* // => true
*
* _.isArrayLikeObject('abc');
* // => false
*
* _.isArrayLikeObject(_.noop);
* // => false
*/
function isArrayLikeObject(value) {
return isObjectLike(value) && isArrayLike(value);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_safeGet.js
/**
* Gets the value at `key`, unless `key` is "__proto__" or "constructor".
*
* @private
* @param {Object} object The object to query.
* @param {string} key The key of the property to get.
* @returns {*} Returns the property value.
*/
function safeGet(object, key) {
if (key === "constructor" && typeof object[key] === "function") return;
if (key == "__proto__") return;
return object[key];
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/toPlainObject.js
/**
* Converts `value` to a plain object flattening inherited enumerable string
* keyed properties of `value` to own properties of the plain object.
*
* @static
* @memberOf _
* @since 3.0.0
* @category Lang
* @param {*} value The value to convert.
* @returns {Object} Returns the converted plain object.
* @example
*
* function Foo() {
* this.b = 2;
* }
*
* Foo.prototype.c = 3;
*
* _.assign({ 'a': 1 }, new Foo);
* // => { 'a': 1, 'b': 2 }
*
* _.assign({ 'a': 1 }, _.toPlainObject(new Foo));
* // => { 'a': 1, 'b': 2, 'c': 3 }
*/
function toPlainObject(value) {
return copyObject(value, keysIn(value));
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseMergeDeep.js
/**
* A specialized version of `baseMerge` for arrays and objects which performs
* deep merges and tracks traversed objects enabling objects with circular
* references to be merged.
*
* @private
* @param {Object} object The destination object.
* @param {Object} source The source object.
* @param {string} key The key of the value to merge.
* @param {number} srcIndex The index of `source`.
* @param {Function} mergeFunc The function to merge values.
* @param {Function} [customizer] The function to customize assigned values.
* @param {Object} [stack] Tracks traversed source values and their merged
* counterparts.
*/
function baseMergeDeep(object, source, key, srcIndex, mergeFunc, customizer, stack) {
var objValue = safeGet(object, key), srcValue = safeGet(source, key), stacked = stack.get(srcValue);
if (stacked) {
assignMergeValue(object, key, stacked);
return;
}
var newValue = customizer ? customizer(objValue, srcValue, key + "", object, source, stack) : void 0;
var isCommon = newValue === void 0;
if (isCommon) {
var isArr = isArray(srcValue), isBuff = !isArr && isBuffer(srcValue), isTyped = !isArr && !isBuff && isTypedArray(srcValue);
newValue = srcValue;
if (isArr || isBuff || isTyped) if (isArray(objValue)) newValue = objValue;
else if (isArrayLikeObject(objValue)) newValue = copyArray(objValue);
else if (isBuff) {
isCommon = false;
newValue = cloneBuffer(srcValue, true);
} else if (isTyped) {
isCommon = false;
newValue = cloneTypedArray(srcValue, true);
} else newValue = [];
else if (isPlainObject(srcValue) || isArguments(srcValue)) {
newValue = objValue;
if (isArguments(objValue)) newValue = toPlainObject(objValue);
else if (!isObject(objValue) || isFunction(objValue)) newValue = initCloneObject(srcValue);
} else isCommon = false;
}
if (isCommon) {
stack.set(srcValue, newValue);
mergeFunc(newValue, srcValue, srcIndex, customizer, stack);
stack["delete"](srcValue);
}
assignMergeValue(object, key, newValue);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseMerge.js
/**
* The base implementation of `_.merge` without support for multiple sources.
*
* @private
* @param {Object} object The destination object.
* @param {Object} source The source object.
* @param {number} srcIndex The index of `source`.
* @param {Function} [customizer] The function to customize merged values.
* @param {Object} [stack] Tracks traversed source values and their merged
* counterparts.
*/
function baseMerge(object, source, srcIndex, customizer, stack) {
if (object === source) return;
baseFor(source, function(srcValue, key) {
stack || (stack = new Stack());
if (isObject(srcValue)) baseMergeDeep(object, source, key, srcIndex, baseMerge, customizer, stack);
else {
var newValue = customizer ? customizer(safeGet(object, key), srcValue, key + "", object, source, stack) : void 0;
if (newValue === void 0) newValue = srcValue;
assignMergeValue(object, key, newValue);
}
}, keysIn);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_arrayIncludesWith.js
/**
* This function is like `arrayIncludes` except that it accepts a comparator.
*
* @private
* @param {Array} [array] The array to inspect.
* @param {*} target The value to search for.
* @param {Function} comparator The comparator invoked per element.
* @returns {boolean} Returns `true` if `target` is found, else `false`.
*/
function arrayIncludesWith(array, value, comparator) {
var index = -1, length = array == null ? 0 : array.length;
while (++index < length) if (comparator(value, array[index])) return true;
return false;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/last.js
/**
* Gets the last element of `array`.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Array
* @param {Array} array The array to query.
* @returns {*} Returns the last element of `array`.
* @example
*
* _.last([1, 2, 3]);
* // => 3
*/
function last(array) {
var length = array == null ? 0 : array.length;
return length ? array[length - 1] : void 0;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/findLastIndex.js
var nativeMax = Math.max, nativeMin = Math.min;
/**
* This method is like `_.findIndex` except that it iterates over elements
* of `collection` from right to left.
*
* @static
* @memberOf _
* @since 2.0.0
* @category Array
* @param {Array} array The array to inspect.
* @param {Function} [predicate=_.identity] The function invoked per iteration.
* @param {number} [fromIndex=array.length-1] The index to search from.
* @returns {number} Returns the index of the found element, else `-1`.
* @example
*
* var users = [
* { 'user': 'barney', 'active': true },
* { 'user': 'fred', 'active': false },
* { 'user': 'pebbles', 'active': false }
* ];
*
* _.findLastIndex(users, function(o) { return o.user == 'pebbles'; });
* // => 2
*
* // The `_.matches` iteratee shorthand.
* _.findLastIndex(users, { 'user': 'barney', 'active': true });
* // => 0
*
* // The `_.matchesProperty` iteratee shorthand.
* _.findLastIndex(users, ['active', false]);
* // => 2
*
* // The `_.property` iteratee shorthand.
* _.findLastIndex(users, 'active');
* // => 0
*/
function findLastIndex(array, predicate, fromIndex) {
var length = array == null ? 0 : array.length;
if (!length) return -1;
var index = length - 1;
if (fromIndex !== void 0) {
index = toInteger(fromIndex);
index = fromIndex < 0 ? nativeMax(length + index, 0) : nativeMin(index, length - 1);
}
return baseFindIndex(array, baseIteratee(predicate, 3), index, true);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseMap.js
/**
* The base implementation of `_.map` without support for iteratee shorthands.
*
* @private
* @param {Array|Object} collection The collection to iterate over.
* @param {Function} iteratee The function invoked per iteration.
* @returns {Array} Returns the new mapped array.
*/
function baseMap(collection, iteratee) {
var index = -1, result = isArrayLike(collection) ? Array(collection.length) : [];
baseEach(collection, function(value, key, collection) {
result[++index] = iteratee(value, key, collection);
});
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/map.js
/**
* Creates an array of values by running each element in `collection` thru
* `iteratee`. The iteratee is invoked with three arguments:
* (value, index|key, collection).
*
* Many lodash methods are guarded to work as iteratees for methods like
* `_.every`, `_.filter`, `_.map`, `_.mapValues`, `_.reject`, and `_.some`.
*
* The guarded methods are:
* `ary`, `chunk`, `curry`, `curryRight`, `drop`, `dropRight`, `every`,
* `fill`, `invert`, `parseInt`, `random`, `range`, `rangeRight`, `repeat`,
* `sampleSize`, `slice`, `some`, `sortBy`, `split`, `take`, `takeRight`,
* `template`, `trim`, `trimEnd`, `trimStart`, and `words`
*
* @static
* @memberOf _
* @since 0.1.0
* @category Collection
* @param {Array|Object} collection The collection to iterate over.
* @param {Function} [iteratee=_.identity] The function invoked per iteration.
* @returns {Array} Returns the new mapped array.
* @example
*
* function square(n) {
* return n * n;
* }
*
* _.map([4, 8], square);
* // => [16, 64]
*
* _.map({ 'a': 4, 'b': 8 }, square);
* // => [16, 64] (iteration order is not guaranteed)
*
* var users = [
* { 'user': 'barney' },
* { 'user': 'fred' }
* ];
*
* // The `_.property` iteratee shorthand.
* _.map(users, 'user');
* // => ['barney', 'fred']
*/
function map(collection, iteratee) {
return (isArray(collection) ? arrayMap : baseMap)(collection, baseIteratee(iteratee, 3));
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/flatMap.js
/**
* Creates a flattened array of values by running each element in `collection`
* thru `iteratee` and flattening the mapped results. The iteratee is invoked
* with three arguments: (value, index|key, collection).
*
* @static
* @memberOf _
* @since 4.0.0
* @category Collection
* @param {Array|Object} collection The collection to iterate over.
* @param {Function} [iteratee=_.identity] The function invoked per iteration.
* @returns {Array} Returns the new flattened array.
* @example
*
* function duplicate(n) {
* return [n, n];
* }
*
* _.flatMap([1, 2], duplicate);
* // => [1, 1, 2, 2]
*/
function flatMap(collection, iteratee) {
return baseFlatten(map(collection, iteratee), 1);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/flattenDeep.js
/** Used as references for various `Number` constants. */
var INFINITY = Infinity;
/**
* Recursively flattens `array`.
*
* @static
* @memberOf _
* @since 3.0.0
* @category Array
* @param {Array} array The array to flatten.
* @returns {Array} Returns the new flattened array.
* @example
*
* _.flattenDeep([1, [2, [3, [4]], 5]]);
* // => [1, 2, 3, 4, 5]
*/
function flattenDeep(array) {
return (array == null ? 0 : array.length) ? baseFlatten(array, INFINITY) : [];
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/fromPairs.js
/**
* The inverse of `_.toPairs`; this method returns an object composed
* from key-value `pairs`.
*
* @static
* @memberOf _
* @since 4.0.0
* @category Array
* @param {Array} pairs The key-value pairs.
* @returns {Object} Returns the new object.
* @example
*
* _.fromPairs([['a', 1], ['b', 2]]);
* // => { 'a': 1, 'b': 2 }
*/
function fromPairs(pairs) {
var index = -1, length = pairs == null ? 0 : pairs.length, result = {};
while (++index < length) {
var pair = pairs[index];
result[pair[0]] = pair[1];
}
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_parent.js
/**
* Gets the parent value at `path` of `object`.
*
* @private
* @param {Object} object The object to query.
* @param {Array} path The path to get the parent value of.
* @returns {*} Returns the parent value.
*/
function parent(object, path) {
return path.length < 2 ? object : baseGet(object, baseSlice(path, 0, -1));
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/isEqual.js
/**
* Performs a deep comparison between two values to determine if they are
* equivalent.
*
* **Note:** This method supports comparing arrays, array buffers, booleans,
* date objects, error objects, maps, numbers, `Object` objects, regexes,
* sets, strings, symbols, and typed arrays. `Object` objects are compared
* by their own, not inherited, enumerable properties. Functions and DOM
* nodes are compared by strict equality, i.e. `===`.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Lang
* @param {*} value The value to compare.
* @param {*} other The other value to compare.
* @returns {boolean} Returns `true` if the values are equivalent, else `false`.
* @example
*
* var object = { 'a': 1 };
* var other = { 'a': 1 };
*
* _.isEqual(object, other);
* // => true
*
* object === other;
* // => false
*/
function isEqual$1(value, other) {
return baseIsEqual(value, other);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/isNil.js
/**
* Checks if `value` is `null` or `undefined`.
*
* @static
* @memberOf _
* @since 4.0.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is nullish, else `false`.
* @example
*
* _.isNil(null);
* // => true
*
* _.isNil(void 0);
* // => true
*
* _.isNil(NaN);
* // => false
*/
function isNil(value) {
return value == null;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/isNull.js
/**
* Checks if `value` is `null`.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is `null`, else `false`.
* @example
*
* _.isNull(null);
* // => true
*
* _.isNull(void 0);
* // => false
*/
function isNull(value) {
return value === null;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/isUndefined.js
/**
* Checks if `value` is `undefined`.
*
* @static
* @since 0.1.0
* @memberOf _
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is `undefined`, else `false`.
* @example
*
* _.isUndefined(void 0);
* // => true
*
* _.isUndefined(null);
* // => false
*/
function isUndefined$1(value) {
return value === void 0;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/merge.js
/**
* This method is like `_.assign` except that it recursively merges own and
* inherited enumerable string keyed properties of source objects into the
* destination object. Source properties that resolve to `undefined` are
* skipped if a destination value exists. Array and plain object properties
* are merged recursively. Other objects and value types are overridden by
* assignment. Source objects are applied from left to right. Subsequent
* sources overwrite property assignments of previous sources.
*
* **Note:** This method mutates `object`.
*
* @static
* @memberOf _
* @since 0.5.0
* @category Object
* @param {Object} object The destination object.
* @param {...Object} [sources] The source objects.
* @returns {Object} Returns `object`.
* @example
*
* var object = {
* 'a': [{ 'b': 2 }, { 'd': 4 }]
* };
*
* var other = {
* 'a': [{ 'c': 3 }, { 'e': 5 }]
* };
*
* _.merge(object, other);
* // => { 'a': [{ 'b': 2, 'c': 3 }, { 'd': 4, 'e': 5 }] }
*/
var merge = createAssigner(function(object, source, srcIndex) {
baseMerge(object, source, srcIndex);
});
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseUnset.js
/** Used to check objects for own properties. */
var hasOwnProperty = Object.prototype.hasOwnProperty;
/**
* The base implementation of `_.unset`.
*
* @private
* @param {Object} object The object to modify.
* @param {Array|string} path The property path to unset.
* @returns {boolean} Returns `true` if the property is deleted, else `false`.
*/
function baseUnset(object, path) {
path = castPath(path, object);
var index = -1, length = path.length;
if (!length) return true;
var isRootPrimitive = object == null || typeof object !== "object" && typeof object !== "function";
while (++index < length) {
var key = path[index];
if (typeof key !== "string") continue;
if (key === "__proto__" && !hasOwnProperty.call(object, "__proto__")) return false;
if (key === "constructor" && index + 1 < length && typeof path[index + 1] === "string" && path[index + 1] === "prototype") {
if (isRootPrimitive && index === 0) continue;
return false;
}
}
var obj = parent(object, path);
return obj == null || delete obj[toKey(last(path))];
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_customOmitClone.js
/**
* Used by `_.omit` to customize its `_.cloneDeep` use to only clone plain
* objects.
*
* @private
* @param {*} value The value to inspect.
* @param {string} key The key of the property to inspect.
* @returns {*} Returns the uncloned value or `undefined` to defer cloning to `_.cloneDeep`.
*/
function customOmitClone(value) {
return isPlainObject(value) ? void 0 : value;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/omit.js
/** Used to compose bitmasks for cloning. */
var CLONE_DEEP_FLAG = 1, CLONE_FLAT_FLAG = 2, CLONE_SYMBOLS_FLAG = 4;
/**
* The opposite of `_.pick`; this method creates an object composed of the
* own and inherited enumerable property paths of `object` that are not omitted.
*
* **Note:** This method is considerably slower than `_.pick`.
*
* @static
* @since 0.1.0
* @memberOf _
* @category Object
* @param {Object} object The source object.
* @param {...(string|string[])} [paths] The property paths to omit.
* @returns {Object} Returns the new object.
* @example
*
* var object = { 'a': 1, 'b': '2', 'c': 3 };
*
* _.omit(object, ['a', 'c']);
* // => { 'b': '2' }
*/
var omit = flatRest(function(object, paths) {
var result = {};
if (object == null) return result;
var isDeep = false;
paths = arrayMap(paths, function(path) {
path = castPath(path, object);
isDeep || (isDeep = path.length > 1);
return path;
});
copyObject(object, getAllKeysIn(object), result);
if (isDeep) result = baseClone(result, CLONE_DEEP_FLAG | CLONE_FLAT_FLAG | CLONE_SYMBOLS_FLAG, customOmitClone);
var length = paths.length;
while (length--) baseUnset(result, paths[length]);
return result;
});
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseSet.js
/**
* The base implementation of `_.set`.
*
* @private
* @param {Object} object The object to modify.
* @param {Array|string} path The path of the property to set.
* @param {*} value The value to set.
* @param {Function} [customizer] The function to customize path creation.
* @returns {Object} Returns `object`.
*/
function baseSet(object, path, value, customizer) {
if (!isObject(object)) return object;
path = castPath(path, object);
var index = -1, length = path.length, lastIndex = length - 1, nested = object;
while (nested != null && ++index < length) {
var key = toKey(path[index]), newValue = value;
if (key === "__proto__" || key === "constructor" || key === "prototype") return object;
if (index != lastIndex) {
var objValue = nested[key];
newValue = customizer ? customizer(objValue, key, nested) : void 0;
if (newValue === void 0) newValue = isObject(objValue) ? objValue : isIndex(path[index + 1]) ? [] : {};
}
assignValue(nested, key, newValue);
nested = nested[key];
}
return object;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_basePickBy.js
/**
* The base implementation of `_.pickBy` without support for iteratee shorthands.
*
* @private
* @param {Object} object The source object.
* @param {string[]} paths The property paths to pick.
* @param {Function} predicate The function invoked per property.
* @returns {Object} Returns the new object.
*/
function basePickBy(object, paths, predicate) {
var index = -1, length = paths.length, result = {};
while (++index < length) {
var path = paths[index], value = baseGet(object, path);
if (predicate(value, path)) baseSet(result, castPath(path, object), value);
}
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_basePick.js
/**
* The base implementation of `_.pick` without support for individual
* property identifiers.
*
* @private
* @param {Object} object The source object.
* @param {string[]} paths The property paths to pick.
* @returns {Object} Returns the new object.
*/
function basePick(object, paths) {
return basePickBy(object, paths, function(value, path) {
return hasIn(object, path);
});
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/pick.js
/**
* Creates an object composed of the picked `object` properties.
*
* @static
* @since 0.1.0
* @memberOf _
* @category Object
* @param {Object} object The source object.
* @param {...(string|string[])} [paths] The property paths to pick.
* @returns {Object} Returns the new object.
* @example
*
* var object = { 'a': 1, 'b': '2', 'c': 3 };
*
* _.pick(object, ['a', 'c']);
* // => { 'a': 1, 'c': 3 }
*/
var pick = flatRest(function(object, paths) {
return object == null ? {} : basePick(object, paths);
});
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/set.js
/**
* Sets the value at `path` of `object`. If a portion of `path` doesn't exist,
* it's created. Arrays are created for missing index properties while objects
* are created for all other missing properties. Use `_.setWith` to customize
* `path` creation.
*
* **Note:** This method mutates `object`.
*
* @static
* @memberOf _
* @since 3.7.0
* @category Object
* @param {Object} object The object to modify.
* @param {Array|string} path The path of the property to set.
* @param {*} value The value to set.
* @returns {Object} Returns `object`.
* @example
*
* var object = { 'a': [{ 'b': { 'c': 3 } }] };
*
* _.set(object, 'a[0].b.c', 4);
* console.log(object.a[0].b.c);
* // => 4
*
* _.set(object, ['x', '0', 'y', 'z'], 5);
* console.log(object.x[0].y.z);
* // => 5
*/
function set(object, path, value) {
return object == null ? object : baseSet(object, path, value);
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/throttle.js
/** Error message constants. */
var FUNC_ERROR_TEXT = "Expected a function";
/**
* Creates a throttled function that only invokes `func` at most once per
* every `wait` milliseconds. The throttled function comes with a `cancel`
* method to cancel delayed `func` invocations and a `flush` method to
* immediately invoke them. Provide `options` to indicate whether `func`
* should be invoked on the leading and/or trailing edge of the `wait`
* timeout. The `func` is invoked with the last arguments provided to the
* throttled function. Subsequent calls to the throttled function return the
* result of the last `func` invocation.
*
* **Note:** If `leading` and `trailing` options are `true`, `func` is
* invoked on the trailing edge of the timeout only if the throttled function
* is invoked more than once during the `wait` timeout.
*
* If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
* until to the next tick, similar to `setTimeout` with a timeout of `0`.
*
* See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
* for details over the differences between `_.throttle` and `_.debounce`.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Function
* @param {Function} func The function to throttle.
* @param {number} [wait=0] The number of milliseconds to throttle invocations to.
* @param {Object} [options={}] The options object.
* @param {boolean} [options.leading=true]
* Specify invoking on the leading edge of the timeout.
* @param {boolean} [options.trailing=true]
* Specify invoking on the trailing edge of the timeout.
* @returns {Function} Returns the new throttled function.
* @example
*
* // Avoid excessively updating the position while scrolling.
* jQuery(window).on('scroll', _.throttle(updatePosition, 100));
*
* // Invoke `renewToken` when the click event is fired, but not more than once every 5 minutes.
* var throttled = _.throttle(renewToken, 300000, { 'trailing': false });
* jQuery(element).on('click', throttled);
*
* // Cancel the trailing throttled invocation.
* jQuery(window).on('popstate', throttled.cancel);
*/
function throttle(func, wait, options) {
var leading = true, trailing = true;
if (typeof func != "function") throw new TypeError(FUNC_ERROR_TEXT);
if (isObject(options)) {
leading = "leading" in options ? !!options.leading : leading;
trailing = "trailing" in options ? !!options.trailing : trailing;
}
return debounce(func, wait, {
"leading": leading,
"maxWait": wait,
"trailing": trailing
});
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_createSet.js
/**
* Creates a set object of `values`.
*
* @private
* @param {Array} values The values to add to the set.
* @returns {Object} Returns the new set.
*/
var createSet = !(Set$1 && 1 / setToArray(new Set$1([, -0]))[1] == Infinity) ? noop : function(values) {
return new Set$1(values);
};
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/_baseUniq.js
/** Used as the size to enable large array optimizations. */
var LARGE_ARRAY_SIZE = 200;
/**
* The base implementation of `_.uniqBy` without support for iteratee shorthands.
*
* @private
* @param {Array} array The array to inspect.
* @param {Function} [iteratee] The iteratee invoked per element.
* @param {Function} [comparator] The comparator invoked per element.
* @returns {Array} Returns the new duplicate free array.
*/
function baseUniq(array, iteratee, comparator) {
var index = -1, includes = arrayIncludes, length = array.length, isCommon = true, result = [], seen = result;
if (comparator) {
isCommon = false;
includes = arrayIncludesWith;
} else if (length >= LARGE_ARRAY_SIZE) {
var set = iteratee ? null : createSet(array);
if (set) return setToArray(set);
isCommon = false;
includes = cacheHas;
seen = new SetCache();
} else seen = iteratee ? [] : result;
outer: while (++index < length) {
var value = array[index], computed = iteratee ? iteratee(value) : value;
value = comparator || value !== 0 ? value : 0;
if (isCommon && computed === computed) {
var seenIndex = seen.length;
while (seenIndex--) if (seen[seenIndex] === computed) continue outer;
if (iteratee) seen.push(computed);
result.push(value);
} else if (!includes(seen, computed, comparator)) {
if (seen !== result) seen.push(computed);
result.push(value);
}
}
return result;
}
//#endregion
//#region ../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/union.js
/**
* Creates an array of unique values, in order, from all given arrays using
* [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
* for equality comparisons.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Array
* @param {...Array} [arrays] The arrays to inspect.
* @returns {Array} Returns the new array of combined values.
* @example
*
* _.union([2], [1, 2]);
* // => [2, 1]
*/
var union = baseRest(function(arrays) {
return baseUniq(baseFlatten(arrays, 1, isArrayLikeObject, true));
});
//#endregion
//#region ../../packages/utils/types.ts
const isUndefined = (val) => val === void 0;
const isBoolean = (val) => typeof val === "boolean";
const isNumber = (val) => typeof val === "number";
const isEmpty = (val) => !val && val !== 0 || isArray$1(val) && val.length === 0 || isObject$1(val) && !Object.keys(val).length;
const isElement$1 = (e) => {
if (typeof Element === "undefined") return false;
return e instanceof Element;
};
const isPropAbsent = (prop) => isNil(prop);
const isStringNumber = (val) => {
if (!isString(val)) return false;
return !Number.isNaN(Number(val));
};
const isWindow = (val) => val === window;
//#endregion
//#region ../../packages/utils/raf.ts
const rAF = (fn) => isClient ? window.requestAnimationFrame(fn) : setTimeout(fn, 16);
const cAF = (handle) => isClient ? window.cancelAnimationFrame(handle) : clearTimeout(handle);
//#endregion
//#region ../../packages/utils/strings.ts
/**
* fork from {@link https://github.com/sindresorhus/escape-string-regexp}
*/
const escapeStringRegexp = (string = "") => string.replace(/[|\\{}()[\]^$+*?.]/g, "\\$&").replace(/-/g, "\\x2d");
const capitalize = (str) => capitalize$1(str);
//#endregion
//#region ../../packages/utils/objects.ts
const keysOf = (arr) => Object.keys(arr);
const entriesOf = (arr) => Object.entries(arr);
const getProp = (obj, path, defaultValue) => {
return {
get value() {
return get(obj, path, defaultValue);
},
set value(val) {
set(obj, path, val);
}
};
};
//#endregion
//#region ../../packages/utils/error.ts
var ElementPlusError = class extends Error {
constructor(m) {
super(m);
this.name = "ElementPlusError";
}
};
function throwError(scope, m) {
throw new ElementPlusError(`[${scope}] ${m}`);
}
function debugWarn(scope, message) {}
//#endregion
//#region ../../packages/utils/dom/style.ts
const SCOPE$9 = "utils/dom/style";
const classNameToArray = (cls = "") => cls.split(" ").filter((item) => !!item.trim());
const hasClass = (el, cls) => {
if (!el || !cls) return false;
if (cls.includes(" ")) throw new Error("className should not contain space.");
return el.classList.contains(cls);
};
const addClass = (el, cls) => {
if (!el || !cls.trim()) return;
el.classList.add(...classNameToArray(cls));
};
const removeClass = (el, cls) => {
if (!el || !cls.trim()) return;
el.classList.remove(...classNameToArray(cls));
};
const getStyle = (element, styleName) => {
if (!isClient || !element || !styleName || isShadowRoot$1(element)) return "";
let key = camelize(styleName);
if (key === "float") key = "cssFloat";
try {
const style = element.style[key];
if (style) return style;
const computed = document.defaultView?.getComputedStyle(element, "");
return computed ? computed[key] : "";
} catch {
return element.style[key];
}
};
const setStyle = (element, styleName, value) => {
if (!element || !styleName) return;
if (isObject$1(styleName)) entriesOf(styleName).forEach(([prop, value]) => setStyle(element, prop, value));
else {
const key = camelize(styleName);
element.style[key] = value;
}
};
function addUnit(value, defaultUnit = "px") {
if (!value && value !== 0) return "";
if (isNumber(value) || isStringNumber(value)) return `${value}${defaultUnit}`;
else if (isString(value)) return value;
/* @__PURE__ */ debugWarn(SCOPE$9, "binding value must be a string or number");
}
//#endregion
//#region ../../packages/utils/dom/scroll.ts
const isScroll = (el, isVertical) => {
if (!isClient) return false;
const key = {
undefined: "overflow",
true: "overflow-y",
false: "overflow-x"
}[String(isVertical)];
const overflow = getStyle(el, key);
return [
"scroll",
"auto",
"overlay"
].some((s) => overflow.includes(s));
};
const getScrollContainer = (el, isVertical) => {
if (!isClient) return;
let parent = el;
while (parent) {
if ([
window,
document,
document.documentElement
].includes(parent)) return window;
if (isScroll(parent, isVertical)) return parent;
if (isShadowRoot$1(parent)) parent = parent.host;
else parent = parent.parentNode;
}
return parent;
};
let scrollBarWidth;
const getScrollBarWidth = (namespace) => {
if (!isClient) return 0;
if (scrollBarWidth !== void 0) return scrollBarWidth;
const outer = document.createElement("div");
outer.className = `${namespace}-scrollbar__wrap`;
outer.style.visibility = "hidden";
outer.style.width = "100px";
outer.style.position = "absolute";
outer.style.top = "-9999px";
document.body.appendChild(outer);
const widthNoScroll = outer.offsetWidth;
outer.style.overflow = "scroll";
const inner = document.createElement("div");
inner.style.width = "100%";
outer.appendChild(inner);
const widthWithScroll = inner.offsetWidth;
outer.parentNode?.removeChild(outer);
scrollBarWidth = widthNoScroll - widthWithScroll;
return scrollBarWidth;
};
/**
* Scroll with in the container element, positioning the **selected** element at the top
* of the container
*/
function scrollIntoView(container, selected) {
if (!isClient) return;
if (!selected) {
container.scrollTop = 0;
return;
}
const offsetParents = [];
let pointer = selected.offsetParent;
while (pointer !== null && container !== pointer && container.contains(pointer)) {
offsetParents.push(pointer);
pointer = pointer.offsetParent;
}
const top = selected.offsetTop + offsetParents.reduce((prev, curr) => prev + curr.offsetTop, 0);
const bottom = top + selected.offsetHeight;
const viewRectTop = container.scrollTop;
const viewRectBottom = viewRectTop + container.clientHeight;
if (top < viewRectTop) container.scrollTop = top;
else if (bottom > viewRectBottom) container.scrollTop = bottom - container.clientHeight;
}
function animateScrollTo(container, from, to, duration, callback) {
const startTime = Date.now();
let handle;
const scroll = () => {
const time = Date.now() - startTime;
const nextScrollTop = easeInOutCubic(time > duration ? duration : time, from, to, duration);
if (isWindow(container)) container.scrollTo(window.pageXOffset, nextScrollTop);
else container.scrollTop = nextScrollTop;
if (time < duration) handle = rAF(scroll);
else if (isFunction$1(callback)) callback();
};
scroll();
return () => {
handle && cAF(handle);
};
}
const getScrollElement = (target, container) => {
if (isWindow(container)) return target.ownerDocument.documentElement;
return container;
};
const getScrollTop = (container) => {
if (isWindow(container)) return window.scrollY;
return container.scrollTop;
};
//#endregion
//#region ../../packages/utils/dom/element.ts
const getElement = ((target) => {
if (!isClient || target === "") return null;
if (isString(target)) try {
return document.querySelector(target);
} catch {
return null;
}
return target;
});
//#endregion
//#region ../../packages/utils/vue/global-node.ts
const globalNodes = [];
let target = !isClient ? void 0 : document.body;
function createGlobalNode(id) {
const el = document.createElement("div");
if (id !== void 0) el.setAttribute("id", id);
if (target) {
target.appendChild(el);
globalNodes.push(el);
}
return el;
}
function removeGlobalNode(el) {
globalNodes.splice(globalNodes.indexOf(el), 1);
el.remove();
}
//#endregion
//#region ../../node_modules/.pnpm/@element-plus+icons-vue@2.3.2_vue@3.5.25/node_modules/@element-plus/icons-vue/dist/index.js
/*! Element Plus Icons Vue v2.3.2 */
var arrow_down_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ArrowDown",
__name: "arrow-down",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M831.872 340.864 512 652.672 192.128 340.864a30.59 30.59 0 0 0-42.752 0 29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728 30.59 30.59 0 0 0-42.752 0z"
})]));
}
});
var arrow_left_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ArrowLeft",
__name: "arrow-left",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.59 30.59 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.59 30.59 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0"
})]));
}
});
var arrow_right_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ArrowRight",
__name: "arrow-right",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M340.864 149.312a30.59 30.59 0 0 0 0 42.752L652.736 512 340.864 831.872a30.59 30.59 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"
})]));
}
});
var arrow_up_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ArrowUp",
__name: "arrow-up",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "m488.832 344.32-339.84 356.672a32 32 0 0 0 0 44.16l.384.384a29.44 29.44 0 0 0 42.688 0l320-335.872 319.872 335.872a29.44 29.44 0 0 0 42.688 0l.384-.384a32 32 0 0 0 0-44.16L535.168 344.32a32 32 0 0 0-46.336 0"
})]));
}
});
var back_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "Back",
__name: "back",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M224 480h640a32 32 0 1 1 0 64H224a32 32 0 0 1 0-64"
}), (0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "m237.248 512 265.408 265.344a32 32 0 0 1-45.312 45.312l-288-288a32 32 0 0 1 0-45.312l288-288a32 32 0 1 1 45.312 45.312z"
})]));
}
});
var calendar_default$1 = /* @__PURE__ */ (0, vue.defineComponent)({
name: "Calendar",
__name: "calendar",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"
})]));
}
});
var caret_right_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "CaretRight",
__name: "caret-right",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M384 192v640l384-320.064z"
})]));
}
});
var caret_top_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "CaretTop",
__name: "caret-top",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M512 320 192 704h639.936z"
})]));
}
});
var check_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "Check",
__name: "check",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M406.656 706.944 195.84 496.256a32 32 0 1 0-45.248 45.248l256 256 512-512a32 32 0 0 0-45.248-45.248L406.592 706.944z"
})]));
}
});
var circle_check_filled_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "CircleCheckFilled",
__name: "circle-check-filled",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896m-55.808 536.384-99.52-99.584a38.4 38.4 0 1 0-54.336 54.336l126.72 126.72a38.27 38.27 0 0 0 54.336 0l262.4-262.464a38.4 38.4 0 1 0-54.272-54.336z"
})]));
}
});
var circle_check_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "CircleCheck",
__name: "circle-check",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768m0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896"
}), (0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M745.344 361.344a32 32 0 0 1 45.312 45.312l-288 288a32 32 0 0 1-45.312 0l-160-160a32 32 0 1 1 45.312-45.312L480 626.752z"
})]));
}
});
var circle_close_filled_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "CircleCloseFilled",
__name: "circle-close-filled",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896m0 393.664L407.936 353.6a38.4 38.4 0 1 0-54.336 54.336L457.664 512 353.6 616.064a38.4 38.4 0 1 0 54.336 54.336L512 566.336 616.064 670.4a38.4 38.4 0 1 0 54.336-54.336L566.336 512 670.4 407.936a38.4 38.4 0 1 0-54.336-54.336z"
})]));
}
});
var circle_close_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "CircleClose",
__name: "circle-close",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "m466.752 512-90.496-90.496a32 32 0 0 1 45.248-45.248L512 466.752l90.496-90.496a32 32 0 1 1 45.248 45.248L557.248 512l90.496 90.496a32 32 0 1 1-45.248 45.248L512 557.248l-90.496 90.496a32 32 0 0 1-45.248-45.248z"
}), (0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768m0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896"
})]));
}
});
var clock_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "Clock",
__name: "clock",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [
(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768m0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896"
}),
(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M480 256a32 32 0 0 1 32 32v256a32 32 0 0 1-64 0V288a32 32 0 0 1 32-32"
}),
(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M480 512h256q32 0 32 32t-32 32H480q-32 0-32-32t32-32"
})
]));
}
});
var close_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "Close",
__name: "close",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M764.288 214.592 512 466.88 259.712 214.592a31.936 31.936 0 0 0-45.12 45.12L466.752 512 214.528 764.224a31.936 31.936 0 1 0 45.12 45.184L512 557.184l252.288 252.288a31.936 31.936 0 0 0 45.12-45.12L557.12 512.064l252.288-252.352a31.936 31.936 0 1 0-45.12-45.184z"
})]));
}
});
var d_arrow_left_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "DArrowLeft",
__name: "d-arrow-left",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.59 30.59 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.59 30.59 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672zm256 0a29.12 29.12 0 0 1 41.728 0 30.59 30.59 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.59 30.59 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672z"
})]));
}
});
var d_arrow_right_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "DArrowRight",
__name: "d-arrow-right",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.59 30.59 0 0 1 0-42.752L764.736 512 452.864 192a30.59 30.59 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.59 30.59 0 0 1 0-42.752L508.736 512 196.864 192a30.59 30.59 0 0 1 0-42.688"
})]));
}
});
var delete_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "Delete",
__name: "delete",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M160 256H96a32 32 0 0 1 0-64h256V95.936a32 32 0 0 1 32-32h256a32 32 0 0 1 32 32V192h256a32 32 0 1 1 0 64h-64v672a32 32 0 0 1-32 32H192a32 32 0 0 1-32-32zm448-64v-64H416v64zM224 896h576V256H224zm192-128a32 32 0 0 1-32-32V416a32 32 0 0 1 64 0v320a32 32 0 0 1-32 32m192 0a32 32 0 0 1-32-32V416a32 32 0 0 1 64 0v320a32 32 0 0 1-32 32"
})]));
}
});
var document_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "Document",
__name: "document",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M832 384H576V128H192v768h640zm-26.496-64L640 154.496V320zM160 64h480l256 256v608a32 32 0 0 1-32 32H160a32 32 0 0 1-32-32V96a32 32 0 0 1 32-32m160 448h384v64H320zm0-192h160v64H320zm0 384h384v64H320z"
})]));
}
});
var full_screen_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "FullScreen",
__name: "full-screen",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "m160 96.064 192 .192a32 32 0 0 1 0 64l-192-.192V352a32 32 0 0 1-64 0V96h64zm0 831.872V928H96V672a32 32 0 1 1 64 0v191.936l192-.192a32 32 0 1 1 0 64zM864 96.064V96h64v256a32 32 0 1 1-64 0V160.064l-192 .192a32 32 0 1 1 0-64zm0 831.872-192-.192a32 32 0 0 1 0-64l192 .192V672a32 32 0 1 1 64 0v256h-64z"
})]));
}
});
var hide_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "Hide",
__name: "hide",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M876.8 156.8c0-9.6-3.2-16-9.6-22.4s-12.8-9.6-22.4-9.6-16 3.2-22.4 9.6L736 220.8c-64-32-137.6-51.2-224-60.8-160 16-288 73.6-377.6 176S0 496 0 512s48 73.6 134.4 176c22.4 25.6 44.8 48 73.6 67.2l-86.4 89.6c-6.4 6.4-9.6 12.8-9.6 22.4s3.2 16 9.6 22.4 12.8 9.6 22.4 9.6 16-3.2 22.4-9.6l704-710.4c3.2-6.4 6.4-12.8 6.4-22.4m-646.4 528Q115.2 579.2 76.8 512q43.2-72 153.6-172.8C304 272 400 230.4 512 224c64 3.2 124.8 19.2 176 44.8l-54.4 54.4C598.4 300.8 560 288 512 288c-64 0-115.2 22.4-160 64s-64 96-64 160c0 48 12.8 89.6 35.2 124.8L256 707.2c-9.6-6.4-19.2-16-25.6-22.4m140.8-96Q352 555.2 352 512c0-44.8 16-83.2 48-112s67.2-48 112-48c28.8 0 54.4 6.4 73.6 19.2zM889.599 336c-12.8-16-28.8-28.8-41.6-41.6l-48 48c73.6 67.2 124.8 124.8 150.4 169.6q-43.2 72-153.6 172.8c-73.6 67.2-172.8 108.8-284.8 115.2-51.2-3.2-99.2-12.8-140.8-28.8l-48 48c57.6 22.4 118.4 38.4 188.8 44.8 160-16 288-73.6 377.6-176S1024 528 1024 512s-48.001-73.6-134.401-176"
}), (0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M511.998 672c-12.8 0-25.6-3.2-38.4-6.4l-51.2 51.2c28.8 12.8 57.6 19.2 89.6 19.2 64 0 115.2-22.4 160-64 41.6-41.6 64-96 64-160 0-32-6.4-64-19.2-89.6l-51.2 51.2c3.2 12.8 6.4 25.6 6.4 38.4 0 44.8-16 83.2-48 112s-67.2 48-112 48"
})]));
}
});
var info_filled_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "InfoFilled",
__name: "info-filled",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M512 64a448 448 0 1 1 0 896.064A448 448 0 0 1 512 64m67.2 275.072c33.28 0 60.288-23.104 60.288-57.344s-27.072-57.344-60.288-57.344c-33.28 0-60.16 23.104-60.16 57.344s26.88 57.344 60.16 57.344M590.912 699.2c0-6.848 2.368-24.64 1.024-34.752l-52.608 60.544c-10.88 11.456-24.512 19.392-30.912 17.28a12.99 12.99 0 0 1-8.256-14.72l87.68-276.992c7.168-35.136-12.544-67.2-54.336-71.296-44.096 0-108.992 44.736-148.48 101.504 0 6.784-1.28 23.68.064 33.792l52.544-60.608c10.88-11.328 23.552-19.328 29.952-17.152a12.8 12.8 0 0 1 7.808 16.128L388.48 728.576c-10.048 32.256 8.96 63.872 55.04 71.04 67.84 0 107.904-43.648 147.456-100.416z"
})]));
}
});
var loading_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "Loading",
__name: "loading",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M512 64a32 32 0 0 1 32 32v192a32 32 0 0 1-64 0V96a32 32 0 0 1 32-32m0 640a32 32 0 0 1 32 32v192a32 32 0 1 1-64 0V736a32 32 0 0 1 32-32m448-192a32 32 0 0 1-32 32H736a32 32 0 1 1 0-64h192a32 32 0 0 1 32 32m-640 0a32 32 0 0 1-32 32H96a32 32 0 0 1 0-64h192a32 32 0 0 1 32 32M195.2 195.2a32 32 0 0 1 45.248 0L376.32 331.008a32 32 0 0 1-45.248 45.248L195.2 240.448a32 32 0 0 1 0-45.248m452.544 452.544a32 32 0 0 1 45.248 0L828.8 783.552a32 32 0 0 1-45.248 45.248L647.744 692.992a32 32 0 0 1 0-45.248M828.8 195.264a32 32 0 0 1 0 45.184L692.992 376.32a32 32 0 0 1-45.248-45.248l135.808-135.808a32 32 0 0 1 45.248 0m-452.544 452.48a32 32 0 0 1 0 45.248L240.448 828.8a32 32 0 0 1-45.248-45.248l135.808-135.808a32 32 0 0 1 45.248 0"
})]));
}
});
var minus_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "Minus",
__name: "minus",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M128 544h768a32 32 0 1 0 0-64H128a32 32 0 0 0 0 64"
})]));
}
});
var more_filled_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "MoreFilled",
__name: "more-filled",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M176 416a112 112 0 1 1 0 224 112 112 0 0 1 0-224m336 0a112 112 0 1 1 0 224 112 112 0 0 1 0-224m336 0a112 112 0 1 1 0 224 112 112 0 0 1 0-224"
})]));
}
});
var more_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "More",
__name: "more",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M176 416a112 112 0 1 0 0 224 112 112 0 0 0 0-224m0 64a48 48 0 1 1 0 96 48 48 0 0 1 0-96m336-64a112 112 0 1 1 0 224 112 112 0 0 1 0-224m0 64a48 48 0 1 0 0 96 48 48 0 0 0 0-96m336-64a112 112 0 1 1 0 224 112 112 0 0 1 0-224m0 64a48 48 0 1 0 0 96 48 48 0 0 0 0-96"
})]));
}
});
var picture_filled_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "PictureFilled",
__name: "picture-filled",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M96 896a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h832a32 32 0 0 1 32 32v704a32 32 0 0 1-32 32zm315.52-228.48-68.928-68.928a32 32 0 0 0-45.248 0L128 768.064h778.688l-242.112-290.56a32 32 0 0 0-49.216 0L458.752 665.408a32 32 0 0 1-47.232 2.112M256 384a96 96 0 1 0 192.064-.064A96 96 0 0 0 256 384"
})]));
}
});
var plus_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "Plus",
__name: "plus",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M480 480V128a32 32 0 0 1 64 0v352h352a32 32 0 1 1 0 64H544v352a32 32 0 1 1-64 0V544H128a32 32 0 0 1 0-64z"
})]));
}
});
var question_filled_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "QuestionFilled",
__name: "question-filled",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896m23.744 191.488c-52.096 0-92.928 14.784-123.2 44.352-30.976 29.568-45.76 70.4-45.76 122.496h80.256c0-29.568 5.632-52.8 17.6-68.992 13.376-19.712 35.2-28.864 66.176-28.864 23.936 0 42.944 6.336 56.32 19.712 12.672 13.376 19.712 31.68 19.712 54.912 0 17.6-6.336 34.496-19.008 49.984l-8.448 9.856c-45.76 40.832-73.216 70.4-82.368 89.408-9.856 19.008-14.08 42.24-14.08 68.992v9.856h80.96v-9.856c0-16.896 3.52-31.68 10.56-45.76 6.336-12.672 15.488-24.64 28.16-35.2 33.792-29.568 54.208-48.576 60.544-55.616 16.896-22.528 26.048-51.392 26.048-86.592q0-64.416-42.24-101.376c-28.16-25.344-65.472-37.312-111.232-37.312m-12.672 406.208a54.27 54.27 0 0 0-38.72 14.784 49.4 49.4 0 0 0-15.488 38.016c0 15.488 4.928 28.16 15.488 38.016A54.85 54.85 0 0 0 523.072 768c15.488 0 28.16-4.928 38.72-14.784a51.52 51.52 0 0 0 16.192-38.72 51.97 51.97 0 0 0-15.488-38.016 55.94 55.94 0 0 0-39.424-14.784"
})]));
}
});
var refresh_left_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "RefreshLeft",
__name: "refresh-left",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M289.088 296.704h92.992a32 32 0 0 1 0 64H232.96a32 32 0 0 1-32-32V179.712a32 32 0 0 1 64 0v50.56a384 384 0 0 1 643.84 282.88 384 384 0 0 1-383.936 384 384 384 0 0 1-384-384h64a320 320 0 1 0 640 0 320 320 0 0 0-555.712-216.448z"
})]));
}
});
var refresh_right_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "RefreshRight",
__name: "refresh-right",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M784.512 230.272v-50.56a32 32 0 1 1 64 0v149.056a32 32 0 0 1-32 32H667.52a32 32 0 1 1 0-64h92.992A320 320 0 1 0 524.8 833.152a320 320 0 0 0 320-320h64a384 384 0 0 1-384 384 384 384 0 0 1-384-384 384 384 0 0 1 643.712-282.88"
})]));
}
});
var scale_to_original_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ScaleToOriginal",
__name: "scale-to-original",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M813.176 180.706a60.235 60.235 0 0 1 60.236 60.235v481.883a60.235 60.235 0 0 1-60.236 60.235H210.824a60.235 60.235 0 0 1-60.236-60.235V240.94a60.235 60.235 0 0 1 60.236-60.235h602.352zm0-60.235H210.824A120.47 120.47 0 0 0 90.353 240.94v481.883a120.47 120.47 0 0 0 120.47 120.47h602.353a120.47 120.47 0 0 0 120.471-120.47V240.94a120.47 120.47 0 0 0-120.47-120.47zm-120.47 180.705a30.12 30.12 0 0 0-30.118 30.118v301.177a30.118 30.118 0 0 0 60.236 0V331.294a30.12 30.12 0 0 0-30.118-30.118m-361.412 0a30.12 30.12 0 0 0-30.118 30.118v301.177a30.118 30.118 0 1 0 60.236 0V331.294a30.12 30.12 0 0 0-30.118-30.118M512 361.412a30.12 30.12 0 0 0-30.118 30.117v30.118a30.118 30.118 0 0 0 60.236 0V391.53A30.12 30.12 0 0 0 512 361.412M512 512a30.12 30.12 0 0 0-30.118 30.118v30.117a30.118 30.118 0 0 0 60.236 0v-30.117A30.12 30.12 0 0 0 512 512"
})]));
}
});
var search_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "Search",
__name: "search",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "m795.904 750.72 124.992 124.928a32 32 0 0 1-45.248 45.248L750.656 795.904a416 416 0 1 1 45.248-45.248zM480 832a352 352 0 1 0 0-704 352 352 0 0 0 0 704"
})]));
}
});
var sort_down_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "SortDown",
__name: "sort-down",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M576 96v709.568L333.312 562.816A32 32 0 1 0 288 608l297.408 297.344A32 32 0 0 0 640 882.688V96a32 32 0 0 0-64 0"
})]));
}
});
var sort_up_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "SortUp",
__name: "sort-up",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M384 141.248V928a32 32 0 1 0 64 0V218.56l242.688 242.688A32 32 0 1 0 736 416L438.592 118.656A32 32 0 0 0 384 141.248"
})]));
}
});
var star_filled_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "StarFilled",
__name: "star-filled",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M313.6 924.48a70.4 70.4 0 0 1-74.152-5.365 70.4 70.4 0 0 1-27.992-68.875l37.888-220.928L88.96 472.96a70.4 70.4 0 0 1 3.788-104.225A70.4 70.4 0 0 1 128 352.896l221.76-32.256 99.2-200.96a70.4 70.4 0 0 1 100.246-28.595 70.4 70.4 0 0 1 25.962 28.595l99.2 200.96 221.824 32.256a70.4 70.4 0 0 1 39.04 120.064L774.72 629.376l37.888 220.928a70.4 70.4 0 0 1-102.144 74.24L512 820.096l-198.4 104.32z"
})]));
}
});
var star_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "Star",
__name: "star",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "m512 747.84 228.16 119.936a6.4 6.4 0 0 0 9.28-6.72l-43.52-254.08 184.512-179.904a6.4 6.4 0 0 0-3.52-10.88l-255.104-37.12L517.76 147.904a6.4 6.4 0 0 0-11.52 0L392.192 379.072l-255.104 37.12a6.4 6.4 0 0 0-3.52 10.88L318.08 606.976l-43.584 254.08a6.4 6.4 0 0 0 9.28 6.72zM313.6 924.48a70.4 70.4 0 0 1-102.144-74.24l37.888-220.928L88.96 472.96A70.4 70.4 0 0 1 128 352.896l221.76-32.256 99.2-200.96a70.4 70.4 0 0 1 126.208 0l99.2 200.96 221.824 32.256a70.4 70.4 0 0 1 39.04 120.064L774.72 629.376l37.888 220.928a70.4 70.4 0 0 1-102.144 74.24L512 820.096l-198.4 104.32z"
})]));
}
});
var success_filled_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "SuccessFilled",
__name: "success-filled",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896m-55.808 536.384-99.52-99.584a38.4 38.4 0 1 0-54.336 54.336l126.72 126.72a38.27 38.27 0 0 0 54.336 0l262.4-262.464a38.4 38.4 0 1 0-54.272-54.336z"
})]));
}
});
var view_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "View",
__name: "view",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M512 160c320 0 512 352 512 352S832 864 512 864 0 512 0 512s192-352 512-352m0 64c-225.28 0-384.128 208.064-436.8 288 52.608 79.872 211.456 288 436.8 288 225.28 0 384.128-208.064 436.8-288-52.608-79.872-211.456-288-436.8-288m0 64a224 224 0 1 1 0 448 224 224 0 0 1 0-448m0 64a160.19 160.19 0 0 0-160 160c0 88.192 71.744 160 160 160s160-71.808 160-160-71.744-160-160-160"
})]));
}
});
var warning_filled_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "WarningFilled",
__name: "warning-filled",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896m0 192a58.43 58.43 0 0 0-58.24 63.744l23.36 256.384a35.072 35.072 0 0 0 69.76 0l23.296-256.384A58.43 58.43 0 0 0 512 256m0 512a51.2 51.2 0 1 0 0-102.4 51.2 51.2 0 0 0 0 102.4"
})]));
}
});
var zoom_in_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ZoomIn",
__name: "zoom-in",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "m795.904 750.72 124.992 124.928a32 32 0 0 1-45.248 45.248L750.656 795.904a416 416 0 1 1 45.248-45.248zM480 832a352 352 0 1 0 0-704 352 352 0 0 0 0 704m-32-384v-96a32 32 0 0 1 64 0v96h96a32 32 0 0 1 0 64h-96v96a32 32 0 0 1-64 0v-96h-96a32 32 0 0 1 0-64z"
})]));
}
});
var zoom_out_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ZoomOut",
__name: "zoom-out",
setup(__props) {
return (_ctx, _cache) => ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1024 1024"
}, [(0, vue.createElementVNode)("path", {
fill: "currentColor",
d: "m795.904 750.72 124.992 124.928a32 32 0 0 1-45.248 45.248L750.656 795.904a416 416 0 1 1 45.248-45.248zM480 832a352 352 0 1 0 0-704 352 352 0 0 0 0 704M352 448h256a32 32 0 0 1 0 64H352a32 32 0 0 1 0-64"
})]));
}
});
//#endregion
//#region ../../packages/utils/vue/props/runtime.ts
const epPropKey = "__epPropKey";
const definePropType = (val) => val;
const isEpProp = (val) => isObject$1(val) && !!val[epPropKey];
/**
* @description Build prop. It can better optimize prop types
* @description 生成 prop，能更好地优化类型
* @example
// limited options
// the type will be PropType<'light' | 'dark'>
buildProp({
type: String,
values: ['light', 'dark'],
} as const)
* @example
// limited options and other types
// the type will be PropType<'small' | 'large' | number>
buildProp({
type: [String, Number],
values: ['small', 'large'],
validator: (val: unknown): val is number => typeof val === 'number',
} as const)
@link see more: https://github.com/element-plus/element-plus/pull/3341
*/
const buildProp = (prop, key) => {
if (!isObject$1(prop) || isEpProp(prop)) return prop;
const { values, required, default: defaultValue, type, validator } = prop;
const epProp = {
type,
required: !!required,
validator: values || validator ? (val) => {
let valid = false;
let allowedValues = [];
if (values) {
allowedValues = Array.from(values);
if (hasOwn(prop, "default")) allowedValues.push(defaultValue);
valid ||= allowedValues.includes(val);
}
if (validator) valid ||= validator(val);
if (!valid && allowedValues.length > 0) {
const allowValuesText = [...new Set(allowedValues)].map((value) => JSON.stringify(value)).join(", ");
(0, vue.warn)(`Invalid prop: validation failed${key ? ` for prop "${key}"` : ""}. Expected one of [${allowValuesText}], got value ${JSON.stringify(val)}.`);
}
return valid;
} : void 0,
[epPropKey]: true
};
if (hasOwn(prop, "default")) epProp.default = defaultValue;
return epProp;
};
const buildProps = (props) => fromPairs(Object.entries(props).map(([key, option]) => [key, buildProp(option, key)]));
//#endregion
//#region ../../packages/utils/vue/icon.ts
const iconPropType = definePropType([
String,
Object,
Function
]);
const CloseComponents = { Close: close_default };
const TypeComponents = {
Close: close_default,
SuccessFilled: success_filled_default,
InfoFilled: info_filled_default,
WarningFilled: warning_filled_default,
CircleCloseFilled: circle_close_filled_default
};
const TypeComponentsMap = {
primary: info_filled_default,
success: success_filled_default,
warning: warning_filled_default,
error: circle_close_filled_default,
info: info_filled_default
};
const ValidateComponentsMap = {
validating: loading_default,
success: circle_check_default,
error: circle_close_default
};
//#endregion
//#region ../../packages/utils/vue/install.ts
const withPropsDefaultsSetter = (target) => {
const _p = target.props;
const props = isArray$1(_p) ? fromPairs(_p.map((key) => [key, {}])) : _p;
target.setPropsDefaults = (defaults) => {
if (!props) return;
for (const [key, value] of Object.entries(defaults)) {
const prop = props[key];
if (!hasOwn(props, key)) continue;
if (isPlainObject(prop)) {
props[key] = {
...prop,
default: value
};
continue;
}
props[key] = {
type: prop,
default: value
};
}
target.props = props;
};
};
const withInstall = (main, extra) => {
main.install = (app) => {
for (const comp of [main, ...Object.values(extra ?? {})]) app.component(comp.name, comp);
};
if (extra) for (const [key, comp] of Object.entries(extra)) main[key] = comp;
withPropsDefaultsSetter(main);
return main;
};
const withInstallFunction = (fn, name) => {
fn.install = (app) => {
fn._context = app._context;
app.config.globalProperties[name] = fn;
};
return fn;
};
const withInstallDirective = (directive, name) => {
directive.install = (app) => {
app.directive(name, directive);
};
return directive;
};
const withNoopInstall = (component) => {
component.install = NOOP;
withPropsDefaultsSetter(component);
return component;
};
//#endregion
//#region ../../packages/utils/vue/refs.ts
const composeRefs = (...refs) => {
return (el) => {
refs.forEach((ref) => {
ref.value = el;
});
};
};
//#endregion
//#region ../../packages/utils/vue/validator.ts
const isValidComponentSize = (val) => ["", ...componentSizes].includes(val);
//#endregion
//#region ../../packages/utils/vue/vnode.ts
const SCOPE$8 = "utils/vue/vnode";
let PatchFlags = /* @__PURE__ */ function(PatchFlags) {
PatchFlags[PatchFlags["TEXT"] = 1] = "TEXT";
PatchFlags[PatchFlags["CLASS"] = 2] = "CLASS";
PatchFlags[PatchFlags["STYLE"] = 4] = "STYLE";
PatchFlags[PatchFlags["PROPS"] = 8] = "PROPS";
PatchFlags[PatchFlags["FULL_PROPS"] = 16] = "FULL_PROPS";
PatchFlags[PatchFlags["HYDRATE_EVENTS"] = 32] = "HYDRATE_EVENTS";
PatchFlags[PatchFlags["STABLE_FRAGMENT"] = 64] = "STABLE_FRAGMENT";
PatchFlags[PatchFlags["KEYED_FRAGMENT"] = 128] = "KEYED_FRAGMENT";
PatchFlags[PatchFlags["UNKEYED_FRAGMENT"] = 256] = "UNKEYED_FRAGMENT";
PatchFlags[PatchFlags["NEED_PATCH"] = 512] = "NEED_PATCH";
PatchFlags[PatchFlags["DYNAMIC_SLOTS"] = 1024] = "DYNAMIC_SLOTS";
PatchFlags[PatchFlags["HOISTED"] = -1] = "HOISTED";
PatchFlags[PatchFlags["BAIL"] = -2] = "BAIL";
return PatchFlags;
}({});
function isFragment(node) {
return (0, vue.isVNode)(node) && node.type === vue.Fragment;
}
function isComment(node) {
return (0, vue.isVNode)(node) && node.type === vue.Comment;
}
function isValidElementNode(node) {
return (0, vue.isVNode)(node) && !isFragment(node) && !isComment(node);
}
const getNormalizedProps = (node) => {
if (!(0, vue.isVNode)(node)) {
/* @__PURE__ */ debugWarn(SCOPE$8, "[getNormalizedProps] must be a VNode");
return {};
}
const raw = node.props || {};
const type = ((0, vue.isVNode)(node.type) ? node.type.props : void 0) || {};
const props = {};
Object.keys(type).forEach((key) => {
if (hasOwn(type[key], "default")) props[key] = type[key].default;
});
Object.keys(raw).forEach((key) => {
props[camelize(key)] = raw[key];
});
return props;
};
const flattedChildren = (children) => {
const vNodes = isArray$1(children) ? children : [children];
const result = [];
vNodes.forEach((child) => {
if (isArray$1(child)) result.push(...flattedChildren(child));
else if ((0, vue.isVNode)(child) && child.component?.subTree) result.push(child, ...flattedChildren(child.component.subTree));
else if ((0, vue.isVNode)(child) && isArray$1(child.children)) result.push(...flattedChildren(child.children));
else if ((0, vue.isVNode)(child) && child.shapeFlag === 2) result.push(...flattedChildren(child.type()));
else result.push(child);
});
return result;
};
//#endregion
//#region ../../packages/utils/arrays.ts
const unique = (arr) => [...new Set(arr)];
const extractFirst = (arr) => {
return isArray$1(arr) ? arr[0] : arr;
};
/** like `_.castArray`, except falsy value returns empty array. */
const castArray = (arr) => {
if (!arr && arr !== 0) return [];
return isArray$1(arr) ? arr : [arr];
};
//#endregion
//#region ../../packages/utils/typescript.ts
const mutable = (val) => val;
//#endregion
//#region ../../packages/utils/throttleByRaf.ts
function throttleByRaf(cb) {
let timer = 0;
const throttle = (...args) => {
if (timer) cAF(timer);
timer = rAF(() => {
cb(...args);
timer = 0;
});
};
throttle.cancel = () => {
cAF(timer);
timer = 0;
};
return throttle;
}
//#endregion
//#region ../../packages/utils/numbers.ts
/**
* Due to browser rendering and calculation precision loss issues,
* boundary checks cannot be based solely on value equality;
* a certain range of fluctuation is permissible.
*/
function isGreaterThan(a, b, epsilon = .03) {
return a - b > epsilon;
}
//#endregion
//#region ../../packages/hooks/use-attrs/index.ts
const DEFAULT_EXCLUDE_KEYS = ["class", "style"];
const LISTENER_PREFIX = /^on[A-Z]/;
const useAttrs = (params = {}) => {
const { excludeListeners = false, excludeKeys } = params;
const allExcludeKeys = (0, vue.computed)(() => {
return (excludeKeys?.value || []).concat(DEFAULT_EXCLUDE_KEYS);
});
const instance = (0, vue.getCurrentInstance)();
if (!instance) {
/* @__PURE__ */ debugWarn("use-attrs", "getCurrentInstance() returned null. useAttrs() must be called at the top of a setup function");
return (0, vue.computed)(() => ({}));
}
return (0, vue.computed)(() => fromPairs(Object.entries(instance.proxy?.$attrs).filter(([key]) => !allExcludeKeys.value.includes(key) && !(excludeListeners && LISTENER_PREFIX.test(key)))));
};
//#endregion
//#region ../../packages/hooks/use-calc-input-width/index.ts
function useCalcInputWidth() {
const calculatorRef = (0, vue.shallowRef)();
const calculatorWidth = (0, vue.ref)(0);
const inputStyle = (0, vue.computed)(() => ({ minWidth: `${Math.max(calculatorWidth.value, MINIMUM_INPUT_WIDTH)}px` }));
const resetCalculatorWidth = () => {
calculatorWidth.value = calculatorRef.value?.getBoundingClientRect().width ?? 0;
};
useResizeObserver(calculatorRef, resetCalculatorWidth);
return {
calculatorRef,
calculatorWidth,
inputStyle
};
}
//#endregion
//#region ../../packages/hooks/use-deprecated/index.ts
const useDeprecated = ({ from, replacement, scope, version, ref, type = "API" }, condition) => {
(0, vue.watch)(() => (0, vue.unref)(condition), (val) => {
if (val) /* @__PURE__ */ debugWarn(scope, `[${type}] ${from} is about to be deprecated in version ${version}, please use ${replacement} instead.
For more detail, please visit: ${ref}
`);
}, { immediate: true });
};
//#endregion
//#region ../../packages/hooks/use-draggable/index.ts
const useDraggable = (targetRef, dragRef, draggable, overflow) => {
const transform = {
offsetX: 0,
offsetY: 0
};
const isDragging = (0, vue.ref)(false);
const adjustPosition = (moveX, moveY) => {
if (targetRef.value) {
const { offsetX, offsetY } = transform;
const targetRect = targetRef.value.getBoundingClientRect();
const targetLeft = targetRect.left;
const targetTop = targetRect.top;
const targetWidth = targetRect.width;
const targetHeight = targetRect.height;
const clientWidth = document.documentElement.clientWidth;
const clientHeight = document.documentElement.clientHeight;
const minLeft = -targetLeft + offsetX;
const minTop = -targetTop + offsetY;
const maxLeft = clientWidth - targetLeft - targetWidth + offsetX;
const maxTop = clientHeight - targetTop - (targetHeight < clientHeight ? targetHeight : 0) + offsetY;
if (!overflow?.value) {
moveX = Math.min(Math.max(moveX, minLeft), maxLeft);
moveY = Math.min(Math.max(moveY, minTop), maxTop);
}
transform.offsetX = moveX;
transform.offsetY = moveY;
targetRef.value.style.transform = `translate(${addUnit(moveX)}, ${addUnit(moveY)})`;
}
};
const onMousedown = (e) => {
const downX = e.clientX;
const downY = e.clientY;
const { offsetX, offsetY } = transform;
const onMousemove = (e) => {
if (!isDragging.value) isDragging.value = true;
adjustPosition(offsetX + e.clientX - downX, offsetY + e.clientY - downY);
};
const onMouseup = () => {
isDragging.value = false;
document.removeEventListener("mousemove", onMousemove);
document.removeEventListener("mouseup", onMouseup);
};
document.addEventListener("mousemove", onMousemove);
document.addEventListener("mouseup", onMouseup);
};
const onDraggable = () => {
if (dragRef.value && targetRef.value) {
dragRef.value.addEventListener("mousedown", onMousedown);
window.addEventListener("resize", updatePosition);
}
};
const offDraggable = () => {
if (dragRef.value && targetRef.value) {
dragRef.value.removeEventListener("mousedown", onMousedown);
window.removeEventListener("resize", updatePosition);
}
};
const resetPosition = () => {
transform.offsetX = 0;
transform.offsetY = 0;
if (targetRef.value) targetRef.value.style.transform = "";
};
const updatePosition = () => {
const { offsetX, offsetY } = transform;
adjustPosition(offsetX, offsetY);
};
(0, vue.onMounted)(() => {
(0, vue.watchEffect)(() => {
if (draggable.value) onDraggable();
else offDraggable();
});
});
(0, vue.onBeforeUnmount)(() => {
offDraggable();
});
return {
isDragging,
resetPosition,
updatePosition
};
};
//#endregion
//#region ../../packages/hooks/use-focus/index.ts
const useFocus = (el) => {
return { focus: () => {
el.value?.focus?.();
} };
};
//#endregion
//#region ../../packages/locale/lang/en.ts
var en_default = {
name: "en",
el: {
breadcrumb: { label: "Breadcrumb" },
colorpicker: {
confirm: "OK",
clear: "Clear",
defaultLabel: "color picker",
description: "current color is {color}. press enter to select a new color.",
alphaLabel: "pick alpha value",
alphaDescription: "alpha {alpha}, current color is {color}",
hueLabel: "pick hue value",
hueDescription: "hue {hue}, current color is {color}",
svLabel: "pick saturation and brightness value",
svDescription: "saturation {saturation}, brightness {brightness}, current color is {color}",
predefineDescription: "select {value} as the color"
},
datepicker: {
now: "Now",
today: "Today",
cancel: "Cancel",
clear: "Clear",
confirm: "OK",
dateTablePrompt: "Use the arrow keys and enter to select the day of the month",
monthTablePrompt: "Use the arrow keys and enter to select the month",
yearTablePrompt: "Use the arrow keys and enter to select the year",
selectedDate: "Selected date",
selectDate: "Select date",
selectTime: "Select time",
startDate: "Start Date",
startTime: "Start Time",
endDate: "End Date",
endTime: "End Time",
prevYear: "Previous Year",
nextYear: "Next Year",
prevMonth: "Previous Month",
nextMonth: "Next Month",
year: "",
month1: "January",
month2: "February",
month3: "March",
month4: "April",
month5: "May",
month6: "June",
month7: "July",
month8: "August",
month9: "September",
month10: "October",
month11: "November",
month12: "December",
weeks: {
sun: "Sun",
mon: "Mon",
tue: "Tue",
wed: "Wed",
thu: "Thu",
fri: "Fri",
sat: "Sat"
},
weeksFull: {
sun: "Sunday",
mon: "Monday",
tue: "Tuesday",
wed: "Wednesday",
thu: "Thursday",
fri: "Friday",
sat: "Saturday"
},
months: {
jan: "Jan",
feb: "Feb",
mar: "Mar",
apr: "Apr",
may: "May",
jun: "Jun",
jul: "Jul",
aug: "Aug",
sep: "Sep",
oct: "Oct",
nov: "Nov",
dec: "Dec"
}
},
inputNumber: {
decrease: "decrease number",
increase: "increase number"
},
select: {
loading: "Loading",
noMatch: "No matching data",
noData: "No data",
placeholder: "Select"
},
mention: { loading: "Loading" },
dropdown: { toggleDropdown: "Toggle Dropdown" },
cascader: {
noMatch: "No matching data",
loading: "Loading",
placeholder: "Select",
noData: "No data"
},
pagination: {
goto: "Go to",
pagesize: "/page",
total: "Total {total}",
pageClassifier: "",
page: "Page",
prev: "Go to previous page",
next: "Go to next page",
currentPage: "page {pager}",
prevPages: "Previous {pager} pages",
nextPages: "Next {pager} pages",
deprecationWarning: "Deprecated usages detected, please refer to the el-pagination documentation for more details"
},
dialog: { close: "Close this dialog" },
drawer: { close: "Close this dialog" },
messagebox: {
title: "Message",
confirm: "OK",
cancel: "Cancel",
error: "Illegal input",
close: "Close this dialog"
},
upload: {
deleteTip: "press delete to remove",
delete: "Delete",
preview: "Preview",
continue: "Continue"
},
slider: {
defaultLabel: "slider between {min} and {max}",
defaultRangeStartLabel: "pick start value",
defaultRangeEndLabel: "pick end value"
},
table: {
emptyText: "No Data",
confirmFilter: "Confirm",
resetFilter: "Reset",
clearFilter: "All",
sumText: "Sum",
selectAllLabel: "Select all rows",
selectRowLabel: "Select this row",
expandRowLabel: "Expand this row",
collapseRowLabel: "Collapse this row",
sortLabel: "Sort by {column}",
filterLabel: "Filter by {column}"
},
tag: { close: "Close this tag" },
tour: {
next: "Next",
previous: "Previous",
finish: "Finish",
close: "Close this dialog"
},
tree: { emptyText: "No Data" },
transfer: {
noMatch: "No matching data",
noData: "No data",
titles: ["List 1", "List 2"],
filterPlaceholder: "Enter keyword",
noCheckedFormat: "{total} items",
hasCheckedFormat: "{checked}/{total} checked"
},
image: { error: "FAILED" },
pageHeader: { title: "Back" },
popconfirm: {
confirmButtonText: "Yes",
cancelButtonText: "No"
},
carousel: {
leftArrow: "Carousel arrow left",
rightArrow: "Carousel arrow right",
indicator: "Carousel switch to index {index}"
}
}
};
//#endregion
//#region ../../packages/hooks/use-locale/index.ts
const buildTranslator = (locale) => (path, option) => translate(path, option, (0, vue.unref)(locale));
const translate = (path, option, locale) => get(locale, path, path).replace(/\{(\w+)\}/g, (_, key) => `${option?.[key] ?? `{${key}}`}`);
const buildLocaleContext = (locale) => {
return {
lang: (0, vue.computed)(() => (0, vue.unref)(locale).name),
locale: (0, vue.isRef)(locale) ? locale : (0, vue.ref)(locale),
t: buildTranslator(locale)
};
};
const localeContextKey = Symbol("localeContextKey");
const useLocale = (localeOverrides) => {
const locale = localeOverrides || (0, vue.inject)(localeContextKey, (0, vue.ref)());
return buildLocaleContext((0, vue.computed)(() => locale.value || en_default));
};
//#endregion
//#region ../../packages/hooks/use-namespace/index.ts
const defaultNamespace = "el";
const statePrefix = "is-";
const _bem = (namespace, block, blockSuffix, element, modifier) => {
let cls = `${namespace}-${block}`;
if (blockSuffix) cls += `-${blockSuffix}`;
if (element) cls += `__${element}`;
if (modifier) cls += `--${modifier}`;
return cls;
};
const namespaceContextKey = Symbol("namespaceContextKey");
const useGetDerivedNamespace = (namespaceOverrides) => {
const derivedNamespace = namespaceOverrides || ((0, vue.getCurrentInstance)() ? (0, vue.inject)(namespaceContextKey, (0, vue.ref)(defaultNamespace)) : (0, vue.ref)(defaultNamespace));
return (0, vue.computed)(() => {
return (0, vue.unref)(derivedNamespace) || defaultNamespace;
});
};
const useNamespace = (block, namespaceOverrides) => {
const namespace = useGetDerivedNamespace(namespaceOverrides);
const b = (blockSuffix = "") => _bem(namespace.value, block, blockSuffix, "", "");
const e = (element) => element ? _bem(namespace.value, block, "", element, "") : "";
const m = (modifier) => modifier ? _bem(namespace.value, block, "", "", modifier) : "";
const be = (blockSuffix, element) => blockSuffix && element ? _bem(namespace.value, block, blockSuffix, element, "") : "";
const em = (element, modifier) => element && modifier ? _bem(namespace.value, block, "", element, modifier) : "";
const bm = (blockSuffix, modifier) => blockSuffix && modifier ? _bem(namespace.value, block, blockSuffix, "", modifier) : "";
const bem = (blockSuffix, element, modifier) => blockSuffix && element && modifier ? _bem(namespace.value, block, blockSuffix, element, modifier) : "";
const is = (name, ...args) => {
const state = args.length >= 1 ? args[0] : true;
return name && state ? `${statePrefix}${name}` : "";
};
const cssVar = (object) => {
const styles = {};
for (const key in object) if (object[key]) styles[`--${namespace.value}-${key}`] = object[key];
return styles;
};
const cssVarBlock = (object) => {
const styles = {};
for (const key in object) if (object[key]) styles[`--${namespace.value}-${block}-${key}`] = object[key];
return styles;
};
const cssVarName = (name) => `--${namespace.value}-${name}`;
const cssVarBlockName = (name) => `--${namespace.value}-${block}-${name}`;
return {
namespace,
b,
e,
m,
be,
em,
bm,
bem,
is,
cssVar,
cssVarName,
cssVarBlock,
cssVarBlockName
};
};
//#endregion
//#region ../../packages/hooks/use-lockscreen/index.ts
/**
* Hook that monitoring the ref value to lock or unlock the screen.
* When the trigger became true, it assumes modal is now opened and vice versa.
* @param trigger {Ref<boolean>}
*/
const useLockscreen = (trigger, options = {}) => {
if (!(0, vue.isRef)(trigger)) throwError("[useLockscreen]", "You need to pass a ref param to this function");
const ns = options.ns || useNamespace("popup");
const hiddenCls = (0, vue.computed)(() => ns.bm("parent", "hidden"));
let scrollBarWidth = 0;
let withoutHiddenClass = false;
let bodyWidth = "0";
let cleaned = false;
const cleanup = () => {
if (cleaned) return;
cleaned = true;
setTimeout(() => {
if (typeof document === "undefined") return;
if (withoutHiddenClass && document) {
document.body.style.width = bodyWidth;
removeClass(document.body, hiddenCls.value);
}
}, 200);
};
(0, vue.watch)(trigger, (val) => {
if (!val) {
cleanup();
return;
}
cleaned = false;
withoutHiddenClass = !hasClass(document.body, hiddenCls.value);
if (withoutHiddenClass) {
bodyWidth = document.body.style.width;
addClass(document.body, hiddenCls.value);
}
scrollBarWidth = getScrollBarWidth(ns.namespace.value);
const bodyHasOverflow = document.documentElement.clientHeight < document.body.scrollHeight;
const bodyOverflowY = getStyle(document.body, "overflowY");
if (scrollBarWidth > 0 && (bodyHasOverflow || bodyOverflowY === "scroll") && withoutHiddenClass) document.body.style.width = `calc(100% - ${scrollBarWidth}px)`;
});
(0, vue.onScopeDispose)(() => cleanup());
};
//#endregion
//#region ../../packages/hooks/use-modal/index.ts
const modalStack = [];
const closeModal = (e) => {
if (modalStack.length === 0) return;
if (getEventCode(e) === EVENT_CODE.esc) {
e.stopPropagation();
modalStack[modalStack.length - 1].handleClose();
}
};
const useModal = (instance, visibleRef) => {
(0, vue.watch)(visibleRef, (val) => {
if (val) modalStack.push(instance);
else modalStack.splice(modalStack.indexOf(instance), 1);
});
};
if (isClient) useEventListener(document, "keydown", closeModal);
//#endregion
//#region ../../packages/hooks/use-model-toggle/index.ts
const _prop = buildProp({
type: definePropType(Boolean),
default: null
});
const _event = buildProp({ type: definePropType(Function) });
const createModelToggleComposable = (name) => {
const updateEventKey = `update:${name}`;
const updateEventKeyRaw = `onUpdate:${name}`;
const useModelToggleEmits = [updateEventKey];
const useModelToggleProps = {
[name]: _prop,
[updateEventKeyRaw]: _event
};
const useModelToggle = ({ indicator, toggleReason, shouldHideWhenRouteChanges, shouldProceed, onShow, onHide }) => {
const instance = (0, vue.getCurrentInstance)();
const { emit } = instance;
const props = instance.props;
const hasUpdateHandler = (0, vue.computed)(() => isFunction$1(props[updateEventKeyRaw]));
const isModelBindingAbsent = (0, vue.computed)(() => props[name] === null);
const doShow = (event) => {
if (indicator.value === true) return;
indicator.value = true;
if (toggleReason) toggleReason.value = event;
if (isFunction$1(onShow)) onShow(event);
};
const doHide = (event) => {
if (indicator.value === false) return;
indicator.value = false;
if (toggleReason) toggleReason.value = event;
if (isFunction$1(onHide)) onHide(event);
};
const show = (event) => {
if (props.disabled === true || isFunction$1(shouldProceed) && !shouldProceed()) return;
const shouldEmit = hasUpdateHandler.value && isClient;
if (shouldEmit) emit(updateEventKey, true);
if (isModelBindingAbsent.value || !shouldEmit) doShow(event);
};
const hide = (event) => {
if (props.disabled === true || !isClient) return;
const shouldEmit = hasUpdateHandler.value && isClient;
if (shouldEmit) emit(updateEventKey, false);
if (isModelBindingAbsent.value || !shouldEmit) doHide(event);
};
const onChange = (val) => {
if (!isBoolean(val)) return;
if (props.disabled && val) {
if (hasUpdateHandler.value) emit(updateEventKey, false);
} else if (indicator.value !== val) if (val) doShow();
else doHide();
};
const toggle = () => {
if (indicator.value) hide();
else show();
};
(0, vue.watch)(() => props[name], onChange);
if (shouldHideWhenRouteChanges && instance.appContext.config.globalProperties.$route !== void 0) (0, vue.watch)(() => ({ ...instance.proxy.$route }), () => {
if (shouldHideWhenRouteChanges.value && indicator.value) hide();
});
(0, vue.onMounted)(() => {
onChange(props[name]);
});
return {
hide,
show,
toggle,
hasUpdateHandler
};
};
return {
useModelToggle,
useModelToggleProps,
useModelToggleEmits
};
};
const { useModelToggle, useModelToggleProps, useModelToggleEmits } = createModelToggleComposable("modelValue");
//#endregion
//#region ../../packages/hooks/use-prevent-global/index.ts
const usePreventGlobal = (indicator, evt, cb) => {
const prevent = (e) => {
if (cb(e)) e.stopImmediatePropagation();
};
let stop = void 0;
(0, vue.watch)(() => indicator.value, (val) => {
if (val) stop = useEventListener(document, evt, prevent, true);
else stop?.();
}, { immediate: true });
};
//#endregion
//#region ../../packages/hooks/use-prop/index.ts
const useProp = (name) => {
const vm = (0, vue.getCurrentInstance)();
return (0, vue.computed)(() => (vm?.proxy?.$props)?.[name]);
};
//#endregion
//#region ../../node_modules/.pnpm/@sxzz+popperjs-es@2.11.8/node_modules/@sxzz/popperjs-es/dist/index.mjs
var L = "top", W = "bottom", T$1 = "right", P$1 = "left", me = "auto", Q = [
L,
W,
T$1,
P$1
], Y$1 = "start", Z = "end", Ye = "clippingParents", je = "viewport", ee = "popper", Ge = "reference", De = Q.reduce(function(e, t) {
return e.concat([t + "-" + Y$1, t + "-" + Z]);
}, []), Ee = [].concat(Q, [me]).reduce(function(e, t) {
return e.concat([
t,
t + "-" + Y$1,
t + "-" + Z
]);
}, []), Je = "beforeRead", Ke = "read", Qe = "afterRead", Ze = "beforeMain", et = "main", tt = "afterMain", nt = "beforeWrite", rt = "write", ot = "afterWrite", it = [
Je,
Ke,
Qe,
Ze,
et,
tt,
nt,
rt,
ot
];
function V(e) {
return e ? (e.nodeName || "").toLowerCase() : null;
}
function B(e) {
if (e == null) return window;
if (e.toString() !== "[object Window]") {
var t = e.ownerDocument;
return t && t.defaultView || window;
}
return e;
}
function G(e) {
return e instanceof B(e).Element || e instanceof Element;
}
function R(e) {
return e instanceof B(e).HTMLElement || e instanceof HTMLElement;
}
function Ae(e) {
if (typeof ShadowRoot == "undefined") return !1;
return e instanceof B(e).ShadowRoot || e instanceof ShadowRoot;
}
function Tt(e) {
var t = e.state;
Object.keys(t.elements).forEach(function(n) {
var r = t.styles[n] || {}, o = t.attributes[n] || {}, a = t.elements[n];
!R(a) || !V(a) || (Object.assign(a.style, r), Object.keys(o).forEach(function(c) {
var s = o[c];
s === !1 ? a.removeAttribute(c) : a.setAttribute(c, s === !0 ? "" : s);
}));
});
}
function Bt(e) {
var t = e.state, n = {
popper: {
position: t.options.strategy,
left: "0",
top: "0",
margin: "0"
},
arrow: { position: "absolute" },
reference: {}
};
return Object.assign(t.elements.popper.style, n.popper), t.styles = n, t.elements.arrow && Object.assign(t.elements.arrow.style, n.arrow), function() {
Object.keys(t.elements).forEach(function(r) {
var o = t.elements[r], a = t.attributes[r] || {}, s = Object.keys(t.styles.hasOwnProperty(r) ? t.styles[r] : n[r]).reduce(function(i, f) {
return i[f] = "", i;
}, {});
!R(o) || !V(o) || (Object.assign(o.style, s), Object.keys(a).forEach(function(i) {
o.removeAttribute(i);
}));
});
};
}
var ke = {
name: "applyStyles",
enabled: !0,
phase: "write",
fn: Tt,
effect: Bt,
requires: ["computeStyles"]
};
function C(e) {
return e.split("-")[0];
}
var J = Math.max, ve = Math.min, te = Math.round;
function Le() {
var e = navigator.userAgentData;
return e != null && e.brands && Array.isArray(e.brands) ? e.brands.map(function(t) {
return t.brand + "/" + t.version;
}).join(" ") : navigator.userAgent;
}
function at() {
return !/^((?!chrome|android).)*safari/i.test(Le());
}
function ne(e, t, n) {
t === void 0 && (t = !1), n === void 0 && (n = !1);
var r = e.getBoundingClientRect(), o = 1, a = 1;
t && R(e) && (o = e.offsetWidth > 0 && te(r.width) / e.offsetWidth || 1, a = e.offsetHeight > 0 && te(r.height) / e.offsetHeight || 1);
var s = (G(e) ? B(e) : window).visualViewport, i = !at() && n, f = (r.left + (i && s ? s.offsetLeft : 0)) / o, u = (r.top + (i && s ? s.offsetTop : 0)) / a, m = r.width / o, h = r.height / a;
return {
width: m,
height: h,
top: u,
right: f + m,
bottom: u + h,
left: f,
x: f,
y: u
};
}
function Pe(e) {
var t = ne(e), n = e.offsetWidth, r = e.offsetHeight;
return Math.abs(t.width - n) <= 1 && (n = t.width), Math.abs(t.height - r) <= 1 && (r = t.height), {
x: e.offsetLeft,
y: e.offsetTop,
width: n,
height: r
};
}
function st(e, t) {
var n = t.getRootNode && t.getRootNode();
if (e.contains(t)) return !0;
if (n && Ae(n)) {
var r = t;
do {
if (r && e.isSameNode(r)) return !0;
r = r.parentNode || r.host;
} while (r);
}
return !1;
}
function I$1(e) {
return B(e).getComputedStyle(e);
}
function Rt(e) {
return [
"table",
"td",
"th"
].indexOf(V(e)) >= 0;
}
function N$1(e) {
return ((G(e) ? e.ownerDocument : e.document) || window.document).documentElement;
}
function ye(e) {
return V(e) === "html" ? e : e.assignedSlot || e.parentNode || (Ae(e) ? e.host : null) || N$1(e);
}
function ft(e) {
return !R(e) || I$1(e).position === "fixed" ? null : e.offsetParent;
}
function Ht(e) {
var t = /firefox/i.test(Le());
if (/Trident/i.test(Le()) && R(e)) {
if (I$1(e).position === "fixed") return null;
}
var o = ye(e);
for (Ae(o) && (o = o.host); R(o) && ["html", "body"].indexOf(V(o)) < 0;) {
var a = I$1(o);
if (a.transform !== "none" || a.perspective !== "none" || a.contain === "paint" || ["transform", "perspective"].indexOf(a.willChange) !== -1 || t && a.willChange === "filter" || t && a.filter && a.filter !== "none") return o;
o = o.parentNode;
}
return null;
}
function se(e) {
for (var t = B(e), n = ft(e); n && Rt(n) && I$1(n).position === "static";) n = ft(n);
return n && (V(n) === "html" || V(n) === "body" && I$1(n).position === "static") ? t : n || Ht(e) || t;
}
function Me(e) {
return ["top", "bottom"].indexOf(e) >= 0 ? "x" : "y";
}
function fe(e, t, n) {
return J(e, ve(t, n));
}
function St(e, t, n) {
var r = fe(e, t, n);
return r > n ? n : r;
}
function ct() {
return {
top: 0,
right: 0,
bottom: 0,
left: 0
};
}
function ut(e) {
return Object.assign({}, ct(), e);
}
function pt(e, t) {
return t.reduce(function(n, r) {
return n[r] = e, n;
}, {});
}
var Vt = function(e, t) {
return e = typeof e == "function" ? e(Object.assign({}, t.rects, { placement: t.placement })) : e, ut(typeof e != "number" ? e : pt(e, Q));
};
function Ct(e) {
var t, n = e.state, r = e.name, o = e.options, a = n.elements.arrow, c = n.modifiersData.popperOffsets, s = C(n.placement), i = Me(s), u = [P$1, T$1].indexOf(s) >= 0 ? "height" : "width";
if (!(!a || !c)) {
var m = Vt(o.padding, n), h = Pe(a), l = i === "y" ? L : P$1, g = i === "y" ? W : T$1, p = n.rects.reference[u] + n.rects.reference[i] - c[i] - n.rects.popper[u], y = c[i] - n.rects.reference[i], b = se(a), x = b ? i === "y" ? b.clientHeight || 0 : b.clientWidth || 0 : 0, O = p / 2 - y / 2, d = m[l], v = x - h[u] - m[g], w = x / 2 - h[u] / 2 + O, $ = fe(d, w, v), j = i;
n.modifiersData[r] = (t = {}, t[j] = $, t.centerOffset = $ - w, t);
}
}
function qt(e) {
var t = e.state, r = e.options.element, o = r === void 0 ? "[data-popper-arrow]" : r;
o != null && (typeof o == "string" && (o = t.elements.popper.querySelector(o), !o) || st(t.elements.popper, o) && (t.elements.arrow = o));
}
var lt = {
name: "arrow",
enabled: !0,
phase: "main",
fn: Ct,
effect: qt,
requires: ["popperOffsets"],
requiresIfExists: ["preventOverflow"]
};
function re(e) {
return e.split("-")[1];
}
var It = {
top: "auto",
right: "auto",
bottom: "auto",
left: "auto"
};
function Nt(e, t) {
var n = e.x, r = e.y, o = t.devicePixelRatio || 1;
return {
x: te(n * o) / o || 0,
y: te(r * o) / o || 0
};
}
function dt(e) {
var t, n = e.popper, r = e.popperRect, o = e.placement, a = e.variation, c = e.offsets, s = e.position, i = e.gpuAcceleration, f = e.adaptive, u = e.roundOffsets, m = e.isFixed, h = c.x, l = h === void 0 ? 0 : h, g = c.y, p = g === void 0 ? 0 : g, y = typeof u == "function" ? u({
x: l,
y: p
}) : {
x: l,
y: p
};
l = y.x, p = y.y;
var b = c.hasOwnProperty("x"), x = c.hasOwnProperty("y"), O = P$1, d = L, v = window;
if (f) {
var w = se(n), $ = "clientHeight", j = "clientWidth";
if (w === B(n) && (w = N$1(n), I$1(w).position !== "static" && s === "absolute" && ($ = "scrollHeight", j = "scrollWidth")), w = w, o === L || (o === P$1 || o === T$1) && a === Z) {
d = W;
var D = m && w === v && v.visualViewport ? v.visualViewport.height : w[$];
p -= D - r.height, p *= i ? 1 : -1;
}
if (o === P$1 || (o === L || o === W) && a === Z) {
O = T$1;
var E = m && w === v && v.visualViewport ? v.visualViewport.width : w[j];
l -= E - r.width, l *= i ? 1 : -1;
}
}
var A = Object.assign({ position: s }, f && It), H = u === !0 ? Nt({
x: l,
y: p
}, B(n)) : {
x: l,
y: p
};
if (l = H.x, p = H.y, i) {
var k;
return Object.assign({}, A, (k = {}, k[d] = x ? "0" : "", k[O] = b ? "0" : "", k.transform = (v.devicePixelRatio || 1) <= 1 ? "translate(" + l + "px, " + p + "px)" : "translate3d(" + l + "px, " + p + "px, 0)", k));
}
return Object.assign({}, A, (t = {}, t[d] = x ? p + "px" : "", t[O] = b ? l + "px" : "", t.transform = "", t));
}
function Ft(e) {
var t = e.state, n = e.options, r = n.gpuAcceleration, o = r === void 0 ? !0 : r, a = n.adaptive, c = a === void 0 ? !0 : a, s = n.roundOffsets, i = s === void 0 ? !0 : s, f = {
placement: C(t.placement),
variation: re(t.placement),
popper: t.elements.popper,
popperRect: t.rects.popper,
gpuAcceleration: o,
isFixed: t.options.strategy === "fixed"
};
t.modifiersData.popperOffsets != null && (t.styles.popper = Object.assign({}, t.styles.popper, dt(Object.assign({}, f, {
offsets: t.modifiersData.popperOffsets,
position: t.options.strategy,
adaptive: c,
roundOffsets: i
})))), t.modifiersData.arrow != null && (t.styles.arrow = Object.assign({}, t.styles.arrow, dt(Object.assign({}, f, {
offsets: t.modifiersData.arrow,
position: "absolute",
adaptive: !1,
roundOffsets: i
})))), t.attributes.popper = Object.assign({}, t.attributes.popper, { "data-popper-placement": t.placement });
}
var We = {
name: "computeStyles",
enabled: !0,
phase: "beforeWrite",
fn: Ft,
data: {}
}, ge = { passive: !0 };
function Ut(e) {
var t = e.state, n = e.instance, r = e.options, o = r.scroll, a = o === void 0 ? !0 : o, c = r.resize, s = c === void 0 ? !0 : c, i = B(t.elements.popper), f = [].concat(t.scrollParents.reference, t.scrollParents.popper);
return a && f.forEach(function(u) {
u.addEventListener("scroll", n.update, ge);
}), s && i.addEventListener("resize", n.update, ge), function() {
a && f.forEach(function(u) {
u.removeEventListener("scroll", n.update, ge);
}), s && i.removeEventListener("resize", n.update, ge);
};
}
var Te = {
name: "eventListeners",
enabled: !0,
phase: "write",
fn: function() {},
effect: Ut,
data: {}
}, _t = {
left: "right",
right: "left",
bottom: "top",
top: "bottom"
};
function be(e) {
return e.replace(/left|right|bottom|top/g, function(t) {
return _t[t];
});
}
var zt = {
start: "end",
end: "start"
};
function ht(e) {
return e.replace(/start|end/g, function(t) {
return zt[t];
});
}
function Be(e) {
var t = B(e);
return {
scrollLeft: t.pageXOffset,
scrollTop: t.pageYOffset
};
}
function Re(e) {
return ne(N$1(e)).left + Be(e).scrollLeft;
}
function Xt(e, t) {
var n = B(e), r = N$1(e), o = n.visualViewport, a = r.clientWidth, c = r.clientHeight, s = 0, i = 0;
if (o) {
a = o.width, c = o.height;
var f = at();
(f || !f && t === "fixed") && (s = o.offsetLeft, i = o.offsetTop);
}
return {
width: a,
height: c,
x: s + Re(e),
y: i
};
}
function Yt(e) {
var t, n = N$1(e), r = Be(e), o = (t = e.ownerDocument) == null ? void 0 : t.body, a = J(n.scrollWidth, n.clientWidth, o ? o.scrollWidth : 0, o ? o.clientWidth : 0), c = J(n.scrollHeight, n.clientHeight, o ? o.scrollHeight : 0, o ? o.clientHeight : 0), s = -r.scrollLeft + Re(e), i = -r.scrollTop;
return I$1(o || n).direction === "rtl" && (s += J(n.clientWidth, o ? o.clientWidth : 0) - a), {
width: a,
height: c,
x: s,
y: i
};
}
function He(e) {
var t = I$1(e), n = t.overflow, r = t.overflowX, o = t.overflowY;
return /auto|scroll|overlay|hidden/.test(n + o + r);
}
function mt(e) {
return [
"html",
"body",
"#document"
].indexOf(V(e)) >= 0 ? e.ownerDocument.body : R(e) && He(e) ? e : mt(ye(e));
}
function ce(e, t) {
var n;
t === void 0 && (t = []);
var r = mt(e), o = r === ((n = e.ownerDocument) == null ? void 0 : n.body), a = B(r), c = o ? [a].concat(a.visualViewport || [], He(r) ? r : []) : r, s = t.concat(c);
return o ? s : s.concat(ce(ye(c)));
}
function Se(e) {
return Object.assign({}, e, {
left: e.x,
top: e.y,
right: e.x + e.width,
bottom: e.y + e.height
});
}
function Gt(e, t) {
var n = ne(e, !1, t === "fixed");
return n.top = n.top + e.clientTop, n.left = n.left + e.clientLeft, n.bottom = n.top + e.clientHeight, n.right = n.left + e.clientWidth, n.width = e.clientWidth, n.height = e.clientHeight, n.x = n.left, n.y = n.top, n;
}
function vt(e, t, n) {
return t === je ? Se(Xt(e, n)) : G(t) ? Gt(t, n) : Se(Yt(N$1(e)));
}
function Jt(e) {
var t = ce(ye(e)), r = ["absolute", "fixed"].indexOf(I$1(e).position) >= 0 && R(e) ? se(e) : e;
return G(r) ? t.filter(function(o) {
return G(o) && st(o, r) && V(o) !== "body";
}) : [];
}
function Kt(e, t, n, r) {
var o = t === "clippingParents" ? Jt(e) : [].concat(t), a = [].concat(o, [n]), c = a[0], s = a.reduce(function(i, f) {
var u = vt(e, f, r);
return i.top = J(u.top, i.top), i.right = ve(u.right, i.right), i.bottom = ve(u.bottom, i.bottom), i.left = J(u.left, i.left), i;
}, vt(e, c, r));
return s.width = s.right - s.left, s.height = s.bottom - s.top, s.x = s.left, s.y = s.top, s;
}
function yt(e) {
var t = e.reference, n = e.element, r = e.placement, o = r ? C(r) : null, a = r ? re(r) : null, c = t.x + t.width / 2 - n.width / 2, s = t.y + t.height / 2 - n.height / 2, i;
switch (o) {
case L:
i = {
x: c,
y: t.y - n.height
};
break;
case W:
i = {
x: c,
y: t.y + t.height
};
break;
case T$1:
i = {
x: t.x + t.width,
y: s
};
break;
case P$1:
i = {
x: t.x - n.width,
y: s
};
break;
default: i = {
x: t.x,
y: t.y
};
}
var f = o ? Me(o) : null;
if (f != null) {
var u = f === "y" ? "height" : "width";
switch (a) {
case Y$1:
i[f] = i[f] - (t[u] / 2 - n[u] / 2);
break;
case Z:
i[f] = i[f] + (t[u] / 2 - n[u] / 2);
break;
}
}
return i;
}
function oe(e, t) {
t === void 0 && (t = {});
var n = t, r = n.placement, o = r === void 0 ? e.placement : r, a = n.strategy, c = a === void 0 ? e.strategy : a, s = n.boundary, i = s === void 0 ? Ye : s, f = n.rootBoundary, u = f === void 0 ? je : f, m = n.elementContext, h = m === void 0 ? ee : m, l = n.altBoundary, g = l === void 0 ? !1 : l, p = n.padding, y = p === void 0 ? 0 : p, b = ut(typeof y != "number" ? y : pt(y, Q)), x = h === ee ? Ge : ee, O = e.rects.popper, d = e.elements[g ? x : h], v = Kt(G(d) ? d : d.contextElement || N$1(e.elements.popper), i, u, c), w = ne(e.elements.reference), $ = yt({
reference: w,
element: O,
placement: o
}), j = Se(Object.assign({}, O, $)), D = h === ee ? j : w, E = {
top: v.top - D.top + b.top,
bottom: D.bottom - v.bottom + b.bottom,
left: v.left - D.left + b.left,
right: D.right - v.right + b.right
}, A = e.modifiersData.offset;
if (h === ee && A) {
var H = A[o];
Object.keys(E).forEach(function(k) {
var F = [T$1, W].indexOf(k) >= 0 ? 1 : -1, U = [L, W].indexOf(k) >= 0 ? "y" : "x";
E[k] += H[U] * F;
});
}
return E;
}
function Qt(e, t) {
t === void 0 && (t = {});
var n = t, r = n.placement, o = n.boundary, a = n.rootBoundary, c = n.padding, s = n.flipVariations, i = n.allowedAutoPlacements, f = i === void 0 ? Ee : i, u = re(r), m = u ? s ? De : De.filter(function(g) {
return re(g) === u;
}) : Q, h = m.filter(function(g) {
return f.indexOf(g) >= 0;
});
h.length === 0 && (h = m);
var l = h.reduce(function(g, p) {
return g[p] = oe(e, {
placement: p,
boundary: o,
rootBoundary: a,
padding: c
})[C(p)], g;
}, {});
return Object.keys(l).sort(function(g, p) {
return l[g] - l[p];
});
}
function Zt(e) {
if (C(e) === me) return [];
var t = be(e);
return [
ht(e),
t,
ht(t)
];
}
function en(e) {
var t = e.state, n = e.options, r = e.name;
if (!t.modifiersData[r]._skip) {
for (var o = n.mainAxis, a = o === void 0 ? !0 : o, c = n.altAxis, s = c === void 0 ? !0 : c, i = n.fallbackPlacements, f = n.padding, u = n.boundary, m = n.rootBoundary, h = n.altBoundary, l = n.flipVariations, g = l === void 0 ? !0 : l, p = n.allowedAutoPlacements, y = t.options.placement, x = C(y) === y, O = i || (x || !g ? [be(y)] : Zt(y)), d = [y].concat(O).reduce(function(z, q) {
return z.concat(C(q) === me ? Qt(t, {
placement: q,
boundary: u,
rootBoundary: m,
padding: f,
flipVariations: g,
allowedAutoPlacements: p
}) : q);
}, []), v = t.rects.reference, w = t.rects.popper, $ = /* @__PURE__ */ new Map(), j = !0, D = d[0], E = 0; E < d.length; E++) {
var A = d[E], H = C(A), k = re(A) === Y$1, F = [L, W].indexOf(H) >= 0, U = F ? "width" : "height", M = oe(t, {
placement: A,
boundary: u,
rootBoundary: m,
altBoundary: h,
padding: f
}), S = F ? k ? T$1 : P$1 : k ? W : L;
v[U] > w[U] && (S = be(S));
var ue = be(S), _ = [];
if (a && _.push(M[H] <= 0), s && _.push(M[S] <= 0, M[ue] <= 0), _.every(function(z) {
return z;
})) {
D = A, j = !1;
break;
}
$.set(A, _);
}
if (j) {
for (var pe = g ? 3 : 1, xe = function(z) {
var q = d.find(function(de) {
var ae = $.get(de);
if (ae) return ae.slice(0, z).every(function(K) {
return K;
});
});
if (q) return D = q, "break";
}, ie = pe; ie > 0; ie--) if (xe(ie) === "break") break;
}
t.placement !== D && (t.modifiersData[r]._skip = !0, t.placement = D, t.reset = !0);
}
}
var gt = {
name: "flip",
enabled: !0,
phase: "main",
fn: en,
requiresIfExists: ["offset"],
data: { _skip: !1 }
};
function bt(e, t, n) {
return n === void 0 && (n = {
x: 0,
y: 0
}), {
top: e.top - t.height - n.y,
right: e.right - t.width + n.x,
bottom: e.bottom - t.height + n.y,
left: e.left - t.width - n.x
};
}
function wt(e) {
return [
L,
T$1,
W,
P$1
].some(function(t) {
return e[t] >= 0;
});
}
function tn(e) {
var t = e.state, n = e.name, r = t.rects.reference, o = t.rects.popper, a = t.modifiersData.preventOverflow, c = oe(t, { elementContext: "reference" }), s = oe(t, { altBoundary: !0 }), i = bt(c, r), f = bt(s, o, a), u = wt(i), m = wt(f);
t.modifiersData[n] = {
referenceClippingOffsets: i,
popperEscapeOffsets: f,
isReferenceHidden: u,
hasPopperEscaped: m
}, t.attributes.popper = Object.assign({}, t.attributes.popper, {
"data-popper-reference-hidden": u,
"data-popper-escaped": m
});
}
var xt = {
name: "hide",
enabled: !0,
phase: "main",
requiresIfExists: ["preventOverflow"],
fn: tn
};
function nn(e, t, n) {
var r = C(e), o = [P$1, L].indexOf(r) >= 0 ? -1 : 1, a = typeof n == "function" ? n(Object.assign({}, t, { placement: e })) : n, c = a[0], s = a[1];
return c = c || 0, s = (s || 0) * o, [P$1, T$1].indexOf(r) >= 0 ? {
x: s,
y: c
} : {
x: c,
y: s
};
}
function rn(e) {
var t = e.state, n = e.options, r = e.name, o = n.offset, a = o === void 0 ? [0, 0] : o, c = Ee.reduce(function(u, m) {
return u[m] = nn(m, t.rects, a), u;
}, {}), s = c[t.placement], i = s.x, f = s.y;
t.modifiersData.popperOffsets != null && (t.modifiersData.popperOffsets.x += i, t.modifiersData.popperOffsets.y += f), t.modifiersData[r] = c;
}
var Ot = {
name: "offset",
enabled: !0,
phase: "main",
requires: ["popperOffsets"],
fn: rn
};
function on(e) {
var t = e.state, n = e.name;
t.modifiersData[n] = yt({
reference: t.rects.reference,
element: t.rects.popper,
placement: t.placement
});
}
var Ve = {
name: "popperOffsets",
enabled: !0,
phase: "read",
fn: on,
data: {}
};
function an(e) {
return e === "x" ? "y" : "x";
}
function sn(e) {
var t = e.state, n = e.options, r = e.name, o = n.mainAxis, a = o === void 0 ? !0 : o, c = n.altAxis, s = c === void 0 ? !1 : c, i = n.boundary, f = n.rootBoundary, u = n.altBoundary, m = n.padding, h = n.tether, l = h === void 0 ? !0 : h, g = n.tetherOffset, p = g === void 0 ? 0 : g, y = oe(t, {
boundary: i,
rootBoundary: f,
padding: m,
altBoundary: u
}), b = C(t.placement), x = re(t.placement), O = !x, d = Me(b), v = an(d), w = t.modifiersData.popperOffsets, $ = t.rects.reference, j = t.rects.popper, D = typeof p == "function" ? p(Object.assign({}, t.rects, { placement: t.placement })) : p, E = typeof D == "number" ? {
mainAxis: D,
altAxis: D
} : Object.assign({
mainAxis: 0,
altAxis: 0
}, D), A = t.modifiersData.offset ? t.modifiersData.offset[t.placement] : null, H = {
x: 0,
y: 0
};
if (w) {
if (a) {
var k, F = d === "y" ? L : P$1, U = d === "y" ? W : T$1, M = d === "y" ? "height" : "width", S = w[d], ue = S + y[F], _ = S - y[U], pe = l ? -j[M] / 2 : 0, xe = x === Y$1 ? $[M] : j[M], ie = x === Y$1 ? -j[M] : -$[M], le = t.elements.arrow, z = l && le ? Pe(le) : {
width: 0,
height: 0
}, q = t.modifiersData["arrow#persistent"] ? t.modifiersData["arrow#persistent"].padding : ct(), de = q[F], ae = q[U], K = fe(0, $[M], z[M]), Et = O ? $[M] / 2 - pe - K - de - E.mainAxis : xe - K - de - E.mainAxis, At = O ? -$[M] / 2 + pe + K + ae + E.mainAxis : ie + K + ae + E.mainAxis, Oe = t.elements.arrow && se(t.elements.arrow), kt = Oe ? d === "y" ? Oe.clientTop || 0 : Oe.clientLeft || 0 : 0, Ce = (k = A == null ? void 0 : A[d]) != null ? k : 0, Lt = S + Et - Ce - kt, Pt = S + At - Ce, qe = fe(l ? ve(ue, Lt) : ue, S, l ? J(_, Pt) : _);
w[d] = qe, H[d] = qe - S;
}
if (s) {
var Ie, Mt = d === "x" ? L : P$1, Wt = d === "x" ? W : T$1, X = w[v], he = v === "y" ? "height" : "width", Ne = X + y[Mt], Fe = X - y[Wt], $e = [L, P$1].indexOf(b) !== -1, Ue = (Ie = A == null ? void 0 : A[v]) != null ? Ie : 0, _e = $e ? Ne : X - $[he] - j[he] - Ue + E.altAxis, ze = $e ? X + $[he] + j[he] - Ue - E.altAxis : Fe, Xe = l && $e ? St(_e, X, ze) : fe(l ? _e : Ne, X, l ? ze : Fe);
w[v] = Xe, H[v] = Xe - X;
}
t.modifiersData[r] = H;
}
}
var $t = {
name: "preventOverflow",
enabled: !0,
phase: "main",
fn: sn,
requiresIfExists: ["offset"]
};
function fn(e) {
return {
scrollLeft: e.scrollLeft,
scrollTop: e.scrollTop
};
}
function cn(e) {
return e === B(e) || !R(e) ? Be(e) : fn(e);
}
function un(e) {
var t = e.getBoundingClientRect(), n = te(t.width) / e.offsetWidth || 1, r = te(t.height) / e.offsetHeight || 1;
return n !== 1 || r !== 1;
}
function pn(e, t, n) {
n === void 0 && (n = !1);
var r = R(t), o = R(t) && un(t), a = N$1(t), c = ne(e, o, n), s = {
scrollLeft: 0,
scrollTop: 0
}, i = {
x: 0,
y: 0
};
return (r || !r && !n) && ((V(t) !== "body" || He(a)) && (s = cn(t)), R(t) ? (i = ne(t, !0), i.x += t.clientLeft, i.y += t.clientTop) : a && (i.x = Re(a))), {
x: c.left + s.scrollLeft - i.x,
y: c.top + s.scrollTop - i.y,
width: c.width,
height: c.height
};
}
function ln(e) {
var t = /* @__PURE__ */ new Map(), n = /* @__PURE__ */ new Set(), r = [];
e.forEach(function(a) {
t.set(a.name, a);
});
function o(a) {
n.add(a.name);
[].concat(a.requires || [], a.requiresIfExists || []).forEach(function(s) {
if (!n.has(s)) {
var i = t.get(s);
i && o(i);
}
}), r.push(a);
}
return e.forEach(function(a) {
n.has(a.name) || o(a);
}), r;
}
function dn(e) {
var t = ln(e);
return it.reduce(function(n, r) {
return n.concat(t.filter(function(o) {
return o.phase === r;
}));
}, []);
}
function hn(e) {
var t;
return function() {
return t || (t = new Promise(function(n) {
Promise.resolve().then(function() {
t = void 0, n(e());
});
})), t;
};
}
function mn(e) {
var t = e.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(t).map(function(n) {
return t[n];
});
}
var jt = {
placement: "bottom",
modifiers: [],
strategy: "absolute"
};
function Dt() {
for (var e = arguments.length, t = new Array(e), n = 0; n < e; n++) t[n] = arguments[n];
return !t.some(function(r) {
return !(r && typeof r.getBoundingClientRect == "function");
});
}
function we(e) {
e === void 0 && (e = {});
var t = e, n = t.defaultModifiers, r = n === void 0 ? [] : n, o = t.defaultOptions, a = o === void 0 ? jt : o;
return function(c, s, i) {
i === void 0 && (i = a);
var f = {
placement: "bottom",
orderedModifiers: [],
options: Object.assign({}, jt, a),
modifiersData: {},
elements: {
reference: c,
popper: s
},
attributes: {},
styles: {}
}, u = [], m = !1, h = {
state: f,
setOptions: function(p) {
var y = typeof p == "function" ? p(f.options) : p;
g(), f.options = Object.assign({}, a, f.options, y), f.scrollParents = {
reference: G(c) ? ce(c) : c.contextElement ? ce(c.contextElement) : [],
popper: ce(s)
};
var b = dn(mn([].concat(r, f.options.modifiers)));
return f.orderedModifiers = b.filter(function(x) {
return x.enabled;
}), l(), h.update();
},
forceUpdate: function() {
if (!m) {
var p = f.elements, y = p.reference, b = p.popper;
if (Dt(y, b)) {
f.rects = {
reference: pn(y, se(b), f.options.strategy === "fixed"),
popper: Pe(b)
}, f.reset = !1, f.placement = f.options.placement, f.orderedModifiers.forEach(function(j) {
return f.modifiersData[j.name] = Object.assign({}, j.data);
});
for (var x = 0; x < f.orderedModifiers.length; x++) {
if (f.reset === !0) {
f.reset = !1, x = -1;
continue;
}
var O = f.orderedModifiers[x], d = O.fn, v = O.options, w = v === void 0 ? {} : v, $ = O.name;
typeof d == "function" && (f = d({
state: f,
options: w,
name: $,
instance: h
}) || f);
}
}
}
},
update: hn(function() {
return new Promise(function(p) {
h.forceUpdate(), p(f);
});
}),
destroy: function() {
g(), m = !0;
}
};
if (!Dt(c, s)) return h;
h.setOptions(i).then(function(p) {
!m && i.onFirstUpdate && i.onFirstUpdate(p);
});
function l() {
f.orderedModifiers.forEach(function(p) {
var y = p.name, b = p.options, x = b === void 0 ? {} : b, O = p.effect;
if (typeof O == "function") {
var d = O({
state: f,
name: y,
instance: h,
options: x
}), v = function() {};
u.push(d || v);
}
});
}
function g() {
u.forEach(function(p) {
return p();
}), u = [];
}
return h;
};
}
var vn = we(), gn = we({ defaultModifiers: [
Te,
Ve,
We,
ke
] }), wn = we({ defaultModifiers: [
Te,
Ve,
We,
ke,
Ot,
gt,
$t,
lt,
xt
] });
//#endregion
//#region ../../packages/hooks/use-popper/index.ts
const usePopper = (referenceElementRef, popperElementRef, opts = {}) => {
const stateUpdater = {
name: "updateState",
enabled: true,
phase: "write",
fn: ({ state }) => {
const derivedState = deriveState(state);
Object.assign(states.value, derivedState);
},
requires: ["computeStyles"]
};
const options = (0, vue.computed)(() => {
const { onFirstUpdate, placement, strategy, modifiers } = (0, vue.unref)(opts);
return {
onFirstUpdate,
placement: placement || "bottom",
strategy: strategy || "absolute",
modifiers: [
...modifiers || [],
stateUpdater,
{
name: "applyStyles",
enabled: false
}
]
};
});
const instanceRef = (0, vue.shallowRef)();
const states = (0, vue.ref)({
styles: {
popper: {
position: (0, vue.unref)(options).strategy,
left: "0",
top: "0"
},
arrow: { position: "absolute" }
},
attributes: {}
});
const destroy = () => {
if (!instanceRef.value) return;
instanceRef.value.destroy();
instanceRef.value = void 0;
};
(0, vue.watch)(options, (newOptions) => {
const instance = (0, vue.unref)(instanceRef);
if (instance) instance.setOptions(newOptions);
}, { deep: true });
(0, vue.watch)([referenceElementRef, popperElementRef], ([referenceElement, popperElement]) => {
destroy();
if (!referenceElement || !popperElement) return;
instanceRef.value = wn(referenceElement, popperElement, (0, vue.unref)(options));
});
(0, vue.onBeforeUnmount)(() => {
destroy();
});
return {
state: (0, vue.computed)(() => ({ ...(0, vue.unref)(instanceRef)?.state || {} })),
styles: (0, vue.computed)(() => (0, vue.unref)(states).styles),
attributes: (0, vue.computed)(() => (0, vue.unref)(states).attributes),
update: () => (0, vue.unref)(instanceRef)?.update(),
forceUpdate: () => (0, vue.unref)(instanceRef)?.forceUpdate(),
instanceRef: (0, vue.computed)(() => (0, vue.unref)(instanceRef))
};
};
function deriveState(state) {
const elements = Object.keys(state.elements);
return {
styles: fromPairs(elements.map((element) => [element, state.styles[element] || {}])),
attributes: fromPairs(elements.map((element) => [element, state.attributes[element]]))
};
}
//#endregion
//#region ../../packages/hooks/use-same-target/index.ts
const useSameTarget = (handleClick) => {
if (!handleClick) return {
onClick: NOOP,
onMousedown: NOOP,
onMouseup: NOOP
};
let mousedownTarget = false;
let mouseupTarget = false;
const onClick = (e) => {
if (mousedownTarget && mouseupTarget) handleClick(e);
mousedownTarget = mouseupTarget = false;
};
const onMousedown = (e) => {
mousedownTarget = e.target === e.currentTarget;
};
const onMouseup = (e) => {
mouseupTarget = e.target === e.currentTarget;
};
return {
onClick,
onMousedown,
onMouseup
};
};
//#endregion
//#region ../../packages/hooks/use-teleport/index.ts
const useTeleport = (contentRenderer, appendToBody) => {
const isTeleportVisible = (0, vue.ref)(false);
if (!isClient) return {
isTeleportVisible,
showTeleport: NOOP,
hideTeleport: NOOP,
renderTeleport: NOOP
};
let $el = null;
const showTeleport = () => {
isTeleportVisible.value = true;
if ($el !== null) return;
$el = createGlobalNode();
};
const hideTeleport = () => {
isTeleportVisible.value = false;
if ($el !== null) {
removeGlobalNode($el);
$el = null;
}
};
const renderTeleport = () => {
return appendToBody.value !== true ? contentRenderer() : isTeleportVisible.value ? [(0, vue.h)(vue.Teleport, { to: $el }, contentRenderer())] : void 0;
};
(0, vue.onUnmounted)(hideTeleport);
return {
isTeleportVisible,
showTeleport,
hideTeleport,
renderTeleport
};
};
//#endregion
//#region ../../packages/hooks/use-throttle-render/index.ts
const useThrottleRender = (loading, throttle = 0) => {
if (throttle === 0) return loading;
const throttled = (0, vue.ref)(isObject$1(throttle) && Boolean(throttle.initVal));
let timeoutHandle = null;
const dispatchThrottling = (timer) => {
if (isUndefined(timer)) {
throttled.value = loading.value;
return;
}
if (timeoutHandle) clearTimeout(timeoutHandle);
timeoutHandle = setTimeout(() => {
throttled.value = loading.value;
}, timer);
};
const dispatcher = (type) => {
if (type === "leading") if (isNumber(throttle)) dispatchThrottling(throttle);
else dispatchThrottling(throttle.leading);
else if (isObject$1(throttle)) dispatchThrottling(throttle.trailing);
else throttled.value = false;
};
(0, vue.onMounted)(() => dispatcher("leading"));
(0, vue.watch)(() => loading.value, (val) => {
dispatcher(val ? "leading" : "trailing");
});
return throttled;
};
//#endregion
//#region ../../packages/hooks/use-timeout/index.ts
function useTimeout() {
let timeoutHandle;
const registerTimeout = (fn, delay) => {
cancelTimeout();
timeoutHandle = globalThis.setTimeout(fn, delay);
};
const cancelTimeout = () => {
if (timeoutHandle === void 0) return;
globalThis.clearTimeout(timeoutHandle);
timeoutHandle = void 0;
};
tryOnScopeDispose(() => cancelTimeout());
return {
registerTimeout,
cancelTimeout
};
}
//#endregion
//#region ../../packages/hooks/use-transition-fallthrough/index.ts
/* istanbul ignore file */
const AFTER_APPEAR = "after-appear";
const AFTER_ENTER = "after-enter";
const AFTER_LEAVE = "after-leave";
const APPEAR = "appear";
const APPEAR_CANCELLED = "appear-cancelled";
const BEFORE_ENTER = "before-enter";
const BEFORE_LEAVE = "before-leave";
const ENTER = "enter";
const ENTER_CANCELLED = "enter-cancelled";
const LEAVE = "leave";
const LEAVE_CANCELLED = "leave-cancelled";
const useTransitionFallthroughEmits = [
AFTER_APPEAR,
AFTER_ENTER,
AFTER_LEAVE,
APPEAR,
APPEAR_CANCELLED,
BEFORE_ENTER,
BEFORE_LEAVE,
ENTER,
ENTER_CANCELLED,
LEAVE,
LEAVE_CANCELLED
];
/**
* NOTE:
* This is only a delegator for delegating transition callbacks.
* Use this at your need.
*/
/**
* Simple usage
*
* In your setups:
*
* setup() {
* const fallthroughMethods = useTransitionFallthrough()
* return fallthrough
* }
*
* In your template:
*
* <template>
* <transition name="whatever" v-bind="fallthrough">
* <slot />
* </transition>
* </template>
*
*/
const useTransitionFallthrough = () => {
const { emit } = (0, vue.getCurrentInstance)();
return {
onAfterAppear: () => {
emit(AFTER_APPEAR);
},
onAfterEnter: () => {
emit(AFTER_ENTER);
},
onAfterLeave: () => {
emit(AFTER_LEAVE);
},
onAppearCancelled: () => {
emit(APPEAR_CANCELLED);
},
onBeforeEnter: () => {
emit(BEFORE_ENTER);
},
onBeforeLeave: () => {
emit(BEFORE_LEAVE);
},
onEnter: () => {
emit(ENTER);
},
onEnterCancelled: () => {
emit(ENTER_CANCELLED);
},
onLeave: () => {
emit(LEAVE);
},
onLeaveCancelled: () => {
emit(LEAVE_CANCELLED);
}
};
};
//#endregion
//#region ../../packages/hooks/use-id/index.ts
const defaultIdInjection = {
prefix: Math.floor(Math.random() * 1e4),
current: 0
};
const ID_INJECTION_KEY = Symbol("elIdInjection");
const useIdInjection = () => {
return (0, vue.getCurrentInstance)() ? (0, vue.inject)(ID_INJECTION_KEY, defaultIdInjection) : defaultIdInjection;
};
const useId = (deterministicId) => {
const idInjection = useIdInjection();
if (!isClient && idInjection === defaultIdInjection) /* @__PURE__ */ debugWarn("IdInjection", `Looks like you are using server rendering, you must provide a id provider to ensure the hydration process to be succeed
usage: app.provide(ID_INJECTION_KEY, {
prefix: number,
current: number,
})`);
const namespace = useGetDerivedNamespace();
return computedEager(() => (0, vue.unref)(deterministicId) || `${namespace.value}-id-${idInjection.prefix}-${idInjection.current++}`);
};
//#endregion
//#region ../../packages/hooks/use-escape-keydown/index.ts
let registeredEscapeHandlers = [];
const cachedHandler = (event) => {
if (getEventCode(event) === EVENT_CODE.esc) registeredEscapeHandlers.forEach((registeredHandler) => registeredHandler(event));
};
const useEscapeKeydown = (handler) => {
(0, vue.onMounted)(() => {
if (registeredEscapeHandlers.length === 0) document.addEventListener("keydown", cachedHandler);
if (isClient) registeredEscapeHandlers.push(handler);
});
(0, vue.onBeforeUnmount)(() => {
registeredEscapeHandlers = registeredEscapeHandlers.filter((registeredHandler) => registeredHandler !== handler);
if (registeredEscapeHandlers.length === 0) {
if (isClient) document.removeEventListener("keydown", cachedHandler);
}
});
};
//#endregion
//#region ../../packages/hooks/use-popper-container/index.ts
const usePopperContainerId = () => {
const namespace = useGetDerivedNamespace();
const idInjection = useIdInjection();
const id = (0, vue.computed)(() => {
return `${namespace.value}-popper-container-${idInjection.prefix}`;
});
return {
id,
selector: (0, vue.computed)(() => `#${id.value}`)
};
};
const createContainer = (id) => {
const container = document.createElement("div");
container.id = id;
document.body.appendChild(container);
return container;
};
const usePopperContainer = () => {
const { id, selector } = usePopperContainerId();
(0, vue.onBeforeMount)(() => {
if (!isClient) return;
if (!document.body.querySelector(selector.value)) createContainer(id.value);
});
return {
id,
selector
};
};
//#endregion
//#region ../../packages/hooks/use-intermediate-render/index.ts
const useDelayedRender = ({ indicator, intermediateIndicator, shouldSetIntermediate = () => true, beforeShow, afterShow, afterHide, beforeHide }) => {
(0, vue.watch)(() => (0, vue.unref)(indicator), (val) => {
if (val) {
beforeShow?.();
(0, vue.nextTick)(() => {
if (!(0, vue.unref)(indicator)) return;
if (shouldSetIntermediate("show")) intermediateIndicator.value = true;
});
} else {
beforeHide?.();
(0, vue.nextTick)(() => {
if ((0, vue.unref)(indicator)) return;
if (shouldSetIntermediate("hide")) intermediateIndicator.value = false;
});
}
});
(0, vue.watch)(() => intermediateIndicator.value, (val) => {
if (val) afterShow?.();
else afterHide?.();
});
};
//#endregion
//#region ../../packages/hooks/use-delayed-toggle/index.ts
/**
* @deprecated Removed after 3.0.0, Use `UseDelayedToggleProps` instead.
*/
const useDelayedToggleProps = buildProps({
showAfter: {
type: Number,
default: 0
},
hideAfter: {
type: Number,
default: 200
},
autoClose: {
type: Number,
default: 0
}
});
const useDelayedTogglePropsDefaults = {
showAfter: 0,
hideAfter: 200,
autoClose: 0
};
const useDelayedToggle = ({ showAfter, hideAfter, autoClose, open, close }) => {
const { registerTimeout } = useTimeout();
const { registerTimeout: registerTimeoutForAutoClose, cancelTimeout: cancelTimeoutForAutoClose } = useTimeout();
const onOpen = (event, delay = (0, vue.unref)(showAfter)) => {
registerTimeout(() => {
open(event);
const _autoClose = (0, vue.unref)(autoClose);
if (isNumber(_autoClose) && _autoClose > 0) registerTimeoutForAutoClose(() => {
close(event);
}, _autoClose);
}, delay);
};
const onClose = (event, delay = (0, vue.unref)(hideAfter)) => {
cancelTimeoutForAutoClose();
registerTimeout(() => {
close(event);
}, delay);
};
return {
onOpen,
onClose
};
};
//#endregion
//#region ../../packages/hooks/use-forward-ref/index.ts
const FORWARD_REF_INJECTION_KEY = Symbol("elForwardRef");
const useForwardRef = (forwardRef) => {
const setForwardRef = ((el) => {
forwardRef.value = el;
});
(0, vue.provide)(FORWARD_REF_INJECTION_KEY, { setForwardRef });
};
const useForwardRefDirective = (setForwardRef) => {
return {
mounted(el) {
setForwardRef(el);
},
updated(el) {
setForwardRef(el);
},
unmounted() {
setForwardRef(null);
}
};
};
//#endregion
//#region ../../packages/hooks/use-z-index/index.ts
const initial = { current: 0 };
const zIndex = (0, vue.ref)(0);
const defaultInitialZIndex = 2e3;
const ZINDEX_INJECTION_KEY = Symbol("elZIndexContextKey");
const zIndexContextKey = Symbol("zIndexContextKey");
const useZIndex = (zIndexOverrides) => {
const increasingInjection = (0, vue.getCurrentInstance)() ? (0, vue.inject)(ZINDEX_INJECTION_KEY, initial) : initial;
const zIndexInjection = zIndexOverrides || ((0, vue.getCurrentInstance)() ? (0, vue.inject)(zIndexContextKey, void 0) : void 0);
const initialZIndex = (0, vue.computed)(() => {
const zIndexFromInjection = (0, vue.unref)(zIndexInjection);
return isNumber(zIndexFromInjection) ? zIndexFromInjection : defaultInitialZIndex;
});
const currentZIndex = (0, vue.computed)(() => initialZIndex.value + zIndex.value);
const nextZIndex = () => {
increasingInjection.current++;
zIndex.value = increasingInjection.current;
return currentZIndex.value;
};
if (!isClient && !(0, vue.inject)(ZINDEX_INJECTION_KEY)) /* @__PURE__ */ debugWarn("ZIndexInjection", `Looks like you are using server rendering, you must provide a z-index provider to ensure the hydration process to be succeed
usage: app.provide(ZINDEX_INJECTION_KEY, { current: 0 })`);
return {
initialZIndex,
currentZIndex,
nextZIndex
};
};
//#endregion
//#region ../../node_modules/.pnpm/@floating-ui+utils@0.2.10/node_modules/@floating-ui/utils/dist/floating-ui.utils.mjs
const min$1 = Math.min;
const max$1 = Math.max;
const round = Math.round;
const floor$1 = Math.floor;
const createCoords = (v) => ({
x: v,
y: v
});
const oppositeSideMap = {
left: "right",
right: "left",
bottom: "top",
top: "bottom"
};
const oppositeAlignmentMap = {
start: "end",
end: "start"
};
function clamp(start, value, end) {
return max$1(start, min$1(value, end));
}
function evaluate(value, param) {
return typeof value === "function" ? value(param) : value;
}
function getSide(placement) {
return placement.split("-")[0];
}
function getAlignment(placement) {
return placement.split("-")[1];
}
function getOppositeAxis(axis) {
return axis === "x" ? "y" : "x";
}
function getAxisLength(axis) {
return axis === "y" ? "height" : "width";
}
const yAxisSides = /* @__PURE__ */ new Set(["top", "bottom"]);
function getSideAxis(placement) {
return yAxisSides.has(getSide(placement)) ? "y" : "x";
}
function getAlignmentAxis(placement) {
return getOppositeAxis(getSideAxis(placement));
}
function getAlignmentSides(placement, rects, rtl) {
if (rtl === void 0) rtl = false;
const alignment = getAlignment(placement);
const alignmentAxis = getAlignmentAxis(placement);
const length = getAxisLength(alignmentAxis);
let mainAlignmentSide = alignmentAxis === "x" ? alignment === (rtl ? "end" : "start") ? "right" : "left" : alignment === "start" ? "bottom" : "top";
if (rects.reference[length] > rects.floating[length]) mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
}
function getExpandedPlacements(placement) {
const oppositePlacement = getOppositePlacement(placement);
return [
getOppositeAlignmentPlacement(placement),
oppositePlacement,
getOppositeAlignmentPlacement(oppositePlacement)
];
}
function getOppositeAlignmentPlacement(placement) {
return placement.replace(/start|end/g, (alignment) => oppositeAlignmentMap[alignment]);
}
const lrPlacement = ["left", "right"];
const rlPlacement = ["right", "left"];
const tbPlacement = ["top", "bottom"];
const btPlacement = ["bottom", "top"];
function getSideList(side, isStart, rtl) {
switch (side) {
case "top":
case "bottom":
if (rtl) return isStart ? rlPlacement : lrPlacement;
return isStart ? lrPlacement : rlPlacement;
case "left":
case "right": return isStart ? tbPlacement : btPlacement;
default: return [];
}
}
function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
const alignment = getAlignment(placement);
let list = getSideList(getSide(placement), direction === "start", rtl);
if (alignment) {
list = list.map((side) => side + "-" + alignment);
if (flipAlignment) list = list.concat(list.map(getOppositeAlignmentPlacement));
}
return list;
}
function getOppositePlacement(placement) {
return placement.replace(/left|right|bottom|top/g, (side) => oppositeSideMap[side]);
}
function expandPaddingObject(padding) {
return {
top: 0,
right: 0,
bottom: 0,
left: 0,
...padding
};
}
function getPaddingObject(padding) {
return typeof padding !== "number" ? expandPaddingObject(padding) : {
top: padding,
right: padding,
bottom: padding,
left: padding
};
}
function rectToClientRect(rect) {
const { x, y, width, height } = rect;
return {
width,
height,
top: y,
left: x,
right: x + width,
bottom: y + height,
x,
y
};
}
//#endregion
//#region ../../node_modules/.pnpm/@floating-ui+core@1.7.3/node_modules/@floating-ui/core/dist/floating-ui.core.mjs
function computeCoordsFromPlacement(_ref, placement, rtl) {
let { reference, floating } = _ref;
const sideAxis = getSideAxis(placement);
const alignmentAxis = getAlignmentAxis(placement);
const alignLength = getAxisLength(alignmentAxis);
const side = getSide(placement);
const isVertical = sideAxis === "y";
const commonX = reference.x + reference.width / 2 - floating.width / 2;
const commonY = reference.y + reference.height / 2 - floating.height / 2;
const commonAlign = reference[alignLength] / 2 - floating[alignLength] / 2;
let coords;
switch (side) {
case "top":
coords = {
x: commonX,
y: reference.y - floating.height
};
break;
case "bottom":
coords = {
x: commonX,
y: reference.y + reference.height
};
break;
case "right":
coords = {
x: reference.x + reference.width,
y: commonY
};
break;
case "left":
coords = {
x: reference.x - floating.width,
y: commonY
};
break;
default: coords = {
x: reference.x,
y: reference.y
};
}
switch (getAlignment(placement)) {
case "start":
coords[alignmentAxis] -= commonAlign * (rtl && isVertical ? -1 : 1);
break;
case "end":
coords[alignmentAxis] += commonAlign * (rtl && isVertical ? -1 : 1);
break;
}
return coords;
}
/**
* Computes the `x` and `y` coordinates that will place the floating element
* next to a given reference element.
*
* This export does not have any `platform` interface logic. You will need to
* write one for the platform you are using Floating UI with.
*/
const computePosition$1 = async (reference, floating, config) => {
const { placement = "bottom", strategy = "absolute", middleware = [], platform } = config;
const validMiddleware = middleware.filter(Boolean);
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
let rects = await platform.getElementRects({
reference,
floating,
strategy
});
let { x, y } = computeCoordsFromPlacement(rects, placement, rtl);
let statefulPlacement = placement;
let middlewareData = {};
let resetCount = 0;
for (let i = 0; i < validMiddleware.length; i++) {
const { name, fn } = validMiddleware[i];
const { x: nextX, y: nextY, data, reset } = await fn({
x,
y,
initialPlacement: placement,
placement: statefulPlacement,
strategy,
middlewareData,
rects,
platform,
elements: {
reference,
floating
}
});
x = nextX != null ? nextX : x;
y = nextY != null ? nextY : y;
middlewareData = {
...middlewareData,
[name]: {
...middlewareData[name],
...data
}
};
if (reset && resetCount <= 50) {
resetCount++;
if (typeof reset === "object") {
if (reset.placement) statefulPlacement = reset.placement;
if (reset.rects) rects = reset.rects === true ? await platform.getElementRects({
reference,
floating,
strategy
}) : reset.rects;
({x, y} = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
}
i = -1;
}
}
return {
x,
y,
placement: statefulPlacement,
strategy,
middlewareData
};
};
/**
* Resolves with an object of overflow side offsets that determine how much the
* element is overflowing a given clipping boundary on each side.
* - positive = overflowing the boundary by that number of pixels
* - negative = how many pixels left before it will overflow
* - 0 = lies flush with the boundary
* @see https://floating-ui.com/docs/detectOverflow
*/
async function detectOverflow$1(state, options) {
var _await$platform$isEle;
if (options === void 0) options = {};
const { x, y, platform, rects, elements, strategy } = state;
const { boundary = "clippingAncestors", rootBoundary = "viewport", elementContext = "floating", altBoundary = false, padding = 0 } = evaluate(options, state);
const paddingObject = getPaddingObject(padding);
const element = elements[altBoundary ? elementContext === "floating" ? "reference" : "floating" : elementContext];
const clippingClientRect = rectToClientRect(await platform.getClippingRect({
element: ((_await$platform$isEle = await (platform.isElement == null ? void 0 : platform.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || await (platform.getDocumentElement == null ? void 0 : platform.getDocumentElement(elements.floating)),
boundary,
rootBoundary,
strategy
}));
const rect = elementContext === "floating" ? {
x,
y,
width: rects.floating.width,
height: rects.floating.height
} : rects.reference;
const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
const offsetScale = await (platform.isElement == null ? void 0 : platform.isElement(offsetParent)) ? await (platform.getScale == null ? void 0 : platform.getScale(offsetParent)) || {
x: 1,
y: 1
} : {
x: 1,
y: 1
};
const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
elements,
rect,
offsetParent,
strategy
}) : rect);
return {
top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
};
}
/**
* Provides data to position an inner element of the floating element so that it
* appears centered to the reference element.
* @see https://floating-ui.com/docs/arrow
*/
const arrow$1 = (options) => ({
name: "arrow",
options,
async fn(state) {
const { x, y, placement, rects, platform, elements, middlewareData } = state;
const { element, padding = 0 } = evaluate(options, state) || {};
if (element == null) return {};
const paddingObject = getPaddingObject(padding);
const coords = {
x,
y
};
const axis = getAlignmentAxis(placement);
const length = getAxisLength(axis);
const arrowDimensions = await platform.getDimensions(element);
const isYAxis = axis === "y";
const minProp = isYAxis ? "top" : "left";
const maxProp = isYAxis ? "bottom" : "right";
const clientProp = isYAxis ? "clientHeight" : "clientWidth";
const endDiff = rects.reference[length] + rects.reference[axis] - coords[axis] - rects.floating[length];
const startDiff = coords[axis] - rects.reference[axis];
const arrowOffsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(element));
let clientSize = arrowOffsetParent ? arrowOffsetParent[clientProp] : 0;
if (!clientSize || !await (platform.isElement == null ? void 0 : platform.isElement(arrowOffsetParent))) clientSize = elements.floating[clientProp] || rects.floating[length];
const centerToReference = endDiff / 2 - startDiff / 2;
const largestPossiblePadding = clientSize / 2 - arrowDimensions[length] / 2 - 1;
const minPadding = min$1(paddingObject[minProp], largestPossiblePadding);
const maxPadding = min$1(paddingObject[maxProp], largestPossiblePadding);
const min$1$1 = minPadding;
const max = clientSize - arrowDimensions[length] - maxPadding;
const center = clientSize / 2 - arrowDimensions[length] / 2 + centerToReference;
const offset = clamp(min$1$1, center, max);
const shouldAddOffset = !middlewareData.arrow && getAlignment(placement) != null && center !== offset && rects.reference[length] / 2 - (center < min$1$1 ? minPadding : maxPadding) - arrowDimensions[length] / 2 < 0;
const alignmentOffset = shouldAddOffset ? center < min$1$1 ? center - min$1$1 : center - max : 0;
return {
[axis]: coords[axis] + alignmentOffset,
data: {
[axis]: offset,
centerOffset: center - offset - alignmentOffset,
...shouldAddOffset && { alignmentOffset }
},
reset: shouldAddOffset
};
}
});
/**
* Optimizes the visibility of the floating element by flipping the `placement`
* in order to keep it in view when the preferred placement(s) will overflow the
* clipping boundary. Alternative to `autoPlacement`.
* @see https://floating-ui.com/docs/flip
*/
const flip$1 = function(options) {
if (options === void 0) options = {};
return {
name: "flip",
options,
async fn(state) {
var _middlewareData$arrow, _middlewareData$flip;
const { placement, middlewareData, rects, initialPlacement, platform, elements } = state;
const { mainAxis: checkMainAxis = true, crossAxis: checkCrossAxis = true, fallbackPlacements: specifiedFallbackPlacements, fallbackStrategy = "bestFit", fallbackAxisSideDirection = "none", flipAlignment = true, ...detectOverflowOptions } = evaluate(options, state);
if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) return {};
const side = getSide(placement);
const initialSideAxis = getSideAxis(initialPlacement);
const isBasePlacement = getSide(initialPlacement) === initialPlacement;
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
const hasFallbackAxisSideDirection = fallbackAxisSideDirection !== "none";
if (!specifiedFallbackPlacements && hasFallbackAxisSideDirection) fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
const placements = [initialPlacement, ...fallbackPlacements];
const overflow = await detectOverflow$1(state, detectOverflowOptions);
const overflows = [];
let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
if (checkMainAxis) overflows.push(overflow[side]);
if (checkCrossAxis) {
const sides = getAlignmentSides(placement, rects, rtl);
overflows.push(overflow[sides[0]], overflow[sides[1]]);
}
overflowsData = [...overflowsData, {
placement,
overflows
}];
if (!overflows.every((side) => side <= 0)) {
var _middlewareData$flip2, _overflowsData$filter;
const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
const nextPlacement = placements[nextIndex];
if (nextPlacement) {
if (!(checkCrossAxis === "alignment" ? initialSideAxis !== getSideAxis(nextPlacement) : false) || overflowsData.every((d) => getSideAxis(d.placement) === initialSideAxis ? d.overflows[0] > 0 : true)) return {
data: {
index: nextIndex,
overflows: overflowsData
},
reset: { placement: nextPlacement }
};
}
let resetPlacement = (_overflowsData$filter = overflowsData.filter((d) => d.overflows[0] <= 0).sort((a, b) => a.overflows[1] - b.overflows[1])[0]) == null ? void 0 : _overflowsData$filter.placement;
if (!resetPlacement) switch (fallbackStrategy) {
case "bestFit": {
var _overflowsData$filter2;
const placement = (_overflowsData$filter2 = overflowsData.filter((d) => {
if (hasFallbackAxisSideDirection) {
const currentSideAxis = getSideAxis(d.placement);
return currentSideAxis === initialSideAxis || currentSideAxis === "y";
}
return true;
}).map((d) => [d.placement, d.overflows.filter((overflow) => overflow > 0).reduce((acc, overflow) => acc + overflow, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? void 0 : _overflowsData$filter2[0];
if (placement) resetPlacement = placement;
break;
}
case "initialPlacement":
resetPlacement = initialPlacement;
break;
}
if (placement !== resetPlacement) return { reset: { placement: resetPlacement } };
}
return {};
}
};
};
const originSides = /* @__PURE__ */ new Set(["left", "top"]);
async function convertValueToCoords(state, options) {
const { placement, platform, elements } = state;
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
const side = getSide(placement);
const alignment = getAlignment(placement);
const isVertical = getSideAxis(placement) === "y";
const mainAxisMulti = originSides.has(side) ? -1 : 1;
const crossAxisMulti = rtl && isVertical ? -1 : 1;
const rawValue = evaluate(options, state);
let { mainAxis, crossAxis, alignmentAxis } = typeof rawValue === "number" ? {
mainAxis: rawValue,
crossAxis: 0,
alignmentAxis: null
} : {
mainAxis: rawValue.mainAxis || 0,
crossAxis: rawValue.crossAxis || 0,
alignmentAxis: rawValue.alignmentAxis
};
if (alignment && typeof alignmentAxis === "number") crossAxis = alignment === "end" ? alignmentAxis * -1 : alignmentAxis;
return isVertical ? {
x: crossAxis * crossAxisMulti,
y: mainAxis * mainAxisMulti
} : {
x: mainAxis * mainAxisMulti,
y: crossAxis * crossAxisMulti
};
}
/**
* Modifies the placement by translating the floating element along the
* specified axes.
* A number (shorthand for `mainAxis` or distance), or an axes configuration
* object may be passed.
* @see https://floating-ui.com/docs/offset
*/
const offset$1 = function(options) {
if (options === void 0) options = 0;
return {
name: "offset",
options,
async fn(state) {
var _middlewareData$offse, _middlewareData$arrow;
const { x, y, placement, middlewareData } = state;
const diffCoords = await convertValueToCoords(state, options);
if (placement === ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse.placement) && (_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) return {};
return {
x: x + diffCoords.x,
y: y + diffCoords.y,
data: {
...diffCoords,
placement
}
};
}
};
};
/**
* Optimizes the visibility of the floating element by shifting it in order to
* keep it in view when it will overflow the clipping boundary.
* @see https://floating-ui.com/docs/shift
*/
const shift$1 = function(options) {
if (options === void 0) options = {};
return {
name: "shift",
options,
async fn(state) {
const { x, y, placement } = state;
const { mainAxis: checkMainAxis = true, crossAxis: checkCrossAxis = false, limiter = { fn: (_ref) => {
let { x, y } = _ref;
return {
x,
y
};
} }, ...detectOverflowOptions } = evaluate(options, state);
const coords = {
x,
y
};
const overflow = await detectOverflow$1(state, detectOverflowOptions);
const crossAxis = getSideAxis(getSide(placement));
const mainAxis = getOppositeAxis(crossAxis);
let mainAxisCoord = coords[mainAxis];
let crossAxisCoord = coords[crossAxis];
if (checkMainAxis) {
const minSide = mainAxis === "y" ? "top" : "left";
const maxSide = mainAxis === "y" ? "bottom" : "right";
const min = mainAxisCoord + overflow[minSide];
const max = mainAxisCoord - overflow[maxSide];
mainAxisCoord = clamp(min, mainAxisCoord, max);
}
if (checkCrossAxis) {
const minSide = crossAxis === "y" ? "top" : "left";
const maxSide = crossAxis === "y" ? "bottom" : "right";
const min = crossAxisCoord + overflow[minSide];
const max = crossAxisCoord - overflow[maxSide];
crossAxisCoord = clamp(min, crossAxisCoord, max);
}
const limitedCoords = limiter.fn({
...state,
[mainAxis]: mainAxisCoord,
[crossAxis]: crossAxisCoord
});
return {
...limitedCoords,
data: {
x: limitedCoords.x - x,
y: limitedCoords.y - y,
enabled: {
[mainAxis]: checkMainAxis,
[crossAxis]: checkCrossAxis
}
}
};
}
};
};
//#endregion
//#region ../../node_modules/.pnpm/@floating-ui+utils@0.2.10/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.mjs
function hasWindow() {
return typeof window !== "undefined";
}
function getNodeName(node) {
if (isNode(node)) return (node.nodeName || "").toLowerCase();
return "#document";
}
function getWindow(node) {
var _node$ownerDocument;
return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
}
function getDocumentElement(node) {
var _ref;
return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement;
}
function isNode(value) {
if (!hasWindow()) return false;
return value instanceof Node || value instanceof getWindow(value).Node;
}
function isElement(value) {
if (!hasWindow()) return false;
return value instanceof Element || value instanceof getWindow(value).Element;
}
function isHTMLElement(value) {
if (!hasWindow()) return false;
return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement;
}
function isShadowRoot(value) {
if (!hasWindow() || typeof ShadowRoot === "undefined") return false;
return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
}
const invalidOverflowDisplayValues = /* @__PURE__ */ new Set(["inline", "contents"]);
function isOverflowElement(element) {
const { overflow, overflowX, overflowY, display } = getComputedStyle$1(element);
return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !invalidOverflowDisplayValues.has(display);
}
const tableElements = /* @__PURE__ */ new Set([
"table",
"td",
"th"
]);
function isTableElement(element) {
return tableElements.has(getNodeName(element));
}
const topLayerSelectors = [":popover-open", ":modal"];
function isTopLayer(element) {
return topLayerSelectors.some((selector) => {
try {
return element.matches(selector);
} catch (_e) {
return false;
}
});
}
const transformProperties = [
"transform",
"translate",
"scale",
"rotate",
"perspective"
];
const willChangeValues = [
"transform",
"translate",
"scale",
"rotate",
"perspective",
"filter"
];
const containValues = [
"paint",
"layout",
"strict",
"content"
];
function isContainingBlock(elementOrCss) {
const webkit = isWebKit();
const css = isElement(elementOrCss) ? getComputedStyle$1(elementOrCss) : elementOrCss;
return transformProperties.some((value) => css[value] ? css[value] !== "none" : false) || (css.containerType ? css.containerType !== "normal" : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== "none" : false) || !webkit && (css.filter ? css.filter !== "none" : false) || willChangeValues.some((value) => (css.willChange || "").includes(value)) || containValues.some((value) => (css.contain || "").includes(value));
}
function getContainingBlock(element) {
let currentNode = getParentNode(element);
while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
if (isContainingBlock(currentNode)) return currentNode;
else if (isTopLayer(currentNode)) return null;
currentNode = getParentNode(currentNode);
}
return null;
}
function isWebKit() {
if (typeof CSS === "undefined" || !CSS.supports) return false;
return CSS.supports("-webkit-backdrop-filter", "none");
}
const lastTraversableNodeNames = /* @__PURE__ */ new Set([
"html",
"body",
"#document"
]);
function isLastTraversableNode(node) {
return lastTraversableNodeNames.has(getNodeName(node));
}
function getComputedStyle$1(element) {
return getWindow(element).getComputedStyle(element);
}
function getNodeScroll(element) {
if (isElement(element)) return {
scrollLeft: element.scrollLeft,
scrollTop: element.scrollTop
};
return {
scrollLeft: element.scrollX,
scrollTop: element.scrollY
};
}
function getParentNode(node) {
if (getNodeName(node) === "html") return node;
const result = node.assignedSlot || node.parentNode || isShadowRoot(node) && node.host || getDocumentElement(node);
return isShadowRoot(result) ? result.host : result;
}
function getNearestOverflowAncestor(node) {
const parentNode = getParentNode(node);
if (isLastTraversableNode(parentNode)) return node.ownerDocument ? node.ownerDocument.body : node.body;
if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) return parentNode;
return getNearestOverflowAncestor(parentNode);
}
function getOverflowAncestors(node, list, traverseIframes) {
var _node$ownerDocument2;
if (list === void 0) list = [];
if (traverseIframes === void 0) traverseIframes = true;
const scrollableAncestor = getNearestOverflowAncestor(node);
const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body);
const win = getWindow(scrollableAncestor);
if (isBody) {
const frameElement = getFrameElement(win);
return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
}
return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
}
function getFrameElement(win) {
return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
}
//#endregion
//#region ../../node_modules/.pnpm/@floating-ui+dom@1.7.4/node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs
function getCssDimensions(element) {
const css = getComputedStyle$1(element);
let width = parseFloat(css.width) || 0;
let height = parseFloat(css.height) || 0;
const hasOffset = isHTMLElement(element);
const offsetWidth = hasOffset ? element.offsetWidth : width;
const offsetHeight = hasOffset ? element.offsetHeight : height;
const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
if (shouldFallback) {
width = offsetWidth;
height = offsetHeight;
}
return {
width,
height,
$: shouldFallback
};
}
function unwrapElement(element) {
return !isElement(element) ? element.contextElement : element;
}
function getScale(element) {
const domElement = unwrapElement(element);
if (!isHTMLElement(domElement)) return createCoords(1);
const rect = domElement.getBoundingClientRect();
const { width, height, $ } = getCssDimensions(domElement);
let x = ($ ? round(rect.width) : rect.width) / width;
let y = ($ ? round(rect.height) : rect.height) / height;
if (!x || !Number.isFinite(x)) x = 1;
if (!y || !Number.isFinite(y)) y = 1;
return {
x,
y
};
}
const noOffsets = /* @__PURE__ */ createCoords(0);
function getVisualOffsets(element) {
const win = getWindow(element);
if (!isWebKit() || !win.visualViewport) return noOffsets;
return {
x: win.visualViewport.offsetLeft,
y: win.visualViewport.offsetTop
};
}
function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
if (isFixed === void 0) isFixed = false;
if (!floatingOffsetParent || isFixed && floatingOffsetParent !== getWindow(element)) return false;
return isFixed;
}
function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
if (includeScale === void 0) includeScale = false;
if (isFixedStrategy === void 0) isFixedStrategy = false;
const clientRect = element.getBoundingClientRect();
const domElement = unwrapElement(element);
let scale = createCoords(1);
if (includeScale) if (offsetParent) {
if (isElement(offsetParent)) scale = getScale(offsetParent);
} else scale = getScale(element);
const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0);
let x = (clientRect.left + visualOffsets.x) / scale.x;
let y = (clientRect.top + visualOffsets.y) / scale.y;
let width = clientRect.width / scale.x;
let height = clientRect.height / scale.y;
if (domElement) {
const win = getWindow(domElement);
const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
let currentWin = win;
let currentIFrame = getFrameElement(currentWin);
while (currentIFrame && offsetParent && offsetWin !== currentWin) {
const iframeScale = getScale(currentIFrame);
const iframeRect = currentIFrame.getBoundingClientRect();
const css = getComputedStyle$1(currentIFrame);
const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
x *= iframeScale.x;
y *= iframeScale.y;
width *= iframeScale.x;
height *= iframeScale.y;
x += left;
y += top;
currentWin = getWindow(currentIFrame);
currentIFrame = getFrameElement(currentWin);
}
}
return rectToClientRect({
width,
height,
x,
y
});
}
function getWindowScrollBarX(element, rect) {
const leftScroll = getNodeScroll(element).scrollLeft;
if (!rect) return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
return rect.left + leftScroll;
}
function getHTMLOffset(documentElement, scroll) {
const htmlRect = documentElement.getBoundingClientRect();
return {
x: htmlRect.left + scroll.scrollLeft - getWindowScrollBarX(documentElement, htmlRect),
y: htmlRect.top + scroll.scrollTop
};
}
function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
let { elements, rect, offsetParent, strategy } = _ref;
const isFixed = strategy === "fixed";
const documentElement = getDocumentElement(offsetParent);
const topLayer = elements ? isTopLayer(elements.floating) : false;
if (offsetParent === documentElement || topLayer && isFixed) return rect;
let scroll = {
scrollLeft: 0,
scrollTop: 0
};
let scale = createCoords(1);
const offsets = createCoords(0);
const isOffsetParentAnElement = isHTMLElement(offsetParent);
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) scroll = getNodeScroll(offsetParent);
if (isHTMLElement(offsetParent)) {
const offsetRect = getBoundingClientRect(offsetParent);
scale = getScale(offsetParent);
offsets.x = offsetRect.x + offsetParent.clientLeft;
offsets.y = offsetRect.y + offsetParent.clientTop;
}
}
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
return {
width: rect.width * scale.x,
height: rect.height * scale.y,
x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x,
y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y
};
}
function getClientRects(element) {
return Array.from(element.getClientRects());
}
function getDocumentRect(element) {
const html = getDocumentElement(element);
const scroll = getNodeScroll(element);
const body = element.ownerDocument.body;
const width = max$1(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
const height = max$1(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
let x = -scroll.scrollLeft + getWindowScrollBarX(element);
const y = -scroll.scrollTop;
if (getComputedStyle$1(body).direction === "rtl") x += max$1(html.clientWidth, body.clientWidth) - width;
return {
width,
height,
x,
y
};
}
const SCROLLBAR_MAX = 25;
function getViewportRect(element, strategy) {
const win = getWindow(element);
const html = getDocumentElement(element);
const visualViewport = win.visualViewport;
let width = html.clientWidth;
let height = html.clientHeight;
let x = 0;
let y = 0;
if (visualViewport) {
width = visualViewport.width;
height = visualViewport.height;
const visualViewportBased = isWebKit();
if (!visualViewportBased || visualViewportBased && strategy === "fixed") {
x = visualViewport.offsetLeft;
y = visualViewport.offsetTop;
}
}
const windowScrollbarX = getWindowScrollBarX(html);
if (windowScrollbarX <= 0) {
const doc = html.ownerDocument;
const body = doc.body;
const bodyStyles = getComputedStyle(body);
const bodyMarginInline = doc.compatMode === "CSS1Compat" ? parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight) || 0 : 0;
const clippingStableScrollbarWidth = Math.abs(html.clientWidth - body.clientWidth - bodyMarginInline);
if (clippingStableScrollbarWidth <= SCROLLBAR_MAX) width -= clippingStableScrollbarWidth;
} else if (windowScrollbarX <= SCROLLBAR_MAX) width += windowScrollbarX;
return {
width,
height,
x,
y
};
}
const absoluteOrFixed = /* @__PURE__ */ new Set(["absolute", "fixed"]);
function getInnerBoundingClientRect(element, strategy) {
const clientRect = getBoundingClientRect(element, true, strategy === "fixed");
const top = clientRect.top + element.clientTop;
const left = clientRect.left + element.clientLeft;
const scale = isHTMLElement(element) ? getScale(element) : createCoords(1);
return {
width: element.clientWidth * scale.x,
height: element.clientHeight * scale.y,
x: left * scale.x,
y: top * scale.y
};
}
function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
let rect;
if (clippingAncestor === "viewport") rect = getViewportRect(element, strategy);
else if (clippingAncestor === "document") rect = getDocumentRect(getDocumentElement(element));
else if (isElement(clippingAncestor)) rect = getInnerBoundingClientRect(clippingAncestor, strategy);
else {
const visualOffsets = getVisualOffsets(element);
rect = {
x: clippingAncestor.x - visualOffsets.x,
y: clippingAncestor.y - visualOffsets.y,
width: clippingAncestor.width,
height: clippingAncestor.height
};
}
return rectToClientRect(rect);
}
function hasFixedPositionAncestor(element, stopNode) {
const parentNode = getParentNode(element);
if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) return false;
return getComputedStyle$1(parentNode).position === "fixed" || hasFixedPositionAncestor(parentNode, stopNode);
}
function getClippingElementAncestors(element, cache) {
const cachedResult = cache.get(element);
if (cachedResult) return cachedResult;
let result = getOverflowAncestors(element, [], false).filter((el) => isElement(el) && getNodeName(el) !== "body");
let currentContainingBlockComputedStyle = null;
const elementIsFixed = getComputedStyle$1(element).position === "fixed";
let currentNode = elementIsFixed ? getParentNode(element) : element;
while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
const computedStyle = getComputedStyle$1(currentNode);
const currentNodeIsContaining = isContainingBlock(currentNode);
if (!currentNodeIsContaining && computedStyle.position === "fixed") currentContainingBlockComputedStyle = null;
if (elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === "static" && !!currentContainingBlockComputedStyle && absoluteOrFixed.has(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode)) result = result.filter((ancestor) => ancestor !== currentNode);
else currentContainingBlockComputedStyle = computedStyle;
currentNode = getParentNode(currentNode);
}
cache.set(element, result);
return result;
}
function getClippingRect(_ref) {
let { element, boundary, rootBoundary, strategy } = _ref;
const clippingAncestors = [...boundary === "clippingAncestors" ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary), rootBoundary];
const firstClippingAncestor = clippingAncestors[0];
const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
accRect.top = max$1(rect.top, accRect.top);
accRect.right = min$1(rect.right, accRect.right);
accRect.bottom = min$1(rect.bottom, accRect.bottom);
accRect.left = max$1(rect.left, accRect.left);
return accRect;
}, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
return {
width: clippingRect.right - clippingRect.left,
height: clippingRect.bottom - clippingRect.top,
x: clippingRect.left,
y: clippingRect.top
};
}
function getDimensions(element) {
const { width, height } = getCssDimensions(element);
return {
width,
height
};
}
function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
const isOffsetParentAnElement = isHTMLElement(offsetParent);
const documentElement = getDocumentElement(offsetParent);
const isFixed = strategy === "fixed";
const rect = getBoundingClientRect(element, true, isFixed, offsetParent);
let scroll = {
scrollLeft: 0,
scrollTop: 0
};
const offsets = createCoords(0);
function setLeftRTLScrollbarOffset() {
offsets.x = getWindowScrollBarX(documentElement);
}
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) scroll = getNodeScroll(offsetParent);
if (isOffsetParentAnElement) {
const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
offsets.x = offsetRect.x + offsetParent.clientLeft;
offsets.y = offsetRect.y + offsetParent.clientTop;
} else if (documentElement) setLeftRTLScrollbarOffset();
}
if (isFixed && !isOffsetParentAnElement && documentElement) setLeftRTLScrollbarOffset();
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
return {
x: rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x,
y: rect.top + scroll.scrollTop - offsets.y - htmlOffset.y,
width: rect.width,
height: rect.height
};
}
function isStaticPositioned(element) {
return getComputedStyle$1(element).position === "static";
}
function getTrueOffsetParent(element, polyfill) {
if (!isHTMLElement(element) || getComputedStyle$1(element).position === "fixed") return null;
if (polyfill) return polyfill(element);
let rawOffsetParent = element.offsetParent;
if (getDocumentElement(element) === rawOffsetParent) rawOffsetParent = rawOffsetParent.ownerDocument.body;
return rawOffsetParent;
}
function getOffsetParent(element, polyfill) {
const win = getWindow(element);
if (isTopLayer(element)) return win;
if (!isHTMLElement(element)) {
let svgOffsetParent = getParentNode(element);
while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) {
if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) return svgOffsetParent;
svgOffsetParent = getParentNode(svgOffsetParent);
}
return win;
}
let offsetParent = getTrueOffsetParent(element, polyfill);
while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) offsetParent = getTrueOffsetParent(offsetParent, polyfill);
if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) return win;
return offsetParent || getContainingBlock(element) || win;
}
const getElementRects = async function(data) {
const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
const getDimensionsFn = this.getDimensions;
const floatingDimensions = await getDimensionsFn(data.floating);
return {
reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
floating: {
x: 0,
y: 0,
width: floatingDimensions.width,
height: floatingDimensions.height
}
};
};
function isRTL$1(element) {
return getComputedStyle$1(element).direction === "rtl";
}
const platform = {
convertOffsetParentRelativeRectToViewportRelativeRect,
getDocumentElement,
getClippingRect,
getOffsetParent,
getElementRects,
getClientRects,
getDimensions,
getScale,
isElement,
isRTL: isRTL$1
};
function rectsAreEqual(a, b) {
return a.x === b.x && a.y === b.y && a.width === b.width && a.height === b.height;
}
function observeMove(element, onMove) {
let io = null;
let timeoutId;
const root = getDocumentElement(element);
function cleanup() {
var _io;
clearTimeout(timeoutId);
(_io = io) == null || _io.disconnect();
io = null;
}
function refresh(skip, threshold) {
if (skip === void 0) skip = false;
if (threshold === void 0) threshold = 1;
cleanup();
const elementRectForRootMargin = element.getBoundingClientRect();
const { left, top, width, height } = elementRectForRootMargin;
if (!skip) onMove();
if (!width || !height) return;
const insetTop = floor$1(top);
const insetRight = floor$1(root.clientWidth - (left + width));
const insetBottom = floor$1(root.clientHeight - (top + height));
const insetLeft = floor$1(left);
const options = {
rootMargin: -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px",
threshold: max$1(0, min$1(1, threshold)) || 1
};
let isFirstUpdate = true;
function handleObserve(entries) {
const ratio = entries[0].intersectionRatio;
if (ratio !== threshold) {
if (!isFirstUpdate) return refresh();
if (!ratio) timeoutId = setTimeout(() => {
refresh(false, 1e-7);
}, 1e3);
else refresh(false, ratio);
}
if (ratio === 1 && !rectsAreEqual(elementRectForRootMargin, element.getBoundingClientRect())) refresh();
isFirstUpdate = false;
}
try {
io = new IntersectionObserver(handleObserve, {
...options,
root: root.ownerDocument
});
} catch (_e) {
io = new IntersectionObserver(handleObserve, options);
}
io.observe(element);
}
refresh(true);
return cleanup;
}
/**
* Automatically updates the position of the floating element when necessary.
* Should only be called when the floating element is mounted on the DOM or
* visible on the screen.
* @returns cleanup function that should be invoked when the floating element is
* removed from the DOM or hidden from the screen.
* @see https://floating-ui.com/docs/autoUpdate
*/
function autoUpdate(reference, floating, update, options) {
if (options === void 0) options = {};
const { ancestorScroll = true, ancestorResize = true, elementResize = typeof ResizeObserver === "function", layoutShift = typeof IntersectionObserver === "function", animationFrame = false } = options;
const referenceEl = unwrapElement(reference);
const ancestors = ancestorScroll || ancestorResize ? [...referenceEl ? getOverflowAncestors(referenceEl) : [], ...getOverflowAncestors(floating)] : [];
ancestors.forEach((ancestor) => {
ancestorScroll && ancestor.addEventListener("scroll", update, { passive: true });
ancestorResize && ancestor.addEventListener("resize", update);
});
const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update) : null;
let reobserveFrame = -1;
let resizeObserver = null;
if (elementResize) {
resizeObserver = new ResizeObserver((_ref) => {
let [firstEntry] = _ref;
if (firstEntry && firstEntry.target === referenceEl && resizeObserver) {
resizeObserver.unobserve(floating);
cancelAnimationFrame(reobserveFrame);
reobserveFrame = requestAnimationFrame(() => {
var _resizeObserver;
(_resizeObserver = resizeObserver) == null || _resizeObserver.observe(floating);
});
}
update();
});
if (referenceEl && !animationFrame) resizeObserver.observe(referenceEl);
resizeObserver.observe(floating);
}
let frameId;
let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
if (animationFrame) frameLoop();
function frameLoop() {
const nextRefRect = getBoundingClientRect(reference);
if (prevRefRect && !rectsAreEqual(prevRefRect, nextRefRect)) update();
prevRefRect = nextRefRect;
frameId = requestAnimationFrame(frameLoop);
}
update();
return () => {
var _resizeObserver2;
ancestors.forEach((ancestor) => {
ancestorScroll && ancestor.removeEventListener("scroll", update);
ancestorResize && ancestor.removeEventListener("resize", update);
});
cleanupIo?.();
(_resizeObserver2 = resizeObserver) == null || _resizeObserver2.disconnect();
resizeObserver = null;
if (animationFrame) cancelAnimationFrame(frameId);
};
}
/**
* Resolves with an object of overflow side offsets that determine how much the
* element is overflowing a given clipping boundary on each side.
* - positive = overflowing the boundary by that number of pixels
* - negative = how many pixels left before it will overflow
* - 0 = lies flush with the boundary
* @see https://floating-ui.com/docs/detectOverflow
*/
const detectOverflow = detectOverflow$1;
/**
* Modifies the placement by translating the floating element along the
* specified axes.
* A number (shorthand for `mainAxis` or distance), or an axes configuration
* object may be passed.
* @see https://floating-ui.com/docs/offset
*/
const offset = offset$1;
/**
* Optimizes the visibility of the floating element by shifting it in order to
* keep it in view when it will overflow the clipping boundary.
* @see https://floating-ui.com/docs/shift
*/
const shift = shift$1;
/**
* Optimizes the visibility of the floating element by flipping the `placement`
* in order to keep it in view when the preferred placement(s) will overflow the
* clipping boundary. Alternative to `autoPlacement`.
* @see https://floating-ui.com/docs/flip
*/
const flip = flip$1;
/**
* Provides data to position an inner element of the floating element so that it
* appears centered to the reference element.
* @see https://floating-ui.com/docs/arrow
*/
const arrow = arrow$1;
/**
* Computes the `x` and `y` coordinates that will place the floating element
* next to a given reference element.
*/
const computePosition = (reference, floating, options) => {
const cache = /* @__PURE__ */ new Map();
const mergedOptions = {
platform,
...options
};
const platformWithCache = {
...mergedOptions.platform,
_c: cache
};
return computePosition$1(reference, floating, {
...mergedOptions,
platform: platformWithCache
});
};
//#endregion
//#region ../../packages/hooks/use-floating/index.ts
const useFloatingProps = buildProps({});
const unrefReference = (elRef) => {
if (!isClient) return;
if (!elRef) return elRef;
const unrefEl = unrefElement(elRef);
if (unrefEl) return unrefEl;
return (0, vue.isRef)(elRef) ? unrefEl : elRef;
};
const getPositionDataWithUnit = (record, key) => {
const value = record?.[key];
return isNil(value) ? "" : `${value}px`;
};
const useFloating = ({ middleware, placement, strategy }) => {
const referenceRef = (0, vue.ref)();
const contentRef = (0, vue.ref)();
const states = {
x: (0, vue.ref)(),
y: (0, vue.ref)(),
placement,
strategy,
middlewareData: (0, vue.ref)({})
};
const update = async () => {
if (!isClient) return;
const referenceEl = unrefReference(referenceRef);
const contentEl = unrefElement(contentRef);
if (!referenceEl || !contentEl) return;
const data = await computePosition(referenceEl, contentEl, {
placement: (0, vue.unref)(placement),
strategy: (0, vue.unref)(strategy),
middleware: (0, vue.unref)(middleware)
});
keysOf(states).forEach((key) => {
states[key].value = data[key];
});
};
(0, vue.onMounted)(() => {
(0, vue.watchEffect)(() => {
update();
});
});
return {
...states,
update,
referenceRef,
contentRef
};
};
const arrowMiddleware = ({ arrowRef, padding }) => {
return {
name: "arrow",
options: {
element: arrowRef,
padding
},
fn(args) {
const arrowEl = (0, vue.unref)(arrowRef);
if (!arrowEl) return {};
return arrow({
element: arrowEl,
padding
}).fn(args);
}
};
};
//#endregion
//#region ../../packages/hooks/use-cursor/index.ts
function useCursor(input) {
let selectionInfo;
function recordCursor() {
if (input.value == void 0) return;
const { selectionStart, selectionEnd, value } = input.value;
if (selectionStart == null || selectionEnd == null) return;
selectionInfo = {
selectionStart,
selectionEnd,
value,
beforeTxt: value.slice(0, Math.max(0, selectionStart)),
afterTxt: value.slice(Math.max(0, selectionEnd))
};
}
function setCursor() {
if (input.value == void 0 || selectionInfo == void 0) return;
const { value } = input.value;
const { beforeTxt, afterTxt, selectionStart } = selectionInfo;
if (beforeTxt == void 0 || afterTxt == void 0 || selectionStart == void 0) return;
let startPos = value.length;
if (value.endsWith(afterTxt)) startPos = value.length - afterTxt.length;
else if (value.startsWith(beforeTxt)) startPos = beforeTxt.length;
else {
const beforeLastChar = beforeTxt[selectionStart - 1];
const newIndex = value.indexOf(beforeLastChar, selectionStart - 1);
if (newIndex !== -1) startPos = newIndex + 1;
}
input.value.setSelectionRange(startPos, startPos);
}
return [recordCursor, setCursor];
}
//#endregion
//#region ../../packages/hooks/use-ordered-children/index.ts
const getOrderedChildren = (vm, childComponentName, children) => {
return flattedChildren(vm.subTree).filter((n) => (0, vue.isVNode)(n) && n.type?.name === childComponentName && !!n.component).map((n) => n.component.uid).map((uid) => children[uid]).filter((p) => !!p);
};
const useOrderedChildren = (vm, childComponentName) => {
const children = (0, vue.shallowRef)({});
const orderedChildren = (0, vue.shallowRef)([]);
const nodesMap = /* @__PURE__ */ new WeakMap();
const addChild = (child) => {
children.value[child.uid] = child;
(0, vue.triggerRef)(children);
(0, vue.onMounted)(() => {
const childNode = child.getVnode().el;
const parentNode = childNode.parentNode;
if (!nodesMap.has(parentNode)) {
nodesMap.set(parentNode, []);
const originalFn = parentNode.insertBefore.bind(parentNode);
parentNode.insertBefore = (node, anchor) => {
if (nodesMap.get(parentNode).some((el) => node === el || anchor === el)) (0, vue.triggerRef)(children);
return originalFn(node, anchor);
};
}
nodesMap.get(parentNode).push(childNode);
});
};
const removeChild = (child) => {
delete children.value[child.uid];
(0, vue.triggerRef)(children);
const childNode = child.getVnode().el;
const parentNode = childNode.parentNode;
const childNodes = nodesMap.get(parentNode);
const index = childNodes.indexOf(childNode);
childNodes.splice(index, 1);
};
const sortChildren = () => {
orderedChildren.value = getOrderedChildren(vm, childComponentName, children.value);
};
const IsolatedRenderer = (props) => {
return props.render();
};
return {
children: orderedChildren,
addChild,
removeChild,
ChildrenSorter: (0, vue.defineComponent)({ setup(_, { slots }) {
return () => {
sortChildren();
return slots.default ? (0, vue.h)(IsolatedRenderer, { render: slots.default }) : null;
};
} })
};
};
//#endregion
//#region ../../packages/hooks/use-size/index.ts
const useSizeProp = buildProp({
type: String,
values: componentSizes,
required: false
});
const useSizeProps = { size: useSizeProp };
const SIZE_INJECTION_KEY = Symbol("size");
const useGlobalSize = () => {
const injectedSize = (0, vue.inject)(SIZE_INJECTION_KEY, {});
return (0, vue.computed)(() => {
return (0, vue.unref)(injectedSize.size) || "";
});
};
//#endregion
//#region ../../packages/hooks/use-focus-controller/index.ts
function useFocusController(target, { disabled, beforeFocus, afterFocus, beforeBlur, afterBlur } = {}) {
const { emit } = (0, vue.getCurrentInstance)();
const wrapperRef = (0, vue.shallowRef)();
const isFocused = (0, vue.ref)(false);
const handleFocus = (event) => {
const cancelFocus = isFunction$1(beforeFocus) ? beforeFocus(event) : false;
if ((0, vue.unref)(disabled) || isFocused.value || cancelFocus) return;
isFocused.value = true;
emit("focus", event);
afterFocus?.();
};
const handleBlur = (event) => {
const cancelBlur = isFunction$1(beforeBlur) ? beforeBlur(event) : false;
if ((0, vue.unref)(disabled) || event.relatedTarget && wrapperRef.value?.contains(event.relatedTarget) || cancelBlur) return;
isFocused.value = false;
emit("blur", event);
afterBlur?.();
};
const handleClick = (event) => {
if ((0, vue.unref)(disabled) || isFocusable(event.target) || wrapperRef.value?.contains(document.activeElement) && wrapperRef.value !== document.activeElement) return;
target.value?.focus();
};
(0, vue.watch)([wrapperRef, () => (0, vue.unref)(disabled)], ([el, disabled]) => {
if (!el) return;
if (disabled) el.removeAttribute("tabindex");
else el.setAttribute("tabindex", "-1");
});
useEventListener(wrapperRef, "focus", handleFocus, true);
useEventListener(wrapperRef, "blur", handleBlur, true);
useEventListener(wrapperRef, "click", handleClick, true);
return {
isFocused,
wrapperRef,
handleFocus,
handleBlur
};
}
//#endregion
//#region ../../packages/hooks/use-composition/index.ts
function useComposition({ afterComposition, emit }) {
const isComposing = (0, vue.ref)(false);
const handleCompositionStart = (event) => {
emit?.("compositionstart", event);
isComposing.value = true;
};
const handleCompositionUpdate = (event) => {
emit?.("compositionupdate", event);
isComposing.value = true;
};
const handleCompositionEnd = (event) => {
emit?.("compositionend", event);
if (isComposing.value) {
isComposing.value = false;
(0, vue.nextTick)(() => afterComposition(event));
}
};
const handleComposition = (event) => {
event.type === "compositionend" ? handleCompositionEnd(event) : handleCompositionUpdate(event);
};
return {
isComposing,
handleComposition,
handleCompositionStart,
handleCompositionUpdate,
handleCompositionEnd
};
}
//#endregion
//#region ../../packages/hooks/use-empty-values/index.ts
const emptyValuesContextKey = Symbol("emptyValuesContextKey");
const SCOPE = "use-empty-values";
const DEFAULT_EMPTY_VALUES = [
"",
void 0,
null
];
const DEFAULT_VALUE_ON_CLEAR = void 0;
/**
* @deprecated Removed after 3.0.0, Use `UseEmptyValuesProps` instead.
*/
const useEmptyValuesProps = buildProps({
emptyValues: Array,
valueOnClear: {
type: definePropType([
String,
Number,
Boolean,
Function
]),
default: void 0,
validator: (val) => {
val = isFunction$1(val) ? val() : val;
if (isArray$1(val)) return val.every((item) => !item);
return !val;
}
}
});
const useEmptyValues = (props, defaultValue) => {
const config = (0, vue.getCurrentInstance)() ? (0, vue.inject)(emptyValuesContextKey, (0, vue.ref)({})) : (0, vue.ref)({});
const emptyValues = (0, vue.computed)(() => props.emptyValues || config.value.emptyValues || DEFAULT_EMPTY_VALUES);
const valueOnClear = (0, vue.computed)(() => {
if (isFunction$1(props.valueOnClear)) return props.valueOnClear();
else if (props.valueOnClear !== void 0) return props.valueOnClear;
else if (isFunction$1(config.value.valueOnClear)) return config.value.valueOnClear();
else if (config.value.valueOnClear !== void 0) return config.value.valueOnClear;
return defaultValue !== void 0 ? defaultValue : DEFAULT_VALUE_ON_CLEAR;
});
const isEmptyValue = (value) => {
let result = true;
if (isArray$1(value)) result = emptyValues.value.some((emptyValue) => {
return isEqual$1(value, emptyValue);
});
else result = emptyValues.value.includes(value);
return result;
};
if (!isEmptyValue(valueOnClear.value)) /* @__PURE__ */ debugWarn(SCOPE, "value-on-clear should be a value of empty-values");
return {
emptyValues,
valueOnClear,
isEmptyValue
};
};
//#endregion
//#region ../../packages/hooks/use-aria/index.ts
/**
* @deprecated Removed after 3.0.0, Use `AriaProps` instead.
*/
const ariaProps = buildProps({
ariaLabel: String,
ariaOrientation: {
type: String,
values: [
"horizontal",
"vertical",
"undefined"
]
},
ariaControls: String
});
const useAriaProps = (arias) => {
return pick(ariaProps, arias);
};
//#endregion
//#region ../../packages/components/config-provider/src/constants.ts
const configProviderContextKey = Symbol();
//#endregion
//#region ../../packages/components/config-provider/src/hooks/use-global-config.ts
const globalConfig = (0, vue.ref)();
function useGlobalConfig(key, defaultValue = void 0) {
const config = (0, vue.getCurrentInstance)() ? (0, vue.inject)(configProviderContextKey, globalConfig) : globalConfig;
if (key) return (0, vue.computed)(() => config.value?.[key] ?? defaultValue);
else return config;
}
function useGlobalComponentSettings(block, sizeFallback) {
const config = useGlobalConfig();
const ns = useNamespace(block, (0, vue.computed)(() => config.value?.namespace || defaultNamespace));
const locale = useLocale((0, vue.computed)(() => config.value?.locale));
const zIndex = useZIndex((0, vue.computed)(() => config.value?.zIndex || defaultInitialZIndex));
const size = (0, vue.computed)(() => (0, vue.unref)(sizeFallback) || config.value?.size || "");
provideGlobalConfig((0, vue.computed)(() => (0, vue.unref)(config) || {}));
return {
ns,
locale,
zIndex,
size
};
}
const provideGlobalConfig = (config, app, global = false) => {
const inSetup = !!(0, vue.getCurrentInstance)();
const oldConfig = inSetup ? useGlobalConfig() : void 0;
const provideFn = app?.provide ?? (inSetup ? vue.provide : void 0);
if (!provideFn) {
/* @__PURE__ */ debugWarn("provideGlobalConfig", "provideGlobalConfig() can only be used inside setup().");
return;
}
const context = (0, vue.computed)(() => {
const cfg = (0, vue.unref)(config);
if (!oldConfig?.value) return cfg;
return mergeConfig(oldConfig.value, cfg);
});
provideFn(configProviderContextKey, context);
provideFn(localeContextKey, (0, vue.computed)(() => context.value.locale));
provideFn(namespaceContextKey, (0, vue.computed)(() => context.value.namespace));
provideFn(zIndexContextKey, (0, vue.computed)(() => context.value.zIndex));
provideFn(SIZE_INJECTION_KEY, { size: (0, vue.computed)(() => context.value.size || "") });
provideFn(emptyValuesContextKey, (0, vue.computed)(() => ({
emptyValues: context.value.emptyValues,
valueOnClear: context.value.valueOnClear
})));
if (global || !globalConfig.value) globalConfig.value = context.value;
return context;
};
const mergeConfig = (a, b) => {
const keys = [...new Set([...keysOf(a), ...keysOf(b)])];
const obj = {};
for (const key of keys) obj[key] = b[key] !== void 0 ? b[key] : a[key];
return obj;
};
//#endregion
//#region ../../packages/components/config-provider/src/config-provider-props.ts
const configProviderProps = buildProps({
a11y: {
type: Boolean,
default: true
},
locale: { type: definePropType(Object) },
size: useSizeProp,
button: { type: definePropType(Object) },
card: { type: definePropType(Object) },
dialog: { type: definePropType(Object) },
link: { type: definePropType(Object) },
experimentalFeatures: { type: definePropType(Object) },
keyboardNavigation: {
type: Boolean,
default: true
},
message: { type: definePropType(Object) },
zIndex: Number,
namespace: {
type: String,
default: "el"
},
table: { type: definePropType(Object) },
...useEmptyValuesProps
});
//#endregion
//#region ../../packages/components/config-provider/src/config-provider.ts
const messageConfig = { placement: "top" };
const ConfigProvider = (0, vue.defineComponent)({
name: "ElConfigProvider",
props: configProviderProps,
setup(props, { slots }) {
const config = provideGlobalConfig(props);
(0, vue.watch)(() => props.message, (val) => {
Object.assign(messageConfig, config?.value?.message ?? {}, val ?? {});
}, {
immediate: true,
deep: true
});
return () => (0, vue.renderSlot)(slots, "default", { config: config?.value });
}
});
//#endregion
//#region ../../packages/components/config-provider/index.ts
const ElConfigProvider = withInstall(ConfigProvider);
//#endregion
//#region ../../packages/element-plus/version.ts
const version$1 = "2.13.7";
//#endregion
//#region ../../packages/element-plus/make-installer.ts
const makeInstaller = (components = []) => {
const install = (app, options) => {
if (app[INSTALLED_KEY]) return;
app[INSTALLED_KEY] = true;
components.forEach((c) => app.use(c));
if (options) provideGlobalConfig(options, app, true);
};
return {
version: version$1,
install
};
};
//#endregion
//#region ../../packages/components/teleport/src/teleport.ts
const teleportProps = buildProps({
to: {
type: definePropType([String, Object]),
required: true
},
disabled: Boolean
});
//#endregion
//#region ../../packages/components/teleport/src/teleport.vue?vue&type=script&setup=true&lang.ts
var teleport_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
__name: "teleport",
props: teleportProps,
setup(__props) {
return (_ctx, _cache) => {
return _ctx.disabled ? (0, vue.renderSlot)(_ctx.$slots, "default", { key: 0 }) : ((0, vue.openBlock)(), (0, vue.createBlock)(vue.Teleport, {
key: 1,
to: _ctx.to
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 8, ["to"]));
};
}
});
//#endregion
//#region ../../packages/components/teleport/src/teleport.vue
var teleport_default = teleport_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/teleport/index.ts
const ElTeleport = withInstall(teleport_default);
//#endregion
//#region ../../packages/components/affix/src/affix.ts
/**
* @deprecated Removed after 3.0.0, Use `AffixProps` instead.
*/
const affixProps = buildProps({
zIndex: {
type: definePropType([Number, String]),
default: 100
},
target: {
type: String,
default: ""
},
offset: {
type: Number,
default: 0
},
position: {
type: String,
values: ["top", "bottom"],
default: "top"
},
teleported: Boolean,
appendTo: {
type: teleportProps.to.type,
default: "body"
}
});
const affixEmits = {
scroll: ({ scrollTop, fixed }) => isNumber(scrollTop) && isBoolean(fixed),
[CHANGE_EVENT]: (fixed) => isBoolean(fixed)
};
//#endregion
//#region ../../packages/components/affix/src/affix.vue?vue&type=script&setup=true&lang.ts
const COMPONENT_NAME$22 = "ElAffix";
var affix_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: COMPONENT_NAME$22,
__name: "affix",
props: affixProps,
emits: affixEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const ns = useNamespace("affix");
const target = (0, vue.shallowRef)();
const root = (0, vue.shallowRef)();
const scrollContainer = (0, vue.shallowRef)();
const { height: windowHeight } = useWindowSize();
const { height: rootHeight, width: rootWidth, top: rootTop, bottom: rootBottom, left: rootLeft, update: updateRoot } = useElementBounding(root, { windowScroll: false });
const targetRect = useElementBounding(target);
const fixed = (0, vue.ref)(false);
const scrollTop = (0, vue.ref)(0);
const transform = (0, vue.ref)(0);
const teleportDisabled = (0, vue.computed)(() => {
return !props.teleported || !fixed.value;
});
const rootStyle = (0, vue.computed)(() => {
return {
display: "flow-root",
height: fixed.value ? `${rootHeight.value}px` : "",
width: fixed.value ? `${rootWidth.value}px` : ""
};
});
const affixStyle = (0, vue.computed)(() => {
if (!fixed.value) return {};
const offset = addUnit(props.offset);
return {
height: `${rootHeight.value}px`,
width: `${rootWidth.value}px`,
top: props.position === "top" ? offset : "",
bottom: props.position === "bottom" ? offset : "",
left: props.teleported ? `${rootLeft.value}px` : "",
transform: transform.value ? `translateY(${transform.value}px)` : "",
zIndex: props.zIndex
};
});
const update = () => {
if (!scrollContainer.value) return;
scrollTop.value = scrollContainer.value instanceof Window ? document.documentElement.scrollTop : scrollContainer.value.scrollTop || 0;
const { position, target, offset } = props;
const rootHeightOffset = offset + rootHeight.value;
if (position === "top") if (target) {
const difference = targetRect.bottom.value - rootHeightOffset;
fixed.value = offset > rootTop.value && targetRect.bottom.value > 0;
transform.value = difference < 0 ? difference : 0;
} else fixed.value = offset > rootTop.value;
else if (target) {
const difference = windowHeight.value - targetRect.top.value - rootHeightOffset;
fixed.value = windowHeight.value - offset < rootBottom.value && windowHeight.value > targetRect.top.value;
transform.value = difference < 0 ? -difference : 0;
} else fixed.value = windowHeight.value - offset < rootBottom.value;
};
const updateRootRect = async () => {
if (!fixed.value) {
updateRoot();
return;
}
fixed.value = false;
await (0, vue.nextTick)();
updateRoot();
fixed.value = true;
};
const handleScroll = async () => {
updateRoot();
await (0, vue.nextTick)();
emit("scroll", {
scrollTop: scrollTop.value,
fixed: fixed.value
});
};
(0, vue.watch)(fixed, (val) => emit(CHANGE_EVENT, val));
(0, vue.onMounted)(() => {
if (props.target) {
target.value = document.querySelector(props.target) ?? void 0;
if (!target.value) throwError(COMPONENT_NAME$22, `Target does not exist: ${props.target}`);
} else target.value = document.documentElement;
scrollContainer.value = getScrollContainer(root.value, true);
updateRoot();
});
(0, vue.onActivated)(() => {
(0, vue.nextTick)(updateRootRect);
});
(0, vue.onDeactivated)(() => {
fixed.value = false;
});
useEventListener(scrollContainer, "scroll", handleScroll);
(0, vue.watchEffect)(update);
__expose({
update,
updateRoot: updateRootRect
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref_key: "root",
ref: root,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()),
style: (0, vue.normalizeStyle)(rootStyle.value)
}, [(0, vue.createVNode)((0, vue.unref)(ElTeleport), {
disabled: teleportDisabled.value,
to: __props.appendTo
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)({ [(0, vue.unref)(ns).m("fixed")]: fixed.value }),
style: (0, vue.normalizeStyle)(affixStyle.value)
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 6)]),
_: 3
}, 8, ["disabled", "to"])], 6);
};
}
});
//#endregion
//#region ../../packages/components/affix/src/affix.vue
var affix_default = affix_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/affix/index.ts
const ElAffix = withInstall(affix_default);
//#endregion
//#region ../../packages/components/alert/src/alert.ts
const alertEffects = ["light", "dark"];
/**
* @deprecated Removed after 3.0.0, Use `AlertProps` instead.
*/
const alertProps = buildProps({
title: {
type: String,
default: ""
},
description: {
type: String,
default: ""
},
type: {
type: String,
values: keysOf(TypeComponentsMap),
default: "info"
},
closable: {
type: Boolean,
default: true
},
closeText: {
type: String,
default: ""
},
showIcon: Boolean,
center: Boolean,
effect: {
type: String,
values: alertEffects,
default: "light"
}
});
const alertEmits = { close: (evt) => evt instanceof MouseEvent };
//#endregion
//#region ../../packages/components/icon/src/icon.ts
/**
* @deprecated Removed after 3.0.0, Use `IconProps` instead.
*/
const iconProps = buildProps({
size: { type: definePropType([Number, String]) },
color: { type: String }
});
//#endregion
//#region ../../packages/components/icon/src/icon.vue?vue&type=script&setup=true&lang.ts
var icon_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElIcon",
inheritAttrs: false,
__name: "icon",
props: iconProps,
setup(__props) {
const props = __props;
const ns = useNamespace("icon");
const style = (0, vue.computed)(() => {
const { size, color } = props;
const fontSize = addUnit(size);
if (!fontSize && !color) return {};
return {
fontSize,
"--color": color
};
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("i", (0, vue.mergeProps)({
class: (0, vue.unref)(ns).b(),
style: style.value
}, _ctx.$attrs), [(0, vue.renderSlot)(_ctx.$slots, "default")], 16);
};
}
});
//#endregion
//#region ../../packages/components/icon/src/icon.vue
var icon_default = icon_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/icon/index.ts
const ElIcon = withInstall(icon_default);
//#endregion
//#region ../../packages/components/alert/src/alert.vue?vue&type=script&setup=true&lang.ts
var alert_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElAlert",
__name: "alert",
props: alertProps,
emits: alertEmits,
setup(__props, { emit: __emit }) {
const { Close } = TypeComponents;
const props = __props;
const emit = __emit;
const slots = (0, vue.useSlots)();
const ns = useNamespace("alert");
const visible = (0, vue.ref)(true);
const iconComponent = (0, vue.computed)(() => TypeComponentsMap[props.type]);
const hasDesc = (0, vue.computed)(() => {
if (props.description) return true;
const slotContent = slots.default?.();
if (!slotContent) return false;
return flattedChildren(slotContent).some((child) => !isComment(child));
});
const close = (evt) => {
visible.value = false;
emit("close", evt);
};
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)(vue.Transition, {
name: (0, vue.unref)(ns).b("fade"),
persisted: ""
}, {
default: (0, vue.withCtx)(() => [(0, vue.withDirectives)((0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).b(),
(0, vue.unref)(ns).m(__props.type),
(0, vue.unref)(ns).is("center", __props.center),
(0, vue.unref)(ns).is(__props.effect)
]),
role: "alert"
}, [__props.showIcon && (_ctx.$slots.icon || iconComponent.value) ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("icon"), (0, vue.unref)(ns).is("big", hasDesc.value)])
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "icon", {}, () => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(iconComponent.value)))])]),
_: 3
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("content")) }, [
__props.title || _ctx.$slots.title ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 0,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("title"), { "with-description": hasDesc.value }])
}, [(0, vue.renderSlot)(_ctx.$slots, "title", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.title), 1)])], 2)) : (0, vue.createCommentVNode)("v-if", true),
hasDesc.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("p", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("description"))
}, [(0, vue.renderSlot)(_ctx.$slots, "default", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.description), 1)])], 2)) : (0, vue.createCommentVNode)("v-if", true),
__props.closable ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 2 }, [__props.closeText ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("close-btn"), (0, vue.unref)(ns).is("customed")]),
onClick: close
}, (0, vue.toDisplayString)(__props.closeText), 3)) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("close-btn")),
onClick: close
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(Close))]),
_: 1
}, 8, ["class"]))], 64)) : (0, vue.createCommentVNode)("v-if", true)
], 2)], 2), [[vue.vShow, visible.value]])]),
_: 3
}, 8, ["name"]);
};
}
});
//#endregion
//#region ../../packages/components/alert/src/alert.vue
var alert_default = alert_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/alert/index.ts
const ElAlert = withInstall(alert_default);
//#endregion
//#region ../../packages/components/popper/src/popper.ts
const Effect = {
LIGHT: "light",
DARK: "dark"
};
const roleTypes = [
"dialog",
"grid",
"group",
"listbox",
"menu",
"navigation",
"tooltip",
"tree"
];
/**
* @deprecated Removed after 3.0.0, Use `PopperProps` instead.
*/
const popperProps = buildProps({ role: {
type: String,
values: roleTypes,
default: "tooltip"
} });
/** @deprecated use `popperProps` instead, and it will be deprecated in the next major version */
const usePopperProps = popperProps;
//#endregion
//#region ../../packages/components/popper/src/constants.ts
const POPPER_INJECTION_KEY = Symbol("popper");
const POPPER_CONTENT_INJECTION_KEY = Symbol("popperContent");
//#endregion
//#region ../../packages/components/popper/src/popper.vue?vue&type=script&setup=true&lang.ts
var popper_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElPopper",
inheritAttrs: false,
__name: "popper",
props: popperProps,
setup(__props, { expose: __expose }) {
const props = __props;
const popperProvides = {
triggerRef: (0, vue.ref)(),
popperInstanceRef: (0, vue.ref)(),
contentRef: (0, vue.ref)(),
referenceRef: (0, vue.ref)(),
role: (0, vue.computed)(() => props.role)
};
__expose(popperProvides);
(0, vue.provide)(POPPER_INJECTION_KEY, popperProvides);
return (_ctx, _cache) => {
return (0, vue.renderSlot)(_ctx.$slots, "default");
};
}
});
//#endregion
//#region ../../packages/components/popper/src/popper.vue
var popper_default = popper_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/popper/src/arrow.vue?vue&type=script&setup=true&lang.ts
var arrow_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElPopperArrow",
inheritAttrs: false,
__name: "arrow",
setup(__props, { expose: __expose }) {
const ns = useNamespace("popper");
const { arrowRef, arrowStyle } = (0, vue.inject)(POPPER_CONTENT_INJECTION_KEY, void 0);
(0, vue.onBeforeUnmount)(() => {
arrowRef.value = void 0;
});
__expose({ arrowRef });
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
ref_key: "arrowRef",
ref: arrowRef,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("arrow")),
style: (0, vue.normalizeStyle)((0, vue.unref)(arrowStyle)),
"data-popper-arrow": ""
}, null, 6);
};
}
});
//#endregion
//#region ../../packages/components/popper/src/arrow.vue
var arrow_default = arrow_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/popper/src/trigger.ts
/**
* @deprecated Removed after 3.0.0, Use `PopperTriggerProps` instead.
*/
const popperTriggerProps = buildProps({
virtualRef: { type: definePropType(Object) },
virtualTriggering: Boolean,
onMouseenter: { type: definePropType(Function) },
onMouseleave: { type: definePropType(Function) },
onClick: { type: definePropType(Function) },
onKeydown: { type: definePropType(Function) },
onFocus: { type: definePropType(Function) },
onBlur: { type: definePropType(Function) },
onContextmenu: { type: definePropType(Function) },
id: String,
open: Boolean
});
/** @deprecated use `popperTriggerProps` instead, and it will be deprecated in the next major version */
const usePopperTriggerProps = popperTriggerProps;
//#endregion
//#region ../../packages/components/slot/src/only-child.tsx
const NAME = "ElOnlyChild";
const OnlyChild = /* @__PURE__ */ (0, vue.defineComponent)({
name: NAME,
setup(_, { slots, attrs }) {
const forwardRefDirective = useForwardRefDirective((0, vue.inject)(FORWARD_REF_INJECTION_KEY)?.setForwardRef ?? NOOP);
return () => {
const defaultSlot = slots.default?.(attrs);
if (!defaultSlot) return null;
const [firstLegitNode, length] = findFirstLegitChild(defaultSlot);
if (!firstLegitNode) {
/* @__PURE__ */ debugWarn(NAME, "no valid child node found");
return null;
}
if (length > 1) /* @__PURE__ */ debugWarn(NAME, "requires exact only one valid child.");
return (0, vue.withDirectives)((0, vue.cloneVNode)(firstLegitNode, attrs), [[forwardRefDirective]]);
};
}
});
function findFirstLegitChild(node) {
if (!node) return [null, 0];
const children = node;
const len = children.filter((c) => c.type !== vue.Comment).length;
for (const child of children) {
/**
* when user uses h(Fragment, [text]) to render plain string,
* this switch case just cannot handle, when the value is primitives
* we should just return the wrapped string
*/
if (isObject$1(child)) switch (child.type) {
case vue.Comment: continue;
case vue.Text:
case "svg": return [wrapTextContent(child), len];
case vue.Fragment: return findFirstLegitChild(child.children);
default: return [child, len];
}
return [wrapTextContent(child), len];
}
return [null, 0];
}
function wrapTextContent(s) {
const ns = useNamespace("only-child");
return (0, vue.createVNode)("span", { "class": ns.e("content") }, [s]);
}
//#endregion
//#region ../../packages/components/popper/src/trigger.vue?vue&type=script&setup=true&lang.ts
var trigger_vue_vue_type_script_setup_true_lang_default$1 = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElPopperTrigger",
inheritAttrs: false,
__name: "trigger",
props: popperTriggerProps,
setup(__props, { expose: __expose }) {
const props = __props;
const { role, triggerRef } = (0, vue.inject)(POPPER_INJECTION_KEY, void 0);
useForwardRef(triggerRef);
const ariaControls = (0, vue.computed)(() => {
return ariaHaspopup.value ? props.id : void 0;
});
const ariaDescribedby = (0, vue.computed)(() => {
if (role && role.value === "tooltip") return props.open && props.id ? props.id : void 0;
});
const ariaHaspopup = (0, vue.computed)(() => {
if (role && role.value !== "tooltip") return role.value;
});
const ariaExpanded = (0, vue.computed)(() => {
return ariaHaspopup.value ? `${props.open}` : void 0;
});
let virtualTriggerAriaStopWatch = void 0;
const TRIGGER_ELE_EVENTS = [
"onMouseenter",
"onMouseleave",
"onClick",
"onKeydown",
"onFocus",
"onBlur",
"onContextmenu"
];
(0, vue.onMounted)(() => {
(0, vue.watch)(() => props.virtualRef, (virtualEl) => {
if (virtualEl) triggerRef.value = unrefElement(virtualEl);
}, { immediate: true });
(0, vue.watch)(triggerRef, (el, prevEl) => {
virtualTriggerAriaStopWatch?.();
virtualTriggerAriaStopWatch = void 0;
if (isElement$1(prevEl)) TRIGGER_ELE_EVENTS.forEach((eventName) => {
const handler = props[eventName];
if (handler) prevEl.removeEventListener(eventName.slice(2).toLowerCase(), handler, ["onFocus", "onBlur"].includes(eventName));
});
if (isElement$1(el)) {
TRIGGER_ELE_EVENTS.forEach((eventName) => {
const handler = props[eventName];
if (handler) el.addEventListener(eventName.slice(2).toLowerCase(), handler, ["onFocus", "onBlur"].includes(eventName));
});
if (isFocusable(el)) virtualTriggerAriaStopWatch = (0, vue.watch)([
ariaControls,
ariaDescribedby,
ariaHaspopup,
ariaExpanded
], (watches) => {
[
"aria-controls",
"aria-describedby",
"aria-haspopup",
"aria-expanded"
].forEach((key, idx) => {
isNil(watches[idx]) ? el.removeAttribute(key) : el.setAttribute(key, watches[idx]);
});
}, { immediate: true });
}
if (isElement$1(prevEl) && isFocusable(prevEl)) [
"aria-controls",
"aria-describedby",
"aria-haspopup",
"aria-expanded"
].forEach((key) => prevEl.removeAttribute(key));
}, { immediate: true });
});
(0, vue.onBeforeUnmount)(() => {
virtualTriggerAriaStopWatch?.();
virtualTriggerAriaStopWatch = void 0;
if (triggerRef.value && isElement$1(triggerRef.value)) {
const el = triggerRef.value;
TRIGGER_ELE_EVENTS.forEach((eventName) => {
const handler = props[eventName];
if (handler) el.removeEventListener(eventName.slice(2).toLowerCase(), handler, ["onFocus", "onBlur"].includes(eventName));
});
triggerRef.value = void 0;
}
});
__expose({ triggerRef });
return (_ctx, _cache) => {
return !__props.virtualTriggering ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(OnlyChild), (0, vue.mergeProps)({ key: 0 }, _ctx.$attrs, {
"aria-controls": ariaControls.value,
"aria-describedby": ariaDescribedby.value,
"aria-expanded": ariaExpanded.value,
"aria-haspopup": ariaHaspopup.value
}), {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 16, [
"aria-controls",
"aria-describedby",
"aria-expanded",
"aria-haspopup"
])) : (0, vue.createCommentVNode)("v-if", true);
};
}
});
//#endregion
//#region ../../packages/components/popper/src/trigger.vue
var trigger_default = trigger_vue_vue_type_script_setup_true_lang_default$1;
//#endregion
//#region ../../packages/components/popper/src/arrow.ts
/**
* @deprecated Removed after 3.0.0, Use `PopperArrowProps` instead.
*/
const popperArrowProps = buildProps({ arrowOffset: {
type: Number,
default: 5
} });
const popperArrowPropsDefaults = { arrowOffset: 5 };
/** @deprecated use `popperArrowProps` instead, and it will be deprecated in the next major version */
const usePopperArrowProps = popperArrowProps;
//#endregion
//#region ../../packages/components/popper/src/content.ts
const POSITIONING_STRATEGIES = ["fixed", "absolute"];
/**
* @deprecated Removed after 3.0.0, Use `PopperCoreConfigProps` instead.
*/
const popperCoreConfigProps = buildProps({
boundariesPadding: {
type: Number,
default: 0
},
fallbackPlacements: {
type: definePropType(Array),
default: void 0
},
gpuAcceleration: {
type: Boolean,
default: true
},
offset: {
type: Number,
default: 12
},
placement: {
type: String,
values: Ee,
default: "bottom"
},
popperOptions: {
type: definePropType(Object),
default: () => ({})
},
strategy: {
type: String,
values: POSITIONING_STRATEGIES,
default: "absolute"
}
});
/**
* @deprecated Removed after 3.0.0, Use `PopperContentProps` instead.
*/
const popperContentProps = buildProps({
...popperCoreConfigProps,
...popperArrowProps,
id: String,
style: { type: definePropType([
String,
Array,
Object
]) },
className: { type: definePropType([
String,
Array,
Object
]) },
effect: {
type: definePropType(String),
default: "dark"
},
visible: Boolean,
enterable: {
type: Boolean,
default: true
},
pure: Boolean,
focusOnShow: Boolean,
trapping: Boolean,
popperClass: { type: definePropType([
String,
Array,
Object
]) },
popperStyle: { type: definePropType([
String,
Array,
Object
]) },
referenceEl: { type: definePropType(Object) },
triggerTargetEl: { type: definePropType(Object) },
stopPopperMouseEvent: {
type: Boolean,
default: true
},
virtualTriggering: Boolean,
zIndex: Number,
...useAriaProps(["ariaLabel"]),
loop: Boolean
});
const popperCoreConfigPropsDefaults = {
boundariesPadding: 0,
gpuAcceleration: true,
offset: 12,
placement: "bottom",
popperOptions: () => ({}),
strategy: "absolute"
};
const popperContentPropsDefaults = {
...popperCoreConfigPropsDefaults,
...popperArrowPropsDefaults,
effect: "dark",
enterable: true,
stopPopperMouseEvent: true,
visible: false,
pure: false,
focusOnShow: false,
trapping: false,
virtualTriggering: false,
loop: false,
style: void 0,
popperStyle: void 0
};
const popperContentEmits = {
mouseenter: (evt) => evt instanceof MouseEvent,
mouseleave: (evt) => evt instanceof MouseEvent,
focus: () => true,
blur: () => true,
close: () => true
};
/** @deprecated use `popperCoreConfigProps` instead, and it will be deprecated in the next major version */
const usePopperCoreConfigProps = popperCoreConfigProps;
/** @deprecated use `popperContentProps` instead, and it will be deprecated in the next major version */
const usePopperContentProps = popperContentProps;
/** @deprecated use `popperContentEmits` instead, and it will be deprecated in the next major version */
const usePopperContentEmits = popperContentEmits;
//#endregion
//#region ../../packages/components/focus-trap/src/tokens.ts
const FOCUS_AFTER_TRAPPED = "focus-trap.focus-after-trapped";
const FOCUS_AFTER_RELEASED = "focus-trap.focus-after-released";
const FOCUSOUT_PREVENTED = "focus-trap.focusout-prevented";
const FOCUS_AFTER_TRAPPED_OPTS = {
cancelable: true,
bubbles: false
};
const FOCUSOUT_PREVENTED_OPTS = {
cancelable: true,
bubbles: false
};
const ON_TRAP_FOCUS_EVT = "focusAfterTrapped";
const ON_RELEASE_FOCUS_EVT = "focusAfterReleased";
const FOCUS_TRAP_INJECTION_KEY = Symbol("elFocusTrap");
//#endregion
//#region ../../packages/components/focus-trap/src/utils.ts
const focusReason = (0, vue.ref)();
const lastUserFocusTimestamp = (0, vue.ref)(0);
const lastAutomatedFocusTimestamp = (0, vue.ref)(0);
let focusReasonUserCount = 0;
const obtainAllFocusableElements = (element) => {
const nodes = [];
const walker = document.createTreeWalker(element, NodeFilter.SHOW_ELEMENT, { acceptNode: (node) => {
const isHiddenInput = node.tagName === "INPUT" && node.type === "hidden";
if (node.disabled || node.hidden || isHiddenInput) return NodeFilter.FILTER_SKIP;
return node.tabIndex >= 0 || node === document.activeElement ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
} });
while (walker.nextNode()) nodes.push(walker.currentNode);
return nodes;
};
const getVisibleElement = (elements, container) => {
for (const element of elements) if (!isHidden(element, container)) return element;
};
const isHidden = (element, container) => {
if (getComputedStyle(element).visibility === "hidden") return true;
while (element) {
if (container && element === container) return false;
if (getComputedStyle(element).display === "none") return true;
element = element.parentElement;
}
return false;
};
const getEdges = (container) => {
const focusable = obtainAllFocusableElements(container);
return [getVisibleElement(focusable, container), getVisibleElement(focusable.reverse(), container)];
};
const isSelectable = (element) => {
return element instanceof HTMLInputElement && "select" in element;
};
const tryFocus = (element, shouldSelect) => {
if (element) {
const prevFocusedElement = document.activeElement;
focusElement(element, { preventScroll: true });
lastAutomatedFocusTimestamp.value = window.performance.now();
if (element !== prevFocusedElement && isSelectable(element) && shouldSelect) element.select();
}
};
function removeFromStack(list, item) {
const copy = [...list];
const idx = list.indexOf(item);
if (idx !== -1) copy.splice(idx, 1);
return copy;
}
const createFocusableStack = () => {
let stack = [];
const push = (layer) => {
const currentLayer = stack[0];
if (currentLayer && layer !== currentLayer) currentLayer.pause();
stack = removeFromStack(stack, layer);
stack.unshift(layer);
};
const remove = (layer) => {
stack = removeFromStack(stack, layer);
stack[0]?.resume?.();
};
return {
push,
remove
};
};
const focusFirstDescendant = (elements, shouldSelect = false) => {
const prevFocusedElement = document.activeElement;
for (const element of elements) {
tryFocus(element, shouldSelect);
if (document.activeElement !== prevFocusedElement) return;
}
};
const focusableStack = createFocusableStack();
const isFocusCausedByUserEvent = () => {
return lastUserFocusTimestamp.value > lastAutomatedFocusTimestamp.value;
};
const notifyFocusReasonPointer = () => {
focusReason.value = "pointer";
lastUserFocusTimestamp.value = window.performance.now();
};
const notifyFocusReasonKeydown = () => {
focusReason.value = "keyboard";
lastUserFocusTimestamp.value = window.performance.now();
};
const useFocusReason = () => {
(0, vue.onMounted)(() => {
if (focusReasonUserCount === 0) {
document.addEventListener("mousedown", notifyFocusReasonPointer);
document.addEventListener("touchstart", notifyFocusReasonPointer);
document.addEventListener("keydown", notifyFocusReasonKeydown);
}
focusReasonUserCount++;
});
(0, vue.onBeforeUnmount)(() => {
focusReasonUserCount--;
if (focusReasonUserCount <= 0) {
document.removeEventListener("mousedown", notifyFocusReasonPointer);
document.removeEventListener("touchstart", notifyFocusReasonPointer);
document.removeEventListener("keydown", notifyFocusReasonKeydown);
}
});
return {
focusReason,
lastUserFocusTimestamp,
lastAutomatedFocusTimestamp
};
};
const createFocusOutPreventedEvent = (detail) => {
return new CustomEvent(FOCUSOUT_PREVENTED, {
...FOCUSOUT_PREVENTED_OPTS,
detail
});
};
//#endregion
//#region ../../packages/components/focus-trap/src/focus-trap.vue?vue&type=script&lang.ts
var focus_trap_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElFocusTrap",
inheritAttrs: false,
props: {
loop: Boolean,
trapped: Boolean,
focusTrapEl: Object,
focusStartEl: {
type: [Object, String],
default: "first"
}
},
emits: [
ON_TRAP_FOCUS_EVT,
ON_RELEASE_FOCUS_EVT,
"focusin",
"focusout",
"focusout-prevented",
"release-requested"
],
setup(props, { emit }) {
const forwardRef = (0, vue.ref)();
let lastFocusBeforeTrapped;
let lastFocusAfterTrapped;
const { focusReason } = useFocusReason();
useEscapeKeydown((event) => {
if (props.trapped && !focusLayer.paused) emit("release-requested", event);
});
const focusLayer = {
paused: false,
pause() {
this.paused = true;
},
resume() {
this.paused = false;
}
};
const onKeydown = (e) => {
if (!props.loop && !props.trapped) return;
if (focusLayer.paused) return;
const { altKey, ctrlKey, metaKey, currentTarget, shiftKey } = e;
const { loop } = props;
const isTabbing = getEventCode(e) === EVENT_CODE.tab && !altKey && !ctrlKey && !metaKey;
const currentFocusingEl = document.activeElement;
if (isTabbing && currentFocusingEl) {
const container = currentTarget;
const [first, last] = getEdges(container);
if (!(first && last)) {
if (currentFocusingEl === container) {
const focusoutPreventedEvent = createFocusOutPreventedEvent({ focusReason: focusReason.value });
emit("focusout-prevented", focusoutPreventedEvent);
if (!focusoutPreventedEvent.defaultPrevented) e.preventDefault();
}
} else if (!shiftKey && currentFocusingEl === last) {
const focusoutPreventedEvent = createFocusOutPreventedEvent({ focusReason: focusReason.value });
emit("focusout-prevented", focusoutPreventedEvent);
if (!focusoutPreventedEvent.defaultPrevented) {
e.preventDefault();
if (loop) tryFocus(first, true);
}
} else if (shiftKey && [first, container].includes(currentFocusingEl)) {
const focusoutPreventedEvent = createFocusOutPreventedEvent({ focusReason: focusReason.value });
emit("focusout-prevented", focusoutPreventedEvent);
if (!focusoutPreventedEvent.defaultPrevented) {
e.preventDefault();
if (loop) tryFocus(last, true);
}
}
}
};
(0, vue.provide)(FOCUS_TRAP_INJECTION_KEY, {
focusTrapRef: forwardRef,
onKeydown
});
(0, vue.watch)(() => props.focusTrapEl, (focusTrapEl) => {
if (focusTrapEl) forwardRef.value = focusTrapEl;
}, { immediate: true });
(0, vue.watch)([forwardRef], ([forwardRef], [oldForwardRef]) => {
if (forwardRef) {
forwardRef.addEventListener("keydown", onKeydown);
forwardRef.addEventListener("focusin", onFocusIn);
forwardRef.addEventListener("focusout", onFocusOut);
}
if (oldForwardRef) {
oldForwardRef.removeEventListener("keydown", onKeydown);
oldForwardRef.removeEventListener("focusin", onFocusIn);
oldForwardRef.removeEventListener("focusout", onFocusOut);
}
});
const trapOnFocus = (e) => {
emit(ON_TRAP_FOCUS_EVT, e);
};
const releaseOnFocus = (e) => emit(ON_RELEASE_FOCUS_EVT, e);
const onFocusIn = (e) => {
const trapContainer = (0, vue.unref)(forwardRef);
if (!trapContainer) return;
const target = e.target;
const relatedTarget = e.relatedTarget;
const isFocusedInTrap = target && trapContainer.contains(target);
if (!props.trapped) {
if (!(relatedTarget && trapContainer.contains(relatedTarget))) lastFocusBeforeTrapped = relatedTarget;
}
if (isFocusedInTrap) emit("focusin", e);
if (focusLayer.paused) return;
if (props.trapped) if (isFocusedInTrap) lastFocusAfterTrapped = target;
else tryFocus(lastFocusAfterTrapped, true);
};
const onFocusOut = (e) => {
const trapContainer = (0, vue.unref)(forwardRef);
if (focusLayer.paused || !trapContainer) return;
if (props.trapped) {
const relatedTarget = e.relatedTarget;
if (!isNil(relatedTarget) && !trapContainer.contains(relatedTarget)) setTimeout(() => {
if (!focusLayer.paused && props.trapped) {
const focusoutPreventedEvent = createFocusOutPreventedEvent({ focusReason: focusReason.value });
emit("focusout-prevented", focusoutPreventedEvent);
if (!focusoutPreventedEvent.defaultPrevented) tryFocus(lastFocusAfterTrapped, true);
}
}, 0);
} else {
const target = e.target;
if (!(target && trapContainer.contains(target))) emit("focusout", e);
}
};
async function startTrap() {
await (0, vue.nextTick)();
const trapContainer = (0, vue.unref)(forwardRef);
if (trapContainer) {
focusableStack.push(focusLayer);
const prevFocusedElement = trapContainer.contains(document.activeElement) ? lastFocusBeforeTrapped : document.activeElement;
lastFocusBeforeTrapped = prevFocusedElement;
if (!trapContainer.contains(prevFocusedElement)) {
const focusEvent = new Event(FOCUS_AFTER_TRAPPED, FOCUS_AFTER_TRAPPED_OPTS);
trapContainer.addEventListener(FOCUS_AFTER_TRAPPED, trapOnFocus);
trapContainer.dispatchEvent(focusEvent);
if (!focusEvent.defaultPrevented) (0, vue.nextTick)(() => {
let focusStartEl = props.focusStartEl;
if (!isString(focusStartEl)) {
tryFocus(focusStartEl);
if (document.activeElement !== focusStartEl) focusStartEl = "first";
}
if (focusStartEl === "first") focusFirstDescendant(obtainAllFocusableElements(trapContainer), true);
if (document.activeElement === prevFocusedElement || focusStartEl === "container") tryFocus(trapContainer);
});
}
}
}
function stopTrap() {
const trapContainer = (0, vue.unref)(forwardRef);
if (trapContainer) {
trapContainer.removeEventListener(FOCUS_AFTER_TRAPPED, trapOnFocus);
const releasedEvent = new CustomEvent(FOCUS_AFTER_RELEASED, {
...FOCUS_AFTER_TRAPPED_OPTS,
detail: { focusReason: focusReason.value }
});
trapContainer.addEventListener(FOCUS_AFTER_RELEASED, releaseOnFocus);
trapContainer.dispatchEvent(releasedEvent);
if (!releasedEvent.defaultPrevented && (focusReason.value == "keyboard" || !isFocusCausedByUserEvent() || trapContainer.contains(document.activeElement))) tryFocus(lastFocusBeforeTrapped ?? document.body);
trapContainer.removeEventListener(FOCUS_AFTER_RELEASED, releaseOnFocus);
focusableStack.remove(focusLayer);
lastFocusBeforeTrapped = null;
lastFocusAfterTrapped = null;
}
}
(0, vue.onMounted)(() => {
if (props.trapped) startTrap();
(0, vue.watch)(() => props.trapped, (trapped) => {
if (trapped) startTrap();
else stopTrap();
});
});
(0, vue.onBeforeUnmount)(() => {
if (props.trapped) stopTrap();
if (forwardRef.value) {
forwardRef.value.removeEventListener("keydown", onKeydown);
forwardRef.value.removeEventListener("focusin", onFocusIn);
forwardRef.value.removeEventListener("focusout", onFocusOut);
forwardRef.value = void 0;
}
lastFocusBeforeTrapped = null;
lastFocusAfterTrapped = null;
});
return { onKeydown };
}
});
//#endregion
//#region \0plugin-vue:export-helper
var _plugin_vue_export_helper_default = (sfc, props) => {
const target = sfc.__vccOpts || sfc;
for (const [key, val] of props) target[key] = val;
return target;
};
//#endregion
//#region ../../packages/components/focus-trap/src/focus-trap.vue
function _sfc_render$21(_ctx, _cache, $props, $setup, $data, $options) {
return (0, vue.renderSlot)(_ctx.$slots, "default", { handleKeydown: _ctx.onKeydown });
}
var focus_trap_default$1 = /* @__PURE__ */ _plugin_vue_export_helper_default(focus_trap_vue_vue_type_script_lang_default, [["render", _sfc_render$21]]);
//#endregion
//#region ../../packages/components/focus-trap/index.ts
var focus_trap_default = focus_trap_default$1;
//#endregion
//#region ../../packages/components/form/src/form.ts
/**
* @deprecated Removed after 3.0.0, Use `FormMetaProps` instead.
*/
const formMetaProps = buildProps({
size: {
type: String,
values: componentSizes
},
disabled: Boolean
});
/**
* @deprecated Removed after 3.0.0, Use `FormProps` instead.
*/
const formProps = buildProps({
...formMetaProps,
model: Object,
rules: { type: definePropType(Object) },
labelPosition: {
type: String,
values: [
"left",
"right",
"top"
],
default: "right"
},
requireAsteriskPosition: {
type: String,
values: ["left", "right"],
default: "left"
},
labelWidth: {
type: [String, Number],
default: ""
},
labelSuffix: {
type: String,
default: ""
},
inline: Boolean,
inlineMessage: Boolean,
statusIcon: Boolean,
showMessage: {
type: Boolean,
default: true
},
validateOnRuleChange: {
type: Boolean,
default: true
},
hideRequiredAsterisk: Boolean,
scrollToError: Boolean,
scrollIntoViewOptions: {
type: definePropType([Object, Boolean]),
default: true
}
});
const formEmits = { validate: (prop, isValid, message) => (isArray$1(prop) || isString(prop)) && isBoolean(isValid) && isString(message) };
//#endregion
//#region ../../packages/components/form/src/constants.ts
const formContextKey = Symbol("formContextKey");
const formItemContextKey = Symbol("formItemContextKey");
//#endregion
//#region ../../packages/components/form/src/hooks/use-form-common-props.ts
const useFormSize = (fallback, ignore = {}) => {
const emptyRef = (0, vue.ref)(void 0);
const size = ignore.prop ? emptyRef : useProp("size");
const globalConfig = ignore.global ? emptyRef : useGlobalSize();
const form = ignore.form ? { size: void 0 } : (0, vue.inject)(formContextKey, void 0);
const formItem = ignore.formItem ? { size: void 0 } : (0, vue.inject)(formItemContextKey, void 0);
return (0, vue.computed)(() => size.value || (0, vue.unref)(fallback) || formItem?.size || form?.size || globalConfig.value || "");
};
const useFormDisabled = (fallback) => {
const disabled = useProp("disabled");
const form = (0, vue.inject)(formContextKey, void 0);
return (0, vue.computed)(() => {
return disabled.value ?? (0, vue.unref)(fallback) ?? form?.disabled ?? false;
});
};
const useSize = useFormSize;
const useDisabled = useFormDisabled;
//#endregion
//#region ../../packages/components/form/src/hooks/use-form-item.ts
const useFormItem = () => {
return {
form: (0, vue.inject)(formContextKey, void 0),
formItem: (0, vue.inject)(formItemContextKey, void 0)
};
};
const useFormItemInputId = (props, { formItemContext, disableIdGeneration, disableIdManagement }) => {
if (!disableIdGeneration) disableIdGeneration = (0, vue.ref)(false);
if (!disableIdManagement) disableIdManagement = (0, vue.ref)(false);
const instance = (0, vue.getCurrentInstance)();
const inLabel = () => {
let parent = instance?.parent;
while (parent) {
if (parent.type.name === "ElFormItem") return false;
if (parent.type.name === "ElLabelWrap") return true;
parent = parent.parent;
}
return false;
};
const inputId = (0, vue.ref)();
let idUnwatch = void 0;
const isLabeledByFormItem = (0, vue.computed)(() => {
return !!(!(props.label || props.ariaLabel) && formItemContext && formItemContext.inputIds && formItemContext.inputIds?.length <= 1);
});
(0, vue.onMounted)(() => {
idUnwatch = (0, vue.watch)([(0, vue.toRef)(props, "id"), disableIdGeneration], ([id, disableIdGeneration]) => {
const newId = id ?? (!disableIdGeneration ? useId().value : void 0);
if (newId !== inputId.value) {
if (formItemContext?.removeInputId && !inLabel()) {
inputId.value && formItemContext.removeInputId(inputId.value);
if (!disableIdManagement?.value && !disableIdGeneration && newId) formItemContext.addInputId(newId);
}
inputId.value = newId;
}
}, { immediate: true });
});
(0, vue.onUnmounted)(() => {
idUnwatch && idUnwatch();
if (formItemContext?.removeInputId) inputId.value && formItemContext.removeInputId(inputId.value);
});
return {
isLabeledByFormItem,
inputId
};
};
//#endregion
//#region ../../packages/components/form/src/utils.ts
const SCOPE$7 = "ElForm";
function useFormLabelWidth() {
const potentialLabelWidthArr = (0, vue.ref)([]);
const autoLabelWidth = (0, vue.computed)(() => {
if (!potentialLabelWidthArr.value.length) return "0";
const max = Math.max(...potentialLabelWidthArr.value);
return max ? `${max}px` : "";
});
function getLabelWidthIndex(width) {
const index = potentialLabelWidthArr.value.indexOf(width);
if (index === -1 && autoLabelWidth.value === "0") /* @__PURE__ */ debugWarn(SCOPE$7, `unexpected width ${width}`);
return index;
}
function registerLabelWidth(val, oldVal) {
if (val && oldVal) {
const index = getLabelWidthIndex(oldVal);
potentialLabelWidthArr.value.splice(index, 1, val);
} else if (val) potentialLabelWidthArr.value.push(val);
}
function deregisterLabelWidth(val) {
const index = getLabelWidthIndex(val);
if (index > -1) potentialLabelWidthArr.value.splice(index, 1);
}
return {
autoLabelWidth,
registerLabelWidth,
deregisterLabelWidth
};
}
const filterFields = (fields, props) => {
const normalized = castArray$1(props).map((prop) => isArray$1(prop) ? prop.join(".") : prop);
return normalized.length > 0 ? fields.filter((field) => field.propString && normalized.includes(field.propString)) : fields;
};
//#endregion
//#region ../../packages/components/form/src/form.vue?vue&type=script&setup=true&lang.ts
const COMPONENT_NAME$21 = "ElForm";
var form_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: COMPONENT_NAME$21,
__name: "form",
props: formProps,
emits: formEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const formRef = (0, vue.ref)();
const fields = (0, vue.reactive)([]);
const initialValues = /* @__PURE__ */ new Map();
const formSize = useFormSize();
const ns = useNamespace("form");
const formClasses = (0, vue.computed)(() => {
const { labelPosition, inline } = props;
return [
ns.b(),
ns.m(formSize.value || "default"),
{
[ns.m(`label-${labelPosition}`)]: labelPosition,
[ns.m("inline")]: inline
}
];
});
const getField = (prop) => {
return filterFields(fields, [prop])[0];
};
const addField = (field) => {
if (!fields.includes(field)) fields.push(field);
if (field.propString) if (initialValues.has(field.propString)) field.setInitialValue(initialValues.get(field.propString));
else initialValues.set(field.propString, cloneDeep(field.fieldValue));
};
const removeField = (field, oldPropString) => {
if (oldPropString) {
initialValues.delete(oldPropString);
return;
}
const idx = fields.indexOf(field);
if (idx > -1) {
fields.splice(idx, 1);
if (field.propString) initialValues.set(field.propString, cloneDeep(field.getInitialValue()));
}
};
const setInitialValues = (initModel) => {
if (!props.model) {
/* @__PURE__ */ debugWarn(COMPONENT_NAME$21, "model is required for setInitialValues to work.");
return;
}
if (!initModel) {
/* @__PURE__ */ debugWarn(COMPONENT_NAME$21, "initModel is required for setInitialValues to work.");
return;
}
for (const key of initialValues.keys()) initialValues.set(key, cloneDeep(getProp(initModel, key).value));
fields.forEach((field) => {
if (field.prop) field.setInitialValue(getProp(initModel, field.prop).value);
});
};
const resetFields = (properties = []) => {
if (!props.model) {
/* @__PURE__ */ debugWarn(COMPONENT_NAME$21, "model is required for resetFields to work.");
return;
}
filterFields(fields, properties).forEach((field) => field.resetField());
const activePropStrings = new Set(fields.map((f) => f.propString).filter(Boolean));
const propsToCheck = properties.length > 0 ? castArray$1(properties).map((p) => isArray$1(p) ? p.join(".") : p) : [...initialValues.keys()];
for (const propString of propsToCheck) if (!activePropStrings.has(propString) && initialValues.has(propString)) getProp(props.model, propString).value = cloneDeep(initialValues.get(propString));
};
const clearValidate = (props = []) => {
filterFields(fields, props).forEach((field) => field.clearValidate());
};
const isValidatable = (0, vue.computed)(() => {
const hasModel = !!props.model;
if (!hasModel) /* @__PURE__ */ debugWarn(COMPONENT_NAME$21, "model is required for validate to work.");
return hasModel;
});
const obtainValidateFields = (props) => {
if (fields.length === 0) return [];
const filteredFields = filterFields(fields, props);
if (!filteredFields.length) {
/* @__PURE__ */ debugWarn(COMPONENT_NAME$21, "please pass correct props!");
return [];
}
return filteredFields;
};
const validate = async (callback) => validateField(void 0, callback);
const doValidateField = async (props = []) => {
if (!isValidatable.value) return false;
const fields = obtainValidateFields(props);
if (fields.length === 0) return true;
let validationErrors = {};
for (const field of fields) try {
await field.validate("");
if (field.validateState === "error" && !field.error) field.resetField();
} catch (fields) {
validationErrors = {
...validationErrors,
...fields
};
}
if (Object.keys(validationErrors).length === 0) return true;
return Promise.reject(validationErrors);
};
const validateField = async (modelProps = [], callback) => {
let result = false;
const shouldThrow = !isFunction$1(callback);
try {
result = await doValidateField(modelProps);
if (result === true) await callback?.(result);
return result;
} catch (e) {
if (e instanceof Error) throw e;
const invalidFields = e;
if (props.scrollToError) {
if (formRef.value) formRef.value.querySelector(`.${ns.b()}-item.is-error`)?.scrollIntoView(props.scrollIntoViewOptions);
}
!result && await callback?.(false, invalidFields);
return shouldThrow && Promise.reject(invalidFields);
}
};
const scrollToField = (prop) => {
const field = getField(prop);
if (field) field.$el?.scrollIntoView(props.scrollIntoViewOptions);
};
(0, vue.watch)(() => props.rules, () => {
if (props.validateOnRuleChange) validate().catch((err) => /* @__PURE__ */ debugWarn(err));
}, {
deep: true,
flush: "post"
});
(0, vue.provide)(formContextKey, (0, vue.reactive)({
...(0, vue.toRefs)(props),
emit,
resetFields,
clearValidate,
validateField,
getField,
addField,
removeField,
setInitialValues,
...useFormLabelWidth()
}));
__expose({
validate,
validateField,
resetFields,
clearValidate,
scrollToField,
getField,
fields,
setInitialValues
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("form", {
ref_key: "formRef",
ref: formRef,
class: (0, vue.normalizeClass)(formClasses.value)
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2);
};
}
});
//#endregion
//#region ../../packages/components/form/src/form.vue
var form_default = form_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/form/src/form-item.ts
const formItemValidateStates = [
"",
"error",
"validating",
"success"
];
/**
* @deprecated Removed after 3.0.0, Use `FormItemProps` instead.
*/
const formItemProps = buildProps({
label: String,
labelWidth: { type: [String, Number] },
labelPosition: {
type: String,
values: [
"left",
"right",
"top",
""
],
default: ""
},
prop: { type: definePropType([String, Array]) },
required: {
type: Boolean,
default: void 0
},
rules: { type: definePropType([Object, Array]) },
error: String,
validateStatus: {
type: String,
values: formItemValidateStates
},
for: String,
inlineMessage: {
type: Boolean,
default: void 0
},
showMessage: {
type: Boolean,
default: true
},
size: {
type: String,
values: componentSizes
}
});
//#endregion
//#region ../../node_modules/.pnpm/async-validator@4.2.5_patch_hash=cc6d77b35ed2a1683012935ca9ed998d418912785fcf78c6497d3268ac596d23/node_modules/async-validator/dist-web/index.js
function _extends() {
_extends = Object.assign ? Object.assign.bind() : function(target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i];
for (var key in source) if (Object.prototype.hasOwnProperty.call(source, key)) target[key] = source[key];
}
return target;
};
return _extends.apply(this, arguments);
}
function _inheritsLoose(subClass, superClass) {
subClass.prototype = Object.create(superClass.prototype);
subClass.prototype.constructor = subClass;
_setPrototypeOf(subClass, superClass);
}
function _getPrototypeOf(o) {
_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) {
return o.__proto__ || Object.getPrototypeOf(o);
};
return _getPrototypeOf(o);
}
function _setPrototypeOf(o, p) {
_setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
o.__proto__ = p;
return o;
};
return _setPrototypeOf(o, p);
}
function _isNativeReflectConstruct() {
if (typeof Reflect === "undefined" || !Reflect.construct) return false;
if (Reflect.construct.sham) return false;
if (typeof Proxy === "function") return true;
try {
Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {}));
return true;
} catch (e) {
return false;
}
}
function _construct(Parent, args, Class) {
if (_isNativeReflectConstruct()) _construct = Reflect.construct.bind();
else _construct = function _construct(Parent, args, Class) {
var a = [null];
a.push.apply(a, args);
var instance = new (Function.bind.apply(Parent, a))();
if (Class) _setPrototypeOf(instance, Class.prototype);
return instance;
};
return _construct.apply(null, arguments);
}
function _isNativeFunction(fn) {
return Function.toString.call(fn).indexOf("[native code]") !== -1;
}
function _wrapNativeSuper(Class) {
var _cache = typeof Map === "function" ? /* @__PURE__ */ new Map() : void 0;
_wrapNativeSuper = function _wrapNativeSuper(Class) {
if (Class === null || !_isNativeFunction(Class)) return Class;
if (typeof Class !== "function") throw new TypeError("Super expression must either be null or a function");
if (typeof _cache !== "undefined") {
if (_cache.has(Class)) return _cache.get(Class);
_cache.set(Class, Wrapper);
}
function Wrapper() {
return _construct(Class, arguments, _getPrototypeOf(this).constructor);
}
Wrapper.prototype = Object.create(Class.prototype, { constructor: {
value: Wrapper,
enumerable: false,
writable: true,
configurable: true
} });
return _setPrototypeOf(Wrapper, Class);
};
return _wrapNativeSuper(Class);
}
var formatRegExp = /%[sdj%]/g;
var warning = function warning() {};
if (typeof process !== "undefined" && process.env && false);
function convertFieldsError(errors) {
if (!errors || !errors.length) return null;
var fields = {};
errors.forEach(function(error) {
var field = error.field;
fields[field] = fields[field] || [];
fields[field].push(error);
});
return fields;
}
function format(template) {
for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) args[_key - 1] = arguments[_key];
var i = 0;
var len = args.length;
if (typeof template === "function") return template.apply(null, args);
if (typeof template === "string") return template.replace(formatRegExp, function(x) {
if (x === "%%") return "%";
if (i >= len) return x;
switch (x) {
case "%s": return String(args[i++]);
case "%d": return Number(args[i++]);
case "%j":
try {
return JSON.stringify(args[i++]);
} catch (_) {
return "[Circular]";
}
break;
default: return x;
}
});
return template;
}
function isNativeStringType(type) {
return type === "string" || type === "url" || type === "hex" || type === "email" || type === "date" || type === "pattern";
}
function isEmptyValue(value, type) {
if (value === void 0 || value === null) return true;
if (type === "array" && Array.isArray(value) && !value.length) return true;
if (isNativeStringType(type) && typeof value === "string" && !value) return true;
return false;
}
function asyncParallelArray(arr, func, callback) {
var results = [];
var total = 0;
var arrLength = arr.length;
function count(errors) {
results.push.apply(results, errors || []);
total++;
if (total === arrLength) callback(results);
}
arr.forEach(function(a) {
func(a, count);
});
}
function asyncSerialArray(arr, func, callback) {
var index = 0;
var arrLength = arr.length;
function next(errors) {
if (errors && errors.length) {
callback(errors);
return;
}
var original = index;
index = index + 1;
if (original < arrLength) func(arr[original], next);
else callback([]);
}
next([]);
}
function flattenObjArr(objArr) {
var ret = [];
Object.keys(objArr).forEach(function(k) {
ret.push.apply(ret, objArr[k] || []);
});
return ret;
}
var AsyncValidationError = /* @__PURE__ */ function(_Error) {
_inheritsLoose(AsyncValidationError, _Error);
function AsyncValidationError(errors, fields) {
var _this = _Error.call(this, "Async Validation Error") || this;
_this.errors = errors;
_this.fields = fields;
return _this;
}
return AsyncValidationError;
}(/* @__PURE__ */ _wrapNativeSuper(Error));
function asyncMap(objArr, option, func, callback, source) {
if (option.first) {
var _pending = new Promise(function(resolve, reject) {
asyncSerialArray(flattenObjArr(objArr), func, function next(errors) {
callback(errors);
return errors.length ? reject(new AsyncValidationError(errors, convertFieldsError(errors))) : resolve(source);
});
});
_pending["catch"](function(e) {
return e;
});
return _pending;
}
var firstFields = option.firstFields === true ? Object.keys(objArr) : option.firstFields || [];
var objArrKeys = Object.keys(objArr);
var objArrLength = objArrKeys.length;
var total = 0;
var results = [];
var pending = new Promise(function(resolve, reject) {
var next = function next(errors) {
results.push.apply(results, errors);
total++;
if (total === objArrLength) {
callback(results);
return results.length ? reject(new AsyncValidationError(results, convertFieldsError(results))) : resolve(source);
}
};
if (!objArrKeys.length) {
callback(results);
resolve(source);
}
objArrKeys.forEach(function(key) {
var arr = objArr[key];
if (firstFields.indexOf(key) !== -1) asyncSerialArray(arr, func, next);
else asyncParallelArray(arr, func, next);
});
});
pending["catch"](function(e) {
return e;
});
return pending;
}
function isErrorObj(obj) {
return !!(obj && obj.message !== void 0);
}
function getValue(value, path) {
var v = value;
for (var i = 0; i < path.length; i++) {
if (v == void 0) return v;
v = v[path[i]];
}
return v;
}
function complementError(rule, source) {
return function(oe) {
var fieldValue;
if (rule.fullFields) fieldValue = getValue(source, rule.fullFields);
else fieldValue = source[oe.field || rule.fullField];
if (isErrorObj(oe)) {
oe.field = oe.field || rule.fullField;
oe.fieldValue = fieldValue;
return oe;
}
return {
message: typeof oe === "function" ? oe() : oe,
fieldValue,
field: oe.field || rule.fullField
};
};
}
function deepMerge(target, source) {
if (source) {
for (var s in source) if (source.hasOwnProperty(s)) {
var value = source[s];
if (typeof value === "object" && typeof target[s] === "object") target[s] = _extends({}, target[s], value);
else target[s] = value;
}
}
return target;
}
var required$1 = function required(rule, value, source, errors, options, type) {
if (rule.required && (!source.hasOwnProperty(rule.field) || isEmptyValue(value, type || rule.type))) errors.push(format(options.messages.required, rule.fullField));
};
/**
* Rule for validating whitespace.
*
* @param rule The validation rule.
* @param value The value of the field on the source object.
* @param source The source object being validated.
* @param errors An array of errors that this rule may add
* validation errors to.
* @param options The validation options.
* @param options.messages The validation messages.
*/
var whitespace = function whitespace(rule, value, source, errors, options) {
if (/^\s+$/.test(value) || value === "") errors.push(format(options.messages.whitespace, rule.fullField));
};
var urlReg;
var getUrlRegex = (function() {
if (urlReg) return urlReg;
var word = "[a-fA-F\\d:]";
var b = function b(options) {
return options && options.includeBoundaries ? "(?:(?<=\\s|^)(?=" + word + ")|(?<=" + word + ")(?=\\s|$))" : "";
};
var v4 = "(?:25[0-5]|2[0-4]\\d|1\\d\\d|[1-9]\\d|\\d)(?:\\.(?:25[0-5]|2[0-4]\\d|1\\d\\d|[1-9]\\d|\\d)){3}";
var v6seg = "[a-fA-F\\d]{1,4}";
var v6 = ("\n(?:\n(?:" + v6seg + ":){7}(?:" + v6seg + "|:)| // 1:2:3:4:5:6:7:: 1:2:3:4:5:6:7:8\n(?:" + v6seg + ":){6}(?:" + v4 + "|:" + v6seg + "|:)| // 1:2:3:4:5:6:: 1:2:3:4:5:6::8 1:2:3:4:5:6::8 1:2:3:4:5:6::1.2.3.4\n(?:" + v6seg + ":){5}(?::" + v4 + "|(?::" + v6seg + "){1,2}|:)| // 1:2:3:4:5:: 1:2:3:4:5::7:8 1:2:3:4:5::8 1:2:3:4:5::7:1.2.3.4\n(?:" + v6seg + ":){4}(?:(?::" + v6seg + "){0,1}:" + v4 + "|(?::" + v6seg + "){1,3}|:)| // 1:2:3:4:: 1:2:3:4::6:7:8 1:2:3:4::8 1:2:3:4::6:7:1.2.3.4\n(?:" + v6seg + ":){3}(?:(?::" + v6seg + "){0,2}:" + v4 + "|(?::" + v6seg + "){1,4}|:)| // 1:2:3:: 1:2:3::5:6:7:8 1:2:3::8 1:2:3::5:6:7:1.2.3.4\n(?:" + v6seg + ":){2}(?:(?::" + v6seg + "){0,3}:" + v4 + "|(?::" + v6seg + "){1,5}|:)| // 1:2:: 1:2::4:5:6:7:8 1:2::8 1:2::4:5:6:7:1.2.3.4\n(?:" + v6seg + ":){1}(?:(?::" + v6seg + "){0,4}:" + v4 + "|(?::" + v6seg + "){1,6}|:)| // 1:: 1::3:4:5:6:7:8 1::8 1::3:4:5:6:7:1.2.3.4\n(?::(?:(?::" + v6seg + "){0,5}:" + v4 + "|(?::" + v6seg + "){1,7}|:)) // ::2:3:4:5:6:7:8 ::2:3:4:5:6:7:8 ::8 ::1.2.3.4\n)(?:%[0-9a-zA-Z]{1,})? // %eth0 %1\n").replace(/\s*\/\/.*$/gm, "").replace(/\n/g, "").trim();
var v46Exact = new RegExp("(?:^" + v4 + "$)|(?:^" + v6 + "$)");
var v4exact = new RegExp("^" + v4 + "$");
var v6exact = new RegExp("^" + v6 + "$");
var ip = function ip(options) {
return options && options.exact ? v46Exact : new RegExp("(?:" + b(options) + v4 + b(options) + ")|(?:" + b(options) + v6 + b(options) + ")", "g");
};
ip.v4 = function(options) {
return options && options.exact ? v4exact : new RegExp("" + b(options) + v4 + b(options), "g");
};
ip.v6 = function(options) {
return options && options.exact ? v6exact : new RegExp("" + b(options) + v6 + b(options), "g");
};
var protocol = "(?:(?:[a-z]+:)?//)";
var auth = "(?:\\S+(?::\\S*)?@)?";
var ipv4 = ip.v4().source;
var ipv6 = ip.v6().source;
var regex = "(?:" + protocol + "|www\\.)" + auth + "(?:localhost|" + ipv4 + "|" + ipv6 + "|(?:(?:[a-z\\u00a1-\\uffff0-9][-_]*)*[a-z\\u00a1-\\uffff0-9]+)(?:\\.(?:[a-z\\u00a1-\\uffff0-9]-*)*[a-z\\u00a1-\\uffff0-9]+)*(?:\\.(?:[a-z\\u00a1-\\uffff]{2,})))(?::\\d{2,5})?(?:[/?#][^\\s\"]*)?";
urlReg = new RegExp("(?:^" + regex + "$)", "i");
return urlReg;
});
var pattern$2 = {
email: /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]+\.)+[a-zA-Z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]{2,}))$/,
hex: /^#?([a-f0-9]{6}|[a-f0-9]{3})$/i
};
var types = {
integer: function integer(value) {
return types.number(value) && parseInt(value, 10) === value;
},
"float": function float(value) {
return types.number(value) && !types.integer(value);
},
array: function array(value) {
return Array.isArray(value);
},
regexp: function regexp(value) {
if (value instanceof RegExp) return true;
try {
return !!new RegExp(value);
} catch (e) {
return false;
}
},
date: function date(value) {
return typeof value.getTime === "function" && typeof value.getMonth === "function" && typeof value.getYear === "function" && !isNaN(value.getTime());
},
number: function number(value) {
if (isNaN(value)) return false;
return typeof value === "number";
},
object: function object(value) {
return typeof value === "object" && !types.array(value);
},
method: function method(value) {
return typeof value === "function";
},
email: function email(value) {
return typeof value === "string" && value.length <= 320 && !!value.match(pattern$2.email);
},
url: function url(value) {
return typeof value === "string" && value.length <= 2048 && !!value.match(getUrlRegex());
},
hex: function hex(value) {
return typeof value === "string" && !!value.match(pattern$2.hex);
}
};
var type$1 = function type(rule, value, source, errors, options) {
if (rule.required && value === void 0) {
required$1(rule, value, source, errors, options);
return;
}
var custom = [
"integer",
"float",
"array",
"regexp",
"object",
"method",
"email",
"number",
"date",
"url",
"hex"
];
var ruleType = rule.type;
if (custom.indexOf(ruleType) > -1) {
if (!types[ruleType](value)) errors.push(format(options.messages.types[ruleType], rule.fullField, rule.type));
} else if (ruleType && typeof value !== rule.type) errors.push(format(options.messages.types[ruleType], rule.fullField, rule.type));
};
var range = function range(rule, value, source, errors, options) {
var len = typeof rule.len === "number";
var min = typeof rule.min === "number";
var max = typeof rule.max === "number";
var val = value;
var key = null;
var num = typeof value === "number";
var str = typeof value === "string";
var arr = Array.isArray(value);
if (num) key = "number";
else if (str) key = "string";
else if (arr) key = "array";
if (!key) return false;
if (arr) val = value.length;
if (str) val = value.length;
if (len) {
if (val !== rule.len) errors.push(format(options.messages[key].len, rule.fullField, rule.len));
} else if (min && !max && val < rule.min) errors.push(format(options.messages[key].min, rule.fullField, rule.min));
else if (max && !min && val > rule.max) errors.push(format(options.messages[key].max, rule.fullField, rule.max));
else if (min && max && (val < rule.min || val > rule.max)) errors.push(format(options.messages[key].range, rule.fullField, rule.min, rule.max));
};
var ENUM$1 = "enum";
var enumerable$1 = function enumerable(rule, value, source, errors, options) {
rule[ENUM$1] = Array.isArray(rule[ENUM$1]) ? rule[ENUM$1] : [];
if (rule[ENUM$1].indexOf(value) === -1) errors.push(format(options.messages[ENUM$1], rule.fullField, rule[ENUM$1].join(", ")));
};
var pattern$1 = function pattern(rule, value, source, errors, options) {
if (rule.pattern) {
if (rule.pattern instanceof RegExp) {
rule.pattern.lastIndex = 0;
if (!rule.pattern.test(value)) errors.push(format(options.messages.pattern.mismatch, rule.fullField, value, rule.pattern));
} else if (typeof rule.pattern === "string") {
if (!new RegExp(rule.pattern).test(value)) errors.push(format(options.messages.pattern.mismatch, rule.fullField, value, rule.pattern));
}
}
};
var rules = {
required: required$1,
whitespace,
type: type$1,
range,
"enum": enumerable$1,
pattern: pattern$1
};
var string = function string(rule, value, callback, source, options) {
var errors = [];
if (rule.required || !rule.required && source.hasOwnProperty(rule.field)) {
if (isEmptyValue(value, "string") && !rule.required) return callback();
rules.required(rule, value, source, errors, options, "string");
if (!isEmptyValue(value, "string")) {
rules.type(rule, value, source, errors, options);
rules.range(rule, value, source, errors, options);
rules.pattern(rule, value, source, errors, options);
if (rule.whitespace === true) rules.whitespace(rule, value, source, errors, options);
}
}
callback(errors);
};
var method = function method(rule, value, callback, source, options) {
var errors = [];
if (rule.required || !rule.required && source.hasOwnProperty(rule.field)) {
if (isEmptyValue(value) && !rule.required) return callback();
rules.required(rule, value, source, errors, options);
if (value !== void 0) rules.type(rule, value, source, errors, options);
}
callback(errors);
};
var number = function number(rule, value, callback, source, options) {
var errors = [];
if (rule.required || !rule.required && source.hasOwnProperty(rule.field)) {
if (value === "") value = void 0;
if (isEmptyValue(value) && !rule.required) return callback();
rules.required(rule, value, source, errors, options);
if (value !== void 0) {
rules.type(rule, value, source, errors, options);
rules.range(rule, value, source, errors, options);
}
}
callback(errors);
};
var _boolean = function _boolean(rule, value, callback, source, options) {
var errors = [];
if (rule.required || !rule.required && source.hasOwnProperty(rule.field)) {
if (isEmptyValue(value) && !rule.required) return callback();
rules.required(rule, value, source, errors, options);
if (value !== void 0) rules.type(rule, value, source, errors, options);
}
callback(errors);
};
var regexp = function regexp(rule, value, callback, source, options) {
var errors = [];
if (rule.required || !rule.required && source.hasOwnProperty(rule.field)) {
if (isEmptyValue(value) && !rule.required) return callback();
rules.required(rule, value, source, errors, options);
if (!isEmptyValue(value)) rules.type(rule, value, source, errors, options);
}
callback(errors);
};
var integer = function integer(rule, value, callback, source, options) {
var errors = [];
if (rule.required || !rule.required && source.hasOwnProperty(rule.field)) {
if (isEmptyValue(value) && !rule.required) return callback();
rules.required(rule, value, source, errors, options);
if (value !== void 0) {
rules.type(rule, value, source, errors, options);
rules.range(rule, value, source, errors, options);
}
}
callback(errors);
};
var floatFn = function floatFn(rule, value, callback, source, options) {
var errors = [];
if (rule.required || !rule.required && source.hasOwnProperty(rule.field)) {
if (isEmptyValue(value) && !rule.required) return callback();
rules.required(rule, value, source, errors, options);
if (value !== void 0) {
rules.type(rule, value, source, errors, options);
rules.range(rule, value, source, errors, options);
}
}
callback(errors);
};
var array = function array(rule, value, callback, source, options) {
var errors = [];
if (rule.required || !rule.required && source.hasOwnProperty(rule.field)) {
if ((value === void 0 || value === null) && !rule.required) return callback();
rules.required(rule, value, source, errors, options, "array");
if (value !== void 0 && value !== null) {
rules.type(rule, value, source, errors, options);
rules.range(rule, value, source, errors, options);
}
}
callback(errors);
};
var object = function object(rule, value, callback, source, options) {
var errors = [];
if (rule.required || !rule.required && source.hasOwnProperty(rule.field)) {
if (isEmptyValue(value) && !rule.required) return callback();
rules.required(rule, value, source, errors, options);
if (value !== void 0) rules.type(rule, value, source, errors, options);
}
callback(errors);
};
var ENUM = "enum";
var enumerable = function enumerable(rule, value, callback, source, options) {
var errors = [];
if (rule.required || !rule.required && source.hasOwnProperty(rule.field)) {
if (isEmptyValue(value) && !rule.required) return callback();
rules.required(rule, value, source, errors, options);
if (value !== void 0) rules[ENUM](rule, value, source, errors, options);
}
callback(errors);
};
var pattern = function pattern(rule, value, callback, source, options) {
var errors = [];
if (rule.required || !rule.required && source.hasOwnProperty(rule.field)) {
if (isEmptyValue(value, "string") && !rule.required) return callback();
rules.required(rule, value, source, errors, options);
if (!isEmptyValue(value, "string")) rules.pattern(rule, value, source, errors, options);
}
callback(errors);
};
var date = function date(rule, value, callback, source, options) {
var errors = [];
if (rule.required || !rule.required && source.hasOwnProperty(rule.field)) {
if (isEmptyValue(value, "date") && !rule.required) return callback();
rules.required(rule, value, source, errors, options);
if (!isEmptyValue(value, "date")) {
var dateObject;
if (value instanceof Date) dateObject = value;
else dateObject = new Date(value);
rules.type(rule, dateObject, source, errors, options);
if (dateObject) rules.range(rule, dateObject.getTime(), source, errors, options);
}
}
callback(errors);
};
var required = function required(rule, value, callback, source, options) {
var errors = [];
var type = Array.isArray(value) ? "array" : typeof value;
rules.required(rule, value, source, errors, options, type);
callback(errors);
};
var type = function type(rule, value, callback, source, options) {
var ruleType = rule.type;
var errors = [];
if (rule.required || !rule.required && source.hasOwnProperty(rule.field)) {
if (isEmptyValue(value, ruleType) && !rule.required) return callback();
rules.required(rule, value, source, errors, options, ruleType);
if (!isEmptyValue(value, ruleType)) rules.type(rule, value, source, errors, options);
}
callback(errors);
};
var any = function any(rule, value, callback, source, options) {
var errors = [];
if (rule.required || !rule.required && source.hasOwnProperty(rule.field)) {
if (isEmptyValue(value) && !rule.required) return callback();
rules.required(rule, value, source, errors, options);
}
callback(errors);
};
var validators = {
string,
method,
number,
"boolean": _boolean,
regexp,
integer,
"float": floatFn,
array,
object,
"enum": enumerable,
pattern,
date,
url: type,
hex: type,
email: type,
required,
any
};
function newMessages() {
return {
"default": "Validation error on field %s",
required: "%s is required",
"enum": "%s must be one of %s",
whitespace: "%s cannot be empty",
date: {
format: "%s date %s is invalid for format %s",
parse: "%s date could not be parsed, %s is invalid ",
invalid: "%s date %s is invalid"
},
types: {
string: "%s is not a %s",
method: "%s is not a %s (function)",
array: "%s is not an %s",
object: "%s is not an %s",
number: "%s is not a %s",
date: "%s is not a %s",
"boolean": "%s is not a %s",
integer: "%s is not an %s",
"float": "%s is not a %s",
regexp: "%s is not a valid %s",
email: "%s is not a valid %s",
url: "%s is not a valid %s",
hex: "%s is not a valid %s"
},
string: {
len: "%s must be exactly %s characters",
min: "%s must be at least %s characters",
max: "%s cannot be longer than %s characters",
range: "%s must be between %s and %s characters"
},
number: {
len: "%s must equal %s",
min: "%s cannot be less than %s",
max: "%s cannot be greater than %s",
range: "%s must be between %s and %s"
},
array: {
len: "%s must be exactly %s in length",
min: "%s cannot be less than %s in length",
max: "%s cannot be greater than %s in length",
range: "%s must be between %s and %s in length"
},
pattern: { mismatch: "%s value %s does not match pattern %s" },
clone: function clone() {
var cloned = JSON.parse(JSON.stringify(this));
cloned.clone = this.clone;
return cloned;
}
};
}
var messages = newMessages();
/**
* Encapsulates a validation schema.
*
* @param descriptor An object declaring validation rules
* for this schema.
*/
var Schema = /* @__PURE__ */ function() {
function Schema(descriptor) {
this.rules = null;
this._messages = messages;
this.define(descriptor);
}
var _proto = Schema.prototype;
_proto.define = function define(rules) {
var _this = this;
if (!rules) throw new Error("Cannot configure a schema with no rules");
if (typeof rules !== "object" || Array.isArray(rules)) throw new Error("Rules must be an object");
this.rules = {};
Object.keys(rules).forEach(function(name) {
var item = rules[name];
_this.rules[name] = Array.isArray(item) ? item : [item];
});
};
_proto.messages = function messages(_messages) {
if (_messages) this._messages = deepMerge(newMessages(), _messages);
return this._messages;
};
_proto.validate = function validate(source_, o, oc) {
var _this2 = this;
if (o === void 0) o = {};
if (oc === void 0) oc = function oc() {};
var source = source_;
var options = o;
var callback = oc;
if (typeof options === "function") {
callback = options;
options = {};
}
if (!this.rules || Object.keys(this.rules).length === 0) {
if (callback) callback(null, source);
return Promise.resolve(source);
}
function complete(results) {
var errors = [];
var fields = {};
function add(e) {
if (Array.isArray(e)) {
var _errors;
errors = (_errors = errors).concat.apply(_errors, e);
} else errors.push(e);
}
for (var i = 0; i < results.length; i++) add(results[i]);
if (!errors.length) callback(null, source);
else {
fields = convertFieldsError(errors);
callback(errors, fields);
}
}
if (options.messages) {
var messages$1 = this.messages();
if (messages$1 === messages) messages$1 = newMessages();
deepMerge(messages$1, options.messages);
options.messages = messages$1;
} else options.messages = this.messages();
var series = {};
(options.keys || Object.keys(this.rules)).forEach(function(z) {
var arr = _this2.rules[z];
var value = source[z];
arr.forEach(function(r) {
var rule = r;
if (typeof rule.transform === "function") {
if (source === source_) source = _extends({}, source);
value = source[z] = rule.transform(value);
}
if (typeof rule === "function") rule = { validator: rule };
else rule = _extends({}, rule);
rule.validator = _this2.getValidationMethod(rule);
if (!rule.validator) return;
rule.field = z;
rule.fullField = rule.fullField || z;
rule.type = _this2.getType(rule);
series[z] = series[z] || [];
series[z].push({
rule,
value,
source,
field: z
});
});
});
var errorFields = {};
return asyncMap(series, options, function(data, doIt) {
var rule = data.rule;
var deep = (rule.type === "object" || rule.type === "array") && (typeof rule.fields === "object" || typeof rule.defaultField === "object");
deep = deep && (rule.required || !rule.required && data.value);
rule.field = data.field;
function addFullField(key, schema) {
return _extends({}, schema, {
fullField: rule.fullField + "." + key,
fullFields: rule.fullFields ? [].concat(rule.fullFields, [key]) : [key]
});
}
function cb(e) {
if (e === void 0) e = [];
var errorList = Array.isArray(e) ? e : [e];
if (!options.suppressWarning && errorList.length) Schema.warning("async-validator:", errorList);
if (errorList.length && rule.message !== void 0) errorList = [].concat(rule.message);
var filledErrors = errorList.map(complementError(rule, source));
if (options.first && filledErrors.length) {
errorFields[rule.field] = 1;
return doIt(filledErrors);
}
if (!deep) doIt(filledErrors);
else {
if (rule.required && !data.value) {
if (rule.message !== void 0) filledErrors = [].concat(rule.message).map(complementError(rule, source));
else if (options.error) filledErrors = [options.error(rule, format(options.messages.required, rule.field))];
return doIt(filledErrors);
}
var fieldsSchema = {};
if (rule.defaultField) Object.keys(data.value).map(function(key) {
fieldsSchema[key] = rule.defaultField;
});
fieldsSchema = _extends({}, fieldsSchema, data.rule.fields);
var paredFieldsSchema = {};
Object.keys(fieldsSchema).forEach(function(field) {
var fieldSchema = fieldsSchema[field];
paredFieldsSchema[field] = (Array.isArray(fieldSchema) ? fieldSchema : [fieldSchema]).map(addFullField.bind(null, field));
});
var schema = new Schema(paredFieldsSchema);
schema.messages(options.messages);
if (data.rule.options) {
data.rule.options.messages = options.messages;
data.rule.options.error = options.error;
}
schema.validate(data.value, data.rule.options || options, function(errs) {
var finalErrors = [];
if (filledErrors && filledErrors.length) finalErrors.push.apply(finalErrors, filledErrors);
if (errs && errs.length) finalErrors.push.apply(finalErrors, errs);
doIt(finalErrors.length ? finalErrors : null);
});
}
}
var res;
if (rule.asyncValidator) res = rule.asyncValidator(rule, data.value, cb, data.source, options);
else if (rule.validator) {
try {
res = rule.validator(rule, data.value, cb, data.source, options);
} catch (error) {
console.error == null || console.error(error);
if (!options.suppressValidatorError) setTimeout(function() {
throw error;
}, 0);
cb(error.message);
}
if (res === true) cb();
else if (res === false) cb(typeof rule.message === "function" ? rule.message(rule.fullField || rule.field) : rule.message || (rule.fullField || rule.field) + " fails");
else if (res instanceof Array) cb(res);
else if (res instanceof Error) cb(res.message);
}
if (res && res.then) res.then(function() {
return cb();
}, function(e) {
return cb(e);
});
}, function(results) {
complete(results);
}, source);
};
_proto.getType = function getType(rule) {
if (rule.type === void 0 && rule.pattern instanceof RegExp) rule.type = "pattern";
if (typeof rule.validator !== "function" && rule.type && !validators.hasOwnProperty(rule.type)) throw new Error(format("Unknown rule type %s", rule.type));
return rule.type || "string";
};
_proto.getValidationMethod = function getValidationMethod(rule) {
if (typeof rule.validator === "function") return rule.validator;
var keys = Object.keys(rule);
var messageIndex = keys.indexOf("message");
if (messageIndex !== -1) keys.splice(messageIndex, 1);
if (keys.length === 1 && keys[0] === "required") return validators.required;
return validators[this.getType(rule)] || void 0;
};
return Schema;
}();
Schema.register = function register(type, validator) {
if (typeof validator !== "function") throw new Error("Cannot register a validator by type, validator is not a function");
validators[type] = validator;
};
Schema.warning = warning;
Schema.messages = messages;
Schema.validators = validators;
//#endregion
//#region ../../packages/components/form/src/form-label-wrap.tsx
const COMPONENT_NAME$20 = "ElLabelWrap";
var form_label_wrap_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: COMPONENT_NAME$20,
props: {
isAutoWidth: Boolean,
updateAll: Boolean
},
setup(props, { slots }) {
const formContext = (0, vue.inject)(formContextKey, void 0);
const formItemContext = (0, vue.inject)(formItemContextKey);
if (!formItemContext) throwError(COMPONENT_NAME$20, "usage: <el-form-item><label-wrap /></el-form-item>");
const ns = useNamespace("form");
const el = (0, vue.ref)();
const computedWidth = (0, vue.ref)(0);
const getLabelWidth = () => {
if (el.value?.firstElementChild) {
const width = window.getComputedStyle(el.value.firstElementChild).width;
return Math.ceil(Number.parseFloat(width));
} else return 0;
};
const updateLabelWidth = (action = "update") => {
(0, vue.nextTick)(() => {
if (slots.default && props.isAutoWidth) {
if (action === "update") computedWidth.value = getLabelWidth();
else if (action === "remove") formContext?.deregisterLabelWidth(computedWidth.value);
}
});
};
const updateLabelWidthFn = () => updateLabelWidth("update");
(0, vue.onMounted)(() => {
updateLabelWidthFn();
});
(0, vue.onBeforeUnmount)(() => {
updateLabelWidth("remove");
});
(0, vue.onUpdated)(() => updateLabelWidthFn());
(0, vue.watch)(computedWidth, (val, oldVal) => {
if (props.updateAll) formContext?.registerLabelWidth(val, oldVal);
});
useResizeObserver((0, vue.computed)(() => el.value?.firstElementChild ?? null), updateLabelWidthFn);
return () => {
if (!slots) return null;
const { isAutoWidth } = props;
if (isAutoWidth) {
const autoLabelWidth = formContext?.autoLabelWidth;
const hasLabel = formItemContext?.hasLabel;
const style = {};
if (hasLabel && autoLabelWidth && autoLabelWidth !== "auto") {
const marginWidth = Math.max(0, Number.parseInt(autoLabelWidth, 10) - computedWidth.value);
const marginPosition = (formItemContext.labelPosition || formContext.labelPosition) === "left" ? "marginRight" : "marginLeft";
if (marginWidth) style[marginPosition] = `${marginWidth}px`;
}
return (0, vue.createVNode)("div", {
"ref": el,
"class": [ns.be("item", "label-wrap")],
"style": style
}, [slots.default?.()]);
} else return (0, vue.createVNode)(vue.Fragment, { "ref": el }, [slots.default?.()]);
};
}
});
//#endregion
//#region ../../packages/components/form/src/form-item.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$78 = ["role", "aria-labelledby"];
var form_item_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElFormItem",
__name: "form-item",
props: formItemProps,
setup(__props, { expose: __expose }) {
const props = __props;
const slots = (0, vue.useSlots)();
const formContext = (0, vue.inject)(formContextKey, void 0);
const parentFormItemContext = (0, vue.inject)(formItemContextKey, void 0);
const _size = useFormSize(void 0, { formItem: false });
const ns = useNamespace("form-item");
const labelId = useId().value;
const inputIds = (0, vue.ref)([]);
const validateState = (0, vue.ref)("");
const validateStateDebounced = refDebounced(validateState, 100);
const validateMessage = (0, vue.ref)("");
const formItemRef = (0, vue.ref)();
let initialValue = void 0;
let isResettingField = false;
const labelPosition = (0, vue.computed)(() => props.labelPosition || formContext?.labelPosition);
const labelStyle = (0, vue.computed)(() => {
if (labelPosition.value === "top") return {};
return { width: addUnit(props.labelWidth ?? formContext?.labelWidth) };
});
const contentStyle = (0, vue.computed)(() => {
if (labelPosition.value === "top" || formContext?.inline) return {};
if (!props.label && !props.labelWidth && isNested) return {};
const labelWidth = addUnit(props.labelWidth ?? formContext?.labelWidth);
if (!props.label && !slots.label) return { marginLeft: labelWidth };
return {};
});
const formItemClasses = (0, vue.computed)(() => [
ns.b(),
ns.m(_size.value),
ns.is("error", validateState.value === "error"),
ns.is("validating", validateState.value === "validating"),
ns.is("success", validateState.value === "success"),
ns.is("required", isRequired.value || props.required),
ns.is("no-asterisk", formContext?.hideRequiredAsterisk),
formContext?.requireAsteriskPosition === "right" ? "asterisk-right" : "asterisk-left",
{
[ns.m("feedback")]: formContext?.statusIcon,
[ns.m(`label-${labelPosition.value}`)]: labelPosition.value
}
]);
const _inlineMessage = (0, vue.computed)(() => isBoolean(props.inlineMessage) ? props.inlineMessage : formContext?.inlineMessage || false);
const validateClasses = (0, vue.computed)(() => [ns.e("error"), { [ns.em("error", "inline")]: _inlineMessage.value }]);
const propString = (0, vue.computed)(() => {
if (!props.prop) return "";
return isArray$1(props.prop) ? props.prop.join(".") : props.prop;
});
const hasLabel = (0, vue.computed)(() => {
return !!(props.label || slots.label);
});
const labelFor = (0, vue.computed)(() => {
return props.for ?? (inputIds.value.length === 1 ? inputIds.value[0] : void 0);
});
const isGroup = (0, vue.computed)(() => {
return !labelFor.value && hasLabel.value;
});
const isNested = !!parentFormItemContext;
const fieldValue = (0, vue.computed)(() => {
const model = formContext?.model;
if (!model || !props.prop) return;
return getProp(model, props.prop).value;
});
const normalizedRules = (0, vue.computed)(() => {
const { required } = props;
const rules = [];
if (props.rules) rules.push(...castArray$1(props.rules));
const formRules = formContext?.rules;
if (formRules && props.prop) {
const _rules = getProp(formRules, props.prop).value;
if (_rules) rules.push(...castArray$1(_rules));
}
if (required !== void 0) {
const requiredRules = rules.map((rule, i) => [rule, i]).filter(([rule]) => "required" in rule);
if (requiredRules.length > 0) for (const [rule, i] of requiredRules) {
if (rule.required === required) continue;
rules[i] = {
...rule,
required
};
}
else rules.push({ required });
}
return rules;
});
const validateEnabled = (0, vue.computed)(() => normalizedRules.value.length > 0);
const getFilteredRule = (trigger) => {
return normalizedRules.value.filter((rule) => {
if (!rule.trigger || !trigger) return true;
if (isArray$1(rule.trigger)) return rule.trigger.includes(trigger);
else return rule.trigger === trigger;
}).map(({ trigger, ...rule }) => rule);
};
const isRequired = (0, vue.computed)(() => normalizedRules.value.some((rule) => rule.required));
const shouldShowError = (0, vue.computed)(() => validateStateDebounced.value === "error" && props.showMessage && (formContext?.showMessage ?? true));
const currentLabel = (0, vue.computed)(() => `${props.label || ""}${formContext?.labelSuffix || ""}`);
const setValidationState = (state) => {
validateState.value = state;
};
const onValidationFailed = (error) => {
const { errors, fields } = error;
if (!errors || !fields) console.error(error);
setValidationState("error");
validateMessage.value = errors ? errors?.[0]?.message ?? `${props.prop} is required` : "";
formContext?.emit("validate", props.prop, false, validateMessage.value);
};
const onValidationSucceeded = () => {
setValidationState("success");
formContext?.emit("validate", props.prop, true, "");
};
const doValidate = async (rules) => {
const modelName = propString.value;
return new Schema({ [modelName]: rules }).validate({ [modelName]: fieldValue.value }, { firstFields: true }).then(() => {
onValidationSucceeded();
return true;
}).catch((err) => {
onValidationFailed(err);
return Promise.reject(err);
});
};
const validate = async (trigger, callback) => {
if (isResettingField || !props.prop) return false;
const hasCallback = isFunction$1(callback);
if (!validateEnabled.value) {
callback?.(false);
return false;
}
const rules = getFilteredRule(trigger);
if (rules.length === 0) {
callback?.(true);
return true;
}
setValidationState("validating");
return doValidate(rules).then(() => {
callback?.(true);
return true;
}).catch((err) => {
const { fields } = err;
callback?.(false, fields);
return hasCallback ? false : Promise.reject(fields);
});
};
const clearValidate = () => {
setValidationState("");
validateMessage.value = "";
isResettingField = false;
};
const resetField = async () => {
const model = formContext?.model;
if (!model || !props.prop) return;
const computedValue = getProp(model, props.prop);
isResettingField = true;
computedValue.value = cloneDeep(initialValue);
await (0, vue.nextTick)();
clearValidate();
isResettingField = false;
};
const addInputId = (id) => {
if (!inputIds.value.includes(id)) inputIds.value.push(id);
};
const removeInputId = (id) => {
inputIds.value = inputIds.value.filter((listId) => listId !== id);
};
const setInitialValue = (value) => {
initialValue = cloneDeep(value);
};
const getInitialValue = () => initialValue;
(0, vue.watch)(() => props.error, (val) => {
validateMessage.value = val || "";
setValidationState(val ? "error" : "");
}, { immediate: true });
(0, vue.watch)(() => props.validateStatus, (val) => setValidationState(val || ""));
const context = (0, vue.reactive)({
...(0, vue.toRefs)(props),
$el: formItemRef,
size: _size,
validateMessage,
validateState,
labelId,
inputIds,
isGroup,
hasLabel,
fieldValue,
addInputId,
removeInputId,
resetField,
clearValidate,
validate,
propString,
setInitialValue,
getInitialValue
});
(0, vue.provide)(formItemContextKey, context);
(0, vue.watch)(propString, (newPropString, oldPropString) => {
if (!formContext || !oldPropString) return;
formContext.removeField(context, oldPropString);
if (newPropString) {
setInitialValue(fieldValue.value);
formContext.addField(context);
}
});
(0, vue.onMounted)(() => {
if (props.prop) {
setInitialValue(fieldValue.value);
formContext?.addField(context);
}
});
(0, vue.onBeforeUnmount)(() => {
formContext?.removeField(context);
});
__expose({
size: _size,
validateMessage,
validateState,
validate,
clearValidate,
resetField,
setInitialValue
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref_key: "formItemRef",
ref: formItemRef,
class: (0, vue.normalizeClass)(formItemClasses.value),
role: isGroup.value ? "group" : void 0,
"aria-labelledby": isGroup.value ? (0, vue.unref)(labelId) : void 0
}, [(0, vue.createVNode)((0, vue.unref)(form_label_wrap_default), {
"is-auto-width": labelStyle.value.width === "auto",
"update-all": (0, vue.unref)(formContext)?.labelWidth === "auto"
}, {
default: (0, vue.withCtx)(() => [!!(__props.label || _ctx.$slots.label) ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(labelFor.value ? "label" : "div"), {
key: 0,
id: (0, vue.unref)(labelId),
for: labelFor.value,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("label")),
style: (0, vue.normalizeStyle)(labelStyle.value)
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "label", { label: currentLabel.value }, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(currentLabel.value), 1)])]),
_: 3
}, 8, [
"id",
"for",
"class",
"style"
])) : (0, vue.createCommentVNode)("v-if", true)]),
_: 3
}, 8, ["is-auto-width", "update-all"]), (0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("content")),
style: (0, vue.normalizeStyle)(contentStyle.value)
}, [(0, vue.renderSlot)(_ctx.$slots, "default"), (0, vue.createVNode)(vue.TransitionGroup, { name: `${(0, vue.unref)(ns).namespace.value}-zoom-in-top` }, {
default: (0, vue.withCtx)(() => [shouldShowError.value ? (0, vue.renderSlot)(_ctx.$slots, "error", {
key: 0,
error: validateMessage.value
}, () => [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)(validateClasses.value) }, (0, vue.toDisplayString)(validateMessage.value), 3)]) : (0, vue.createCommentVNode)("v-if", true)]),
_: 3
}, 8, ["name"])], 6)], 10, _hoisted_1$78);
};
}
});
//#endregion
//#region ../../packages/components/form/src/form-item.vue
var form_item_default = form_item_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/form/index.ts
const ElForm = withInstall(form_default, { FormItem: form_item_default });
const ElFormItem = withNoopInstall(form_item_default);
//#endregion
//#region ../../packages/components/popper/src/utils.ts
const buildPopperOptions = (props, modifiers = []) => {
const { placement, strategy, popperOptions } = props;
const options = {
placement,
strategy,
...popperOptions,
modifiers: [...genModifiers(props), ...modifiers]
};
deriveExtraModifiers(options, popperOptions?.modifiers);
return options;
};
const unwrapMeasurableEl = ($el) => {
if (!isClient) return;
return unrefElement($el);
};
function genModifiers(options) {
const { offset, gpuAcceleration, fallbackPlacements } = options;
return [
{
name: "offset",
options: { offset: [0, offset ?? 12] }
},
{
name: "preventOverflow",
options: { padding: {
top: 0,
bottom: 0,
left: 0,
right: 0
} }
},
{
name: "flip",
options: {
padding: 5,
fallbackPlacements
}
},
{
name: "computeStyles",
options: { gpuAcceleration }
}
];
}
function deriveExtraModifiers(options, modifiers) {
if (modifiers) options.modifiers = [...options.modifiers, ...modifiers ?? []];
}
//#endregion
//#region ../../packages/components/popper/src/composables/use-content.ts
const DEFAULT_ARROW_OFFSET = 0;
const usePopperContent = (props) => {
const { popperInstanceRef, contentRef, triggerRef, role } = (0, vue.inject)(POPPER_INJECTION_KEY, void 0);
const arrowRef = (0, vue.ref)();
const arrowOffset = (0, vue.computed)(() => props.arrowOffset);
const eventListenerModifier = (0, vue.computed)(() => {
return {
name: "eventListeners",
enabled: !!props.visible
};
});
const arrowModifier = (0, vue.computed)(() => {
const arrowEl = (0, vue.unref)(arrowRef);
const offset = (0, vue.unref)(arrowOffset) ?? DEFAULT_ARROW_OFFSET;
return {
name: "arrow",
enabled: !isUndefined$1(arrowEl),
options: {
element: arrowEl,
padding: offset
}
};
});
const options = (0, vue.computed)(() => {
return {
onFirstUpdate: () => {
update();
},
...buildPopperOptions(props, [(0, vue.unref)(arrowModifier), (0, vue.unref)(eventListenerModifier)])
};
});
const computedReference = (0, vue.computed)(() => unwrapMeasurableEl(props.referenceEl) || (0, vue.unref)(triggerRef));
const { attributes, state, styles, update, forceUpdate, instanceRef } = usePopper(computedReference, contentRef, options);
(0, vue.watch)(instanceRef, (instance) => popperInstanceRef.value = instance, { flush: "sync" });
(0, vue.onMounted)(() => {
(0, vue.watch)(() => (0, vue.unref)(computedReference)?.getBoundingClientRect?.(), () => {
update();
});
});
let stopResizeObserver;
(0, vue.watch)(() => props.visible, (visible) => {
stopResizeObserver?.();
stopResizeObserver = void 0;
if (visible) stopResizeObserver = useResizeObserver(contentRef, update).stop;
});
(0, vue.onBeforeUnmount)(() => {
popperInstanceRef.value = void 0;
stopResizeObserver?.();
stopResizeObserver = void 0;
});
return {
attributes,
arrowRef,
contentRef,
instanceRef,
state,
styles,
role,
forceUpdate,
update
};
};
//#endregion
//#region ../../packages/components/popper/src/composables/use-content-dom.ts
const usePopperContentDOM = (props, { attributes, styles, role }) => {
const { nextZIndex } = useZIndex();
const ns = useNamespace("popper");
const contentAttrs = (0, vue.computed)(() => (0, vue.unref)(attributes).popper);
const contentZIndex = (0, vue.ref)(isNumber(props.zIndex) ? props.zIndex : nextZIndex());
const contentClass = (0, vue.computed)(() => [
ns.b(),
ns.is("pure", props.pure),
ns.is(props.effect),
props.popperClass
]);
const contentStyle = (0, vue.computed)(() => {
return [
{ zIndex: (0, vue.unref)(contentZIndex) },
(0, vue.unref)(styles).popper,
props.popperStyle || {}
];
});
const ariaModal = (0, vue.computed)(() => role.value === "dialog" ? "false" : void 0);
const arrowStyle = (0, vue.computed)(() => (0, vue.unref)(styles).arrow || {});
const updateZIndex = () => {
contentZIndex.value = isNumber(props.zIndex) ? props.zIndex : nextZIndex();
};
return {
ariaModal,
arrowStyle,
contentAttrs,
contentClass,
contentStyle,
contentZIndex,
updateZIndex
};
};
//#endregion
//#region ../../packages/components/popper/src/composables/use-focus-trap.ts
const usePopperContentFocusTrap = (props, emit) => {
const trapped = (0, vue.ref)(false);
const focusStartRef = (0, vue.ref)();
const onFocusAfterTrapped = () => {
emit("focus");
};
const onFocusAfterReleased = (event) => {
if (event.detail?.focusReason !== "pointer") {
focusStartRef.value = "first";
emit("blur");
}
};
const onFocusInTrap = (event) => {
if (props.visible && !trapped.value) {
if (event.target) focusStartRef.value = event.target;
trapped.value = true;
}
};
const onFocusoutPrevented = (event) => {
if (!props.trapping) {
if (event.detail.focusReason === "pointer") event.preventDefault();
trapped.value = false;
}
};
const onReleaseRequested = () => {
trapped.value = false;
emit("close");
};
(0, vue.onBeforeUnmount)(() => {
focusStartRef.value = void 0;
});
return {
focusStartRef,
trapped,
onFocusAfterReleased,
onFocusAfterTrapped,
onFocusInTrap,
onFocusoutPrevented,
onReleaseRequested
};
};
//#endregion
//#region ../../packages/components/popper/src/content.vue?vue&type=script&setup=true&lang.ts
var content_vue_vue_type_script_setup_true_lang_default$2 = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElPopperContent",
__name: "content",
props: popperContentProps,
emits: popperContentEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const emit = __emit;
const props = __props;
const { focusStartRef, trapped, onFocusAfterReleased, onFocusAfterTrapped, onFocusInTrap, onFocusoutPrevented, onReleaseRequested } = usePopperContentFocusTrap(props, emit);
const { attributes, arrowRef, contentRef, styles, instanceRef, role, update } = usePopperContent(props);
const { ariaModal, arrowStyle, contentAttrs, contentClass, contentStyle, updateZIndex } = usePopperContentDOM(props, {
styles,
attributes,
role
});
const formItemContext = (0, vue.inject)(formItemContextKey, void 0);
(0, vue.provide)(POPPER_CONTENT_INJECTION_KEY, {
arrowStyle,
arrowRef
});
if (formItemContext) (0, vue.provide)(formItemContextKey, {
...formItemContext,
addInputId: NOOP,
removeInputId: NOOP
});
let triggerTargetAriaStopWatch = void 0;
const updatePopper = (shouldUpdateZIndex = true) => {
update();
shouldUpdateZIndex && updateZIndex();
};
const togglePopperAlive = () => {
updatePopper(false);
if (props.visible && props.focusOnShow) trapped.value = true;
else if (props.visible === false) trapped.value = false;
};
(0, vue.onMounted)(() => {
(0, vue.watch)(() => props.triggerTargetEl, (triggerTargetEl, prevTriggerTargetEl) => {
triggerTargetAriaStopWatch?.();
triggerTargetAriaStopWatch = void 0;
const el = (0, vue.unref)(triggerTargetEl || contentRef.value);
const prevEl = (0, vue.unref)(prevTriggerTargetEl || contentRef.value);
if (isElement$1(el)) triggerTargetAriaStopWatch = (0, vue.watch)([
role,
() => props.ariaLabel,
ariaModal,
() => props.id
], (watches) => {
[
"role",
"aria-label",
"aria-modal",
"id"
].forEach((key, idx) => {
isNil(watches[idx]) ? el.removeAttribute(key) : el.setAttribute(key, watches[idx]);
});
}, { immediate: true });
if (prevEl !== el && isElement$1(prevEl)) [
"role",
"aria-label",
"aria-modal",
"id"
].forEach((key) => {
prevEl.removeAttribute(key);
});
}, { immediate: true });
(0, vue.watch)(() => props.visible, togglePopperAlive, { immediate: true });
});
(0, vue.onBeforeUnmount)(() => {
triggerTargetAriaStopWatch?.();
triggerTargetAriaStopWatch = void 0;
contentRef.value = void 0;
});
__expose({
popperContentRef: contentRef,
popperInstanceRef: instanceRef,
updatePopper,
contentStyle
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", (0, vue.mergeProps)({
ref_key: "contentRef",
ref: contentRef
}, (0, vue.unref)(contentAttrs), {
style: (0, vue.unref)(contentStyle),
class: (0, vue.unref)(contentClass),
tabindex: "-1",
onMouseenter: _cache[0] || (_cache[0] = (e) => _ctx.$emit("mouseenter", e)),
onMouseleave: _cache[1] || (_cache[1] = (e) => _ctx.$emit("mouseleave", e))
}), [(0, vue.createVNode)((0, vue.unref)(focus_trap_default), {
loop: __props.loop,
trapped: (0, vue.unref)(trapped),
"trap-on-focus-in": true,
"focus-trap-el": (0, vue.unref)(contentRef),
"focus-start-el": (0, vue.unref)(focusStartRef),
onFocusAfterTrapped: (0, vue.unref)(onFocusAfterTrapped),
onFocusAfterReleased: (0, vue.unref)(onFocusAfterReleased),
onFocusin: (0, vue.unref)(onFocusInTrap),
onFocusoutPrevented: (0, vue.unref)(onFocusoutPrevented),
onReleaseRequested: (0, vue.unref)(onReleaseRequested)
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 8, [
"loop",
"trapped",
"focus-trap-el",
"focus-start-el",
"onFocusAfterTrapped",
"onFocusAfterReleased",
"onFocusin",
"onFocusoutPrevented",
"onReleaseRequested"
])], 16);
};
}
});
//#endregion
//#region ../../packages/components/popper/src/content.vue
var content_default = content_vue_vue_type_script_setup_true_lang_default$2;
//#endregion
//#region ../../packages/components/popper/index.ts
const ElPopper = withInstall(popper_default);
//#endregion
//#region ../../packages/components/tooltip/src/content.ts
const useTooltipContentPropsDefaults = {
...useDelayedTogglePropsDefaults,
...popperContentPropsDefaults,
content: "",
visible: null,
teleported: true
};
/**
* @deprecated Removed after 3.0.0, Use `ElTooltipContentProps` instead.
*/
const useTooltipContentProps = buildProps({
...useDelayedToggleProps,
...popperContentProps,
appendTo: { type: teleportProps.to.type },
content: {
type: String,
default: ""
},
rawContent: Boolean,
persistent: Boolean,
visible: {
type: definePropType(Boolean),
default: null
},
transition: String,
teleported: {
type: Boolean,
default: true
},
disabled: Boolean,
...useAriaProps(["ariaLabel"])
});
//#endregion
//#region ../../packages/components/tooltip/src/trigger.ts
const useTooltipTriggerPropsDefaults = {
trigger: "hover",
triggerKeys: () => [
EVENT_CODE.enter,
EVENT_CODE.numpadEnter,
EVENT_CODE.space
]
};
/**
* @deprecated Removed after 3.0.0, Use `UseTooltipTriggerProps` instead.
*/
const useTooltipTriggerProps = buildProps({
...popperTriggerProps,
disabled: Boolean,
trigger: {
type: definePropType([String, Array]),
default: "hover"
},
triggerKeys: {
type: definePropType(Array),
default: () => [
EVENT_CODE.enter,
EVENT_CODE.numpadEnter,
EVENT_CODE.space
]
},
focusOnTarget: Boolean
});
//#endregion
//#region ../../packages/components/tooltip/src/tooltip.ts
const { useModelToggleProps: useTooltipModelToggleProps, useModelToggleEmits: useTooltipModelToggleEmits, useModelToggle: useTooltipModelToggle } = createModelToggleComposable("visible");
/**
* @deprecated Removed after 3.0.0, Use `UseTooltipProps` instead.
*/
const useTooltipProps = buildProps({
...popperProps,
...useTooltipModelToggleProps,
...useTooltipContentProps,
...useTooltipTriggerProps,
...popperArrowProps,
showArrow: {
type: Boolean,
default: true
}
});
const tooltipEmits = [
...useTooltipModelToggleEmits,
"before-show",
"before-hide",
"show",
"hide",
"open",
"close"
];
//#endregion
//#region ../../packages/components/tooltip/src/constants.ts
const TOOLTIP_INJECTION_KEY = Symbol("elTooltip");
//#endregion
//#region ../../packages/components/tooltip/src/utils.ts
const isTriggerType = (trigger, type) => {
if (isArray$1(trigger)) return trigger.includes(type);
return trigger === type;
};
const whenTrigger = (trigger, type, handler) => {
return (e) => {
isTriggerType((0, vue.unref)(trigger), type) && handler(e);
};
};
//#endregion
//#region ../../packages/components/tooltip/src/trigger.vue?vue&type=script&setup=true&lang.ts
var trigger_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTooltipTrigger",
__name: "trigger",
props: useTooltipTriggerProps,
setup(__props, { expose: __expose }) {
const props = __props;
const ns = useNamespace("tooltip");
const { controlled, id, open, onOpen, onClose, onToggle } = (0, vue.inject)(TOOLTIP_INJECTION_KEY, void 0);
const triggerRef = (0, vue.ref)(null);
const stopWhenControlledOrDisabled = () => {
if ((0, vue.unref)(controlled) || props.disabled) return true;
};
const trigger = (0, vue.toRef)(props, "trigger");
const onMouseenter = composeEventHandlers(stopWhenControlledOrDisabled, whenTrigger(trigger, "hover", (e) => {
onOpen(e);
if (props.focusOnTarget && e.target) (0, vue.nextTick)(() => {
focusElement(e.target, { preventScroll: true });
});
}));
const onMouseleave = composeEventHandlers(stopWhenControlledOrDisabled, whenTrigger(trigger, "hover", onClose));
const onClick = composeEventHandlers(stopWhenControlledOrDisabled, whenTrigger(trigger, "click", (e) => {
if (e.button === 0) onToggle(e);
}));
const onFocus = composeEventHandlers(stopWhenControlledOrDisabled, whenTrigger(trigger, "focus", onOpen));
const onBlur = composeEventHandlers(stopWhenControlledOrDisabled, whenTrigger(trigger, "focus", onClose));
const onContextMenu = composeEventHandlers(stopWhenControlledOrDisabled, whenTrigger(trigger, "contextmenu", (e) => {
e.preventDefault();
onToggle(e);
}));
const onKeydown = composeEventHandlers(stopWhenControlledOrDisabled, (e) => {
const code = getEventCode(e);
if (props.triggerKeys.includes(code)) {
e.preventDefault();
onToggle(e);
}
});
__expose({ triggerRef });
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(trigger_default), {
id: (0, vue.unref)(id),
"virtual-ref": __props.virtualRef,
open: (0, vue.unref)(open),
"virtual-triggering": __props.virtualTriggering,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("trigger")),
onBlur: (0, vue.unref)(onBlur),
onClick: (0, vue.unref)(onClick),
onContextmenu: (0, vue.unref)(onContextMenu),
onFocus: (0, vue.unref)(onFocus),
onMouseenter: (0, vue.unref)(onMouseenter),
onMouseleave: (0, vue.unref)(onMouseleave),
onKeydown: (0, vue.unref)(onKeydown)
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 8, [
"id",
"virtual-ref",
"open",
"virtual-triggering",
"class",
"onBlur",
"onClick",
"onContextmenu",
"onFocus",
"onMouseenter",
"onMouseleave",
"onKeydown"
]);
};
}
});
//#endregion
//#region ../../packages/components/tooltip/src/trigger.vue
var trigger_default$1 = trigger_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/tooltip/src/content.vue?vue&type=script&setup=true&lang.ts
var content_vue_vue_type_script_setup_true_lang_default$1 = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTooltipContent",
inheritAttrs: false,
__name: "content",
props: useTooltipContentProps,
setup(__props, { expose: __expose }) {
const props = __props;
const { selector } = usePopperContainerId();
const ns = useNamespace("tooltip");
const contentRef = (0, vue.ref)();
const popperContentRef = computedEager(() => contentRef.value?.popperContentRef);
let stopHandle;
const { controlled, id, open, trigger, onClose, onOpen, onShow, onHide, onBeforeShow, onBeforeHide } = (0, vue.inject)(TOOLTIP_INJECTION_KEY, void 0);
const transitionClass = (0, vue.computed)(() => {
return props.transition || `${ns.namespace.value}-fade-in-linear`;
});
const persistentRef = (0, vue.computed)(() => {
return props.persistent;
});
(0, vue.onBeforeUnmount)(() => {
stopHandle?.();
});
const shouldRender = (0, vue.computed)(() => {
return (0, vue.unref)(persistentRef) ? true : (0, vue.unref)(open);
});
const shouldShow = (0, vue.computed)(() => {
return props.disabled ? false : (0, vue.unref)(open);
});
const appendTo = (0, vue.computed)(() => {
return props.appendTo || selector.value;
});
const contentStyle = (0, vue.computed)(() => props.style ?? {});
const ariaHidden = (0, vue.ref)(true);
const onTransitionLeave = () => {
onHide();
isFocusInsideContent() && focusElement(document.body, { preventScroll: true });
ariaHidden.value = true;
};
const stopWhenControlled = () => {
if ((0, vue.unref)(controlled)) return true;
};
const onContentEnter = composeEventHandlers(stopWhenControlled, () => {
if (props.enterable && isTriggerType((0, vue.unref)(trigger), "hover")) onOpen();
});
const onContentLeave = composeEventHandlers(stopWhenControlled, () => {
if (isTriggerType((0, vue.unref)(trigger), "hover")) onClose();
});
const onBeforeEnter = () => {
contentRef.value?.updatePopper?.();
onBeforeShow?.();
};
const onBeforeLeave = () => {
onBeforeHide?.();
};
const onAfterShow = () => {
onShow();
};
const onBlur = () => {
if (!props.virtualTriggering) onClose();
};
const isFocusInsideContent = (event) => {
const popperContent = contentRef.value?.popperContentRef;
const activeElement = event?.relatedTarget || document.activeElement;
return popperContent?.contains(activeElement);
};
(0, vue.watch)(() => (0, vue.unref)(open), (val) => {
if (!val) stopHandle?.();
else {
ariaHidden.value = false;
stopHandle = onClickOutside(popperContentRef, () => {
if ((0, vue.unref)(controlled)) return;
if (castArray((0, vue.unref)(trigger)).every((item) => {
return item !== "hover" && item !== "focus";
})) onClose();
}, { detectIframe: true });
}
}, { flush: "post" });
__expose({
contentRef,
isFocusInsideContent
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElTeleport), {
disabled: !__props.teleported,
to: appendTo.value
}, {
default: (0, vue.withCtx)(() => [shouldRender.value || !ariaHidden.value ? ((0, vue.openBlock)(), (0, vue.createBlock)(vue.Transition, {
key: 0,
name: transitionClass.value,
appear: !persistentRef.value,
onAfterLeave: onTransitionLeave,
onBeforeEnter,
onAfterEnter: onAfterShow,
onBeforeLeave,
persisted: ""
}, {
default: (0, vue.withCtx)(() => [(0, vue.withDirectives)((0, vue.createVNode)((0, vue.unref)(content_default), (0, vue.mergeProps)({
id: (0, vue.unref)(id),
ref_key: "contentRef",
ref: contentRef
}, _ctx.$attrs, {
"aria-label": __props.ariaLabel,
"aria-hidden": ariaHidden.value,
"boundaries-padding": __props.boundariesPadding,
"fallback-placements": __props.fallbackPlacements,
"gpu-acceleration": __props.gpuAcceleration,
offset: __props.offset,
placement: __props.placement,
"popper-options": __props.popperOptions,
"arrow-offset": __props.arrowOffset,
strategy: __props.strategy,
effect: __props.effect,
enterable: __props.enterable,
pure: __props.pure,
"popper-class": __props.popperClass,
"popper-style": [__props.popperStyle, contentStyle.value],
"reference-el": __props.referenceEl,
"trigger-target-el": __props.triggerTargetEl,
visible: shouldShow.value,
"z-index": __props.zIndex,
loop: __props.loop,
onMouseenter: (0, vue.unref)(onContentEnter),
onMouseleave: (0, vue.unref)(onContentLeave),
onBlur,
onClose: (0, vue.unref)(onClose)
}), {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 16, [
"id",
"aria-label",
"aria-hidden",
"boundaries-padding",
"fallback-placements",
"gpu-acceleration",
"offset",
"placement",
"popper-options",
"arrow-offset",
"strategy",
"effect",
"enterable",
"pure",
"popper-class",
"popper-style",
"reference-el",
"trigger-target-el",
"visible",
"z-index",
"loop",
"onMouseenter",
"onMouseleave",
"onClose"
]), [[vue.vShow, shouldShow.value]])]),
_: 3
}, 8, ["name", "appear"])) : (0, vue.createCommentVNode)("v-if", true)]),
_: 3
}, 8, ["disabled", "to"]);
};
}
});
//#endregion
//#region ../../packages/components/tooltip/src/content.vue
var content_default$2 = content_vue_vue_type_script_setup_true_lang_default$1;
//#endregion
//#region ../../packages/components/tooltip/src/tooltip.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$77 = ["innerHTML"];
const _hoisted_2$43 = { key: 1 };
var tooltip_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTooltip",
__name: "tooltip",
props: useTooltipProps,
emits: tooltipEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
usePopperContainer();
const ns = useNamespace("tooltip");
const id = useId();
const popperRef = (0, vue.ref)();
const contentRef = (0, vue.ref)();
const updatePopper = () => {
const popperComponent = (0, vue.unref)(popperRef);
if (popperComponent) popperComponent.popperInstanceRef?.update();
};
const open = (0, vue.ref)(false);
const toggleReason = (0, vue.ref)();
const { show, hide, hasUpdateHandler } = useTooltipModelToggle({
indicator: open,
toggleReason
});
const { onOpen, onClose } = useDelayedToggle({
showAfter: (0, vue.toRef)(props, "showAfter"),
hideAfter: (0, vue.toRef)(props, "hideAfter"),
autoClose: (0, vue.toRef)(props, "autoClose"),
open: show,
close: hide
});
const controlled = (0, vue.computed)(() => isBoolean(props.visible) && !hasUpdateHandler.value);
const kls = (0, vue.computed)(() => {
return [ns.b(), props.popperClass];
});
(0, vue.provide)(TOOLTIP_INJECTION_KEY, {
controlled,
id,
open: (0, vue.readonly)(open),
trigger: (0, vue.toRef)(props, "trigger"),
onOpen,
onClose,
onToggle: (event) => {
if ((0, vue.unref)(open)) onClose(event);
else onOpen(event);
},
onShow: () => {
emit("show", toggleReason.value);
},
onHide: () => {
emit("hide", toggleReason.value);
},
onBeforeShow: () => {
emit("before-show", toggleReason.value);
},
onBeforeHide: () => {
emit("before-hide", toggleReason.value);
},
updatePopper
});
(0, vue.watch)(() => props.disabled, (disabled) => {
if (disabled && open.value) open.value = false;
if (!disabled && isBoolean(props.visible)) open.value = props.visible;
});
const isFocusInsideContent = (event) => {
return contentRef.value?.isFocusInsideContent(event);
};
(0, vue.onDeactivated)(() => open.value && hide());
(0, vue.onBeforeUnmount)(() => {
toggleReason.value = void 0;
});
__expose({
popperRef,
contentRef,
isFocusInsideContent,
updatePopper,
onOpen,
onClose,
hide
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElPopper), {
ref_key: "popperRef",
ref: popperRef,
role: __props.role
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)(trigger_default$1, {
disabled: __props.disabled,
trigger: __props.trigger,
"trigger-keys": __props.triggerKeys,
"virtual-ref": __props.virtualRef,
"virtual-triggering": __props.virtualTriggering,
"focus-on-target": __props.focusOnTarget
}, {
default: (0, vue.withCtx)(() => [_ctx.$slots.default ? (0, vue.renderSlot)(_ctx.$slots, "default", { key: 0 }) : (0, vue.createCommentVNode)("v-if", true)]),
_: 3
}, 8, [
"disabled",
"trigger",
"trigger-keys",
"virtual-ref",
"virtual-triggering",
"focus-on-target"
]), (0, vue.createVNode)(content_default$2, {
ref_key: "contentRef",
ref: contentRef,
"aria-label": __props.ariaLabel,
"boundaries-padding": __props.boundariesPadding,
content: __props.content,
disabled: __props.disabled,
effect: __props.effect,
enterable: __props.enterable,
"fallback-placements": __props.fallbackPlacements,
"hide-after": __props.hideAfter,
"gpu-acceleration": __props.gpuAcceleration,
offset: __props.offset,
persistent: __props.persistent,
"popper-class": kls.value,
"popper-style": __props.popperStyle,
placement: __props.placement,
"popper-options": __props.popperOptions,
"arrow-offset": __props.arrowOffset,
pure: __props.pure,
"raw-content": __props.rawContent,
"reference-el": __props.referenceEl,
"trigger-target-el": __props.triggerTargetEl,
"show-after": __props.showAfter,
strategy: __props.strategy,
teleported: __props.teleported,
transition: __props.transition,
"virtual-triggering": __props.virtualTriggering,
"z-index": __props.zIndex,
"append-to": __props.appendTo,
loop: __props.loop
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "content", {}, () => [__props.rawContent ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 0,
innerHTML: __props.content
}, null, 8, _hoisted_1$77)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_2$43, (0, vue.toDisplayString)(__props.content), 1))]), __props.showArrow ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(arrow_default), { key: 0 })) : (0, vue.createCommentVNode)("v-if", true)]),
_: 3
}, 8, [
"aria-label",
"boundaries-padding",
"content",
"disabled",
"effect",
"enterable",
"fallback-placements",
"hide-after",
"gpu-acceleration",
"offset",
"persistent",
"popper-class",
"popper-style",
"placement",
"popper-options",
"arrow-offset",
"pure",
"raw-content",
"reference-el",
"trigger-target-el",
"show-after",
"strategy",
"teleported",
"transition",
"virtual-triggering",
"z-index",
"append-to",
"loop"
])]),
_: 3
}, 8, ["role"]);
};
}
});
//#endregion
//#region ../../packages/components/tooltip/src/tooltip.vue
var tooltip_default = tooltip_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/tooltip/index.ts
const ElTooltip = withInstall(tooltip_default);
//#endregion
//#region ../../packages/components/input/src/input.ts
/**
* @deprecated Removed after 3.0.0, Use `InputProps` instead.
*/
const inputProps = buildProps({
id: {
type: String,
default: void 0
},
size: useSizeProp,
disabled: {
type: Boolean,
default: void 0
},
modelValue: {
type: definePropType([
String,
Number,
Object
]),
default: ""
},
modelModifiers: {
type: definePropType(Object),
default: () => ({})
},
maxlength: { type: [String, Number] },
minlength: { type: [String, Number] },
type: {
type: definePropType(String),
default: "text"
},
resize: {
type: String,
values: [
"none",
"both",
"horizontal",
"vertical"
]
},
autosize: {
type: definePropType([Boolean, Object]),
default: false
},
autocomplete: {
type: definePropType(String),
default: "off"
},
formatter: { type: Function },
parser: { type: Function },
placeholder: { type: String },
form: { type: String },
readonly: Boolean,
clearable: Boolean,
clearIcon: {
type: iconPropType,
default: circle_close_default
},
showPassword: Boolean,
showWordLimit: Boolean,
wordLimitPosition: {
type: String,
values: ["inside", "outside"],
default: "inside"
},
suffixIcon: { type: iconPropType },
prefixIcon: { type: iconPropType },
containerRole: {
type: String,
default: void 0
},
tabindex: {
type: [String, Number],
default: 0
},
validateEvent: {
type: Boolean,
default: true
},
inputStyle: {
type: definePropType([
Object,
Array,
String
]),
default: () => mutable({})
},
countGraphemes: { type: definePropType(Function) },
autofocus: Boolean,
rows: {
type: Number,
default: 2
},
...useAriaProps(["ariaLabel"]),
inputmode: {
type: definePropType(String),
default: void 0
},
name: String
});
const inputEmits = {
[UPDATE_MODEL_EVENT]: (value) => isString(value),
input: (value) => isString(value),
change: (value, evt) => isString(value) && (evt instanceof Event || evt === void 0),
focus: (evt) => evt instanceof FocusEvent,
blur: (evt) => evt instanceof FocusEvent,
clear: (evt) => evt === void 0 || evt instanceof MouseEvent,
mouseleave: (evt) => evt instanceof MouseEvent,
mouseenter: (evt) => evt instanceof MouseEvent,
keydown: (evt) => evt instanceof Event,
compositionstart: (evt) => evt instanceof CompositionEvent,
compositionupdate: (evt) => evt instanceof CompositionEvent,
compositionend: (evt) => evt instanceof CompositionEvent
};
/**
* @description default values for InputProps, used in components that extend InputProps like Autocomplete
*/
const inputPropsDefaults = {
disabled: void 0,
modelValue: "",
modelModifiers: () => ({}),
type: "text",
autocomplete: "off",
clearIcon: (0, vue.markRaw)(circle_close_default),
wordLimitPosition: "inside",
tabindex: 0,
validateEvent: true,
inputStyle: () => ({}),
rows: 2
};
//#endregion
//#region ../../packages/components/input/src/utils.ts
let hiddenTextarea = void 0;
const HIDDEN_STYLE = {
height: "0",
visibility: "hidden",
overflow: isFirefox() ? "" : "hidden",
position: "absolute",
"z-index": "-1000",
top: "0",
right: "0"
};
const CONTEXT_STYLE = [
"letter-spacing",
"line-height",
"padding-top",
"padding-bottom",
"font-family",
"font-weight",
"font-size",
"text-rendering",
"text-transform",
"width",
"text-indent",
"padding-left",
"padding-right",
"border-width",
"box-sizing",
"word-break"
];
const looseToNumber = (val) => {
const n = Number.parseFloat(val);
return Number.isNaN(n) ? val : n;
};
function calculateNodeStyling(targetElement) {
const style = window.getComputedStyle(targetElement);
const boxSizing = style.getPropertyValue("box-sizing");
const paddingSize = Number.parseFloat(style.getPropertyValue("padding-bottom")) + Number.parseFloat(style.getPropertyValue("padding-top"));
const borderSize = Number.parseFloat(style.getPropertyValue("border-bottom-width")) + Number.parseFloat(style.getPropertyValue("border-top-width"));
return {
contextStyle: CONTEXT_STYLE.map((name) => [name, style.getPropertyValue(name)]),
paddingSize,
borderSize,
boxSizing
};
}
function calcTextareaHeight(targetElement, minRows = 1, maxRows) {
if (!hiddenTextarea) {
hiddenTextarea = document.createElement("textarea");
let hostNode = document.body;
if (!isFirefox() && targetElement.parentNode) hostNode = targetElement.parentNode;
hostNode.appendChild(hiddenTextarea);
}
const { paddingSize, borderSize, boxSizing, contextStyle } = calculateNodeStyling(targetElement);
contextStyle.forEach(([key, value]) => hiddenTextarea?.style.setProperty(key, value));
Object.entries(HIDDEN_STYLE).forEach(([key, value]) => hiddenTextarea?.style.setProperty(key, value, "important"));
hiddenTextarea.value = targetElement.value || targetElement.placeholder || "";
let height = hiddenTextarea.scrollHeight;
const result = {};
if (boxSizing === "border-box") height = height + borderSize;
else if (boxSizing === "content-box") height = height - paddingSize;
hiddenTextarea.value = "";
const singleRowHeight = hiddenTextarea.scrollHeight - paddingSize;
if (isNumber(minRows)) {
let minHeight = singleRowHeight * minRows;
if (boxSizing === "border-box") minHeight = minHeight + paddingSize + borderSize;
height = Math.max(minHeight, height);
result.minHeight = `${minHeight}px`;
}
if (isNumber(maxRows)) {
let maxHeight = singleRowHeight * maxRows;
if (boxSizing === "border-box") maxHeight = maxHeight + paddingSize + borderSize;
height = Math.min(maxHeight, height);
}
result.height = `${height}px`;
hiddenTextarea.parentNode?.removeChild(hiddenTextarea);
hiddenTextarea = void 0;
return result;
}
//#endregion
//#region ../../packages/components/input/src/input.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$76 = [
"id",
"name",
"minlength",
"maxlength",
"type",
"disabled",
"readonly",
"autocomplete",
"tabindex",
"aria-label",
"placeholder",
"form",
"autofocus",
"role",
"inputmode"
];
const _hoisted_2$42 = [
"id",
"name",
"minlength",
"maxlength",
"tabindex",
"disabled",
"readonly",
"autocomplete",
"aria-label",
"placeholder",
"form",
"autofocus",
"rows",
"role",
"inputmode"
];
const COMPONENT_NAME$19 = "ElInput";
var input_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: COMPONENT_NAME$19,
inheritAttrs: false,
__name: "input",
props: inputProps,
emits: inputEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const rawAttrs = (0, vue.useAttrs)();
const slots = (0, vue.useSlots)();
const containerKls = (0, vue.computed)(() => [
props.type === "textarea" ? nsTextarea.b() : nsInput.b(),
nsInput.m(inputSize.value),
nsInput.is("disabled", inputDisabled.value),
nsInput.is("exceed", inputExceed.value),
{
[nsInput.b("group")]: slots.prepend || slots.append,
[nsInput.m("prefix")]: slots.prefix || props.prefixIcon,
[nsInput.m("suffix")]: slots.suffix || props.suffixIcon || props.clearable || props.showPassword,
[nsInput.bm("suffix", "password-clear")]: showClear.value && showPwdVisible.value,
[nsInput.b("hidden")]: props.type === "hidden"
},
rawAttrs.class
]);
const wrapperKls = (0, vue.computed)(() => [nsInput.e("wrapper"), nsInput.is("focus", isFocused.value)]);
const attrs = useAttrs();
const maxlength = (0, vue.computed)(() => props.maxlength?.toString());
const { form: elForm, formItem: elFormItem } = useFormItem();
const { inputId } = useFormItemInputId(props, { formItemContext: elFormItem });
const inputSize = useFormSize();
const inputDisabled = useFormDisabled();
const nsInput = useNamespace("input");
const nsTextarea = useNamespace("textarea");
const input = (0, vue.shallowRef)();
const textarea = (0, vue.shallowRef)();
const hovering = (0, vue.ref)(false);
const passwordVisible = (0, vue.ref)(false);
const countStyle = (0, vue.ref)();
const textareaCalcStyle = (0, vue.shallowRef)(props.inputStyle);
const saveValue = (0, vue.ref)("");
const _ref = (0, vue.computed)(() => input.value || textarea.value);
const { wrapperRef, isFocused, handleFocus, handleBlur } = useFocusController(_ref, {
disabled: inputDisabled,
afterBlur() {
if (props.validateEvent) elFormItem?.validate?.("blur").catch((err) => /* @__PURE__ */ debugWarn(err));
}
});
const needStatusIcon = (0, vue.computed)(() => elForm?.statusIcon ?? false);
const validateState = (0, vue.computed)(() => elFormItem?.validateState || "");
const validateIcon = (0, vue.computed)(() => validateState.value && ValidateComponentsMap[validateState.value]);
const passwordIcon = (0, vue.computed)(() => passwordVisible.value ? view_default : hide_default);
const containerStyle = (0, vue.computed)(() => [rawAttrs.style]);
const textareaStyle = (0, vue.computed)(() => [
props.inputStyle,
textareaCalcStyle.value,
{ resize: props.resize }
]);
const nativeInputValue = (0, vue.computed)(() => isNil(props.modelValue) ? "" : String(props.modelValue));
const showClear = (0, vue.computed)(() => props.clearable && !inputDisabled.value && !props.readonly && !!nativeInputValue.value && (isFocused.value || hovering.value));
const showPwdVisible = (0, vue.computed)(() => props.showPassword && !inputDisabled.value && !!nativeInputValue.value);
const isWordLimitVisible = (0, vue.computed)(() => props.showWordLimit && !!maxlength.value && (props.type === "text" || props.type === "textarea") && !inputDisabled.value && !props.readonly && !props.showPassword);
const textLength = (0, vue.computed)(() => {
if (props.countGraphemes && props.showWordLimit) return props.countGraphemes(nativeInputValue.value);
return nativeInputValue.value.length;
});
const inputExceed = (0, vue.computed)(() => !!isWordLimitVisible.value && textLength.value > Number(maxlength.value));
const suffixVisible = (0, vue.computed)(() => !!slots.suffix || !!props.suffixIcon || showClear.value || props.showPassword || isWordLimitVisible.value || !!validateState.value && needStatusIcon.value);
const hasModelModifiers = (0, vue.computed)(() => !!Object.keys(props.modelModifiers).length);
const [recordCursor, setCursor] = useCursor(input);
useResizeObserver(textarea, (entries) => {
onceInitSizeTextarea();
if (!isWordLimitVisible.value || props.resize !== "both" && props.resize !== "horizontal") return;
const { width } = entries[0].contentRect;
countStyle.value = { right: `calc(100% - ${width + 22 - 10}px)` };
});
const resizeTextarea = () => {
const { type, autosize } = props;
if (!isClient || type !== "textarea" || !textarea.value) return;
if (autosize) {
const minRows = isObject$1(autosize) ? autosize.minRows : void 0;
const maxRows = isObject$1(autosize) ? autosize.maxRows : void 0;
const textareaStyle = calcTextareaHeight(textarea.value, minRows, maxRows);
textareaCalcStyle.value = {
overflowY: "hidden",
...textareaStyle
};
(0, vue.nextTick)(() => {
textarea.value.offsetHeight;
textareaCalcStyle.value = textareaStyle;
});
} else textareaCalcStyle.value = { minHeight: calcTextareaHeight(textarea.value).minHeight };
};
const createOnceInitResize = (resizeTextarea) => {
let isInit = false;
return () => {
if (isInit || !props.autosize) return;
if (!(textarea.value?.offsetParent === null)) {
setTimeout(resizeTextarea);
isInit = true;
}
};
};
const onceInitSizeTextarea = createOnceInitResize(resizeTextarea);
const setNativeInputValue = () => {
const input = _ref.value;
const formatterValue = props.formatter ? props.formatter(nativeInputValue.value) : nativeInputValue.value;
if (!input || input.value === formatterValue || props.type === "file") return;
input.value = formatterValue;
};
const formatValue = (value) => {
const { trim, number } = props.modelModifiers;
if (trim) value = value.trim();
if (number) value = `${looseToNumber(value)}`;
if (props.formatter && props.parser) value = props.parser(value);
return value;
};
const handleInput = async (event) => {
if (isComposing.value) return;
const { lazy } = props.modelModifiers;
let { value } = event.target;
let shouldForceNativeUpdate = false;
if (lazy) {
emit(INPUT_EVENT, value);
return;
}
value = formatValue(value);
if (props.countGraphemes && maxlength.value != null) {
const limit = Number(maxlength.value);
const graphemes = props.countGraphemes(value);
const saveGraphemes = props.countGraphemes(saveValue.value);
if (graphemes > limit && graphemes > saveGraphemes) if (saveGraphemes > limit) {
value = saveValue.value;
shouldForceNativeUpdate = true;
} else {
const prevValue = saveValue.value;
const nextValue = value;
let prefixLen = 0;
while (prefixLen < prevValue.length && prefixLen < nextValue.length && prevValue[prefixLen] === nextValue[prefixLen]) prefixLen++;
let prevSuffixIndex = prevValue.length;
let nextSuffixIndex = nextValue.length;
while (prevSuffixIndex > prefixLen && nextSuffixIndex > prefixLen && prevValue[prevSuffixIndex - 1] === nextValue[nextSuffixIndex - 1]) {
prevSuffixIndex--;
nextSuffixIndex--;
}
const before = nextValue.slice(0, prefixLen);
const removed = prevValue.slice(prefixLen, prevSuffixIndex);
const inserted = nextValue.slice(prefixLen, nextSuffixIndex);
const after = nextValue.slice(nextSuffixIndex);
const baseCount = saveGraphemes - props.countGraphemes(removed);
const availableInserted = Math.max(0, limit - baseCount);
let acceptedInserted = "";
if (availableInserted > 0) if (typeof Intl !== "undefined" && "Segmenter" in Intl) {
const segmenter = new Intl.Segmenter(void 0, { granularity: "grapheme" });
for (const { segment } of segmenter.segment(inserted)) {
const candidate = acceptedInserted + segment;
if (props.countGraphemes(candidate) > availableInserted) break;
acceptedInserted = candidate;
}
} else for (const char of Array.from(inserted)) {
const candidate = acceptedInserted + char;
if (props.countGraphemes(candidate) > availableInserted) break;
acceptedInserted = candidate;
}
value = before + acceptedInserted + after;
shouldForceNativeUpdate = true;
}
}
if (String(value) === nativeInputValue.value) {
if (props.formatter || shouldForceNativeUpdate) {
const target = event.target;
const blockedValue = target.value;
const selectionStart = target.selectionStart;
const selectionEnd = target.selectionEnd;
setNativeInputValue();
if (shouldForceNativeUpdate && _ref.value && selectionStart != null && selectionEnd != null) {
const restoredValue = _ref.value.value;
const afterTxt = blockedValue.slice(Math.max(0, selectionEnd));
let caretPos = Math.min(selectionStart, restoredValue.length);
if (afterTxt && restoredValue.endsWith(afterTxt)) caretPos = restoredValue.length - afterTxt.length;
_ref.value.setSelectionRange(caretPos, caretPos);
}
}
return;
}
saveValue.value = value;
recordCursor();
emit(UPDATE_MODEL_EVENT, value);
emit(INPUT_EVENT, value);
await (0, vue.nextTick)();
if (props.formatter && props.parser || !hasModelModifiers.value) setNativeInputValue();
setCursor();
};
const handleChange = async (event) => {
let { value } = event.target;
value = formatValue(value);
if (props.modelModifiers.lazy) emit(UPDATE_MODEL_EVENT, value);
emit(CHANGE_EVENT, value, event);
await (0, vue.nextTick)();
setNativeInputValue();
};
const { isComposing, handleCompositionStart, handleCompositionUpdate, handleCompositionEnd } = useComposition({
emit,
afterComposition: handleInput
});
const handlePasswordVisible = () => {
passwordVisible.value = !passwordVisible.value;
};
const focus = () => _ref.value?.focus();
const blur = () => _ref.value?.blur();
const handleMouseLeave = (evt) => {
hovering.value = false;
emit("mouseleave", evt);
};
const handleMouseEnter = (evt) => {
hovering.value = true;
emit("mouseenter", evt);
};
const handleKeydown = (evt) => {
emit("keydown", evt);
};
const select = () => {
_ref.value?.select();
};
const clear = (evt) => {
emit(UPDATE_MODEL_EVENT, "");
emit(CHANGE_EVENT, "");
emit("clear", evt);
emit(INPUT_EVENT, "");
};
(0, vue.watch)(() => props.modelValue, () => {
(0, vue.nextTick)(() => resizeTextarea());
if (props.validateEvent) elFormItem?.validate?.("change").catch((err) => /* @__PURE__ */ debugWarn(err));
});
(0, vue.watch)(() => nativeInputValue.value, (val) => {
saveValue.value = val;
}, { immediate: true });
(0, vue.watch)(nativeInputValue, (newValue) => {
if (!_ref.value) return;
const { trim, number } = props.modelModifiers;
const elValue = _ref.value.value;
const displayValue = (number || props.type === "number") && !/^0\d/.test(elValue) ? `${looseToNumber(elValue)}` : elValue;
if (displayValue === newValue) return;
if (document.activeElement === _ref.value && _ref.value.type !== "range") {
if (trim && displayValue.trim() === newValue) return;
}
setNativeInputValue();
});
(0, vue.watch)(() => props.type, async () => {
await (0, vue.nextTick)();
setNativeInputValue();
resizeTextarea();
});
(0, vue.onMounted)(() => {
if (!props.formatter && props.parser) /* @__PURE__ */ debugWarn(COMPONENT_NAME$19, "If you set the parser, you also need to set the formatter.");
setNativeInputValue();
(0, vue.nextTick)(resizeTextarea);
});
__expose({
input,
textarea,
ref: _ref,
textareaStyle,
autosize: (0, vue.toRef)(props, "autosize"),
isComposing,
passwordVisible,
focus,
blur,
select,
clear,
resizeTextarea
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
class: (0, vue.normalizeClass)([containerKls.value, {
[(0, vue.unref)(nsInput).bm("group", "append")]: _ctx.$slots.append,
[(0, vue.unref)(nsInput).bm("group", "prepend")]: _ctx.$slots.prepend
}]),
style: (0, vue.normalizeStyle)(containerStyle.value),
onMouseenter: handleMouseEnter,
onMouseleave: handleMouseLeave
}, [(0, vue.createCommentVNode)(" input "), __props.type !== "textarea" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [
(0, vue.createCommentVNode)(" prepend slot "),
_ctx.$slots.prepend ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(nsInput).be("group", "prepend"))
}, [(0, vue.renderSlot)(_ctx.$slots, "prepend")], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", {
ref_key: "wrapperRef",
ref: wrapperRef,
class: (0, vue.normalizeClass)(wrapperKls.value)
}, [
(0, vue.createCommentVNode)(" prefix slot "),
_ctx.$slots.prefix || __props.prefixIcon ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(nsInput).e("prefix"))
}, [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(nsInput).e("prefix-inner")) }, [(0, vue.renderSlot)(_ctx.$slots, "prefix"), __props.prefixIcon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(nsInput).e("icon"))
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.prefixIcon)))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true)], 2)], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("input", (0, vue.mergeProps)({
id: (0, vue.unref)(inputId),
ref_key: "input",
ref: input,
class: (0, vue.unref)(nsInput).e("inner")
}, (0, vue.unref)(attrs), {
name: __props.name,
minlength: __props.countGraphemes ? void 0 : __props.minlength,
maxlength: __props.countGraphemes ? void 0 : maxlength.value,
type: __props.showPassword ? passwordVisible.value ? "text" : "password" : __props.type,
disabled: (0, vue.unref)(inputDisabled),
readonly: __props.readonly,
autocomplete: __props.autocomplete,
tabindex: __props.tabindex,
"aria-label": __props.ariaLabel,
placeholder: __props.placeholder,
style: __props.inputStyle,
form: __props.form,
autofocus: __props.autofocus,
role: __props.containerRole,
inputmode: __props.inputmode,
onCompositionstart: _cache[0] || (_cache[0] = (...args) => (0, vue.unref)(handleCompositionStart) && (0, vue.unref)(handleCompositionStart)(...args)),
onCompositionupdate: _cache[1] || (_cache[1] = (...args) => (0, vue.unref)(handleCompositionUpdate) && (0, vue.unref)(handleCompositionUpdate)(...args)),
onCompositionend: _cache[2] || (_cache[2] = (...args) => (0, vue.unref)(handleCompositionEnd) && (0, vue.unref)(handleCompositionEnd)(...args)),
onInput: handleInput,
onChange: handleChange,
onKeydown: handleKeydown
}), null, 16, _hoisted_1$76),
(0, vue.createCommentVNode)(" suffix slot "),
suffixVisible.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(nsInput).e("suffix"))
}, [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(nsInput).e("suffix-inner")) }, [
!showClear.value || !showPwdVisible.value || !isWordLimitVisible.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [(0, vue.renderSlot)(_ctx.$slots, "suffix"), __props.suffixIcon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(nsInput).e("icon"))
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.suffixIcon)))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true)], 64)) : (0, vue.createCommentVNode)("v-if", true),
showClear.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 1,
class: (0, vue.normalizeClass)([(0, vue.unref)(nsInput).e("icon"), (0, vue.unref)(nsInput).e("clear")]),
onMousedown: (0, vue.withModifiers)((0, vue.unref)(NOOP), ["prevent"]),
onClick: clear
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.clearIcon)))]),
_: 1
}, 8, ["class", "onMousedown"])) : (0, vue.createCommentVNode)("v-if", true),
showPwdVisible.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 2,
class: (0, vue.normalizeClass)([(0, vue.unref)(nsInput).e("icon"), (0, vue.unref)(nsInput).e("password")]),
onClick: handlePasswordVisible,
onMousedown: (0, vue.withModifiers)((0, vue.unref)(NOOP), ["prevent"]),
onMouseup: (0, vue.withModifiers)((0, vue.unref)(NOOP), ["prevent"])
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "password-icon", { visible: passwordVisible.value }, () => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(passwordIcon.value)))])]),
_: 3
}, 8, [
"class",
"onMousedown",
"onMouseup"
])) : (0, vue.createCommentVNode)("v-if", true),
isWordLimitVisible.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 3,
class: (0, vue.normalizeClass)([(0, vue.unref)(nsInput).e("count"), (0, vue.unref)(nsInput).is("outside", __props.wordLimitPosition === "outside")])
}, [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(nsInput).e("count-inner")) }, (0, vue.toDisplayString)(textLength.value) + " / " + (0, vue.toDisplayString)(maxlength.value), 3)], 2)) : (0, vue.createCommentVNode)("v-if", true),
validateState.value && validateIcon.value && needStatusIcon.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 4,
class: (0, vue.normalizeClass)([
(0, vue.unref)(nsInput).e("icon"),
(0, vue.unref)(nsInput).e("validateIcon"),
(0, vue.unref)(nsInput).is("loading", validateState.value === "validating")
])
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(validateIcon.value)))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true)
], 2)], 2)) : (0, vue.createCommentVNode)("v-if", true)
], 2),
(0, vue.createCommentVNode)(" append slot "),
_ctx.$slots.append ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(nsInput).be("group", "append"))
}, [(0, vue.renderSlot)(_ctx.$slots, "append")], 2)) : (0, vue.createCommentVNode)("v-if", true)
], 64)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, [
(0, vue.createCommentVNode)(" textarea "),
(0, vue.createElementVNode)("textarea", (0, vue.mergeProps)({
id: (0, vue.unref)(inputId),
ref_key: "textarea",
ref: textarea,
class: [
(0, vue.unref)(nsTextarea).e("inner"),
(0, vue.unref)(nsInput).is("focus", (0, vue.unref)(isFocused)),
(0, vue.unref)(nsTextarea).is("clearable", __props.clearable)
]
}, (0, vue.unref)(attrs), {
name: __props.name,
minlength: __props.countGraphemes ? void 0 : __props.minlength,
maxlength: __props.countGraphemes ? void 0 : maxlength.value,
tabindex: __props.tabindex,
disabled: (0, vue.unref)(inputDisabled),
readonly: __props.readonly,
autocomplete: __props.autocomplete,
style: textareaStyle.value,
"aria-label": __props.ariaLabel,
placeholder: __props.placeholder,
form: __props.form,
autofocus: __props.autofocus,
rows: __props.rows,
role: __props.containerRole,
inputmode: __props.inputmode,
onCompositionstart: _cache[3] || (_cache[3] = (...args) => (0, vue.unref)(handleCompositionStart) && (0, vue.unref)(handleCompositionStart)(...args)),
onCompositionupdate: _cache[4] || (_cache[4] = (...args) => (0, vue.unref)(handleCompositionUpdate) && (0, vue.unref)(handleCompositionUpdate)(...args)),
onCompositionend: _cache[5] || (_cache[5] = (...args) => (0, vue.unref)(handleCompositionEnd) && (0, vue.unref)(handleCompositionEnd)(...args)),
onInput: handleInput,
onFocus: _cache[6] || (_cache[6] = (...args) => (0, vue.unref)(handleFocus) && (0, vue.unref)(handleFocus)(...args)),
onBlur: _cache[7] || (_cache[7] = (...args) => (0, vue.unref)(handleBlur) && (0, vue.unref)(handleBlur)(...args)),
onChange: handleChange,
onKeydown: handleKeydown
}), null, 16, _hoisted_2$42),
showClear.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)([(0, vue.unref)(nsTextarea).e("icon"), (0, vue.unref)(nsTextarea).e("clear")]),
onMousedown: (0, vue.withModifiers)((0, vue.unref)(NOOP), ["prevent"]),
onClick: clear
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.clearIcon)))]),
_: 1
}, 8, ["class", "onMousedown"])) : (0, vue.createCommentVNode)("v-if", true),
isWordLimitVisible.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 1,
style: (0, vue.normalizeStyle)(countStyle.value),
class: (0, vue.normalizeClass)([(0, vue.unref)(nsInput).e("count"), (0, vue.unref)(nsInput).is("outside", __props.wordLimitPosition === "outside")])
}, (0, vue.toDisplayString)(textLength.value) + " / " + (0, vue.toDisplayString)(maxlength.value), 7)) : (0, vue.createCommentVNode)("v-if", true)
], 64))], 38);
};
}
});
//#endregion
//#region ../../packages/components/input/src/input.vue
var input_default = input_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/input/index.ts
const ElInput = withInstall(input_default);
//#endregion
//#region ../../packages/components/autocomplete/src/autocomplete.ts
/**
* @deprecated Removed after 3.0.0, Use `AutocompleteProps` instead.
*/
const autocompleteProps = buildProps({
...inputProps,
valueKey: {
type: String,
default: "value"
},
modelValue: {
type: [String, Number],
default: ""
},
debounce: {
type: Number,
default: 300
},
placement: {
type: definePropType(String),
values: [
"top",
"top-start",
"top-end",
"bottom",
"bottom-start",
"bottom-end"
],
default: "bottom-start"
},
fetchSuggestions: {
type: definePropType([Function, Array]),
default: NOOP
},
popperClass: useTooltipContentProps.popperClass,
popperStyle: useTooltipContentProps.popperStyle,
triggerOnFocus: {
type: Boolean,
default: true
},
selectWhenUnmatched: Boolean,
hideLoading: Boolean,
teleported: useTooltipContentProps.teleported,
appendTo: useTooltipContentProps.appendTo,
highlightFirstItem: Boolean,
fitInputWidth: Boolean,
loopNavigation: {
type: Boolean,
default: true
}
});
const autocompleteEmits = {
[UPDATE_MODEL_EVENT]: (value) => isString(value) || isNumber(value),
[INPUT_EVENT]: (value) => isString(value) || isNumber(value),
[CHANGE_EVENT]: (value) => isString(value) || isNumber(value),
focus: (evt) => evt instanceof FocusEvent,
blur: (evt) => evt instanceof FocusEvent,
clear: () => true,
select: (item) => isObject$1(item)
};
//#endregion
//#region ../../packages/components/scrollbar/src/scrollbar.ts
/**
* @deprecated Removed after 3.0.0, Use `ScrollbarProps` instead.
*/
const scrollbarProps = buildProps({
distance: {
type: Number,
default: 0
},
height: {
type: [String, Number],
default: ""
},
maxHeight: {
type: [String, Number],
default: ""
},
native: Boolean,
wrapStyle: {
type: definePropType([
String,
Object,
Array
]),
default: ""
},
wrapClass: {
type: [String, Array],
default: ""
},
viewClass: {
type: [String, Array],
default: ""
},
viewStyle: {
type: [
String,
Array,
Object
],
default: ""
},
noresize: Boolean,
tag: {
type: String,
default: "div"
},
always: Boolean,
minSize: {
type: Number,
default: 20
},
tabindex: {
type: [String, Number],
default: void 0
},
id: String,
role: String,
...useAriaProps(["ariaLabel", "ariaOrientation"])
});
const scrollbarEmits = {
"end-reached": (direction) => [
"left",
"right",
"top",
"bottom"
].includes(direction),
scroll: ({ scrollTop, scrollLeft }) => [scrollTop, scrollLeft].every(isNumber)
};
//#endregion
//#region ../../packages/components/scrollbar/src/bar.ts
/**
* @deprecated Removed after 3.0.0, Use `BarProps` instead.
*/
const barProps = buildProps({
always: {
type: Boolean,
default: true
},
minSize: {
type: Number,
required: true
}
});
//#endregion
//#region ../../packages/components/scrollbar/src/util.ts
const GAP = 4;
const BAR_MAP = {
vertical: {
offset: "offsetHeight",
scroll: "scrollTop",
scrollSize: "scrollHeight",
size: "height",
key: "vertical",
axis: "Y",
client: "clientY",
direction: "top"
},
horizontal: {
offset: "offsetWidth",
scroll: "scrollLeft",
scrollSize: "scrollWidth",
size: "width",
key: "horizontal",
axis: "X",
client: "clientX",
direction: "left"
}
};
const renderThumbStyle = ({ move, size, bar }) => ({
[bar.size]: size,
transform: `translate${bar.axis}(${move}%)`
});
//#endregion
//#region ../../packages/components/scrollbar/src/thumb.ts
/**
* @deprecated Removed after 3.0.0, Use `ThumbProps` instead.
*/
const thumbProps = buildProps({
vertical: Boolean,
size: String,
move: Number,
ratio: {
type: Number,
required: true
},
always: Boolean
});
//#endregion
//#region ../../packages/components/scrollbar/src/constants.ts
const scrollbarContextKey = Symbol("scrollbarContextKey");
//#endregion
//#region ../../packages/components/scrollbar/src/thumb.vue?vue&type=script&setup=true&lang.ts
const COMPONENT_NAME$18 = "Thumb";
var thumb_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
__name: "thumb",
props: thumbProps,
setup(__props) {
const props = __props;
const scrollbar = (0, vue.inject)(scrollbarContextKey);
const ns = useNamespace("scrollbar");
if (!scrollbar) throwError(COMPONENT_NAME$18, "can not inject scrollbar context");
const instance = (0, vue.ref)();
const thumb = (0, vue.ref)();
const thumbState = (0, vue.ref)({});
const visible = (0, vue.ref)(false);
let cursorDown = false;
let cursorLeave = false;
let baseScrollHeight = 0;
let baseScrollWidth = 0;
let originalOnSelectStart = isClient ? document.onselectstart : null;
const bar = (0, vue.computed)(() => BAR_MAP[props.vertical ? "vertical" : "horizontal"]);
const thumbStyle = (0, vue.computed)(() => renderThumbStyle({
size: props.size,
move: props.move,
bar: bar.value
}));
const offsetRatio = (0, vue.computed)(() => instance.value[bar.value.offset] ** 2 / scrollbar.wrapElement[bar.value.scrollSize] / props.ratio / thumb.value[bar.value.offset]);
const clickThumbHandler = (e) => {
e.stopPropagation();
if (e.ctrlKey || [1, 2].includes(e.button)) return;
window.getSelection()?.removeAllRanges();
startDrag(e);
const el = e.currentTarget;
if (!el) return;
thumbState.value[bar.value.axis] = el[bar.value.offset] - (e[bar.value.client] - el.getBoundingClientRect()[bar.value.direction]);
};
const clickTrackHandler = (e) => {
if (!thumb.value || !instance.value || !scrollbar.wrapElement) return;
const thumbPositionPercentage = (Math.abs(e.target.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]) - thumb.value[bar.value.offset] / 2) * 100 * offsetRatio.value / instance.value[bar.value.offset];
scrollbar.wrapElement[bar.value.scroll] = thumbPositionPercentage * scrollbar.wrapElement[bar.value.scrollSize] / 100;
};
const startDrag = (e) => {
e.stopImmediatePropagation();
cursorDown = true;
baseScrollHeight = scrollbar.wrapElement.scrollHeight;
baseScrollWidth = scrollbar.wrapElement.scrollWidth;
document.addEventListener("mousemove", mouseMoveDocumentHandler);
document.addEventListener("mouseup", mouseUpDocumentHandler);
originalOnSelectStart = document.onselectstart;
document.onselectstart = () => false;
};
const mouseMoveDocumentHandler = (e) => {
if (!instance.value || !thumb.value) return;
if (cursorDown === false) return;
const prevPage = thumbState.value[bar.value.axis];
if (!prevPage) return;
const thumbPositionPercentage = ((instance.value.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]) * -1 - (thumb.value[bar.value.offset] - prevPage)) * 100 * offsetRatio.value / instance.value[bar.value.offset];
if (bar.value.scroll === "scrollLeft") scrollbar.wrapElement[bar.value.scroll] = thumbPositionPercentage * baseScrollWidth / 100;
else scrollbar.wrapElement[bar.value.scroll] = thumbPositionPercentage * baseScrollHeight / 100;
};
const mouseUpDocumentHandler = () => {
cursorDown = false;
thumbState.value[bar.value.axis] = 0;
document.removeEventListener("mousemove", mouseMoveDocumentHandler);
document.removeEventListener("mouseup", mouseUpDocumentHandler);
restoreOnselectstart();
if (cursorLeave) visible.value = false;
};
const mouseMoveScrollbarHandler = () => {
cursorLeave = false;
visible.value = !!props.size;
};
const mouseLeaveScrollbarHandler = () => {
cursorLeave = true;
visible.value = cursorDown;
};
(0, vue.onBeforeUnmount)(() => {
restoreOnselectstart();
document.removeEventListener("mouseup", mouseUpDocumentHandler);
});
const restoreOnselectstart = () => {
if (document.onselectstart !== originalOnSelectStart) document.onselectstart = originalOnSelectStart;
};
useEventListener((0, vue.toRef)(scrollbar, "scrollbarElement"), "mousemove", mouseMoveScrollbarHandler);
useEventListener((0, vue.toRef)(scrollbar, "scrollbarElement"), "mouseleave", mouseLeaveScrollbarHandler);
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)(vue.Transition, {
name: (0, vue.unref)(ns).b("fade"),
persisted: ""
}, {
default: (0, vue.withCtx)(() => [(0, vue.withDirectives)((0, vue.createElementVNode)("div", {
ref_key: "instance",
ref: instance,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("bar"), (0, vue.unref)(ns).is(bar.value.key)]),
onMousedown: clickTrackHandler,
onClick: _cache[0] || (_cache[0] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, [(0, vue.createElementVNode)("div", {
ref_key: "thumb",
ref: thumb,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("thumb")),
style: (0, vue.normalizeStyle)(thumbStyle.value),
onMousedown: clickThumbHandler
}, null, 38)], 34), [[vue.vShow, __props.always || visible.value]])]),
_: 1
}, 8, ["name"]);
};
}
});
//#endregion
//#region ../../packages/components/scrollbar/src/thumb.vue
var thumb_default = thumb_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/scrollbar/src/bar.vue?vue&type=script&setup=true&lang.ts
var bar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
__name: "bar",
props: barProps,
setup(__props, { expose: __expose }) {
const props = __props;
const scrollbar = (0, vue.inject)(scrollbarContextKey);
const moveX = (0, vue.ref)(0);
const moveY = (0, vue.ref)(0);
const sizeWidth = (0, vue.ref)("");
const sizeHeight = (0, vue.ref)("");
const ratioY = (0, vue.ref)(1);
const ratioX = (0, vue.ref)(1);
const handleScroll = (wrap) => {
if (wrap) {
const offsetHeight = wrap.offsetHeight - GAP;
const offsetWidth = wrap.offsetWidth - GAP;
moveY.value = wrap.scrollTop * 100 / offsetHeight * ratioY.value;
moveX.value = wrap.scrollLeft * 100 / offsetWidth * ratioX.value;
}
};
const update = () => {
const wrap = scrollbar?.wrapElement;
if (!wrap) return;
const offsetHeight = wrap.offsetHeight - GAP;
const offsetWidth = wrap.offsetWidth - GAP;
const originalHeight = offsetHeight ** 2 / wrap.scrollHeight;
const originalWidth = offsetWidth ** 2 / wrap.scrollWidth;
const height = Math.max(originalHeight, props.minSize);
const width = Math.max(originalWidth, props.minSize);
ratioY.value = originalHeight / (offsetHeight - originalHeight) / (height / (offsetHeight - height));
ratioX.value = originalWidth / (offsetWidth - originalWidth) / (width / (offsetWidth - width));
sizeHeight.value = height + GAP < offsetHeight ? `${height}px` : "";
sizeWidth.value = width + GAP < offsetWidth ? `${width}px` : "";
};
__expose({
handleScroll,
update
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, [(0, vue.createVNode)(thumb_default, {
move: moveX.value,
ratio: ratioX.value,
size: sizeWidth.value,
always: __props.always
}, null, 8, [
"move",
"ratio",
"size",
"always"
]), (0, vue.createVNode)(thumb_default, {
move: moveY.value,
ratio: ratioY.value,
size: sizeHeight.value,
vertical: "",
always: __props.always
}, null, 8, [
"move",
"ratio",
"size",
"always"
])], 64);
};
}
});
//#endregion
//#region ../../packages/components/scrollbar/src/bar.vue
var bar_default = bar_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/scrollbar/src/scrollbar.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$75 = ["tabindex"];
const COMPONENT_NAME$17 = "ElScrollbar";
var scrollbar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: COMPONENT_NAME$17,
__name: "scrollbar",
props: scrollbarProps,
emits: scrollbarEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const ns = useNamespace("scrollbar");
let stopResizeObserver = void 0;
let stopWrapResizeObserver = void 0;
let stopResizeListener = void 0;
let wrapScrollTop = 0;
let wrapScrollLeft = 0;
let direction = "";
const distanceScrollState = {
bottom: false,
top: false,
right: false,
left: false
};
const scrollbarRef = (0, vue.ref)();
const wrapRef = (0, vue.ref)();
const resizeRef = (0, vue.ref)();
const barRef = (0, vue.ref)();
const wrapStyle = (0, vue.computed)(() => {
const style = {};
const height = addUnit(props.height);
const maxHeight = addUnit(props.maxHeight);
if (height) style.height = height;
if (maxHeight) style.maxHeight = maxHeight;
return [props.wrapStyle, style];
});
const wrapKls = (0, vue.computed)(() => {
return [
props.wrapClass,
ns.e("wrap"),
{ [ns.em("wrap", "hidden-default")]: !props.native }
];
});
const resizeKls = (0, vue.computed)(() => {
return [ns.e("view"), props.viewClass];
});
const shouldSkipDirection = (direction) => {
return distanceScrollState[direction] ?? false;
};
const DIRECTION_PAIRS = {
top: "bottom",
bottom: "top",
left: "right",
right: "left"
};
const updateTriggerStatus = (arrivedStates) => {
const oppositeDirection = DIRECTION_PAIRS[direction];
if (!oppositeDirection) return;
const arrived = arrivedStates[direction];
const oppositeArrived = arrivedStates[oppositeDirection];
if (arrived && !distanceScrollState[direction]) distanceScrollState[direction] = true;
if (!oppositeArrived && distanceScrollState[oppositeDirection]) distanceScrollState[oppositeDirection] = false;
};
const handleScroll = () => {
if (wrapRef.value) {
barRef.value?.handleScroll(wrapRef.value);
const prevTop = wrapScrollTop;
const prevLeft = wrapScrollLeft;
wrapScrollTop = wrapRef.value.scrollTop;
wrapScrollLeft = wrapRef.value.scrollLeft;
const arrivedStates = {
bottom: !isGreaterThan(wrapRef.value.scrollHeight - props.distance, wrapRef.value.clientHeight + wrapScrollTop),
top: wrapScrollTop <= props.distance && prevTop !== 0,
right: !isGreaterThan(wrapRef.value.scrollWidth - props.distance, wrapRef.value.clientWidth + wrapScrollLeft) && prevLeft !== wrapScrollLeft,
left: wrapScrollLeft <= props.distance && prevLeft !== 0
};
emit("scroll", {
scrollTop: wrapScrollTop,
scrollLeft: wrapScrollLeft
});
if (prevTop !== wrapScrollTop) direction = wrapScrollTop > prevTop ? "bottom" : "top";
if (prevLeft !== wrapScrollLeft) direction = wrapScrollLeft > prevLeft ? "right" : "left";
if (props.distance > 0) {
if (shouldSkipDirection(direction)) return;
updateTriggerStatus(arrivedStates);
}
if (arrivedStates[direction]) emit("end-reached", direction);
}
};
function scrollTo(arg1, arg2) {
if (isObject$1(arg1)) wrapRef.value.scrollTo(arg1);
else if (isNumber(arg1) && isNumber(arg2)) wrapRef.value.scrollTo(arg1, arg2);
}
const setScrollTop = (value) => {
if (!isNumber(value)) {
/* @__PURE__ */ debugWarn(COMPONENT_NAME$17, "value must be a number");
return;
}
wrapRef.value.scrollTop = value;
};
const setScrollLeft = (value) => {
if (!isNumber(value)) {
/* @__PURE__ */ debugWarn(COMPONENT_NAME$17, "value must be a number");
return;
}
wrapRef.value.scrollLeft = value;
};
const update = () => {
barRef.value?.update();
distanceScrollState[direction] = false;
if (wrapRef.value) barRef.value?.handleScroll(wrapRef.value);
};
(0, vue.watch)(() => props.noresize, (noresize) => {
if (noresize) {
stopResizeObserver?.();
stopWrapResizeObserver?.();
stopResizeListener?.();
} else {
({stop: stopResizeObserver} = useResizeObserver(resizeRef, update));
({stop: stopWrapResizeObserver} = useResizeObserver(wrapRef, update));
stopResizeListener = useEventListener("resize", update);
}
}, { immediate: true });
(0, vue.watch)(() => [props.maxHeight, props.height], () => {
if (!props.native) (0, vue.nextTick)(() => {
update();
});
});
(0, vue.provide)(scrollbarContextKey, (0, vue.reactive)({
scrollbarElement: scrollbarRef,
wrapElement: wrapRef
}));
(0, vue.onActivated)(() => {
if (wrapRef.value) {
wrapRef.value.scrollTop = wrapScrollTop;
wrapRef.value.scrollLeft = wrapScrollLeft;
}
});
(0, vue.onMounted)(() => {
if (!props.native) (0, vue.nextTick)(() => {
update();
});
});
(0, vue.onUpdated)(() => update());
__expose({
wrapRef,
update,
scrollTo,
setScrollTop,
setScrollLeft,
handleScroll
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref_key: "scrollbarRef",
ref: scrollbarRef,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b())
}, [(0, vue.createElementVNode)("div", {
ref_key: "wrapRef",
ref: wrapRef,
class: (0, vue.normalizeClass)(wrapKls.value),
style: (0, vue.normalizeStyle)(wrapStyle.value),
tabindex: __props.tabindex,
onScroll: handleScroll
}, [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.tag), {
id: __props.id,
ref_key: "resizeRef",
ref: resizeRef,
class: (0, vue.normalizeClass)(resizeKls.value),
style: (0, vue.normalizeStyle)(__props.viewStyle),
role: __props.role,
"aria-label": __props.ariaLabel,
"aria-orientation": __props.ariaOrientation
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 8, [
"id",
"class",
"style",
"role",
"aria-label",
"aria-orientation"
]))], 46, _hoisted_1$75), !__props.native ? ((0, vue.openBlock)(), (0, vue.createBlock)(bar_default, {
key: 0,
ref_key: "barRef",
ref: barRef,
always: __props.always,
"min-size": __props.minSize
}, null, 8, ["always", "min-size"])) : (0, vue.createCommentVNode)("v-if", true)], 2);
};
}
});
//#endregion
//#region ../../packages/components/scrollbar/src/scrollbar.vue
var scrollbar_default = scrollbar_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/scrollbar/index.ts
const ElScrollbar = withInstall(scrollbar_default);
//#endregion
//#region ../../packages/components/autocomplete/src/autocomplete.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$74 = ["aria-expanded", "aria-owns"];
const _hoisted_2$41 = { key: 0 };
const _hoisted_3$18 = [
"id",
"aria-selected",
"onClick"
];
const COMPONENT_NAME$16 = "ElAutocomplete";
var autocomplete_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: COMPONENT_NAME$16,
inheritAttrs: false,
__name: "autocomplete",
props: autocompleteProps,
emits: autocompleteEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const passInputProps = (0, vue.computed)(() => {
const inputProps = ElInput.props ?? [];
return pick(props, isArray$1(inputProps) ? inputProps : Object.keys(inputProps));
});
const rawAttrs = (0, vue.useAttrs)();
const disabled = useFormDisabled();
const ns = useNamespace("autocomplete");
const inputRef = (0, vue.ref)();
const regionRef = (0, vue.ref)();
const popperRef = (0, vue.ref)();
const listboxRef = (0, vue.ref)();
let readonly = false;
let ignoreFocusEvent = false;
const suggestions = (0, vue.ref)([]);
const highlightedIndex = (0, vue.ref)(-1);
const dropdownWidth = (0, vue.ref)("");
const activated = (0, vue.ref)(false);
const suggestionDisabled = (0, vue.ref)(false);
const loading = (0, vue.ref)(false);
const listboxId = useId();
const styles = (0, vue.computed)(() => rawAttrs.style);
const suggestionVisible = (0, vue.computed)(() => {
return (suggestions.value.length > 0 || loading.value) && activated.value;
});
const suggestionLoading = (0, vue.computed)(() => !props.hideLoading && loading.value);
const refInput = (0, vue.computed)(() => {
if (inputRef.value) return Array.from(inputRef.value.$el.querySelectorAll("input"));
return [];
});
const onSuggestionShow = () => {
if (suggestionVisible.value) dropdownWidth.value = `${inputRef.value.$el.offsetWidth}px`;
};
const onHide = () => {
highlightedIndex.value = -1;
};
const getData = async (queryString) => {
if (suggestionDisabled.value) return;
const cb = (suggestionList) => {
loading.value = false;
if (suggestionDisabled.value) return;
if (isArray$1(suggestionList)) {
suggestions.value = suggestionList;
highlightedIndex.value = props.highlightFirstItem ? 0 : -1;
} else throwError(COMPONENT_NAME$16, "autocomplete suggestions must be an array");
};
loading.value = true;
if (isArray$1(props.fetchSuggestions)) cb(props.fetchSuggestions);
else {
const result = await props.fetchSuggestions(queryString, cb);
if (isArray$1(result)) cb(result);
}
};
const debouncedGetData = useDebounceFn(getData, (0, vue.computed)(() => props.debounce));
const handleInput = (value) => {
const valuePresented = !!value;
emit(INPUT_EVENT, value);
emit(UPDATE_MODEL_EVENT, value);
suggestionDisabled.value = false;
activated.value ||= valuePresented;
if (!props.triggerOnFocus && !value) {
suggestionDisabled.value = true;
suggestions.value = [];
return;
}
debouncedGetData(value);
};
const handleMouseDown = (event) => {
if (disabled.value) return;
if (event.target?.tagName !== "INPUT" || refInput.value.includes(document.activeElement)) activated.value = true;
};
const handleChange = (value) => {
emit(CHANGE_EVENT, value);
};
const handleFocus = (evt) => {
if (!ignoreFocusEvent) {
activated.value = true;
emit("focus", evt);
const queryString = props.modelValue ?? "";
if (props.triggerOnFocus && !readonly) debouncedGetData(String(queryString));
} else ignoreFocusEvent = false;
};
const handleBlur = (evt) => {
setTimeout(() => {
if (popperRef.value?.isFocusInsideContent()) {
ignoreFocusEvent = true;
return;
}
activated.value && close();
emit("blur", evt);
});
};
const handleClear = () => {
activated.value = false;
emit(UPDATE_MODEL_EVENT, "");
emit("clear");
};
const handleKeyEnter = async () => {
if (inputRef.value?.isComposing) return;
if (suggestionVisible.value && highlightedIndex.value >= 0 && highlightedIndex.value < suggestions.value.length) handleSelect(suggestions.value[highlightedIndex.value]);
else {
if (props.selectWhenUnmatched) {
emit("select", { value: props.modelValue });
suggestions.value = [];
highlightedIndex.value = -1;
}
activated.value = true;
debouncedGetData(String(props.modelValue));
}
};
const handleKeyEscape = (evt) => {
if (suggestionVisible.value) {
evt.preventDefault();
evt.stopPropagation();
close();
}
};
const close = () => {
activated.value = false;
};
const focus = () => {
inputRef.value?.focus();
};
const blur = () => {
inputRef.value?.blur();
};
const handleSelect = async (item) => {
emit(INPUT_EVENT, item[props.valueKey]);
emit(UPDATE_MODEL_EVENT, item[props.valueKey]);
emit("select", item);
suggestions.value = [];
highlightedIndex.value = -1;
};
const highlight = (index) => {
if (!suggestionVisible.value || loading.value) return;
if (index < 0) {
if (!props.loopNavigation) {
highlightedIndex.value = -1;
return;
}
index = suggestions.value.length - 1;
}
if (index >= suggestions.value.length) index = props.loopNavigation ? 0 : suggestions.value.length - 1;
const [suggestion, suggestionList] = getSuggestionContext();
const highlightItem = suggestionList[index];
const scrollTop = suggestion.scrollTop;
const { offsetTop, scrollHeight } = highlightItem;
if (offsetTop + scrollHeight > scrollTop + suggestion.clientHeight) suggestion.scrollTop = offsetTop + scrollHeight - suggestion.clientHeight;
if (offsetTop < scrollTop) suggestion.scrollTop = offsetTop;
highlightedIndex.value = index;
inputRef.value?.ref?.setAttribute("aria-activedescendant", `${listboxId.value}-item-${highlightedIndex.value}`);
};
const getSuggestionContext = () => {
const suggestion = regionRef.value.querySelector(`.${ns.be("suggestion", "wrap")}`);
return [suggestion, suggestion.querySelectorAll(`.${ns.be("suggestion", "list")} li`)];
};
const stopHandle = onClickOutside(listboxRef, (event) => {
if (popperRef.value?.isFocusInsideContent()) return;
const hadIgnoredFocus = ignoreFocusEvent;
ignoreFocusEvent = false;
if (!suggestionVisible.value) return;
if (hadIgnoredFocus) handleBlur(new FocusEvent("blur", event));
else close();
});
const handleKeydown = (e) => {
switch (getEventCode(e)) {
case EVENT_CODE.up:
e.preventDefault();
highlight(highlightedIndex.value - 1);
break;
case EVENT_CODE.down:
e.preventDefault();
highlight(highlightedIndex.value + 1);
break;
case EVENT_CODE.enter:
case EVENT_CODE.numpadEnter:
e.preventDefault();
handleKeyEnter();
break;
case EVENT_CODE.tab:
close();
break;
case EVENT_CODE.esc:
handleKeyEscape(e);
break;
case EVENT_CODE.home:
e.preventDefault();
highlight(0);
break;
case EVENT_CODE.end:
e.preventDefault();
highlight(suggestions.value.length - 1);
break;
case EVENT_CODE.pageUp:
e.preventDefault();
highlight(Math.max(0, highlightedIndex.value - 10));
break;
case EVENT_CODE.pageDown:
e.preventDefault();
highlight(Math.min(suggestions.value.length - 1, highlightedIndex.value + 10));
break;
}
};
(0, vue.onBeforeUnmount)(() => {
stopHandle?.();
});
(0, vue.onMounted)(() => {
const inputElement = inputRef.value?.ref;
if (!inputElement) return;
[
{
key: "role",
value: "textbox"
},
{
key: "aria-autocomplete",
value: "list"
},
{
key: "aria-controls",
value: listboxId.value
},
{
key: "aria-activedescendant",
value: `${listboxId.value}-item-${highlightedIndex.value}`
}
].forEach(({ key, value }) => inputElement.setAttribute(key, value));
readonly = inputElement.hasAttribute("readonly");
});
__expose({
highlightedIndex,
activated,
loading,
inputRef,
popperRef,
suggestions,
handleSelect,
handleKeyEnter,
focus,
blur,
close,
highlight,
getData
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElTooltip), {
ref_key: "popperRef",
ref: popperRef,
visible: suggestionVisible.value,
placement: __props.placement,
"fallback-placements": ["bottom-start", "top-start"],
"popper-class": [(0, vue.unref)(ns).e("popper"), __props.popperClass],
"popper-style": __props.popperStyle,
teleported: __props.teleported,
"append-to": __props.appendTo,
"gpu-acceleration": false,
pure: "",
"manual-mode": "",
effect: "light",
trigger: "click",
transition: `${(0, vue.unref)(ns).namespace.value}-zoom-in-top`,
persistent: "",
role: "listbox",
onBeforeShow: onSuggestionShow,
onHide
}, {
content: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", {
ref_key: "regionRef",
ref: regionRef,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).b("suggestion"), (0, vue.unref)(ns).is("loading", suggestionLoading.value)]),
style: (0, vue.normalizeStyle)({
[__props.fitInputWidth ? "width" : "minWidth"]: dropdownWidth.value,
outline: "none"
}),
role: "region"
}, [
_ctx.$slots.header ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("suggestion", "header")),
onClick: _cache[0] || (_cache[0] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, [(0, vue.renderSlot)(_ctx.$slots, "header")], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createVNode)((0, vue.unref)(ElScrollbar), {
id: (0, vue.unref)(listboxId),
tag: "ul",
"wrap-class": (0, vue.unref)(ns).be("suggestion", "wrap"),
"view-class": (0, vue.unref)(ns).be("suggestion", "list"),
role: "listbox"
}, {
default: (0, vue.withCtx)(() => [suggestionLoading.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("li", _hoisted_2$41, [(0, vue.renderSlot)(_ctx.$slots, "loading", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), { class: (0, vue.normalizeClass)((0, vue.unref)(ns).is("loading")) }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(loading_default))]),
_: 1
}, 8, ["class"])])])) : ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, (0, vue.renderList)(suggestions.value, (item, index) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
id: `${(0, vue.unref)(listboxId)}-item-${index}`,
key: index,
class: (0, vue.normalizeClass)({ highlighted: highlightedIndex.value === index }),
role: "option",
"aria-selected": highlightedIndex.value === index,
onClick: ($event) => handleSelect(item)
}, [(0, vue.renderSlot)(_ctx.$slots, "default", { item }, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(item[__props.valueKey]), 1)])], 10, _hoisted_3$18);
}), 128))]),
_: 3
}, 8, [
"id",
"wrap-class",
"view-class"
]),
_ctx.$slots.footer ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("suggestion", "footer")),
onClick: _cache[1] || (_cache[1] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, [(0, vue.renderSlot)(_ctx.$slots, "footer")], 2)) : (0, vue.createCommentVNode)("v-if", true)
], 6)]),
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", {
ref_key: "listboxRef",
ref: listboxRef,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).b(), _ctx.$attrs.class]),
style: (0, vue.normalizeStyle)(styles.value),
role: "combobox",
"aria-haspopup": "listbox",
"aria-expanded": suggestionVisible.value,
"aria-owns": (0, vue.unref)(listboxId)
}, [(0, vue.createVNode)((0, vue.unref)(ElInput), (0, vue.mergeProps)({
ref_key: "inputRef",
ref: inputRef
}, (0, vue.mergeProps)(passInputProps.value, _ctx.$attrs), {
"model-value": __props.modelValue,
disabled: (0, vue.unref)(disabled),
onInput: handleInput,
onChange: handleChange,
onFocus: handleFocus,
onBlur: handleBlur,
onClear: handleClear,
onKeydown: handleKeydown,
onMousedown: handleMouseDown
}), (0, vue.createSlots)({ _: 2 }, [
_ctx.$slots.prepend ? {
name: "prepend",
fn: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "prepend")]),
key: "0"
} : void 0,
_ctx.$slots.append ? {
name: "append",
fn: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "append")]),
key: "1"
} : void 0,
_ctx.$slots.prefix ? {
name: "prefix",
fn: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "prefix")]),
key: "2"
} : void 0,
_ctx.$slots.suffix ? {
name: "suffix",
fn: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "suffix")]),
key: "3"
} : void 0
]), 1040, ["model-value", "disabled"])], 14, _hoisted_1$74)]),
_: 3
}, 8, [
"visible",
"placement",
"popper-class",
"popper-style",
"teleported",
"append-to",
"transition"
]);
};
}
});
//#endregion
//#region ../../packages/components/autocomplete/src/autocomplete.vue
var autocomplete_default = autocomplete_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/autocomplete/index.ts
const ElAutocomplete = withInstall(autocomplete_default);
//#endregion
//#region ../../packages/components/avatar/src/avatar.ts
/**
* @deprecated Removed after 3.0.0, Use `AvatarProps` instead.
*/
const avatarProps = buildProps({
size: {
type: [Number, String],
values: componentSizes,
validator: (val) => isNumber(val)
},
shape: {
type: String,
values: ["circle", "square"]
},
icon: { type: iconPropType },
src: {
type: String,
default: ""
},
alt: String,
srcSet: String,
fit: {
type: definePropType(String),
default: "cover"
}
});
const avatarEmits = { error: (evt) => evt instanceof Event };
//#endregion
//#region ../../packages/components/avatar/src/constants.ts
const avatarGroupContextKey = Symbol("avatarGroupContextKey");
//#endregion
//#region ../../packages/components/avatar/src/avatar.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$73 = [
"src",
"alt",
"srcset"
];
var avatar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElAvatar",
__name: "avatar",
props: avatarProps,
emits: avatarEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const avatarGroupContext = (0, vue.inject)(avatarGroupContextKey, void 0);
const ns = useNamespace("avatar");
const hasLoadError = (0, vue.ref)(false);
const size = (0, vue.computed)(() => props.size ?? avatarGroupContext?.size);
const shape = (0, vue.computed)(() => props.shape ?? avatarGroupContext?.shape ?? "circle");
const avatarClass = (0, vue.computed)(() => {
const { icon } = props;
const classList = [ns.b()];
if (isString(size.value)) classList.push(ns.m(size.value));
if (icon) classList.push(ns.m("icon"));
if (shape.value) classList.push(ns.m(shape.value));
return classList;
});
const sizeStyle = (0, vue.computed)(() => {
return isNumber(size.value) ? ns.cssVarBlock({ size: addUnit(size.value) }) : void 0;
});
const fitStyle = (0, vue.computed)(() => ({ objectFit: props.fit }));
(0, vue.watch)(() => [props.src, props.srcSet], () => hasLoadError.value = false);
function handleError(e) {
hasLoadError.value = true;
emit("error", e);
}
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
class: (0, vue.normalizeClass)(avatarClass.value),
style: (0, vue.normalizeStyle)(sizeStyle.value)
}, [(__props.src || __props.srcSet) && !hasLoadError.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("img", {
key: 0,
src: __props.src,
alt: __props.alt,
srcset: __props.srcSet,
style: (0, vue.normalizeStyle)(fitStyle.value),
onError: handleError
}, null, 44, _hoisted_1$73)) : __props.icon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), { key: 1 }, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.icon)))]),
_: 1
})) : (0, vue.renderSlot)(_ctx.$slots, "default", { key: 2 })], 6);
};
}
});
//#endregion
//#region ../../packages/components/avatar/src/avatar.vue
var avatar_default = avatar_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/avatar/src/avatar-group-props.ts
const avatarGroupProps = {
size: {
type: definePropType([Number, String]),
values: componentSizes,
validator: (val) => isNumber(val)
},
shape: {
type: definePropType(String),
values: ["circle", "square"]
},
collapseAvatars: Boolean,
collapseAvatarsTooltip: Boolean,
maxCollapseAvatars: {
type: Number,
default: 1
},
effect: {
type: definePropType(String),
default: "light"
},
placement: {
type: definePropType(String),
values: Ee,
default: "top"
},
popperClass: useTooltipContentProps.popperClass,
popperStyle: useTooltipContentProps.popperStyle,
collapseClass: String,
collapseStyle: { type: definePropType([
String,
Array,
Object
]) }
};
//#endregion
//#region ../../packages/components/avatar/src/avatar-group.tsx
var avatar_group_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElAvatarGroup",
props: avatarGroupProps,
setup(props, { slots }) {
const ns = useNamespace("avatar-group");
(0, vue.provide)(avatarGroupContextKey, (0, vue.reactive)({
size: (0, vue.toRef)(props, "size"),
shape: (0, vue.toRef)(props, "shape")
}));
return () => {
const avatars = flattedChildren(slots.default?.() ?? []);
let visibleAvatars = avatars;
if (props.collapseAvatars && avatars.length > props.maxCollapseAvatars) {
visibleAvatars = avatars.slice(0, props.maxCollapseAvatars);
const hiddenAvatars = avatars.slice(props.maxCollapseAvatars);
visibleAvatars.push((0, vue.createVNode)(ElTooltip, {
"popperClass": props.popperClass,
"popperStyle": props.popperStyle,
"placement": props.placement,
"effect": props.effect,
"disabled": !props.collapseAvatarsTooltip
}, {
default: () => (0, vue.createVNode)(avatar_default, {
"size": props.size,
"shape": props.shape,
"class": props.collapseClass,
"style": props.collapseStyle
}, { default: () => [(0, vue.createTextVNode)("+ "), hiddenAvatars.length] }),
content: () => (0, vue.createVNode)("div", { "class": ns.e("collapse-avatars") }, [hiddenAvatars.map((node, idx) => (0, vue.isVNode)(node) ? (0, vue.cloneVNode)(node, { key: node.key ?? idx }) : node)])
}));
}
return (0, vue.createVNode)("div", { "class": ns.b() }, [visibleAvatars]);
};
}
});
//#endregion
//#region ../../packages/components/avatar/index.ts
const ElAvatar = withInstall(avatar_default, { AvatarGroup: avatar_group_default });
const ElAvatarGroup = withNoopInstall(avatar_group_default);
//#endregion
//#region ../../packages/components/backtop/src/backtop.ts
/**
* @deprecated Removed after 3.0.0, Use `BacktopProps` instead.
*/
const backtopProps = {
visibilityHeight: {
type: Number,
default: 200
},
target: {
type: String,
default: ""
},
right: {
type: Number,
default: 40
},
bottom: {
type: Number,
default: 40
}
};
const backtopEmits = { click: (evt) => evt instanceof MouseEvent };
//#endregion
//#region ../../packages/components/backtop/src/use-backtop.ts
const useBackTop = (props, emit, componentName) => {
const el = (0, vue.shallowRef)();
const container = (0, vue.shallowRef)();
const visible = (0, vue.ref)(false);
const handleScroll = () => {
if (el.value) visible.value = el.value.scrollTop >= props.visibilityHeight;
};
const handleClick = (event) => {
el.value?.scrollTo({
top: 0,
behavior: "smooth"
});
emit("click", event);
};
useEventListener(container, "scroll", useThrottleFn(handleScroll, 300, true));
(0, vue.onMounted)(() => {
container.value = document;
el.value = document.documentElement;
if (props.target) {
el.value = document.querySelector(props.target) ?? void 0;
if (!el.value) throwError(componentName, `target does not exist: ${props.target}`);
container.value = el.value;
}
handleScroll();
});
return {
visible,
handleClick
};
};
//#endregion
//#region ../../packages/components/backtop/src/backtop.vue?vue&type=script&setup=true&lang.ts
const COMPONENT_NAME$15 = "ElBacktop";
var backtop_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: COMPONENT_NAME$15,
__name: "backtop",
props: backtopProps,
emits: backtopEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const ns = useNamespace("backtop");
const { handleClick, visible } = useBackTop(props, emit, COMPONENT_NAME$15);
const backTopStyle = (0, vue.computed)(() => ({
right: `${props.right}px`,
bottom: `${props.bottom}px`
}));
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)(vue.Transition, { name: `${(0, vue.unref)(ns).namespace.value}-fade-in` }, {
default: (0, vue.withCtx)(() => [(0, vue.unref)(visible) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
style: (0, vue.normalizeStyle)(backTopStyle.value),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()),
onClick: _cache[0] || (_cache[0] = (0, vue.withModifiers)((...args) => (0, vue.unref)(handleClick) && (0, vue.unref)(handleClick)(...args), ["stop"]))
}, [(0, vue.renderSlot)(_ctx.$slots, "default", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("icon")) }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(caret_top_default))]),
_: 1
}, 8, ["class"])])], 6)) : (0, vue.createCommentVNode)("v-if", true)]),
_: 3
}, 8, ["name"]);
};
}
});
//#endregion
//#region ../../packages/components/backtop/src/backtop.vue
var backtop_default = backtop_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/backtop/index.ts
const ElBacktop = withInstall(backtop_default);
//#endregion
//#region ../../packages/components/badge/src/badge.ts
/**
* @deprecated Removed after 3.0.0, Use `BadgeProps` instead.
*/
const badgeProps = buildProps({
value: {
type: [String, Number],
default: ""
},
max: {
type: Number,
default: 99
},
isDot: Boolean,
hidden: Boolean,
type: {
type: String,
values: [
"primary",
"success",
"warning",
"info",
"danger"
],
default: "danger"
},
showZero: {
type: Boolean,
default: true
},
color: String,
badgeStyle: { type: definePropType([
String,
Object,
Array
]) },
offset: {
type: definePropType(Array),
default: () => [0, 0]
},
badgeClass: { type: String }
});
//#endregion
//#region ../../packages/components/badge/src/badge.vue?vue&type=script&setup=true&lang.ts
var badge_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElBadge",
__name: "badge",
props: badgeProps,
setup(__props, { expose: __expose }) {
const props = __props;
const ns = useNamespace("badge");
const content = (0, vue.computed)(() => {
if (props.isDot) return "";
if (isNumber(props.value) && isNumber(props.max)) return props.max < props.value ? `${props.max}+` : `${props.value}`;
return `${props.value}`;
});
const style = (0, vue.computed)(() => {
return [{
backgroundColor: props.color,
marginRight: addUnit(-props.offset[0]),
marginTop: addUnit(props.offset[1])
}, props.badgeStyle ?? {}];
});
__expose({ content });
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()) }, [(0, vue.renderSlot)(_ctx.$slots, "default"), (0, vue.createVNode)(vue.Transition, { name: `${(0, vue.unref)(ns).namespace.value}-zoom-in-center` }, {
default: (0, vue.withCtx)(() => [!__props.hidden && (content.value || __props.isDot || _ctx.$slots.content) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("sup", {
key: 0,
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).e("content"),
(0, vue.unref)(ns).em("content", __props.type),
(0, vue.unref)(ns).is("fixed", !!_ctx.$slots.default),
(0, vue.unref)(ns).is("dot", __props.isDot),
(0, vue.unref)(ns).is("hide-zero", !__props.showZero && __props.value === 0),
__props.badgeClass
]),
style: (0, vue.normalizeStyle)(style.value)
}, [(0, vue.renderSlot)(_ctx.$slots, "content", { value: content.value }, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(content.value), 1)])], 6)) : (0, vue.createCommentVNode)("v-if", true)]),
_: 3
}, 8, ["name"])], 2);
};
}
});
//#endregion
//#region ../../packages/components/badge/src/badge.vue
var badge_default = badge_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/badge/index.ts
const ElBadge = withInstall(badge_default);
//#endregion
//#region ../../packages/components/breadcrumb/src/breadcrumb.ts
/**
* @deprecated Removed after 3.0.0, Use `BreadcrumbProps` instead.
*/
const breadcrumbProps = buildProps({
separator: {
type: String,
default: "/"
},
separatorIcon: { type: iconPropType }
});
//#endregion
//#region ../../packages/components/breadcrumb/src/constants.ts
const breadcrumbKey = Symbol("breadcrumbKey");
//#endregion
//#region ../../packages/components/breadcrumb/src/breadcrumb.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$72 = ["aria-label"];
var breadcrumb_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElBreadcrumb",
__name: "breadcrumb",
props: breadcrumbProps,
setup(__props) {
const { t } = useLocale();
const props = __props;
const ns = useNamespace("breadcrumb");
const breadcrumb = (0, vue.ref)();
(0, vue.provide)(breadcrumbKey, props);
(0, vue.onMounted)(() => {
const items = breadcrumb.value.querySelectorAll(`.${ns.e("item")}`);
if (items.length) items[items.length - 1].setAttribute("aria-current", "page");
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref_key: "breadcrumb",
ref: breadcrumb,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()),
"aria-label": (0, vue.unref)(t)("el.breadcrumb.label"),
role: "navigation"
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 10, _hoisted_1$72);
};
}
});
//#endregion
//#region ../../packages/components/breadcrumb/src/breadcrumb.vue
var breadcrumb_default = breadcrumb_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/breadcrumb/src/breadcrumb-item.ts
/**
* @deprecated Removed after 3.0.0, Use `BreadcrumbItemProps` instead.
*/
const breadcrumbItemProps = buildProps({
to: {
type: definePropType([String, Object]),
default: ""
},
replace: Boolean
});
//#endregion
//#region ../../packages/components/breadcrumb/src/breadcrumb-item.vue?vue&type=script&setup=true&lang.ts
var breadcrumb_item_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElBreadcrumbItem",
__name: "breadcrumb-item",
props: breadcrumbItemProps,
setup(__props) {
const props = __props;
const instance = (0, vue.getCurrentInstance)();
const breadcrumbContext = (0, vue.inject)(breadcrumbKey, void 0);
const ns = useNamespace("breadcrumb");
const router = instance.appContext.config.globalProperties.$router;
const onClick = () => {
if (!props.to || !router) return;
props.replace ? router.replace(props.to) : router.push(props.to);
};
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("item")) }, [(0, vue.createElementVNode)("span", {
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("inner"), (0, vue.unref)(ns).is("link", !!__props.to)]),
role: "link",
onClick
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2), (0, vue.unref)(breadcrumbContext)?.separatorIcon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("separator"))
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(breadcrumbContext).separatorIcon)))]),
_: 1
}, 8, ["class"])) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("separator")),
role: "presentation"
}, (0, vue.toDisplayString)((0, vue.unref)(breadcrumbContext)?.separator), 3))], 2);
};
}
});
//#endregion
//#region ../../packages/components/breadcrumb/src/breadcrumb-item.vue
var breadcrumb_item_default = breadcrumb_item_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/breadcrumb/index.ts
const ElBreadcrumb = withInstall(breadcrumb_default, { BreadcrumbItem: breadcrumb_item_default });
const ElBreadcrumbItem = withNoopInstall(breadcrumb_item_default);
//#endregion
//#region ../../packages/components/button/src/button.ts
const buttonTypes = [
"default",
"primary",
"success",
"warning",
"info",
"danger",
"text",
""
];
const buttonNativeTypes = [
"button",
"submit",
"reset"
];
/**
* @deprecated Removed after 3.0.0, Use `ButtonProps` instead.
*/
const buttonProps = buildProps({
size: useSizeProp,
disabled: {
type: Boolean,
default: void 0
},
type: {
type: String,
values: buttonTypes,
default: ""
},
icon: { type: iconPropType },
nativeType: {
type: String,
values: buttonNativeTypes,
default: "button"
},
loading: Boolean,
loadingIcon: {
type: iconPropType,
default: () => loading_default
},
plain: {
type: Boolean,
default: void 0
},
text: {
type: Boolean,
default: void 0
},
link: Boolean,
bg: Boolean,
autofocus: Boolean,
round: {
type: Boolean,
default: void 0
},
circle: Boolean,
dashed: {
type: Boolean,
default: void 0
},
color: String,
dark: Boolean,
autoInsertSpace: {
type: Boolean,
default: void 0
},
tag: {
type: definePropType([String, Object]),
default: "button"
}
});
const buttonEmits = { click: (evt) => evt instanceof MouseEvent };
//#endregion
//#region ../../packages/components/button/src/constants.ts
const buttonGroupContextKey = Symbol("buttonGroupContextKey");
//#endregion
//#region ../../packages/components/button/src/use-button.ts
const useButton = (props, emit) => {
useDeprecated({
from: "type.text",
replacement: "link",
version: "3.0.0",
scope: "props",
ref: "https://element-plus.org/en-US/component/button.html#button-attributes"
}, (0, vue.computed)(() => props.type === "text"));
const buttonGroupContext = (0, vue.inject)(buttonGroupContextKey, void 0);
const globalConfig = useGlobalConfig("button");
const { form } = useFormItem();
const _size = useFormSize((0, vue.computed)(() => buttonGroupContext?.size));
const _disabled = useFormDisabled();
const _ref = (0, vue.ref)();
const slots = (0, vue.useSlots)();
const _type = (0, vue.computed)(() => props.type || buttonGroupContext?.type || globalConfig.value?.type || "");
const autoInsertSpace = (0, vue.computed)(() => props.autoInsertSpace ?? globalConfig.value?.autoInsertSpace ?? false);
const _plain = (0, vue.computed)(() => props.plain ?? globalConfig.value?.plain ?? false);
const _round = (0, vue.computed)(() => props.round ?? globalConfig.value?.round ?? false);
const _text = (0, vue.computed)(() => props.text ?? globalConfig.value?.text ?? false);
const _dashed = (0, vue.computed)(() => props.dashed ?? globalConfig.value?.dashed ?? false);
const _props = (0, vue.computed)(() => {
if (props.tag === "button") return {
ariaDisabled: _disabled.value || props.loading,
disabled: _disabled.value || props.loading,
autofocus: props.autofocus,
type: props.nativeType
};
return {};
});
const shouldAddSpace = (0, vue.computed)(() => {
const defaultSlot = slots.default?.();
if (autoInsertSpace.value && defaultSlot?.length === 1) {
const slot = defaultSlot[0];
if (slot?.type === vue.Text) {
const text = slot.children;
return /^\p{Unified_Ideograph}{2}$/u.test(text.trim());
}
}
return false;
});
const handleClick = (evt) => {
if (_disabled.value || props.loading) {
evt.stopPropagation();
return;
}
if (props.nativeType === "reset") form?.resetFields();
emit("click", evt);
};
return {
_disabled,
_size,
_type,
_ref,
_props,
_plain,
_round,
_text,
_dashed,
shouldAddSpace,
handleClick
};
};
//#endregion
//#region ../../node_modules/.pnpm/@ctrl+tinycolor@4.2.0/node_modules/@ctrl/tinycolor/dist/module/util.js
/**
* Take input from [0, n] and return it as [0, 1]
* @hidden
*/
function bound01(n, max) {
if (isOnePointZero(n)) n = "100%";
const isPercent = isPercentage(n);
n = max === 360 ? n : Math.min(max, Math.max(0, parseFloat(n)));
if (isPercent) n = parseInt(String(n * max), 10) / 100;
if (Math.abs(n - max) < 1e-6) return 1;
if (max === 360) n = (n < 0 ? n % max + max : n % max) / parseFloat(String(max));
else n = n % max / parseFloat(String(max));
return n;
}
/**
* Force a number between 0 and 1
* @hidden
*/
function clamp01(val) {
return Math.min(1, Math.max(0, val));
}
/**
* Need to handle 1.0 as 100%, since once it is a number, there is no difference between it and 1
* <http://stackoverflow.com/questions/7422072/javascript-how-to-detect-number-as-a-decimal-including-1-0>
* @hidden
*/
function isOnePointZero(n) {
return typeof n === "string" && n.indexOf(".") !== -1 && parseFloat(n) === 1;
}
/**
* Check to see if string passed in is a percentage
* @hidden
*/
function isPercentage(n) {
return typeof n === "string" && n.indexOf("%") !== -1;
}
/**
* Return a valid alpha value [0,1] with all invalid values being set to 1
* @hidden
*/
function boundAlpha(a) {
a = parseFloat(a);
if (isNaN(a) || a < 0 || a > 1) a = 1;
return a;
}
/**
* Replace a decimal with it's percentage value
* @hidden
*/
function convertToPercentage(n) {
if (Number(n) <= 1) return `${Number(n) * 100}%`;
return n;
}
/**
* Force a hex value to have 2 characters
* @hidden
*/
function pad2(c) {
return c.length === 1 ? "0" + c : String(c);
}
//#endregion
//#region ../../node_modules/.pnpm/@ctrl+tinycolor@4.2.0/node_modules/@ctrl/tinycolor/dist/module/conversion.js
/**
* Handle bounds / percentage checking to conform to CSS color spec
* <http://www.w3.org/TR/css3-color/>
* *Assumes:* r, g, b in [0, 255] or [0, 1]
* *Returns:* { r, g, b } in [0, 255]
*/
function rgbToRgb(r, g, b) {
return {
r: bound01(r, 255) * 255,
g: bound01(g, 255) * 255,
b: bound01(b, 255) * 255
};
}
/**
* Converts an RGB color value to HSL.
* *Assumes:* r, g, and b are contained in [0, 255] or [0, 1]
* *Returns:* { h, s, l } in [0,1]
*/
function rgbToHsl(r, g, b) {
r = bound01(r, 255);
g = bound01(g, 255);
b = bound01(b, 255);
const max = Math.max(r, g, b);
const min = Math.min(r, g, b);
let h = 0;
let s = 0;
const l = (max + min) / 2;
if (max === min) {
s = 0;
h = 0;
} else {
const d = max - min;
s = l > .5 ? d / (2 - max - min) : d / (max + min);
switch (max) {
case r:
h = (g - b) / d + (g < b ? 6 : 0);
break;
case g:
h = (b - r) / d + 2;
break;
case b:
h = (r - g) / d + 4;
break;
default: break;
}
h /= 6;
}
return {
h,
s,
l
};
}
function hue2rgb(p, q, t) {
if (t < 0) t += 1;
if (t > 1) t -= 1;
if (t < 1 / 6) return p + (q - p) * (6 * t);
if (t < 1 / 2) return q;
if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;
return p;
}
/**
* Converts an HSL color value to RGB.
*
* *Assumes:* h is contained in [0, 1] or [0, 360] and s and l are contained [0, 1] or [0, 100]
* *Returns:* { r, g, b } in the set [0, 255]
*/
function hslToRgb(h, s, l) {
let r;
let g;
let b;
h = bound01(h, 360);
s = bound01(s, 100);
l = bound01(l, 100);
if (s === 0) {
g = l;
b = l;
r = l;
} else {
const q = l < .5 ? l * (1 + s) : l + s - l * s;
const p = 2 * l - q;
r = hue2rgb(p, q, h + 1 / 3);
g = hue2rgb(p, q, h);
b = hue2rgb(p, q, h - 1 / 3);
}
return {
r: r * 255,
g: g * 255,
b: b * 255
};
}
/**
* Converts an RGB color value to HSV
*
* *Assumes:* r, g, and b are contained in the set [0, 255] or [0, 1]
* *Returns:* { h, s, v } in [0,1]
*/
function rgbToHsv(r, g, b) {
r = bound01(r, 255);
g = bound01(g, 255);
b = bound01(b, 255);
const max = Math.max(r, g, b);
const min = Math.min(r, g, b);
let h = 0;
const v = max;
const d = max - min;
const s = max === 0 ? 0 : d / max;
if (max === min) h = 0;
else {
switch (max) {
case r:
h = (g - b) / d + (g < b ? 6 : 0);
break;
case g:
h = (b - r) / d + 2;
break;
case b:
h = (r - g) / d + 4;
break;
default: break;
}
h /= 6;
}
return {
h,
s,
v
};
}
/**
* Converts an HSV color value to RGB.
*
* *Assumes:* h is contained in [0, 1] or [0, 360] and s and v are contained in [0, 1] or [0, 100]
* *Returns:* { r, g, b } in the set [0, 255]
*/
function hsvToRgb(h, s, v) {
h = bound01(h, 360) * 6;
s = bound01(s, 100);
v = bound01(v, 100);
const i = Math.floor(h);
const f = h - i;
const p = v * (1 - s);
const q = v * (1 - f * s);
const t = v * (1 - (1 - f) * s);
const mod = i % 6;
const r = [
v,
q,
p,
p,
t,
v
][mod];
const g = [
t,
v,
v,
q,
p,
p
][mod];
const b = [
p,
p,
t,
v,
v,
q
][mod];
return {
r: r * 255,
g: g * 255,
b: b * 255
};
}
/**
* Converts an RGB color to hex
*
* *Assumes:* r, g, and b are contained in the set [0, 255]
* *Returns:* a 3 or 6 character hex
*/
function rgbToHex(r, g, b, allow3Char) {
const hex = [
pad2(Math.round(r).toString(16)),
pad2(Math.round(g).toString(16)),
pad2(Math.round(b).toString(16))
];
if (allow3Char && hex[0].startsWith(hex[0].charAt(1)) && hex[1].startsWith(hex[1].charAt(1)) && hex[2].startsWith(hex[2].charAt(1))) return hex[0].charAt(0) + hex[1].charAt(0) + hex[2].charAt(0);
return hex.join("");
}
/**
* Converts an RGBA color plus alpha transparency to hex
*
* *Assumes:* r, g, b are contained in the set [0, 255] and a in [0, 1]
* *Returns:* a 4 or 8 character rgba hex
*/
function rgbaToHex(r, g, b, a, allow4Char) {
const hex = [
pad2(Math.round(r).toString(16)),
pad2(Math.round(g).toString(16)),
pad2(Math.round(b).toString(16)),
pad2(convertDecimalToHex(a))
];
if (allow4Char && hex[0].startsWith(hex[0].charAt(1)) && hex[1].startsWith(hex[1].charAt(1)) && hex[2].startsWith(hex[2].charAt(1)) && hex[3].startsWith(hex[3].charAt(1))) return hex[0].charAt(0) + hex[1].charAt(0) + hex[2].charAt(0) + hex[3].charAt(0);
return hex.join("");
}
/**
* Converts CMYK to RBG
* Assumes c, m, y, k are in the set [0, 100]
*/
function cmykToRgb(c, m, y, k) {
const cConv = c / 100;
const mConv = m / 100;
const yConv = y / 100;
const kConv = k / 100;
return {
r: 255 * (1 - cConv) * (1 - kConv),
g: 255 * (1 - mConv) * (1 - kConv),
b: 255 * (1 - yConv) * (1 - kConv)
};
}
function rgbToCmyk(r, g, b) {
let c = 1 - r / 255;
let m = 1 - g / 255;
let y = 1 - b / 255;
let k = Math.min(c, m, y);
if (k === 1) {
c = 0;
m = 0;
y = 0;
} else {
c = (c - k) / (1 - k) * 100;
m = (m - k) / (1 - k) * 100;
y = (y - k) / (1 - k) * 100;
}
k *= 100;
return {
c: Math.round(c),
m: Math.round(m),
y: Math.round(y),
k: Math.round(k)
};
}
/** Converts a decimal to a hex value */
function convertDecimalToHex(d) {
return Math.round(parseFloat(d) * 255).toString(16);
}
/** Converts a hex value to a decimal */
function convertHexToDecimal(h) {
return parseIntFromHex(h) / 255;
}
/** Parse a base-16 hex value into a base-10 integer */
function parseIntFromHex(val) {
return parseInt(val, 16);
}
function numberInputToObject(color) {
return {
r: color >> 16,
g: (color & 65280) >> 8,
b: color & 255
};
}
//#endregion
//#region ../../node_modules/.pnpm/@ctrl+tinycolor@4.2.0/node_modules/@ctrl/tinycolor/dist/module/css-color-names.js
/**
* @hidden
*/
const names = {
aliceblue: "#f0f8ff",
antiquewhite: "#faebd7",
aqua: "#00ffff",
aquamarine: "#7fffd4",
azure: "#f0ffff",
beige: "#f5f5dc",
bisque: "#ffe4c4",
black: "#000000",
blanchedalmond: "#ffebcd",
blue: "#0000ff",
blueviolet: "#8a2be2",
brown: "#a52a2a",
burlywood: "#deb887",
cadetblue: "#5f9ea0",
chartreuse: "#7fff00",
chocolate: "#d2691e",
coral: "#ff7f50",
cornflowerblue: "#6495ed",
cornsilk: "#fff8dc",
crimson: "#dc143c",
cyan: "#00ffff",
darkblue: "#00008b",
darkcyan: "#008b8b",
darkgoldenrod: "#b8860b",
darkgray: "#a9a9a9",
darkgreen: "#006400",
darkgrey: "#a9a9a9",
darkkhaki: "#bdb76b",
darkmagenta: "#8b008b",
darkolivegreen: "#556b2f",
darkorange: "#ff8c00",
darkorchid: "#9932cc",
darkred: "#8b0000",
darksalmon: "#e9967a",
darkseagreen: "#8fbc8f",
darkslateblue: "#483d8b",
darkslategray: "#2f4f4f",
darkslategrey: "#2f4f4f",
darkturquoise: "#00ced1",
darkviolet: "#9400d3",
deeppink: "#ff1493",
deepskyblue: "#00bfff",
dimgray: "#696969",
dimgrey: "#696969",
dodgerblue: "#1e90ff",
firebrick: "#b22222",
floralwhite: "#fffaf0",
forestgreen: "#228b22",
fuchsia: "#ff00ff",
gainsboro: "#dcdcdc",
ghostwhite: "#f8f8ff",
goldenrod: "#daa520",
gold: "#ffd700",
gray: "#808080",
green: "#008000",
greenyellow: "#adff2f",
grey: "#808080",
honeydew: "#f0fff0",
hotpink: "#ff69b4",
indianred: "#cd5c5c",
indigo: "#4b0082",
ivory: "#fffff0",
khaki: "#f0e68c",
lavenderblush: "#fff0f5",
lavender: "#e6e6fa",
lawngreen: "#7cfc00",
lemonchiffon: "#fffacd",
lightblue: "#add8e6",
lightcoral: "#f08080",
lightcyan: "#e0ffff",
lightgoldenrodyellow: "#fafad2",
lightgray: "#d3d3d3",
lightgreen: "#90ee90",
lightgrey: "#d3d3d3",
lightpink: "#ffb6c1",
lightsalmon: "#ffa07a",
lightseagreen: "#20b2aa",
lightskyblue: "#87cefa",
lightslategray: "#778899",
lightslategrey: "#778899",
lightsteelblue: "#b0c4de",
lightyellow: "#ffffe0",
lime: "#00ff00",
limegreen: "#32cd32",
linen: "#faf0e6",
magenta: "#ff00ff",
maroon: "#800000",
mediumaquamarine: "#66cdaa",
mediumblue: "#0000cd",
mediumorchid: "#ba55d3",
mediumpurple: "#9370db",
mediumseagreen: "#3cb371",
mediumslateblue: "#7b68ee",
mediumspringgreen: "#00fa9a",
mediumturquoise: "#48d1cc",
mediumvioletred: "#c71585",
midnightblue: "#191970",
mintcream: "#f5fffa",
mistyrose: "#ffe4e1",
moccasin: "#ffe4b5",
navajowhite: "#ffdead",
navy: "#000080",
oldlace: "#fdf5e6",
olive: "#808000",
olivedrab: "#6b8e23",
orange: "#ffa500",
orangered: "#ff4500",
orchid: "#da70d6",
palegoldenrod: "#eee8aa",
palegreen: "#98fb98",
paleturquoise: "#afeeee",
palevioletred: "#db7093",
papayawhip: "#ffefd5",
peachpuff: "#ffdab9",
peru: "#cd853f",
pink: "#ffc0cb",
plum: "#dda0dd",
powderblue: "#b0e0e6",
purple: "#800080",
rebeccapurple: "#663399",
red: "#ff0000",
rosybrown: "#bc8f8f",
royalblue: "#4169e1",
saddlebrown: "#8b4513",
salmon: "#fa8072",
sandybrown: "#f4a460",
seagreen: "#2e8b57",
seashell: "#fff5ee",
sienna: "#a0522d",
silver: "#c0c0c0",
skyblue: "#87ceeb",
slateblue: "#6a5acd",
slategray: "#708090",
slategrey: "#708090",
snow: "#fffafa",
springgreen: "#00ff7f",
steelblue: "#4682b4",
tan: "#d2b48c",
teal: "#008080",
thistle: "#d8bfd8",
tomato: "#ff6347",
turquoise: "#40e0d0",
violet: "#ee82ee",
wheat: "#f5deb3",
white: "#ffffff",
whitesmoke: "#f5f5f5",
yellow: "#ffff00",
yellowgreen: "#9acd32"
};
//#endregion
//#region ../../node_modules/.pnpm/@ctrl+tinycolor@4.2.0/node_modules/@ctrl/tinycolor/dist/module/format-input.js
/**
* Given a string or object, convert that input to RGB
*
* Possible string inputs:
* ```
* "red"
* "#f00" or "f00"
* "#ff0000" or "ff0000"
* "#ff000000" or "ff000000"
* "rgb 255 0 0" or "rgb (255, 0, 0)"
* "rgb 1.0 0 0" or "rgb (1, 0, 0)"
* "rgba (255, 0, 0, 1)" or "rgba 255, 0, 0, 1"
* "rgba (1.0, 0, 0, 1)" or "rgba 1.0, 0, 0, 1"
* "hsl(0, 100%, 50%)" or "hsl 0 100% 50%"
* "hsla(0, 100%, 50%, 1)" or "hsla 0 100% 50%, 1"
* "hsv(0, 100%, 100%)" or "hsv 0 100% 100%"
* "cmyk(0, 20, 0, 0)" or "cmyk 0 20 0 0"
* ```
*/
function inputToRGB(color) {
let rgb = {
r: 0,
g: 0,
b: 0
};
let a = 1;
let s = null;
let v = null;
let l = null;
let ok = false;
let format = false;
if (typeof color === "string") color = stringInputToObject(color);
if (typeof color === "object") {
if (isValidCSSUnit(color.r) && isValidCSSUnit(color.g) && isValidCSSUnit(color.b)) {
rgb = rgbToRgb(color.r, color.g, color.b);
ok = true;
format = String(color.r).substr(-1) === "%" ? "prgb" : "rgb";
} else if (isValidCSSUnit(color.h) && isValidCSSUnit(color.s) && isValidCSSUnit(color.v)) {
s = convertToPercentage(color.s);
v = convertToPercentage(color.v);
rgb = hsvToRgb(color.h, s, v);
ok = true;
format = "hsv";
} else if (isValidCSSUnit(color.h) && isValidCSSUnit(color.s) && isValidCSSUnit(color.l)) {
s = convertToPercentage(color.s);
l = convertToPercentage(color.l);
rgb = hslToRgb(color.h, s, l);
ok = true;
format = "hsl";
} else if (isValidCSSUnit(color.c) && isValidCSSUnit(color.m) && isValidCSSUnit(color.y) && isValidCSSUnit(color.k)) {
rgb = cmykToRgb(color.c, color.m, color.y, color.k);
ok = true;
format = "cmyk";
}
if (Object.prototype.hasOwnProperty.call(color, "a")) a = color.a;
}
a = boundAlpha(a);
return {
ok,
format: color.format || format,
r: Math.min(255, Math.max(rgb.r, 0)),
g: Math.min(255, Math.max(rgb.g, 0)),
b: Math.min(255, Math.max(rgb.b, 0)),
a
};
}
const CSS_UNIT = "(?:[-\\+]?\\d*\\.\\d+%?)|(?:[-\\+]?\\d+%?)";
const PERMISSIVE_MATCH3 = "[\\s|\\(]+(" + CSS_UNIT + ")[,|\\s]+((?:[-\\+]?\\d*\\.\\d+%?)|(?:[-\\+]?\\d+%?))[,|\\s]+((?:[-\\+]?\\d*\\.\\d+%?)|(?:[-\\+]?\\d+%?))\\s*\\)?";
const PERMISSIVE_MATCH4 = "[\\s|\\(]+(" + CSS_UNIT + ")[,|\\s]+((?:[-\\+]?\\d*\\.\\d+%?)|(?:[-\\+]?\\d+%?))[,|\\s]+((?:[-\\+]?\\d*\\.\\d+%?)|(?:[-\\+]?\\d+%?))[,|\\s]+((?:[-\\+]?\\d*\\.\\d+%?)|(?:[-\\+]?\\d+%?))\\s*\\)?";
const matchers = {
CSS_UNIT: new RegExp(CSS_UNIT),
rgb: new RegExp("rgb" + PERMISSIVE_MATCH3),
rgba: new RegExp("rgba" + PERMISSIVE_MATCH4),
hsl: new RegExp("hsl" + PERMISSIVE_MATCH3),
hsla: new RegExp("hsla" + PERMISSIVE_MATCH4),
hsv: new RegExp("hsv" + PERMISSIVE_MATCH3),
hsva: new RegExp("hsva" + PERMISSIVE_MATCH4),
cmyk: new RegExp("cmyk" + PERMISSIVE_MATCH4),
hex3: /^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,
hex6: /^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,
hex4: /^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,
hex8: /^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/
};
/**
* Permissive string parsing. Take in a number of formats, and output an object
* based on detected format. Returns `{ r, g, b }` or `{ h, s, l }` or `{ h, s, v}` or `{c, m, y, k}` or `{c, m, y, k, a}`
*/
function stringInputToObject(color) {
color = color.trim().toLowerCase();
if (color.length === 0) return false;
let named = false;
if (names[color]) {
color = names[color];
named = true;
} else if (color === "transparent") return {
r: 0,
g: 0,
b: 0,
a: 0,
format: "name"
};
let match = matchers.rgb.exec(color);
if (match) return {
r: match[1],
g: match[2],
b: match[3]
};
match = matchers.rgba.exec(color);
if (match) return {
r: match[1],
g: match[2],
b: match[3],
a: match[4]
};
match = matchers.hsl.exec(color);
if (match) return {
h: match[1],
s: match[2],
l: match[3]
};
match = matchers.hsla.exec(color);
if (match) return {
h: match[1],
s: match[2],
l: match[3],
a: match[4]
};
match = matchers.hsv.exec(color);
if (match) return {
h: match[1],
s: match[2],
v: match[3]
};
match = matchers.hsva.exec(color);
if (match) return {
h: match[1],
s: match[2],
v: match[3],
a: match[4]
};
match = matchers.cmyk.exec(color);
if (match) return {
c: match[1],
m: match[2],
y: match[3],
k: match[4]
};
match = matchers.hex8.exec(color);
if (match) return {
r: parseIntFromHex(match[1]),
g: parseIntFromHex(match[2]),
b: parseIntFromHex(match[3]),
a: convertHexToDecimal(match[4]),
format: named ? "name" : "hex8"
};
match = matchers.hex6.exec(color);
if (match) return {
r: parseIntFromHex(match[1]),
g: parseIntFromHex(match[2]),
b: parseIntFromHex(match[3]),
format: named ? "name" : "hex"
};
match = matchers.hex4.exec(color);
if (match) return {
r: parseIntFromHex(match[1] + match[1]),
g: parseIntFromHex(match[2] + match[2]),
b: parseIntFromHex(match[3] + match[3]),
a: convertHexToDecimal(match[4] + match[4]),
format: named ? "name" : "hex8"
};
match = matchers.hex3.exec(color);
if (match) return {
r: parseIntFromHex(match[1] + match[1]),
g: parseIntFromHex(match[2] + match[2]),
b: parseIntFromHex(match[3] + match[3]),
format: named ? "name" : "hex"
};
return false;
}
/**
* Check to see if it looks like a CSS unit
* (see `matchers` above for definition).
*/
function isValidCSSUnit(color) {
if (typeof color === "number") return !Number.isNaN(color);
return matchers.CSS_UNIT.test(color);
}
//#endregion
//#region ../../node_modules/.pnpm/@ctrl+tinycolor@4.2.0/node_modules/@ctrl/tinycolor/dist/module/index.js
var TinyColor = class TinyColor {
constructor(color = "", opts = {}) {
if (color instanceof TinyColor) return color;
if (typeof color === "number") color = numberInputToObject(color);
this.originalInput = color;
const rgb = inputToRGB(color);
this.originalInput = color;
this.r = rgb.r;
this.g = rgb.g;
this.b = rgb.b;
this.a = rgb.a;
this.roundA = Math.round(100 * this.a) / 100;
this.format = opts.format ?? rgb.format;
this.gradientType = opts.gradientType;
if (this.r < 1) this.r = Math.round(this.r);
if (this.g < 1) this.g = Math.round(this.g);
if (this.b < 1) this.b = Math.round(this.b);
this.isValid = rgb.ok;
}
isDark() {
return this.getBrightness() < 128;
}
isLight() {
return !this.isDark();
}
/**
* Returns the perceived brightness of the color, from 0-255.
*/
getBrightness() {
const rgb = this.toRgb();
return (rgb.r * 299 + rgb.g * 587 + rgb.b * 114) / 1e3;
}
/**
* Returns the perceived luminance of a color, from 0-1.
*/
getLuminance() {
const rgb = this.toRgb();
let R;
let G;
let B;
const RsRGB = rgb.r / 255;
const GsRGB = rgb.g / 255;
const BsRGB = rgb.b / 255;
if (RsRGB <= .03928) R = RsRGB / 12.92;
else R = Math.pow((RsRGB + .055) / 1.055, 2.4);
if (GsRGB <= .03928) G = GsRGB / 12.92;
else G = Math.pow((GsRGB + .055) / 1.055, 2.4);
if (BsRGB <= .03928) B = BsRGB / 12.92;
else B = Math.pow((BsRGB + .055) / 1.055, 2.4);
return .2126 * R + .7152 * G + .0722 * B;
}
/**
* Returns the alpha value of a color, from 0-1.
*/
getAlpha() {
return this.a;
}
/**
* Sets the alpha value on the current color.
*
* @param alpha - The new alpha value. The accepted range is 0-1.
*/
setAlpha(alpha) {
this.a = boundAlpha(alpha);
this.roundA = Math.round(100 * this.a) / 100;
return this;
}
/**
* Returns whether the color is monochrome.
*/
isMonochrome() {
const { s } = this.toHsl();
return s === 0;
}
/**
* Returns the object as a HSVA object.
*/
toHsv() {
const hsv = rgbToHsv(this.r, this.g, this.b);
return {
h: hsv.h * 360,
s: hsv.s,
v: hsv.v,
a: this.a
};
}
/**
* Returns the hsva values interpolated into a string with the following format:
* "hsva(xxx, xxx, xxx, xx)".
*/
toHsvString() {
const hsv = rgbToHsv(this.r, this.g, this.b);
const h = Math.round(hsv.h * 360);
const s = Math.round(hsv.s * 100);
const v = Math.round(hsv.v * 100);
return this.a === 1 ? `hsv(${h}, ${s}%, ${v}%)` : `hsva(${h}, ${s}%, ${v}%, ${this.roundA})`;
}
/**
* Returns the object as a HSLA object.
*/
toHsl() {
const hsl = rgbToHsl(this.r, this.g, this.b);
return {
h: hsl.h * 360,
s: hsl.s,
l: hsl.l,
a: this.a
};
}
/**
* Returns the hsla values interpolated into a string with the following format:
* "hsla(xxx, xxx, xxx, xx)".
*/
toHslString() {
const hsl = rgbToHsl(this.r, this.g, this.b);
const h = Math.round(hsl.h * 360);
const s = Math.round(hsl.s * 100);
const l = Math.round(hsl.l * 100);
return this.a === 1 ? `hsl(${h}, ${s}%, ${l}%)` : `hsla(${h}, ${s}%, ${l}%, ${this.roundA})`;
}
/**
* Returns the hex value of the color.
* @param allow3Char will shorten hex value to 3 char if possible
*/
toHex(allow3Char = false) {
return rgbToHex(this.r, this.g, this.b, allow3Char);
}
/**
* Returns the hex value of the color -with a # prefixed.
* @param allow3Char will shorten hex value to 3 char if possible
*/
toHexString(allow3Char = false) {
return "#" + this.toHex(allow3Char);
}
/**
* Returns the hex 8 value of the color.
* @param allow4Char will shorten hex value to 4 char if possible
*/
toHex8(allow4Char = false) {
return rgbaToHex(this.r, this.g, this.b, this.a, allow4Char);
}
/**
* Returns the hex 8 value of the color -with a # prefixed.
* @param allow4Char will shorten hex value to 4 char if possible
*/
toHex8String(allow4Char = false) {
return "#" + this.toHex8(allow4Char);
}
/**
* Returns the shorter hex value of the color depends on its alpha -with a # prefixed.
* @param allowShortChar will shorten hex value to 3 or 4 char if possible
*/
toHexShortString(allowShortChar = false) {
return this.a === 1 ? this.toHexString(allowShortChar) : this.toHex8String(allowShortChar);
}
/**
* Returns the object as a RGBA object.
*/
toRgb() {
return {
r: Math.round(this.r),
g: Math.round(this.g),
b: Math.round(this.b),
a: this.a
};
}
/**
* Returns the RGBA values interpolated into a string with the following format:
* "RGBA(xxx, xxx, xxx, xx)".
*/
toRgbString() {
const r = Math.round(this.r);
const g = Math.round(this.g);
const b = Math.round(this.b);
return this.a === 1 ? `rgb(${r}, ${g}, ${b})` : `rgba(${r}, ${g}, ${b}, ${this.roundA})`;
}
/**
* Returns the object as a RGBA object.
*/
toPercentageRgb() {
const fmt = (x) => `${Math.round(bound01(x, 255) * 100)}%`;
return {
r: fmt(this.r),
g: fmt(this.g),
b: fmt(this.b),
a: this.a
};
}
/**
* Returns the RGBA relative values interpolated into a string
*/
toPercentageRgbString() {
const rnd = (x) => Math.round(bound01(x, 255) * 100);
return this.a === 1 ? `rgb(${rnd(this.r)}%, ${rnd(this.g)}%, ${rnd(this.b)}%)` : `rgba(${rnd(this.r)}%, ${rnd(this.g)}%, ${rnd(this.b)}%, ${this.roundA})`;
}
toCmyk() {
return { ...rgbToCmyk(this.r, this.g, this.b) };
}
toCmykString() {
const { c, m, y, k } = rgbToCmyk(this.r, this.g, this.b);
return `cmyk(${c}, ${m}, ${y}, ${k})`;
}
/**
* The 'real' name of the color -if there is one.
*/
toName() {
if (this.a === 0) return "transparent";
if (this.a < 1) return false;
const hex = "#" + rgbToHex(this.r, this.g, this.b, false);
for (const [key, value] of Object.entries(names)) if (hex === value) return key;
return false;
}
toString(format) {
const formatSet = Boolean(format);
format = format ?? this.format;
let formattedString = false;
const hasAlpha = this.a < 1 && this.a >= 0;
if (!formatSet && hasAlpha && (format.startsWith("hex") || format === "name")) {
if (format === "name" && this.a === 0) return this.toName();
return this.toRgbString();
}
if (format === "rgb") formattedString = this.toRgbString();
if (format === "prgb") formattedString = this.toPercentageRgbString();
if (format === "hex" || format === "hex6") formattedString = this.toHexString();
if (format === "hex3") formattedString = this.toHexString(true);
if (format === "hex4") formattedString = this.toHex8String(true);
if (format === "hex8") formattedString = this.toHex8String();
if (format === "name") formattedString = this.toName();
if (format === "hsl") formattedString = this.toHslString();
if (format === "hsv") formattedString = this.toHsvString();
if (format === "cmyk") formattedString = this.toCmykString();
return formattedString || this.toHexString();
}
toNumber() {
return (Math.round(this.r) << 16) + (Math.round(this.g) << 8) + Math.round(this.b);
}
clone() {
return new TinyColor(this.toString());
}
/**
* Lighten the color a given amount. Providing 100 will always return white.
* @param amount - valid between 1-100
*/
lighten(amount = 10) {
const hsl = this.toHsl();
hsl.l += amount / 100;
hsl.l = clamp01(hsl.l);
return new TinyColor(hsl);
}
/**
* Brighten the color a given amount, from 0 to 100.
* @param amount - valid between 1-100
*/
brighten(amount = 10) {
const rgb = this.toRgb();
rgb.r = Math.max(0, Math.min(255, rgb.r - Math.round(255 * -(amount / 100))));
rgb.g = Math.max(0, Math.min(255, rgb.g - Math.round(255 * -(amount / 100))));
rgb.b = Math.max(0, Math.min(255, rgb.b - Math.round(255 * -(amount / 100))));
return new TinyColor(rgb);
}
/**
* Darken the color a given amount, from 0 to 100.
* Providing 100 will always return black.
* @param amount - valid between 1-100
*/
darken(amount = 10) {
const hsl = this.toHsl();
hsl.l -= amount / 100;
hsl.l = clamp01(hsl.l);
return new TinyColor(hsl);
}
/**
* Mix the color with pure white, from 0 to 100.
* Providing 0 will do nothing, providing 100 will always return white.
* @param amount - valid between 1-100
*/
tint(amount = 10) {
return this.mix("white", amount);
}
/**
* Mix the color with pure black, from 0 to 100.
* Providing 0 will do nothing, providing 100 will always return black.
* @param amount - valid between 1-100
*/
shade(amount = 10) {
return this.mix("black", amount);
}
/**
* Desaturate the color a given amount, from 0 to 100.
* Providing 100 will is the same as calling greyscale
* @param amount - valid between 1-100
*/
desaturate(amount = 10) {
const hsl = this.toHsl();
hsl.s -= amount / 100;
hsl.s = clamp01(hsl.s);
return new TinyColor(hsl);
}
/**
* Saturate the color a given amount, from 0 to 100.
* @param amount - valid between 1-100
*/
saturate(amount = 10) {
const hsl = this.toHsl();
hsl.s += amount / 100;
hsl.s = clamp01(hsl.s);
return new TinyColor(hsl);
}
/**
* Completely desaturates a color into greyscale.
* Same as calling `desaturate(100)`
*/
greyscale() {
return this.desaturate(100);
}
/**
* Spin takes a positive or negative amount within [-360, 360] indicating the change of hue.
* Values outside of this range will be wrapped into this range.
*/
spin(amount) {
const hsl = this.toHsl();
const hue = (hsl.h + amount) % 360;
hsl.h = hue < 0 ? 360 + hue : hue;
return new TinyColor(hsl);
}
/**
* Mix the current color a given amount with another color, from 0 to 100.
* 0 means no mixing (return current color).
*/
mix(color, amount = 50) {
const rgb1 = this.toRgb();
const rgb2 = new TinyColor(color).toRgb();
const p = amount / 100;
return new TinyColor({
r: (rgb2.r - rgb1.r) * p + rgb1.r,
g: (rgb2.g - rgb1.g) * p + rgb1.g,
b: (rgb2.b - rgb1.b) * p + rgb1.b,
a: (rgb2.a - rgb1.a) * p + rgb1.a
});
}
analogous(results = 6, slices = 30) {
const hsl = this.toHsl();
const part = 360 / slices;
const ret = [this];
for (hsl.h = (hsl.h - (part * results >> 1) + 720) % 360; --results;) {
hsl.h = (hsl.h + part) % 360;
ret.push(new TinyColor(hsl));
}
return ret;
}
/**
* taken from https://github.com/infusion/jQuery-xcolor/blob/master/jquery.xcolor.js
*/
complement() {
const hsl = this.toHsl();
hsl.h = (hsl.h + 180) % 360;
return new TinyColor(hsl);
}
monochromatic(results = 6) {
const hsv = this.toHsv();
const { h } = hsv;
const { s } = hsv;
let { v } = hsv;
const res = [];
const modification = 1 / results;
while (results--) {
res.push(new TinyColor({
h,
s,
v
}));
v = (v + modification) % 1;
}
return res;
}
splitcomplement() {
const hsl = this.toHsl();
const { h } = hsl;
return [
this,
new TinyColor({
h: (h + 72) % 360,
s: hsl.s,
l: hsl.l
}),
new TinyColor({
h: (h + 216) % 360,
s: hsl.s,
l: hsl.l
})
];
}
/**
* Compute how the color would appear on a background
*/
onBackground(background) {
const fg = this.toRgb();
const bg = new TinyColor(background).toRgb();
const alpha = fg.a + bg.a * (1 - fg.a);
return new TinyColor({
r: (fg.r * fg.a + bg.r * bg.a * (1 - fg.a)) / alpha,
g: (fg.g * fg.a + bg.g * bg.a * (1 - fg.a)) / alpha,
b: (fg.b * fg.a + bg.b * bg.a * (1 - fg.a)) / alpha,
a: alpha
});
}
/**
* Alias for `polyad(3)`
*/
triad() {
return this.polyad(3);
}
/**
* Alias for `polyad(4)`
*/
tetrad() {
return this.polyad(4);
}
/**
* Get polyad colors, like (for 1, 2, 3, 4, 5, 6, 7, 8, etc...)
* monad, dyad, triad, tetrad, pentad, hexad, heptad, octad, etc...
*/
polyad(n) {
const hsl = this.toHsl();
const { h } = hsl;
const result = [this];
const increment = 360 / n;
for (let i = 1; i < n; i++) result.push(new TinyColor({
h: (h + i * increment) % 360,
s: hsl.s,
l: hsl.l
}));
return result;
}
/**
* compare color vs current color
*/
equals(color) {
const comparedColor = new TinyColor(color);
/**
* RGB and CMYK do not have the same color gamut, so a CMYK conversion will never be 100%.
* This means we need to compare CMYK to CMYK to ensure accuracy of the equals function.
*/
if (this.format === "cmyk" || comparedColor.format === "cmyk") return this.toCmykString() === comparedColor.toCmykString();
return this.toRgbString() === comparedColor.toRgbString();
}
};
//#endregion
//#region ../../packages/components/button/src/button-custom.ts
function darken(color, amount = 20) {
return color.mix("#141414", amount).toString();
}
function useButtonCustomStyle(props) {
const _disabled = useFormDisabled();
const ns = useNamespace("button");
return (0, vue.computed)(() => {
let styles = {};
let buttonColor = props.color;
if (buttonColor) {
const match = buttonColor.match(/var\((.*?)\)/);
if (match) buttonColor = window.getComputedStyle(window.document.documentElement).getPropertyValue(match[1]);
const color = new TinyColor(buttonColor);
const activeBgColor = props.dark ? color.tint(20).toString() : darken(color, 20);
if (props.plain) {
styles = ns.cssVarBlock({
"bg-color": props.dark ? darken(color, 90) : color.tint(90).toString(),
"text-color": buttonColor,
"border-color": props.dark ? darken(color, 50) : color.tint(50).toString(),
"hover-text-color": `var(${ns.cssVarName("color-white")})`,
"hover-bg-color": buttonColor,
"hover-border-color": buttonColor,
"active-bg-color": activeBgColor,
"active-text-color": `var(${ns.cssVarName("color-white")})`,
"active-border-color": activeBgColor
});
if (_disabled.value) {
styles[ns.cssVarBlockName("disabled-bg-color")] = props.dark ? darken(color, 90) : color.tint(90).toString();
styles[ns.cssVarBlockName("disabled-text-color")] = props.dark ? darken(color, 50) : color.tint(50).toString();
styles[ns.cssVarBlockName("disabled-border-color")] = props.dark ? darken(color, 80) : color.tint(80).toString();
}
} else if (props.link || props.text) {
const hoverColor = props.dark ? darken(color, 30) : color.tint(30).toString();
styles = ns.cssVarBlock({
"text-color": buttonColor,
"hover-text-color": hoverColor,
"active-text-color": activeBgColor
});
if (props.link) {
styles[ns.cssVarBlockName("hover-link-text-color")] = hoverColor;
styles[ns.cssVarBlockName("active-color")] = activeBgColor;
}
if (_disabled.value) {
const disabledColor = props.dark ? darken(color, 50) : color.tint(50).toString();
styles[ns.cssVarBlockName("disabled-bg-color")] = "transparent";
styles[ns.cssVarBlockName("disabled-text-color")] = disabledColor;
styles[ns.cssVarBlockName("disabled-border-color")] = "transparent";
}
} else {
const hoverBgColor = props.dark ? darken(color, 30) : color.tint(30).toString();
const textColor = color.isDark() ? `var(${ns.cssVarName("color-white")})` : `var(${ns.cssVarName("color-black")})`;
styles = ns.cssVarBlock({
"bg-color": buttonColor,
"text-color": textColor,
"border-color": buttonColor,
"hover-bg-color": hoverBgColor,
"hover-text-color": textColor,
"hover-border-color": hoverBgColor,
"active-bg-color": activeBgColor,
"active-border-color": activeBgColor
});
if (_disabled.value) {
const disabledButtonColor = props.dark ? darken(color, 50) : color.tint(50).toString();
styles[ns.cssVarBlockName("disabled-bg-color")] = disabledButtonColor;
styles[ns.cssVarBlockName("disabled-text-color")] = props.dark ? "rgba(255, 255, 255, 0.5)" : `var(${ns.cssVarName("color-white")})`;
styles[ns.cssVarBlockName("disabled-border-color")] = disabledButtonColor;
}
}
}
return styles;
});
}
//#endregion
//#region ../../packages/components/button/src/button.vue?vue&type=script&setup=true&lang.ts
var button_vue_vue_type_script_setup_true_lang_default$1 = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElButton",
__name: "button",
props: buttonProps,
emits: buttonEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const buttonStyle = useButtonCustomStyle(props);
const ns = useNamespace("button");
const { _ref, _size, _type, _disabled, _props, _plain, _round, _text, _dashed, shouldAddSpace, handleClick } = useButton(props, emit);
const buttonKls = (0, vue.computed)(() => [
ns.b(),
ns.m(_type.value),
ns.m(_size.value),
ns.is("disabled", _disabled.value),
ns.is("loading", props.loading),
ns.is("plain", _plain.value),
ns.is("round", _round.value),
ns.is("circle", props.circle),
ns.is("text", _text.value),
ns.is("dashed", _dashed.value),
ns.is("link", props.link),
ns.is("has-bg", props.bg)
]);
__expose({
ref: _ref,
size: _size,
type: _type,
disabled: _disabled,
shouldAddSpace
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.tag), (0, vue.mergeProps)({
ref_key: "_ref",
ref: _ref
}, (0, vue.unref)(_props), {
class: buttonKls.value,
style: (0, vue.unref)(buttonStyle),
onClick: (0, vue.unref)(handleClick)
}), {
default: (0, vue.withCtx)(() => [__props.loading ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [_ctx.$slots.loading ? (0, vue.renderSlot)(_ctx.$slots, "loading", { key: 0 }) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).is("loading"))
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.loadingIcon)))]),
_: 1
}, 8, ["class"]))], 64)) : __props.icon || _ctx.$slots.icon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), { key: 1 }, {
default: (0, vue.withCtx)(() => [__props.icon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.icon), { key: 0 })) : (0, vue.renderSlot)(_ctx.$slots, "icon", { key: 1 })]),
_: 3
})) : (0, vue.createCommentVNode)("v-if", true), _ctx.$slots.default ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 2,
class: (0, vue.normalizeClass)({ [(0, vue.unref)(ns).em("text", "expand")]: (0, vue.unref)(shouldAddSpace) })
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2)) : (0, vue.createCommentVNode)("v-if", true)]),
_: 3
}, 16, [
"class",
"style",
"onClick"
]);
};
}
});
//#endregion
//#region ../../packages/components/button/src/button.vue
var button_default$1 = button_vue_vue_type_script_setup_true_lang_default$1;
//#endregion
//#region ../../packages/components/button/src/button-group.ts
/**
* @deprecated Removed after 3.0.0, Use `ButtonGroupProps` instead.
*/
const buttonGroupProps = {
size: buttonProps.size,
type: buttonProps.type,
direction: {
type: definePropType(String),
values: ["horizontal", "vertical"],
default: "horizontal"
}
};
//#endregion
//#region ../../packages/components/button/src/button-group.vue?vue&type=script&setup=true&lang.ts
var button_group_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElButtonGroup",
__name: "button-group",
props: buttonGroupProps,
setup(__props) {
const props = __props;
(0, vue.provide)(buttonGroupContextKey, (0, vue.reactive)({
size: (0, vue.toRef)(props, "size"),
type: (0, vue.toRef)(props, "type")
}));
const ns = useNamespace("button");
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).b("group"), (0, vue.unref)(ns).bm("group", props.direction)]) }, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2);
};
}
});
//#endregion
//#region ../../packages/components/button/src/button-group.vue
var button_group_default = button_group_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/button/index.ts
const ElButton = withInstall(button_default$1, { ButtonGroup: button_group_default });
const ElButtonGroup = withNoopInstall(button_group_default);
//#endregion
//#region ../../packages/components/calendar/src/calendar.ts
const isValidRange$1 = (range) => isArray$1(range) && range.length === 2 && range.every((item) => isDate(item));
/**
* @deprecated Removed after 3.0.0, Use `CalendarProps` instead.
*/
const calendarProps = buildProps({
modelValue: { type: Date },
range: {
type: definePropType(Array),
validator: isValidRange$1
},
controllerType: {
type: String,
values: ["button", "select"],
default: "button"
},
formatter: { type: definePropType(Function) }
});
const calendarEmits = {
[UPDATE_MODEL_EVENT]: (value) => isDate(value),
[INPUT_EVENT]: (value) => isDate(value)
};
//#endregion
//#region ../../node_modules/.pnpm/dayjs@1.11.19/node_modules/dayjs/dayjs.min.js
var require_dayjs_min = /* @__PURE__ */ __commonJSMin(((exports, module) => {
(function(t, e) {
"object" == typeof exports && "undefined" != typeof module ? module.exports = e() : "function" == typeof define && define.amd ? define(e) : (t = "undefined" != typeof globalThis ? globalThis : t || self).dayjs = e();
})(exports, (function() {
"use strict";
var t = 1e3, e = 6e4, n = 36e5, r = "millisecond", i = "second", s = "minute", u = "hour", a = "day", o = "week", c = "month", f = "quarter", h = "year", d = "date", l = "Invalid Date", $ = /^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/, y = /\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g, M = {
name: "en",
weekdays: "Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),
months: "January_February_March_April_May_June_July_August_September_October_November_December".split("_"),
ordinal: function(t) {
var e = [
"th",
"st",
"nd",
"rd"
], n = t % 100;
return "[" + t + (e[(n - 20) % 10] || e[n] || e[0]) + "]";
}
}, m = function(t, e, n) {
var r = String(t);
return !r || r.length >= e ? t : "" + Array(e + 1 - r.length).join(n) + t;
}, v = {
s: m,
z: function(t) {
var e = -t.utcOffset(), n = Math.abs(e), r = Math.floor(n / 60), i = n % 60;
return (e <= 0 ? "+" : "-") + m(r, 2, "0") + ":" + m(i, 2, "0");
},
m: function t(e, n) {
if (e.date() < n.date()) return -t(n, e);
var r = 12 * (n.year() - e.year()) + (n.month() - e.month()), i = e.clone().add(r, c), s = n - i < 0, u = e.clone().add(r + (s ? -1 : 1), c);
return +(-(r + (n - i) / (s ? i - u : u - i)) || 0);
},
a: function(t) {
return t < 0 ? Math.ceil(t) || 0 : Math.floor(t);
},
p: function(t) {
return {
M: c,
y: h,
w: o,
d: a,
D: d,
h: u,
m: s,
s: i,
ms: r,
Q: f
}[t] || String(t || "").toLowerCase().replace(/s$/, "");
},
u: function(t) {
return void 0 === t;
}
}, g = "en", D = {};
D[g] = M;
var p = "$isDayjsObject", S = function(t) {
return t instanceof _ || !(!t || !t[p]);
}, w = function t(e, n, r) {
var i;
if (!e) return g;
if ("string" == typeof e) {
var s = e.toLowerCase();
D[s] && (i = s), n && (D[s] = n, i = s);
var u = e.split("-");
if (!i && u.length > 1) return t(u[0]);
} else {
var a = e.name;
D[a] = e, i = a;
}
return !r && i && (g = i), i || !r && g;
}, O = function(t, e) {
if (S(t)) return t.clone();
var n = "object" == typeof e ? e : {};
return n.date = t, n.args = arguments, new _(n);
}, b = v;
b.l = w, b.i = S, b.w = function(t, e) {
return O(t, {
locale: e.$L,
utc: e.$u,
x: e.$x,
$offset: e.$offset
});
};
var _ = function() {
function M(t) {
this.$L = w(t.locale, null, !0), this.parse(t), this.$x = this.$x || t.x || {}, this[p] = !0;
}
var m = M.prototype;
return m.parse = function(t) {
this.$d = function(t) {
var e = t.date, n = t.utc;
if (null === e) return /* @__PURE__ */ new Date(NaN);
if (b.u(e)) return /* @__PURE__ */ new Date();
if (e instanceof Date) return new Date(e);
if ("string" == typeof e && !/Z$/i.test(e)) {
var r = e.match($);
if (r) {
var i = r[2] - 1 || 0, s = (r[7] || "0").substring(0, 3);
return n ? new Date(Date.UTC(r[1], i, r[3] || 1, r[4] || 0, r[5] || 0, r[6] || 0, s)) : new Date(r[1], i, r[3] || 1, r[4] || 0, r[5] || 0, r[6] || 0, s);
}
}
return new Date(e);
}(t), this.init();
}, m.init = function() {
var t = this.$d;
this.$y = t.getFullYear(), this.$M = t.getMonth(), this.$D = t.getDate(), this.$W = t.getDay(), this.$H = t.getHours(), this.$m = t.getMinutes(), this.$s = t.getSeconds(), this.$ms = t.getMilliseconds();
}, m.$utils = function() {
return b;
}, m.isValid = function() {
return !(this.$d.toString() === l);
}, m.isSame = function(t, e) {
var n = O(t);
return this.startOf(e) <= n && n <= this.endOf(e);
}, m.isAfter = function(t, e) {
return O(t) < this.startOf(e);
}, m.isBefore = function(t, e) {
return this.endOf(e) < O(t);
}, m.$g = function(t, e, n) {
return b.u(t) ? this[e] : this.set(n, t);
}, m.unix = function() {
return Math.floor(this.valueOf() / 1e3);
}, m.valueOf = function() {
return this.$d.getTime();
}, m.startOf = function(t, e) {
var n = this, r = !!b.u(e) || e, f = b.p(t), l = function(t, e) {
var i = b.w(n.$u ? Date.UTC(n.$y, e, t) : new Date(n.$y, e, t), n);
return r ? i : i.endOf(a);
}, $ = function(t, e) {
return b.w(n.toDate()[t].apply(n.toDate("s"), (r ? [
0,
0,
0,
0
] : [
23,
59,
59,
999
]).slice(e)), n);
}, y = this.$W, M = this.$M, m = this.$D, v = "set" + (this.$u ? "UTC" : "");
switch (f) {
case h: return r ? l(1, 0) : l(31, 11);
case c: return r ? l(1, M) : l(0, M + 1);
case o:
var g = this.$locale().weekStart || 0, D = (y < g ? y + 7 : y) - g;
return l(r ? m - D : m + (6 - D), M);
case a:
case d: return $(v + "Hours", 0);
case u: return $(v + "Minutes", 1);
case s: return $(v + "Seconds", 2);
case i: return $(v + "Milliseconds", 3);
default: return this.clone();
}
}, m.endOf = function(t) {
return this.startOf(t, !1);
}, m.$set = function(t, e) {
var n, o = b.p(t), f = "set" + (this.$u ? "UTC" : ""), l = (n = {}, n[a] = f + "Date", n[d] = f + "Date", n[c] = f + "Month", n[h] = f + "FullYear", n[u] = f + "Hours", n[s] = f + "Minutes", n[i] = f + "Seconds", n[r] = f + "Milliseconds", n)[o], $ = o === a ? this.$D + (e - this.$W) : e;
if (o === c || o === h) {
var y = this.clone().set(d, 1);
y.$d[l]($), y.init(), this.$d = y.set(d, Math.min(this.$D, y.daysInMonth())).$d;
} else l && this.$d[l]($);
return this.init(), this;
}, m.set = function(t, e) {
return this.clone().$set(t, e);
}, m.get = function(t) {
return this[b.p(t)]();
}, m.add = function(r, f) {
var d, l = this;
r = Number(r);
var $ = b.p(f), y = function(t) {
var e = O(l);
return b.w(e.date(e.date() + Math.round(t * r)), l);
};
if ($ === c) return this.set(c, this.$M + r);
if ($ === h) return this.set(h, this.$y + r);
if ($ === a) return y(1);
if ($ === o) return y(7);
var M = (d = {}, d[s] = e, d[u] = n, d[i] = t, d)[$] || 1, m = this.$d.getTime() + r * M;
return b.w(m, this);
}, m.subtract = function(t, e) {
return this.add(-1 * t, e);
}, m.format = function(t) {
var e = this, n = this.$locale();
if (!this.isValid()) return n.invalidDate || l;
var r = t || "YYYY-MM-DDTHH:mm:ssZ", i = b.z(this), s = this.$H, u = this.$m, a = this.$M, o = n.weekdays, c = n.months, f = n.meridiem, h = function(t, n, i, s) {
return t && (t[n] || t(e, r)) || i[n].slice(0, s);
}, d = function(t) {
return b.s(s % 12 || 12, t, "0");
}, $ = f || function(t, e, n) {
var r = t < 12 ? "AM" : "PM";
return n ? r.toLowerCase() : r;
};
return r.replace(y, (function(t, r) {
return r || function(t) {
switch (t) {
case "YY": return String(e.$y).slice(-2);
case "YYYY": return b.s(e.$y, 4, "0");
case "M": return a + 1;
case "MM": return b.s(a + 1, 2, "0");
case "MMM": return h(n.monthsShort, a, c, 3);
case "MMMM": return h(c, a);
case "D": return e.$D;
case "DD": return b.s(e.$D, 2, "0");
case "d": return String(e.$W);
case "dd": return h(n.weekdaysMin, e.$W, o, 2);
case "ddd": return h(n.weekdaysShort, e.$W, o, 3);
case "dddd": return o[e.$W];
case "H": return String(s);
case "HH": return b.s(s, 2, "0");
case "h": return d(1);
case "hh": return d(2);
case "a": return $(s, u, !0);
case "A": return $(s, u, !1);
case "m": return String(u);
case "mm": return b.s(u, 2, "0");
case "s": return String(e.$s);
case "ss": return b.s(e.$s, 2, "0");
case "SSS": return b.s(e.$ms, 3, "0");
case "Z": return i;
}
return null;
}(t) || i.replace(":", "");
}));
}, m.utcOffset = function() {
return 15 * -Math.round(this.$d.getTimezoneOffset() / 15);
}, m.diff = function(r, d, l) {
var $, y = this, M = b.p(d), m = O(r), v = (m.utcOffset() - this.utcOffset()) * e, g = this - m, D = function() {
return b.m(y, m);
};
switch (M) {
case h:
$ = D() / 12;
break;
case c:
$ = D();
break;
case f:
$ = D() / 3;
break;
case o:
$ = (g - v) / 6048e5;
break;
case a:
$ = (g - v) / 864e5;
break;
case u:
$ = g / n;
break;
case s:
$ = g / e;
break;
case i:
$ = g / t;
break;
default: $ = g;
}
return l ? $ : b.a($);
}, m.daysInMonth = function() {
return this.endOf(c).$D;
}, m.$locale = function() {
return D[this.$L];
}, m.locale = function(t, e) {
if (!t) return this.$L;
var n = this.clone(), r = w(t, e, !0);
return r && (n.$L = r), n;
}, m.clone = function() {
return b.w(this.$d, this);
}, m.toDate = function() {
return new Date(this.valueOf());
}, m.toJSON = function() {
return this.isValid() ? this.toISOString() : null;
}, m.toISOString = function() {
return this.$d.toISOString();
}, m.toString = function() {
return this.$d.toUTCString();
}, M;
}(), k = _.prototype;
return O.prototype = k, [
["$ms", r],
["$s", i],
["$m", s],
["$H", u],
["$W", a],
["$M", c],
["$y", h],
["$D", d]
].forEach((function(t) {
k[t[1]] = function(e) {
return this.$g(e, t[0], t[1]);
};
})), O.extend = function(t, e) {
return t.$i || (t(e, _, O), t.$i = !0), O;
}, O.locale = w, O.isDayjs = S, O.unix = function(t) {
return O(1e3 * t);
}, O.en = D[g], O.Ls = D, O.p = {}, O;
}));
}));
//#endregion
//#region ../../node_modules/.pnpm/dayjs@1.11.19/node_modules/dayjs/plugin/customParseFormat.js
var require_customParseFormat = /* @__PURE__ */ __commonJSMin(((exports, module) => {
(function(e, t) {
"object" == typeof exports && "undefined" != typeof module ? module.exports = t() : "function" == typeof define && define.amd ? define(t) : (e = "undefined" != typeof globalThis ? globalThis : e || self).dayjs_plugin_customParseFormat = t();
})(exports, (function() {
"use strict";
var e = {
LTS: "h:mm:ss A",
LT: "h:mm A",
L: "MM/DD/YYYY",
LL: "MMMM D, YYYY",
LLL: "MMMM D, YYYY h:mm A",
LLLL: "dddd, MMMM D, YYYY h:mm A"
}, t = /(\[[^[]*\])|([-_:/.,()\s]+)|(A|a|Q|YYYY|YY?|ww?|MM?M?M?|Do|DD?|hh?|HH?|mm?|ss?|S{1,3}|z|ZZ?)/g, n = /\d/, r = /\d\d/, i = /\d\d?/, o = /\d*[^-_:/,()\s\d]+/, s = {}, a = function(e) {
return (e = +e) + (e > 68 ? 1900 : 2e3);
};
var f = function(e) {
return function(t) {
this[e] = +t;
};
}, h = [/[+-]\d\d:?(\d\d)?|Z/, function(e) {
(this.zone || (this.zone = {})).offset = function(e) {
if (!e) return 0;
if ("Z" === e) return 0;
var t = e.match(/([+-]|\d\d)/g), n = 60 * t[1] + (+t[2] || 0);
return 0 === n ? 0 : "+" === t[0] ? -n : n;
}(e);
}], u = function(e) {
var t = s[e];
return t && (t.indexOf ? t : t.s.concat(t.f));
}, d = function(e, t) {
var n, r = s.meridiem;
if (r) {
for (var i = 1; i <= 24; i += 1) if (e.indexOf(r(i, 0, t)) > -1) {
n = i > 12;
break;
}
} else n = e === (t ? "pm" : "PM");
return n;
}, c = {
A: [o, function(e) {
this.afternoon = d(e, !1);
}],
a: [o, function(e) {
this.afternoon = d(e, !0);
}],
Q: [n, function(e) {
this.month = 3 * (e - 1) + 1;
}],
S: [n, function(e) {
this.milliseconds = 100 * +e;
}],
SS: [r, function(e) {
this.milliseconds = 10 * +e;
}],
SSS: [/\d{3}/, function(e) {
this.milliseconds = +e;
}],
s: [i, f("seconds")],
ss: [i, f("seconds")],
m: [i, f("minutes")],
mm: [i, f("minutes")],
H: [i, f("hours")],
h: [i, f("hours")],
HH: [i, f("hours")],
hh: [i, f("hours")],
D: [i, f("day")],
DD: [r, f("day")],
Do: [o, function(e) {
var t = s.ordinal;
if (this.day = e.match(/\d+/)[0], t) for (var r = 1; r <= 31; r += 1) t(r).replace(/\[|\]/g, "") === e && (this.day = r);
}],
w: [i, f("week")],
ww: [r, f("week")],
M: [i, f("month")],
MM: [r, f("month")],
MMM: [o, function(e) {
var t = u("months"), n = (u("monthsShort") || t.map((function(e) {
return e.slice(0, 3);
}))).indexOf(e) + 1;
if (n < 1) throw new Error();
this.month = n % 12 || n;
}],
MMMM: [o, function(e) {
var t = u("months").indexOf(e) + 1;
if (t < 1) throw new Error();
this.month = t % 12 || t;
}],
Y: [/[+-]?\d+/, f("year")],
YY: [r, function(e) {
this.year = a(e);
}],
YYYY: [/\d{4}/, f("year")],
Z: h,
ZZ: h
};
function l(n) {
var r = n, i = s && s.formats;
for (var o = (n = r.replace(/(\[[^\]]+])|(LTS?|l{1,4}|L{1,4})/g, (function(t, n, r) {
var o = r && r.toUpperCase();
return n || i[r] || e[r] || i[o].replace(/(\[[^\]]+])|(MMMM|MM|DD|dddd)/g, (function(e, t, n) {
return t || n.slice(1);
}));
}))).match(t), a = o.length, f = 0; f < a; f += 1) {
var h = o[f], u = c[h], d = u && u[0], l = u && u[1];
o[f] = l ? {
regex: d,
parser: l
} : h.replace(/^\[|\]$/g, "");
}
return function(e) {
for (var t = {}, n = 0, r = 0; n < a; n += 1) {
var i = o[n];
if ("string" == typeof i) r += i.length;
else {
var s = i.regex, f = i.parser, h = e.slice(r), u = s.exec(h)[0];
f.call(t, u), e = e.replace(u, "");
}
}
return function(e) {
var t = e.afternoon;
if (void 0 !== t) {
var n = e.hours;
t ? n < 12 && (e.hours += 12) : 12 === n && (e.hours = 0), delete e.afternoon;
}
}(t), t;
};
}
return function(e, t, n) {
n.p.customParseFormat = !0, e && e.parseTwoDigitYear && (a = e.parseTwoDigitYear);
var r = t.prototype, i = r.parse;
r.parse = function(e) {
var t = e.date, r = e.utc, o = e.args;
this.$u = r;
var a = o[1];
if ("string" == typeof a) {
var f = !0 === o[2], h = !0 === o[3], u = f || h, d = o[2];
h && (d = o[2]), s = this.$locale(), !f && d && (s = n.Ls[d]), this.$d = function(e, t, n, r) {
try {
if (["x", "X"].indexOf(t) > -1) return /* @__PURE__ */ new Date(("X" === t ? 1e3 : 1) * e);
var i = l(t)(e), o = i.year, s = i.month, a = i.day, f = i.hours, h = i.minutes, u = i.seconds, d = i.milliseconds, c = i.zone, m = i.week, M = /* @__PURE__ */ new Date(), Y = a || (o || s ? 1 : M.getDate()), p = o || M.getFullYear(), v = 0;
o && !s || (v = s > 0 ? s - 1 : M.getMonth());
var D, w = f || 0, g = h || 0, y = u || 0, L = d || 0;
return c ? new Date(Date.UTC(p, v, Y, w, g, y, L + 60 * c.offset * 1e3)) : n ? new Date(Date.UTC(p, v, Y, w, g, y, L)) : (D = new Date(p, v, Y, w, g, y, L), m && (D = r(D).week(m).toDate()), D);
} catch (e) {
return /* @__PURE__ */ new Date("");
}
}(t, a, r, n), this.init(), d && !0 !== d && (this.$L = this.locale(d).$L), u && t != this.format(a) && (this.$d = /* @__PURE__ */ new Date("")), s = {};
} else if (a instanceof Array) for (var c = a.length, m = 1; m <= c; m += 1) {
o[1] = a[m - 1];
var M = n.apply(this, o);
if (M.isValid()) {
this.$d = M.$d, this.$L = M.$L, this.init();
break;
}
m === c && (this.$d = /* @__PURE__ */ new Date(""));
}
else i.call(this, e);
};
};
}));
}));
//#endregion
//#region ../../packages/components/time-picker/src/constants.ts
var import_customParseFormat = /* @__PURE__ */ __toESM(require_customParseFormat());
var import_dayjs_min = /* @__PURE__ */ __toESM(require_dayjs_min());
const timeUnits = [
"hours",
"minutes",
"seconds"
];
const PICKER_BASE_INJECTION_KEY = "EP_PICKER_BASE";
const PICKER_POPPER_OPTIONS_INJECTION_KEY = "ElPopperOptions";
const ROOT_COMMON_PICKER_INJECTION_KEY = Symbol("commonPickerContextKey");
const DEFAULT_FORMATS_TIME = "HH:mm:ss";
const DEFAULT_FORMATS_DATE = "YYYY-MM-DD";
const DEFAULT_FORMATS_DATEPICKER = {
date: DEFAULT_FORMATS_DATE,
dates: DEFAULT_FORMATS_DATE,
week: "gggg[w]ww",
year: "YYYY",
years: "YYYY",
month: "YYYY-MM",
months: "YYYY-MM",
datetime: `${DEFAULT_FORMATS_DATE} ${DEFAULT_FORMATS_TIME}`,
monthrange: "YYYY-MM",
yearrange: "YYYY",
daterange: DEFAULT_FORMATS_DATE,
datetimerange: `${DEFAULT_FORMATS_DATE} ${DEFAULT_FORMATS_TIME}`
};
//#endregion
//#region ../../packages/components/time-picker/src/utils.ts
const buildTimeList = (value, bound) => {
return [
value > 0 ? value - 1 : void 0,
value,
value < bound ? value + 1 : void 0
];
};
const rangeArr = (n) => Array.from(Array.from({ length: n }).keys());
const extractDateFormat = (format) => {
return format.replace(/\W?m{1,2}|\W?ZZ/g, "").replace(/\W?h{1,2}|\W?s{1,3}|\W?a/gi, "").trim();
};
const extractTimeFormat = (format) => {
return format.replace(/\W?D{1,2}|\W?Do|\W?d{1,4}|\W?M{1,4}|\W?Y{2,4}/g, "").trim();
};
const dateEquals = function(a, b) {
const aIsDate = isDate(a);
const bIsDate = isDate(b);
if (aIsDate && bIsDate) return a.getTime() === b.getTime();
if (!aIsDate && !bIsDate) return a === b;
return false;
};
const valueEquals = function(a, b) {
const aIsArray = isArray$1(a);
const bIsArray = isArray$1(b);
if (aIsArray && bIsArray) {
if (a.length !== b.length) return false;
return a.every((item, index) => dateEquals(item, b[index]));
}
if (!aIsArray && !bIsArray) return dateEquals(a, b);
return false;
};
const parseDate = function(date, format, lang) {
const day = isEmpty(format) || format === "x" ? (0, import_dayjs_min.default)(date).locale(lang) : (0, import_dayjs_min.default)(date, format).locale(lang);
return day.isValid() ? day : void 0;
};
const formatter = function(date, format, lang) {
if (isEmpty(format)) return date;
if (format === "x") return +date;
return (0, import_dayjs_min.default)(date).locale(lang).format(format);
};
const makeList = (total, method) => {
const arr = [];
const disabledArr = method?.();
for (let i = 0; i < total; i++) arr.push(disabledArr?.includes(i) ?? false);
return arr;
};
const dayOrDaysToDate = (dayOrDays) => {
return isArray$1(dayOrDays) ? dayOrDays.map((d) => d.toDate()) : dayOrDays.toDate();
};
//#endregion
//#region ../../packages/components/time-picker/src/composables/use-common-picker.ts
const useCommonPicker = (props, emit) => {
const { lang } = useLocale();
const pickerVisible = (0, vue.ref)(false);
const pickerActualVisible = (0, vue.ref)(false);
const userInput = (0, vue.ref)(null);
const valueIsEmpty = (0, vue.computed)(() => {
const { modelValue } = props;
return !modelValue || isArray$1(modelValue) && !modelValue.filter(Boolean).length;
});
const emitInput = (input) => {
if (!valueEquals(props.modelValue, input)) {
let formatted;
if (isArray$1(input)) formatted = input.map((item) => formatter(item, props.valueFormat, lang.value));
else if (input) formatted = formatter(input, props.valueFormat, lang.value);
emit(UPDATE_MODEL_EVENT, input ? formatted : input, lang.value);
}
};
const parsedValue = (0, vue.computed)(() => {
let dayOrDays;
if (valueIsEmpty.value) {
if (pickerOptions.value.getDefaultValue) dayOrDays = pickerOptions.value.getDefaultValue();
} else if (isArray$1(props.modelValue)) dayOrDays = props.modelValue.map((d) => parseDate(d, props.valueFormat, lang.value));
else dayOrDays = parseDate(props.modelValue ?? "", props.valueFormat, lang.value);
if (pickerOptions.value.getRangeAvailableTime) {
const availableResult = pickerOptions.value.getRangeAvailableTime(dayOrDays);
if (!isEqual$1(availableResult, dayOrDays)) {
dayOrDays = availableResult;
if (!valueIsEmpty.value) emitInput(dayOrDaysToDate(dayOrDays));
}
}
if (isArray$1(dayOrDays) && dayOrDays.some((day) => !day)) dayOrDays = [];
return dayOrDays;
});
const pickerOptions = (0, vue.ref)({});
const onSetPickerOption = (e) => {
pickerOptions.value[e[0]] = e[1];
pickerOptions.value.panelReady = true;
};
const onCalendarChange = (e) => {
emit("calendar-change", e);
};
const onPanelChange = (value, mode, view) => {
emit("panel-change", value, mode, view);
};
const onPick = (date = "", visible = false) => {
pickerVisible.value = visible;
let result;
if (isArray$1(date)) result = date.map((_) => _.toDate());
else result = date ? date.toDate() : date;
userInput.value = null;
emitInput(result);
};
return {
parsedValue,
pickerActualVisible,
pickerOptions,
pickerVisible,
userInput,
valueIsEmpty,
emitInput,
onCalendarChange,
onPanelChange,
onPick,
onSetPickerOption
};
};
//#endregion
//#region ../../packages/components/time-picker/src/props/shared.ts
const disabledTimeListsProps = buildProps({
disabledHours: { type: definePropType(Function) },
disabledMinutes: { type: definePropType(Function) },
disabledSeconds: { type: definePropType(Function) }
});
const timePanelSharedProps = buildProps({
visible: Boolean,
actualVisible: {
type: Boolean,
default: void 0
},
format: {
type: String,
default: ""
}
});
//#endregion
//#region ../../packages/components/time-picker/src/common/props.ts
const timePickerDefaultProps = buildProps({
automaticDropdown: {
type: Boolean,
default: true
},
id: { type: definePropType([Array, String]) },
name: { type: definePropType([Array, String]) },
popperClass: useTooltipContentProps.popperClass,
popperStyle: useTooltipContentProps.popperStyle,
format: String,
valueFormat: String,
dateFormat: String,
timeFormat: String,
type: {
type: String,
default: ""
},
clearable: {
type: Boolean,
default: true
},
clearIcon: {
type: definePropType([String, Object]),
default: circle_close_default
},
editable: {
type: Boolean,
default: true
},
saveOnBlur: {
type: Boolean,
default: true
},
prefixIcon: {
type: definePropType([String, Object]),
default: ""
},
size: useSizeProp,
readonly: Boolean,
disabled: {
type: Boolean,
default: void 0
},
placeholder: {
type: String,
default: ""
},
popperOptions: {
type: definePropType(Object),
default: () => ({})
},
modelValue: {
type: definePropType([
Date,
Array,
String,
Number
]),
default: ""
},
rangeSeparator: {
type: String,
default: "-"
},
startPlaceholder: String,
endPlaceholder: String,
defaultValue: { type: definePropType([Date, Array]) },
defaultTime: { type: definePropType([Date, Array]) },
isRange: Boolean,
...disabledTimeListsProps,
disabledDate: { type: Function },
cellClassName: { type: Function },
shortcuts: {
type: Array,
default: () => []
},
arrowControl: Boolean,
tabindex: {
type: definePropType([String, Number]),
default: 0
},
validateEvent: {
type: Boolean,
default: true
},
unlinkPanels: Boolean,
placement: {
type: definePropType(String),
values: Ee,
default: "bottom"
},
fallbackPlacements: {
type: definePropType(Array),
default: [
"bottom",
"top",
"right",
"left"
]
},
...useEmptyValuesProps,
...useAriaProps(["ariaLabel"]),
showNow: {
type: Boolean,
default: true
},
showConfirm: {
type: Boolean,
default: true
},
showFooter: {
type: Boolean,
default: true
},
showWeekNumber: Boolean
});
const timePickerRangeTriggerProps = buildProps({
id: { type: definePropType(Array) },
name: { type: definePropType(Array) },
modelValue: { type: definePropType([Array, String]) },
startPlaceholder: String,
endPlaceholder: String,
disabled: Boolean
});
/**
* @deprecated Use `timePickerRangeTriggerProps` instead. This will be removed in future versions.
*/
const timePickerRngeTriggerProps = timePickerRangeTriggerProps;
//#endregion
//#region ../../packages/components/time-picker/src/common/picker-range-trigger.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$71 = [
"id",
"name",
"placeholder",
"value",
"disabled"
];
const _hoisted_2$40 = [
"id",
"name",
"placeholder",
"value",
"disabled"
];
var picker_range_trigger_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "PickerRangeTrigger",
inheritAttrs: false,
__name: "picker-range-trigger",
props: timePickerRangeTriggerProps,
emits: [
"mouseenter",
"mouseleave",
"click",
"touchstart",
"focus",
"blur",
"startInput",
"endInput",
"startChange",
"endChange"
],
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const { formItem } = useFormItem();
const { inputId } = useFormItemInputId((0, vue.reactive)({ id: (0, vue.computed)(() => props.id?.[0]) }), { formItemContext: formItem });
const attrs = useAttrs();
const nsDate = useNamespace("date");
const nsRange = useNamespace("range");
const inputRef = (0, vue.ref)();
const endInputRef = (0, vue.ref)();
const { wrapperRef, isFocused } = useFocusController(inputRef, { disabled: (0, vue.computed)(() => props.disabled) });
const handleClick = (evt) => {
emit("click", evt);
};
const handleMouseEnter = (evt) => {
emit("mouseenter", evt);
};
const handleMouseLeave = (evt) => {
emit("mouseleave", evt);
};
const handleTouchStart = (evt) => {
emit("touchstart", evt);
};
const handleStartInput = (evt) => {
emit("startInput", evt);
};
const handleEndInput = (evt) => {
emit("endInput", evt);
};
const handleStartChange = (evt) => {
emit("startChange", evt);
};
const handleEndChange = (evt) => {
emit("endChange", evt);
};
const focus = () => {
inputRef.value?.focus();
};
const blur = () => {
inputRef.value?.blur();
endInputRef.value?.blur();
};
__expose({
focus,
blur
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref_key: "wrapperRef",
ref: wrapperRef,
class: (0, vue.normalizeClass)([(0, vue.unref)(nsDate).is("active", (0, vue.unref)(isFocused)), _ctx.$attrs.class]),
style: (0, vue.normalizeStyle)(_ctx.$attrs.style),
onClick: handleClick,
onMouseenter: handleMouseEnter,
onMouseleave: handleMouseLeave,
onTouchstartPassive: handleTouchStart
}, [
(0, vue.renderSlot)(_ctx.$slots, "prefix"),
(0, vue.createElementVNode)("input", (0, vue.mergeProps)((0, vue.unref)(attrs), {
id: (0, vue.unref)(inputId),
ref_key: "inputRef",
ref: inputRef,
name: _ctx.name && _ctx.name[0],
placeholder: _ctx.startPlaceholder,
value: _ctx.modelValue && _ctx.modelValue[0],
class: (0, vue.unref)(nsRange).b("input"),
disabled: _ctx.disabled,
onInput: handleStartInput,
onChange: handleStartChange
}), null, 16, _hoisted_1$71),
(0, vue.renderSlot)(_ctx.$slots, "range-separator"),
(0, vue.createElementVNode)("input", (0, vue.mergeProps)((0, vue.unref)(attrs), {
id: _ctx.id && _ctx.id[1],
ref_key: "endInputRef",
ref: endInputRef,
name: _ctx.name && _ctx.name[1],
placeholder: _ctx.endPlaceholder,
value: _ctx.modelValue && _ctx.modelValue[1],
class: (0, vue.unref)(nsRange).b("input"),
disabled: _ctx.disabled,
onInput: handleEndInput,
onChange: handleEndChange
}), null, 16, _hoisted_2$40),
(0, vue.renderSlot)(_ctx.$slots, "suffix")
], 38);
};
}
});
//#endregion
//#region ../../packages/components/time-picker/src/common/picker-range-trigger.vue
var picker_range_trigger_default = picker_range_trigger_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/time-picker/src/common/picker.vue?vue&type=script&setup=true&lang.ts
var picker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "Picker",
__name: "picker",
props: timePickerDefaultProps,
emits: [
UPDATE_MODEL_EVENT,
CHANGE_EVENT,
"focus",
"blur",
"clear",
"calendar-change",
"panel-change",
"visible-change",
"keydown"
],
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const attrs = (0, vue.useAttrs)();
const nsDate = useNamespace("date");
const nsInput = useNamespace("input");
const nsRange = useNamespace("range");
const { formItem } = useFormItem();
const elPopperOptions = (0, vue.inject)(PICKER_POPPER_OPTIONS_INJECTION_KEY, {});
const emptyValues = useEmptyValues(props, null);
const refPopper = (0, vue.ref)();
const inputRef = (0, vue.ref)();
const valueOnOpen = (0, vue.ref)(null);
let hasJustTabExitedInput = false;
const pickerDisabled = useFormDisabled();
const commonPicker = useCommonPicker(props, emit);
const { parsedValue, pickerActualVisible, userInput, pickerVisible, pickerOptions, valueIsEmpty, emitInput, onPick, onSetPickerOption, onCalendarChange, onPanelChange } = commonPicker;
const { isFocused, handleFocus, handleBlur } = useFocusController(inputRef, {
disabled: pickerDisabled,
beforeFocus() {
return props.readonly;
},
afterFocus() {
if (!props.automaticDropdown) return;
pickerVisible.value = true;
},
beforeBlur(event) {
return !hasJustTabExitedInput && refPopper.value?.isFocusInsideContent(event);
},
afterBlur() {
if (isTimePicker.value && !props.saveOnBlur) {
if (!valueIsEmpty.value) pickerOptions.value.handleCancel?.();
} else handleChange();
pickerVisible.value = false;
hasJustTabExitedInput = false;
props.validateEvent && formItem?.validate("blur").catch((err) => /* @__PURE__ */ debugWarn(err));
}
});
const hovering = (0, vue.ref)(false);
const rangeInputKls = (0, vue.computed)(() => [
nsDate.b("editor"),
nsDate.bm("editor", props.type),
nsInput.e("wrapper"),
nsDate.is("disabled", pickerDisabled.value),
nsDate.is("active", pickerVisible.value),
nsRange.b("editor"),
pickerSize ? nsRange.bm("editor", pickerSize.value) : "",
attrs.class
]);
const clearIconKls = (0, vue.computed)(() => [
nsInput.e("icon"),
nsRange.e("close-icon"),
!showClearBtn.value ? nsRange.em("close-icon", "hidden") : ""
]);
(0, vue.watch)(pickerVisible, (val) => {
if (!val) {
userInput.value = null;
(0, vue.nextTick)(() => {
emitChange(props.modelValue);
});
} else (0, vue.nextTick)(() => {
if (val) valueOnOpen.value = props.modelValue;
});
});
const emitChange = (val, isClear) => {
if (isClear || !valueEquals(val, valueOnOpen.value)) {
emit(CHANGE_EVENT, val);
isClear && (valueOnOpen.value = val);
props.validateEvent && formItem?.validate("change").catch((err) => /* @__PURE__ */ debugWarn(err));
}
};
const emitKeydown = (e) => {
emit("keydown", e);
};
const refInput = (0, vue.computed)(() => {
if (inputRef.value) return Array.from(inputRef.value.$el.querySelectorAll("input"));
return [];
});
const setSelectionRange = (start, end, pos) => {
const _inputs = refInput.value;
if (!_inputs.length) return;
if (!pos || pos === "min") {
_inputs[0].setSelectionRange(start, end);
_inputs[0].focus();
} else if (pos === "max") {
_inputs[1].setSelectionRange(start, end);
_inputs[1].focus();
}
};
const onBeforeShow = () => {
pickerActualVisible.value = true;
};
const onShow = () => {
emit("visible-change", true);
};
const onHide = () => {
pickerActualVisible.value = false;
pickerVisible.value = false;
emit("visible-change", false);
};
const handleOpen = () => {
pickerVisible.value = true;
};
const handleClose = () => {
pickerVisible.value = false;
};
const displayValue = (0, vue.computed)(() => {
const formattedValue = formatToString(parsedValue.value);
if (isArray$1(userInput.value)) return [userInput.value[0] ?? (formattedValue && formattedValue[0]) ?? "", userInput.value[1] ?? (formattedValue && formattedValue[1]) ?? ""];
else if (userInput.value !== null) return userInput.value;
if (isTimePicker.value && valueIsEmpty.value && !props.saveOnBlur) return "";
if (!isTimePicker.value && valueIsEmpty.value) return "";
if (!pickerVisible.value && valueIsEmpty.value) return "";
if (formattedValue) return isDatesPicker.value || isMonthsPicker.value || isYearsPicker.value ? formattedValue.join(", ") : formattedValue;
return "";
});
const isTimeLikePicker = (0, vue.computed)(() => props.type.includes("time"));
const isTimePicker = (0, vue.computed)(() => props.type.startsWith("time"));
const isDatesPicker = (0, vue.computed)(() => props.type === "dates");
const isMonthsPicker = (0, vue.computed)(() => props.type === "months");
const isYearsPicker = (0, vue.computed)(() => props.type === "years");
const triggerIcon = (0, vue.computed)(() => props.prefixIcon || (isTimeLikePicker.value ? clock_default : calendar_default$1));
const showClearBtn = (0, vue.computed)(() => props.clearable && !pickerDisabled.value && !props.readonly && !valueIsEmpty.value && (hovering.value || isFocused.value));
const onClear = (event) => {
if (props.readonly || pickerDisabled.value) return;
if (showClearBtn.value) {
event?.stopPropagation();
if (pickerOptions.value.handleClear) pickerOptions.value.handleClear();
else emitInput(emptyValues.valueOnClear.value);
emitChange(emptyValues.valueOnClear.value, true);
onHide();
}
emit("clear");
};
const onMouseDownInput = async (event) => {
if (props.readonly || pickerDisabled.value) return;
if (event.target?.tagName !== "INPUT" || isFocused.value || !props.automaticDropdown) pickerVisible.value = true;
};
const onMouseEnter = () => {
if (props.readonly || pickerDisabled.value) return;
if (!valueIsEmpty.value && props.clearable) hovering.value = true;
};
const onMouseLeave = () => {
hovering.value = false;
};
const onTouchStartInput = (event) => {
if (props.readonly || pickerDisabled.value) return;
if (event.touches[0].target?.tagName !== "INPUT" || isFocused.value || !props.automaticDropdown) pickerVisible.value = true;
};
const isRangeInput = (0, vue.computed)(() => {
return props.type.includes("range");
});
const pickerSize = useFormSize();
const popperEl = (0, vue.computed)(() => (0, vue.unref)(refPopper)?.popperRef?.contentRef);
const stophandle = onClickOutside(inputRef, (e) => {
const unrefedPopperEl = (0, vue.unref)(popperEl);
const inputEl = unrefElement(inputRef);
if (unrefedPopperEl && (e.target === unrefedPopperEl || e.composedPath().includes(unrefedPopperEl)) || e.target === inputEl || inputEl && e.composedPath().includes(inputEl)) return;
pickerVisible.value = false;
});
(0, vue.onBeforeUnmount)(() => {
stophandle?.();
});
const handleChange = () => {
if (isTimePicker.value && !props.saveOnBlur) return;
const isRangeEmpty = isArray$1(userInput.value) && userInput.value.every((v) => v === "");
if (userInput.value && !isRangeEmpty) {
const value = parseUserInputToDayjs(displayValue.value);
if (value) {
if (isValidValue(value)) emitInput(dayOrDaysToDate(value));
userInput.value = null;
}
}
if (userInput.value === "" || isRangeEmpty) {
emitInput(emptyValues.valueOnClear.value);
emitChange(emptyValues.valueOnClear.value, true);
userInput.value = null;
}
};
const parseUserInputToDayjs = (value) => {
if (!value) return null;
return pickerOptions.value.parseUserInput(value);
};
const formatToString = (value) => {
if (!value) return null;
return isArray$1(value) ? value.map((_) => _.format(props.format)) : value.format(props.format);
};
const isValidValue = (value) => {
return pickerOptions.value.isValidValue(value);
};
const handleKeydownInput = async (event) => {
if (props.readonly || pickerDisabled.value) return;
const code = getEventCode(event);
emitKeydown(event);
if (code === EVENT_CODE.esc) {
if (pickerVisible.value === true) {
pickerVisible.value = false;
event.preventDefault();
event.stopPropagation();
}
return;
}
if (code === EVENT_CODE.down) {
if (pickerOptions.value.handleFocusPicker) {
event.preventDefault();
event.stopPropagation();
}
if (pickerVisible.value === false) {
pickerVisible.value = true;
await (0, vue.nextTick)();
}
if (pickerOptions.value.handleFocusPicker) {
pickerOptions.value.handleFocusPicker();
return;
}
}
if (code === EVENT_CODE.tab) {
hasJustTabExitedInput = true;
return;
}
if (code === EVENT_CODE.enter || code === EVENT_CODE.numpadEnter) {
if (!pickerVisible.value) pickerVisible.value = true;
else if (userInput.value === null || userInput.value === "" || isValidValue(parseUserInputToDayjs(displayValue.value))) {
handleChange();
pickerVisible.value = false;
}
event.preventDefault();
event.stopPropagation();
return;
}
if (userInput.value) {
event.stopPropagation();
return;
}
if (pickerOptions.value.handleKeydownInput) pickerOptions.value.handleKeydownInput(event);
};
const onUserInput = (e) => {
userInput.value = e;
if (!pickerVisible.value) pickerVisible.value = true;
};
const handleStartInput = (event) => {
const target = event.target;
if (userInput.value) userInput.value = [target.value, userInput.value[1]];
else userInput.value = [target.value, null];
};
const handleEndInput = (event) => {
const target = event.target;
if (userInput.value) userInput.value = [userInput.value[0], target.value];
else userInput.value = [null, target.value];
};
const handleStartChange = () => {
const values = userInput.value;
const value = parseUserInputToDayjs(values && values[0]);
const parsedVal = (0, vue.unref)(parsedValue);
if (value && value.isValid()) {
userInput.value = [formatToString(value), displayValue.value?.[1] || null];
const newValue = [value, parsedVal && (parsedVal[1] || null)];
if (isValidValue(newValue)) {
emitInput(dayOrDaysToDate(newValue));
userInput.value = null;
}
}
};
const handleEndChange = () => {
const values = (0, vue.unref)(userInput);
const value = parseUserInputToDayjs(values && values[1]);
const parsedVal = (0, vue.unref)(parsedValue);
if (value && value.isValid()) {
userInput.value = [(0, vue.unref)(displayValue)?.[0] || null, formatToString(value)];
const newValue = [parsedVal && parsedVal[0], value];
if (isValidValue(newValue)) {
emitInput(dayOrDaysToDate(newValue));
userInput.value = null;
}
}
};
const focus = () => {
inputRef.value?.focus();
};
const blur = () => {
inputRef.value?.blur();
};
(0, vue.provide)(PICKER_BASE_INJECTION_KEY, {
props,
emptyValues
});
(0, vue.provide)(ROOT_COMMON_PICKER_INJECTION_KEY, commonPicker);
__expose({
focus,
blur,
handleOpen,
handleClose,
onPick
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElTooltip), (0, vue.mergeProps)({
ref_key: "refPopper",
ref: refPopper,
visible: (0, vue.unref)(pickerVisible),
effect: "light",
pure: "",
trigger: "click"
}, _ctx.$attrs, {
role: "dialog",
teleported: "",
transition: `${(0, vue.unref)(nsDate).namespace.value}-zoom-in-top`,
"popper-class": [`${(0, vue.unref)(nsDate).namespace.value}-picker__popper`, _ctx.popperClass],
"popper-style": _ctx.popperStyle,
"popper-options": (0, vue.unref)(elPopperOptions),
"fallback-placements": _ctx.fallbackPlacements,
"gpu-acceleration": false,
placement: _ctx.placement,
"stop-popper-mouse-event": false,
"hide-after": 0,
persistent: "",
onBeforeShow,
onShow,
onHide
}), {
default: (0, vue.withCtx)(() => [!isRangeInput.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElInput), {
key: 0,
id: _ctx.id,
ref_key: "inputRef",
ref: inputRef,
"container-role": "combobox",
"model-value": displayValue.value,
name: _ctx.name,
size: (0, vue.unref)(pickerSize),
disabled: (0, vue.unref)(pickerDisabled),
placeholder: _ctx.placeholder,
class: (0, vue.normalizeClass)([
(0, vue.unref)(nsDate).b("editor"),
(0, vue.unref)(nsDate).bm("editor", _ctx.type),
(0, vue.unref)(nsDate).is("focus", (0, vue.unref)(pickerVisible)),
_ctx.$attrs.class
]),
style: (0, vue.normalizeStyle)(_ctx.$attrs.style),
readonly: !_ctx.editable || _ctx.readonly || isDatesPicker.value || isMonthsPicker.value || isYearsPicker.value || _ctx.type === "week",
"aria-label": _ctx.ariaLabel,
tabindex: _ctx.tabindex,
"validate-event": false,
onInput: onUserInput,
onFocus: (0, vue.unref)(handleFocus),
onBlur: (0, vue.unref)(handleBlur),
onKeydown: handleKeydownInput,
onChange: handleChange,
onMousedown: onMouseDownInput,
onMouseenter: onMouseEnter,
onMouseleave: onMouseLeave,
onTouchstartPassive: onTouchStartInput,
onClick: _cache[0] || (_cache[0] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, {
prefix: (0, vue.withCtx)(() => [triggerIcon.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(nsInput).e("icon")),
onMousedown: (0, vue.withModifiers)(onMouseDownInput, ["prevent"]),
onTouchstartPassive: onTouchStartInput
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(triggerIcon.value)))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true)]),
suffix: (0, vue.withCtx)(() => [showClearBtn.value && _ctx.clearIcon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)(`${(0, vue.unref)(nsInput).e("icon")} clear-icon`),
onMousedown: (0, vue.withModifiers)((0, vue.unref)(NOOP), ["prevent"]),
onClick: onClear
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(_ctx.clearIcon)))]),
_: 1
}, 8, ["class", "onMousedown"])) : (0, vue.createCommentVNode)("v-if", true)]),
_: 1
}, 8, [
"id",
"model-value",
"name",
"size",
"disabled",
"placeholder",
"class",
"style",
"readonly",
"aria-label",
"tabindex",
"onFocus",
"onBlur"
])) : ((0, vue.openBlock)(), (0, vue.createBlock)(picker_range_trigger_default, {
key: 1,
id: _ctx.id,
ref_key: "inputRef",
ref: inputRef,
"model-value": displayValue.value,
name: _ctx.name,
disabled: (0, vue.unref)(pickerDisabled),
readonly: !_ctx.editable || _ctx.readonly,
"start-placeholder": _ctx.startPlaceholder,
"end-placeholder": _ctx.endPlaceholder,
class: (0, vue.normalizeClass)(rangeInputKls.value),
style: (0, vue.normalizeStyle)(_ctx.$attrs.style),
"aria-label": _ctx.ariaLabel,
tabindex: _ctx.tabindex,
autocomplete: "off",
role: "combobox",
onClick: onMouseDownInput,
onFocus: (0, vue.unref)(handleFocus),
onBlur: (0, vue.unref)(handleBlur),
onStartInput: handleStartInput,
onStartChange: handleStartChange,
onEndInput: handleEndInput,
onEndChange: handleEndChange,
onMousedown: onMouseDownInput,
onMouseenter: onMouseEnter,
onMouseleave: onMouseLeave,
onTouchstartPassive: onTouchStartInput,
onKeydown: handleKeydownInput
}, {
prefix: (0, vue.withCtx)(() => [triggerIcon.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)([(0, vue.unref)(nsInput).e("icon"), (0, vue.unref)(nsRange).e("icon")])
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(triggerIcon.value)))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true)]),
"range-separator": (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "range-separator", {}, () => [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(nsRange).b("separator")) }, (0, vue.toDisplayString)(_ctx.rangeSeparator), 3)])]),
suffix: (0, vue.withCtx)(() => [_ctx.clearIcon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)(clearIconKls.value),
onMousedown: (0, vue.withModifiers)((0, vue.unref)(NOOP), ["prevent"]),
onClick: onClear
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(_ctx.clearIcon)))]),
_: 1
}, 8, ["class", "onMousedown"])) : (0, vue.createCommentVNode)("v-if", true)]),
_: 3
}, 8, [
"id",
"model-value",
"name",
"disabled",
"readonly",
"start-placeholder",
"end-placeholder",
"class",
"style",
"aria-label",
"tabindex",
"onFocus",
"onBlur"
]))]),
content: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default", {
visible: (0, vue.unref)(pickerVisible),
actualVisible: (0, vue.unref)(pickerActualVisible),
parsedValue: (0, vue.unref)(parsedValue),
format: _ctx.format,
dateFormat: _ctx.dateFormat,
timeFormat: _ctx.timeFormat,
unlinkPanels: _ctx.unlinkPanels,
type: _ctx.type,
defaultValue: _ctx.defaultValue,
showNow: _ctx.showNow,
showConfirm: _ctx.showConfirm,
showFooter: _ctx.showFooter,
showWeekNumber: _ctx.showWeekNumber,
onPick: _cache[1] || (_cache[1] = (...args) => (0, vue.unref)(onPick) && (0, vue.unref)(onPick)(...args)),
onSelectRange: setSelectionRange,
onSetPickerOption: _cache[2] || (_cache[2] = (...args) => (0, vue.unref)(onSetPickerOption) && (0, vue.unref)(onSetPickerOption)(...args)),
onCalendarChange: _cache[3] || (_cache[3] = (...args) => (0, vue.unref)(onCalendarChange) && (0, vue.unref)(onCalendarChange)(...args)),
onClear,
onPanelChange: _cache[4] || (_cache[4] = (...args) => (0, vue.unref)(onPanelChange) && (0, vue.unref)(onPanelChange)(...args)),
onMousedown: _cache[5] || (_cache[5] = (0, vue.withModifiers)(() => {}, ["stop"]))
})]),
_: 3
}, 16, [
"visible",
"transition",
"popper-class",
"popper-style",
"popper-options",
"fallback-placements",
"placement"
]);
};
}
});
//#endregion
//#region ../../packages/components/time-picker/src/common/picker.vue
var picker_default = picker_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/time-picker/src/props/panel-time-picker.ts
const panelTimePickerProps = buildProps({
...timePanelSharedProps,
datetimeRole: String,
parsedValue: { type: definePropType(Object) }
});
//#endregion
//#region ../../packages/components/time-picker/src/composables/use-time-panel.ts
const useTimePanel = ({ getAvailableHours, getAvailableMinutes, getAvailableSeconds }) => {
const getAvailableTime = (date, role, first, compareDate) => {
const availableTimeGetters = {
hour: getAvailableHours,
minute: getAvailableMinutes,
second: getAvailableSeconds
};
let result = date;
[
"hour",
"minute",
"second"
].forEach((type) => {
if (availableTimeGetters[type]) {
let availableTimeSlots;
const method = availableTimeGetters[type];
switch (type) {
case "minute":
availableTimeSlots = method(result.hour(), role, compareDate);
break;
case "second":
availableTimeSlots = method(result.hour(), result.minute(), role, compareDate);
break;
default:
availableTimeSlots = method(role, compareDate);
break;
}
if (availableTimeSlots?.length && !availableTimeSlots.includes(result[type]())) {
const pos = first ? 0 : availableTimeSlots.length - 1;
result = result[type](availableTimeSlots[pos]);
}
}
});
return result;
};
const timePickerOptions = {};
const onSetOption = ([key, val]) => {
timePickerOptions[key] = val;
};
return {
timePickerOptions,
getAvailableTime,
onSetOption
};
};
//#endregion
//#region ../../packages/components/time-picker/src/composables/use-time-picker.ts
const makeAvailableArr = (disabledList) => {
const trueOrNumber = (isDisabled, index) => isDisabled || index;
const getNumber = (predicate) => predicate !== true;
return disabledList.map(trueOrNumber).filter(getNumber);
};
const getTimeLists = (disabledHours, disabledMinutes, disabledSeconds) => {
const getHoursList = (role, compare) => {
return makeList(24, disabledHours && (() => disabledHours?.(role, compare)));
};
const getMinutesList = (hour, role, compare) => {
return makeList(60, disabledMinutes && (() => disabledMinutes?.(hour, role, compare)));
};
const getSecondsList = (hour, minute, role, compare) => {
return makeList(60, disabledSeconds && (() => disabledSeconds?.(hour, minute, role, compare)));
};
return {
getHoursList,
getMinutesList,
getSecondsList
};
};
const buildAvailableTimeSlotGetter = (disabledHours, disabledMinutes, disabledSeconds) => {
const { getHoursList, getMinutesList, getSecondsList } = getTimeLists(disabledHours, disabledMinutes, disabledSeconds);
const getAvailableHours = (role, compare) => {
return makeAvailableArr(getHoursList(role, compare));
};
const getAvailableMinutes = (hour, role, compare) => {
return makeAvailableArr(getMinutesList(hour, role, compare));
};
const getAvailableSeconds = (hour, minute, role, compare) => {
return makeAvailableArr(getSecondsList(hour, minute, role, compare));
};
return {
getAvailableHours,
getAvailableMinutes,
getAvailableSeconds
};
};
const useOldValue = (props, options) => {
const oldValue = (0, vue.ref)(props.parsedValue);
(0, vue.watch)(() => props.visible, (val) => {
const modelValue = (0, vue.toValue)(options.modelValue);
const valueOnClear = (0, vue.toValue)(options.valueOnClear);
if (val && modelValue === valueOnClear) {
oldValue.value = valueOnClear;
return;
}
if (!val) oldValue.value = props.parsedValue;
});
return oldValue;
};
//#endregion
//#region ../../packages/directives/click-outside/index.ts
const nodeList = /* @__PURE__ */ new Map();
if (isClient) {
let startClick;
document.addEventListener("mousedown", (e) => startClick = e);
document.addEventListener("mouseup", (e) => {
if (startClick) {
for (const handlers of nodeList.values()) for (const { documentHandler } of handlers) documentHandler(e, startClick);
startClick = void 0;
}
});
}
function createDocumentHandler(el, binding) {
let excludes = [];
if (isArray$1(binding.arg)) excludes = binding.arg;
else if (isElement$1(binding.arg)) excludes.push(binding.arg);
return function(mouseup, mousedown) {
const popperRef = binding.instance.popperRef;
const mouseUpTarget = mouseup.target;
const mouseDownTarget = mousedown?.target;
const isBound = !binding || !binding.instance;
const isTargetExists = !mouseUpTarget || !mouseDownTarget;
const isContainedByEl = el.contains(mouseUpTarget) || el.contains(mouseDownTarget);
const isSelf = el === mouseUpTarget;
const isTargetExcluded = excludes.length && excludes.some((item) => item?.contains(mouseUpTarget)) || excludes.length && excludes.includes(mouseDownTarget);
const isContainedByPopper = popperRef && (popperRef.contains(mouseUpTarget) || popperRef.contains(mouseDownTarget));
if (isBound || isTargetExists || isContainedByEl || isSelf || isTargetExcluded || isContainedByPopper) return;
binding.value(mouseup, mousedown);
};
}
const ClickOutside = {
beforeMount(el, binding) {
if (!nodeList.has(el)) nodeList.set(el, []);
nodeList.get(el).push({
documentHandler: createDocumentHandler(el, binding),
bindingFn: binding.value
});
},
updated(el, binding) {
if (!nodeList.has(el)) nodeList.set(el, []);
const handlers = nodeList.get(el);
const oldHandlerIndex = handlers.findIndex((item) => item.bindingFn === binding.oldValue);
const newHandler = {
documentHandler: createDocumentHandler(el, binding),
bindingFn: binding.value
};
if (oldHandlerIndex >= 0) handlers.splice(oldHandlerIndex, 1, newHandler);
else handlers.push(newHandler);
},
unmounted(el) {
nodeList.delete(el);
}
};
//#endregion
//#region ../../packages/directives/repeat-click/index.ts
const REPEAT_INTERVAL = 100;
const REPEAT_DELAY = 600;
const SCOPE$6 = "_RepeatClick";
const vRepeatClick = {
beforeMount(el, binding) {
const value = binding.value;
const { interval = REPEAT_INTERVAL, delay = REPEAT_DELAY } = isFunction$1(value) ? {} : value;
let intervalId;
let delayId;
const handler = () => isFunction$1(value) ? value() : value.handler();
const clear = () => {
if (delayId) {
clearTimeout(delayId);
delayId = void 0;
}
if (intervalId) {
clearInterval(intervalId);
intervalId = void 0;
}
};
const start = (evt) => {
if (evt.button !== 0) return;
clear();
handler();
document.addEventListener("mouseup", clear, { once: true });
delayId = setTimeout(() => {
intervalId = setInterval(() => {
handler();
}, interval);
}, delay);
};
el[SCOPE$6] = {
start,
clear
};
el.addEventListener("mousedown", start);
},
unmounted(el) {
if (!el[SCOPE$6]) return;
const { start, clear } = el[SCOPE$6];
if (start) el.removeEventListener("mousedown", start);
if (clear) {
clear();
document.removeEventListener("mouseup", clear);
}
el[SCOPE$6] = null;
}
};
//#endregion
//#region ../../packages/directives/trap-focus/index.ts
const FOCUSABLE_CHILDREN = "_trap-focus-children";
const FOCUS_STACK = [];
const FOCUS_HANDLER = (e) => {
if (FOCUS_STACK.length === 0) return;
const code = getEventCode(e);
const focusableElement = FOCUS_STACK[FOCUS_STACK.length - 1][FOCUSABLE_CHILDREN];
if (focusableElement.length > 0 && code === EVENT_CODE.tab) {
if (focusableElement.length === 1) {
e.preventDefault();
if (document.activeElement !== focusableElement[0]) focusableElement[0].focus();
return;
}
const goingBackward = e.shiftKey;
const isFirst = e.target === focusableElement[0];
const isLast = e.target === focusableElement[focusableElement.length - 1];
if (isFirst && goingBackward) {
e.preventDefault();
focusableElement[focusableElement.length - 1].focus();
}
if (isLast && !goingBackward) {
e.preventDefault();
focusableElement[0].focus();
}
}
};
const TrapFocus = {
beforeMount(el) {
el[FOCUSABLE_CHILDREN] = obtainAllFocusableElements$1(el);
FOCUS_STACK.push(el);
if (FOCUS_STACK.length <= 1) document.addEventListener("keydown", FOCUS_HANDLER);
},
updated(el) {
(0, vue.nextTick)(() => {
el[FOCUSABLE_CHILDREN] = obtainAllFocusableElements$1(el);
});
},
unmounted() {
FOCUS_STACK.shift();
if (FOCUS_STACK.length === 0) document.removeEventListener("keydown", FOCUS_HANDLER);
}
};
//#endregion
//#region ../../node_modules/.pnpm/normalize-wheel-es@1.2.0/node_modules/normalize-wheel-es/dist/index.mjs
var v = !1, o, f, s, u, d, N, l, p, m, w, D, x, E, M, F;
function a() {
if (!v) {
v = !0;
var e = navigator.userAgent, n = /(?:MSIE.(\d+\.\d+))|(?:(?:Firefox|GranParadiso|Iceweasel).(\d+\.\d+))|(?:Opera(?:.+Version.|.)(\d+\.\d+))|(?:AppleWebKit.(\d+(?:\.\d+)?))|(?:Trident\/\d+\.\d+.*rv:(\d+\.\d+))/.exec(e), i = /(Mac OS X)|(Windows)|(Linux)/.exec(e);
if (x = /\b(iPhone|iP[ao]d)/.exec(e), E = /\b(iP[ao]d)/.exec(e), w = /Android/i.exec(e), M = /FBAN\/\w+;/i.exec(e), F = /Mobile/i.exec(e), D = !!/Win64/.exec(e), n) {
o = n[1] ? parseFloat(n[1]) : n[5] ? parseFloat(n[5]) : NaN, o && document && document.documentMode && (o = document.documentMode);
var r = /(?:Trident\/(\d+.\d+))/.exec(e);
N = r ? parseFloat(r[1]) + 4 : o, f = n[2] ? parseFloat(n[2]) : NaN, s = n[3] ? parseFloat(n[3]) : NaN, u = n[4] ? parseFloat(n[4]) : NaN, u ? (n = /(?:Chrome\/(\d+\.\d+))/.exec(e), d = n && n[1] ? parseFloat(n[1]) : NaN) : d = NaN;
} else o = f = s = d = u = NaN;
if (i) {
if (i[1]) {
var t = /(?:Mac OS X (\d+(?:[._]\d+)?))/.exec(e);
l = t ? parseFloat(t[1].replace("_", ".")) : !0;
} else l = !1;
p = !!i[2], m = !!i[3];
} else l = p = m = !1;
}
}
var _ = {
ie: function() {
return a() || o;
},
ieCompatibilityMode: function() {
return a() || N > o;
},
ie64: function() {
return _.ie() && D;
},
firefox: function() {
return a() || f;
},
opera: function() {
return a() || s;
},
webkit: function() {
return a() || u;
},
safari: function() {
return _.webkit();
},
chrome: function() {
return a() || d;
},
windows: function() {
return a() || p;
},
osx: function() {
return a() || l;
},
linux: function() {
return a() || m;
},
iphone: function() {
return a() || x;
},
mobile: function() {
return a() || x || E || w || F;
},
nativeApp: function() {
return a() || M;
},
android: function() {
return a() || w;
},
ipad: function() {
return a() || E;
}
}, A = _;
var c = !!(typeof window < "u" && window.document && window.document.createElement), h$26 = {
canUseDOM: c,
canUseWorkers: typeof Worker < "u",
canUseEventListeners: c && !!(window.addEventListener || window.attachEvent),
canUseViewport: c && !!window.screen,
isInWorker: !c
};
var X;
h$26.canUseDOM && (X = document.implementation && document.implementation.hasFeature && document.implementation.hasFeature("", "") !== !0);
function S(e, n) {
if (!h$26.canUseDOM || n && !("addEventListener" in document)) return !1;
var i = "on" + e, r = i in document;
if (!r) {
var t = document.createElement("div");
t.setAttribute(i, "return;"), r = typeof t[i] == "function";
}
return !r && X && e === "wheel" && (r = document.implementation.hasFeature("Events.wheel", "3.0")), r;
}
var b = S;
var O = 10, I = 40, P = 800;
function T(e) {
var n = 0, i = 0, r = 0, t = 0;
return "detail" in e && (i = e.detail), "wheelDelta" in e && (i = -e.wheelDelta / 120), "wheelDeltaY" in e && (i = -e.wheelDeltaY / 120), "wheelDeltaX" in e && (n = -e.wheelDeltaX / 120), "axis" in e && e.axis === e.HORIZONTAL_AXIS && (n = i, i = 0), r = n * O, t = i * O, "deltaY" in e && (t = e.deltaY), "deltaX" in e && (r = e.deltaX), (r || t) && e.deltaMode && (e.deltaMode == 1 ? (r *= I, t *= I) : (r *= P, t *= P)), r && !n && (n = r < 1 ? -1 : 1), t && !i && (i = t < 1 ? -1 : 1), {
spinX: n,
spinY: i,
pixelX: r,
pixelY: t
};
}
T.getEventType = function() {
return A.firefox() ? "DOMMouseScroll" : b("wheel") ? "wheel" : "mousewheel";
};
var Y = T;
/**
* Checks if an event is supported in the current execution environment.
*
* NOTE: This will not work correctly for non-generic events such as `change`,
* `reset`, `load`, `error`, and `select`.
*
* Borrows from Modernizr.
*
* @param {string} eventNameSuffix Event name, e.g. "click".
* @param {?boolean} capture Check if the capture phase is supported.
* @return {boolean} True if the event is supported.
* @internal
* @license Modernizr 3.0.0pre (Custom Build) | MIT
*/
//#endregion
//#region ../../packages/directives/mousewheel/index.ts
const SCOPE$5 = "_Mousewheel";
const mousewheel = function(element, callback) {
if (element && element.addEventListener) {
removeWheelHandler(element);
const fn = function(event) {
const normalized = Y(event);
callback && Reflect.apply(callback, this, [event, normalized]);
};
element[SCOPE$5] = { wheelHandler: fn };
element.addEventListener("wheel", fn, { passive: true });
}
};
const removeWheelHandler = (element) => {
if (element[SCOPE$5]?.wheelHandler) {
element.removeEventListener("wheel", element[SCOPE$5].wheelHandler);
element[SCOPE$5] = null;
}
};
const Mousewheel = {
beforeMount(el, binding) {
mousewheel(el, binding.value);
},
unmounted(el) {
removeWheelHandler(el);
},
updated(el, binding) {
if (binding.value !== binding.oldValue) mousewheel(el, binding.value);
}
};
//#endregion
//#region ../../packages/components/time-picker/src/props/basic-time-spinner.ts
const basicTimeSpinnerProps = buildProps({
role: {
type: String,
required: true
},
spinnerDate: {
type: definePropType(Object),
required: true
},
showSeconds: {
type: Boolean,
default: true
},
arrowControl: Boolean,
amPmMode: {
type: definePropType(String),
default: ""
},
...disabledTimeListsProps
});
//#endregion
//#region ../../packages/components/time-picker/src/time-picker-com/basic-time-spinner.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$70 = ["onClick"];
const _hoisted_2$39 = ["onMouseenter"];
var basic_time_spinner_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
__name: "basic-time-spinner",
props: basicTimeSpinnerProps,
emits: [
CHANGE_EVENT,
"select-range",
"set-option"
],
setup(__props, { emit: __emit }) {
const props = __props;
const { isRange, format, saveOnBlur } = (0, vue.inject)(PICKER_BASE_INJECTION_KEY).props;
const emit = __emit;
const ns = useNamespace("time");
const { getHoursList, getMinutesList, getSecondsList } = getTimeLists(props.disabledHours, props.disabledMinutes, props.disabledSeconds);
let isScrolling = false;
const ignoreScroll = {
hours: false,
minutes: false,
seconds: false
};
const currentScrollbar = (0, vue.ref)();
const listRefsMap = {
hours: (0, vue.ref)(),
minutes: (0, vue.ref)(),
seconds: (0, vue.ref)()
};
const spinnerItems = (0, vue.computed)(() => {
return props.showSeconds ? timeUnits : timeUnits.slice(0, 2);
});
const timePartials = (0, vue.computed)(() => {
const { spinnerDate } = props;
return {
hours: spinnerDate.hour(),
minutes: spinnerDate.minute(),
seconds: spinnerDate.second()
};
});
const timeList = (0, vue.computed)(() => {
const { hours, minutes } = (0, vue.unref)(timePartials);
const { role, spinnerDate } = props;
const compare = !isRange ? spinnerDate : void 0;
return {
hours: getHoursList(role, compare),
minutes: getMinutesList(hours, role, compare),
seconds: getSecondsList(hours, minutes, role, compare)
};
});
const arrowControlTimeList = (0, vue.computed)(() => {
const { hours, minutes, seconds } = (0, vue.unref)(timePartials);
return {
hours: buildTimeList(hours, 23),
minutes: buildTimeList(minutes, 59),
seconds: buildTimeList(seconds, 59)
};
});
const debouncedResetScroll = debounce((type) => {
isScrolling = false;
adjustCurrentSpinner(type);
}, 200);
const getAmPmFlag = (hour) => {
if (!!!props.amPmMode) return "";
const isCapital = props.amPmMode === "A";
let content = hour < 12 ? " am" : " pm";
if (isCapital) content = content.toUpperCase();
return content;
};
const emitSelectRange = (type) => {
let range = [0, 0];
const actualFormat = format || DEFAULT_FORMATS_TIME;
const hourIndex = actualFormat.indexOf("HH");
const minuteIndex = actualFormat.indexOf("mm");
const secondIndex = actualFormat.indexOf("ss");
switch (type) {
case "hours":
if (hourIndex !== -1) range = [hourIndex, hourIndex + 2];
break;
case "minutes":
if (minuteIndex !== -1) range = [minuteIndex, minuteIndex + 2];
break;
case "seconds":
if (secondIndex !== -1) range = [secondIndex, secondIndex + 2];
break;
}
const [left, right] = range;
emit("select-range", left, right);
currentScrollbar.value = type;
};
const adjustCurrentSpinner = (type) => {
adjustSpinner(type, (0, vue.unref)(timePartials)[type]);
};
const adjustSpinners = () => {
adjustCurrentSpinner("hours");
adjustCurrentSpinner("minutes");
adjustCurrentSpinner("seconds");
};
const getScrollbarElement = (el) => el.querySelector(`.${ns.namespace.value}-scrollbar__wrap`);
const adjustSpinner = (type, value) => {
if (props.arrowControl) return;
const scrollbar = (0, vue.unref)(listRefsMap[type]);
if (scrollbar && scrollbar.$el) {
if (!saveOnBlur) {
ignoreScroll[type] = true;
rAF(() => {
ignoreScroll[type] = false;
});
}
getScrollbarElement(scrollbar.$el).scrollTop = Math.max(0, value * typeItemHeight(type));
}
};
const typeItemHeight = (type) => {
const listItem = (0, vue.unref)(listRefsMap[type])?.$el.querySelector("li");
if (listItem) return Number.parseFloat(getStyle(listItem, "height")) || 0;
return 0;
};
const onIncrement = () => {
scrollDown(1);
};
const onDecrement = () => {
scrollDown(-1);
};
const scrollDown = (step) => {
if (!currentScrollbar.value) emitSelectRange("hours");
const label = currentScrollbar.value;
const now = (0, vue.unref)(timePartials)[label];
const next = findNextUnDisabled(label, now, step, currentScrollbar.value === "hours" ? 24 : 60);
modifyDateField(label, next);
adjustSpinner(label, next);
(0, vue.nextTick)(() => emitSelectRange(label));
};
const findNextUnDisabled = (type, now, step, total) => {
let next = (now + step + total) % total;
const list = (0, vue.unref)(timeList)[type];
while (list[next] && next !== now) next = (next + step + total) % total;
return next;
};
const modifyDateField = (type, value) => {
if ((0, vue.unref)(timeList)[type][value]) return;
const { hours, minutes, seconds } = (0, vue.unref)(timePartials);
let changeTo;
switch (type) {
case "hours":
changeTo = props.spinnerDate.hour(value).minute(minutes).second(seconds);
break;
case "minutes":
changeTo = props.spinnerDate.hour(hours).minute(value).second(seconds);
break;
case "seconds":
changeTo = props.spinnerDate.hour(hours).minute(minutes).second(value);
break;
}
emit(CHANGE_EVENT, changeTo);
};
const handleClick = (type, { value, disabled }) => {
if (!disabled) {
modifyDateField(type, value);
emitSelectRange(type);
adjustSpinner(type, value);
}
};
const handleScroll = (type) => {
if (!saveOnBlur && ignoreScroll[type]) return;
const scrollbar = (0, vue.unref)(listRefsMap[type]);
if (!scrollbar) return;
isScrolling = true;
debouncedResetScroll(type);
modifyDateField(type, Math.min(Math.round((getScrollbarElement(scrollbar.$el).scrollTop - (scrollBarHeight(type) * .5 - 10) / typeItemHeight(type) + 3) / typeItemHeight(type)), type === "hours" ? 23 : 59));
};
const scrollBarHeight = (type) => {
return (0, vue.unref)(listRefsMap[type]).$el.offsetHeight;
};
const bindScrollEvent = () => {
const bindFunction = (type) => {
const scrollbar = (0, vue.unref)(listRefsMap[type]);
if (scrollbar && scrollbar.$el) getScrollbarElement(scrollbar.$el).onscroll = () => {
handleScroll(type);
};
};
bindFunction("hours");
bindFunction("minutes");
bindFunction("seconds");
};
(0, vue.onMounted)(() => {
(0, vue.nextTick)(() => {
!props.arrowControl && bindScrollEvent();
adjustSpinners();
if (props.role === "start") emitSelectRange("hours");
});
});
const setRef = (scrollbar, type) => {
listRefsMap[type].value = scrollbar ?? void 0;
};
emit("set-option", [`${props.role}_scrollDown`, scrollDown]);
emit("set-option", [`${props.role}_emitSelectRange`, emitSelectRange]);
(0, vue.watch)(() => props.spinnerDate, () => {
if (isScrolling) return;
adjustSpinners();
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).b("spinner"), { "has-seconds": _ctx.showSeconds }]) }, [!_ctx.arrowControl ? ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, (0, vue.renderList)(spinnerItems.value, (item) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElScrollbar), {
key: item,
ref_for: true,
ref: (scrollbar) => setRef(scrollbar, item),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("spinner", "wrapper")),
"wrap-style": "max-height: inherit;",
"view-class": (0, vue.unref)(ns).be("spinner", "list"),
noresize: "",
tag: "ul",
onMouseenter: ($event) => emitSelectRange(item),
onMousemove: ($event) => adjustCurrentSpinner(item)
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(timeList.value[item], (disabled, key) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
key,
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).be("spinner", "item"),
(0, vue.unref)(ns).is("active", key === timePartials.value[item]),
(0, vue.unref)(ns).is("disabled", disabled)
]),
onClick: ($event) => handleClick(item, {
value: key,
disabled
})
}, [item === "hours" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [(0, vue.createTextVNode)((0, vue.toDisplayString)(("0" + (_ctx.amPmMode ? key % 12 || 12 : key)).slice(-2)) + (0, vue.toDisplayString)(getAmPmFlag(key)), 1)], 64)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, [(0, vue.createTextVNode)((0, vue.toDisplayString)(("0" + key).slice(-2)), 1)], 64))], 10, _hoisted_1$70);
}), 128))]),
_: 2
}, 1032, [
"class",
"view-class",
"onMouseenter",
"onMousemove"
]);
}), 128)) : (0, vue.createCommentVNode)("v-if", true), _ctx.arrowControl ? ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, (0, vue.renderList)(spinnerItems.value, (item) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: item,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).be("spinner", "wrapper"), (0, vue.unref)(ns).is("arrow")]),
onMouseenter: ($event) => emitSelectRange(item)
}, [
(0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), { class: (0, vue.normalizeClass)(["arrow-up", (0, vue.unref)(ns).be("spinner", "arrow")]) }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(arrow_up_default))]),
_: 1
}, 8, ["class"])), [[(0, vue.unref)(vRepeatClick), onDecrement]]),
(0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), { class: (0, vue.normalizeClass)(["arrow-down", (0, vue.unref)(ns).be("spinner", "arrow")]) }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(arrow_down_default))]),
_: 1
}, 8, ["class"])), [[(0, vue.unref)(vRepeatClick), onIncrement]]),
(0, vue.createElementVNode)("ul", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("spinner", "list")) }, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(arrowControlTimeList.value[item], (time, key) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
key,
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).be("spinner", "item"),
(0, vue.unref)(ns).is("active", time === timePartials.value[item]),
(0, vue.unref)(ns).is("disabled", timeList.value[item][time])
])
}, [(0, vue.unref)(isNumber)(time) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [item === "hours" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [(0, vue.createTextVNode)((0, vue.toDisplayString)(("0" + (_ctx.amPmMode ? time % 12 || 12 : time)).slice(-2)) + (0, vue.toDisplayString)(getAmPmFlag(time)), 1)], 64)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, [(0, vue.createTextVNode)((0, vue.toDisplayString)(("0" + time).slice(-2)), 1)], 64))], 64)) : (0, vue.createCommentVNode)("v-if", true)], 2);
}), 128))], 2)
], 42, _hoisted_2$39);
}), 128)) : (0, vue.createCommentVNode)("v-if", true)], 2);
};
}
});
//#endregion
//#region ../../packages/components/time-picker/src/time-picker-com/basic-time-spinner.vue
var basic_time_spinner_default = basic_time_spinner_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/time-picker/src/time-picker-com/panel-time-pick.vue?vue&type=script&setup=true&lang.ts
var panel_time_pick_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
__name: "panel-time-pick",
props: panelTimePickerProps,
emits: [
"pick",
"select-range",
"set-picker-option"
],
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const pickerBase = (0, vue.inject)(PICKER_BASE_INJECTION_KEY);
const { arrowControl, disabledHours, disabledMinutes, disabledSeconds, defaultValue } = pickerBase.props;
const { getAvailableHours, getAvailableMinutes, getAvailableSeconds } = buildAvailableTimeSlotGetter(disabledHours, disabledMinutes, disabledSeconds);
const ns = useNamespace("time");
const { t, lang } = useLocale();
const selectionRange = (0, vue.ref)([0, 2]);
const oldValue = useOldValue(props, {
modelValue: (0, vue.computed)(() => pickerBase.props.modelValue),
valueOnClear: (0, vue.computed)(() => pickerBase?.emptyValues ? pickerBase.emptyValues.valueOnClear.value : null)
});
const transitionName = (0, vue.computed)(() => {
return isUndefined(props.actualVisible) ? `${ns.namespace.value}-zoom-in-top` : "";
});
const showSeconds = (0, vue.computed)(() => {
return props.format.includes("ss");
});
const amPmMode = (0, vue.computed)(() => {
if (props.format.includes("A")) return "A";
if (props.format.includes("a")) return "a";
return "";
});
const isValidValue = (_date) => {
const parsedDate = (0, import_dayjs_min.default)(_date).locale(lang.value);
const result = getRangeAvailableTime(parsedDate);
return parsedDate.isSame(result);
};
const handleCancel = () => {
const old = oldValue.value;
emit("pick", old, false);
(0, vue.nextTick)(() => {
oldValue.value = old;
});
};
const handleConfirm = (visible = false, first = false) => {
if (first) return;
emit("pick", props.parsedValue, visible);
};
const handleChange = (_date) => {
if (!props.visible) return;
emit("pick", getRangeAvailableTime(_date).millisecond(0), true);
};
const setSelectionRange = (start, end) => {
emit("select-range", start, end);
selectionRange.value = [start, end];
};
const changeSelectionRange = (step) => {
const actualFormat = props.format;
const hourIndex = actualFormat.indexOf("HH");
const minuteIndex = actualFormat.indexOf("mm");
const secondIndex = actualFormat.indexOf("ss");
const list = [];
const mapping = [];
if (hourIndex !== -1) {
list.push(hourIndex);
mapping.push("hours");
}
if (minuteIndex !== -1) {
list.push(minuteIndex);
mapping.push("minutes");
}
if (secondIndex !== -1 && showSeconds.value) {
list.push(secondIndex);
mapping.push("seconds");
}
const next = (list.indexOf(selectionRange.value[0]) + step + list.length) % list.length;
timePickerOptions["start_emitSelectRange"](mapping[next]);
};
const handleKeydown = (event) => {
const code = getEventCode(event);
const { left, right, up, down } = EVENT_CODE;
if ([left, right].includes(code)) {
changeSelectionRange(code === left ? -1 : 1);
event.preventDefault();
return;
}
if ([up, down].includes(code)) {
const step = code === up ? -1 : 1;
timePickerOptions["start_scrollDown"](step);
event.preventDefault();
return;
}
};
const { timePickerOptions, onSetOption, getAvailableTime } = useTimePanel({
getAvailableHours,
getAvailableMinutes,
getAvailableSeconds
});
const getRangeAvailableTime = (date) => {
return getAvailableTime(date, props.datetimeRole || "", true);
};
const parseUserInput = (value) => {
if (!value) return null;
return (0, import_dayjs_min.default)(value, props.format).locale(lang.value);
};
const getDefaultValue = () => {
return (0, import_dayjs_min.default)(defaultValue).locale(lang.value);
};
emit("set-picker-option", ["isValidValue", isValidValue]);
emit("set-picker-option", ["parseUserInput", parseUserInput]);
emit("set-picker-option", ["handleKeydownInput", handleKeydown]);
emit("set-picker-option", ["getRangeAvailableTime", getRangeAvailableTime]);
emit("set-picker-option", ["getDefaultValue", getDefaultValue]);
emit("set-picker-option", ["handleCancel", handleCancel]);
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)(vue.Transition, { name: transitionName.value }, {
default: (0, vue.withCtx)(() => [_ctx.actualVisible || _ctx.visible ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b("panel"))
}, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).be("panel", "content"), { "has-seconds": showSeconds.value }]) }, [(0, vue.createVNode)(basic_time_spinner_default, {
ref: "spinner",
role: _ctx.datetimeRole || "start",
"arrow-control": (0, vue.unref)(arrowControl),
"show-seconds": showSeconds.value,
"am-pm-mode": amPmMode.value,
"spinner-date": _ctx.parsedValue,
"disabled-hours": (0, vue.unref)(disabledHours),
"disabled-minutes": (0, vue.unref)(disabledMinutes),
"disabled-seconds": (0, vue.unref)(disabledSeconds),
onChange: handleChange,
onSetOption: (0, vue.unref)(onSetOption),
onSelectRange: setSelectionRange
}, null, 8, [
"role",
"arrow-control",
"show-seconds",
"am-pm-mode",
"spinner-date",
"disabled-hours",
"disabled-minutes",
"disabled-seconds",
"onSetOption"
])], 2), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("panel", "footer")) }, [(0, vue.createElementVNode)("button", {
type: "button",
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).be("panel", "btn"), "cancel"]),
onClick: handleCancel
}, (0, vue.toDisplayString)((0, vue.unref)(t)("el.datepicker.cancel")), 3), (0, vue.createElementVNode)("button", {
type: "button",
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).be("panel", "btn"), "confirm"]),
onClick: _cache[0] || (_cache[0] = ($event) => handleConfirm())
}, (0, vue.toDisplayString)((0, vue.unref)(t)("el.datepicker.confirm")), 3)], 2)], 2)) : (0, vue.createCommentVNode)("v-if", true)]),
_: 1
}, 8, ["name"]);
};
}
});
//#endregion
//#region ../../packages/components/time-picker/src/time-picker-com/panel-time-pick.vue
var panel_time_pick_default = panel_time_pick_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/time-picker/src/props/panel-time-range.ts
const panelTimeRangeProps = buildProps({
...timePanelSharedProps,
parsedValue: { type: definePropType(Array) }
});
//#endregion
//#region ../../packages/components/time-picker/src/time-picker-com/panel-time-range.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$69 = ["disabled"];
var panel_time_range_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
__name: "panel-time-range",
props: panelTimeRangeProps,
emits: [
"pick",
"select-range",
"set-picker-option"
],
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const makeSelectRange = (start, end) => {
const result = [];
for (let i = start; i <= end; i++) result.push(i);
return result;
};
const { t, lang } = useLocale();
const nsTime = useNamespace("time");
const nsPicker = useNamespace("picker");
const pickerBase = (0, vue.inject)(PICKER_BASE_INJECTION_KEY);
const { arrowControl, disabledHours, disabledMinutes, disabledSeconds, defaultValue } = pickerBase.props;
const startContainerKls = (0, vue.computed)(() => [
nsTime.be("range-picker", "body"),
nsTime.be("panel", "content"),
nsTime.is("arrow", arrowControl),
showSeconds.value ? "has-seconds" : ""
]);
const endContainerKls = (0, vue.computed)(() => [
nsTime.be("range-picker", "body"),
nsTime.be("panel", "content"),
nsTime.is("arrow", arrowControl),
showSeconds.value ? "has-seconds" : ""
]);
const startTime = (0, vue.computed)(() => props.parsedValue[0]);
const endTime = (0, vue.computed)(() => props.parsedValue[1]);
const oldValue = useOldValue(props, {
modelValue: (0, vue.computed)(() => pickerBase.props.modelValue),
valueOnClear: (0, vue.computed)(() => pickerBase?.emptyValues ? pickerBase.emptyValues.valueOnClear.value : null)
});
const handleCancel = () => {
const old = oldValue.value;
emit("pick", old, false);
(0, vue.nextTick)(() => {
oldValue.value = old;
});
};
const showSeconds = (0, vue.computed)(() => {
return props.format.includes("ss");
});
const amPmMode = (0, vue.computed)(() => {
if (props.format.includes("A")) return "A";
if (props.format.includes("a")) return "a";
return "";
});
const handleConfirm = (visible = false) => {
emit("pick", [startTime.value, endTime.value], visible);
};
const handleMinChange = (date) => {
handleChange(date.millisecond(0), endTime.value);
};
const handleMaxChange = (date) => {
handleChange(startTime.value, date.millisecond(0));
};
const isValidValue = (_date) => {
const parsedDate = _date.map((_) => (0, import_dayjs_min.default)(_).locale(lang.value));
const result = getRangeAvailableTime(parsedDate);
return parsedDate[0].isSame(result[0]) && parsedDate[1].isSame(result[1]);
};
const handleChange = (start, end) => {
if (!props.visible) return;
emit("pick", [start, end], true);
};
const btnConfirmDisabled = (0, vue.computed)(() => {
return startTime.value > endTime.value;
});
const selectionRange = (0, vue.ref)([0, 2]);
const setMinSelectionRange = (start, end) => {
emit("select-range", start, end, "min");
selectionRange.value = [start, end];
};
const offset = (0, vue.computed)(() => showSeconds.value ? 11 : 8);
const setMaxSelectionRange = (start, end) => {
emit("select-range", start, end, "max");
const _offset = (0, vue.unref)(offset);
selectionRange.value = [start + _offset, end + _offset];
};
const changeSelectionRange = (step) => {
const list = showSeconds.value ? [
0,
3,
6,
11,
14,
17
] : [
0,
3,
8,
11
];
const mapping = ["hours", "minutes"].concat(showSeconds.value ? ["seconds"] : []);
const next = (list.indexOf(selectionRange.value[0]) + step + list.length) % list.length;
const half = list.length / 2;
if (next < half) timePickerOptions["start_emitSelectRange"](mapping[next]);
else timePickerOptions["end_emitSelectRange"](mapping[next - half]);
};
const handleKeydown = (event) => {
const code = getEventCode(event);
const { left, right, up, down } = EVENT_CODE;
if ([left, right].includes(code)) {
changeSelectionRange(code === left ? -1 : 1);
event.preventDefault();
return;
}
if ([up, down].includes(code)) {
const step = code === up ? -1 : 1;
timePickerOptions[`${selectionRange.value[0] < offset.value ? "start" : "end"}_scrollDown`](step);
event.preventDefault();
return;
}
};
const disabledHours_ = (role, compare) => {
const defaultDisable = disabledHours ? disabledHours(role) : [];
const isStart = role === "start";
const compareHour = (compare || (isStart ? endTime.value : startTime.value)).hour();
return union(defaultDisable, isStart ? makeSelectRange(compareHour + 1, 23) : makeSelectRange(0, compareHour - 1));
};
const disabledMinutes_ = (hour, role, compare) => {
const defaultDisable = disabledMinutes ? disabledMinutes(hour, role) : [];
const isStart = role === "start";
const compareDate = compare || (isStart ? endTime.value : startTime.value);
if (hour !== compareDate.hour()) return defaultDisable;
const compareMinute = compareDate.minute();
return union(defaultDisable, isStart ? makeSelectRange(compareMinute + 1, 59) : makeSelectRange(0, compareMinute - 1));
};
const disabledSeconds_ = (hour, minute, role, compare) => {
const defaultDisable = disabledSeconds ? disabledSeconds(hour, minute, role) : [];
const isStart = role === "start";
const compareDate = compare || (isStart ? endTime.value : startTime.value);
const compareHour = compareDate.hour();
const compareMinute = compareDate.minute();
if (hour !== compareHour || minute !== compareMinute) return defaultDisable;
const compareSecond = compareDate.second();
return union(defaultDisable, isStart ? makeSelectRange(compareSecond + 1, 59) : makeSelectRange(0, compareSecond - 1));
};
const getRangeAvailableTime = ([start, end]) => {
return [getAvailableTime(start, "start", true, end), getAvailableTime(end, "end", false, start)];
};
const { getAvailableHours, getAvailableMinutes, getAvailableSeconds } = buildAvailableTimeSlotGetter(disabledHours_, disabledMinutes_, disabledSeconds_);
const { timePickerOptions, getAvailableTime, onSetOption } = useTimePanel({
getAvailableHours,
getAvailableMinutes,
getAvailableSeconds
});
const parseUserInput = (days) => {
if (!days) return null;
if (isArray$1(days)) return days.map((d) => (0, import_dayjs_min.default)(d, props.format).locale(lang.value));
return (0, import_dayjs_min.default)(days, props.format).locale(lang.value);
};
const getDefaultValue = () => {
if (isArray$1(defaultValue)) return defaultValue.map((d) => (0, import_dayjs_min.default)(d).locale(lang.value));
const defaultDay = (0, import_dayjs_min.default)(defaultValue).locale(lang.value);
return [defaultDay, defaultDay.add(60, "m")];
};
emit("set-picker-option", ["parseUserInput", parseUserInput]);
emit("set-picker-option", ["isValidValue", isValidValue]);
emit("set-picker-option", ["handleKeydownInput", handleKeydown]);
emit("set-picker-option", ["getDefaultValue", getDefaultValue]);
emit("set-picker-option", ["getRangeAvailableTime", getRangeAvailableTime]);
emit("set-picker-option", ["handleCancel", handleCancel]);
return (_ctx, _cache) => {
return _ctx.actualVisible ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)([(0, vue.unref)(nsTime).b("range-picker"), (0, vue.unref)(nsPicker).b("panel")])
}, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(nsTime).be("range-picker", "content")) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(nsTime).be("range-picker", "cell")) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(nsTime).be("range-picker", "header")) }, (0, vue.toDisplayString)((0, vue.unref)(t)("el.datepicker.startTime")), 3), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)(startContainerKls.value) }, [(0, vue.createVNode)(basic_time_spinner_default, {
ref: "minSpinner",
role: "start",
"show-seconds": showSeconds.value,
"am-pm-mode": amPmMode.value,
"arrow-control": (0, vue.unref)(arrowControl),
"spinner-date": startTime.value,
"disabled-hours": disabledHours_,
"disabled-minutes": disabledMinutes_,
"disabled-seconds": disabledSeconds_,
onChange: handleMinChange,
onSetOption: (0, vue.unref)(onSetOption),
onSelectRange: setMinSelectionRange
}, null, 8, [
"show-seconds",
"am-pm-mode",
"arrow-control",
"spinner-date",
"onSetOption"
])], 2)], 2), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(nsTime).be("range-picker", "cell")) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(nsTime).be("range-picker", "header")) }, (0, vue.toDisplayString)((0, vue.unref)(t)("el.datepicker.endTime")), 3), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)(endContainerKls.value) }, [(0, vue.createVNode)(basic_time_spinner_default, {
ref: "maxSpinner",
role: "end",
"show-seconds": showSeconds.value,
"am-pm-mode": amPmMode.value,
"arrow-control": (0, vue.unref)(arrowControl),
"spinner-date": endTime.value,
"disabled-hours": disabledHours_,
"disabled-minutes": disabledMinutes_,
"disabled-seconds": disabledSeconds_,
onChange: handleMaxChange,
onSetOption: (0, vue.unref)(onSetOption),
onSelectRange: setMaxSelectionRange
}, null, 8, [
"show-seconds",
"am-pm-mode",
"arrow-control",
"spinner-date",
"onSetOption"
])], 2)], 2)], 2), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(nsTime).be("panel", "footer")) }, [(0, vue.createElementVNode)("button", {
type: "button",
class: (0, vue.normalizeClass)([(0, vue.unref)(nsTime).be("panel", "btn"), "cancel"]),
onClick: _cache[0] || (_cache[0] = ($event) => handleCancel())
}, (0, vue.toDisplayString)((0, vue.unref)(t)("el.datepicker.cancel")), 3), (0, vue.createElementVNode)("button", {
type: "button",
class: (0, vue.normalizeClass)([(0, vue.unref)(nsTime).be("panel", "btn"), "confirm"]),
disabled: btnConfirmDisabled.value,
onClick: _cache[1] || (_cache[1] = ($event) => handleConfirm())
}, (0, vue.toDisplayString)((0, vue.unref)(t)("el.datepicker.confirm")), 11, _hoisted_1$69)], 2)], 2)) : (0, vue.createCommentVNode)("v-if", true);
};
}
});
//#endregion
//#region ../../packages/components/time-picker/src/time-picker-com/panel-time-range.vue
var panel_time_range_default = panel_time_range_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/time-picker/src/time-picker.tsx
import_dayjs_min.default.extend(import_customParseFormat.default);
var time_picker_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTimePicker",
install: null,
props: {
...timePickerDefaultProps,
isRange: Boolean
},
emits: [UPDATE_MODEL_EVENT],
setup(props, ctx) {
const commonPicker = (0, vue.ref)();
const [type, Panel] = props.isRange ? ["timerange", panel_time_range_default] : ["time", panel_time_pick_default];
const modelUpdater = (value) => ctx.emit(UPDATE_MODEL_EVENT, value);
(0, vue.provide)(PICKER_POPPER_OPTIONS_INJECTION_KEY, props.popperOptions);
ctx.expose({
focus: () => {
commonPicker.value?.focus();
},
blur: () => {
commonPicker.value?.blur();
},
handleOpen: () => {
commonPicker.value?.handleOpen();
},
handleClose: () => {
commonPicker.value?.handleClose();
}
});
return () => {
const format = props.format ?? DEFAULT_FORMATS_TIME;
return (0, vue.createVNode)(picker_default, (0, vue.mergeProps)(props, {
"ref": commonPicker,
"type": type,
"format": format,
"onUpdate:modelValue": modelUpdater
}), { default: (props) => (0, vue.createVNode)(Panel, props, null) });
};
}
});
//#endregion
//#region ../../packages/components/time-picker/index.ts
const ElTimePicker = withInstall(time_picker_default);
//#endregion
//#region ../../packages/components/calendar/src/date-table.ts
const getPrevMonthLastDays = (date, count) => {
const lastDay = date.subtract(1, "month").endOf("month").date();
return rangeArr(count).map((_, index) => lastDay - (count - index - 1));
};
const getMonthDays = (date) => {
return rangeArr(date.daysInMonth()).map((_, index) => index + 1);
};
const toNestedArr = (days) => rangeArr(days.length / 7).map((index) => {
const start = index * 7;
return days.slice(start, start + 7);
});
/**
* @deprecated Removed after 3.0.0, Use `DateTableProps` instead.
*/
const dateTableProps = buildProps({
selectedDay: { type: definePropType(Object) },
range: { type: definePropType(Array) },
date: {
type: definePropType(Object),
required: true
},
hideHeader: { type: Boolean }
});
const dateTableEmits = { pick: (value) => isObject$1(value) };
//#endregion
//#region ../../node_modules/.pnpm/dayjs@1.11.19/node_modules/dayjs/plugin/localeData.js
var require_localeData = /* @__PURE__ */ __commonJSMin(((exports, module) => {
(function(n, e) {
"object" == typeof exports && "undefined" != typeof module ? module.exports = e() : "function" == typeof define && define.amd ? define(e) : (n = "undefined" != typeof globalThis ? globalThis : n || self).dayjs_plugin_localeData = e();
})(exports, (function() {
"use strict";
return function(n, e, t) {
var r = e.prototype, o = function(n) {
return n && (n.indexOf ? n : n.s);
}, u = function(n, e, t, r, u) {
var i = n.name ? n : n.$locale(), a = o(i[e]), s = o(i[t]), f = a || s.map((function(n) {
return n.slice(0, r);
}));
if (!u) return f;
var d = i.weekStart;
return f.map((function(n, e) {
return f[(e + (d || 0)) % 7];
}));
}, i = function() {
return t.Ls[t.locale()];
}, a = function(n, e) {
return n.formats[e] || function(n) {
return n.replace(/(\[[^\]]+])|(MMMM|MM|DD|dddd)/g, (function(n, e, t) {
return e || t.slice(1);
}));
}(n.formats[e.toUpperCase()]);
}, s = function() {
var n = this;
return {
months: function(e) {
return e ? e.format("MMMM") : u(n, "months");
},
monthsShort: function(e) {
return e ? e.format("MMM") : u(n, "monthsShort", "months", 3);
},
firstDayOfWeek: function() {
return n.$locale().weekStart || 0;
},
weekdays: function(e) {
return e ? e.format("dddd") : u(n, "weekdays");
},
weekdaysMin: function(e) {
return e ? e.format("dd") : u(n, "weekdaysMin", "weekdays", 2);
},
weekdaysShort: function(e) {
return e ? e.format("ddd") : u(n, "weekdaysShort", "weekdays", 3);
},
longDateFormat: function(e) {
return a(n.$locale(), e);
},
meridiem: this.$locale().meridiem,
ordinal: this.$locale().ordinal
};
};
r.localeData = function() {
return s.bind(this)();
}, t.localeData = function() {
var n = i();
return {
firstDayOfWeek: function() {
return n.weekStart || 0;
},
weekdays: function() {
return t.weekdays();
},
weekdaysShort: function() {
return t.weekdaysShort();
},
weekdaysMin: function() {
return t.weekdaysMin();
},
months: function() {
return t.months();
},
monthsShort: function() {
return t.monthsShort();
},
longDateFormat: function(e) {
return a(n, e);
},
meridiem: n.meridiem,
ordinal: n.ordinal
};
}, t.months = function() {
return u(i(), "months");
}, t.monthsShort = function() {
return u(i(), "monthsShort", "months", 3);
}, t.weekdays = function(n) {
return u(i(), "weekdays", null, null, n);
}, t.weekdaysShort = function(n) {
return u(i(), "weekdaysShort", "weekdays", 3, n);
}, t.weekdaysMin = function(n) {
return u(i(), "weekdaysMin", "weekdays", 2, n);
};
};
}));
}));
//#endregion
//#region ../../packages/components/calendar/src/use-date-table.ts
var import_localeData = /* @__PURE__ */ __toESM(require_localeData());
const useDateTable = (props, emit) => {
import_dayjs_min.default.extend(import_localeData.default);
const firstDayOfWeek = import_dayjs_min.default.localeData().firstDayOfWeek();
const { t, lang } = useLocale();
const now = (0, import_dayjs_min.default)().locale(lang.value);
const isInRange = (0, vue.computed)(() => !!props.range && !!props.range.length);
const rows = (0, vue.computed)(() => {
let days = [];
if (isInRange.value) {
const [start, end] = props.range;
const currentMonthRange = rangeArr(end.date() - start.date() + 1).map((index) => ({
text: start.date() + index,
type: "current"
}));
let remaining = currentMonthRange.length % 7;
remaining = remaining === 0 ? 0 : 7 - remaining;
const nextMonthRange = rangeArr(remaining).map((_, index) => ({
text: index + 1,
type: "next"
}));
days = currentMonthRange.concat(nextMonthRange);
} else {
const firstDay = props.date.startOf("month").day();
const prevMonthDays = getPrevMonthLastDays(props.date, (firstDay - firstDayOfWeek + 7) % 7).map((day) => ({
text: day,
type: "prev"
}));
const currentMonthDays = getMonthDays(props.date).map((day) => ({
text: day,
type: "current"
}));
days = [...prevMonthDays, ...currentMonthDays];
const nextMonthDays = rangeArr(7 - (days.length % 7 || 7)).map((_, index) => ({
text: index + 1,
type: "next"
}));
days = days.concat(nextMonthDays);
}
return toNestedArr(days);
});
const weekDays = (0, vue.computed)(() => {
const start = firstDayOfWeek;
if (start === 0) return WEEK_DAYS.map((_) => t(`el.datepicker.weeks.${_}`));
else return WEEK_DAYS.slice(start).concat(WEEK_DAYS.slice(0, start)).map((_) => t(`el.datepicker.weeks.${_}`));
});
const getFormattedDate = (day, type) => {
switch (type) {
case "prev": return props.date.startOf("month").subtract(1, "month").date(day);
case "next": return props.date.startOf("month").add(1, "month").date(day);
case "current": return props.date.date(day);
}
};
const handlePickDay = ({ text, type }) => {
emit("pick", getFormattedDate(text, type));
};
const getSlotData = ({ text, type }) => {
const day = getFormattedDate(text, type);
return {
isSelected: day.isSame(props.selectedDay),
type: `${type}-month`,
day: day.format(DEFAULT_FORMATS_DATE),
date: day.toDate()
};
};
return {
now,
isInRange,
rows,
weekDays,
getFormattedDate,
handlePickDay,
getSlotData
};
};
//#endregion
//#region ../../packages/components/calendar/src/date-table.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$68 = { key: 0 };
const _hoisted_2$38 = ["onClick"];
var date_table_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "DateTable",
__name: "date-table",
props: dateTableProps,
emits: dateTableEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const { isInRange, now, rows, weekDays, getFormattedDate, handlePickDay, getSlotData } = useDateTable(props, __emit);
const nsTable = useNamespace("calendar-table");
const nsDay = useNamespace("calendar-day");
const getCellClass = ({ text, type }) => {
const classes = [type];
if (type === "current") {
const date = getFormattedDate(text, type);
if (date.isSame(props.selectedDay, "day")) classes.push(nsDay.is("selected"));
if (date.isSame(now, "day")) classes.push(nsDay.is("today"));
}
return classes;
};
__expose({ getFormattedDate });
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("table", {
class: (0, vue.normalizeClass)([(0, vue.unref)(nsTable).b(), (0, vue.unref)(nsTable).is("range", (0, vue.unref)(isInRange))]),
cellspacing: "0",
cellpadding: "0"
}, [!__props.hideHeader ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("thead", _hoisted_1$68, [(0, vue.createElementVNode)("tr", null, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(weekDays), (day) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("th", {
key: day,
scope: "col"
}, (0, vue.toDisplayString)(day), 1);
}), 128))])])) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createElementVNode)("tbody", null, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(rows), (row, index) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("tr", {
key: index,
class: (0, vue.normalizeClass)({
[(0, vue.unref)(nsTable).e("row")]: true,
[(0, vue.unref)(nsTable).em("row", "hide-border")]: index === 0 && __props.hideHeader
})
}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(row, (cell, key) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("td", {
key,
class: (0, vue.normalizeClass)(getCellClass(cell)),
onClick: ($event) => (0, vue.unref)(handlePickDay)(cell)
}, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(nsDay).b()) }, [(0, vue.renderSlot)(_ctx.$slots, "date-cell", { data: (0, vue.unref)(getSlotData)(cell) }, () => [(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(cell.text), 1)])], 2)], 10, _hoisted_2$38);
}), 128))], 2);
}), 128))])], 2);
};
}
});
//#endregion
//#region ../../packages/components/calendar/src/date-table.vue
var date_table_default = date_table_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/calendar/src/use-calendar.ts
const adjacentMonth = (start, end) => {
const firstMonthLastDay = start.endOf("month");
const lastMonthFirstDay = end.startOf("month");
const lastMonthStartDay = firstMonthLastDay.isSame(lastMonthFirstDay, "week") ? lastMonthFirstDay.add(1, "week") : lastMonthFirstDay;
return [[start, firstMonthLastDay], [lastMonthStartDay.startOf("week"), end]];
};
const threeConsecutiveMonth = (start, end) => {
const firstMonthLastDay = start.endOf("month");
const secondMonthFirstDay = start.add(1, "month").startOf("month");
const secondMonthStartDay = firstMonthLastDay.isSame(secondMonthFirstDay, "week") ? secondMonthFirstDay.add(1, "week") : secondMonthFirstDay;
const secondMonthLastDay = secondMonthStartDay.endOf("month");
const lastMonthFirstDay = end.startOf("month");
const lastMonthStartDay = secondMonthLastDay.isSame(lastMonthFirstDay, "week") ? lastMonthFirstDay.add(1, "week") : lastMonthFirstDay;
return [
[start, firstMonthLastDay],
[secondMonthStartDay.startOf("week"), secondMonthLastDay],
[lastMonthStartDay.startOf("week"), end]
];
};
const useCalendar = (props, emit, componentName) => {
const { lang } = useLocale();
const selectedDay = (0, vue.ref)();
const now = (0, import_dayjs_min.default)().locale(lang.value);
const realSelectedDay = (0, vue.computed)({
get() {
if (!props.modelValue) return selectedDay.value;
return date.value;
},
set(val) {
if (!val) return;
selectedDay.value = val;
const result = val.toDate();
emit(INPUT_EVENT, result);
emit(UPDATE_MODEL_EVENT, result);
}
});
const validatedRange = (0, vue.computed)(() => {
if (!props.range || !isArray$1(props.range) || props.range.length !== 2 || props.range.some((item) => !isDate(item))) return [];
const [startDayjs, endDayjs] = props.range.map((_) => (0, import_dayjs_min.default)(_).locale(lang.value));
if (startDayjs.isAfter(endDayjs)) {
/* @__PURE__ */ debugWarn(componentName, "end time should be greater than start time");
return [];
}
if (startDayjs.isSame(endDayjs, "month")) return calculateValidatedDateRange(startDayjs, endDayjs);
else {
if (startDayjs.add(1, "month").month() !== endDayjs.month()) {
/* @__PURE__ */ debugWarn(componentName, "start time and end time interval must not exceed two months");
return [];
}
return calculateValidatedDateRange(startDayjs, endDayjs);
}
});
const date = (0, vue.computed)(() => {
if (!props.modelValue) return realSelectedDay.value || (validatedRange.value.length ? validatedRange.value[0][0] : now);
else return (0, import_dayjs_min.default)(props.modelValue).locale(lang.value);
});
const prevMonthDayjs = (0, vue.computed)(() => date.value.subtract(1, "month").date(1));
const nextMonthDayjs = (0, vue.computed)(() => date.value.add(1, "month").date(1));
const prevYearDayjs = (0, vue.computed)(() => date.value.subtract(1, "year").date(1));
const nextYearDayjs = (0, vue.computed)(() => date.value.add(1, "year").date(1));
const calculateValidatedDateRange = (startDayjs, endDayjs) => {
const firstDay = startDayjs.startOf("week");
const lastDay = endDayjs.endOf("week");
const firstMonth = firstDay.get("month");
const lastMonth = lastDay.get("month");
if (firstMonth === lastMonth) return [[firstDay, lastDay]];
else if ((firstMonth + 1) % 12 === lastMonth) return adjacentMonth(firstDay, lastDay);
else if (firstMonth + 2 === lastMonth || (firstMonth + 1) % 11 === lastMonth) return threeConsecutiveMonth(firstDay, lastDay);
else {
/* @__PURE__ */ debugWarn(componentName, "start time and end time interval must not exceed two months");
return [];
}
};
const pickDay = (day) => {
realSelectedDay.value = day;
};
const selectDate = (type) => {
const day = {
"prev-month": prevMonthDayjs.value,
"next-month": nextMonthDayjs.value,
"prev-year": prevYearDayjs.value,
"next-year": nextYearDayjs.value,
today: now
}[type];
if (!day.isSame(date.value, "day")) pickDay(day);
};
const handleDateChange = (date) => {
if (date === "today") selectDate("today");
else pickDay(date);
};
return {
calculateValidatedDateRange,
date,
realSelectedDay,
pickDay,
selectDate,
validatedRange,
handleDateChange
};
};
//#endregion
//#region ../../packages/components/calendar/src/select-controller.ts
/**
* @deprecated Removed after 3.0.0, Use `SelectControllerProps` instead.
*/
const selectControllerProps = buildProps({
date: {
type: definePropType(Object),
required: true
},
formatter: { type: definePropType(Function) }
});
const selectControllerEmits = { "date-change": (date) => isObject$1(date) || isString(date) };
//#endregion
//#region ../../packages/components/tag/src/tag.ts
/**
* @deprecated Removed after 3.0.0, Use `TagProps` instead.
*/
const tagProps = buildProps({
type: {
type: String,
values: [
"primary",
"success",
"info",
"warning",
"danger"
],
default: "primary"
},
closable: Boolean,
disableTransitions: Boolean,
hit: Boolean,
color: String,
size: {
type: String,
values: componentSizes
},
effect: {
type: String,
values: [
"dark",
"light",
"plain"
],
default: "light"
},
round: Boolean
});
const tagEmits = {
close: (evt) => evt instanceof MouseEvent,
click: (evt) => evt instanceof MouseEvent
};
//#endregion
//#region ../../packages/components/tag/src/tag.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$67 = ["aria-label"];
const _hoisted_2$37 = ["aria-label"];
var tag_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTag",
__name: "tag",
props: tagProps,
emits: tagEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const tagSize = useFormSize();
const { t } = useLocale();
const ns = useNamespace("tag");
const containerKls = (0, vue.computed)(() => {
const { type, hit, effect, closable, round } = props;
return [
ns.b(),
ns.is("closable", closable),
ns.m(type || "primary"),
ns.m(tagSize.value),
ns.m(effect),
ns.is("hit", hit),
ns.is("round", round)
];
});
const handleClose = (event) => {
emit("close", event);
};
const handleClick = (event) => {
emit("click", event);
};
const handleVNodeMounted = (vnode) => {
if (vnode?.component?.subTree?.component?.bum) vnode.component.subTree.component.bum = null;
};
return (_ctx, _cache) => {
return __props.disableTransitions ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 0,
class: (0, vue.normalizeClass)(containerKls.value),
style: (0, vue.normalizeStyle)({ backgroundColor: __props.color }),
onClick: handleClick
}, [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("content")) }, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2), __props.closable ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key: 0,
"aria-label": (0, vue.unref)(t)("el.tag.close"),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("close")),
type: "button",
onClick: (0, vue.withModifiers)(handleClose, ["stop"])
}, [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(close_default))]),
_: 1
})], 10, _hoisted_1$67)) : (0, vue.createCommentVNode)("v-if", true)], 6)) : ((0, vue.openBlock)(), (0, vue.createBlock)(vue.Transition, {
key: 1,
name: `${(0, vue.unref)(ns).namespace.value}-zoom-in-center`,
appear: "",
onVnodeMounted: handleVNodeMounted
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("span", {
class: (0, vue.normalizeClass)(containerKls.value),
style: (0, vue.normalizeStyle)({ backgroundColor: __props.color }),
onClick: handleClick
}, [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("content")) }, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2), __props.closable ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key: 0,
"aria-label": (0, vue.unref)(t)("el.tag.close"),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("close")),
type: "button",
onClick: (0, vue.withModifiers)(handleClose, ["stop"])
}, [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(close_default))]),
_: 1
})], 10, _hoisted_2$37)) : (0, vue.createCommentVNode)("v-if", true)], 6)]),
_: 3
}, 8, ["name"]));
};
}
});
//#endregion
//#region ../../packages/components/tag/src/tag.vue
var tag_default = tag_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/tag/index.ts
const ElTag = withInstall(tag_default);
//#endregion
//#region ../../packages/components/select-v2/src/useProps.ts
const defaultProps$2 = {
label: "label",
value: "value",
disabled: "disabled",
options: "options"
};
function useProps(props) {
const aliasProps = (0, vue.ref)({
...defaultProps$2,
...props.props
});
let cache = { ...props.props };
(0, vue.watch)(() => props.props, (val) => {
if (!isEqual$1(val, cache)) {
aliasProps.value = {
...defaultProps$2,
...val
};
cache = { ...val };
}
}, { deep: true });
const getLabel = (option) => get(option, aliasProps.value.label);
const getValue = (option) => get(option, aliasProps.value.value);
const getDisabled = (option) => get(option, aliasProps.value.disabled);
const getOptions = (option) => get(option, aliasProps.value.options);
return {
aliasProps,
getLabel,
getValue,
getDisabled,
getOptions
};
}
//#endregion
//#region ../../packages/components/select/src/token.ts
const selectGroupKey = Symbol("ElSelectGroup");
const selectKey = Symbol("ElSelect");
//#endregion
//#region ../../packages/components/select/src/option.ts
const COMPONENT_NAME$14 = "ElOption";
const optionProps = buildProps({
value: {
type: [
String,
Number,
Boolean,
Object
],
required: true
},
label: { type: [String, Number] },
created: Boolean,
disabled: Boolean
});
//#endregion
//#region ../../packages/components/select/src/useOption.ts
function useOption$1(props, states) {
const select = (0, vue.inject)(selectKey);
if (!select) throwError(COMPONENT_NAME$14, "usage: <el-select><el-option /></el-select/>");
const selectGroup = (0, vue.inject)(selectGroupKey, { disabled: false });
const itemSelected = (0, vue.computed)(() => {
return contains(castArray$1(select.props.modelValue), props.value);
});
const limitReached = (0, vue.computed)(() => {
if (select.props.multiple) {
const modelValue = castArray$1(select.props.modelValue ?? []);
return !itemSelected.value && modelValue.length >= select.props.multipleLimit && select.props.multipleLimit > 0;
} else return false;
});
const currentLabel = (0, vue.computed)(() => {
return props.label ?? (isObject$1(props.value) ? "" : props.value);
});
const currentValue = (0, vue.computed)(() => {
return props.value || props.label || "";
});
const isDisabled = (0, vue.computed)(() => {
return props.disabled || states.groupDisabled || limitReached.value;
});
const instance = (0, vue.getCurrentInstance)();
const contains = (arr = [], target) => {
if (!isObject$1(props.value)) return arr && arr.includes(target);
else {
const valueKey = select.props.valueKey;
return arr && arr.some((item) => {
return (0, vue.toRaw)(get(item, valueKey)) === get(target, valueKey);
});
}
};
const hoverItem = () => {
if (!isDisabled.value) select.states.hoveringIndex = select.optionsArray.indexOf(instance.proxy);
};
const updateOption = (query) => {
states.visible = new RegExp(escapeStringRegexp(query), "i").test(String(currentLabel.value)) || props.created;
};
(0, vue.watch)(() => currentLabel.value, () => {
if (!props.created && !select.props.remote) select.setSelected();
});
(0, vue.watch)(() => props.value, (val, oldVal) => {
const { remote, valueKey } = select.props;
if (remote ? val !== oldVal : !isEqual$1(val, oldVal)) {
select.onOptionDestroy(oldVal, instance.proxy);
select.onOptionCreate(instance.proxy);
}
if (!props.created && !remote) {
if (valueKey && isObject$1(val) && isObject$1(oldVal) && val[valueKey] === oldVal[valueKey]) return;
select.setSelected();
}
});
(0, vue.watch)(() => selectGroup.disabled, () => {
states.groupDisabled = selectGroup.disabled;
}, { immediate: true });
return {
select,
currentLabel,
currentValue,
itemSelected,
isDisabled,
hoverItem,
updateOption
};
}
//#endregion
//#region ../../packages/components/select/src/option.vue?vue&type=script&lang.ts
var option_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: COMPONENT_NAME$14,
componentName: COMPONENT_NAME$14,
props: optionProps,
setup(props) {
const ns = useNamespace("select");
const id = useId();
const containerKls = (0, vue.computed)(() => [
ns.be("dropdown", "item"),
ns.is("disabled", (0, vue.unref)(isDisabled)),
ns.is("selected", (0, vue.unref)(itemSelected)),
ns.is("hovering", (0, vue.unref)(hover))
]);
const states = (0, vue.reactive)({
index: -1,
groupDisabled: false,
visible: true,
hover: false
});
const { currentLabel, itemSelected, isDisabled, select, hoverItem, updateOption } = useOption$1(props, states);
const { visible, hover } = (0, vue.toRefs)(states);
const vm = (0, vue.getCurrentInstance)().proxy;
select.onOptionCreate(vm);
(0, vue.onBeforeUnmount)(() => {
const key = vm.value;
(0, vue.nextTick)(() => {
const { selected: selectedOptions } = select.states;
const doesSelected = selectedOptions.some((item) => {
return item.value === vm.value;
});
if (select.states.cachedOptions.get(key) === vm && !doesSelected) select.states.cachedOptions.delete(key);
});
select.onOptionDestroy(key, vm);
});
function selectOptionClick() {
if (!isDisabled.value) select.handleOptionSelect(vm);
}
const handleMousedown = (event) => {
let target = event.target;
const currentTarget = event.currentTarget;
while (target && target !== currentTarget) {
if (isFocusable(target)) return;
target = target.parentElement;
}
event.preventDefault();
};
return {
ns,
id,
containerKls,
currentLabel,
itemSelected,
isDisabled,
select,
visible,
hover,
states,
hoverItem,
handleMousedown,
updateOption,
selectOptionClick
};
}
});
//#endregion
//#region ../../packages/components/select/src/option.vue
const _hoisted_1$66 = [
"id",
"aria-disabled",
"aria-selected"
];
function _sfc_render$20(_ctx, _cache, $props, $setup, $data, $options) {
return (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
id: _ctx.id,
class: (0, vue.normalizeClass)(_ctx.containerKls),
role: "option",
"aria-disabled": _ctx.isDisabled || void 0,
"aria-selected": _ctx.itemSelected,
onMousemove: _cache[0] || (_cache[0] = (...args) => _ctx.hoverItem && _ctx.hoverItem(...args)),
onMousedown: _cache[1] || (_cache[1] = (...args) => _ctx.handleMousedown && _ctx.handleMousedown(...args)),
onClick: _cache[2] || (_cache[2] = (0, vue.withModifiers)((...args) => _ctx.selectOptionClick && _ctx.selectOptionClick(...args), ["stop"]))
}, [(0, vue.renderSlot)(_ctx.$slots, "default", {}, () => [(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(_ctx.currentLabel), 1)])], 42, _hoisted_1$66)), [[vue.vShow, _ctx.visible]]);
}
var option_default = /* @__PURE__ */ _plugin_vue_export_helper_default(option_vue_vue_type_script_lang_default, [["render", _sfc_render$20]]);
//#endregion
//#region ../../packages/components/select/src/select-dropdown.vue?vue&type=script&lang.ts
var select_dropdown_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElSelectDropdown",
componentName: "ElSelectDropdown",
setup() {
const select = (0, vue.inject)(selectKey);
const ns = useNamespace("select");
const popperClass = (0, vue.computed)(() => select.props.popperClass);
const isMultiple = (0, vue.computed)(() => select.props.multiple);
const isFitInputWidth = (0, vue.computed)(() => select.props.fitInputWidth);
const minWidth = (0, vue.ref)("");
function updateMinWidth() {
const offsetWidth = select.selectRef?.offsetWidth;
if (offsetWidth) minWidth.value = `${offsetWidth - BORDER_HORIZONTAL_WIDTH}px`;
else minWidth.value = "";
}
(0, vue.onMounted)(() => {
updateMinWidth();
useResizeObserver(select.selectRef, updateMinWidth);
});
return {
ns,
minWidth,
popperClass,
isMultiple,
isFitInputWidth
};
}
});
//#endregion
//#region ../../packages/components/select/src/select-dropdown.vue
function _sfc_render$19(_ctx, _cache, $props, $setup, $data, $options) {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
class: (0, vue.normalizeClass)([
_ctx.ns.b("dropdown"),
_ctx.ns.is("multiple", _ctx.isMultiple),
_ctx.popperClass
]),
style: (0, vue.normalizeStyle)({ [_ctx.isFitInputWidth ? "width" : "minWidth"]: _ctx.minWidth })
}, [
_ctx.$slots.header ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)(_ctx.ns.be("dropdown", "header"))
}, [(0, vue.renderSlot)(_ctx.$slots, "header")], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.renderSlot)(_ctx.$slots, "default"),
_ctx.$slots.footer ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)(_ctx.ns.be("dropdown", "footer"))
}, [(0, vue.renderSlot)(_ctx.$slots, "footer")], 2)) : (0, vue.createCommentVNode)("v-if", true)
], 6);
}
var select_dropdown_default$1 = /* @__PURE__ */ _plugin_vue_export_helper_default(select_dropdown_vue_vue_type_script_lang_default, [["render", _sfc_render$19]]);
//#endregion
//#region ../../packages/components/select/src/useSelect.ts
const useSelect$2 = (props, emit) => {
const { t } = useLocale();
const slots = (0, vue.useSlots)();
const contentId = useId();
const nsSelect = useNamespace("select");
const nsInput = useNamespace("input");
const states = (0, vue.reactive)({
inputValue: "",
options: /* @__PURE__ */ new Map(),
cachedOptions: /* @__PURE__ */ new Map(),
optionValues: [],
selected: [],
selectionWidth: 0,
collapseItemWidth: 0,
selectedLabel: "",
hoveringIndex: -1,
previousQuery: null,
inputHovering: false,
menuVisibleOnFocus: false,
isBeforeHide: false
});
const selectRef = (0, vue.ref)();
const selectionRef = (0, vue.ref)();
const tooltipRef = (0, vue.ref)();
const tagTooltipRef = (0, vue.ref)();
const inputRef = (0, vue.ref)();
const prefixRef = (0, vue.ref)();
const suffixRef = (0, vue.ref)();
const menuRef = (0, vue.ref)();
const tagMenuRef = (0, vue.ref)();
const collapseItemRef = (0, vue.ref)();
const scrollbarRef = (0, vue.ref)();
const expanded = (0, vue.ref)(false);
const hoverOption = (0, vue.ref)();
const debouncing = (0, vue.ref)(false);
const { form, formItem } = useFormItem();
const { inputId } = useFormItemInputId(props, { formItemContext: formItem });
const { valueOnClear, isEmptyValue } = useEmptyValues(props);
const { isComposing, handleCompositionStart, handleCompositionUpdate, handleCompositionEnd } = useComposition({ afterComposition: (e) => onInput(e) });
const selectDisabled = useFormDisabled();
const { wrapperRef, isFocused, handleBlur } = useFocusController(inputRef, {
disabled: selectDisabled,
afterFocus() {
if (props.automaticDropdown && !expanded.value) {
expanded.value = true;
states.menuVisibleOnFocus = true;
}
},
beforeBlur(event) {
return tooltipRef.value?.isFocusInsideContent(event) || tagTooltipRef.value?.isFocusInsideContent(event);
},
afterBlur() {
expanded.value = false;
states.menuVisibleOnFocus = false;
if (props.validateEvent) formItem?.validate?.("blur").catch((err) => /* @__PURE__ */ debugWarn(err));
}
});
const hasModelValue = (0, vue.computed)(() => {
return isArray$1(props.modelValue) ? props.modelValue.length > 0 : !isEmptyValue(props.modelValue);
});
const needStatusIcon = (0, vue.computed)(() => form?.statusIcon ?? false);
const showClearBtn = (0, vue.computed)(() => {
return props.clearable && !selectDisabled.value && hasModelValue.value && (isFocused.value || states.inputHovering);
});
const iconComponent = (0, vue.computed)(() => props.remote && props.filterable && !props.remoteShowSuffix ? "" : props.suffixIcon);
const iconReverse = (0, vue.computed)(() => nsSelect.is("reverse", !!(iconComponent.value && expanded.value)));
const validateState = (0, vue.computed)(() => formItem?.validateState || "");
const validateIcon = (0, vue.computed)(() => validateState.value && ValidateComponentsMap[validateState.value]);
const debounce = (0, vue.computed)(() => props.remote ? props.debounce : 0);
const isRemoteSearchEmpty = (0, vue.computed)(() => props.remote && !states.inputValue && states.options.size === 0);
const emptyText = (0, vue.computed)(() => {
if (props.loading) return props.loadingText || t("el.select.loading");
else {
if (props.filterable && states.inputValue && states.options.size > 0 && filteredOptionsCount.value === 0) return props.noMatchText || t("el.select.noMatch");
if (states.options.size === 0) return props.noDataText || t("el.select.noData");
}
return null;
});
const filteredOptionsCount = (0, vue.computed)(() => optionsArray.value.filter((option) => option.visible).length);
const optionsArray = (0, vue.computed)(() => {
const list = Array.from(states.options.values());
const newList = [];
states.optionValues.forEach((item) => {
const index = list.findIndex((i) => i.value === item);
if (index > -1) newList.push(list[index]);
});
return newList.length >= list.length ? newList : list;
});
const cachedOptionsArray = (0, vue.computed)(() => Array.from(states.cachedOptions.values()));
const showNewOption = (0, vue.computed)(() => {
const hasExistingOption = optionsArray.value.filter((option) => {
return !option.created;
}).some((option) => {
return option.currentLabel === states.inputValue;
});
return props.filterable && props.allowCreate && states.inputValue !== "" && !hasExistingOption;
});
const updateOptions = () => {
if (props.filterable && isFunction$1(props.filterMethod)) return;
if (props.filterable && props.remote && isFunction$1(props.remoteMethod)) return;
optionsArray.value.forEach((option) => {
option.updateOption?.(states.inputValue);
});
};
const selectSize = useFormSize();
const collapseTagSize = (0, vue.computed)(() => ["small"].includes(selectSize.value) ? "small" : "default");
const dropdownMenuVisible = (0, vue.computed)({
get() {
return expanded.value && (props.loading || !isRemoteSearchEmpty.value || props.remote && !!slots.empty) && (!debouncing.value || !isEmpty(states.previousQuery) || states.options.size > 0);
},
set(val) {
expanded.value = val;
}
});
const shouldShowPlaceholder = (0, vue.computed)(() => {
if (props.multiple && !isUndefined(props.modelValue)) return castArray$1(props.modelValue).length === 0 && !states.inputValue;
const value = isArray$1(props.modelValue) ? props.modelValue[0] : props.modelValue;
return props.filterable || isUndefined(value) ? !states.inputValue : true;
});
const currentPlaceholder = (0, vue.computed)(() => {
const _placeholder = props.placeholder ?? t("el.select.placeholder");
return props.multiple || !hasModelValue.value ? _placeholder : states.selectedLabel;
});
const mouseEnterEventName = (0, vue.computed)(() => isIOS ? null : "mouseenter");
(0, vue.watch)(() => props.modelValue, (val, oldVal) => {
if (props.multiple) {
if (props.filterable && !props.reserveKeyword) {
states.inputValue = "";
handleQueryChange("");
}
}
setSelected();
if (!isEqual$1(val, oldVal) && props.validateEvent) formItem?.validate("change").catch((err) => /* @__PURE__ */ debugWarn(err));
}, {
flush: "post",
deep: true
});
(0, vue.watch)(() => expanded.value, (val) => {
if (val) handleQueryChange(states.inputValue);
else {
states.inputValue = "";
states.previousQuery = null;
states.isBeforeHide = true;
states.menuVisibleOnFocus = false;
}
});
(0, vue.watch)(() => states.options.entries(), () => {
if (!isClient) return;
setSelected();
if (props.defaultFirstOption && (props.filterable || props.remote) && filteredOptionsCount.value) checkDefaultFirstOption();
}, { flush: "post" });
(0, vue.watch)([() => states.hoveringIndex, optionsArray], ([val]) => {
if (isNumber(val) && val > -1) hoverOption.value = optionsArray.value[val] || {};
else hoverOption.value = {};
optionsArray.value.forEach((option) => {
option.hover = hoverOption.value === option;
});
});
(0, vue.watchEffect)(() => {
if (states.isBeforeHide) return;
updateOptions();
});
const handleQueryChange = (val) => {
if (states.previousQuery === val || isComposing.value) return;
states.previousQuery = val;
if (props.filterable && isFunction$1(props.filterMethod)) props.filterMethod(val);
else if (props.filterable && props.remote && isFunction$1(props.remoteMethod)) props.remoteMethod(val);
if (props.defaultFirstOption && (props.filterable || props.remote) && filteredOptionsCount.value) (0, vue.nextTick)(checkDefaultFirstOption);
else (0, vue.nextTick)(updateHoveringIndex);
};
/**
* find and highlight first option as default selected
* @remark
* - if the first option in dropdown list is user-created,
* it would be at the end of the optionsArray
* so find it and set hover.
* (NOTE: there must be only one user-created option in dropdown list with query)
* - if there's no user-created option in list, just find the first one as usual
* (NOTE: exclude options that are disabled or in disabled-group)
*/
const checkDefaultFirstOption = () => {
const optionsInDropdown = optionsArray.value.filter((n) => n.visible && !n.disabled && !n.states.groupDisabled);
const userCreatedOption = optionsInDropdown.find((n) => n.created);
const firstOriginOption = optionsInDropdown[0];
states.hoveringIndex = getValueIndex(optionsArray.value.map((item) => item.value), userCreatedOption || firstOriginOption);
};
const setSelected = () => {
if (!props.multiple) {
const option = getOption(isArray$1(props.modelValue) ? props.modelValue[0] : props.modelValue);
states.selectedLabel = option.currentLabel;
states.selected = [option];
return;
} else states.selectedLabel = "";
const result = [];
if (!isUndefined(props.modelValue)) castArray$1(props.modelValue).forEach((value) => {
result.push(getOption(value));
});
states.selected = result;
};
const getOption = (value) => {
let option;
const isObjectValue = isPlainObject$1(value);
for (let i = states.cachedOptions.size - 1; i >= 0; i--) {
const cachedOption = cachedOptionsArray.value[i];
if (isObjectValue ? get(cachedOption.value, props.valueKey) === get(value, props.valueKey) : cachedOption.value === value) {
option = {
index: optionsArray.value.filter((opt) => !opt.created).indexOf(cachedOption),
value,
currentLabel: cachedOption.currentLabel,
get isDisabled() {
return cachedOption.isDisabled;
}
};
break;
}
}
if (option) return option;
return {
index: -1,
value,
currentLabel: isObjectValue ? value.label : value ?? ""
};
};
const updateHoveringIndex = () => {
const length = states.selected.length;
if (length > 0) {
const lastOption = states.selected[length - 1];
states.hoveringIndex = optionsArray.value.findIndex((item) => getValueKey(lastOption) === getValueKey(item));
} else states.hoveringIndex = -1;
};
const resetSelectionWidth = () => {
states.selectionWidth = Number.parseFloat(window.getComputedStyle(selectionRef.value).width);
};
const resetCollapseItemWidth = () => {
states.collapseItemWidth = collapseItemRef.value.getBoundingClientRect().width;
};
const updateTooltip = () => {
tooltipRef.value?.updatePopper?.();
};
const updateTagTooltip = () => {
tagTooltipRef.value?.updatePopper?.();
};
const onInputChange = () => {
if (states.inputValue.length > 0 && !expanded.value) expanded.value = true;
handleQueryChange(states.inputValue);
};
const onInput = (event) => {
states.inputValue = event.target.value;
if (props.remote) {
debouncing.value = true;
debouncedOnInputChange();
} else return onInputChange();
};
const debouncedOnInputChange = useDebounceFn(() => {
onInputChange();
debouncing.value = false;
}, debounce);
const emitChange = (val) => {
if (!isEqual$1(props.modelValue, val)) emit(CHANGE_EVENT, val);
};
const getLastNotDisabledIndex = (value) => findLastIndex(value, (it) => {
const option = states.cachedOptions.get(it);
return !option?.disabled && !option?.states.groupDisabled;
});
const deletePrevTag = (e) => {
const code = getEventCode(e);
if (!props.multiple) return;
if (code === EVENT_CODE.delete) return;
if (e.target.value.length <= 0) {
const value = castArray$1(props.modelValue).slice();
const lastNotDisabledIndex = getLastNotDisabledIndex(value);
if (lastNotDisabledIndex < 0) return;
const removeTagValue = value[lastNotDisabledIndex];
value.splice(lastNotDisabledIndex, 1);
emit(UPDATE_MODEL_EVENT, value);
emitChange(value);
emit("remove-tag", removeTagValue);
}
};
const deleteTag = (event, tag) => {
const index = states.selected.indexOf(tag);
if (index > -1 && !selectDisabled.value) {
const value = castArray$1(props.modelValue).slice();
value.splice(index, 1);
emit(UPDATE_MODEL_EVENT, value);
emitChange(value);
emit("remove-tag", tag.value);
}
event.stopPropagation();
focus();
};
const deleteSelected = (event) => {
event.stopPropagation();
const value = props.multiple ? [] : valueOnClear.value;
if (props.multiple) {
for (const item of states.selected) if (item.isDisabled) value.push(item.value);
}
emit(UPDATE_MODEL_EVENT, value);
emitChange(value);
states.hoveringIndex = -1;
expanded.value = false;
emit("clear");
focus();
};
const handleOptionSelect = (option) => {
if (props.multiple) {
const value = castArray$1(props.modelValue ?? []).slice();
const optionIndex = getValueIndex(value, option);
if (optionIndex > -1) value.splice(optionIndex, 1);
else if (props.multipleLimit <= 0 || value.length < props.multipleLimit) value.push(option.value);
emit(UPDATE_MODEL_EVENT, value);
emitChange(value);
if (option.created) handleQueryChange("");
if (props.filterable && (option.created || !props.reserveKeyword)) states.inputValue = "";
} else {
!isEqual$1(props.modelValue, option.value) && emit(UPDATE_MODEL_EVENT, option.value);
emitChange(option.value);
expanded.value = false;
}
focus();
if (expanded.value) return;
(0, vue.nextTick)(() => {
scrollToOption(option);
});
};
const getValueIndex = (arr, option) => {
if (isUndefined(option)) return -1;
if (!isObject$1(option.value)) return arr.indexOf(option.value);
return arr.findIndex((item) => {
return isEqual$1(get(item, props.valueKey), getValueKey(option));
});
};
const scrollToOption = (option) => {
const targetOption = isArray$1(option) ? option[option.length - 1] : option;
let target = null;
if (!isNil(targetOption?.value)) {
const options = optionsArray.value.filter((item) => item.value === targetOption.value);
if (options.length > 0) target = options[0].$el;
}
if (tooltipRef.value && target) {
const menu = tooltipRef.value?.popperRef?.contentRef?.querySelector?.(`.${nsSelect.be("dropdown", "wrap")}`);
if (menu) scrollIntoView(menu, target);
}
scrollbarRef.value?.handleScroll();
};
const onOptionCreate = (vm) => {
states.options.set(vm.value, vm);
states.cachedOptions.set(vm.value, vm);
};
const onOptionDestroy = (key, vm) => {
if (states.options.get(key) === vm) states.options.delete(key);
};
const popperRef = (0, vue.computed)(() => {
return tooltipRef.value?.popperRef?.contentRef;
});
const handleMenuEnter = () => {
states.isBeforeHide = false;
(0, vue.nextTick)(() => {
scrollbarRef.value?.update();
scrollToOption(states.selected);
});
};
const focus = () => {
inputRef.value?.focus();
};
const blur = () => {
if (expanded.value) {
expanded.value = false;
(0, vue.nextTick)(() => inputRef.value?.blur());
return;
}
inputRef.value?.blur();
};
const handleClearClick = (event) => {
deleteSelected(event);
};
const handleClickOutside = (event) => {
expanded.value = false;
if (isFocused.value) {
const _event = new FocusEvent("blur", event);
(0, vue.nextTick)(() => handleBlur(_event));
}
};
const handleEsc = () => {
if (states.inputValue.length > 0) states.inputValue = "";
else expanded.value = false;
};
const toggleMenu = (event) => {
if (selectDisabled.value || props.filterable && expanded.value && event && !suffixRef.value?.contains(event.target)) return;
if (isIOS) states.inputHovering = true;
if (states.menuVisibleOnFocus) states.menuVisibleOnFocus = false;
else expanded.value = !expanded.value;
};
const selectOption = () => {
if (!expanded.value) toggleMenu();
else {
const option = optionsArray.value[states.hoveringIndex];
if (option && !option.isDisabled) handleOptionSelect(option);
}
};
const getValueKey = (item) => {
return isObject$1(item.value) ? get(item.value, props.valueKey) : item.value;
};
const optionsAllDisabled = (0, vue.computed)(() => optionsArray.value.filter((option) => option.visible).every((option) => option.isDisabled));
const showTagList = (0, vue.computed)(() => {
if (!props.multiple) return [];
return props.collapseTags ? states.selected.slice(0, props.maxCollapseTags) : states.selected;
});
const collapseTagList = (0, vue.computed)(() => {
if (!props.multiple) return [];
return props.collapseTags ? states.selected.slice(props.maxCollapseTags) : [];
});
const navigateOptions = (direction) => {
if (!expanded.value) {
expanded.value = true;
return;
}
if (states.options.size === 0 || filteredOptionsCount.value === 0 || isComposing.value) return;
if (!optionsAllDisabled.value) {
if (direction === "next") {
states.hoveringIndex++;
if (states.hoveringIndex === states.options.size) states.hoveringIndex = 0;
} else if (direction === "prev") {
states.hoveringIndex--;
if (states.hoveringIndex < 0) states.hoveringIndex = states.options.size - 1;
}
const option = optionsArray.value[states.hoveringIndex];
if (option.isDisabled || !option.visible) navigateOptions(direction);
(0, vue.nextTick)(() => scrollToOption(hoverOption.value));
}
};
const findFocusableIndex = (arr, start, step, len) => {
for (let i = start; i >= 0 && i < len; i += step) {
const obj = arr[i];
if (!obj?.isDisabled && obj?.visible) return i;
}
return null;
};
const focusOption = (targetIndex, mode) => {
const len = states.options.size;
if (len === 0) return;
const start = clamp$1(targetIndex, 0, len - 1);
const options = optionsArray.value;
const direction = mode === "up" ? -1 : 1;
const newIndex = findFocusableIndex(options, start, direction, len) ?? findFocusableIndex(options, start - direction, -direction, len);
if (newIndex != null) {
states.hoveringIndex = newIndex;
(0, vue.nextTick)(() => scrollToOption(hoverOption.value));
}
};
const handleKeydown = (e) => {
const code = getEventCode(e);
let isPreventDefault = true;
switch (code) {
case EVENT_CODE.up:
navigateOptions("prev");
break;
case EVENT_CODE.down:
navigateOptions("next");
break;
case EVENT_CODE.enter:
case EVENT_CODE.numpadEnter:
if (!isComposing.value) selectOption();
break;
case EVENT_CODE.esc:
handleEsc();
break;
case EVENT_CODE.backspace:
isPreventDefault = false;
deletePrevTag(e);
return;
case EVENT_CODE.home:
if (!expanded.value) return;
focusOption(0, "down");
break;
case EVENT_CODE.end:
if (!expanded.value) return;
focusOption(states.options.size - 1, "up");
break;
case EVENT_CODE.pageUp:
if (!expanded.value) return;
focusOption(states.hoveringIndex - 10, "up");
break;
case EVENT_CODE.pageDown:
if (!expanded.value) return;
focusOption(states.hoveringIndex + 10, "down");
break;
default:
isPreventDefault = false;
break;
}
if (isPreventDefault) {
e.preventDefault();
e.stopPropagation();
}
};
const getGapWidth = () => {
if (!selectionRef.value) return 0;
const style = window.getComputedStyle(selectionRef.value);
return Number.parseFloat(style.gap || "6px");
};
const tagStyle = (0, vue.computed)(() => {
const gapWidth = getGapWidth();
const inputSlotWidth = props.filterable ? gapWidth + MINIMUM_INPUT_WIDTH : 0;
return { maxWidth: `${collapseItemRef.value && props.maxCollapseTags === 1 ? states.selectionWidth - states.collapseItemWidth - gapWidth - inputSlotWidth : states.selectionWidth - inputSlotWidth}px` };
});
const collapseTagStyle = (0, vue.computed)(() => {
return { maxWidth: `${states.selectionWidth}px` };
});
const popupScroll = (data) => {
emit("popup-scroll", data);
};
useResizeObserver(selectionRef, resetSelectionWidth);
useResizeObserver(wrapperRef, updateTooltip);
useResizeObserver(tagMenuRef, updateTagTooltip);
useResizeObserver(collapseItemRef, resetCollapseItemWidth);
let stop;
(0, vue.watch)(() => dropdownMenuVisible.value, (newVal) => {
if (newVal) stop = useResizeObserver(menuRef, updateTooltip).stop;
else {
stop?.();
stop = void 0;
}
emit("visible-change", newVal);
});
(0, vue.onMounted)(() => {
setSelected();
});
return {
inputId,
contentId,
nsSelect,
nsInput,
states,
isFocused,
expanded,
optionsArray,
hoverOption,
selectSize,
filteredOptionsCount,
updateTooltip,
updateTagTooltip,
debouncedOnInputChange,
onInput,
deletePrevTag,
deleteTag,
deleteSelected,
handleOptionSelect,
scrollToOption,
hasModelValue,
shouldShowPlaceholder,
currentPlaceholder,
mouseEnterEventName,
needStatusIcon,
showClearBtn,
iconComponent,
iconReverse,
validateState,
validateIcon,
showNewOption,
updateOptions,
collapseTagSize,
setSelected,
selectDisabled,
emptyText,
handleCompositionStart,
handleCompositionUpdate,
handleCompositionEnd,
handleKeydown,
onOptionCreate,
onOptionDestroy,
handleMenuEnter,
focus,
blur,
handleClearClick,
handleClickOutside,
handleEsc,
toggleMenu,
selectOption,
getValueKey,
navigateOptions,
dropdownMenuVisible,
showTagList,
collapseTagList,
popupScroll,
getOption,
tagStyle,
collapseTagStyle,
popperRef,
inputRef,
tooltipRef,
tagTooltipRef,
prefixRef,
suffixRef,
selectRef,
wrapperRef,
selectionRef,
scrollbarRef,
menuRef,
tagMenuRef,
collapseItemRef
};
};
//#endregion
//#region ../../packages/components/select/src/options.ts
var options_default = (0, vue.defineComponent)({
name: "ElOptions",
setup(_, { slots }) {
const select = (0, vue.inject)(selectKey);
let cachedValueList = [];
return () => {
const children = slots.default?.();
const valueList = [];
function filterOptions(children) {
if (!isArray$1(children)) return;
children.forEach((item) => {
const name = (item?.type || {})?.name;
if (name === "ElOptionGroup") filterOptions(!isString(item.children) && !isArray$1(item.children) && isFunction$1(item.children?.default) ? item.children?.default() : item.children);
else if (name === "ElOption") valueList.push(item.props?.value);
else if (isArray$1(item.children)) filterOptions(item.children);
});
}
if (children.length) filterOptions(children[0]?.children);
if (!isEqual$1(valueList, cachedValueList)) {
cachedValueList = valueList;
if (select) select.states.optionValues = valueList;
}
return children;
};
}
});
//#endregion
//#region ../../packages/components/select/src/select.ts
const selectProps = buildProps({
name: String,
id: String,
modelValue: {
type: definePropType([
Array,
String,
Number,
Boolean,
Object
]),
default: void 0
},
autocomplete: {
type: String,
default: "off"
},
automaticDropdown: Boolean,
size: useSizeProp,
effect: {
type: definePropType(String),
default: "light"
},
disabled: {
type: Boolean,
default: void 0
},
clearable: Boolean,
filterable: Boolean,
allowCreate: Boolean,
loading: Boolean,
popperClass: {
type: String,
default: ""
},
popperStyle: { type: definePropType([String, Object]) },
popperOptions: {
type: definePropType(Object),
default: () => ({})
},
remote: Boolean,
debounce: {
type: Number,
default: 300
},
loadingText: String,
noMatchText: String,
noDataText: String,
remoteMethod: { type: definePropType(Function) },
filterMethod: { type: definePropType(Function) },
multiple: Boolean,
multipleLimit: {
type: Number,
default: 0
},
placeholder: { type: String },
defaultFirstOption: Boolean,
reserveKeyword: {
type: Boolean,
default: true
},
valueKey: {
type: String,
default: "value"
},
collapseTags: Boolean,
collapseTagsTooltip: Boolean,
tagTooltip: {
type: definePropType(Object),
default: () => ({})
},
maxCollapseTags: {
type: Number,
default: 1
},
teleported: useTooltipContentProps.teleported,
persistent: {
type: Boolean,
default: true
},
clearIcon: {
type: iconPropType,
default: circle_close_default
},
fitInputWidth: Boolean,
suffixIcon: {
type: iconPropType,
default: arrow_down_default
},
tagType: {
...tagProps.type,
default: "info"
},
tagEffect: {
...tagProps.effect,
default: "light"
},
validateEvent: {
type: Boolean,
default: true
},
remoteShowSuffix: Boolean,
showArrow: {
type: Boolean,
default: true
},
offset: {
type: Number,
default: 12
},
placement: {
type: definePropType(String),
values: Ee,
default: "bottom-start"
},
fallbackPlacements: {
type: definePropType(Array),
default: [
"bottom-start",
"top-start",
"right",
"left"
]
},
tabindex: {
type: [String, Number],
default: 0
},
appendTo: useTooltipContentProps.appendTo,
options: { type: definePropType(Array) },
props: {
type: definePropType(Object),
default: () => defaultProps$2
},
...useEmptyValuesProps,
...useAriaProps(["ariaLabel"])
});
const selectEmits = {
[UPDATE_MODEL_EVENT]: (val) => true,
[CHANGE_EVENT]: (val) => true,
"popup-scroll": scrollbarEmits.scroll,
"remove-tag": (val) => true,
"visible-change": (visible) => true,
focus: (evt) => evt instanceof FocusEvent,
blur: (evt) => evt instanceof FocusEvent,
clear: () => true
};
//#endregion
//#region ../../packages/components/select/src/option-group.vue?vue&type=script&lang.ts
var option_group_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElOptionGroup",
componentName: "ElOptionGroup",
props: {
label: String,
disabled: Boolean
},
setup(props) {
const ns = useNamespace("select");
const groupRef = (0, vue.ref)();
const instance = (0, vue.getCurrentInstance)();
const children = (0, vue.ref)([]);
(0, vue.provide)(selectGroupKey, (0, vue.reactive)({ ...(0, vue.toRefs)(props) }));
const visible = (0, vue.computed)(() => children.value.some((option) => option.visible === true));
const isOption = (node) => node.type.name === "ElOption" && !!node.component?.proxy;
const flattedChildren = (node) => {
const nodes = castArray$1(node);
const children = [];
nodes.forEach((child) => {
if (!(0, vue.isVNode)(child)) return;
if (isOption(child)) children.push(child.component.proxy);
else if (isArray$1(child.children) && child.children.length) children.push(...flattedChildren(child.children));
else if (child.component?.subTree) children.push(...flattedChildren(child.component.subTree));
});
return children;
};
const updateChildren = () => {
children.value = flattedChildren(instance.subTree);
};
(0, vue.onMounted)(() => {
updateChildren();
});
useMutationObserver(groupRef, updateChildren, {
attributes: true,
subtree: true,
childList: true
});
return {
groupRef,
visible,
ns
};
}
});
//#endregion
//#region ../../packages/components/select/src/option-group.vue
function _sfc_render$18(_ctx, _cache, $props, $setup, $data, $options) {
return (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("ul", {
ref: "groupRef",
class: (0, vue.normalizeClass)(_ctx.ns.be("group", "wrap"))
}, [(0, vue.createElementVNode)("li", { class: (0, vue.normalizeClass)(_ctx.ns.be("group", "title")) }, (0, vue.toDisplayString)(_ctx.label), 3), (0, vue.createElementVNode)("li", null, [(0, vue.createElementVNode)("ul", { class: (0, vue.normalizeClass)(_ctx.ns.b("group")) }, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2)])], 2)), [[vue.vShow, _ctx.visible]]);
}
var option_group_default = /* @__PURE__ */ _plugin_vue_export_helper_default(option_group_vue_vue_type_script_lang_default, [["render", _sfc_render$18]]);
//#endregion
//#region ../../packages/components/select/src/select.vue?vue&type=script&lang.ts
const COMPONENT_NAME$13 = "ElSelect";
const warnHandlerMap = /* @__PURE__ */ new WeakMap();
const createSelectWarnHandler = (appContext) => {
return (...args) => {
const message = args[0];
if (!message || message.includes("Slot \"default\" invoked outside of the render function") && args[2]?.includes("ElTreeSelect")) return;
const original = warnHandlerMap.get(appContext)?.originalWarnHandler;
if (original) {
original(...args);
return;
}
console.warn(...args);
};
};
const getWarnHandlerRecord = (appContext) => {
let record = warnHandlerMap.get(appContext);
if (!record) {
record = {
originalWarnHandler: appContext.config.warnHandler,
handler: createSelectWarnHandler(appContext),
count: 0
};
warnHandlerMap.set(appContext, record);
}
return record;
};
var select_vue_vue_type_script_lang_default$1 = (0, vue.defineComponent)({
name: COMPONENT_NAME$13,
componentName: COMPONENT_NAME$13,
components: {
ElSelectMenu: select_dropdown_default$1,
ElOption: option_default,
ElOptions: options_default,
ElOptionGroup: option_group_default,
ElTag,
ElScrollbar,
ElTooltip,
ElIcon
},
directives: { ClickOutside },
props: selectProps,
emits: [
UPDATE_MODEL_EVENT,
CHANGE_EVENT,
"remove-tag",
"clear",
"visible-change",
"focus",
"blur",
"popup-scroll"
],
setup(props, { emit, slots }) {
const instance = (0, vue.getCurrentInstance)();
const warnRecord = getWarnHandlerRecord(instance.appContext);
warnRecord.count += 1;
instance.appContext.config.warnHandler = warnRecord.handler;
const modelValue = (0, vue.computed)(() => {
const { modelValue: rawModelValue, multiple } = props;
const fallback = multiple ? [] : void 0;
if (isArray$1(rawModelValue)) return multiple ? rawModelValue : fallback;
return multiple ? fallback : rawModelValue;
});
const _props = (0, vue.reactive)({
...(0, vue.toRefs)(props),
modelValue
});
const API = useSelect$2(_props, emit);
const { calculatorRef, inputStyle } = useCalcInputWidth();
const { getLabel, getValue, getOptions, getDisabled } = useProps(props);
const getOptionProps = (option) => ({
label: getLabel(option),
value: getValue(option),
disabled: getDisabled(option)
});
const flatTreeSelectData = (data) => {
return data.reduce((acc, item) => {
acc.push(item);
if (item.children && item.children.length > 0) acc.push(...flatTreeSelectData(item.children));
return acc;
}, []);
};
const manuallyRenderSlots = (vnodes) => {
flattedChildren(vnodes || []).forEach((item) => {
if (isObject$1(item) && (item.type.name === "ElOption" || item.type.name === "ElTree")) {
const _name = item.type.name;
if (_name === "ElTree") flatTreeSelectData(item.props?.data || []).forEach((treeItem) => {
treeItem.currentLabel = treeItem.label ?? (isObject$1(treeItem.value) ? "" : treeItem.value);
API.onOptionCreate(treeItem);
});
else if (_name === "ElOption") {
const obj = { ...item.props };
obj.currentLabel = obj.label ?? (isObject$1(obj.value) ? "" : obj.value);
API.onOptionCreate(obj);
}
}
});
};
(0, vue.watch)(() => [props.persistent || API.expanded.value || !slots.default ? void 0 : slots.default?.(), modelValue.value], () => {
if (props.persistent || API.expanded.value) return;
if (!slots.default) return;
API.states.options.clear();
manuallyRenderSlots(slots.default?.());
}, { immediate: true });
(0, vue.provide)(selectKey, (0, vue.reactive)({
props: _props,
states: API.states,
selectRef: API.selectRef,
optionsArray: API.optionsArray,
setSelected: API.setSelected,
handleOptionSelect: API.handleOptionSelect,
onOptionCreate: API.onOptionCreate,
onOptionDestroy: API.onOptionDestroy
}));
const selectedLabel = (0, vue.computed)(() => {
if (!props.multiple) return API.states.selectedLabel;
return API.states.selected.map((i) => i.currentLabel);
});
(0, vue.onBeforeUnmount)(() => {
const record = warnHandlerMap.get(instance.appContext);
if (!record) return;
record.count -= 1;
if (record.count <= 0) {
instance.appContext.config.warnHandler = record.originalWarnHandler;
warnHandlerMap.delete(instance.appContext);
}
});
return {
...API,
modelValue,
selectedLabel,
calculatorRef,
inputStyle,
getLabel,
getValue,
getOptions,
getDisabled,
getOptionProps
};
}
});
//#endregion
//#region ../../packages/components/select/src/select.vue
const _hoisted_1$65 = [
"id",
"value",
"name",
"disabled",
"autocomplete",
"tabindex",
"readonly",
"aria-activedescendant",
"aria-controls",
"aria-expanded",
"aria-label"
];
const _hoisted_2$36 = ["textContent"];
const _hoisted_3$17 = { key: 1 };
function _sfc_render$17(_ctx, _cache, $props, $setup, $data, $options) {
const _component_el_tag = (0, vue.resolveComponent)("el-tag");
const _component_el_tooltip = (0, vue.resolveComponent)("el-tooltip");
const _component_el_icon = (0, vue.resolveComponent)("el-icon");
const _component_el_option = (0, vue.resolveComponent)("el-option");
const _component_el_option_group = (0, vue.resolveComponent)("el-option-group");
const _component_el_options = (0, vue.resolveComponent)("el-options");
const _component_el_scrollbar = (0, vue.resolveComponent)("el-scrollbar");
const _component_el_select_menu = (0, vue.resolveComponent)("el-select-menu");
const _directive_click_outside = (0, vue.resolveDirective)("click-outside");
return (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("div", (0, vue.mergeProps)({
ref: "selectRef",
class: [_ctx.nsSelect.b(), _ctx.nsSelect.m(_ctx.selectSize)]
}, { [(0, vue.toHandlerKey)(_ctx.mouseEnterEventName)]: _cache[11] || (_cache[11] = ($event) => _ctx.states.inputHovering = true) }, { onMouseleave: _cache[12] || (_cache[12] = ($event) => _ctx.states.inputHovering = false) }), [(0, vue.createVNode)(_component_el_tooltip, {
ref: "tooltipRef",
visible: _ctx.dropdownMenuVisible,
placement: _ctx.placement,
teleported: _ctx.teleported,
"popper-class": [_ctx.nsSelect.e("popper"), _ctx.popperClass],
"popper-style": _ctx.popperStyle,
"popper-options": _ctx.popperOptions,
"fallback-placements": _ctx.fallbackPlacements,
effect: _ctx.effect,
pure: "",
trigger: "click",
transition: `${_ctx.nsSelect.namespace.value}-zoom-in-top`,
"stop-popper-mouse-event": false,
"gpu-acceleration": false,
persistent: _ctx.persistent,
"append-to": _ctx.appendTo,
"show-arrow": _ctx.showArrow,
offset: _ctx.offset,
onBeforeShow: _ctx.handleMenuEnter,
onHide: _cache[10] || (_cache[10] = ($event) => _ctx.states.isBeforeHide = false)
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", {
ref: "wrapperRef",
class: (0, vue.normalizeClass)([
_ctx.nsSelect.e("wrapper"),
_ctx.nsSelect.is("focused", _ctx.isFocused),
_ctx.nsSelect.is("hovering", _ctx.states.inputHovering),
_ctx.nsSelect.is("filterable", _ctx.filterable),
_ctx.nsSelect.is("disabled", _ctx.selectDisabled)
]),
onClick: _cache[7] || (_cache[7] = (0, vue.withModifiers)((...args) => _ctx.toggleMenu && _ctx.toggleMenu(...args), ["prevent"]))
}, [
_ctx.$slots.prefix ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
ref: "prefixRef",
class: (0, vue.normalizeClass)(_ctx.nsSelect.e("prefix"))
}, [(0, vue.renderSlot)(_ctx.$slots, "prefix")], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", {
ref: "selectionRef",
class: (0, vue.normalizeClass)([_ctx.nsSelect.e("selection"), _ctx.nsSelect.is("near", _ctx.multiple && !_ctx.$slots.prefix && !!_ctx.states.selected.length)])
}, [
_ctx.multiple ? (0, vue.renderSlot)(_ctx.$slots, "tag", {
key: 0,
data: _ctx.states.selected,
deleteTag: _ctx.deleteTag,
selectDisabled: _ctx.selectDisabled
}, () => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(_ctx.showTagList, (item) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: _ctx.getValueKey(item),
class: (0, vue.normalizeClass)(_ctx.nsSelect.e("selected-item"))
}, [(0, vue.createVNode)(_component_el_tag, {
closable: !_ctx.selectDisabled && !item.isDisabled,
size: _ctx.collapseTagSize,
type: _ctx.tagType,
effect: _ctx.tagEffect,
"disable-transitions": "",
style: (0, vue.normalizeStyle)(_ctx.tagStyle),
onClose: ($event) => _ctx.deleteTag($event, item)
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)(_ctx.nsSelect.e("tags-text")) }, [(0, vue.renderSlot)(_ctx.$slots, "label", {
index: item.index,
label: item.currentLabel,
value: item.value
}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(item.currentLabel), 1)])], 2)]),
_: 2
}, 1032, [
"closable",
"size",
"type",
"effect",
"style",
"onClose"
])], 2);
}), 128)), _ctx.collapseTags && _ctx.states.selected.length > _ctx.maxCollapseTags ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_tooltip, {
key: 0,
ref: "tagTooltipRef",
disabled: _ctx.dropdownMenuVisible || !_ctx.collapseTagsTooltip,
"fallback-placements": _ctx.tagTooltip?.fallbackPlacements ?? [
"bottom",
"top",
"right",
"left"
],
effect: _ctx.tagTooltip?.effect ?? _ctx.effect,
placement: _ctx.tagTooltip?.placement ?? "bottom",
"popper-class": _ctx.tagTooltip?.popperClass ?? _ctx.popperClass,
"popper-style": _ctx.tagTooltip?.popperStyle ?? _ctx.popperStyle,
teleported: _ctx.tagTooltip?.teleported ?? _ctx.teleported,
"append-to": _ctx.tagTooltip?.appendTo ?? _ctx.appendTo,
"popper-options": _ctx.tagTooltip?.popperOptions ?? _ctx.popperOptions,
transition: _ctx.tagTooltip?.transition,
"show-after": _ctx.tagTooltip?.showAfter,
"hide-after": _ctx.tagTooltip?.hideAfter,
"auto-close": _ctx.tagTooltip?.autoClose,
offset: _ctx.tagTooltip?.offset
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", {
ref: "collapseItemRef",
class: (0, vue.normalizeClass)(_ctx.nsSelect.e("selected-item"))
}, [(0, vue.createVNode)(_component_el_tag, {
closable: false,
size: _ctx.collapseTagSize,
type: _ctx.tagType,
effect: _ctx.tagEffect,
"disable-transitions": "",
style: (0, vue.normalizeStyle)(_ctx.collapseTagStyle)
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)(_ctx.nsSelect.e("tags-text")) }, " + " + (0, vue.toDisplayString)(_ctx.states.selected.length - _ctx.maxCollapseTags), 3)]),
_: 1
}, 8, [
"size",
"type",
"effect",
"style"
])], 2)]),
content: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", {
ref: "tagMenuRef",
class: (0, vue.normalizeClass)(_ctx.nsSelect.e("selection"))
}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(_ctx.collapseTagList, (item) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: _ctx.getValueKey(item),
class: (0, vue.normalizeClass)(_ctx.nsSelect.e("selected-item"))
}, [(0, vue.createVNode)(_component_el_tag, {
class: "in-tooltip",
closable: !_ctx.selectDisabled && !item.isDisabled,
size: _ctx.collapseTagSize,
type: _ctx.tagType,
effect: _ctx.tagEffect,
"disable-transitions": "",
onClose: ($event) => _ctx.deleteTag($event, item)
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)(_ctx.nsSelect.e("tags-text")) }, [(0, vue.renderSlot)(_ctx.$slots, "label", {
index: item.index,
label: item.currentLabel,
value: item.value
}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(item.currentLabel), 1)])], 2)]),
_: 2
}, 1032, [
"closable",
"size",
"type",
"effect",
"onClose"
])], 2);
}), 128))], 2)]),
_: 3
}, 8, [
"disabled",
"fallback-placements",
"effect",
"placement",
"popper-class",
"popper-style",
"teleported",
"append-to",
"popper-options",
"transition",
"show-after",
"hide-after",
"auto-close",
"offset"
])) : (0, vue.createCommentVNode)("v-if", true)]) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)([
_ctx.nsSelect.e("selected-item"),
_ctx.nsSelect.e("input-wrapper"),
_ctx.nsSelect.is("hidden", !_ctx.filterable || _ctx.selectDisabled || !_ctx.states.inputValue && !_ctx.isFocused)
]) }, [(0, vue.createElementVNode)("input", {
id: _ctx.inputId,
ref: "inputRef",
value: _ctx.states.inputValue,
type: "text",
name: _ctx.name,
class: (0, vue.normalizeClass)([_ctx.nsSelect.e("input"), _ctx.nsSelect.is(_ctx.selectSize)]),
disabled: _ctx.selectDisabled,
autocomplete: _ctx.autocomplete,
style: (0, vue.normalizeStyle)(_ctx.inputStyle),
tabindex: _ctx.tabindex,
role: "combobox",
readonly: !_ctx.filterable,
spellcheck: "false",
"aria-activedescendant": _ctx.hoverOption?.id || "",
"aria-controls": _ctx.contentId,
"aria-expanded": _ctx.dropdownMenuVisible,
"aria-label": _ctx.ariaLabel,
"aria-autocomplete": "none",
"aria-haspopup": "listbox",
onKeydown: _cache[0] || (_cache[0] = (...args) => _ctx.handleKeydown && _ctx.handleKeydown(...args)),
onCompositionstart: _cache[1] || (_cache[1] = (...args) => _ctx.handleCompositionStart && _ctx.handleCompositionStart(...args)),
onCompositionupdate: _cache[2] || (_cache[2] = (...args) => _ctx.handleCompositionUpdate && _ctx.handleCompositionUpdate(...args)),
onCompositionend: _cache[3] || (_cache[3] = (...args) => _ctx.handleCompositionEnd && _ctx.handleCompositionEnd(...args)),
onInput: _cache[4] || (_cache[4] = (...args) => _ctx.onInput && _ctx.onInput(...args)),
onChange: _cache[5] || (_cache[5] = (0, vue.withModifiers)(() => {}, ["stop"])),
onClick: _cache[6] || (_cache[6] = (0, vue.withModifiers)((...args) => _ctx.toggleMenu && _ctx.toggleMenu(...args), ["stop"]))
}, null, 46, _hoisted_1$65), _ctx.filterable ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 0,
ref: "calculatorRef",
"aria-hidden": "true",
class: (0, vue.normalizeClass)(_ctx.nsSelect.e("input-calculator")),
textContent: (0, vue.toDisplayString)(_ctx.states.inputValue)
}, null, 10, _hoisted_2$36)) : (0, vue.createCommentVNode)("v-if", true)], 2),
_ctx.shouldShowPlaceholder ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)([
_ctx.nsSelect.e("selected-item"),
_ctx.nsSelect.e("placeholder"),
_ctx.nsSelect.is("transparent", !_ctx.hasModelValue || _ctx.expanded && !_ctx.states.inputValue)
])
}, [_ctx.hasModelValue ? (0, vue.renderSlot)(_ctx.$slots, "label", {
key: 0,
index: _ctx.getOption(_ctx.modelValue).index,
label: _ctx.currentPlaceholder,
value: _ctx.modelValue
}, () => [(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(_ctx.currentPlaceholder), 1)]) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_3$17, (0, vue.toDisplayString)(_ctx.currentPlaceholder), 1))], 2)) : (0, vue.createCommentVNode)("v-if", true)
], 2),
(0, vue.createElementVNode)("div", {
ref: "suffixRef",
class: (0, vue.normalizeClass)(_ctx.nsSelect.e("suffix"))
}, [
_ctx.iconComponent && !_ctx.showClearBtn ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_icon, {
key: 0,
class: (0, vue.normalizeClass)([
_ctx.nsSelect.e("caret"),
_ctx.nsSelect.e("icon"),
_ctx.iconReverse
])
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(_ctx.iconComponent)))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true),
_ctx.showClearBtn && _ctx.clearIcon ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_icon, {
key: 1,
class: (0, vue.normalizeClass)([
_ctx.nsSelect.e("caret"),
_ctx.nsSelect.e("icon"),
_ctx.nsSelect.e("clear")
]),
onClick: _ctx.handleClearClick
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(_ctx.clearIcon)))]),
_: 1
}, 8, ["class", "onClick"])) : (0, vue.createCommentVNode)("v-if", true),
_ctx.validateState && _ctx.validateIcon && _ctx.needStatusIcon ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_icon, {
key: 2,
class: (0, vue.normalizeClass)([
_ctx.nsInput.e("icon"),
_ctx.nsInput.e("validateIcon"),
_ctx.nsInput.is("loading", _ctx.validateState === "validating")
])
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(_ctx.validateIcon)))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true)
], 2)
], 2)]),
content: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_el_select_menu, { ref: "menuRef" }, {
default: (0, vue.withCtx)(() => [
_ctx.$slots.header ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)(_ctx.nsSelect.be("dropdown", "header")),
onClick: _cache[8] || (_cache[8] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, [(0, vue.renderSlot)(_ctx.$slots, "header")], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.withDirectives)((0, vue.createVNode)(_component_el_scrollbar, {
id: _ctx.contentId,
ref: "scrollbarRef",
tag: "ul",
"wrap-class": _ctx.nsSelect.be("dropdown", "wrap"),
"view-class": _ctx.nsSelect.be("dropdown", "list"),
class: (0, vue.normalizeClass)([_ctx.nsSelect.is("empty", _ctx.filteredOptionsCount === 0)]),
role: "listbox",
"aria-label": _ctx.ariaLabel,
"aria-orientation": "vertical",
onScroll: _ctx.popupScroll
}, {
default: (0, vue.withCtx)(() => [_ctx.showNewOption ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_option, {
key: 0,
value: _ctx.states.inputValue,
created: true
}, null, 8, ["value"])) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createVNode)(_component_el_options, null, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default", {}, () => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(_ctx.options, (option, index) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: index }, [_ctx.getOptions(option)?.length ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_option_group, {
key: 0,
label: _ctx.getLabel(option),
disabled: _ctx.getDisabled(option)
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(_ctx.getOptions(option), (item) => {
return (0, vue.openBlock)(), (0, vue.createBlock)(_component_el_option, (0, vue.mergeProps)({ key: _ctx.getValue(item) }, { ref_for: true }, _ctx.getOptionProps(item)), null, 16);
}), 128))]),
_: 2
}, 1032, ["label", "disabled"])) : ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_option, (0, vue.mergeProps)({
key: 1,
ref_for: true
}, _ctx.getOptionProps(option)), null, 16))], 64);
}), 128))])]),
_: 3
})]),
_: 3
}, 8, [
"id",
"wrap-class",
"view-class",
"class",
"aria-label",
"onScroll"
]), [[vue.vShow, _ctx.states.options.size > 0 && !_ctx.loading]]),
_ctx.$slots.loading && _ctx.loading ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)(_ctx.nsSelect.be("dropdown", "loading"))
}, [(0, vue.renderSlot)(_ctx.$slots, "loading")], 2)) : _ctx.loading || _ctx.filteredOptionsCount === 0 ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 2,
class: (0, vue.normalizeClass)(_ctx.nsSelect.be("dropdown", "empty"))
}, [(0, vue.renderSlot)(_ctx.$slots, "empty", {}, () => [(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(_ctx.emptyText), 1)])], 2)) : (0, vue.createCommentVNode)("v-if", true),
_ctx.$slots.footer ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 3,
class: (0, vue.normalizeClass)(_ctx.nsSelect.be("dropdown", "footer")),
onClick: _cache[9] || (_cache[9] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, [(0, vue.renderSlot)(_ctx.$slots, "footer")], 2)) : (0, vue.createCommentVNode)("v-if", true)
]),
_: 3
}, 512)]),
_: 3
}, 8, [
"visible",
"placement",
"teleported",
"popper-class",
"popper-style",
"popper-options",
"fallback-placements",
"effect",
"transition",
"persistent",
"append-to",
"show-arrow",
"offset",
"onBeforeShow"
])], 16)), [[
_directive_click_outside,
_ctx.handleClickOutside,
_ctx.popperRef
]]);
}
var select_default$1 = /* @__PURE__ */ _plugin_vue_export_helper_default(select_vue_vue_type_script_lang_default$1, [["render", _sfc_render$17]]);
//#endregion
//#region ../../packages/components/select/index.ts
const ElSelect = withInstall(select_default$1, {
Option: option_default,
OptionGroup: option_group_default
});
const ElOption = withNoopInstall(option_default);
const ElOptionGroup = withNoopInstall(option_group_default);
//#endregion
//#region ../../packages/components/calendar/src/select-controller.vue?vue&type=script&setup=true&lang.ts
var select_controller_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "SelectController",
__name: "select-controller",
props: selectControllerProps,
emits: selectControllerEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const nsSelect = useNamespace("calendar-select");
const { t, lang } = useLocale();
const monthOptions = Array.from({ length: 12 }, (_, index) => {
const actualMonth = index + 1;
return {
value: actualMonth,
label: isFunction$1(props.formatter) ? props.formatter(actualMonth, "month") : actualMonth
};
});
const yearValue = (0, vue.computed)(() => props.date.year());
const monthValue = (0, vue.computed)(() => props.date.month() + 1);
const yearOptions = (0, vue.computed)(() => {
const years = [];
for (let i = -10; i < 10; i++) {
const year = yearValue.value + i;
if (year > 0) {
const label = isFunction$1(props.formatter) ? props.formatter(year, "year") : year;
years.push({
value: year,
label
});
}
}
return years;
});
const handleYearChange = (year) => {
emit("date-change", (0, import_dayjs_min.default)(new Date(year, monthValue.value - 1, 1)).locale(lang.value));
};
const handleMonthChange = (month) => {
emit("date-change", (0, import_dayjs_min.default)(new Date(yearValue.value, month - 1, 1)).locale(lang.value));
};
const selectToday = () => {
emit("date-change", "today");
};
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, [
(0, vue.createVNode)((0, vue.unref)(ElSelect), {
"model-value": yearValue.value,
size: "small",
class: (0, vue.normalizeClass)((0, vue.unref)(nsSelect).e("year")),
"validate-event": false,
options: yearOptions.value,
onChange: handleYearChange
}, null, 8, [
"model-value",
"class",
"options"
]),
(0, vue.createVNode)((0, vue.unref)(ElSelect), {
"model-value": monthValue.value,
size: "small",
class: (0, vue.normalizeClass)((0, vue.unref)(nsSelect).e("month")),
"validate-event": false,
options: (0, vue.unref)(monthOptions),
onChange: handleMonthChange
}, null, 8, [
"model-value",
"class",
"options"
]),
(0, vue.createVNode)((0, vue.unref)(ElButton), {
size: "small",
onClick: selectToday
}, {
default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(t)("el.datepicker.today")), 1)]),
_: 1
})
], 64);
};
}
});
//#endregion
//#region ../../packages/components/calendar/src/select-controller.vue
var select_controller_default = select_controller_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/calendar/src/calendar.vue?vue&type=script&setup=true&lang.ts
const COMPONENT_NAME$12 = "ElCalendar";
var calendar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: COMPONENT_NAME$12,
__name: "calendar",
props: calendarProps,
emits: calendarEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const ns = useNamespace("calendar");
const { calculateValidatedDateRange, date, pickDay, realSelectedDay, selectDate, validatedRange, handleDateChange } = useCalendar(__props, __emit, COMPONENT_NAME$12);
const { t } = useLocale();
const i18nDate = (0, vue.computed)(() => {
const pickedMonth = `el.datepicker.month${date.value.format("M")}`;
return `${date.value.year()} ${t("el.datepicker.year")} ${t(pickedMonth)}`;
});
__expose({
selectedDay: realSelectedDay,
pickDay,
selectDate,
calculateValidatedDateRange
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("header")) }, [(0, vue.renderSlot)(_ctx.$slots, "header", { date: i18nDate.value }, () => [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("title")) }, (0, vue.toDisplayString)(i18nDate.value), 3), (0, vue.unref)(validatedRange).length === 0 && __props.controllerType === "button" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("button-group"))
}, [(0, vue.createVNode)((0, vue.unref)(ElButtonGroup), null, {
default: (0, vue.withCtx)(() => [
(0, vue.createVNode)((0, vue.unref)(ElButton), {
size: "small",
onClick: _cache[0] || (_cache[0] = ($event) => (0, vue.unref)(selectDate)("prev-month"))
}, {
default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(t)("el.datepicker.prevMonth")), 1)]),
_: 1
}),
(0, vue.createVNode)((0, vue.unref)(ElButton), {
size: "small",
onClick: _cache[1] || (_cache[1] = ($event) => (0, vue.unref)(selectDate)("today"))
}, {
default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(t)("el.datepicker.today")), 1)]),
_: 1
}),
(0, vue.createVNode)((0, vue.unref)(ElButton), {
size: "small",
onClick: _cache[2] || (_cache[2] = ($event) => (0, vue.unref)(selectDate)("next-month"))
}, {
default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(t)("el.datepicker.nextMonth")), 1)]),
_: 1
})
]),
_: 1
})], 2)) : (0, vue.unref)(validatedRange).length === 0 && __props.controllerType === "select" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("select-controller"))
}, [(0, vue.createVNode)(select_controller_default, {
date: (0, vue.unref)(date),
formatter: __props.formatter,
onDateChange: (0, vue.unref)(handleDateChange)
}, null, 8, [
"date",
"formatter",
"onDateChange"
])], 2)) : (0, vue.createCommentVNode)("v-if", true)])], 2), (0, vue.unref)(validatedRange).length === 0 ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("body"))
}, [(0, vue.createVNode)(date_table_default, {
date: (0, vue.unref)(date),
"selected-day": (0, vue.unref)(realSelectedDay),
onPick: (0, vue.unref)(pickDay)
}, (0, vue.createSlots)({ _: 2 }, [_ctx.$slots["date-cell"] ? {
name: "date-cell",
fn: (0, vue.withCtx)((data) => [(0, vue.renderSlot)(_ctx.$slots, "date-cell", (0, vue.normalizeProps)((0, vue.guardReactiveProps)(data)))]),
key: "0"
} : void 0]), 1032, [
"date",
"selected-day",
"onPick"
])], 2)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("body"))
}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(validatedRange), (range_, index) => {
return (0, vue.openBlock)(), (0, vue.createBlock)(date_table_default, {
key: index,
date: range_[0],
"selected-day": (0, vue.unref)(realSelectedDay),
range: range_,
"hide-header": index !== 0,
onPick: (0, vue.unref)(pickDay)
}, (0, vue.createSlots)({ _: 2 }, [_ctx.$slots["date-cell"] ? {
name: "date-cell",
fn: (0, vue.withCtx)((data) => [(0, vue.renderSlot)(_ctx.$slots, "date-cell", (0, vue.mergeProps)({ ref_for: true }, data))]),
key: "0"
} : void 0]), 1032, [
"date",
"selected-day",
"range",
"hide-header",
"onPick"
]);
}), 128))], 2))], 2);
};
}
});
//#endregion
//#region ../../packages/components/calendar/src/calendar.vue
var calendar_default = calendar_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/calendar/index.ts
const ElCalendar = withInstall(calendar_default);
//#endregion
//#region ../../packages/components/card/src/card.ts
/**
* @deprecated Removed after 3.0.0, Use `CardProps` instead.
*/
const cardProps = buildProps({
header: {
type: String,
default: ""
},
footer: {
type: String,
default: ""
},
bodyStyle: {
type: definePropType([
String,
Object,
Array
]),
default: ""
},
headerClass: String,
bodyClass: String,
footerClass: String,
shadow: {
type: String,
values: [
"always",
"hover",
"never"
],
default: void 0
}
});
const cardContextKey = Symbol("cardContextKey");
//#endregion
//#region ../../packages/components/card/src/card.vue?vue&type=script&setup=true&lang.ts
var card_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElCard",
__name: "card",
props: cardProps,
setup(__props) {
const globalConfig = useGlobalConfig("card");
const ns = useNamespace("card");
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).b(), (0, vue.unref)(ns).is(`${__props.shadow || (0, vue.unref)(globalConfig)?.shadow || "always"}-shadow`)]) }, [
_ctx.$slots.header || __props.header ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("header"), __props.headerClass])
}, [(0, vue.renderSlot)(_ctx.$slots, "header", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.header), 1)])], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("body"), __props.bodyClass]),
style: (0, vue.normalizeStyle)(__props.bodyStyle)
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 6),
_ctx.$slots.footer || __props.footer ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("footer"), __props.footerClass])
}, [(0, vue.renderSlot)(_ctx.$slots, "footer", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.footer), 1)])], 2)) : (0, vue.createCommentVNode)("v-if", true)
], 2);
};
}
});
//#endregion
//#region ../../packages/components/card/src/card.vue
var card_default = card_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/card/index.ts
const ElCard = withInstall(card_default);
//#endregion
//#region ../../packages/components/carousel/src/carousel.ts
/**
* @deprecated Removed after 3.0.0, Use `CarouselProps` instead.
*/
const carouselProps = buildProps({
initialIndex: {
type: Number,
default: 0
},
height: {
type: String,
default: ""
},
trigger: {
type: String,
values: ["hover", "click"],
default: "hover"
},
autoplay: {
type: Boolean,
default: true
},
interval: {
type: Number,
default: 3e3
},
indicatorPosition: {
type: String,
values: [
"",
"none",
"outside"
],
default: ""
},
arrow: {
type: String,
values: [
"always",
"hover",
"never"
],
default: "hover"
},
type: {
type: String,
values: ["", "card"],
default: ""
},
cardScale: {
type: Number,
default: .83
},
loop: {
type: Boolean,
default: true
},
direction: {
type: String,
values: ["horizontal", "vertical"],
default: "horizontal"
},
pauseOnHover: {
type: Boolean,
default: true
},
motionBlur: Boolean
});
const carouselEmits = { change: (current, prev) => [current, prev].every(isNumber) };
//#endregion
//#region ../../packages/components/carousel/src/constants.ts
const carouselContextKey = Symbol("carouselContextKey");
const CAROUSEL_ITEM_NAME = "ElCarouselItem";
//#endregion
//#region ../../packages/components/carousel/src/use-carousel.ts
const THROTTLE_TIME = 300;
const useCarousel = (props, emit, componentName) => {
const { children: items, addChild: addItem, removeChild: removeItem, ChildrenSorter: ItemsSorter } = useOrderedChildren((0, vue.getCurrentInstance)(), CAROUSEL_ITEM_NAME);
const slots = (0, vue.useSlots)();
const activeIndex = (0, vue.ref)(-1);
const timer = (0, vue.ref)(null);
const hover = (0, vue.ref)(false);
const root = (0, vue.ref)();
const containerHeight = (0, vue.ref)(0);
const isItemsTwoLength = (0, vue.ref)(true);
const arrowDisplay = (0, vue.computed)(() => props.arrow !== "never" && !(0, vue.unref)(isVertical));
const hasLabel = (0, vue.computed)(() => {
return items.value.some((item) => item.props.label.toString().length > 0);
});
const isCardType = (0, vue.computed)(() => props.type === "card");
const isVertical = (0, vue.computed)(() => props.direction === "vertical");
const containerStyle = (0, vue.computed)(() => {
if (props.height !== "auto") return { height: props.height };
return {
height: `${containerHeight.value}px`,
overflow: "hidden"
};
});
const throttledArrowClick = throttle((index) => {
setActiveItem(index);
}, THROTTLE_TIME, { trailing: true });
const throttledIndicatorHover = throttle((index) => {
handleIndicatorHover(index);
}, THROTTLE_TIME);
const isTwoLengthShow = (index) => {
if (!isItemsTwoLength.value) return true;
return activeIndex.value <= 1 ? index <= 1 : index > 1;
};
function pauseTimer() {
if (timer.value) {
clearInterval(timer.value);
timer.value = null;
}
}
function startTimer() {
if (props.interval <= 0 || !props.autoplay || timer.value) return;
timer.value = setInterval(() => playSlides(), props.interval);
}
const playSlides = () => {
if (activeIndex.value < items.value.length - 1) activeIndex.value = activeIndex.value + 1;
else if (props.loop) activeIndex.value = 0;
};
function setActiveItem(index) {
if (isString(index)) {
const filteredItems = items.value.filter((item) => item.props.name === index);
if (filteredItems.length > 0) index = items.value.indexOf(filteredItems[0]);
}
index = Number(index);
if (Number.isNaN(index) || index !== Math.floor(index)) {
/* @__PURE__ */ debugWarn(componentName, "index must be integer.");
return;
}
const itemCount = items.value.length;
const oldIndex = activeIndex.value;
if (index < 0) activeIndex.value = props.loop ? itemCount - 1 : 0;
else if (index >= itemCount) activeIndex.value = props.loop ? 0 : itemCount - 1;
else activeIndex.value = index;
if (oldIndex === activeIndex.value) resetItemPosition(oldIndex);
resetTimer();
}
function resetItemPosition(oldIndex) {
items.value.forEach((item, index) => {
item.translateItem(index, activeIndex.value, oldIndex);
});
}
function itemInStage(item, index) {
const _items = (0, vue.unref)(items);
const itemCount = _items.length;
if (itemCount === 0 || !item.states.inStage) return false;
const nextItemIndex = index + 1;
const prevItemIndex = index - 1;
const lastItemIndex = itemCount - 1;
const isLastItemActive = _items[lastItemIndex].states.active;
const isFirstItemActive = _items[0].states.active;
const isNextItemActive = _items[nextItemIndex]?.states?.active;
const isPrevItemActive = _items[prevItemIndex]?.states?.active;
if (index === lastItemIndex && isFirstItemActive || isNextItemActive) return "left";
else if (index === 0 && isLastItemActive || isPrevItemActive) return "right";
return false;
}
function handleMouseEnter() {
hover.value = true;
if (props.pauseOnHover) pauseTimer();
}
function handleMouseLeave() {
hover.value = false;
startTimer();
}
function handleButtonEnter(arrow) {
if ((0, vue.unref)(isVertical)) return;
items.value.forEach((item, index) => {
if (arrow === itemInStage(item, index)) item.states.hover = true;
});
}
function handleButtonLeave() {
if ((0, vue.unref)(isVertical)) return;
items.value.forEach((item) => {
item.states.hover = false;
});
}
function handleIndicatorClick(index) {
activeIndex.value = index;
}
function handleIndicatorHover(index) {
if (props.trigger === "hover" && index !== activeIndex.value) activeIndex.value = index;
}
function prev() {
setActiveItem(activeIndex.value - 1);
}
function next() {
setActiveItem(activeIndex.value + 1);
}
function resetTimer() {
pauseTimer();
if (!props.pauseOnHover || !hover.value) startTimer();
}
function setContainerHeight(height) {
if (props.height !== "auto") return;
containerHeight.value = height;
}
function PlaceholderItem() {
const defaultSlots = slots.default?.();
if (!defaultSlots) return null;
const normalizeSlots = flattedChildren(defaultSlots).filter((slot) => {
return (0, vue.isVNode)(slot) && slot.type.name === CAROUSEL_ITEM_NAME;
});
if (normalizeSlots?.length === 2 && props.loop && !isCardType.value) {
isItemsTwoLength.value = true;
return normalizeSlots;
}
isItemsTwoLength.value = false;
return null;
}
(0, vue.watch)(() => activeIndex.value, (current, prev) => {
resetItemPosition(prev);
if (isItemsTwoLength.value) {
current = current % 2;
prev = prev % 2;
}
if (prev > -1) emit(CHANGE_EVENT, current, prev);
});
const exposeActiveIndex = (0, vue.computed)({
get: () => {
return isItemsTwoLength.value ? activeIndex.value % 2 : activeIndex.value;
},
set: (value) => activeIndex.value = value
});
(0, vue.watch)(() => props.autoplay, (autoplay) => {
autoplay ? startTimer() : pauseTimer();
});
(0, vue.watch)(() => props.loop, () => {
setActiveItem(activeIndex.value);
});
(0, vue.watch)(() => props.interval, () => {
resetTimer();
});
const resizeObserver = (0, vue.shallowRef)();
(0, vue.onMounted)(() => {
(0, vue.watch)(() => items.value, () => {
if (items.value.length > 0) setActiveItem(props.initialIndex);
}, { immediate: true });
resizeObserver.value = useResizeObserver(root.value, () => {
resetItemPosition();
});
startTimer();
});
(0, vue.onBeforeUnmount)(() => {
pauseTimer();
if (root.value && resizeObserver.value) resizeObserver.value.stop();
});
(0, vue.provide)(carouselContextKey, {
root,
isCardType,
isVertical,
items,
loop: props.loop,
cardScale: props.cardScale,
addItem,
removeItem,
setActiveItem,
setContainerHeight
});
return {
root,
activeIndex,
exposeActiveIndex,
arrowDisplay,
hasLabel,
hover,
isCardType,
items,
isVertical,
containerStyle,
isItemsTwoLength,
handleButtonEnter,
handleButtonLeave,
handleIndicatorClick,
handleMouseEnter,
handleMouseLeave,
setActiveItem,
prev,
next,
PlaceholderItem,
isTwoLengthShow,
ItemsSorter,
throttledArrowClick,
throttledIndicatorHover
};
};
//#endregion
//#region ../../packages/components/carousel/src/carousel.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$64 = ["aria-label"];
const _hoisted_2$35 = ["aria-label"];
const _hoisted_3$16 = ["onMouseenter", "onClick"];
const _hoisted_4$12 = ["aria-label"];
const _hoisted_5$9 = { key: 0 };
const _hoisted_6$4 = {
key: 2,
xmlns: "http://www.w3.org/2000/svg",
version: "1.1",
style: { "display": "none" }
};
const COMPONENT_NAME$11 = "ElCarousel";
var carousel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: COMPONENT_NAME$11,
__name: "carousel",
props: carouselProps,
emits: carouselEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const { root, activeIndex, exposeActiveIndex, arrowDisplay, hasLabel, hover, isCardType, items, isVertical, containerStyle, handleButtonEnter, handleButtonLeave, handleIndicatorClick, handleMouseEnter, handleMouseLeave, setActiveItem, prev, next, PlaceholderItem, isTwoLengthShow, ItemsSorter, throttledArrowClick, throttledIndicatorHover } = useCarousel(props, __emit, COMPONENT_NAME$11);
const ns = useNamespace("carousel");
const { t } = useLocale();
const carouselClasses = (0, vue.computed)(() => {
const classes = [ns.b(), ns.m(props.direction)];
if ((0, vue.unref)(isCardType)) classes.push(ns.m("card"));
classes.push(ns.is("vertical-outside", (0, vue.unref)(isVertical) && props.indicatorPosition === "outside"));
return classes;
});
const indicatorsClasses = (0, vue.computed)(() => {
const classes = [ns.e("indicators"), ns.em("indicators", props.direction)];
if ((0, vue.unref)(hasLabel)) classes.push(ns.em("indicators", "labels"));
if (props.indicatorPosition === "outside") classes.push(ns.em("indicators", "outside"));
if ((0, vue.unref)(isVertical)) classes.push(ns.em("indicators", "right"));
return classes;
});
function handleTransitionStart(e) {
if (!props.motionBlur) return;
const kls = (0, vue.unref)(isVertical) ? `${ns.namespace.value}-transitioning-vertical` : `${ns.namespace.value}-transitioning`;
e.currentTarget.classList.add(kls);
}
function handleTransitionEnd(e) {
if (!props.motionBlur) return;
const kls = (0, vue.unref)(isVertical) ? `${ns.namespace.value}-transitioning-vertical` : `${ns.namespace.value}-transitioning`;
e.currentTarget.classList.remove(kls);
}
__expose({
activeIndex: exposeActiveIndex,
setActiveItem,
prev,
next
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref_key: "root",
ref: root,
class: (0, vue.normalizeClass)(carouselClasses.value),
onMouseenter: _cache[6] || (_cache[6] = (0, vue.withModifiers)((...args) => (0, vue.unref)(handleMouseEnter) && (0, vue.unref)(handleMouseEnter)(...args), ["stop"])),
onMouseleave: _cache[7] || (_cache[7] = (0, vue.withModifiers)((...args) => (0, vue.unref)(handleMouseLeave) && (0, vue.unref)(handleMouseLeave)(...args), ["stop"]))
}, [
(0, vue.unref)(arrowDisplay) ? ((0, vue.openBlock)(), (0, vue.createBlock)(vue.Transition, {
key: 0,
name: "carousel-arrow-left",
persisted: ""
}, {
default: (0, vue.withCtx)(() => [(0, vue.withDirectives)((0, vue.createElementVNode)("button", {
type: "button",
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("arrow"), (0, vue.unref)(ns).em("arrow", "left")]),
"aria-label": (0, vue.unref)(t)("el.carousel.leftArrow"),
onMouseenter: _cache[0] || (_cache[0] = ($event) => (0, vue.unref)(handleButtonEnter)("left")),
onMouseleave: _cache[1] || (_cache[1] = (...args) => (0, vue.unref)(handleButtonLeave) && (0, vue.unref)(handleButtonLeave)(...args)),
onClick: _cache[2] || (_cache[2] = (0, vue.withModifiers)(($event) => (0, vue.unref)(throttledArrowClick)((0, vue.unref)(activeIndex) - 1), ["stop"]))
}, [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(arrow_left_default))]),
_: 1
})], 42, _hoisted_1$64), [[vue.vShow, (__props.arrow === "always" || (0, vue.unref)(hover)) && (__props.loop || (0, vue.unref)(activeIndex) > 0)]])]),
_: 1
})) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.unref)(arrowDisplay) ? ((0, vue.openBlock)(), (0, vue.createBlock)(vue.Transition, {
key: 1,
name: "carousel-arrow-right",
persisted: ""
}, {
default: (0, vue.withCtx)(() => [(0, vue.withDirectives)((0, vue.createElementVNode)("button", {
type: "button",
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("arrow"), (0, vue.unref)(ns).em("arrow", "right")]),
"aria-label": (0, vue.unref)(t)("el.carousel.rightArrow"),
onMouseenter: _cache[3] || (_cache[3] = ($event) => (0, vue.unref)(handleButtonEnter)("right")),
onMouseleave: _cache[4] || (_cache[4] = (...args) => (0, vue.unref)(handleButtonLeave) && (0, vue.unref)(handleButtonLeave)(...args)),
onClick: _cache[5] || (_cache[5] = (0, vue.withModifiers)(($event) => (0, vue.unref)(throttledArrowClick)((0, vue.unref)(activeIndex) + 1), ["stop"]))
}, [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(arrow_right_default))]),
_: 1
})], 42, _hoisted_2$35), [[vue.vShow, (__props.arrow === "always" || (0, vue.unref)(hover)) && (__props.loop || (0, vue.unref)(activeIndex) < (0, vue.unref)(items).length - 1)]])]),
_: 1
})) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("container")),
style: (0, vue.normalizeStyle)((0, vue.unref)(containerStyle)),
onTransitionstart: handleTransitionStart,
onTransitionend: handleTransitionEnd
}, [(0, vue.createVNode)((0, vue.unref)(PlaceholderItem)), (0, vue.renderSlot)(_ctx.$slots, "default")], 38),
(0, vue.createVNode)((0, vue.unref)(ItemsSorter), null, {
default: (0, vue.withCtx)(() => [__props.indicatorPosition !== "none" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("ul", {
key: 0,
class: (0, vue.normalizeClass)(indicatorsClasses.value)
}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(items), (item, index) => {
return (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
key: index,
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).e("indicator"),
(0, vue.unref)(ns).em("indicator", __props.direction),
(0, vue.unref)(ns).is("active", index === (0, vue.unref)(activeIndex))
]),
onMouseenter: ($event) => (0, vue.unref)(throttledIndicatorHover)(index),
onClick: (0, vue.withModifiers)(($event) => (0, vue.unref)(handleIndicatorClick)(index), ["stop"])
}, [(0, vue.createElementVNode)("button", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("button")),
"aria-label": (0, vue.unref)(t)("el.carousel.indicator", { index: index + 1 })
}, [(0, vue.unref)(hasLabel) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_5$9, (0, vue.toDisplayString)(item.props.label), 1)) : (0, vue.createCommentVNode)("v-if", true)], 10, _hoisted_4$12)], 42, _hoisted_3$16)), [[vue.vShow, (0, vue.unref)(isTwoLengthShow)(index)]]);
}), 128))], 2)) : (0, vue.createCommentVNode)("v-if", true)]),
_: 1
}),
__props.motionBlur ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_6$4, [..._cache[8] || (_cache[8] = [(0, vue.createElementVNode)("defs", null, [(0, vue.createElementVNode)("filter", { id: "elCarouselHorizontal" }, [(0, vue.createElementVNode)("feGaussianBlur", {
in: "SourceGraphic",
stdDeviation: "12,0"
})]), (0, vue.createElementVNode)("filter", { id: "elCarouselVertical" }, [(0, vue.createElementVNode)("feGaussianBlur", {
in: "SourceGraphic",
stdDeviation: "0,10"
})])], -1)])])) : (0, vue.createCommentVNode)("v-if", true)
], 34);
};
}
});
//#endregion
//#region ../../packages/components/carousel/src/carousel.vue
var carousel_default = carousel_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/carousel/src/carousel-item.ts
/**
* @deprecated Removed after 3.0.0, Use `CarouselItemProps` instead.
*/
const carouselItemProps = buildProps({
name: {
type: String,
default: ""
},
label: {
type: [String, Number],
default: ""
}
});
//#endregion
//#region ../../packages/components/carousel/src/use-carousel-item.ts
const useCarouselItem = (props) => {
const carouselContext = (0, vue.inject)(carouselContextKey);
const instance = (0, vue.getCurrentInstance)();
if (!carouselContext) /* @__PURE__ */ debugWarn(CAROUSEL_ITEM_NAME, "usage: <el-carousel></el-carousel-item></el-carousel>");
if (!instance) /* @__PURE__ */ debugWarn(CAROUSEL_ITEM_NAME, "compositional hook can only be invoked inside setups");
const carouselItemRef = (0, vue.ref)();
const hover = (0, vue.ref)(false);
const translate = (0, vue.ref)(0);
const scale = (0, vue.ref)(1);
const active = (0, vue.ref)(false);
const ready = (0, vue.ref)(false);
const inStage = (0, vue.ref)(false);
const animating = (0, vue.ref)(false);
const { isCardType, isVertical, cardScale } = carouselContext;
function processIndex(index, activeIndex, length) {
const lastItemIndex = length - 1;
const prevItemIndex = activeIndex - 1;
const nextItemIndex = activeIndex + 1;
const halfItemIndex = length / 2;
if (activeIndex === 0 && index === lastItemIndex) return -1;
else if (activeIndex === lastItemIndex && index === 0) return length;
else if (index < prevItemIndex && activeIndex - index >= halfItemIndex) return length + 1;
else if (index > nextItemIndex && index - activeIndex >= halfItemIndex) return -2;
return index;
}
function calcCardTranslate(index, activeIndex) {
const parentWidth = (0, vue.unref)(isVertical) ? carouselContext.root.value?.offsetHeight || 0 : carouselContext.root.value?.offsetWidth || 0;
if (inStage.value) return parentWidth * ((2 - cardScale) * (index - activeIndex) + 1) / 4;
else if (index < activeIndex) return -(1 + cardScale) * parentWidth / 4;
else return (3 + cardScale) * parentWidth / 4;
}
function calcTranslate(index, activeIndex, isVertical) {
const rootEl = carouselContext.root.value;
if (!rootEl) return 0;
return ((isVertical ? rootEl.offsetHeight : rootEl.offsetWidth) || 0) * (index - activeIndex);
}
const translateItem = (index, activeIndex, oldIndex) => {
const _isCardType = (0, vue.unref)(isCardType);
const carouselItemLength = carouselContext.items.value.length ?? NaN;
const isActive = index === activeIndex;
if (!_isCardType && !isUndefined(oldIndex)) animating.value = isActive || index === oldIndex;
if (!isActive && carouselItemLength > 2 && carouselContext.loop) index = processIndex(index, activeIndex, carouselItemLength);
const _isVertical = (0, vue.unref)(isVertical);
active.value = isActive;
if (_isCardType) {
inStage.value = Math.round(Math.abs(index - activeIndex)) <= 1;
translate.value = calcCardTranslate(index, activeIndex);
scale.value = (0, vue.unref)(active) ? 1 : cardScale;
} else translate.value = calcTranslate(index, activeIndex, _isVertical);
ready.value = true;
if (isActive && carouselItemRef.value) carouselContext.setContainerHeight(carouselItemRef.value.offsetHeight);
};
function handleItemClick() {
if (carouselContext && (0, vue.unref)(isCardType)) {
const index = carouselContext.items.value.findIndex(({ uid }) => uid === instance.uid);
carouselContext.setActiveItem(index);
}
}
const carouselItemContext = {
props,
states: (0, vue.reactive)({
hover,
translate,
scale,
active,
ready,
inStage,
animating
}),
uid: instance.uid,
getVnode: () => instance.vnode,
translateItem
};
carouselContext.addItem(carouselItemContext);
(0, vue.onBeforeUnmount)(() => {
carouselContext.removeItem(carouselItemContext);
});
return {
carouselItemRef,
active,
animating,
hover,
inStage,
isVertical,
translate,
isCardType,
scale,
ready,
handleItemClick
};
};
//#endregion
//#region ../../packages/components/carousel/src/carousel-item.vue?vue&type=script&setup=true&lang.ts
var carousel_item_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: CAROUSEL_ITEM_NAME,
__name: "carousel-item",
props: carouselItemProps,
setup(__props) {
const props = __props;
const ns = useNamespace("carousel");
const { carouselItemRef, active, animating, hover, inStage, isVertical, translate, isCardType, scale, ready, handleItemClick } = useCarouselItem(props);
const itemKls = (0, vue.computed)(() => [
ns.e("item"),
ns.is("active", active.value),
ns.is("in-stage", inStage.value),
ns.is("hover", hover.value),
ns.is("animating", animating.value),
{
[ns.em("item", "card")]: isCardType.value,
[ns.em("item", "card-vertical")]: isCardType.value && isVertical.value
}
]);
const itemStyle = (0, vue.computed)(() => {
return { transform: [`${`translate${(0, vue.unref)(isVertical) ? "Y" : "X"}`}(${(0, vue.unref)(translate)}px)`, `scale(${(0, vue.unref)(scale)})`].join(" ") };
});
return (_ctx, _cache) => {
return (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref_key: "carouselItemRef",
ref: carouselItemRef,
class: (0, vue.normalizeClass)(itemKls.value),
style: (0, vue.normalizeStyle)(itemStyle.value),
onClick: _cache[0] || (_cache[0] = (...args) => (0, vue.unref)(handleItemClick) && (0, vue.unref)(handleItemClick)(...args))
}, [(0, vue.unref)(isCardType) ? (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("mask"))
}, null, 2)), [[vue.vShow, !(0, vue.unref)(active)]]) : (0, vue.createCommentVNode)("v-if", true), (0, vue.renderSlot)(_ctx.$slots, "default")], 6)), [[vue.vShow, (0, vue.unref)(ready)]]);
};
}
});
//#endregion
//#region ../../packages/components/carousel/src/carousel-item.vue
var carousel_item_default = carousel_item_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/carousel/index.ts
const ElCarousel = withInstall(carousel_default, { CarouselItem: carousel_item_default });
const ElCarouselItem = withNoopInstall(carousel_item_default);
//#endregion
//#region ../../packages/components/cascader-panel/src/config.ts
const CommonProps = buildProps({
modelValue: { type: definePropType([
Number,
String,
Array,
Object
]) },
options: {
type: definePropType(Array),
default: () => []
},
props: {
type: definePropType(Object),
default: () => ({})
}
});
const DefaultProps = {
expandTrigger: "click",
multiple: false,
checkStrictly: false,
emitPath: true,
lazy: false,
lazyLoad: NOOP,
value: "value",
label: "label",
children: "children",
leaf: "leaf",
disabled: "disabled",
hoverThreshold: 500,
checkOnClickNode: false,
checkOnClickLeaf: true,
showPrefix: true
};
/**
* @deprecated Removed after 3.0.0, Use `CascaderPanelProps` instead.
*/
const cascaderPanelProps = buildProps({
...CommonProps,
border: {
type: Boolean,
default: true
},
renderLabel: { type: Function }
});
const emitChangeFn$2 = (value) => true;
const cascaderPanelEmits = {
[UPDATE_MODEL_EVENT]: emitChangeFn$2,
[CHANGE_EVENT]: emitChangeFn$2,
close: () => true,
"expand-change": (value) => value
};
const useCascaderConfig = (props) => {
return (0, vue.computed)(() => ({
...DefaultProps,
...props.props
}));
};
//#endregion
//#region ../../packages/components/checkbox/src/checkbox.ts
/**
* @deprecated Removed after 3.0.0, Use `CheckboxProps` instead.
*/
const checkboxProps = {
modelValue: {
type: [
Number,
String,
Boolean
],
default: void 0
},
label: {
type: [
String,
Boolean,
Number,
Object
],
default: void 0
},
value: {
type: [
String,
Boolean,
Number,
Object
],
default: void 0
},
indeterminate: Boolean,
disabled: {
type: Boolean,
default: void 0
},
checked: Boolean,
name: {
type: String,
default: void 0
},
trueValue: {
type: [String, Number],
default: void 0
},
falseValue: {
type: [String, Number],
default: void 0
},
trueLabel: {
type: [String, Number],
default: void 0
},
falseLabel: {
type: [String, Number],
default: void 0
},
id: {
type: String,
default: void 0
},
border: Boolean,
size: useSizeProp,
tabindex: [String, Number],
validateEvent: {
type: Boolean,
default: true
},
ariaLabel: String,
...useAriaProps(["ariaControls"])
};
const checkboxEmits = {
[UPDATE_MODEL_EVENT]: (val) => isString(val) || isNumber(val) || isBoolean(val),
change: (val) => isString(val) || isNumber(val) || isBoolean(val)
};
const checkboxPropsDefaults = {
modelValue: void 0,
label: void 0,
value: void 0,
disabled: void 0,
name: void 0,
trueValue: void 0,
falseValue: void 0,
trueLabel: void 0,
falseLabel: void 0,
id: void 0,
validateEvent: true
};
//#endregion
//#region ../../packages/components/checkbox/src/constants.ts
const checkboxGroupContextKey = Symbol("checkboxGroupContextKey");
//#endregion
//#region ../../packages/components/checkbox/src/composables/use-checkbox-disabled.ts
const useCheckboxDisabled = ({ model, isChecked }) => {
const checkboxGroup = (0, vue.inject)(checkboxGroupContextKey, void 0);
const formContext = (0, vue.inject)(formContextKey, void 0);
const isLimitDisabled = (0, vue.computed)(() => {
const max = checkboxGroup?.max?.value;
const min = checkboxGroup?.min?.value;
return !isUndefined(max) && model.value.length >= max && !isChecked.value || !isUndefined(min) && model.value.length <= min && isChecked.value;
});
return {
isDisabled: useFormDisabled((0, vue.computed)(() => {
if (checkboxGroup === void 0) return formContext?.disabled ?? isLimitDisabled.value;
else return checkboxGroup.disabled?.value || isLimitDisabled.value;
})),
isLimitDisabled
};
};
//#endregion
//#region ../../packages/components/checkbox/src/composables/use-checkbox-event.ts
const useCheckboxEvent = (props, { model, isLimitExceeded, hasOwnLabel, isDisabled, isLabeledByFormItem }) => {
const checkboxGroup = (0, vue.inject)(checkboxGroupContextKey, void 0);
const { formItem } = useFormItem();
const { emit } = (0, vue.getCurrentInstance)();
function getLabeledValue(value) {
return [
true,
props.trueValue,
props.trueLabel
].includes(value) ? props.trueValue ?? props.trueLabel ?? true : props.falseValue ?? props.falseLabel ?? false;
}
function emitChangeEvent(checked, e) {
emit(CHANGE_EVENT, getLabeledValue(checked), e);
}
function handleChange(e) {
if (isLimitExceeded.value) return;
const target = e.target;
emit(CHANGE_EVENT, getLabeledValue(target.checked), e);
}
async function onClickRoot(e) {
if (isLimitExceeded.value) return;
if (!hasOwnLabel.value && !isDisabled.value && isLabeledByFormItem.value) {
if (!e.composedPath().some((item) => item.tagName === "LABEL")) {
model.value = getLabeledValue([
false,
props.falseValue,
props.falseLabel
].includes(model.value));
await (0, vue.nextTick)();
emitChangeEvent(model.value, e);
}
}
}
const validateEvent = (0, vue.computed)(() => checkboxGroup?.validateEvent || props.validateEvent);
(0, vue.watch)(() => props.modelValue, () => {
if (validateEvent.value) formItem?.validate("change").catch((err) => /* @__PURE__ */ debugWarn(err));
});
return {
handleChange,
onClickRoot
};
};
//#endregion
//#region ../../packages/components/checkbox/src/composables/use-checkbox-model.ts
const useCheckboxModel = (props) => {
const selfModel = (0, vue.ref)(false);
const { emit, vnode } = (0, vue.getCurrentInstance)();
const checkboxGroup = (0, vue.inject)(checkboxGroupContextKey, void 0);
const isGroup = (0, vue.computed)(() => isUndefined(checkboxGroup) === false);
const isLimitExceeded = (0, vue.ref)(false);
const isControlled = (0, vue.computed)(() => {
const rawProps = vnode.props ?? {};
return "modelValue" in rawProps || "model-value" in rawProps;
});
const model = (0, vue.computed)({
get() {
return isGroup.value ? checkboxGroup?.modelValue?.value : !isControlled.value ? selfModel.value : props.modelValue;
},
set(val) {
if (isGroup.value && isArray$1(val)) {
isLimitExceeded.value = checkboxGroup?.max?.value !== void 0 && val.length > checkboxGroup?.max.value && val.length > model.value.length;
isLimitExceeded.value === false && checkboxGroup?.changeEvent?.(val);
} else {
emit(UPDATE_MODEL_EVENT, val);
selfModel.value = val;
}
}
});
return {
model,
isGroup,
isLimitExceeded
};
};
//#endregion
//#region ../../packages/components/checkbox/src/composables/use-checkbox-status.ts
const useCheckboxStatus = (props, slots, { model }) => {
const checkboxGroup = (0, vue.inject)(checkboxGroupContextKey, void 0);
const isFocused = (0, vue.ref)(false);
const actualValue = (0, vue.computed)(() => {
if (!isPropAbsent(props.value)) return props.value;
return props.label;
});
const isChecked = (0, vue.computed)(() => {
const value = model.value;
if (isBoolean(value)) return value;
else if (isArray$1(value)) if (isObject$1(actualValue.value)) return value.map(vue.toRaw).some((o) => isEqual$1(o, actualValue.value));
else return value.map(vue.toRaw).includes(actualValue.value);
else if (value !== null && value !== void 0) return value === props.trueValue || value === props.trueLabel;
else return !!value;
});
return {
checkboxButtonSize: useFormSize((0, vue.computed)(() => checkboxGroup?.size?.value), { prop: true }),
isChecked,
isFocused,
checkboxSize: useFormSize((0, vue.computed)(() => checkboxGroup?.size?.value)),
hasOwnLabel: (0, vue.computed)(() => {
return !!slots.default || !isPropAbsent(actualValue.value);
}),
actualValue
};
};
//#endregion
//#region ../../packages/components/checkbox/src/composables/use-checkbox.ts
const useCheckbox = (props, slots) => {
const { formItem: elFormItem } = useFormItem();
const { model, isGroup, isLimitExceeded } = useCheckboxModel(props);
const { isFocused, isChecked, checkboxButtonSize, checkboxSize, hasOwnLabel, actualValue } = useCheckboxStatus(props, slots, { model });
const { isDisabled } = useCheckboxDisabled({
model,
isChecked
});
const { inputId, isLabeledByFormItem } = useFormItemInputId(props, {
formItemContext: elFormItem,
disableIdGeneration: hasOwnLabel,
disableIdManagement: isGroup
});
const { handleChange, onClickRoot } = useCheckboxEvent(props, {
model,
isLimitExceeded,
hasOwnLabel,
isDisabled,
isLabeledByFormItem
});
const setStoreValue = () => {
function addToStore() {
if (isArray$1(model.value) && !model.value.includes(actualValue.value)) model.value.push(actualValue.value);
else model.value = props.trueValue ?? props.trueLabel ?? true;
}
props.checked && addToStore();
};
setStoreValue();
useDeprecated({
from: "label act as value",
replacement: "value",
version: "3.0.0",
scope: "el-checkbox",
ref: "https://element-plus.org/en-US/component/checkbox.html"
}, (0, vue.computed)(() => isGroup.value && isPropAbsent(props.value)));
useDeprecated({
from: "true-label",
replacement: "true-value",
version: "3.0.0",
scope: "el-checkbox",
ref: "https://element-plus.org/en-US/component/checkbox.html"
}, (0, vue.computed)(() => !!props.trueLabel));
useDeprecated({
from: "false-label",
replacement: "false-value",
version: "3.0.0",
scope: "el-checkbox",
ref: "https://element-plus.org/en-US/component/checkbox.html"
}, (0, vue.computed)(() => !!props.falseLabel));
return {
inputId,
isLabeledByFormItem,
isChecked,
isDisabled,
isFocused,
checkboxButtonSize,
checkboxSize,
hasOwnLabel,
model,
actualValue,
handleChange,
onClickRoot
};
};
//#endregion
//#region ../../packages/components/checkbox/src/checkbox.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$63 = [
"id",
"indeterminate",
"name",
"tabindex",
"disabled"
];
var checkbox_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElCheckbox",
__name: "checkbox",
props: checkboxProps,
emits: checkboxEmits,
setup(__props) {
const props = __props;
const { inputId, isLabeledByFormItem, isChecked, isDisabled, isFocused, checkboxSize, hasOwnLabel, model, actualValue, handleChange, onClickRoot } = useCheckbox(props, (0, vue.useSlots)());
const inputBindings = (0, vue.computed)(() => {
if (props.trueValue || props.falseValue || props.trueLabel || props.falseLabel) return {
"true-value": props.trueValue ?? props.trueLabel ?? true,
"false-value": props.falseValue ?? props.falseLabel ?? false
};
return { value: actualValue.value };
});
const ns = useNamespace("checkbox");
const compKls = (0, vue.computed)(() => {
return [
ns.b(),
ns.m(checkboxSize.value),
ns.is("disabled", isDisabled.value),
ns.is("bordered", props.border),
ns.is("checked", isChecked.value)
];
});
const spanKls = (0, vue.computed)(() => {
return [
ns.e("input"),
ns.is("disabled", isDisabled.value),
ns.is("checked", isChecked.value),
ns.is("indeterminate", props.indeterminate),
ns.is("focus", isFocused.value)
];
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(!(0, vue.unref)(hasOwnLabel) && (0, vue.unref)(isLabeledByFormItem) ? "span" : "label"), {
for: !(0, vue.unref)(hasOwnLabel) && (0, vue.unref)(isLabeledByFormItem) ? null : (0, vue.unref)(inputId),
class: (0, vue.normalizeClass)(compKls.value),
"aria-controls": __props.indeterminate ? __props.ariaControls : null,
"aria-checked": __props.indeterminate ? "mixed" : void 0,
"aria-label": __props.ariaLabel,
onClick: (0, vue.unref)(onClickRoot)
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)(spanKls.value) }, [(0, vue.withDirectives)((0, vue.createElementVNode)("input", (0, vue.mergeProps)({
id: (0, vue.unref)(inputId),
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => (0, vue.isRef)(model) ? model.value = $event : null),
class: (0, vue.unref)(ns).e("original"),
type: "checkbox",
indeterminate: __props.indeterminate,
name: __props.name,
tabindex: __props.tabindex,
disabled: (0, vue.unref)(isDisabled)
}, inputBindings.value, {
onChange: _cache[1] || (_cache[1] = (...args) => (0, vue.unref)(handleChange) && (0, vue.unref)(handleChange)(...args)),
onFocus: _cache[2] || (_cache[2] = ($event) => isFocused.value = true),
onBlur: _cache[3] || (_cache[3] = ($event) => isFocused.value = false),
onClick: _cache[4] || (_cache[4] = (0, vue.withModifiers)(() => {}, ["stop"]))
}), null, 16, _hoisted_1$63), [[vue.vModelCheckbox, (0, vue.unref)(model)]]), (0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("inner")) }, null, 2)], 2), (0, vue.unref)(hasOwnLabel) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("label"))
}, [(0, vue.renderSlot)(_ctx.$slots, "default"), !_ctx.$slots.default ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.label), 1)], 64)) : (0, vue.createCommentVNode)("v-if", true)], 2)) : (0, vue.createCommentVNode)("v-if", true)]),
_: 3
}, 8, [
"for",
"class",
"aria-controls",
"aria-checked",
"aria-label",
"onClick"
]);
};
}
});
//#endregion
//#region ../../packages/components/checkbox/src/checkbox.vue
var checkbox_default = checkbox_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/checkbox/src/checkbox-button.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$62 = [
"name",
"tabindex",
"disabled"
];
var checkbox_button_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElCheckboxButton",
__name: "checkbox-button",
props: checkboxProps,
emits: checkboxEmits,
setup(__props) {
const props = __props;
const { isFocused, isChecked, isDisabled, checkboxButtonSize, model, actualValue, handleChange } = useCheckbox(props, (0, vue.useSlots)());
const inputBindings = (0, vue.computed)(() => {
if (props.trueValue || props.falseValue || props.trueLabel || props.falseLabel) return {
"true-value": props.trueValue ?? props.trueLabel ?? true,
"false-value": props.falseValue ?? props.falseLabel ?? false
};
return { value: actualValue.value };
});
const checkboxGroup = (0, vue.inject)(checkboxGroupContextKey, void 0);
const ns = useNamespace("checkbox");
const activeStyle = (0, vue.computed)(() => {
const fillValue = checkboxGroup?.fill?.value ?? "";
return {
backgroundColor: fillValue,
borderColor: fillValue,
color: checkboxGroup?.textColor?.value ?? "",
boxShadow: fillValue ? `-1px 0 0 0 ${fillValue}` : void 0
};
});
const labelKls = (0, vue.computed)(() => {
return [
ns.b("button"),
ns.bm("button", checkboxButtonSize.value),
ns.is("disabled", isDisabled.value),
ns.is("checked", isChecked.value),
ns.is("focus", isFocused.value)
];
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("label", { class: (0, vue.normalizeClass)(labelKls.value) }, [(0, vue.withDirectives)((0, vue.createElementVNode)("input", (0, vue.mergeProps)({
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => (0, vue.isRef)(model) ? model.value = $event : null),
class: (0, vue.unref)(ns).be("button", "original"),
type: "checkbox",
name: __props.name,
tabindex: __props.tabindex,
disabled: (0, vue.unref)(isDisabled)
}, inputBindings.value, {
onChange: _cache[1] || (_cache[1] = (...args) => (0, vue.unref)(handleChange) && (0, vue.unref)(handleChange)(...args)),
onFocus: _cache[2] || (_cache[2] = ($event) => isFocused.value = true),
onBlur: _cache[3] || (_cache[3] = ($event) => isFocused.value = false),
onClick: _cache[4] || (_cache[4] = (0, vue.withModifiers)(() => {}, ["stop"]))
}), null, 16, _hoisted_1$62), [[vue.vModelCheckbox, (0, vue.unref)(model)]]), _ctx.$slots.default || __props.label ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("button", "inner")),
style: (0, vue.normalizeStyle)((0, vue.unref)(isChecked) ? activeStyle.value : void 0)
}, [(0, vue.renderSlot)(_ctx.$slots, "default", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.label), 1)])], 6)) : (0, vue.createCommentVNode)("v-if", true)], 2);
};
}
});
//#endregion
//#region ../../packages/components/checkbox/src/checkbox-button.vue
var checkbox_button_default = checkbox_button_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/checkbox/src/checkbox-group.ts
/**
* @deprecated Removed after 3.0.0, Use `CheckboxGroupProps` instead.
*/
const checkboxGroupProps = buildProps({
modelValue: {
type: definePropType(Array),
default: () => []
},
disabled: {
type: Boolean,
default: void 0
},
min: Number,
max: Number,
size: useSizeProp,
fill: String,
textColor: String,
tag: {
type: String,
default: "div"
},
validateEvent: {
type: Boolean,
default: true
},
options: { type: definePropType(Array) },
props: {
type: definePropType(Object),
default: () => checkboxDefaultProps
},
type: {
type: String,
values: ["checkbox", "button"],
default: "checkbox"
},
...useAriaProps(["ariaLabel"])
});
const checkboxGroupEmits = {
[UPDATE_MODEL_EVENT]: (val) => isArray$1(val),
change: (val) => isArray$1(val)
};
const checkboxDefaultProps = {
label: "label",
value: "value",
disabled: "disabled"
};
//#endregion
//#region ../../packages/components/checkbox/src/checkbox-group.vue?vue&type=script&setup=true&lang.ts
var checkbox_group_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElCheckboxGroup",
__name: "checkbox-group",
props: checkboxGroupProps,
emits: checkboxGroupEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const ns = useNamespace("checkbox");
const checkboxDisabled = useFormDisabled();
const { formItem } = useFormItem();
const { inputId: groupId, isLabeledByFormItem } = useFormItemInputId(props, { formItemContext: formItem });
const changeEvent = async (value) => {
emit(UPDATE_MODEL_EVENT, value);
await (0, vue.nextTick)();
emit(CHANGE_EVENT, value);
};
const modelValue = (0, vue.computed)({
get() {
return props.modelValue;
},
set(val) {
changeEvent(val);
}
});
const aliasProps = (0, vue.computed)(() => ({
...checkboxDefaultProps,
...props.props
}));
const getOptionProps = (option) => {
const { label, value, disabled } = aliasProps.value;
const base = {
label: option[label],
value: option[value],
disabled: option[disabled]
};
return {
...omit(option, [
label,
value,
disabled
]),
...base
};
};
const optionComponent = (0, vue.computed)(() => props.type === "button" ? checkbox_button_default : checkbox_default);
(0, vue.provide)(checkboxGroupContextKey, {
...pick((0, vue.toRefs)(props), [
"size",
"min",
"max",
"validateEvent",
"fill",
"textColor"
]),
disabled: checkboxDisabled,
modelValue,
changeEvent
});
(0, vue.watch)(() => props.modelValue, (newVal, oldValue) => {
if (props.validateEvent && !isEqual$1(newVal, oldValue)) formItem?.validate("change").catch((err) => /* @__PURE__ */ debugWarn(err));
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.tag), {
id: (0, vue.unref)(groupId),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b("group")),
role: "group",
"aria-label": !(0, vue.unref)(isLabeledByFormItem) ? __props.ariaLabel || "checkbox-group" : void 0,
"aria-labelledby": (0, vue.unref)(isLabeledByFormItem) ? (0, vue.unref)(formItem)?.labelId : void 0
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default", {}, () => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.options, (item, index) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(optionComponent.value), (0, vue.mergeProps)({ key: index }, { ref_for: true }, getOptionProps(item)), null, 16);
}), 128))])]),
_: 3
}, 8, [
"id",
"class",
"aria-label",
"aria-labelledby"
]);
};
}
});
//#endregion
//#region ../../packages/components/checkbox/src/checkbox-group.vue
var checkbox_group_default = checkbox_group_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/checkbox/index.ts
const ElCheckbox = withInstall(checkbox_default, {
CheckboxButton: checkbox_button_default,
CheckboxGroup: checkbox_group_default
});
const ElCheckboxButton = withNoopInstall(checkbox_button_default);
const ElCheckboxGroup = withNoopInstall(checkbox_group_default);
//#endregion
//#region ../../packages/components/radio/src/radio.ts
/**
* @deprecated Removed after 3.0.0, Use `RadioPropsBase` instead.
*/
const radioPropsBase = buildProps({
modelValue: {
type: [
String,
Number,
Boolean
],
default: void 0
},
size: useSizeProp,
disabled: {
type: Boolean,
default: void 0
},
label: {
type: [
String,
Number,
Boolean
],
default: void 0
},
value: {
type: [
String,
Number,
Boolean
],
default: void 0
},
name: {
type: String,
default: void 0
}
});
/**
* @deprecated Removed after 3.0.0, Use `RadioProps` instead.
*/
const radioProps = buildProps({
...radioPropsBase,
border: Boolean
});
const radioEmits = {
[UPDATE_MODEL_EVENT]: (val) => isString(val) || isNumber(val) || isBoolean(val),
[CHANGE_EVENT]: (val) => isString(val) || isNumber(val) || isBoolean(val)
};
/**
* @description default values for RadioProps
*/
const radioPropsDefaults = {
modelValue: void 0,
disabled: void 0,
label: void 0,
value: void 0,
name: void 0,
border: false
};
//#endregion
//#region ../../packages/components/radio/src/constants.ts
const radioGroupKey = Symbol("radioGroupKey");
//#endregion
//#region ../../packages/components/radio/src/use-radio.ts
const useRadio = (props, emit) => {
const radioRef = (0, vue.ref)();
const radioGroup = (0, vue.inject)(radioGroupKey, void 0);
const isGroup = (0, vue.computed)(() => !!radioGroup);
const actualValue = (0, vue.computed)(() => {
if (!isPropAbsent(props.value)) return props.value;
return props.label;
});
const modelValue = (0, vue.computed)({
get() {
return isGroup.value ? radioGroup.modelValue : props.modelValue;
},
set(val) {
if (isGroup.value) radioGroup.changeEvent(val);
else emit && emit(UPDATE_MODEL_EVENT, val);
radioRef.value.checked = props.modelValue === actualValue.value;
}
});
const size = useFormSize((0, vue.computed)(() => radioGroup?.size));
const disabled = useFormDisabled((0, vue.computed)(() => radioGroup?.disabled));
const focus = (0, vue.ref)(false);
const tabIndex = (0, vue.computed)(() => {
return disabled.value || isGroup.value && modelValue.value !== actualValue.value ? -1 : 0;
});
useDeprecated({
from: "label act as value",
replacement: "value",
version: "3.0.0",
scope: "el-radio",
ref: "https://element-plus.org/en-US/component/radio.html"
}, (0, vue.computed)(() => isGroup.value && isPropAbsent(props.value)));
return {
radioRef,
isGroup,
radioGroup,
focus,
size,
disabled,
tabIndex,
modelValue,
actualValue
};
};
//#endregion
//#region ../../packages/components/radio/src/radio.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$61 = [
"value",
"name",
"disabled",
"checked"
];
var radio_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElRadio",
__name: "radio",
props: radioProps,
emits: radioEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const ns = useNamespace("radio");
const { radioRef, radioGroup, focus, size, disabled, modelValue, actualValue } = useRadio(props, emit);
function handleChange() {
(0, vue.nextTick)(() => emit(CHANGE_EVENT, modelValue.value));
}
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("label", { class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).b(),
(0, vue.unref)(ns).is("disabled", (0, vue.unref)(disabled)),
(0, vue.unref)(ns).is("focus", (0, vue.unref)(focus)),
(0, vue.unref)(ns).is("bordered", __props.border),
(0, vue.unref)(ns).is("checked", (0, vue.unref)(modelValue) === (0, vue.unref)(actualValue)),
(0, vue.unref)(ns).m((0, vue.unref)(size))
]) }, [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).e("input"),
(0, vue.unref)(ns).is("disabled", (0, vue.unref)(disabled)),
(0, vue.unref)(ns).is("checked", (0, vue.unref)(modelValue) === (0, vue.unref)(actualValue))
]) }, [(0, vue.withDirectives)((0, vue.createElementVNode)("input", {
ref_key: "radioRef",
ref: radioRef,
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => (0, vue.isRef)(modelValue) ? modelValue.value = $event : null),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("original")),
value: (0, vue.unref)(actualValue),
name: __props.name || (0, vue.unref)(radioGroup)?.name,
disabled: (0, vue.unref)(disabled),
checked: (0, vue.unref)(modelValue) === (0, vue.unref)(actualValue),
type: "radio",
onFocus: _cache[1] || (_cache[1] = ($event) => focus.value = true),
onBlur: _cache[2] || (_cache[2] = ($event) => focus.value = false),
onChange: handleChange,
onClick: _cache[3] || (_cache[3] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, null, 42, _hoisted_1$61), [[vue.vModelRadio, (0, vue.unref)(modelValue)]]), (0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("inner")) }, null, 2)], 2), (0, vue.createElementVNode)("span", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("label")),
onKeydown: _cache[4] || (_cache[4] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, [(0, vue.renderSlot)(_ctx.$slots, "default", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.label), 1)])], 34)], 2);
};
}
});
//#endregion
//#region ../../packages/components/radio/src/radio.vue
var radio_default = radio_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/radio/src/radio-button.ts
/**
* @deprecated Removed after 3.0.0, Use `RadioButtonProps` instead.
*/
const radioButtonProps = buildProps({ ...radioPropsBase });
/**
* @description default values for RadioButtonProps
*/
const radioButtonPropsDefaults = {
modelValue: void 0,
disabled: void 0,
label: void 0,
value: void 0,
name: void 0
};
//#endregion
//#region ../../packages/components/radio/src/radio-button.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$60 = [
"value",
"name",
"disabled"
];
var radio_button_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElRadioButton",
__name: "radio-button",
props: radioButtonProps,
setup(__props) {
const props = __props;
const ns = useNamespace("radio");
const { radioRef, focus, size, disabled, modelValue, radioGroup, actualValue } = useRadio(props);
const activeStyle = (0, vue.computed)(() => {
return {
backgroundColor: radioGroup?.fill || "",
borderColor: radioGroup?.fill || "",
boxShadow: radioGroup?.fill ? `-1px 0 0 0 ${radioGroup.fill}` : "",
color: radioGroup?.textColor || ""
};
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("label", { class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).b("button"),
(0, vue.unref)(ns).is("active", (0, vue.unref)(modelValue) === (0, vue.unref)(actualValue)),
(0, vue.unref)(ns).is("disabled", (0, vue.unref)(disabled)),
(0, vue.unref)(ns).is("focus", (0, vue.unref)(focus)),
(0, vue.unref)(ns).bm("button", (0, vue.unref)(size))
]) }, [(0, vue.withDirectives)((0, vue.createElementVNode)("input", {
ref_key: "radioRef",
ref: radioRef,
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => (0, vue.isRef)(modelValue) ? modelValue.value = $event : null),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("button", "original-radio")),
value: (0, vue.unref)(actualValue),
type: "radio",
name: __props.name || (0, vue.unref)(radioGroup)?.name,
disabled: (0, vue.unref)(disabled),
onFocus: _cache[1] || (_cache[1] = ($event) => focus.value = true),
onBlur: _cache[2] || (_cache[2] = ($event) => focus.value = false),
onClick: _cache[3] || (_cache[3] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, null, 42, _hoisted_1$60), [[vue.vModelRadio, (0, vue.unref)(modelValue)]]), (0, vue.createElementVNode)("span", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("button", "inner")),
style: (0, vue.normalizeStyle)((0, vue.unref)(modelValue) === (0, vue.unref)(actualValue) ? activeStyle.value : {}),
onKeydown: _cache[4] || (_cache[4] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, [(0, vue.renderSlot)(_ctx.$slots, "default", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.label), 1)])], 38)], 2);
};
}
});
//#endregion
//#region ../../packages/components/radio/src/radio-button.vue
var radio_button_default = radio_button_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/radio/src/radio-group.ts
const radioDefaultProps = {
label: "label",
value: "value",
disabled: "disabled"
};
/**
* @deprecated Removed after 3.0.0, Use `RadioGroupProps` instead.
*/
const radioGroupProps = buildProps({
id: {
type: String,
default: void 0
},
size: useSizeProp,
disabled: {
type: Boolean,
default: void 0
},
modelValue: {
type: [
String,
Number,
Boolean
],
default: void 0
},
fill: {
type: String,
default: ""
},
textColor: {
type: String,
default: ""
},
name: {
type: String,
default: void 0
},
validateEvent: {
type: Boolean,
default: true
},
options: { type: definePropType(Array) },
props: {
type: definePropType(Object),
default: () => radioDefaultProps
},
type: {
type: String,
values: ["radio", "button"],
default: "radio"
},
...useAriaProps(["ariaLabel"])
});
const radioGroupEmits = radioEmits;
/**
* @description default values for RadioGroupProps
*/
const radioGroupPropsDefaults = {
id: void 0,
disabled: void 0,
modelValue: void 0,
fill: "",
textColor: "",
name: void 0,
validateEvent: true,
props: () => radioDefaultProps,
type: "radio"
};
//#endregion
//#region ../../packages/components/radio/src/radio-group.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$59 = [
"id",
"aria-label",
"aria-labelledby"
];
var radio_group_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElRadioGroup",
__name: "radio-group",
props: radioGroupProps,
emits: radioGroupEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const ns = useNamespace("radio");
const radioId = useId();
const radioGroupRef = (0, vue.ref)();
const { formItem } = useFormItem();
const { inputId: groupId, isLabeledByFormItem } = useFormItemInputId(props, { formItemContext: formItem });
const changeEvent = (value) => {
emit(UPDATE_MODEL_EVENT, value);
(0, vue.nextTick)(() => emit(CHANGE_EVENT, value));
};
(0, vue.onMounted)(() => {
const radios = radioGroupRef.value.querySelectorAll("[type=radio]");
const firstLabel = radios[0];
if (!Array.from(radios).some((radio) => radio.checked) && firstLabel) firstLabel.tabIndex = 0;
});
const name = (0, vue.computed)(() => {
return props.name || radioId.value;
});
const aliasProps = (0, vue.computed)(() => ({
...radioDefaultProps,
...props.props
}));
const getOptionProps = (option) => {
const { label, value, disabled } = aliasProps.value;
const base = {
label: option[label],
value: option[value],
disabled: option[disabled]
};
return {
...omit(option, [
label,
value,
disabled
]),
...base
};
};
const optionComponent = (0, vue.computed)(() => props.type === "button" ? radio_button_default : radio_default);
(0, vue.provide)(radioGroupKey, (0, vue.reactive)({
...(0, vue.toRefs)(props),
changeEvent,
name
}));
(0, vue.watch)(() => props.modelValue, (newVal, oldValue) => {
if (props.validateEvent && !isEqual$1(newVal, oldValue)) formItem?.validate("change").catch((err) => /* @__PURE__ */ debugWarn(err));
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
id: (0, vue.unref)(groupId),
ref_key: "radioGroupRef",
ref: radioGroupRef,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b("group")),
role: "radiogroup",
"aria-label": !(0, vue.unref)(isLabeledByFormItem) ? __props.ariaLabel || "radio-group" : void 0,
"aria-labelledby": (0, vue.unref)(isLabeledByFormItem) ? (0, vue.unref)(formItem).labelId : void 0
}, [(0, vue.renderSlot)(_ctx.$slots, "default", {}, () => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.options, (item, index) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(optionComponent.value), (0, vue.mergeProps)({ key: index }, { ref_for: true }, getOptionProps(item)), null, 16);
}), 128))])], 10, _hoisted_1$59);
};
}
});
//#endregion
//#region ../../packages/components/radio/src/radio-group.vue
var radio_group_default = radio_group_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/radio/index.ts
const ElRadio = withInstall(radio_default, {
RadioButton: radio_button_default,
RadioGroup: radio_group_default
});
const ElRadioGroup = withNoopInstall(radio_group_default);
const ElRadioButton = withNoopInstall(radio_button_default);
//#endregion
//#region ../../packages/components/cascader-panel/src/types.ts
const CASCADER_PANEL_INJECTION_KEY = Symbol();
//#endregion
//#region ../../packages/components/cascader-panel/src/node-content.tsx
function isVNodeEmpty(vnodes) {
return !!(isArray$1(vnodes) ? vnodes.every(({ type }) => type === vue.Comment) : vnodes?.type === vue.Comment);
}
var node_content_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "NodeContent",
props: { node: {
type: Object,
required: true
} },
setup(props) {
const ns = useNamespace("cascader-node");
const { renderLabelFn } = (0, vue.inject)(CASCADER_PANEL_INJECTION_KEY);
const { node } = props;
const { data, label: nodeLabel } = node;
const label = () => {
const renderLabel = renderLabelFn?.({
node,
data
});
return isVNodeEmpty(renderLabel) ? nodeLabel : renderLabel ?? nodeLabel;
};
return () => (0, vue.createVNode)("span", { "class": ns.e("label") }, [label()]);
}
});
//#endregion
//#region ../../packages/components/cascader-panel/src/node.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$58 = [
"id",
"aria-haspopup",
"aria-owns",
"aria-expanded",
"tabindex"
];
var node_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElCascaderNode",
__name: "node",
props: {
node: {
type: Object,
required: true
},
menuId: String
},
emits: ["expand"],
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const panel = (0, vue.inject)(CASCADER_PANEL_INJECTION_KEY);
const ns = useNamespace("cascader-node");
const isHoverMenu = (0, vue.computed)(() => panel.isHoverMenu);
const multiple = (0, vue.computed)(() => panel.config.multiple);
const checkStrictly = (0, vue.computed)(() => panel.config.checkStrictly);
const showPrefix = (0, vue.computed)(() => panel.config.showPrefix);
const checkedNodeId = (0, vue.computed)(() => panel.checkedNodes[0]?.uid);
const isDisabled = (0, vue.computed)(() => props.node.isDisabled);
const isLeaf = (0, vue.computed)(() => props.node.isLeaf);
const expandable = (0, vue.computed)(() => checkStrictly.value && !isLeaf.value || !isDisabled.value);
const inExpandingPath = (0, vue.computed)(() => isInPath(panel.expandingNode));
const inCheckedPath = (0, vue.computed)(() => checkStrictly.value && panel.checkedNodes.some(isInPath));
const isInPath = (node) => {
const { level, uid } = props.node;
return node?.pathNodes[level - 1]?.uid === uid;
};
const doExpand = () => {
if (inExpandingPath.value) return;
panel.expandNode(props.node);
};
const doCheck = (checked) => {
const { node } = props;
if (checked === node.checked) return;
panel.handleCheckChange(node, checked);
};
const doLoad = () => {
panel.lazyLoad(props.node, () => {
if (!isLeaf.value) doExpand();
});
};
const handleHoverExpand = (e) => {
if (!isHoverMenu.value) return;
handleExpand();
!isLeaf.value && emit("expand", e);
};
const handleExpand = () => {
const { node } = props;
if (!expandable.value || node.loading) return;
node.loaded ? doExpand() : doLoad();
};
const handleClick = () => {
if (isLeaf.value && !isDisabled.value && !checkStrictly.value && !multiple.value) handleCheck(true);
else if ((panel.config.checkOnClickNode && (multiple.value || checkStrictly.value) || isLeaf.value && panel.config.checkOnClickLeaf) && !isDisabled.value) handleSelectCheck(!props.node.checked);
else if (!isHoverMenu.value) handleExpand();
};
const handleSelectCheck = (checked) => {
if (checkStrictly.value) {
doCheck(checked);
if (props.node.loaded) doExpand();
} else handleCheck(checked);
};
const handleCheck = (checked) => {
if (!props.node.loaded) doLoad();
else {
doCheck(checked);
!checkStrictly.value && doExpand();
}
};
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
id: `${__props.menuId}-${__props.node.uid}`,
role: "menuitem",
"aria-haspopup": !isLeaf.value,
"aria-owns": isLeaf.value ? void 0 : __props.menuId,
"aria-expanded": inExpandingPath.value,
tabindex: expandable.value ? -1 : void 0,
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).b(),
(0, vue.unref)(ns).is("selectable", checkStrictly.value),
(0, vue.unref)(ns).is("active", __props.node.checked),
(0, vue.unref)(ns).is("disabled", !expandable.value),
inExpandingPath.value && "in-active-path",
inCheckedPath.value && "in-checked-path"
]),
onMouseenter: handleHoverExpand,
onFocus: handleHoverExpand,
onClick: handleClick
}, [
(0, vue.createCommentVNode)(" prefix "),
multiple.value && showPrefix.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElCheckbox), {
key: 0,
"model-value": __props.node.checked,
indeterminate: __props.node.indeterminate,
disabled: isDisabled.value,
onClick: _cache[0] || (_cache[0] = (0, vue.withModifiers)(() => {}, ["stop"])),
"onUpdate:modelValue": handleSelectCheck
}, null, 8, [
"model-value",
"indeterminate",
"disabled"
])) : checkStrictly.value && showPrefix.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElRadio), {
key: 1,
"model-value": checkedNodeId.value,
label: __props.node.uid,
disabled: isDisabled.value,
"onUpdate:modelValue": handleSelectCheck,
onClick: _cache[1] || (_cache[1] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, {
default: (0, vue.withCtx)(() => [(0, vue.createCommentVNode)("\n Add an empty element to avoid render label,\n do not use empty fragment here for https://github.com/vuejs/vue-next/pull/2485\n "), _cache[2] || (_cache[2] = (0, vue.createElementVNode)("span", null, null, -1))]),
_: 1
}, 8, [
"model-value",
"label",
"disabled"
])) : isLeaf.value && __props.node.checked ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 2,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("prefix"))
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(check_default))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createCommentVNode)(" content "),
(0, vue.createVNode)((0, vue.unref)(node_content_default), { node: __props.node }, null, 8, ["node"]),
(0, vue.createCommentVNode)(" postfix "),
!isLeaf.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 3 }, [__props.node.loading ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).is("loading"), (0, vue.unref)(ns).e("postfix")])
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(loading_default))]),
_: 1
}, 8, ["class"])) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 1,
class: (0, vue.normalizeClass)(["arrow-right", (0, vue.unref)(ns).e("postfix")])
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(arrow_right_default))]),
_: 1
}, 8, ["class"]))], 64)) : (0, vue.createCommentVNode)("v-if", true)
], 42, _hoisted_1$58);
};
}
});
//#endregion
//#region ../../packages/components/cascader-panel/src/node.vue
var node_default = node_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/cascader-panel/src/menu.vue?vue&type=script&setup=true&lang.ts
var menu_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElCascaderMenu",
__name: "menu",
props: {
nodes: {
type: Array,
required: true
},
index: {
type: Number,
required: true
}
},
setup(__props) {
const props = __props;
const instance = (0, vue.getCurrentInstance)();
const ns = useNamespace("cascader-menu");
const { t } = useLocale();
const id = useId();
let activeNode;
let hoverTimer;
const panel = (0, vue.inject)(CASCADER_PANEL_INJECTION_KEY);
const hoverZone = (0, vue.ref)();
const isEmpty = (0, vue.computed)(() => !props.nodes.length);
const isLoading = (0, vue.computed)(() => !panel.initialLoaded);
const menuId = (0, vue.computed)(() => `${id.value}-${props.index}`);
const handleExpand = (e) => {
activeNode = e.target;
};
const handleMouseMove = (e) => {
if (!panel.isHoverMenu || !activeNode || !hoverZone.value) return;
if (activeNode.contains(e.target)) {
clearHoverTimer();
const el = instance.vnode.el;
const { left } = el.getBoundingClientRect();
const { offsetWidth, offsetHeight } = el;
const startX = e.clientX - left;
const top = activeNode.offsetTop;
const bottom = top + activeNode.offsetHeight;
const scrollTop = el.querySelector(`.${ns.e("wrap")}`)?.scrollTop || 0;
hoverZone.value.innerHTML = `
<path style="pointer-events: auto;" fill="transparent" d="M${startX} ${top} L${offsetWidth} ${scrollTop} V${top} Z" />
<path style="pointer-events: auto;" fill="transparent" d="M${startX} ${bottom} L${offsetWidth} ${offsetHeight + scrollTop} V${bottom} Z" />
`;
} else if (!hoverTimer) hoverTimer = window.setTimeout(clearHoverZone, panel.config.hoverThreshold);
};
const clearHoverTimer = () => {
if (!hoverTimer) return;
clearTimeout(hoverTimer);
hoverTimer = void 0;
};
const clearHoverZone = () => {
if (!hoverZone.value) return;
hoverZone.value.innerHTML = "";
clearHoverTimer();
};
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElScrollbar), {
key: menuId.value,
tag: "ul",
role: "menu",
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()),
"wrap-class": (0, vue.unref)(ns).e("wrap"),
"view-class": [(0, vue.unref)(ns).e("list"), (0, vue.unref)(ns).is("empty", isEmpty.value)],
onMousemove: handleMouseMove,
onMouseleave: clearHoverZone
}, {
default: (0, vue.withCtx)(() => [
((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.nodes, (node) => {
return (0, vue.openBlock)(), (0, vue.createBlock)(node_default, {
key: node.uid,
node,
"menu-id": menuId.value,
onExpand: handleExpand
}, null, 8, ["node", "menu-id"]);
}), 128)),
isLoading.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("empty-text"))
}, [(0, vue.createVNode)((0, vue.unref)(ElIcon), {
size: "14",
class: (0, vue.normalizeClass)((0, vue.unref)(ns).is("loading"))
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(loading_default))]),
_: 1
}, 8, ["class"]), (0, vue.createTextVNode)(" " + (0, vue.toDisplayString)((0, vue.unref)(t)("el.cascader.loading")), 1)], 2)) : isEmpty.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("empty-text"))
}, [(0, vue.renderSlot)(_ctx.$slots, "empty", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(t)("el.cascader.noData")), 1)])], 2)) : (0, vue.unref)(panel)?.isHoverMenu ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 2 }, [(0, vue.createCommentVNode)(" eslint-disable vue/html-self-closing "), ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
ref_key: "hoverZone",
ref: hoverZone,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("hover-zone"))
}, null, 2))], 2112)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createCommentVNode)(" eslint-enable vue/html-self-closing ")
]),
_: 3
}, 8, [
"class",
"wrap-class",
"view-class"
]);
};
}
});
//#endregion
//#region ../../packages/components/cascader-panel/src/menu.vue
var menu_default$1 = menu_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/cascader-panel/src/node.ts
let uid = 0;
const calculatePathNodes = (node) => {
const nodes = [node];
let { parent } = node;
while (parent) {
nodes.unshift(parent);
parent = parent.parent;
}
return nodes;
};
var Node$2 = class Node$2 {
constructor(data, config, parent, root = false) {
this.data = data;
this.config = config;
this.parent = parent;
this.root = root;
this.uid = uid++;
this.checked = false;
this.indeterminate = false;
this.loading = false;
const { value: valueKey, label: labelKey, children: childrenKey } = config;
const childrenData = data[childrenKey];
const pathNodes = calculatePathNodes(this);
this.level = root ? 0 : parent ? parent.level + 1 : 1;
this.value = data[valueKey];
this.label = data[labelKey];
this.pathNodes = pathNodes;
this.pathValues = pathNodes.map((node) => node.value);
this.pathLabels = pathNodes.map((node) => node.label);
this.childrenData = childrenData;
this.children = (childrenData || []).map((child) => new Node$2(child, config, this));
this.loaded = !config.lazy || this.isLeaf || !isEmpty(childrenData);
this.text = "";
}
get isDisabled() {
const { data, parent, config } = this;
const { disabled, checkStrictly } = config;
return (isFunction$1(disabled) ? disabled(data, this) : !!data[disabled]) || !checkStrictly && !!parent?.isDisabled;
}
get isLeaf() {
const { data, config, childrenData, loaded } = this;
const { lazy, leaf } = config;
const isLeaf = isFunction$1(leaf) ? leaf(data, this) : data[leaf];
return isUndefined(isLeaf) ? lazy && !loaded ? false : !(isArray$1(childrenData) && childrenData.length) : !!isLeaf;
}
get valueByOption() {
return this.config.emitPath ? this.pathValues : this.value;
}
appendChild(childData) {
const { childrenData, children } = this;
const node = new Node$2(childData, this.config, this);
if (isArray$1(childrenData)) childrenData.push(childData);
else this.childrenData = [childData];
children.push(node);
return node;
}
calcText(allLevels, separator) {
const text = allLevels ? this.pathLabels.join(separator) : this.label;
this.text = text;
return text;
}
broadcast(checked) {
this.children.forEach((child) => {
if (child) {
child.broadcast(checked);
child.onParentCheck?.(checked);
}
});
}
emit() {
const { parent } = this;
if (parent) {
parent.onChildCheck?.();
parent.emit();
}
}
onParentCheck(checked) {
if (!this.isDisabled) this.setCheckState(checked);
}
onChildCheck() {
const { children } = this;
const validChildren = children.filter((child) => !child.isDisabled);
const checked = validChildren.length ? validChildren.every((child) => child.checked) : false;
this.setCheckState(checked);
}
setCheckState(checked) {
const totalNum = this.children.length;
const checkedNum = this.children.reduce((c, p) => {
return c + (p.checked ? 1 : p.indeterminate ? .5 : 0);
}, 0);
this.checked = this.loaded && this.children.filter((child) => !child.isDisabled).every((child) => child.loaded && child.checked) && checked;
this.indeterminate = this.loaded && checkedNum !== totalNum && checkedNum > 0;
}
doCheck(checked) {
if (this.checked === checked) return;
const { checkStrictly, multiple } = this.config;
if (checkStrictly || !multiple) this.checked = checked;
else {
this.broadcast(checked);
this.setCheckState(checked);
this.emit();
}
}
};
//#endregion
//#region ../../packages/components/cascader-panel/src/store.ts
const flatNodes = (nodes, leafOnly) => {
return nodes.reduce((res, node) => {
if (node.isLeaf) res.push(node);
else {
!leafOnly && res.push(node);
res = res.concat(flatNodes(node.children, leafOnly));
}
return res;
}, []);
};
var Store = class {
constructor(data, config) {
this.config = config;
const nodes = (data || []).map((nodeData) => new Node$2(nodeData, this.config));
this.nodes = nodes;
this.allNodes = flatNodes(nodes, false);
this.leafNodes = flatNodes(nodes, true);
}
getNodes() {
return this.nodes;
}
getFlattedNodes(leafOnly) {
return leafOnly ? this.leafNodes : this.allNodes;
}
appendNode(nodeData, parentNode) {
const node = parentNode ? parentNode.appendChild(nodeData) : new Node$2(nodeData, this.config);
if (!parentNode) this.nodes.push(node);
this.appendAllNodesAndLeafNodes(node);
}
appendNodes(nodeDataList, parentNode) {
if (nodeDataList.length > 0) nodeDataList.forEach((nodeData) => this.appendNode(nodeData, parentNode));
else parentNode && parentNode.isLeaf && this.leafNodes.push(parentNode);
}
appendAllNodesAndLeafNodes(node) {
this.allNodes.push(node);
node.isLeaf && this.leafNodes.push(node);
if (node.children) node.children.forEach((subNode) => {
this.appendAllNodesAndLeafNodes(subNode);
});
}
getNodeByValue(value, leafOnly = false) {
if (isPropAbsent(value)) return null;
return this.getFlattedNodes(leafOnly).find((node) => isEqual$1(node.value, value) || isEqual$1(node.pathValues, value)) || null;
}
getSameNode(node) {
if (!node) return null;
return this.getFlattedNodes(false).find(({ value, level }) => isEqual$1(node.value, value) && node.level === level) || null;
}
};
//#endregion
//#region ../../packages/components/cascader-panel/src/utils.ts
const getMenuIndex = (el) => {
if (!el) return 0;
const pieces = el.id.split("-");
return Number(pieces[pieces.length - 2]);
};
const checkNode = (el) => {
if (!el) return;
const input = el.querySelector("input");
if (input) input.click();
else if (isLeaf(el)) el.click();
};
const sortByOriginalOrder = (oldNodes, newNodes) => {
const newNodesCopy = newNodes.slice(0);
const newIds = newNodesCopy.map((node) => node.uid);
const res = oldNodes.reduce((acc, item) => {
const index = newIds.indexOf(item.uid);
if (index > -1) {
acc.push(item);
newNodesCopy.splice(index, 1);
newIds.splice(index, 1);
}
return acc;
}, []);
res.push(...newNodesCopy);
return res;
};
//#endregion
//#region ../../packages/components/cascader-panel/src/index.vue?vue&type=script&setup=true&lang.ts
var index_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElCascaderPanel",
__name: "index",
props: cascaderPanelProps,
emits: cascaderPanelEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
let manualChecked = false;
const ns = useNamespace("cascader");
const config = useCascaderConfig(props);
const slots = (0, vue.useSlots)();
let store;
const initialLoaded = (0, vue.ref)(true);
const initialLoadedOnce = (0, vue.ref)(false);
const menuList = (0, vue.ref)([]);
const checkedValue = (0, vue.ref)();
const menus = (0, vue.ref)([]);
const expandingNode = (0, vue.ref)();
const checkedNodes = (0, vue.ref)([]);
const isHoverMenu = (0, vue.computed)(() => config.value.expandTrigger === "hover");
const renderLabelFn = (0, vue.computed)(() => props.renderLabel || slots.default);
const initStore = () => {
const { options } = props;
const cfg = config.value;
manualChecked = false;
store = new Store(options, cfg);
menus.value = [store.getNodes()];
if (cfg.lazy && isEmpty(props.options)) {
initialLoaded.value = false;
lazyLoad(void 0, (list) => {
if (list) {
store = new Store(list, cfg);
menus.value = [store.getNodes()];
}
initialLoaded.value = true;
syncCheckedValue(false, true);
});
} else syncCheckedValue(false, true);
};
const lazyLoad = (node, cb) => {
const cfg = config.value;
node = node || new Node$2({}, cfg, void 0, true);
node.loading = true;
const resolve = (dataList) => {
const _node = node;
const parent = _node.root ? null : _node;
_node.loading = false;
_node.loaded = true;
_node.childrenData = _node.childrenData || [];
dataList && store?.appendNodes(dataList, parent);
dataList && cb?.(dataList);
if (node.level === 0) initialLoadedOnce.value = true;
};
const reject = () => {
node.loading = false;
node.loaded = false;
if (node.level === 0) initialLoaded.value = true;
};
cfg.lazyLoad(node, resolve, reject);
};
const expandNode = (node, silent) => {
const { level } = node;
const newMenus = menus.value.slice(0, level);
let newExpandingNode;
if (node.isLeaf) newExpandingNode = node.pathNodes[level - 2];
else {
newExpandingNode = node;
newMenus.push(node.children);
}
if (expandingNode.value?.uid !== newExpandingNode?.uid) {
expandingNode.value = node;
menus.value = newMenus;
!silent && emit("expand-change", node?.pathValues || []);
}
};
const handleCheckChange = (node, checked, emitClose = true) => {
const { checkStrictly, multiple } = config.value;
const oldNode = checkedNodes.value[0];
manualChecked = true;
!multiple && oldNode?.doCheck(false);
node.doCheck(checked);
calculateCheckedValue();
emitClose && !multiple && !checkStrictly && emit("close");
!emitClose && !multiple && expandParentNode(node);
};
const expandParentNode = (node) => {
if (!node) return;
node = node.parent;
expandParentNode(node);
node && expandNode(node);
};
const getFlattedNodes = (leafOnly) => store?.getFlattedNodes(leafOnly);
const getCheckedNodes = (leafOnly) => {
return getFlattedNodes(leafOnly)?.filter(({ checked }) => checked !== false);
};
const clearCheckedNodes = () => {
checkedNodes.value.forEach((node) => node.doCheck(false));
calculateCheckedValue();
menus.value = menus.value.slice(0, 1);
expandingNode.value = void 0;
emit("expand-change", []);
};
const calculateCheckedValue = () => {
const { checkStrictly, multiple } = config.value;
const oldNodes = checkedNodes.value;
const nodes = sortByOriginalOrder(oldNodes, getCheckedNodes(!checkStrictly));
const values = nodes.map((node) => node.valueByOption);
checkedNodes.value = nodes;
checkedValue.value = multiple ? values : values[0] ?? null;
};
const syncCheckedValue = (loaded = false, forced = false) => {
const { modelValue } = props;
const { lazy, multiple, checkStrictly } = config.value;
const leafOnly = !checkStrictly;
if (!initialLoaded.value || manualChecked || !forced && isEqual$1(modelValue, checkedValue.value)) return;
if (lazy && !loaded) {
const nodes = unique(flattenDeep(castArray(modelValue))).map((val) => store?.getNodeByValue(val)).filter((node) => !!node && !node.loaded && !node.loading);
if (nodes.length) nodes.forEach((node) => {
lazyLoad(node, () => syncCheckedValue(false, forced));
});
else syncCheckedValue(true, forced);
} else {
syncMenuState(unique((multiple ? castArray(modelValue) : [modelValue]).map((val) => store?.getNodeByValue(val, leafOnly))), forced);
checkedValue.value = cloneDeep(modelValue ?? void 0);
}
};
const syncMenuState = (newCheckedNodes, reserveExpandingState = true) => {
const { checkStrictly } = config.value;
const oldNodes = checkedNodes.value;
const newNodes = newCheckedNodes.filter((node) => !!node && (checkStrictly || node.isLeaf));
const oldExpandingNode = store?.getSameNode(expandingNode.value);
const newExpandingNode = reserveExpandingState && oldExpandingNode || newNodes[0];
if (newExpandingNode) newExpandingNode.pathNodes.forEach((node) => expandNode(node, true));
else expandingNode.value = void 0;
oldNodes.forEach((node) => node.doCheck(false));
(0, vue.reactive)(newNodes).forEach((node) => node.doCheck(true));
checkedNodes.value = newNodes;
(0, vue.nextTick)(scrollToExpandingNode);
};
const scrollToExpandingNode = () => {
if (!isClient) return;
menuList.value.forEach((menu) => {
const menuElement = menu?.$el;
if (menuElement) {
const container = menuElement.querySelector(`.${ns.namespace.value}-scrollbar__wrap`);
let activeNode = menuElement.querySelector(`.${ns.b("node")}.in-active-path`);
if (!activeNode) {
const activeElements = menuElement.querySelectorAll(`.${ns.b("node")}.${ns.is("active")}`);
activeNode = activeElements[activeElements.length - 1];
}
scrollIntoView(container, activeNode);
}
});
};
const handleKeyDown = (e) => {
const target = e.target;
const code = getEventCode(e);
switch (code) {
case EVENT_CODE.up:
case EVENT_CODE.down:
e.preventDefault();
focusNode(getSibling(target, code === EVENT_CODE.up ? -1 : 1, `.${ns.b("node")}[tabindex="-1"]`));
break;
case EVENT_CODE.left: {
e.preventDefault();
const expandedNode = menuList.value[getMenuIndex(target) - 1]?.$el.querySelector(`.${ns.b("node")}[aria-expanded="true"]`);
focusNode(expandedNode);
break;
}
case EVENT_CODE.right: {
e.preventDefault();
const firstNode = menuList.value[getMenuIndex(target) + 1]?.$el.querySelector(`.${ns.b("node")}[tabindex="-1"]`);
focusNode(firstNode);
break;
}
case EVENT_CODE.enter:
case EVENT_CODE.numpadEnter:
checkNode(target);
break;
}
};
(0, vue.provide)(CASCADER_PANEL_INJECTION_KEY, (0, vue.reactive)({
config,
expandingNode,
checkedNodes,
isHoverMenu,
initialLoaded,
renderLabelFn,
lazyLoad,
expandNode,
handleCheckChange
}));
(0, vue.watch)(config, (newVal, oldVal) => {
if (isEqual$1(newVal, oldVal)) return;
initStore();
}, { immediate: true });
(0, vue.watch)(() => props.options, initStore, { deep: true });
(0, vue.watch)(() => props.modelValue, () => {
manualChecked = false;
syncCheckedValue();
}, { deep: true });
(0, vue.watch)(() => checkedValue.value, (val) => {
if (!isEqual$1(val, props.modelValue)) {
emit(UPDATE_MODEL_EVENT, val);
emit(CHANGE_EVENT, val);
}
});
const loadLazyRootNodes = () => {
if (initialLoadedOnce.value) return;
initStore();
};
(0, vue.onBeforeUpdate)(() => menuList.value = []);
(0, vue.onMounted)(() => !isEmpty(props.modelValue) && syncCheckedValue());
__expose({
menuList,
menus,
checkedNodes,
handleKeyDown,
handleCheckChange,
getFlattedNodes,
getCheckedNodes,
clearCheckedNodes,
calculateCheckedValue,
scrollToExpandingNode,
loadLazyRootNodes
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).b("panel"), (0, vue.unref)(ns).is("bordered", __props.border)]),
onKeydown: handleKeyDown
}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(menus.value, (menu, index) => {
return (0, vue.openBlock)(), (0, vue.createBlock)(menu_default$1, {
key: index,
ref_for: true,
ref: (item) => menuList.value[index] = item,
index,
nodes: [...menu]
}, {
empty: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "empty")]),
_: 3
}, 8, ["index", "nodes"]);
}), 128))], 34);
};
}
});
//#endregion
//#region ../../packages/components/cascader-panel/src/index.vue
var src_default$1 = index_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/cascader-panel/index.ts
const ElCascaderPanel = withInstall(src_default$1);
//#endregion
//#region ../../packages/components/cascader/src/cascader.ts
/**
* @deprecated Removed after 3.0.0, Use `CascaderComponentProps` instead.
*/
const cascaderProps = buildProps({
...CommonProps,
size: useSizeProp,
placeholder: String,
disabled: {
type: Boolean,
default: void 0
},
clearable: Boolean,
clearIcon: {
type: iconPropType,
default: circle_close_default
},
filterable: Boolean,
filterMethod: {
type: definePropType(Function),
default: (node, keyword) => node.text.includes(keyword)
},
separator: {
type: String,
default: " / "
},
showAllLevels: {
type: Boolean,
default: true
},
collapseTags: Boolean,
maxCollapseTags: {
type: Number,
default: 1
},
collapseTagsTooltip: Boolean,
maxCollapseTagsTooltipHeight: { type: [String, Number] },
debounce: {
type: Number,
default: 300
},
beforeFilter: {
type: definePropType(Function),
default: () => true
},
placement: {
type: definePropType(String),
values: Ee,
default: "bottom-start"
},
fallbackPlacements: {
type: definePropType(Array),
default: [
"bottom-start",
"bottom",
"top-start",
"top",
"right",
"left"
]
},
popperClass: useTooltipContentProps.popperClass,
popperStyle: useTooltipContentProps.popperStyle,
teleported: useTooltipContentProps.teleported,
effect: {
type: definePropType(String),
default: "light"
},
tagType: {
...tagProps.type,
default: "info"
},
tagEffect: {
...tagProps.effect,
default: "light"
},
validateEvent: {
type: Boolean,
default: true
},
persistent: {
type: Boolean,
default: true
},
showCheckedStrategy: {
type: String,
values: ["parent", "child"],
default: "child"
},
checkOnClickNode: Boolean,
showPrefix: {
type: Boolean,
default: true
},
...useEmptyValuesProps
});
const emitChangeFn$1 = (value) => true;
const cascaderEmits = {
[UPDATE_MODEL_EVENT]: emitChangeFn$1,
[CHANGE_EVENT]: emitChangeFn$1,
focus: (evt) => evt instanceof FocusEvent,
blur: (evt) => evt instanceof FocusEvent,
clear: () => true,
visibleChange: (val) => isBoolean(val),
expandChange: (val) => !!val,
removeTag: (val) => !!val
};
//#endregion
//#region ../../packages/components/cascader/src/cascader.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$57 = ["placeholder"];
const _hoisted_2$34 = ["onClick"];
var cascader_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElCascader",
__name: "cascader",
props: cascaderProps,
emits: cascaderEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const popperOptions = { modifiers: [{
name: "arrowPosition",
enabled: true,
phase: "main",
fn: ({ state }) => {
const { modifiersData, placement } = state;
if ([
"right",
"left",
"bottom",
"top"
].includes(placement)) return;
if (modifiersData.arrow) modifiersData.arrow.x = 35;
},
requires: ["arrow"]
}] };
const props = __props;
const emit = __emit;
const attrs = (0, vue.useAttrs)();
const slots = (0, vue.useSlots)();
let inputInitialHeight = 0;
let pressDeleteCount = 0;
const nsCascader = useNamespace("cascader");
const nsInput = useNamespace("input");
const sizeMapPadding = {
small: 7,
default: 11,
large: 15
};
const { t } = useLocale();
const { formItem } = useFormItem();
const isDisabled = useFormDisabled();
const { valueOnClear } = useEmptyValues(props);
const { isComposing, handleComposition } = useComposition({ afterComposition(event) {
const text = event.target?.value;
handleInput(text);
} });
const tooltipRef = (0, vue.ref)();
const tagTooltipRef = (0, vue.ref)();
const inputRef = (0, vue.ref)();
const tagWrapper = (0, vue.ref)();
const cascaderPanelRef = (0, vue.ref)();
const suggestionPanel = (0, vue.ref)();
const popperVisible = (0, vue.ref)(false);
const inputHover = (0, vue.ref)(false);
const filtering = (0, vue.ref)(false);
const inputValue = (0, vue.ref)("");
const searchInputValue = (0, vue.ref)("");
const tags = (0, vue.ref)([]);
const suggestions = (0, vue.ref)([]);
const showTagList = (0, vue.computed)(() => {
if (!props.props.multiple) return [];
return props.collapseTags ? tags.value.slice(0, props.maxCollapseTags) : tags.value;
});
const collapseTagList = (0, vue.computed)(() => {
if (!props.props.multiple) return [];
return props.collapseTags ? tags.value.slice(props.maxCollapseTags) : [];
});
const cascaderStyle = (0, vue.computed)(() => {
return attrs.style;
});
const inputPlaceholder = (0, vue.computed)(() => props.placeholder ?? t("el.cascader.placeholder"));
const currentPlaceholder = (0, vue.computed)(() => searchInputValue.value || tags.value.length > 0 || isComposing.value ? "" : inputPlaceholder.value);
const realSize = useFormSize();
const tagSize = (0, vue.computed)(() => realSize.value === "small" ? "small" : "default");
const multiple = (0, vue.computed)(() => !!props.props.multiple);
const readonly = (0, vue.computed)(() => !props.filterable || multiple.value);
const searchKeyword = (0, vue.computed)(() => multiple.value ? searchInputValue.value : inputValue.value);
const checkedNodes = (0, vue.computed)(() => cascaderPanelRef.value?.checkedNodes || []);
const { wrapperRef, isFocused, handleBlur } = useFocusController(inputRef, {
disabled: isDisabled,
beforeBlur(event) {
return tooltipRef.value?.isFocusInsideContent(event) || tagTooltipRef.value?.isFocusInsideContent(event);
},
afterBlur() {
if (props.validateEvent) formItem?.validate?.("blur").catch((err) => /* @__PURE__ */ debugWarn(err));
}
});
const clearBtnVisible = (0, vue.computed)(() => {
if (!props.clearable || isDisabled.value || filtering.value || !inputHover.value && !isFocused.value) return false;
return !!checkedNodes.value.length;
});
const presentText = (0, vue.computed)(() => {
const { showAllLevels, separator } = props;
const nodes = checkedNodes.value;
return nodes.length ? multiple.value ? "" : nodes[0].calcText(showAllLevels, separator) : "";
});
const validateState = (0, vue.computed)(() => formItem?.validateState || "");
const checkedValue = (0, vue.computed)({
get() {
return cloneDeep(props.modelValue);
},
set(val) {
const value = val ?? valueOnClear.value;
emit(UPDATE_MODEL_EVENT, value);
emit(CHANGE_EVENT, value);
if (props.validateEvent) formItem?.validate("change").catch((err) => /* @__PURE__ */ debugWarn(err));
}
});
const cascaderKls = (0, vue.computed)(() => {
return [
nsCascader.b(),
nsCascader.m(realSize.value),
nsCascader.is("disabled", isDisabled.value),
attrs.class
];
});
const cascaderIconKls = (0, vue.computed)(() => {
return [
nsInput.e("icon"),
"icon-arrow-down",
nsCascader.is("reverse", popperVisible.value)
];
});
const inputClass = (0, vue.computed)(() => nsCascader.is("focus", isFocused.value));
const contentRef = (0, vue.computed)(() => {
return tooltipRef.value?.popperRef?.contentRef;
});
const handleClickOutside = (event) => {
if (isFocused.value) handleBlur(new FocusEvent("blur", event));
togglePopperVisible(false);
};
const togglePopperVisible = (visible) => {
if (isDisabled.value) return;
visible = visible ?? !popperVisible.value;
if (visible !== popperVisible.value) {
popperVisible.value = visible;
inputRef.value?.input?.setAttribute("aria-expanded", `${visible}`);
if (visible) {
updatePopperPosition();
cascaderPanelRef.value && (0, vue.nextTick)(cascaderPanelRef.value.scrollToExpandingNode);
} else if (props.filterable) syncPresentTextValue();
emit("visibleChange", visible);
}
};
const updatePopperPosition = () => {
(0, vue.nextTick)(() => {
tooltipRef.value?.updatePopper();
});
};
const hideSuggestionPanel = () => {
filtering.value = false;
};
const genTag = (node) => {
const { showAllLevels, separator } = props;
return {
node,
key: node.uid,
text: node.calcText(showAllLevels, separator),
hitState: false,
closable: !isDisabled.value && !node.isDisabled
};
};
const deleteTag = (tag) => {
const node = tag.node;
node.doCheck(false);
cascaderPanelRef.value?.calculateCheckedValue();
emit("removeTag", node.valueByOption);
};
const getStrategyCheckedNodes = () => {
switch (props.showCheckedStrategy) {
case "child": return checkedNodes.value;
case "parent": {
const clickedNodes = getCheckedNodes(false);
const clickedNodesValue = clickedNodes.map((o) => o.value);
return clickedNodes.filter((o) => !o.parent || !clickedNodesValue.includes(o.parent.value));
}
default: return [];
}
};
const calculatePresentTags = () => {
if (!multiple.value) return;
const nodes = getStrategyCheckedNodes();
const allTags = [];
nodes.forEach((node) => allTags.push(genTag(node)));
tags.value = allTags;
};
const calculateSuggestions = () => {
const { filterMethod, showAllLevels, separator } = props;
const res = cascaderPanelRef.value?.getFlattedNodes(!props.props.checkStrictly)?.filter((node) => {
if (node.isDisabled) return false;
node.calcText(showAllLevels, separator);
return filterMethod(node, searchKeyword.value);
});
if (multiple.value) tags.value.forEach((tag) => {
tag.hitState = false;
});
filtering.value = true;
suggestions.value = res;
updatePopperPosition();
};
const focusFirstNode = () => {
let firstNode;
if (filtering.value && suggestionPanel.value) firstNode = suggestionPanel.value.$el.querySelector(`.${nsCascader.e("suggestion-item")}`);
else firstNode = cascaderPanelRef.value?.$el.querySelector(`.${nsCascader.b("node")}[tabindex="-1"]`);
if (firstNode) {
firstNode.focus();
if (!filtering.value && firstNode.getAttribute("aria-haspopup") === "true") firstNode.click();
}
};
const updateStyle = () => {
const inputInner = inputRef.value?.input;
const tagWrapperEl = tagWrapper.value;
const suggestionPanelEl = suggestionPanel.value?.$el;
if (!isClient || !inputInner) return;
if (suggestionPanelEl) {
const suggestionList = suggestionPanelEl.querySelector(`.${nsCascader.e("suggestion-list")}`);
suggestionList.style.minWidth = `${inputInner.offsetWidth}px`;
}
if (tagWrapperEl) {
const { offsetHeight } = tagWrapperEl;
const height = tags.value.length > 0 ? `${Math.max(offsetHeight, inputInitialHeight) - 2}px` : `${inputInitialHeight}px`;
inputInner.style.height = height;
if (slots.prefix) {
const prefix = inputRef.value?.$el.querySelector(`.${nsInput.e("prefix")}`);
let left = 0;
if (prefix) {
left = prefix.offsetWidth;
if (left > 0) left += sizeMapPadding[realSize.value || "default"];
}
tagWrapperEl.style.left = `${left}px`;
} else tagWrapperEl.style.left = `0`;
updatePopperPosition();
}
};
const getCheckedNodes = (leafOnly) => {
return cascaderPanelRef.value?.getCheckedNodes(leafOnly);
};
const handleExpandChange = (value) => {
updatePopperPosition();
emit("expandChange", value);
};
const handleKeyDown = (e) => {
if (isComposing.value) return;
switch (getEventCode(e)) {
case EVENT_CODE.enter:
case EVENT_CODE.numpadEnter:
togglePopperVisible();
break;
case EVENT_CODE.down:
togglePopperVisible(true);
(0, vue.nextTick)(focusFirstNode);
e.preventDefault();
break;
case EVENT_CODE.esc:
if (popperVisible.value === true) {
e.preventDefault();
e.stopPropagation();
togglePopperVisible(false);
}
break;
case EVENT_CODE.tab:
togglePopperVisible(false);
break;
}
};
const handleClear = () => {
cascaderPanelRef.value?.clearCheckedNodes();
if (!popperVisible.value && props.filterable) syncPresentTextValue();
togglePopperVisible(false);
emit("clear");
};
const syncPresentTextValue = () => {
const { value } = presentText;
inputValue.value = value;
searchInputValue.value = value;
};
const handleSuggestionClick = (node) => {
const { checked } = node;
if (multiple.value) cascaderPanelRef.value?.handleCheckChange(node, !checked, false);
else {
!checked && cascaderPanelRef.value?.handleCheckChange(node, true, false);
togglePopperVisible(false);
}
};
const handleSuggestionKeyDown = (e) => {
const target = e.target;
const code = getEventCode(e);
switch (code) {
case EVENT_CODE.up:
case EVENT_CODE.down:
e.preventDefault();
focusNode(getSibling(target, code === EVENT_CODE.up ? -1 : 1, `.${nsCascader.e("suggestion-item")}[tabindex="-1"]`));
break;
case EVENT_CODE.enter:
case EVENT_CODE.numpadEnter:
target.click();
break;
}
};
const handleDelete = () => {
const lastTag = tags.value[tags.value.length - 1];
pressDeleteCount = searchInputValue.value ? 0 : pressDeleteCount + 1;
if (!lastTag || !pressDeleteCount || props.collapseTags && tags.value.length > 1) return;
if (lastTag.hitState) deleteTag(lastTag);
else lastTag.hitState = true;
};
const handleFilter = useDebounceFn(() => {
const { value } = searchKeyword;
if (!value) return;
const passed = props.beforeFilter(value);
if (isPromise(passed)) passed.then(calculateSuggestions).catch(() => {});
else if (passed !== false) calculateSuggestions();
else hideSuggestionPanel();
}, (0, vue.computed)(() => props.debounce));
const handleInput = (val, e) => {
!popperVisible.value && togglePopperVisible(true);
if (e?.isComposing) return;
if (val) handleFilter();
else {
const passed = props.beforeFilter("");
if (isPromise(passed)) passed.catch(() => {});
hideSuggestionPanel();
}
};
const getInputInnerHeight = (inputInner) => Number.parseFloat(useCssVar(nsInput.cssVarName("input-height"), inputInner).value) - 2;
const focus = () => {
inputRef.value?.focus();
};
const blur = () => {
inputRef.value?.blur();
};
(0, vue.watch)(filtering, updatePopperPosition);
(0, vue.watch)([
checkedNodes,
isDisabled,
() => props.collapseTags,
() => props.maxCollapseTags
], calculatePresentTags);
(0, vue.watch)(tags, () => {
(0, vue.nextTick)(() => updateStyle());
});
(0, vue.watch)(realSize, async () => {
await (0, vue.nextTick)();
const inputInner = inputRef.value.input;
inputInitialHeight = getInputInnerHeight(inputInner) || inputInitialHeight;
updateStyle();
});
(0, vue.watch)(presentText, syncPresentTextValue, { immediate: true });
(0, vue.watch)(() => popperVisible.value, (val) => {
if (val && props.props.lazy && props.props.lazyLoad) cascaderPanelRef.value?.loadLazyRootNodes();
});
(0, vue.onMounted)(() => {
const inputInner = inputRef.value.input;
const inputInnerHeight = getInputInnerHeight(inputInner);
inputInitialHeight = inputInner.offsetHeight || inputInnerHeight;
useResizeObserver(inputInner, updateStyle);
});
__expose({
getCheckedNodes,
cascaderPanelRef,
togglePopperVisible,
contentRef,
presentText,
focus,
blur
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElTooltip), {
ref_key: "tooltipRef",
ref: tooltipRef,
visible: popperVisible.value,
teleported: __props.teleported,
"popper-class": [(0, vue.unref)(nsCascader).e("dropdown"), __props.popperClass],
"popper-style": __props.popperStyle,
"popper-options": popperOptions,
"fallback-placements": __props.fallbackPlacements,
"stop-popper-mouse-event": false,
"gpu-acceleration": false,
placement: __props.placement,
transition: `${(0, vue.unref)(nsCascader).namespace.value}-zoom-in-top`,
effect: __props.effect,
pure: "",
persistent: __props.persistent,
onHide: hideSuggestionPanel
}, {
default: (0, vue.withCtx)(() => [(0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref_key: "wrapperRef",
ref: wrapperRef,
class: (0, vue.normalizeClass)(cascaderKls.value),
style: (0, vue.normalizeStyle)(cascaderStyle.value),
onClick: _cache[8] || (_cache[8] = () => togglePopperVisible(readonly.value ? void 0 : true)),
onKeydown: handleKeyDown,
onMouseenter: _cache[9] || (_cache[9] = ($event) => inputHover.value = true),
onMouseleave: _cache[10] || (_cache[10] = ($event) => inputHover.value = false)
}, [(0, vue.createVNode)((0, vue.unref)(ElInput), {
ref_key: "inputRef",
ref: inputRef,
modelValue: inputValue.value,
"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => inputValue.value = $event),
placeholder: currentPlaceholder.value,
readonly: readonly.value,
disabled: (0, vue.unref)(isDisabled),
"validate-event": false,
size: (0, vue.unref)(realSize),
class: (0, vue.normalizeClass)(inputClass.value),
tabindex: multiple.value && __props.filterable && !(0, vue.unref)(isDisabled) ? -1 : void 0,
onCompositionstart: (0, vue.unref)(handleComposition),
onCompositionupdate: (0, vue.unref)(handleComposition),
onCompositionend: (0, vue.unref)(handleComposition),
onInput: handleInput
}, (0, vue.createSlots)({
suffix: (0, vue.withCtx)(() => [clearBtnVisible.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: "clear",
class: (0, vue.normalizeClass)([(0, vue.unref)(nsInput).e("icon"), "icon-circle-close"]),
onClick: (0, vue.withModifiers)(handleClear, ["stop"])
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.clearIcon)))]),
_: 1
}, 8, ["class"])) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: "arrow-down",
class: (0, vue.normalizeClass)(cascaderIconKls.value),
onClick: _cache[0] || (_cache[0] = (0, vue.withModifiers)(($event) => togglePopperVisible(), ["stop"]))
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(arrow_down_default))]),
_: 1
}, 8, ["class"]))]),
_: 2
}, [_ctx.$slots.prefix ? {
name: "prefix",
fn: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "prefix")]),
key: "0"
} : void 0]), 1032, [
"modelValue",
"placeholder",
"readonly",
"disabled",
"size",
"class",
"tabindex",
"onCompositionstart",
"onCompositionupdate",
"onCompositionend"
]), multiple.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
ref_key: "tagWrapper",
ref: tagWrapper,
class: (0, vue.normalizeClass)([(0, vue.unref)(nsCascader).e("tags"), (0, vue.unref)(nsCascader).is("validate", Boolean(validateState.value))])
}, [
(0, vue.renderSlot)(_ctx.$slots, "tag", {
data: tags.value,
deleteTag
}, () => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(showTagList.value, (tag) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElTag), {
key: tag.key,
type: __props.tagType,
size: tagSize.value,
effect: __props.tagEffect,
hit: tag.hitState,
closable: tag.closable,
"disable-transitions": "",
onClose: ($event) => deleteTag(tag)
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(tag.text), 1)]),
_: 2
}, 1032, [
"type",
"size",
"effect",
"hit",
"closable",
"onClose"
]);
}), 128))]),
__props.collapseTags && tags.value.length > __props.maxCollapseTags ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElTooltip), {
key: 0,
ref_key: "tagTooltipRef",
ref: tagTooltipRef,
disabled: popperVisible.value || !__props.collapseTagsTooltip,
"fallback-placements": [
"bottom",
"top",
"right",
"left"
],
placement: "bottom",
"popper-class": __props.popperClass,
"popper-style": __props.popperStyle,
effect: __props.effect,
persistent: __props.persistent
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(ElTag), {
closable: false,
size: tagSize.value,
type: __props.tagType,
effect: __props.tagEffect,
"disable-transitions": ""
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(nsCascader).e("tags-text")) }, " + " + (0, vue.toDisplayString)(tags.value.length - __props.maxCollapseTags), 3)]),
_: 1
}, 8, [
"size",
"type",
"effect"
])]),
content: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(ElScrollbar), { "max-height": __props.maxCollapseTagsTooltipHeight }, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(nsCascader).e("collapse-tags")) }, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(collapseTagList.value, (tag, idx) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: idx,
class: (0, vue.normalizeClass)((0, vue.unref)(nsCascader).e("collapse-tag"))
}, [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElTag), {
key: tag.key,
class: "in-tooltip",
type: __props.tagType,
size: tagSize.value,
effect: __props.tagEffect,
hit: tag.hitState,
closable: tag.closable,
"disable-transitions": "",
onClose: ($event) => deleteTag(tag)
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(tag.text), 1)]),
_: 2
}, 1032, [
"type",
"size",
"effect",
"hit",
"closable",
"onClose"
]))], 2);
}), 128))], 2)]),
_: 1
}, 8, ["max-height"])]),
_: 1
}, 8, [
"disabled",
"popper-class",
"popper-style",
"effect",
"persistent"
])) : (0, vue.createCommentVNode)("v-if", true),
__props.filterable && !(0, vue.unref)(isDisabled) ? (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("input", {
key: 1,
"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => searchInputValue.value = $event),
type: "text",
class: (0, vue.normalizeClass)((0, vue.unref)(nsCascader).e("search-input")),
placeholder: presentText.value ? "" : inputPlaceholder.value,
onInput: _cache[3] || (_cache[3] = (e) => handleInput(searchInputValue.value, e)),
onClick: _cache[4] || (_cache[4] = (0, vue.withModifiers)(($event) => togglePopperVisible(true), ["stop"])),
onKeydown: (0, vue.withKeys)(handleDelete, ["delete"]),
onCompositionstart: _cache[5] || (_cache[5] = (...args) => (0, vue.unref)(handleComposition) && (0, vue.unref)(handleComposition)(...args)),
onCompositionupdate: _cache[6] || (_cache[6] = (...args) => (0, vue.unref)(handleComposition) && (0, vue.unref)(handleComposition)(...args)),
onCompositionend: _cache[7] || (_cache[7] = (...args) => (0, vue.unref)(handleComposition) && (0, vue.unref)(handleComposition)(...args))
}, null, 42, _hoisted_1$57)), [[vue.vModelText, searchInputValue.value]]) : (0, vue.createCommentVNode)("v-if", true)
], 2)) : (0, vue.createCommentVNode)("v-if", true)], 38)), [[
(0, vue.unref)(ClickOutside),
handleClickOutside,
contentRef.value
]])]),
content: (0, vue.withCtx)(() => [
_ctx.$slots.header ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(nsCascader).e("header")),
onClick: _cache[11] || (_cache[11] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, [(0, vue.renderSlot)(_ctx.$slots, "header")], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.withDirectives)((0, vue.createVNode)((0, vue.unref)(ElCascaderPanel), {
ref_key: "cascaderPanelRef",
ref: cascaderPanelRef,
modelValue: checkedValue.value,
"onUpdate:modelValue": _cache[12] || (_cache[12] = ($event) => checkedValue.value = $event),
options: __props.options,
props: props.props,
border: false,
"render-label": _ctx.$slots.default,
onExpandChange: handleExpandChange,
onClose: _cache[13] || (_cache[13] = ($event) => _ctx.$nextTick(() => togglePopperVisible(false)))
}, {
empty: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "empty")]),
_: 3
}, 8, [
"modelValue",
"options",
"props",
"render-label"
]), [[vue.vShow, !filtering.value]]),
__props.filterable ? (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElScrollbar), {
key: 1,
ref_key: "suggestionPanel",
ref: suggestionPanel,
tag: "ul",
class: (0, vue.normalizeClass)((0, vue.unref)(nsCascader).e("suggestion-panel")),
"view-class": (0, vue.unref)(nsCascader).e("suggestion-list"),
onKeydown: handleSuggestionKeyDown
}, {
default: (0, vue.withCtx)(() => [suggestions.value.length ? ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, (0, vue.renderList)(suggestions.value, (item) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
key: item.uid,
class: (0, vue.normalizeClass)([(0, vue.unref)(nsCascader).e("suggestion-item"), (0, vue.unref)(nsCascader).is("checked", item.checked)]),
tabindex: -1,
onClick: ($event) => handleSuggestionClick(item)
}, [(0, vue.renderSlot)(_ctx.$slots, "suggestion-item", { item }, () => [(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(item.text), 1), item.checked ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), { key: 0 }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(check_default))]),
_: 1
})) : (0, vue.createCommentVNode)("v-if", true)])], 10, _hoisted_2$34);
}), 128)) : (0, vue.renderSlot)(_ctx.$slots, "empty", { key: 1 }, () => [(0, vue.createElementVNode)("li", { class: (0, vue.normalizeClass)((0, vue.unref)(nsCascader).e("empty-text")) }, (0, vue.toDisplayString)((0, vue.unref)(t)("el.cascader.noMatch")), 3)])]),
_: 3
}, 8, ["class", "view-class"])), [[vue.vShow, filtering.value]]) : (0, vue.createCommentVNode)("v-if", true),
_ctx.$slots.footer ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 2,
class: (0, vue.normalizeClass)((0, vue.unref)(nsCascader).e("footer")),
onClick: _cache[14] || (_cache[14] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, [(0, vue.renderSlot)(_ctx.$slots, "footer")], 2)) : (0, vue.createCommentVNode)("v-if", true)
]),
_: 3
}, 8, [
"visible",
"teleported",
"popper-class",
"popper-style",
"fallback-placements",
"placement",
"transition",
"effect",
"persistent"
]);
};
}
});
//#endregion
//#region ../../packages/components/cascader/src/cascader.vue
var cascader_default = cascader_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/cascader/index.ts
const ElCascader = withInstall(cascader_default);
//#endregion
//#region ../../packages/components/check-tag/src/check-tag.ts
/**
* @deprecated Removed after 3.0.0, Use `CheckTagProps` instead.
*/
const checkTagProps = buildProps({
checked: Boolean,
disabled: Boolean,
type: {
type: String,
values: [
"primary",
"success",
"info",
"warning",
"danger"
],
default: "primary"
}
});
const checkTagEmits = {
"update:checked": (value) => isBoolean(value),
[CHANGE_EVENT]: (value) => isBoolean(value)
};
//#endregion
//#region ../../packages/components/check-tag/src/check-tag.vue?vue&type=script&setup=true&lang.ts
var check_tag_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElCheckTag",
__name: "check-tag",
props: checkTagProps,
emits: checkTagEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const ns = useNamespace("check-tag");
const containerKls = (0, vue.computed)(() => [
ns.b(),
ns.is("checked", props.checked),
ns.is("disabled", props.disabled),
ns.m(props.type || "primary")
]);
const handleChange = () => {
if (props.disabled) return;
const checked = !props.checked;
emit(CHANGE_EVENT, checked);
emit("update:checked", checked);
};
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
class: (0, vue.normalizeClass)(containerKls.value),
onClick: handleChange
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2);
};
}
});
//#endregion
//#region ../../packages/components/check-tag/src/check-tag.vue
var check_tag_default = check_tag_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/check-tag/index.ts
const ElCheckTag = withInstall(check_tag_default);
//#endregion
//#region ../../packages/components/col/src/col.ts
/**
* @deprecated Removed after 3.0.0, Use `ColProps` instead.
*/
const colProps = buildProps({
tag: {
type: String,
default: "div"
},
span: {
type: Number,
default: 24
},
offset: {
type: Number,
default: 0
},
pull: {
type: Number,
default: 0
},
push: {
type: Number,
default: 0
},
xs: {
type: definePropType([Number, Object]),
default: () => mutable({})
},
sm: {
type: definePropType([Number, Object]),
default: () => mutable({})
},
md: {
type: definePropType([Number, Object]),
default: () => mutable({})
},
lg: {
type: definePropType([Number, Object]),
default: () => mutable({})
},
xl: {
type: definePropType([Number, Object]),
default: () => mutable({})
}
});
//#endregion
//#region ../../packages/components/row/src/row.ts
const RowJustify = [
"start",
"center",
"end",
"space-around",
"space-between",
"space-evenly"
];
const RowAlign = [
"top",
"middle",
"bottom"
];
/**
* @deprecated Removed after 3.0.0, Use `RowProps` instead.
*/
const rowProps = buildProps({
tag: {
type: String,
default: "div"
},
gutter: {
type: Number,
default: 0
},
justify: {
type: String,
values: RowJustify,
default: "start"
},
align: {
type: String,
values: RowAlign
}
});
//#endregion
//#region ../../packages/components/row/src/constants.ts
const rowContextKey = Symbol("rowContextKey");
//#endregion
//#region ../../packages/components/row/src/row.vue?vue&type=script&setup=true&lang.ts
var row_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElRow",
__name: "row",
props: rowProps,
setup(__props) {
const props = __props;
const ns = useNamespace("row");
(0, vue.provide)(rowContextKey, { gutter: (0, vue.computed)(() => props.gutter) });
const style = (0, vue.computed)(() => {
const styles = {};
if (!props.gutter) return styles;
styles.marginRight = styles.marginLeft = `-${props.gutter / 2}px`;
return styles;
});
const rowKls = (0, vue.computed)(() => [
ns.b(),
ns.is(`justify-${props.justify}`, props.justify !== "start"),
ns.is(`align-${props.align}`, !!props.align)
]);
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.tag), {
class: (0, vue.normalizeClass)(rowKls.value),
style: (0, vue.normalizeStyle)(style.value)
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 8, ["class", "style"]);
};
}
});
//#endregion
//#region ../../packages/components/row/src/row.vue
var row_default = row_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/row/index.ts
const ElRow = withInstall(row_default);
//#endregion
//#region ../../packages/components/col/src/col.vue?vue&type=script&setup=true&lang.ts
var col_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElCol",
__name: "col",
props: colProps,
setup(__props) {
const props = __props;
const { gutter } = (0, vue.inject)(rowContextKey, { gutter: (0, vue.computed)(() => 0) });
const ns = useNamespace("col");
const style = (0, vue.computed)(() => {
const styles = {};
if (gutter.value) styles.paddingLeft = styles.paddingRight = `${gutter.value / 2}px`;
return styles;
});
const colKls = (0, vue.computed)(() => {
const classes = [];
[
"span",
"offset",
"pull",
"push"
].forEach((prop) => {
const size = props[prop];
if (isNumber(size)) {
if (prop === "span") classes.push(ns.b(`${props[prop]}`));
else if (size > 0) classes.push(ns.b(`${prop}-${props[prop]}`));
}
});
[
"xs",
"sm",
"md",
"lg",
"xl"
].forEach((size) => {
if (isNumber(props[size])) classes.push(ns.b(`${size}-${props[size]}`));
else if (isObject$1(props[size])) Object.entries(props[size]).forEach(([prop, sizeProp]) => {
classes.push(prop !== "span" ? ns.b(`${size}-${prop}-${sizeProp}`) : ns.b(`${size}-${sizeProp}`));
});
});
if (gutter.value) classes.push(ns.is("guttered"));
return [ns.b(), classes];
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.tag), {
class: (0, vue.normalizeClass)(colKls.value),
style: (0, vue.normalizeStyle)(style.value)
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 8, ["class", "style"]);
};
}
});
//#endregion
//#region ../../packages/components/col/src/col.vue
var col_default = col_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/col/index.ts
const ElCol = withInstall(col_default);
//#endregion
//#region ../../packages/components/collapse/src/collapse.ts
const emitChangeFn = (value) => isNumber(value) || isString(value) || isArray$1(value);
/**
* @deprecated Removed after 3.0.0, Use `CollapseProps` instead.
*/
const collapseProps = buildProps({
accordion: Boolean,
modelValue: {
type: definePropType([
Array,
String,
Number
]),
default: () => mutable([])
},
expandIconPosition: {
type: definePropType([String]),
default: "right"
},
beforeCollapse: { type: definePropType(Function) }
});
const collapseEmits = {
[UPDATE_MODEL_EVENT]: emitChangeFn,
[CHANGE_EVENT]: emitChangeFn
};
//#endregion
//#region ../../packages/components/collapse/src/constants.ts
const collapseContextKey = Symbol("collapseContextKey");
//#endregion
//#region ../../packages/components/collapse/src/use-collapse.ts
const SCOPE$4 = "ElCollapse";
const useCollapse = (props, emit) => {
const activeNames = (0, vue.ref)(castArray$1(props.modelValue));
const setActiveNames = (_activeNames) => {
activeNames.value = _activeNames;
const value = props.accordion ? activeNames.value[0] : activeNames.value;
emit(UPDATE_MODEL_EVENT, value);
emit(CHANGE_EVENT, value);
};
const handleChange = (name) => {
if (props.accordion) setActiveNames([activeNames.value[0] === name ? "" : name]);
else {
const _activeNames = [...activeNames.value];
const index = _activeNames.indexOf(name);
if (index > -1) _activeNames.splice(index, 1);
else _activeNames.push(name);
setActiveNames(_activeNames);
}
};
const handleItemClick = async (name) => {
const { beforeCollapse } = props;
if (!beforeCollapse) {
handleChange(name);
return;
}
const shouldChange = beforeCollapse(name);
if (![isPromise(shouldChange), isBoolean(shouldChange)].includes(true)) throwError(SCOPE$4, "beforeCollapse must return type `Promise<boolean>` or `boolean`");
if (isPromise(shouldChange)) shouldChange.then((result) => {
if (result !== false) handleChange(name);
}).catch((e) => {
/* @__PURE__ */ debugWarn(SCOPE$4, `some error occurred: ${e}`);
});
else if (shouldChange) handleChange(name);
};
(0, vue.watch)(() => props.modelValue, () => activeNames.value = castArray$1(props.modelValue), { deep: true });
(0, vue.provide)(collapseContextKey, {
activeNames,
handleItemClick
});
return {
activeNames,
setActiveNames
};
};
const useCollapseDOM = (props) => {
const ns = useNamespace("collapse");
return { rootKls: (0, vue.computed)(() => [ns.b(), ns.b(`icon-position-${props.expandIconPosition}`)]) };
};
//#endregion
//#region ../../packages/components/collapse/src/collapse.vue?vue&type=script&setup=true&lang.ts
var collapse_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElCollapse",
__name: "collapse",
props: collapseProps,
emits: collapseEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const { activeNames, setActiveNames } = useCollapse(props, __emit);
const { rootKls } = useCollapseDOM(props);
__expose({
activeNames,
setActiveNames
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(rootKls)) }, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2);
};
}
});
//#endregion
//#region ../../packages/components/collapse/src/collapse.vue
var collapse_default = collapse_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/collapse/src/collapse-item.ts
/**
* @deprecated Removed after 3.0.0, Use `CollapseItemProps` instead.
*/
const collapseItemProps = buildProps({
title: {
type: String,
default: ""
},
name: {
type: definePropType([String, Number]),
default: void 0
},
icon: {
type: iconPropType,
default: arrow_right_default
},
disabled: Boolean
});
//#endregion
//#region ../../packages/components/collapse-transition/src/collapse-transition.vue?vue&type=script&setup=true&lang.ts
var collapse_transition_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElCollapseTransition",
__name: "collapse-transition",
setup(__props) {
const ns = useNamespace("collapse-transition");
const reset = (el) => {
el.style.maxHeight = "";
el.style.overflow = el.dataset.oldOverflow;
el.style.paddingTop = el.dataset.oldPaddingTop;
el.style.paddingBottom = el.dataset.oldPaddingBottom;
};
const on = {
beforeEnter(el) {
if (!el.dataset) el.dataset = {};
el.dataset.oldPaddingTop = el.style.paddingTop;
el.dataset.oldPaddingBottom = el.style.paddingBottom;
if (el.style.height) el.dataset.elExistsHeight = el.style.height;
el.style.maxHeight = 0;
el.style.paddingTop = 0;
el.style.paddingBottom = 0;
},
enter(el) {
requestAnimationFrame(() => {
el.dataset.oldOverflow = el.style.overflow;
if (el.dataset.elExistsHeight) el.style.maxHeight = el.dataset.elExistsHeight;
else if (el.scrollHeight !== 0) el.style.maxHeight = `${el.scrollHeight}px`;
else el.style.maxHeight = 0;
el.style.paddingTop = el.dataset.oldPaddingTop;
el.style.paddingBottom = el.dataset.oldPaddingBottom;
el.style.overflow = "hidden";
});
},
afterEnter(el) {
el.style.maxHeight = "";
el.style.overflow = el.dataset.oldOverflow;
},
enterCancelled(el) {
reset(el);
},
beforeLeave(el) {
if (!el.dataset) el.dataset = {};
el.dataset.oldPaddingTop = el.style.paddingTop;
el.dataset.oldPaddingBottom = el.style.paddingBottom;
el.dataset.oldOverflow = el.style.overflow;
el.style.maxHeight = `${el.scrollHeight}px`;
el.style.overflow = "hidden";
},
leave(el) {
if (el.scrollHeight !== 0) {
el.style.maxHeight = 0;
el.style.paddingTop = 0;
el.style.paddingBottom = 0;
}
},
afterLeave(el) {
reset(el);
},
leaveCancelled(el) {
reset(el);
}
};
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)(vue.Transition, (0, vue.mergeProps)({ name: (0, vue.unref)(ns).b() }, (0, vue.toHandlers)(on)), {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 16, ["name"]);
};
}
});
//#endregion
//#region ../../packages/components/collapse-transition/src/collapse-transition.vue
var collapse_transition_default = collapse_transition_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/collapse-transition/index.ts
const ElCollapseTransition = withInstall(collapse_transition_default);
//#endregion
//#region ../../packages/components/collapse/src/use-collapse-item.ts
const useCollapseItem = (props) => {
const collapse = (0, vue.inject)(collapseContextKey);
const { namespace } = useNamespace("collapse");
const focusing = (0, vue.ref)(false);
const isClick = (0, vue.ref)(false);
const idInjection = useIdInjection();
const id = (0, vue.computed)(() => idInjection.current++);
const name = (0, vue.computed)(() => {
return props.name ?? `${namespace.value}-id-${idInjection.prefix}-${(0, vue.unref)(id)}`;
});
const isActive = (0, vue.computed)(() => collapse?.activeNames.value.includes((0, vue.unref)(name)));
const handleFocus = () => {
setTimeout(() => {
if (!isClick.value) focusing.value = true;
else isClick.value = false;
}, 50);
};
const handleHeaderClick = (e) => {
if (props.disabled) return;
if (e.target?.closest("input, textarea, select")) return;
collapse?.handleItemClick((0, vue.unref)(name));
focusing.value = false;
isClick.value = true;
};
const handleEnterClick = (e) => {
if (e.target?.closest("input, textarea, select")) return;
e.preventDefault();
collapse?.handleItemClick((0, vue.unref)(name));
};
return {
focusing,
id,
isActive,
handleFocus,
handleHeaderClick,
handleEnterClick
};
};
const useCollapseItemDOM = (props, { focusing, isActive, id }) => {
const ns = useNamespace("collapse");
const rootKls = (0, vue.computed)(() => [
ns.b("item"),
ns.is("active", (0, vue.unref)(isActive)),
ns.is("disabled", props.disabled)
]);
const headKls = (0, vue.computed)(() => [
ns.be("item", "header"),
ns.is("active", (0, vue.unref)(isActive)),
{ focusing: (0, vue.unref)(focusing) && !props.disabled }
]);
const arrowKls = (0, vue.computed)(() => [ns.be("item", "arrow"), ns.is("active", (0, vue.unref)(isActive))]);
return {
itemTitleKls: (0, vue.computed)(() => [ns.be("item", "title")]),
arrowKls,
headKls,
rootKls,
itemWrapperKls: (0, vue.computed)(() => ns.be("item", "wrap")),
itemContentKls: (0, vue.computed)(() => ns.be("item", "content")),
scopedContentId: (0, vue.computed)(() => ns.b(`content-${(0, vue.unref)(id)}`)),
scopedHeadId: (0, vue.computed)(() => ns.b(`head-${(0, vue.unref)(id)}`))
};
};
//#endregion
//#region ../../packages/components/collapse/src/collapse-item.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$56 = [
"id",
"aria-expanded",
"aria-controls",
"aria-describedby",
"tabindex",
"aria-disabled"
];
const _hoisted_2$33 = [
"id",
"aria-hidden",
"aria-labelledby"
];
var collapse_item_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElCollapseItem",
__name: "collapse-item",
props: collapseItemProps,
setup(__props, { expose: __expose }) {
const props = __props;
const { focusing, id, isActive, handleFocus, handleHeaderClick, handleEnterClick } = useCollapseItem(props);
const { arrowKls, headKls, rootKls, itemTitleKls, itemWrapperKls, itemContentKls, scopedContentId, scopedHeadId } = useCollapseItemDOM(props, {
focusing,
isActive,
id
});
__expose({ isActive });
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(rootKls)) }, [(0, vue.createElementVNode)("div", {
id: (0, vue.unref)(scopedHeadId),
class: (0, vue.normalizeClass)((0, vue.unref)(headKls)),
"aria-expanded": (0, vue.unref)(isActive),
"aria-controls": (0, vue.unref)(scopedContentId),
"aria-describedby": (0, vue.unref)(scopedContentId),
tabindex: __props.disabled ? void 0 : 0,
"aria-disabled": __props.disabled,
role: "button",
onClick: _cache[0] || (_cache[0] = (...args) => (0, vue.unref)(handleHeaderClick) && (0, vue.unref)(handleHeaderClick)(...args)),
onKeydown: _cache[1] || (_cache[1] = (0, vue.withKeys)((0, vue.withModifiers)((...args) => (0, vue.unref)(handleEnterClick) && (0, vue.unref)(handleEnterClick)(...args), ["stop"]), ["space", "enter"])),
onFocus: _cache[2] || (_cache[2] = (...args) => (0, vue.unref)(handleFocus) && (0, vue.unref)(handleFocus)(...args)),
onBlur: _cache[3] || (_cache[3] = ($event) => focusing.value = false)
}, [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(itemTitleKls)) }, [(0, vue.renderSlot)(_ctx.$slots, "title", { isActive: (0, vue.unref)(isActive) }, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.title), 1)])], 2), (0, vue.renderSlot)(_ctx.$slots, "icon", { isActive: (0, vue.unref)(isActive) }, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), { class: (0, vue.normalizeClass)((0, vue.unref)(arrowKls)) }, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.icon)))]),
_: 1
}, 8, ["class"])])], 42, _hoisted_1$56), (0, vue.createVNode)((0, vue.unref)(ElCollapseTransition), null, {
default: (0, vue.withCtx)(() => [(0, vue.withDirectives)((0, vue.createElementVNode)("div", {
id: (0, vue.unref)(scopedContentId),
role: "region",
class: (0, vue.normalizeClass)((0, vue.unref)(itemWrapperKls)),
"aria-hidden": !(0, vue.unref)(isActive),
"aria-labelledby": (0, vue.unref)(scopedHeadId)
}, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(itemContentKls)) }, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2)], 10, _hoisted_2$33), [[vue.vShow, (0, vue.unref)(isActive)]])]),
_: 3
})], 2);
};
}
});
//#endregion
//#region ../../packages/components/collapse/src/collapse-item.vue
var collapse_item_default = collapse_item_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/collapse/index.ts
const ElCollapse = withInstall(collapse_default, { CollapseItem: collapse_item_default });
const ElCollapseItem = withNoopInstall(collapse_item_default);
//#endregion
//#region ../../packages/components/color-picker-panel/src/color-picker-panel.ts
/**
* @deprecated Removed after 3.0.0, Use `ColorPickerPanelProps` instead.
*/
const colorPickerPanelProps = buildProps({
modelValue: {
type: definePropType(String),
default: void 0
},
border: {
type: Boolean,
default: true
},
showAlpha: Boolean,
colorFormat: { type: definePropType(String) },
disabled: Boolean,
predefine: { type: definePropType(Array) },
validateEvent: {
type: Boolean,
default: true
},
hueSliderClass: { type: definePropType([
String,
Array,
Object
]) },
hueSliderStyle: { type: definePropType([
String,
Array,
Object
]) }
});
const colorPickerPanelEmits = { [UPDATE_MODEL_EVENT]: (val) => isString(val) || isNil(val) };
const ROOT_COMMON_COLOR_INJECTION_KEY = Symbol("colorCommonPickerKey");
const colorPickerPanelContextKey = Symbol("colorPickerPanelContextKey");
//#endregion
//#region ../../packages/components/color-picker-panel/src/props/slider.ts
/**
* @deprecated Removed after 3.0.0, Use `AlphaSliderProps` instead.
*/
const alphaSliderProps = buildProps({
color: {
type: definePropType(Object),
required: true
},
vertical: Boolean,
disabled: Boolean
});
/**
* @deprecated Removed after 3.0.0, Use `HueSliderProps` instead.
*/
const hueSliderProps = alphaSliderProps;
//#endregion
//#region ../../packages/components/color-picker-panel/src/utils/draggable.ts
let isDragging = false;
function draggable(element, options) {
if (!isClient) return;
const moveFn = function(event) {
options.drag?.(event);
};
const upFn = function(event) {
document.removeEventListener("mousemove", moveFn);
document.removeEventListener("mouseup", upFn);
document.removeEventListener("touchmove", moveFn);
document.removeEventListener("touchend", upFn);
document.onselectstart = null;
document.ondragstart = null;
isDragging = false;
options.end?.(event);
};
const downFn = function(event) {
if (isDragging) return;
document.onselectstart = () => false;
document.ondragstart = () => false;
document.addEventListener("mousemove", moveFn);
document.addEventListener("mouseup", upFn);
document.addEventListener("touchmove", moveFn);
document.addEventListener("touchend", upFn);
isDragging = true;
options.start?.(event);
};
element.addEventListener("mousedown", downFn);
element.addEventListener("touchstart", downFn, { passive: false });
}
//#endregion
//#region ../../packages/components/color-picker-panel/src/composables/use-slider.ts
const useSlider = (props, { key, minValue, maxValue }) => {
const instance = (0, vue.getCurrentInstance)();
const thumb = (0, vue.shallowRef)();
const bar = (0, vue.shallowRef)();
const currentValue = (0, vue.computed)(() => props.color.get(key));
function handleClick(event) {
if (props.disabled) return;
if (event.target !== thumb.value) handleDrag(event);
thumb.value?.focus();
}
function handleDrag(event) {
if (!bar.value || !thumb.value || props.disabled) return;
const rect = instance.vnode.el.getBoundingClientRect();
const { clientX, clientY } = getClientXY(event);
let value;
if (!props.vertical) {
let left = clientX - rect.left;
left = Math.max(thumb.value.offsetWidth / 2, left);
left = Math.min(left, rect.width - thumb.value.offsetWidth / 2);
value = Math.round((left - thumb.value.offsetWidth / 2) / (rect.width - thumb.value.offsetWidth) * maxValue);
} else {
let top = clientY - rect.top;
top = Math.max(thumb.value.offsetHeight / 2, top);
top = Math.min(top, rect.height - thumb.value.offsetHeight / 2);
value = Math.round((top - thumb.value.offsetHeight / 2) / (rect.height - thumb.value.offsetHeight) * maxValue);
}
props.color.set(key, value);
}
function handleKeydown(event) {
if (props.disabled) return;
const { shiftKey } = event;
const code = getEventCode(event);
const step = shiftKey ? 10 : 1;
const reverse = key === "hue" ? -1 : 1;
let isPreventDefault = true;
switch (code) {
case EVENT_CODE.left:
case EVENT_CODE.down:
incrementPosition(-step * reverse);
break;
case EVENT_CODE.right:
case EVENT_CODE.up:
incrementPosition(step * reverse);
break;
case EVENT_CODE.home:
props.color.set(key, key === "hue" ? maxValue : minValue);
break;
case EVENT_CODE.end:
props.color.set(key, key === "hue" ? minValue : maxValue);
break;
case EVENT_CODE.pageDown:
incrementPosition(-4 * reverse);
break;
case EVENT_CODE.pageUp:
incrementPosition(4 * reverse);
break;
default:
isPreventDefault = false;
break;
}
isPreventDefault && event.preventDefault();
}
function incrementPosition(step) {
let next = currentValue.value + step;
next = next < minValue ? minValue : next > maxValue ? maxValue : next;
props.color.set(key, next);
}
return {
thumb,
bar,
currentValue,
handleDrag,
handleClick,
handleKeydown
};
};
const useSliderDOM = (props, { namespace, maxValue, bar, thumb, currentValue, handleDrag, getBackground }) => {
const instance = (0, vue.getCurrentInstance)();
const ns = useNamespace(namespace);
const thumbLeft = (0, vue.ref)(0);
const thumbTop = (0, vue.ref)(0);
const background = (0, vue.ref)();
function getThumbLeft() {
if (!thumb.value) return 0;
if (props.vertical) return 0;
const el = instance.vnode.el;
const value = currentValue.value;
if (!el) return 0;
return Math.round(value * (el.offsetWidth - thumb.value.offsetWidth / 2) / maxValue);
}
function getThumbTop() {
if (!thumb.value) return 0;
const el = instance.vnode.el;
if (!props.vertical) return 0;
const value = currentValue.value;
if (!el) return 0;
return Math.round(value * (el.offsetHeight - thumb.value.offsetHeight / 2) / maxValue);
}
function update() {
thumbLeft.value = getThumbLeft();
thumbTop.value = getThumbTop();
background.value = getBackground?.();
}
(0, vue.onMounted)(() => {
if (!bar.value || !thumb.value) return;
const dragConfig = {
drag: (event) => {
handleDrag(event);
},
end: (event) => {
handleDrag(event);
}
};
draggable(bar.value, dragConfig);
draggable(thumb.value, dragConfig);
update();
});
(0, vue.watch)(currentValue, () => update());
(0, vue.watch)(() => props.color.value, () => update());
const rootKls = (0, vue.computed)(() => [
ns.b(),
ns.is("vertical", props.vertical),
ns.is("disabled", props.disabled)
]);
const barKls = (0, vue.computed)(() => ns.e("bar"));
const thumbKls = (0, vue.computed)(() => ns.e("thumb"));
return {
rootKls,
barKls,
barStyle: (0, vue.computed)(() => ({ background: background.value })),
thumbKls,
thumbStyle: (0, vue.computed)(() => ({
left: addUnit(thumbLeft.value),
top: addUnit(thumbTop.value)
})),
thumbLeft,
thumbTop,
update
};
};
//#endregion
//#region ../../packages/components/color-picker-panel/src/components/alpha-slider.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$55 = [
"aria-label",
"aria-valuenow",
"aria-valuetext",
"aria-orientation",
"tabindex",
"aria-disabled"
];
const minValue$1 = 0;
const maxValue$1 = 100;
var alpha_slider_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElColorAlphaSlider",
__name: "alpha-slider",
props: alphaSliderProps,
setup(__props, { expose: __expose }) {
const props = __props;
const { currentValue, bar, thumb, handleDrag, handleClick, handleKeydown } = useSlider(props, {
key: "alpha",
minValue: minValue$1,
maxValue: maxValue$1
});
const { rootKls, barKls, barStyle, thumbKls, thumbStyle, update } = useSliderDOM(props, {
namespace: "color-alpha-slider",
maxValue: maxValue$1,
currentValue,
bar,
thumb,
handleDrag,
getBackground
});
const { t } = useLocale();
const ariaLabel = (0, vue.computed)(() => t("el.colorpicker.alphaLabel"));
const ariaValuetext = (0, vue.computed)(() => {
return t("el.colorpicker.alphaDescription", {
alpha: currentValue.value,
color: props.color.value
});
});
function getBackground() {
if (props.color && props.color.value) {
const { r, g, b } = props.color.toRgb();
return `linear-gradient(to right, rgba(${r}, ${g}, ${b}, 0) 0%, rgba(${r}, ${g}, ${b}, 1) 100%)`;
}
return "";
}
__expose({
update,
bar,
thumb
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(rootKls)) }, [(0, vue.createElementVNode)("div", {
ref_key: "bar",
ref: bar,
class: (0, vue.normalizeClass)((0, vue.unref)(barKls)),
style: (0, vue.normalizeStyle)((0, vue.unref)(barStyle)),
onClick: _cache[0] || (_cache[0] = (...args) => (0, vue.unref)(handleClick) && (0, vue.unref)(handleClick)(...args))
}, null, 6), (0, vue.createElementVNode)("div", {
ref_key: "thumb",
ref: thumb,
class: (0, vue.normalizeClass)((0, vue.unref)(thumbKls)),
style: (0, vue.normalizeStyle)((0, vue.unref)(thumbStyle)),
"aria-label": ariaLabel.value,
"aria-valuenow": (0, vue.unref)(currentValue),
"aria-valuetext": ariaValuetext.value,
"aria-orientation": __props.vertical ? "vertical" : "horizontal",
"aria-valuemin": minValue$1,
"aria-valuemax": maxValue$1,
role: "slider",
tabindex: __props.disabled ? void 0 : 0,
"aria-disabled": __props.disabled,
onKeydown: _cache[1] || (_cache[1] = (...args) => (0, vue.unref)(handleKeydown) && (0, vue.unref)(handleKeydown)(...args))
}, null, 46, _hoisted_1$55)], 2);
};
}
});
//#endregion
//#region ../../packages/components/color-picker-panel/src/components/alpha-slider.vue
var alpha_slider_default = alpha_slider_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/color-picker-panel/src/components/hue-slider.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$54 = [
"aria-label",
"aria-valuenow",
"aria-valuetext",
"aria-orientation",
"tabindex",
"aria-disabled"
];
const minValue = 0;
const maxValue = 360;
var hue_slider_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElColorHueSlider",
__name: "hue-slider",
props: hueSliderProps,
setup(__props, { expose: __expose }) {
const props = __props;
const { currentValue, bar, thumb, handleDrag, handleClick, handleKeydown } = useSlider(props, {
key: "hue",
minValue,
maxValue
});
const { rootKls, barKls, thumbKls, thumbStyle, thumbTop, update } = useSliderDOM(props, {
namespace: "color-hue-slider",
maxValue,
currentValue,
bar,
thumb,
handleDrag
});
const { t } = useLocale();
const ariaLabel = (0, vue.computed)(() => t("el.colorpicker.hueLabel"));
const ariaValuetext = (0, vue.computed)(() => {
return t("el.colorpicker.hueDescription", {
hue: currentValue.value,
color: props.color.value
});
});
__expose({
bar,
thumb,
thumbTop,
update
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(rootKls)) }, [(0, vue.createElementVNode)("div", {
ref_key: "bar",
ref: bar,
class: (0, vue.normalizeClass)((0, vue.unref)(barKls)),
onClick: _cache[0] || (_cache[0] = (...args) => (0, vue.unref)(handleClick) && (0, vue.unref)(handleClick)(...args))
}, null, 2), (0, vue.createElementVNode)("div", {
ref_key: "thumb",
ref: thumb,
class: (0, vue.normalizeClass)((0, vue.unref)(thumbKls)),
style: (0, vue.normalizeStyle)((0, vue.unref)(thumbStyle)),
"aria-label": ariaLabel.value,
"aria-valuenow": (0, vue.unref)(currentValue),
"aria-valuetext": ariaValuetext.value,
"aria-orientation": __props.vertical ? "vertical" : "horizontal",
"aria-valuemin": minValue,
"aria-valuemax": maxValue,
role: "slider",
tabindex: __props.disabled ? void 0 : 0,
"aria-disabled": __props.disabled,
onKeydown: _cache[1] || (_cache[1] = (...args) => (0, vue.unref)(handleKeydown) && (0, vue.unref)(handleKeydown)(...args))
}, null, 46, _hoisted_1$54)], 2);
};
}
});
//#endregion
//#region ../../packages/components/color-picker-panel/src/components/hue-slider.vue
var hue_slider_default = hue_slider_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/color-picker-panel/src/props/predefine.ts
/**
* @deprecated Removed after 3.0.0, Use `PredefineProps` instead.
*/
const predefineProps = buildProps({
colors: {
type: definePropType(Array),
required: true
},
color: {
type: definePropType(Object),
required: true
},
enableAlpha: {
type: Boolean,
required: true
},
disabled: Boolean
});
//#endregion
//#region ../../packages/components/color-picker-panel/src/utils/color.ts
var Color = class {
constructor(options = {}) {
this._hue = 0;
this._saturation = 100;
this._value = 100;
this._alpha = 100;
this._tiny = new TinyColor();
this._isValid = false;
this.enableAlpha = false;
this.format = "";
this.value = "";
for (const option in options) if (hasOwn(options, option)) this[option] = options[option];
if (options.value) this.fromString(options.value);
else this.doOnChange();
}
set(prop, value) {
if (arguments.length === 1 && typeof prop === "object") {
for (const p in prop) if (hasOwn(prop, p)) this.set(p, prop[p]);
return;
}
this[`_${prop}`] = value;
this._isValid = true;
this.doOnChange();
}
get(prop) {
if ([
"hue",
"saturation",
"value",
"alpha"
].includes(prop)) return Math.round(this[`_${prop}`]);
return this[`_${prop}`];
}
toRgb() {
return this._isValid ? this._tiny.toRgb() : {
r: 255,
g: 255,
b: 255,
a: 0
};
}
fromString(value) {
const color = new TinyColor(value);
this._isValid = color.isValid;
if (color.isValid) {
const { h, s, v, a } = color.toHsv();
this._hue = h;
this._saturation = s * 100;
this._value = v * 100;
this._alpha = a * 100;
} else {
this._hue = 0;
this._saturation = 100;
this._value = 100;
this._alpha = 100;
}
this.doOnChange();
}
clear() {
this._isValid = false;
this.value = "";
this._hue = 0;
this._saturation = 100;
this._value = 100;
this._alpha = 100;
}
compare(color) {
const compareColor = new TinyColor({
h: color._hue,
s: color._saturation / 100,
v: color._value / 100,
a: color._alpha / 100
});
return this._tiny.equals(compareColor);
}
doOnChange() {
const { _hue, _saturation, _value, _alpha, format, enableAlpha } = this;
let _format = format || (enableAlpha ? "rgb" : "hex");
if (format === "hex" && enableAlpha) _format = "hex8";
this._tiny = new TinyColor({
h: _hue,
s: _saturation / 100,
v: _value / 100,
a: _alpha / 100
});
this.value = this._isValid ? this._tiny.toString(_format) : "";
}
};
//#endregion
//#region ../../packages/components/color-picker-panel/src/composables/use-predefine.ts
const usePredefine = (props) => {
const { currentColor } = (0, vue.inject)(colorPickerPanelContextKey);
const rgbaColors = (0, vue.ref)(parseColors(props.colors, props.color));
(0, vue.watch)(() => currentColor.value, (val) => {
const color = new Color({
value: val,
enableAlpha: props.enableAlpha
});
rgbaColors.value.forEach((item) => {
item.selected = color.compare(item);
});
});
(0, vue.watchEffect)(() => {
rgbaColors.value = parseColors(props.colors, props.color);
});
function handleSelect(index) {
props.color.fromString(props.colors[index]);
}
function parseColors(colors, color) {
return colors.map((value) => {
const c = new Color({
value,
enableAlpha: props.enableAlpha
});
c.selected = c.compare(color);
return c;
});
}
return {
rgbaColors,
handleSelect
};
};
const usePredefineDOM = (props) => {
const ns = useNamespace("color-predefine");
const rootKls = (0, vue.computed)(() => [ns.b(), ns.is("disabled", props.disabled)]);
const colorsKls = (0, vue.computed)(() => ns.e("colors"));
function colorSelectorKls(item) {
return [
ns.e("color-selector"),
ns.is("alpha", item.get("alpha") < 100),
{ selected: item.selected }
];
}
return {
rootKls,
colorsKls,
colorSelectorKls
};
};
//#endregion
//#region ../../packages/components/color-picker-panel/src/components/predefine.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$53 = [
"disabled",
"aria-label",
"onClick"
];
var predefine_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElColorPredefine",
__name: "predefine",
props: predefineProps,
setup(__props) {
const props = __props;
const { rgbaColors, handleSelect } = usePredefine(props);
const { rootKls, colorsKls, colorSelectorKls } = usePredefineDOM(props);
const { t } = useLocale();
const ariaLabel = (value) => {
return t("el.colorpicker.predefineDescription", { value });
};
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(rootKls)) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(colorsKls)) }, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(rgbaColors), (item, index) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key: __props.colors[index],
type: "button",
disabled: __props.disabled,
"aria-label": ariaLabel(item.value),
class: (0, vue.normalizeClass)((0, vue.unref)(colorSelectorKls)(item)),
onClick: ($event) => (0, vue.unref)(handleSelect)(index)
}, [(0, vue.createElementVNode)("div", { style: (0, vue.normalizeStyle)({ backgroundColor: item.value }) }, null, 4)], 10, _hoisted_1$53);
}), 128))], 2)], 2);
};
}
});
//#endregion
//#region ../../packages/components/color-picker-panel/src/components/predefine.vue
var predefine_default = predefine_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/color-picker-panel/src/props/sv-panel.ts
/**
* @deprecated Removed after 3.0.0, Use `SvPanelProps` instead.
*/
const svPanelProps = buildProps({
color: {
type: definePropType(Object),
required: true
},
disabled: Boolean
});
//#endregion
//#region ../../packages/components/color-picker-panel/src/composables/use-sv-panel.ts
const useSvPanel = (props) => {
const instance = (0, vue.getCurrentInstance)();
const cursorRef = (0, vue.ref)();
const cursorTop = (0, vue.ref)(0);
const cursorLeft = (0, vue.ref)(0);
const background = (0, vue.ref)("hsl(0, 100%, 50%)");
const saturation = (0, vue.computed)(() => props.color.get("saturation"));
const brightness = (0, vue.computed)(() => props.color.get("value"));
const hue = (0, vue.computed)(() => props.color.get("hue"));
function handleClick(event) {
if (props.disabled) return;
if (event.target !== cursorRef.value) handleDrag(event);
cursorRef.value?.focus({ preventScroll: true });
}
function handleDrag(event) {
if (props.disabled) return;
const rect = instance.vnode.el.getBoundingClientRect();
const { clientX, clientY } = getClientXY(event);
let left = clientX - rect.left;
let top = clientY - rect.top;
left = Math.max(0, left);
left = Math.min(left, rect.width);
top = Math.max(0, top);
top = Math.min(top, rect.height);
cursorLeft.value = left;
cursorTop.value = top;
props.color.set({
saturation: left / rect.width * 100,
value: 100 - top / rect.height * 100
});
}
function handleKeydown(event) {
if (props.disabled) return;
const { shiftKey } = event;
const code = getEventCode(event);
const step = shiftKey ? 10 : 1;
let isPreventDefault = true;
switch (code) {
case EVENT_CODE.left:
incrementSaturation(-step);
break;
case EVENT_CODE.right:
incrementSaturation(step);
break;
case EVENT_CODE.up:
incrementBrightness(step);
break;
case EVENT_CODE.down:
incrementBrightness(-step);
break;
default:
isPreventDefault = false;
break;
}
isPreventDefault && event.preventDefault();
}
function incrementSaturation(step) {
let next = saturation.value + step;
next = next < 0 ? 0 : next > 100 ? 100 : next;
props.color.set("saturation", next);
}
function incrementBrightness(step) {
let next = brightness.value + step;
next = next < 0 ? 0 : next > 100 ? 100 : next;
props.color.set("value", next);
}
return {
cursorRef,
cursorTop,
cursorLeft,
background,
saturation,
brightness,
hue,
handleClick,
handleDrag,
handleKeydown
};
};
const useSvPanelDOM = (props, { cursorTop, cursorLeft, background, handleDrag }) => {
const instance = (0, vue.getCurrentInstance)();
const ns = useNamespace("color-svpanel");
function update() {
const saturation = props.color.get("saturation");
const brightness = props.color.get("value");
const { clientWidth: width, clientHeight: height } = instance.vnode.el;
cursorLeft.value = saturation * width / 100;
cursorTop.value = (100 - brightness) * height / 100;
background.value = `hsl(${props.color.get("hue")}, 100%, 50%)`;
}
(0, vue.onMounted)(() => {
draggable(instance.vnode.el, {
drag: (event) => {
handleDrag(event);
},
end: (event) => {
handleDrag(event);
}
});
update();
});
(0, vue.watch)([
() => props.color.get("hue"),
() => props.color.get("value"),
() => props.color.value
], () => update());
return {
rootKls: (0, vue.computed)(() => ns.b()),
cursorKls: (0, vue.computed)(() => ns.e("cursor")),
rootStyle: (0, vue.computed)(() => ({ backgroundColor: background.value })),
cursorStyle: (0, vue.computed)(() => ({
top: addUnit(cursorTop.value),
left: addUnit(cursorLeft.value)
})),
update
};
};
//#endregion
//#region ../../packages/components/color-picker-panel/src/components/sv-panel.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$52 = [
"tabindex",
"aria-disabled",
"aria-label",
"aria-valuenow",
"aria-valuetext"
];
var sv_panel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElSvPanel",
__name: "sv-panel",
props: svPanelProps,
setup(__props, { expose: __expose }) {
const props = __props;
const { cursorRef, cursorTop, cursorLeft, background, saturation, brightness, handleClick, handleDrag, handleKeydown } = useSvPanel(props);
const { rootKls, cursorKls, rootStyle, cursorStyle, update } = useSvPanelDOM(props, {
cursorTop,
cursorLeft,
background,
handleDrag
});
const { t } = useLocale();
const ariaLabel = (0, vue.computed)(() => t("el.colorpicker.svLabel"));
const ariaValuetext = (0, vue.computed)(() => {
return t("el.colorpicker.svDescription", {
saturation: saturation.value,
brightness: brightness.value,
color: props.color.value
});
});
__expose({ update });
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
class: (0, vue.normalizeClass)((0, vue.unref)(rootKls)),
style: (0, vue.normalizeStyle)((0, vue.unref)(rootStyle)),
onClick: _cache[1] || (_cache[1] = (...args) => (0, vue.unref)(handleClick) && (0, vue.unref)(handleClick)(...args))
}, [(0, vue.createElementVNode)("div", {
ref_key: "cursorRef",
ref: cursorRef,
class: (0, vue.normalizeClass)((0, vue.unref)(cursorKls)),
style: (0, vue.normalizeStyle)((0, vue.unref)(cursorStyle)),
tabindex: __props.disabled ? void 0 : 0,
"aria-disabled": __props.disabled,
role: "slider",
"aria-valuemin": "0,0",
"aria-valuemax": "100,100",
"aria-label": ariaLabel.value,
"aria-valuenow": `${(0, vue.unref)(saturation)},${(0, vue.unref)(brightness)}`,
"aria-valuetext": ariaValuetext.value,
onKeydown: _cache[0] || (_cache[0] = (...args) => (0, vue.unref)(handleKeydown) && (0, vue.unref)(handleKeydown)(...args))
}, null, 46, _hoisted_1$52)], 6);
};
}
});
//#endregion
//#region ../../packages/components/color-picker-panel/src/components/sv-panel.vue
var sv_panel_default = sv_panel_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/color-picker-panel/src/composables/use-common-color.ts
const useCommonColor = (props, emit) => {
const color = (0, vue.reactive)(new Color({
enableAlpha: props.showAlpha,
format: props.colorFormat || "",
value: props.modelValue
}));
(0, vue.watch)(() => [props.colorFormat, props.showAlpha], () => {
color.enableAlpha = props.showAlpha;
color.format = props.colorFormat || color.format;
color.doOnChange();
emit(UPDATE_MODEL_EVENT, color.value);
});
return { color };
};
//#endregion
//#region ../../packages/components/color-picker-panel/src/color-picker-panel.vue?vue&type=script&setup=true&lang.ts
var color_picker_panel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElColorPickerPanel",
__name: "color-picker-panel",
props: colorPickerPanelProps,
emits: colorPickerPanelEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const ns = useNamespace("color-picker-panel");
const { formItem } = useFormItem();
const disabled = useFormDisabled();
const hueRef = (0, vue.ref)();
const svRef = (0, vue.ref)();
const alphaRef = (0, vue.ref)();
const inputRef = (0, vue.ref)();
const customInput = (0, vue.ref)("");
const { color } = (0, vue.inject)(ROOT_COMMON_COLOR_INJECTION_KEY, () => useCommonColor(props, emit), true);
function handleConfirm() {
color.fromString(customInput.value);
if (color.value !== customInput.value) customInput.value = color.value;
}
function handleFocusout() {
if (props.validateEvent) formItem?.validate?.("blur").catch((err) => /* @__PURE__ */ debugWarn(err));
}
function update() {
hueRef.value?.update();
svRef.value?.update();
alphaRef.value?.update();
}
(0, vue.onMounted)(() => {
if (props.modelValue) customInput.value = color.value;
(0, vue.nextTick)(update);
});
(0, vue.watch)(() => props.modelValue, (newVal) => {
if (newVal !== color.value) newVal ? color.fromString(newVal) : color.clear();
});
(0, vue.watch)(() => color.value, (val) => {
emit(UPDATE_MODEL_EVENT, val);
customInput.value = val;
if (props.validateEvent) formItem?.validate("change").catch((err) => /* @__PURE__ */ debugWarn(err));
});
(0, vue.provide)(colorPickerPanelContextKey, { currentColor: (0, vue.computed)(() => color.value) });
__expose({
color,
inputRef,
update
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).b(),
(0, vue.unref)(ns).is("disabled", (0, vue.unref)(disabled)),
(0, vue.unref)(ns).is("border", __props.border)
]),
onFocusout: handleFocusout
}, [
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("wrapper")) }, [(0, vue.createVNode)(hue_slider_default, {
ref_key: "hueRef",
ref: hueRef,
color: (0, vue.unref)(color),
vertical: "",
disabled: (0, vue.unref)(disabled),
class: (0, vue.normalizeClass)(["hue-slider", __props.hueSliderClass]),
style: (0, vue.normalizeStyle)(__props.hueSliderStyle)
}, null, 8, [
"color",
"disabled",
"class",
"style"
]), (0, vue.createVNode)(sv_panel_default, {
ref_key: "svRef",
ref: svRef,
color: (0, vue.unref)(color),
disabled: (0, vue.unref)(disabled)
}, null, 8, ["color", "disabled"])], 2),
__props.showAlpha ? ((0, vue.openBlock)(), (0, vue.createBlock)(alpha_slider_default, {
key: 0,
ref_key: "alphaRef",
ref: alphaRef,
color: (0, vue.unref)(color),
disabled: (0, vue.unref)(disabled)
}, null, 8, ["color", "disabled"])) : (0, vue.createCommentVNode)("v-if", true),
__props.predefine ? ((0, vue.openBlock)(), (0, vue.createBlock)(predefine_default, {
key: 1,
ref: "predefine",
"enable-alpha": __props.showAlpha,
color: (0, vue.unref)(color),
colors: __props.predefine,
disabled: (0, vue.unref)(disabled)
}, null, 8, [
"enable-alpha",
"color",
"colors",
"disabled"
])) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("footer")) }, [(0, vue.createVNode)((0, vue.unref)(ElInput), {
ref_key: "inputRef",
ref: inputRef,
modelValue: customInput.value,
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => customInput.value = $event),
"validate-event": false,
size: "small",
disabled: (0, vue.unref)(disabled),
onChange: handleConfirm
}, null, 8, ["modelValue", "disabled"]), (0, vue.renderSlot)(_ctx.$slots, "footer")], 2)
], 34);
};
}
});
//#endregion
//#region ../../packages/components/color-picker-panel/src/color-picker-panel.vue
var color_picker_panel_default = color_picker_panel_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/color-picker-panel/index.ts
const ElColorPickerPanel = withInstall(color_picker_panel_default);
//#endregion
//#region ../../packages/components/color-picker/src/color-picker.ts
/**
* @deprecated Removed after 3.0.0, Use `ColorPickerProps` instead.
*/
const colorPickerProps = buildProps({
persistent: {
type: Boolean,
default: true
},
modelValue: {
type: definePropType(String),
default: void 0
},
id: String,
showAlpha: Boolean,
colorFormat: { type: definePropType(String) },
disabled: {
type: Boolean,
default: void 0
},
clearable: {
type: Boolean,
default: true
},
size: useSizeProp,
popperClass: useTooltipContentProps.popperClass,
popperStyle: useTooltipContentProps.popperStyle,
tabindex: {
type: [String, Number],
default: 0
},
teleported: useTooltipContentProps.teleported,
appendTo: useTooltipContentProps.appendTo,
predefine: { type: definePropType(Array) },
validateEvent: {
type: Boolean,
default: true
},
...useEmptyValuesProps,
...useAriaProps(["ariaLabel"])
});
const colorPickerEmits = {
[UPDATE_MODEL_EVENT]: (val) => isString(val) || isNil(val),
[CHANGE_EVENT]: (val) => isString(val) || isNil(val),
activeChange: (val) => isString(val) || isNil(val),
focus: (evt) => evt instanceof FocusEvent,
blur: (evt) => evt instanceof FocusEvent,
clear: () => true
};
/**
* @description default values for ColorPickerProps, used in components that extend ColorPickerProps
*/
const colorPickerPropsDefaults = {
persistent: true,
modelValue: void 0,
disabled: void 0,
clearable: true,
popperStyle: void 0,
tabindex: 0,
teleported: true,
validateEvent: true,
valueOnClear: void 0
};
//#endregion
//#region ../../packages/components/color-picker/src/color-picker.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$51 = [
"id",
"aria-label",
"aria-labelledby",
"aria-description",
"aria-disabled",
"tabindex"
];
var color_picker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElColorPicker",
__name: "color-picker",
props: colorPickerProps,
emits: colorPickerEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const { t } = useLocale();
const ns = useNamespace("color");
const { formItem } = useFormItem();
const colorSize = useFormSize();
const colorDisabled = useFormDisabled();
const { valueOnClear, isEmptyValue } = useEmptyValues(props, null);
const commonColor = useCommonColor(props, emit);
const { inputId: buttonId, isLabeledByFormItem } = useFormItemInputId(props, { formItemContext: formItem });
const popper = (0, vue.ref)();
const triggerRef = (0, vue.ref)();
const pickerPanelRef = (0, vue.ref)();
const showPicker = (0, vue.ref)(false);
const showPanelColor = (0, vue.ref)(false);
let shouldActiveChange = true;
const { isFocused, handleFocus, handleBlur } = useFocusController(triggerRef, {
disabled: colorDisabled,
beforeBlur(event) {
return popper.value?.isFocusInsideContent(event);
},
afterBlur() {
setShowPicker(false);
resetColor();
if (props.validateEvent) formItem?.validate?.("blur").catch((err) => /* @__PURE__ */ debugWarn(err));
}
});
const color = reactiveComputed(() => pickerPanelRef.value?.color ?? commonColor.color);
const panelProps = (0, vue.computed)(() => pick(props, Object.keys(colorPickerPanelProps)));
const displayedColor = (0, vue.computed)(() => {
if (!props.modelValue && !showPanelColor.value) return "transparent";
return displayedRgb(color, props.showAlpha);
});
const currentColor = (0, vue.computed)(() => {
return !props.modelValue && !showPanelColor.value ? "" : color.value;
});
const buttonAriaLabel = (0, vue.computed)(() => {
return !isLabeledByFormItem.value ? props.ariaLabel || t("el.colorpicker.defaultLabel") : void 0;
});
const buttonAriaLabelledby = (0, vue.computed)(() => {
return isLabeledByFormItem.value ? formItem?.labelId : void 0;
});
const btnKls = (0, vue.computed)(() => {
return [
ns.b("picker"),
ns.is("disabled", colorDisabled.value),
ns.bm("picker", colorSize.value),
ns.is("focused", isFocused.value)
];
});
function displayedRgb(color, showAlpha) {
const { r, g, b, a } = color.toRgb();
return showAlpha ? `rgba(${r}, ${g}, ${b}, ${a})` : `rgb(${r}, ${g}, ${b})`;
}
function setShowPicker(value) {
showPicker.value = value;
}
const debounceSetShowPicker = debounce(setShowPicker, 100, { leading: true });
function show() {
if (colorDisabled.value) return;
setShowPicker(true);
}
function hide() {
debounceSetShowPicker(false);
resetColor();
}
function resetColor() {
(0, vue.nextTick)(() => {
if (props.modelValue) color.fromString(props.modelValue);
else {
color.value = "";
(0, vue.nextTick)(() => {
showPanelColor.value = false;
});
}
});
}
function handleTrigger() {
if (colorDisabled.value) return;
if (showPicker.value) resetColor();
debounceSetShowPicker(!showPicker.value);
}
function confirmValue() {
const value = isEmptyValue(color.value) ? valueOnClear.value : color.value;
emit(UPDATE_MODEL_EVENT, value);
emit(CHANGE_EVENT, value);
if (props.validateEvent) formItem?.validate("change").catch((err) => /* @__PURE__ */ debugWarn(err));
debounceSetShowPicker(false);
(0, vue.nextTick)(() => {
const newColor = new Color({
enableAlpha: props.showAlpha,
format: props.colorFormat || "",
value: props.modelValue
});
if (!color.compare(newColor)) resetColor();
});
}
function clear() {
debounceSetShowPicker(false);
emit(UPDATE_MODEL_EVENT, valueOnClear.value);
emit(CHANGE_EVENT, valueOnClear.value);
if (props.modelValue !== valueOnClear.value && props.validateEvent) formItem?.validate("change").catch((err) => /* @__PURE__ */ debugWarn(err));
resetColor();
emit("clear");
}
function handleShowTooltip() {
pickerPanelRef?.value?.inputRef?.focus();
}
function handleClickOutside() {
if (!showPicker.value) return;
hide();
isFocused.value && focus();
}
function handleEsc(event) {
event.preventDefault();
event.stopPropagation();
setShowPicker(false);
resetColor();
}
function handleKeyDown(event) {
switch (getEventCode(event)) {
case EVENT_CODE.enter:
case EVENT_CODE.numpadEnter:
case EVENT_CODE.space:
event.preventDefault();
event.stopPropagation();
show();
break;
case EVENT_CODE.esc:
handleEsc(event);
break;
}
}
function focus() {
triggerRef.value.focus();
}
function blur() {
triggerRef.value.blur();
}
(0, vue.watch)(() => currentColor.value, (val) => {
shouldActiveChange && emit("activeChange", val);
shouldActiveChange = true;
});
(0, vue.watch)(() => color.value, () => {
if (!props.modelValue && !showPanelColor.value) showPanelColor.value = true;
});
(0, vue.watch)(() => props.modelValue, (newVal) => {
if (!newVal) showPanelColor.value = false;
else if (newVal && newVal !== color.value) {
shouldActiveChange = false;
color.fromString(newVal);
}
});
(0, vue.watch)(() => showPicker.value, () => {
pickerPanelRef.value && (0, vue.nextTick)(pickerPanelRef.value.update);
});
(0, vue.provide)(ROOT_COMMON_COLOR_INJECTION_KEY, commonColor);
__expose({
color,
show,
hide,
focus,
blur
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElTooltip), {
ref_key: "popper",
ref: popper,
visible: showPicker.value,
"show-arrow": false,
"fallback-placements": [
"bottom",
"top",
"right",
"left"
],
offset: 0,
"gpu-acceleration": false,
"popper-class": [(0, vue.unref)(ns).be("picker", "panel"), __props.popperClass],
"popper-style": __props.popperStyle,
"stop-popper-mouse-event": false,
pure: "",
loop: "",
role: "dialog",
effect: "light",
trigger: "click",
teleported: __props.teleported,
transition: `${(0, vue.unref)(ns).namespace.value}-zoom-in-top`,
persistent: __props.persistent,
"append-to": __props.appendTo,
onShow: handleShowTooltip,
onHide: _cache[2] || (_cache[2] = ($event) => setShowPicker(false))
}, {
content: (0, vue.withCtx)(() => [(0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElColorPickerPanel), (0, vue.mergeProps)({
ref_key: "pickerPanelRef",
ref: pickerPanelRef
}, panelProps.value, {
border: false,
"validate-event": false,
onKeydown: (0, vue.withKeys)(handleEsc, ["esc"])
}), {
footer: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", null, [__props.clearable ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElButton), {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("footer", "link-btn")),
text: "",
size: "small",
onClick: clear
}, {
default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(t)("el.colorpicker.clear")), 1)]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createVNode)((0, vue.unref)(ElButton), {
plain: "",
size: "small",
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("footer", "btn")),
onClick: confirmValue
}, {
default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(t)("el.colorpicker.confirm")), 1)]),
_: 1
}, 8, ["class"])])]),
_: 1
}, 16)), [[
(0, vue.unref)(ClickOutside),
handleClickOutside,
triggerRef.value
]])]),
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", (0, vue.mergeProps)({
id: (0, vue.unref)(buttonId),
ref_key: "triggerRef",
ref: triggerRef
}, _ctx.$attrs, {
class: btnKls.value,
role: "button",
"aria-label": buttonAriaLabel.value,
"aria-labelledby": buttonAriaLabelledby.value,
"aria-description": (0, vue.unref)(t)("el.colorpicker.description", { color: __props.modelValue || "" }),
"aria-disabled": (0, vue.unref)(colorDisabled),
tabindex: (0, vue.unref)(colorDisabled) ? void 0 : __props.tabindex,
onKeydown: handleKeyDown,
onFocus: _cache[0] || (_cache[0] = (...args) => (0, vue.unref)(handleFocus) && (0, vue.unref)(handleFocus)(...args)),
onBlur: _cache[1] || (_cache[1] = (...args) => (0, vue.unref)(handleBlur) && (0, vue.unref)(handleBlur)(...args))
}), [(0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("picker", "trigger")),
onClick: handleTrigger
}, [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).be("picker", "color"), (0, vue.unref)(ns).is("alpha", __props.showAlpha)]) }, [(0, vue.createElementVNode)("span", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("picker", "color-inner")),
style: (0, vue.normalizeStyle)({ backgroundColor: displayedColor.value })
}, [(0, vue.withDirectives)((0, vue.createVNode)((0, vue.unref)(ElIcon), { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).be("picker", "icon"), (0, vue.unref)(ns).is("icon-arrow-down")]) }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(arrow_down_default))]),
_: 1
}, 8, ["class"]), [[vue.vShow, __props.modelValue || showPanelColor.value]]), (0, vue.withDirectives)((0, vue.createVNode)((0, vue.unref)(ElIcon), { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).be("picker", "empty"), (0, vue.unref)(ns).is("icon-close")]) }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(close_default))]),
_: 1
}, 8, ["class"]), [[vue.vShow, !__props.modelValue && !showPanelColor.value]])], 6)], 2)], 2)], 16, _hoisted_1$51)]),
_: 1
}, 8, [
"visible",
"popper-class",
"popper-style",
"teleported",
"transition",
"persistent",
"append-to"
]);
};
}
});
//#endregion
//#region ../../packages/components/color-picker/src/color-picker.vue
var color_picker_default = color_picker_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/color-picker/index.ts
const ElColorPicker = withInstall(color_picker_default);
//#endregion
//#region ../../packages/components/container/src/container.vue?vue&type=script&setup=true&lang.ts
var container_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElContainer",
__name: "container",
props: { direction: {
type: String,
required: false
} },
setup(__props) {
const props = __props;
const slots = (0, vue.useSlots)();
const ns = useNamespace("container");
const isVertical = (0, vue.computed)(() => {
if (props.direction === "vertical") return true;
else if (props.direction === "horizontal") return false;
if (slots && slots.default) return slots.default().some((vNode) => {
const tag = vNode.type.name;
return tag === "ElHeader" || tag === "ElFooter";
});
else return false;
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("section", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).b(), (0, vue.unref)(ns).is("vertical", isVertical.value)]) }, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2);
};
}
});
//#endregion
//#region ../../packages/components/container/src/container.vue
var container_default = container_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/container/src/aside.vue?vue&type=script&setup=true&lang.ts
var aside_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElAside",
__name: "aside",
props: { width: {
type: [String, null],
required: false,
default: null
} },
setup(__props) {
const props = __props;
const ns = useNamespace("aside");
const style = (0, vue.computed)(() => props.width ? ns.cssVarBlock({ width: props.width }) : {});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("aside", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()),
style: (0, vue.normalizeStyle)(style.value)
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 6);
};
}
});
//#endregion
//#region ../../packages/components/container/src/aside.vue
var aside_default = aside_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/container/src/footer.vue?vue&type=script&setup=true&lang.ts
var footer_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElFooter",
__name: "footer",
props: { height: {
type: [String, null],
required: false,
default: null
} },
setup(__props) {
const props = __props;
const ns = useNamespace("footer");
const style = (0, vue.computed)(() => props.height ? ns.cssVarBlock({ height: props.height }) : {});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("footer", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()),
style: (0, vue.normalizeStyle)(style.value)
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 6);
};
}
});
//#endregion
//#region ../../packages/components/container/src/footer.vue
var footer_default = footer_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/container/src/header.vue?vue&type=script&setup=true&lang.ts
var header_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElHeader",
__name: "header",
props: { height: {
type: [String, null],
required: false,
default: null
} },
setup(__props) {
const props = __props;
const ns = useNamespace("header");
const style = (0, vue.computed)(() => {
return props.height ? ns.cssVarBlock({ height: props.height }) : {};
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("header", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()),
style: (0, vue.normalizeStyle)(style.value)
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 6);
};
}
});
//#endregion
//#region ../../packages/components/container/src/header.vue
var header_default = header_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/container/src/main.vue?vue&type=script&setup=true&lang.ts
var main_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElMain",
__name: "main",
setup(__props) {
const ns = useNamespace("main");
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("main", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()) }, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2);
};
}
});
//#endregion
//#region ../../packages/components/container/src/main.vue
var main_default = main_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/container/index.ts
const ElContainer = withInstall(container_default, {
Aside: aside_default,
Footer: footer_default,
Header: header_default,
Main: main_default
});
const ElAside = withNoopInstall(aside_default);
const ElFooter = withNoopInstall(footer_default);
const ElHeader = withNoopInstall(header_default);
const ElMain = withNoopInstall(main_default);
//#endregion
//#region ../../node_modules/.pnpm/dayjs@1.11.19/node_modules/dayjs/plugin/advancedFormat.js
var require_advancedFormat = /* @__PURE__ */ __commonJSMin(((exports, module) => {
(function(e, t) {
"object" == typeof exports && "undefined" != typeof module ? module.exports = t() : "function" == typeof define && define.amd ? define(t) : (e = "undefined" != typeof globalThis ? globalThis : e || self).dayjs_plugin_advancedFormat = t();
})(exports, (function() {
"use strict";
return function(e, t) {
var r = t.prototype, n = r.format;
r.format = function(e) {
var t = this, r = this.$locale();
if (!this.isValid()) return n.bind(this)(e);
var s = this.$utils(), a = (e || "YYYY-MM-DDTHH:mm:ssZ").replace(/\[([^\]]+)]|Q|wo|ww|w|WW|W|zzz|z|gggg|GGGG|Do|X|x|k{1,2}|S/g, (function(e) {
switch (e) {
case "Q": return Math.ceil((t.$M + 1) / 3);
case "Do": return r.ordinal(t.$D);
case "gggg": return t.weekYear();
case "GGGG": return t.isoWeekYear();
case "wo": return r.ordinal(t.week(), "W");
case "w":
case "ww": return s.s(t.week(), "w" === e ? 1 : 2, "0");
case "W":
case "WW": return s.s(t.isoWeek(), "W" === e ? 1 : 2, "0");
case "k":
case "kk": return s.s(String(0 === t.$H ? 24 : t.$H), "k" === e ? 1 : 2, "0");
case "X": return Math.floor(t.$d.getTime() / 1e3);
case "x": return t.$d.getTime();
case "z": return "[" + t.offsetName() + "]";
case "zzz": return "[" + t.offsetName("long") + "]";
default: return e;
}
}));
return n.bind(this)(a);
};
};
}));
}));
//#endregion
//#region ../../node_modules/.pnpm/dayjs@1.11.19/node_modules/dayjs/plugin/weekOfYear.js
var require_weekOfYear = /* @__PURE__ */ __commonJSMin(((exports, module) => {
(function(e, t) {
"object" == typeof exports && "undefined" != typeof module ? module.exports = t() : "function" == typeof define && define.amd ? define(t) : (e = "undefined" != typeof globalThis ? globalThis : e || self).dayjs_plugin_weekOfYear = t();
})(exports, (function() {
"use strict";
var e = "week", t = "year";
return function(i, n, r) {
var f = n.prototype;
f.week = function(i) {
if (void 0 === i && (i = null), null !== i) return this.add(7 * (i - this.week()), "day");
var n = this.$locale().yearStart || 1;
if (11 === this.month() && this.date() > 25) {
var f = r(this).startOf(t).add(1, t).date(n), s = r(this).endOf(e);
if (f.isBefore(s)) return 1;
}
var a = r(this).startOf(t).date(n).startOf(e).subtract(1, "millisecond"), o = this.diff(a, e, !0);
return o < 0 ? r(this).startOf("week").week() : Math.ceil(o);
}, f.weeks = function(e) {
return void 0 === e && (e = null), this.week(e);
};
};
}));
}));
//#endregion
//#region ../../node_modules/.pnpm/dayjs@1.11.19/node_modules/dayjs/plugin/weekYear.js
var require_weekYear = /* @__PURE__ */ __commonJSMin(((exports, module) => {
(function(e, t) {
"object" == typeof exports && "undefined" != typeof module ? module.exports = t() : "function" == typeof define && define.amd ? define(t) : (e = "undefined" != typeof globalThis ? globalThis : e || self).dayjs_plugin_weekYear = t();
})(exports, (function() {
"use strict";
return function(e, t) {
t.prototype.weekYear = function() {
var e = this.month(), t = this.week(), n = this.year();
return 1 === t && 11 === e ? n + 1 : 0 === e && t >= 52 ? n - 1 : n;
};
};
}));
}));
//#endregion
//#region ../../node_modules/.pnpm/dayjs@1.11.19/node_modules/dayjs/plugin/dayOfYear.js
var require_dayOfYear = /* @__PURE__ */ __commonJSMin(((exports, module) => {
(function(e, t) {
"object" == typeof exports && "undefined" != typeof module ? module.exports = t() : "function" == typeof define && define.amd ? define(t) : (e = "undefined" != typeof globalThis ? globalThis : e || self).dayjs_plugin_dayOfYear = t();
})(exports, (function() {
"use strict";
return function(e, t, n) {
t.prototype.dayOfYear = function(e) {
var t = Math.round((n(this).startOf("day") - n(this).startOf("year")) / 864e5) + 1;
return null == e ? t : this.add(e - t, "day");
};
};
}));
}));
//#endregion
//#region ../../node_modules/.pnpm/dayjs@1.11.19/node_modules/dayjs/plugin/isSameOrAfter.js
var require_isSameOrAfter = /* @__PURE__ */ __commonJSMin(((exports, module) => {
(function(e, t) {
"object" == typeof exports && "undefined" != typeof module ? module.exports = t() : "function" == typeof define && define.amd ? define(t) : (e = "undefined" != typeof globalThis ? globalThis : e || self).dayjs_plugin_isSameOrAfter = t();
})(exports, (function() {
"use strict";
return function(e, t) {
t.prototype.isSameOrAfter = function(e, t) {
return this.isSame(e, t) || this.isAfter(e, t);
};
};
}));
}));
//#endregion
//#region ../../node_modules/.pnpm/dayjs@1.11.19/node_modules/dayjs/plugin/isSameOrBefore.js
var require_isSameOrBefore = /* @__PURE__ */ __commonJSMin(((exports, module) => {
(function(e, i) {
"object" == typeof exports && "undefined" != typeof module ? module.exports = i() : "function" == typeof define && define.amd ? define(i) : (e = "undefined" != typeof globalThis ? globalThis : e || self).dayjs_plugin_isSameOrBefore = i();
})(exports, (function() {
"use strict";
return function(e, i) {
i.prototype.isSameOrBefore = function(e, i) {
return this.isSame(e, i) || this.isBefore(e, i);
};
};
}));
}));
//#endregion
//#region ../../packages/components/date-picker-panel/src/props/date-picker-panel.ts
var import_isSameOrBefore = /* @__PURE__ */ __toESM(require_isSameOrBefore());
var import_isSameOrAfter = /* @__PURE__ */ __toESM(require_isSameOrAfter());
var import_dayOfYear = /* @__PURE__ */ __toESM(require_dayOfYear());
var import_weekYear = /* @__PURE__ */ __toESM(require_weekYear());
var import_weekOfYear = /* @__PURE__ */ __toESM(require_weekOfYear());
var import_advancedFormat = /* @__PURE__ */ __toESM(require_advancedFormat());
const datePickerPanelProps = buildProps({
valueFormat: String,
dateFormat: String,
timeFormat: String,
disabled: {
type: Boolean,
default: void 0
},
modelValue: {
type: definePropType([
Date,
Array,
String,
Number
]),
default: ""
},
defaultValue: { type: definePropType([Date, Array]) },
defaultTime: { type: definePropType([Date, Array]) },
isRange: Boolean,
...disabledTimeListsProps,
disabledDate: { type: Function },
cellClassName: { type: Function },
shortcuts: {
type: Array,
default: () => []
},
arrowControl: Boolean,
unlinkPanels: Boolean,
showNow: {
type: Boolean,
default: true
},
showConfirm: Boolean,
showFooter: Boolean,
showWeekNumber: Boolean,
type: {
type: definePropType(String),
default: "date"
},
clearable: {
type: Boolean,
default: true
},
border: {
type: Boolean,
default: true
},
editable: {
type: Boolean,
default: true
}
});
//#endregion
//#region ../../packages/components/date-picker-panel/src/constants.ts
const ROOT_PICKER_INJECTION_KEY = Symbol("rootPickerContextKey");
const ROOT_PICKER_IS_DEFAULT_FORMAT_INJECTION_KEY = "ElIsDefaultFormat";
//#endregion
//#region ../../packages/components/date-picker-panel/src/props/shared.ts
const selectionModes = [
"date",
"dates",
"year",
"years",
"month",
"months",
"week",
"range"
];
const datePickerSharedProps = buildProps({
cellClassName: { type: definePropType(Function) },
disabledDate: { type: definePropType(Function) },
date: {
type: definePropType(Object),
required: true
},
minDate: { type: definePropType(Object) },
maxDate: { type: definePropType(Object) },
parsedValue: { type: definePropType([Object, Array]) },
rangeState: {
type: definePropType(Object),
default: () => ({
endDate: null,
selecting: false
})
},
disabled: Boolean
});
const panelSharedProps = buildProps({
type: {
type: definePropType(String),
required: true,
values: datePickTypes
},
dateFormat: String,
timeFormat: String,
showNow: {
type: Boolean,
default: true
},
showConfirm: Boolean,
showFooter: {
type: Boolean,
default: true
},
showWeekNumber: Boolean,
border: Boolean,
disabled: Boolean,
editable: {
type: Boolean,
default: true
}
});
const panelRangeSharedProps = buildProps({
unlinkPanels: Boolean,
visible: {
type: Boolean,
default: true
},
showConfirm: Boolean,
showFooter: {
type: Boolean,
default: true
},
border: Boolean,
disabled: Boolean,
parsedValue: { type: definePropType(Array) }
});
const selectionModeWithDefault = (mode) => {
return {
type: String,
values: selectionModes,
default: mode
};
};
//#endregion
//#region ../../packages/components/date-picker-panel/src/props/panel-date-pick.ts
const panelDatePickProps = buildProps({
...panelSharedProps,
parsedValue: { type: definePropType([Object, Array]) },
visible: {
type: Boolean,
default: true
},
format: {
type: String,
default: ""
}
});
//#endregion
//#region ../../packages/components/date-picker-panel/src/utils.ts
const isValidRange = (range) => {
if (!isArray$1(range)) return false;
const [left, right] = range;
return import_dayjs_min.default.isDayjs(left) && import_dayjs_min.default.isDayjs(right) && (0, import_dayjs_min.default)(left).isValid() && (0, import_dayjs_min.default)(right).isValid() && left.isSameOrBefore(right);
};
const getDefaultValue = (defaultValue, { lang, step = 1, unit, unlinkPanels }) => {
let start;
if (isArray$1(defaultValue)) {
let [left, right] = defaultValue.map((d) => (0, import_dayjs_min.default)(d).locale(lang));
if (!unlinkPanels) right = left.add(step, unit);
return [left, right];
} else if (defaultValue) start = (0, import_dayjs_min.default)(defaultValue);
else start = (0, import_dayjs_min.default)();
start = start.locale(lang);
return [start, start.add(step, unit)];
};
const buildPickerTable = (dimension, rows, { columnIndexOffset, startDate, nextEndDate, now, unit, relativeDateGetter, setCellMetadata, setRowMetadata }) => {
for (let rowIndex = 0; rowIndex < dimension.row; rowIndex++) {
const row = rows[rowIndex];
for (let columnIndex = 0; columnIndex < dimension.column; columnIndex++) {
let cell = row[columnIndex + columnIndexOffset];
if (!cell) cell = {
row: rowIndex,
column: columnIndex,
type: "normal",
inRange: false,
start: false,
end: false
};
const nextStartDate = relativeDateGetter(rowIndex * dimension.column + columnIndex);
cell.dayjs = nextStartDate;
cell.date = nextStartDate.toDate();
cell.timestamp = nextStartDate.valueOf();
cell.type = "normal";
cell.inRange = !!(startDate && nextStartDate.isSameOrAfter(startDate, unit) && nextEndDate && nextStartDate.isSameOrBefore(nextEndDate, unit)) || !!(startDate && nextStartDate.isSameOrBefore(startDate, unit) && nextEndDate && nextStartDate.isSameOrAfter(nextEndDate, unit));
if (startDate?.isSameOrAfter(nextEndDate)) {
cell.start = !!nextEndDate && nextStartDate.isSame(nextEndDate, unit);
cell.end = startDate && nextStartDate.isSame(startDate, unit);
} else {
cell.start = !!startDate && nextStartDate.isSame(startDate, unit);
cell.end = !!nextEndDate && nextStartDate.isSame(nextEndDate, unit);
}
if (nextStartDate.isSame(now, unit)) cell.type = "today";
setCellMetadata?.(cell, {
rowIndex,
columnIndex
});
row[columnIndex + columnIndexOffset] = cell;
}
setRowMetadata?.(row);
}
};
const datesInMonth = (date, year, month, lang) => {
const firstDay = (0, import_dayjs_min.default)().locale(lang).startOf("month").month(month).year(year).hour(date.hour()).minute(date.minute()).second(date.second());
return rangeArr(firstDay.daysInMonth()).map((n) => firstDay.add(n, "day").toDate());
};
const getValidDateOfMonth = (date, year, month, lang, disabledDate) => {
const _value = (0, import_dayjs_min.default)().year(year).month(month).startOf("month").hour(date.hour()).minute(date.minute()).second(date.second());
const _date = datesInMonth(date, year, month, lang).find((date) => {
return !disabledDate?.(date);
});
if (_date) return (0, import_dayjs_min.default)(_date).locale(lang);
return _value.locale(lang);
};
const getValidDateOfYear = (value, lang, disabledDate) => {
const year = value.year();
if (!disabledDate?.(value.toDate())) return value.locale(lang);
const month = value.month();
if (!datesInMonth(value, year, month, lang).every(disabledDate)) return getValidDateOfMonth(value, year, month, lang, disabledDate);
for (let i = 0; i < 12; i++) if (!datesInMonth(value, year, i, lang).every(disabledDate)) return getValidDateOfMonth(value, year, i, lang, disabledDate);
return value;
};
const correctlyParseUserInput = (value, format, lang, defaultFormat) => {
if (isArray$1(value)) return value.map((v) => correctlyParseUserInput(v, format, lang, defaultFormat));
if (isString(value)) {
const dayjsValue = defaultFormat?.value ? (0, import_dayjs_min.default)(value) : (0, import_dayjs_min.default)(value, format);
if (!dayjsValue.isValid()) return dayjsValue;
}
return (0, import_dayjs_min.default)(value, format).locale(lang);
};
//#endregion
//#region ../../packages/components/date-picker-panel/src/props/basic-date-table.ts
const basicDateTableProps = buildProps({
...datePickerSharedProps,
showWeekNumber: Boolean,
selectionMode: selectionModeWithDefault("date")
});
const basicDateTableEmits = [
"changerange",
"pick",
"select"
];
//#endregion
//#region ../../packages/components/date-picker-panel/src/composables/use-basic-date-table.ts
const isNormalDay = (type = "") => {
return ["normal", "today"].includes(type);
};
const useBasicDateTable = (props, emit) => {
const { lang } = useLocale();
const tbodyRef = (0, vue.ref)();
const currentCellRef = (0, vue.ref)();
const lastRow = (0, vue.ref)();
const lastColumn = (0, vue.ref)();
const tableRows = (0, vue.ref)([
[],
[],
[],
[],
[],
[]
]);
let focusWithClick = false;
const firstDayOfWeek = props.date.$locale().weekStart || 7;
const WEEKS_CONSTANT = props.date.locale("en").localeData().weekdaysShort().map((_) => _.toLowerCase());
const offsetDay = (0, vue.computed)(() => {
return firstDayOfWeek > 3 ? 7 - firstDayOfWeek : -firstDayOfWeek;
});
const startDate = (0, vue.computed)(() => {
const startDayOfMonth = props.date.startOf("month");
return startDayOfMonth.subtract(startDayOfMonth.day() || 7, "day");
});
const WEEKS = (0, vue.computed)(() => {
return WEEKS_CONSTANT.concat(WEEKS_CONSTANT).slice(firstDayOfWeek, firstDayOfWeek + 7);
});
const hasCurrent = (0, vue.computed)(() => {
return flatten((0, vue.unref)(rows)).some((row) => {
return row.isCurrent;
});
});
const days = (0, vue.computed)(() => {
const startOfMonth = props.date.startOf("month");
return {
startOfMonthDay: startOfMonth.day() || 7,
dateCountOfMonth: startOfMonth.daysInMonth(),
dateCountOfLastMonth: startOfMonth.subtract(1, "month").daysInMonth()
};
});
const selectedDate = (0, vue.computed)(() => {
return props.selectionMode === "dates" ? castArray(props.parsedValue) : [];
});
const setDateText = (cell, { count, rowIndex, columnIndex }) => {
const { startOfMonthDay, dateCountOfMonth, dateCountOfLastMonth } = (0, vue.unref)(days);
const offset = (0, vue.unref)(offsetDay);
if (rowIndex >= 0 && rowIndex <= 1) {
const numberOfDaysFromPreviousMonth = startOfMonthDay + offset < 0 ? 7 + startOfMonthDay + offset : startOfMonthDay + offset;
if (columnIndex + rowIndex * 7 >= numberOfDaysFromPreviousMonth) {
cell.text = count;
return true;
} else {
cell.text = dateCountOfLastMonth - (numberOfDaysFromPreviousMonth - columnIndex % 7) + 1 + rowIndex * 7;
cell.type = "prev-month";
}
} else {
if (count <= dateCountOfMonth) cell.text = count;
else {
cell.text = count - dateCountOfMonth;
cell.type = "next-month";
}
return true;
}
return false;
};
const setCellMetadata = (cell, { columnIndex, rowIndex }, count) => {
const { disabledDate, cellClassName } = props;
const _selectedDate = (0, vue.unref)(selectedDate);
const shouldIncrement = setDateText(cell, {
count,
rowIndex,
columnIndex
});
const cellDate = cell.dayjs.toDate();
cell.selected = _selectedDate.find((d) => d.isSame(cell.dayjs, "day"));
cell.isSelected = !!cell.selected;
cell.isCurrent = isCurrent(cell);
cell.disabled = disabledDate?.(cellDate);
cell.customClass = cellClassName?.(cellDate);
return shouldIncrement;
};
const setRowMetadata = (row) => {
if (props.selectionMode === "week") {
const [start, end] = props.showWeekNumber ? [1, 7] : [0, 6];
const isActive = isWeekActive(row[start + 1]);
row[start].inRange = isActive;
row[start].start = isActive;
row[end].inRange = isActive;
row[end].end = isActive;
}
};
const rows = (0, vue.computed)(() => {
const { minDate, maxDate, rangeState, showWeekNumber } = props;
const offset = (0, vue.unref)(offsetDay);
const rows_ = (0, vue.unref)(tableRows);
const dateUnit = "day";
let count = 1;
buildPickerTable({
row: 6,
column: 7
}, rows_, {
startDate: minDate,
columnIndexOffset: showWeekNumber ? 1 : 0,
nextEndDate: rangeState.endDate || maxDate || rangeState.selecting && minDate || null,
now: (0, import_dayjs_min.default)().locale((0, vue.unref)(lang)).startOf(dateUnit),
unit: dateUnit,
relativeDateGetter: (idx) => (0, vue.unref)(startDate).add(idx - offset, dateUnit),
setCellMetadata: (...args) => {
if (setCellMetadata(...args, count)) count += 1;
},
setRowMetadata
});
if (showWeekNumber) {
for (let rowIndex = 0; rowIndex < 6; rowIndex++) if (rows_[rowIndex][1].dayjs) rows_[rowIndex][0] = {
type: "week",
text: rows_[rowIndex][1].dayjs.week()
};
}
return rows_;
});
(0, vue.watch)(() => props.date, async () => {
if ((0, vue.unref)(tbodyRef)?.contains(document.activeElement)) {
await (0, vue.nextTick)();
await focus();
}
});
const focus = async () => (0, vue.unref)(currentCellRef)?.focus();
const isCurrent = (cell) => {
return props.selectionMode === "date" && isNormalDay(cell.type) && cellMatchesDate(cell, props.parsedValue);
};
const cellMatchesDate = (cell, date) => {
if (!date) return false;
return (0, import_dayjs_min.default)(date).locale((0, vue.unref)(lang)).isSame(props.date.date(Number(cell.text)), "day");
};
const getDateOfCell = (row, column) => {
const startOfMonthDay = (0, vue.unref)(days).startOfMonthDay;
const offset = (0, vue.unref)(offsetDay);
const numberOfDaysFromPreviousMonth = startOfMonthDay + offset < 0 ? 7 + startOfMonthDay + offset : startOfMonthDay + offset;
const offsetFromStart = row * 7 + (column - (props.showWeekNumber ? 1 : 0));
return props.date.startOf("month").subtract(numberOfDaysFromPreviousMonth, "day").add(offsetFromStart, "day");
};
const handleMouseMove = (event) => {
if (!props.rangeState.selecting) return;
let target = event.target;
if (target.tagName === "SPAN") target = target.parentNode?.parentNode;
if (target.tagName === "DIV") target = target.parentNode;
if (target.tagName !== "TD") return;
const row = target.parentNode.rowIndex - 1;
const column = target.cellIndex;
if ((0, vue.unref)(rows)[row][column].disabled) return;
if (row !== (0, vue.unref)(lastRow) || column !== (0, vue.unref)(lastColumn)) {
lastRow.value = row;
lastColumn.value = column;
emit("changerange", {
selecting: true,
endDate: getDateOfCell(row, column)
});
}
};
const isSelectedCell = (cell) => {
return !(0, vue.unref)(hasCurrent) && cell?.text === 1 && isNormalDay(cell.type) || cell.isCurrent;
};
const handleFocus = (event) => {
if (focusWithClick || (0, vue.unref)(hasCurrent) || props.selectionMode !== "date") return;
handlePickDate(event, true);
};
const handleMouseDown = (event) => {
if (!event.target.closest("td")) return;
focusWithClick = true;
};
const handleMouseUp = (event) => {
if (!event.target.closest("td")) return;
focusWithClick = false;
};
const handleRangePick = (newDate) => {
if (!props.rangeState.selecting || !props.minDate) {
emit("pick", {
minDate: newDate,
maxDate: null
});
emit("select", true);
} else {
if (newDate >= props.minDate) emit("pick", {
minDate: props.minDate,
maxDate: newDate
});
else emit("pick", {
minDate: newDate,
maxDate: props.minDate
});
emit("select", false);
}
};
const handleWeekPick = (newDate) => {
const weekNumber = newDate.week();
const value = `${newDate.year()}w${weekNumber}`;
emit("pick", {
year: newDate.year(),
week: weekNumber,
value,
date: newDate.startOf("week")
});
};
const handleDatesPick = (newDate, selected) => {
emit("pick", selected ? castArray(props.parsedValue).filter((d) => d?.valueOf() !== newDate.valueOf()) : castArray(props.parsedValue).concat([newDate]));
};
const handlePickDate = (event, isKeyboardMovement = false) => {
if (props.disabled) return;
const target = event.target.closest("td");
if (!target) return;
const row = target.parentNode.rowIndex - 1;
const column = target.cellIndex;
const cell = (0, vue.unref)(rows)[row][column];
if (cell.disabled || cell.type === "week") return;
const newDate = getDateOfCell(row, column);
switch (props.selectionMode) {
case "range":
handleRangePick(newDate);
break;
case "date":
emit("pick", newDate, isKeyboardMovement);
break;
case "week":
handleWeekPick(newDate);
break;
case "dates":
handleDatesPick(newDate, !!cell.selected);
break;
default: break;
}
};
const isWeekActive = (cell) => {
if (props.selectionMode !== "week") return false;
let newDate = props.date.startOf("day");
if (cell.type === "prev-month") newDate = newDate.subtract(1, "month");
if (cell.type === "next-month") newDate = newDate.add(1, "month");
newDate = newDate.date(Number.parseInt(cell.text, 10));
if (props.parsedValue && !isArray$1(props.parsedValue)) {
const dayOffset = (props.parsedValue.day() - firstDayOfWeek + 7) % 7 - 1;
return props.parsedValue.subtract(dayOffset, "day").isSame(newDate, "day");
}
return false;
};
return {
WEEKS,
rows,
tbodyRef,
currentCellRef,
focus,
isCurrent,
isWeekActive,
isSelectedCell,
handlePickDate,
handleMouseUp,
handleMouseDown,
handleMouseMove,
handleFocus
};
};
const useBasicDateTableDOM = (props, { isCurrent, isWeekActive }) => {
const ns = useNamespace("date-table");
const { t } = useLocale();
const tableKls = (0, vue.computed)(() => [ns.b(), ns.is("week-mode", props.selectionMode === "week" && !props.disabled)]);
const tableLabel = (0, vue.computed)(() => t("el.datepicker.dateTablePrompt"));
const getCellClasses = (cell) => {
const classes = [];
if (isNormalDay(cell.type) && !cell.disabled) {
classes.push("available");
if (cell.type === "today") classes.push("today");
} else classes.push(cell.type);
if (isCurrent(cell)) classes.push("current");
if (cell.inRange && (isNormalDay(cell.type) || props.selectionMode === "week")) {
classes.push("in-range");
if (cell.start) classes.push("start-date");
if (cell.end) classes.push("end-date");
}
if (cell.disabled || props.disabled) classes.push("disabled");
if (cell.selected) classes.push("selected");
if (cell.customClass) classes.push(cell.customClass);
return classes.join(" ");
};
const getRowKls = (cell) => [ns.e("row"), { current: isWeekActive(cell) }];
return {
tableKls,
tableLabel,
weekHeaderClass: ns.e("week-header"),
getCellClasses,
getRowKls,
t
};
};
//#endregion
//#region ../../packages/components/date-picker-panel/src/props/basic-cell.ts
const basicCellProps = buildProps({ cell: { type: definePropType(Object) } });
//#endregion
//#region ../../packages/components/date-picker-panel/src/date-picker-com/basic-cell-render.tsx
var basic_cell_render_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElDatePickerCell",
props: basicCellProps,
setup(props) {
const ns = useNamespace("date-table-cell");
const { slots } = (0, vue.inject)(ROOT_PICKER_INJECTION_KEY);
return () => {
const { cell } = props;
return (0, vue.renderSlot)(slots, "default", { ...cell }, () => [(0, vue.createVNode)("div", { "class": ns.b() }, [(0, vue.createVNode)("span", { "class": ns.e("text") }, [cell?.renderText ?? cell?.text])])]);
};
}
});
//#endregion
//#region ../../packages/components/date-picker-panel/src/date-picker-com/basic-date-table.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$50 = ["aria-label"];
const _hoisted_2$32 = ["aria-label"];
const _hoisted_3$15 = [
"aria-current",
"aria-selected",
"tabindex",
"aria-disabled"
];
var basic_date_table_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
__name: "basic-date-table",
props: basicDateTableProps,
emits: basicDateTableEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const { WEEKS, rows, tbodyRef, currentCellRef, focus, isCurrent, isWeekActive, isSelectedCell, handlePickDate, handleMouseUp, handleMouseDown, handleMouseMove, handleFocus } = useBasicDateTable(props, __emit);
const { tableLabel, tableKls, getCellClasses, getRowKls, weekHeaderClass, t } = useBasicDateTableDOM(props, {
isCurrent,
isWeekActive
});
let isUnmounting = false;
(0, vue.onBeforeUnmount)(() => {
isUnmounting = true;
});
__expose({ focus });
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("table", {
"aria-label": (0, vue.unref)(tableLabel),
class: (0, vue.normalizeClass)((0, vue.unref)(tableKls)),
cellspacing: "0",
cellpadding: "0",
role: "grid",
onClick: _cache[1] || (_cache[1] = (...args) => (0, vue.unref)(handlePickDate) && (0, vue.unref)(handlePickDate)(...args)),
onMousemove: _cache[2] || (_cache[2] = (...args) => (0, vue.unref)(handleMouseMove) && (0, vue.unref)(handleMouseMove)(...args)),
onMousedown: _cache[3] || (_cache[3] = (...args) => (0, vue.unref)(handleMouseDown) && (0, vue.unref)(handleMouseDown)(...args)),
onMouseup: _cache[4] || (_cache[4] = (...args) => (0, vue.unref)(handleMouseUp) && (0, vue.unref)(handleMouseUp)(...args))
}, [(0, vue.createElementVNode)("tbody", {
ref_key: "tbodyRef",
ref: tbodyRef
}, [(0, vue.createElementVNode)("tr", null, [_ctx.showWeekNumber ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("th", {
key: 0,
scope: "col",
class: (0, vue.normalizeClass)((0, vue.unref)(weekHeaderClass))
}, null, 2)) : (0, vue.createCommentVNode)("v-if", true), ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(WEEKS), (week, key) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("th", {
key,
"aria-label": (0, vue.unref)(t)("el.datepicker.weeksFull." + week),
scope: "col"
}, (0, vue.toDisplayString)((0, vue.unref)(t)("el.datepicker.weeks." + week)), 9, _hoisted_2$32);
}), 128))]), ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(rows), (row, rowKey) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("tr", {
key: rowKey,
class: (0, vue.normalizeClass)((0, vue.unref)(getRowKls)(_ctx.showWeekNumber ? row[2] : row[1]))
}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(row, (cell, columnKey) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("td", {
key: `${rowKey}.${columnKey}`,
ref_for: true,
ref: (el) => !(0, vue.unref)(isUnmounting) && (0, vue.unref)(isSelectedCell)(cell) && (currentCellRef.value = el),
class: (0, vue.normalizeClass)((0, vue.unref)(getCellClasses)(cell)),
"aria-current": cell.isCurrent ? "date" : void 0,
"aria-selected": cell.isCurrent,
tabindex: _ctx.disabled ? void 0 : (0, vue.unref)(isSelectedCell)(cell) ? 0 : -1,
"aria-disabled": _ctx.disabled,
onFocus: _cache[0] || (_cache[0] = (...args) => (0, vue.unref)(handleFocus) && (0, vue.unref)(handleFocus)(...args))
}, [(0, vue.createVNode)((0, vue.unref)(basic_cell_render_default), { cell }, null, 8, ["cell"])], 42, _hoisted_3$15);
}), 128))], 2);
}), 128))], 512)], 42, _hoisted_1$50);
};
}
});
//#endregion
//#region ../../packages/components/date-picker-panel/src/date-picker-com/basic-date-table.vue
var basic_date_table_default = basic_date_table_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/date-picker-panel/src/props/basic-month-table.ts
const basicMonthTableProps = buildProps({
...datePickerSharedProps,
selectionMode: selectionModeWithDefault("month")
});
//#endregion
//#region ../../packages/components/date-picker-panel/src/date-picker-com/basic-month-table.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$49 = ["aria-label"];
const _hoisted_2$31 = [
"aria-selected",
"aria-label",
"tabindex",
"onKeydown"
];
var basic_month_table_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
__name: "basic-month-table",
props: basicMonthTableProps,
emits: [
"changerange",
"pick",
"select"
],
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const ns = useNamespace("month-table");
const { t, lang } = useLocale();
const tbodyRef = (0, vue.ref)();
const currentCellRef = (0, vue.ref)();
const months = (0, vue.ref)(props.date.locale("en").localeData().monthsShort().map((_) => _.toLowerCase()));
const tableRows = (0, vue.ref)([
[],
[],
[]
]);
const lastRow = (0, vue.ref)();
const lastColumn = (0, vue.ref)();
const rows = (0, vue.computed)(() => {
const rows = tableRows.value;
const now = (0, import_dayjs_min.default)().locale(lang.value).startOf("month");
for (let i = 0; i < 3; i++) {
const row = rows[i];
for (let j = 0; j < 4; j++) {
const cell = row[j] ||= {
row: i,
column: j,
type: "normal",
inRange: false,
start: false,
end: false,
text: -1,
disabled: false,
isSelected: false,
customClass: void 0,
date: void 0,
dayjs: void 0,
isCurrent: void 0,
selected: void 0,
renderText: void 0,
timestamp: void 0
};
cell.type = "normal";
const index = i * 4 + j;
const calTime = props.date.startOf("year").month(index);
const calEndDate = props.rangeState.endDate || props.maxDate || props.rangeState.selecting && props.minDate || null;
cell.inRange = !!(props.minDate && calTime.isSameOrAfter(props.minDate, "month") && calEndDate && calTime.isSameOrBefore(calEndDate, "month")) || !!(props.minDate && calTime.isSameOrBefore(props.minDate, "month") && calEndDate && calTime.isSameOrAfter(calEndDate, "month"));
if (props.minDate?.isSameOrAfter(calEndDate)) {
cell.start = !!(calEndDate && calTime.isSame(calEndDate, "month"));
cell.end = props.minDate && calTime.isSame(props.minDate, "month");
} else {
cell.start = !!(props.minDate && calTime.isSame(props.minDate, "month"));
cell.end = !!(calEndDate && calTime.isSame(calEndDate, "month"));
}
if (now.isSame(calTime)) cell.type = "today";
const cellDate = calTime.toDate();
cell.text = index;
cell.disabled = props.disabledDate?.(cellDate) || false;
cell.date = cellDate;
cell.customClass = props.cellClassName?.(cellDate);
cell.dayjs = calTime;
cell.timestamp = calTime.valueOf();
cell.isSelected = isSelectedCell(cell);
}
}
return rows;
});
const focus = () => {
currentCellRef.value?.focus();
};
const getCellStyle = (cell) => {
const style = {};
const year = props.date.year();
const today = /* @__PURE__ */ new Date();
const month = cell.text;
style.disabled = props.disabled || (props.disabledDate ? datesInMonth(props.date, year, month, lang.value).every(props.disabledDate) : false);
style.current = castArray(props.parsedValue).some((date) => import_dayjs_min.default.isDayjs(date) && date.year() === year && date.month() === month);
style.today = today.getFullYear() === year && today.getMonth() === month;
if (cell.customClass) style[cell.customClass] = true;
if (cell.inRange) {
style["in-range"] = true;
if (cell.start) style["start-date"] = true;
if (cell.end) style["end-date"] = true;
}
return style;
};
const isSelectedCell = (cell) => {
const year = props.date.year();
const month = cell.text;
return castArray(props.date).some((date) => date.year() === year && date.month() === month);
};
const handleMouseMove = (event) => {
if (!props.rangeState.selecting) return;
let target = event.target;
if (target.tagName === "SPAN") target = target.parentNode?.parentNode;
if (target.tagName === "DIV") target = target.parentNode;
if (target.tagName !== "TD") return;
const row = target.parentNode.rowIndex;
const column = target.cellIndex;
if (rows.value[row][column].disabled) return;
if (row !== lastRow.value || column !== lastColumn.value) {
lastRow.value = row;
lastColumn.value = column;
emit("changerange", {
selecting: true,
endDate: props.date.startOf("year").month(row * 4 + column)
});
}
};
const handleMonthTableClick = (event) => {
if (props.disabled) return;
const target = event.target?.closest("td");
if (target?.tagName !== "TD") return;
if (hasClass(target, "disabled")) return;
const column = target.cellIndex;
const month = target.parentNode.rowIndex * 4 + column;
const newDate = props.date.startOf("year").month(month);
if (props.selectionMode === "months") {
if (event.type === "keydown") {
emit("pick", castArray(props.parsedValue), false);
return;
}
const newMonth = getValidDateOfMonth(props.date, props.date.year(), month, lang.value, props.disabledDate);
emit("pick", hasClass(target, "current") ? castArray(props.parsedValue).filter((d) => d?.year() !== newMonth.year() || d?.month() !== newMonth.month()) : castArray(props.parsedValue).concat([(0, import_dayjs_min.default)(newMonth)]));
} else if (props.selectionMode === "range") if (!props.rangeState.selecting) {
emit("pick", {
minDate: newDate,
maxDate: null
});
emit("select", true);
} else {
if (props.minDate && newDate >= props.minDate) emit("pick", {
minDate: props.minDate,
maxDate: newDate
});
else emit("pick", {
minDate: newDate,
maxDate: props.minDate
});
emit("select", false);
}
else emit("pick", month);
};
(0, vue.watch)(() => props.date, async () => {
if (tbodyRef.value?.contains(document.activeElement)) {
await (0, vue.nextTick)();
currentCellRef.value?.focus();
}
});
__expose({ focus });
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("table", {
role: "grid",
"aria-label": (0, vue.unref)(t)("el.datepicker.monthTablePrompt"),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()),
onClick: handleMonthTableClick,
onMousemove: handleMouseMove
}, [(0, vue.createElementVNode)("tbody", {
ref_key: "tbodyRef",
ref: tbodyRef
}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(rows.value, (row, key) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("tr", { key }, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(row, (cell, key_) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("td", {
key: key_,
ref_for: true,
ref: (el) => cell.isSelected && (currentCellRef.value = el),
class: (0, vue.normalizeClass)(getCellStyle(cell)),
"aria-selected": !!cell.isSelected,
"aria-label": (0, vue.unref)(t)(`el.datepicker.month${+cell.text + 1}`),
tabindex: cell.isSelected ? 0 : -1,
onKeydown: [(0, vue.withKeys)((0, vue.withModifiers)(handleMonthTableClick, ["prevent", "stop"]), ["space"]), (0, vue.withKeys)((0, vue.withModifiers)(handleMonthTableClick, ["prevent", "stop"]), ["enter"])]
}, [(0, vue.createVNode)((0, vue.unref)(basic_cell_render_default), { cell: {
...cell,
renderText: (0, vue.unref)(t)("el.datepicker.months." + months.value[cell.text])
} }, null, 8, ["cell"])], 42, _hoisted_2$31);
}), 128))]);
}), 128))], 512)], 42, _hoisted_1$49);
};
}
});
//#endregion
//#region ../../packages/components/date-picker-panel/src/date-picker-com/basic-month-table.vue
var basic_month_table_default = basic_month_table_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/date-picker-panel/src/props/basic-year-table.ts
const basicYearTableProps = buildProps({
...datePickerSharedProps,
selectionMode: selectionModeWithDefault("year")
});
//#endregion
//#region ../../packages/components/date-picker-panel/src/date-picker-com/basic-year-table.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$48 = ["aria-label"];
const _hoisted_2$30 = [
"aria-selected",
"aria-label",
"tabindex",
"onKeydown"
];
var basic_year_table_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
__name: "basic-year-table",
props: basicYearTableProps,
emits: [
"changerange",
"pick",
"select"
],
setup(__props, { expose: __expose, emit: __emit }) {
const datesInYear = (year, lang) => {
const firstDay = (0, import_dayjs_min.default)(String(year)).locale(lang).startOf("year");
return rangeArr(firstDay.endOf("year").dayOfYear()).map((n) => firstDay.add(n, "day").toDate());
};
const props = __props;
const emit = __emit;
const ns = useNamespace("year-table");
const { t, lang } = useLocale();
const tbodyRef = (0, vue.ref)();
const currentCellRef = (0, vue.ref)();
const startYear = (0, vue.computed)(() => {
return Math.floor(props.date.year() / 10) * 10;
});
const tableRows = (0, vue.ref)([
[],
[],
[]
]);
const lastRow = (0, vue.ref)();
const lastColumn = (0, vue.ref)();
const rows = (0, vue.computed)(() => {
const rows = tableRows.value;
const now = (0, import_dayjs_min.default)().locale(lang.value).startOf("year");
for (let i = 0; i < 3; i++) {
const row = rows[i];
for (let j = 0; j < 4; j++) {
if (i * 4 + j >= 10) break;
let cell = row[j];
if (!cell) cell = {
row: i,
column: j,
type: "normal",
inRange: false,
start: false,
end: false,
text: -1,
disabled: false,
isSelected: false,
customClass: void 0,
date: void 0,
dayjs: void 0,
isCurrent: void 0,
selected: void 0,
renderText: void 0,
timestamp: void 0
};
cell.type = "normal";
const index = i * 4 + j + startYear.value;
const calTime = (0, import_dayjs_min.default)().year(index);
const calEndDate = props.rangeState.endDate || props.maxDate || props.rangeState.selecting && props.minDate || null;
cell.inRange = !!(props.minDate && calTime.isSameOrAfter(props.minDate, "year") && calEndDate && calTime.isSameOrBefore(calEndDate, "year")) || !!(props.minDate && calTime.isSameOrBefore(props.minDate, "year") && calEndDate && calTime.isSameOrAfter(calEndDate, "year"));
if (props.minDate?.isSameOrAfter(calEndDate)) {
cell.start = !!(calEndDate && calTime.isSame(calEndDate, "year"));
cell.end = !!(props.minDate && calTime.isSame(props.minDate, "year"));
} else {
cell.start = !!(props.minDate && calTime.isSame(props.minDate, "year"));
cell.end = !!(calEndDate && calTime.isSame(calEndDate, "year"));
}
if (now.isSame(calTime)) cell.type = "today";
cell.text = index;
const cellDate = calTime.toDate();
cell.disabled = props.disabledDate?.(cellDate) || false;
cell.date = cellDate;
cell.customClass = props.cellClassName?.(cellDate);
cell.dayjs = calTime;
cell.timestamp = calTime.valueOf();
cell.isSelected = isSelectedCell(cell);
row[j] = cell;
}
}
return rows;
});
const focus = () => {
currentCellRef.value?.focus();
};
const getCellKls = (cell) => {
const kls = {};
const today = (0, import_dayjs_min.default)().locale(lang.value);
const year = cell.text;
kls.disabled = props.disabled || (props.disabledDate ? datesInYear(year, lang.value).every(props.disabledDate) : false);
kls.today = today.year() === year;
kls.current = castArray(props.parsedValue).some((d) => d.year() === year);
if (cell.customClass) kls[cell.customClass] = true;
if (cell.inRange) {
kls["in-range"] = true;
if (cell.start) kls["start-date"] = true;
if (cell.end) kls["end-date"] = true;
}
return kls;
};
const isSelectedCell = (cell) => {
const year = cell.text;
return castArray(props.date).some((date) => date.year() === year);
};
const handleYearTableClick = (event) => {
if (props.disabled) return;
const target = event.target?.closest("td");
if (!target || !target.textContent || hasClass(target, "disabled")) return;
const column = target.cellIndex;
const selectedYear = target.parentNode.rowIndex * 4 + column + startYear.value;
const newDate = (0, import_dayjs_min.default)().year(selectedYear);
if (props.selectionMode === "range") if (!props.rangeState.selecting) {
emit("pick", {
minDate: newDate,
maxDate: null
});
emit("select", true);
} else {
if (props.minDate && newDate >= props.minDate) emit("pick", {
minDate: props.minDate,
maxDate: newDate
});
else emit("pick", {
minDate: newDate,
maxDate: props.minDate
});
emit("select", false);
}
else if (props.selectionMode === "years") {
if (event.type === "keydown") {
emit("pick", castArray(props.parsedValue), false);
return;
}
const vaildYear = getValidDateOfYear(newDate.startOf("year"), lang.value, props.disabledDate);
emit("pick", hasClass(target, "current") ? castArray(props.parsedValue).filter((d) => d?.year() !== selectedYear) : castArray(props.parsedValue).concat([vaildYear]));
} else emit("pick", selectedYear);
};
const handleMouseMove = (event) => {
if (!props.rangeState.selecting) return;
const target = event.target?.closest("td");
if (!target) return;
const row = target.parentNode.rowIndex;
const column = target.cellIndex;
if (rows.value[row][column].disabled) return;
if (row !== lastRow.value || column !== lastColumn.value) {
lastRow.value = row;
lastColumn.value = column;
emit("changerange", {
selecting: true,
endDate: (0, import_dayjs_min.default)().year(startYear.value).add(row * 4 + column, "year")
});
}
};
(0, vue.watch)(() => props.date, async () => {
if (tbodyRef.value?.contains(document.activeElement)) {
await (0, vue.nextTick)();
currentCellRef.value?.focus();
}
});
__expose({ focus });
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("table", {
role: "grid",
"aria-label": (0, vue.unref)(t)("el.datepicker.yearTablePrompt"),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()),
onClick: handleYearTableClick,
onMousemove: handleMouseMove
}, [(0, vue.createElementVNode)("tbody", {
ref_key: "tbodyRef",
ref: tbodyRef
}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(rows.value, (row, rowKey) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("tr", { key: rowKey }, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(row, (cell, cellKey) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("td", {
key: `${rowKey}_${cellKey}`,
ref_for: true,
ref: (el) => cell.isSelected && (currentCellRef.value = el),
class: (0, vue.normalizeClass)(["available", getCellKls(cell)]),
"aria-selected": cell.isSelected,
"aria-label": String(cell.text),
tabindex: cell.isSelected ? 0 : -1,
onKeydown: [(0, vue.withKeys)((0, vue.withModifiers)(handleYearTableClick, ["prevent", "stop"]), ["space"]), (0, vue.withKeys)((0, vue.withModifiers)(handleYearTableClick, ["prevent", "stop"]), ["enter"])]
}, [(0, vue.createVNode)((0, vue.unref)(basic_cell_render_default), { cell }, null, 8, ["cell"])], 42, _hoisted_2$30);
}), 128))]);
}), 128))], 512)], 42, _hoisted_1$48);
};
}
});
//#endregion
//#region ../../packages/components/date-picker-panel/src/date-picker-com/basic-year-table.vue
var basic_year_table_default = basic_year_table_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/date-picker-panel/src/date-picker-com/panel-date-pick.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$47 = ["disabled", "onClick"];
const _hoisted_2$29 = ["aria-label", "disabled"];
const _hoisted_3$14 = ["aria-label", "disabled"];
const _hoisted_4$11 = ["tabindex", "aria-disabled"];
const _hoisted_5$8 = ["tabindex", "aria-disabled"];
const _hoisted_6$3 = ["aria-label", "disabled"];
const _hoisted_7$2 = ["aria-label", "disabled"];
var panel_date_pick_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
__name: "panel-date-pick",
props: panelDatePickProps,
emits: [
"pick",
"set-picker-option",
"panel-change"
],
setup(__props, { emit: __emit }) {
const timeWithinRange = (_, __, ___) => true;
const props = __props;
const contextEmit = __emit;
const ppNs = useNamespace("picker-panel");
const dpNs = useNamespace("date-picker");
const attrs = (0, vue.useAttrs)();
const slots = (0, vue.useSlots)();
const { t, lang } = useLocale();
const pickerBase = (0, vue.inject)(PICKER_BASE_INJECTION_KEY);
const isDefaultFormat = (0, vue.inject)(ROOT_PICKER_IS_DEFAULT_FORMAT_INJECTION_KEY, void 0);
const { shortcuts, disabledDate, cellClassName, defaultTime } = pickerBase.props;
const defaultValue = (0, vue.toRef)(pickerBase.props, "defaultValue");
const currentViewRef = (0, vue.ref)();
const innerDate = (0, vue.ref)((0, import_dayjs_min.default)().locale(lang.value));
const isChangeToNow = (0, vue.ref)(false);
let isShortcut = false;
const defaultTimeD = (0, vue.computed)(() => {
return (0, import_dayjs_min.default)(defaultTime).locale(lang.value);
});
const month = (0, vue.computed)(() => {
return innerDate.value.month();
});
const year = (0, vue.computed)(() => {
return innerDate.value.year();
});
const selectableRange = (0, vue.ref)([]);
const userInputDate = (0, vue.ref)(null);
const userInputTime = (0, vue.ref)(null);
const checkDateWithinRange = (date) => {
return selectableRange.value.length > 0 ? timeWithinRange(date, selectableRange.value, props.format || DEFAULT_FORMATS_TIME) : true;
};
const formatEmit = (emitDayjs) => {
if (defaultTime && !visibleTime.value && !isChangeToNow.value && !isShortcut) return defaultTimeD.value.year(emitDayjs.year()).month(emitDayjs.month()).date(emitDayjs.date());
if (showTime.value) return emitDayjs.millisecond(0);
return emitDayjs.startOf("day");
};
const emit = (value, ...args) => {
if (!value) contextEmit("pick", value, ...args);
else if (isArray$1(value)) contextEmit("pick", value.map(formatEmit), ...args);
else contextEmit("pick", formatEmit(value), ...args);
userInputDate.value = null;
userInputTime.value = null;
isChangeToNow.value = false;
isShortcut = false;
};
const handleDatePick = async (value, keepOpen) => {
if (selectionMode.value === "date" && import_dayjs_min.default.isDayjs(value)) {
const parsedDateValue = extractFirst(props.parsedValue);
let newDate = parsedDateValue ? parsedDateValue.year(value.year()).month(value.month()).date(value.date()) : value;
if (!checkDateWithinRange(newDate)) newDate = selectableRange.value[0][0].year(value.year()).month(value.month()).date(value.date());
innerDate.value = newDate;
emit(newDate, showTime.value || keepOpen);
} else if (selectionMode.value === "week") emit(value.date);
else if (selectionMode.value === "dates") emit(value, true);
};
const moveByMonth = (forward) => {
const action = forward ? "add" : "subtract";
innerDate.value = innerDate.value[action](1, "month");
handlePanelChange("month");
};
const moveByYear = (forward) => {
const currentDate = innerDate.value;
const action = forward ? "add" : "subtract";
innerDate.value = currentView.value === "year" ? currentDate[action](10, "year") : currentDate[action](1, "year");
handlePanelChange("year");
};
const currentView = (0, vue.ref)("date");
const yearLabel = (0, vue.computed)(() => {
const yearTranslation = t("el.datepicker.year");
if (currentView.value === "year") {
const startYear = Math.floor(year.value / 10) * 10;
if (yearTranslation) return `${startYear} ${yearTranslation} - ${startYear + 9} ${yearTranslation}`;
return `${startYear} - ${startYear + 9}`;
}
return `${year.value} ${yearTranslation}`;
});
const handleShortcutClick = (shortcut) => {
const shortcutValue = isFunction$1(shortcut.value) ? shortcut.value() : shortcut.value;
if (shortcutValue) {
isShortcut = true;
emit((0, import_dayjs_min.default)(shortcutValue).locale(lang.value));
return;
}
if (shortcut.onClick) shortcut.onClick({
attrs,
slots,
emit: contextEmit
});
};
const selectionMode = (0, vue.computed)(() => {
const { type } = props;
if ([
"week",
"month",
"months",
"year",
"years",
"dates"
].includes(type)) return type;
return "date";
});
const isMultipleType = (0, vue.computed)(() => {
return selectionMode.value === "dates" || selectionMode.value === "months" || selectionMode.value === "years";
});
const keyboardMode = (0, vue.computed)(() => {
return selectionMode.value === "date" ? currentView.value : selectionMode.value;
});
const hasShortcuts = (0, vue.computed)(() => !!shortcuts.length);
const handleMonthPick = async (month, keepOpen) => {
if (selectionMode.value === "month") {
innerDate.value = getValidDateOfMonth(innerDate.value, innerDate.value.year(), month, lang.value, disabledDate);
emit(innerDate.value, false);
} else if (selectionMode.value === "months") emit(month, keepOpen ?? true);
else {
innerDate.value = getValidDateOfMonth(innerDate.value, innerDate.value.year(), month, lang.value, disabledDate);
currentView.value = "date";
if ([
"month",
"year",
"date",
"week"
].includes(selectionMode.value)) {
emit(innerDate.value, true);
await (0, vue.nextTick)();
handleFocusPicker();
}
}
handlePanelChange("month");
};
const handleYearPick = async (year, keepOpen) => {
if (selectionMode.value === "year") {
innerDate.value = getValidDateOfYear(innerDate.value.startOf("year").year(year), lang.value, disabledDate);
emit(innerDate.value, false);
} else if (selectionMode.value === "years") emit(year, keepOpen ?? true);
else {
innerDate.value = getValidDateOfYear(innerDate.value.year(year), lang.value, disabledDate);
currentView.value = "month";
if ([
"month",
"year",
"date",
"week"
].includes(selectionMode.value)) {
emit(innerDate.value, true);
await (0, vue.nextTick)();
handleFocusPicker();
}
}
handlePanelChange("year");
};
const dateDisabled = useFormDisabled();
const showPicker = async (view) => {
if (dateDisabled.value) return;
currentView.value = view;
await (0, vue.nextTick)();
handleFocusPicker();
};
const showTime = (0, vue.computed)(() => props.type === "datetime" || props.type === "datetimerange");
const footerVisible = (0, vue.computed)(() => {
const showDateFooter = showTime.value || selectionMode.value === "dates";
const showYearFooter = selectionMode.value === "years";
const showMonthFooter = selectionMode.value === "months";
const isDateView = currentView.value === "date";
const isYearView = currentView.value === "year";
const isMonthView = currentView.value === "month";
return showDateFooter && isDateView || showYearFooter && isYearView || showMonthFooter && isMonthView;
});
const footerFilled = (0, vue.computed)(() => !isMultipleType.value && props.showNow || props.showConfirm);
const disabledConfirm = (0, vue.computed)(() => {
if (!disabledDate) return false;
if (!props.parsedValue) return true;
if (isArray$1(props.parsedValue)) return disabledDate(props.parsedValue[0].toDate());
return disabledDate(props.parsedValue.toDate());
});
const onConfirm = () => {
if (isMultipleType.value) emit(props.parsedValue);
else {
let result = extractFirst(props.parsedValue);
if (!result) {
const defaultTimeD = (0, import_dayjs_min.default)(defaultTime).locale(lang.value);
const defaultValueD = getDefaultValue();
result = defaultTimeD.year(defaultValueD.year()).month(defaultValueD.month()).date(defaultValueD.date());
}
innerDate.value = result;
emit(result);
}
};
const disabledNow = (0, vue.computed)(() => {
if (!disabledDate) return false;
return disabledDate((0, import_dayjs_min.default)().locale(lang.value).toDate());
});
const changeToNow = () => {
const nowDate = (0, import_dayjs_min.default)().locale(lang.value).toDate();
isChangeToNow.value = true;
if ((!disabledDate || !disabledDate(nowDate)) && checkDateWithinRange(nowDate)) {
innerDate.value = (0, import_dayjs_min.default)().locale(lang.value);
emit(innerDate.value);
}
};
const timeFormat = (0, vue.computed)(() => {
return props.timeFormat || extractTimeFormat(props.format) || DEFAULT_FORMATS_TIME;
});
const dateFormat = (0, vue.computed)(() => {
return props.dateFormat || extractDateFormat(props.format) || DEFAULT_FORMATS_DATE;
});
const visibleTime = (0, vue.computed)(() => {
if (userInputTime.value) return userInputTime.value;
if (!props.parsedValue && !defaultValue.value) return;
return (extractFirst(props.parsedValue) || innerDate.value).format(timeFormat.value);
});
const visibleDate = (0, vue.computed)(() => {
if (userInputDate.value) return userInputDate.value;
if (!props.parsedValue && !defaultValue.value) return;
return (extractFirst(props.parsedValue) || innerDate.value).format(dateFormat.value);
});
const timePickerVisible = (0, vue.ref)(false);
const onTimePickerInputFocus = () => {
timePickerVisible.value = true;
};
const handleTimePickClose = () => {
timePickerVisible.value = false;
};
const getUnits = (date) => {
return {
hour: date.hour(),
minute: date.minute(),
second: date.second(),
year: date.year(),
month: date.month(),
date: date.date()
};
};
const handleTimePick = (value, visible, first) => {
const { hour, minute, second } = getUnits(value);
const parsedDateValue = extractFirst(props.parsedValue);
innerDate.value = parsedDateValue ? parsedDateValue.hour(hour).minute(minute).second(second) : value;
emit(innerDate.value, true);
if (!first) timePickerVisible.value = visible;
};
const handleVisibleTimeChange = (value) => {
const newDate = (0, import_dayjs_min.default)(value, timeFormat.value).locale(lang.value);
if (newDate.isValid() && checkDateWithinRange(newDate)) {
const { year, month, date } = getUnits(innerDate.value);
innerDate.value = newDate.year(year).month(month).date(date);
userInputTime.value = null;
timePickerVisible.value = false;
emit(innerDate.value, true);
}
};
const handleVisibleDateChange = (value) => {
const newDate = correctlyParseUserInput(value, dateFormat.value, lang.value, isDefaultFormat);
if (newDate.isValid()) {
if (disabledDate && disabledDate(newDate.toDate())) return;
const { hour, minute, second } = getUnits(innerDate.value);
innerDate.value = newDate.hour(hour).minute(minute).second(second);
userInputDate.value = null;
emit(innerDate.value, true);
}
};
const isValidValue = (date) => {
return import_dayjs_min.default.isDayjs(date) && date.isValid() && (disabledDate ? !disabledDate(date.toDate()) : true);
};
const parseUserInput = (value) => {
return correctlyParseUserInput(value, props.format, lang.value, isDefaultFormat);
};
const getDefaultValue = () => {
const parseDate = (0, import_dayjs_min.default)(defaultValue.value).locale(lang.value);
if (!defaultValue.value) {
const defaultTimeDValue = defaultTimeD.value;
return (0, import_dayjs_min.default)().hour(defaultTimeDValue.hour()).minute(defaultTimeDValue.minute()).second(defaultTimeDValue.second()).locale(lang.value);
}
return parseDate;
};
const handleFocusPicker = () => {
if ([
"week",
"month",
"year",
"date"
].includes(selectionMode.value)) currentViewRef.value?.focus();
};
const _handleFocusPicker = () => {
handleFocusPicker();
if (selectionMode.value === "week") handleKeyControl(EVENT_CODE.down);
};
const handleKeydownTable = (event) => {
const code = getEventCode(event);
if ([
EVENT_CODE.up,
EVENT_CODE.down,
EVENT_CODE.left,
EVENT_CODE.right,
EVENT_CODE.home,
EVENT_CODE.end,
EVENT_CODE.pageUp,
EVENT_CODE.pageDown
].includes(code)) {
handleKeyControl(code);
event.stopPropagation();
event.preventDefault();
}
if ([
EVENT_CODE.enter,
EVENT_CODE.space,
EVENT_CODE.numpadEnter
].includes(code) && userInputDate.value === null && userInputTime.value === null) {
event.preventDefault();
emit(innerDate.value, false);
}
};
const handleKeyControl = (code) => {
const { up, down, left, right, home, end, pageUp, pageDown } = EVENT_CODE;
const mapping = {
year: {
[up]: -4,
[down]: 4,
[left]: -1,
[right]: 1,
offset: (date, step) => date.setFullYear(date.getFullYear() + step)
},
month: {
[up]: -4,
[down]: 4,
[left]: -1,
[right]: 1,
offset: (date, step) => date.setMonth(date.getMonth() + step)
},
week: {
[up]: -1,
[down]: 1,
[left]: -1,
[right]: 1,
offset: (date, step) => date.setDate(date.getDate() + step * 7)
},
date: {
[up]: -7,
[down]: 7,
[left]: -1,
[right]: 1,
[home]: (date) => -date.getDay(),
[end]: (date) => -date.getDay() + 6,
[pageUp]: (date) => -new Date(date.getFullYear(), date.getMonth(), 0).getDate(),
[pageDown]: (date) => new Date(date.getFullYear(), date.getMonth() + 1, 0).getDate(),
offset: (date, step) => date.setDate(date.getDate() + step)
}
};
const newDate = innerDate.value.toDate();
while (Math.abs(innerDate.value.diff(newDate, "year", true)) < 1) {
const map = mapping[keyboardMode.value];
if (!map) return;
map.offset(newDate, isFunction$1(map[code]) ? map[code](newDate) : map[code] ?? 0);
if (disabledDate && disabledDate(newDate)) break;
const result = (0, import_dayjs_min.default)(newDate).locale(lang.value);
innerDate.value = result;
contextEmit("pick", result, true);
break;
}
};
const handlePanelChange = (mode) => {
contextEmit("panel-change", innerDate.value.toDate(), mode, currentView.value);
};
(0, vue.watch)(() => selectionMode.value, (val) => {
if (["month", "year"].includes(val)) {
currentView.value = val;
return;
} else if (val === "years") {
currentView.value = "year";
return;
} else if (val === "months") {
currentView.value = "month";
return;
}
currentView.value = "date";
}, { immediate: true });
(0, vue.watch)(() => defaultValue.value, (val) => {
if (val) innerDate.value = getDefaultValue();
}, { immediate: true });
(0, vue.watch)(() => props.parsedValue, (val) => {
if (val) {
if (isMultipleType.value) return;
if (isArray$1(val)) return;
innerDate.value = val;
} else innerDate.value = getDefaultValue();
}, { immediate: true });
contextEmit("set-picker-option", ["isValidValue", isValidValue]);
contextEmit("set-picker-option", ["parseUserInput", parseUserInput]);
contextEmit("set-picker-option", ["handleFocusPicker", _handleFocusPicker]);
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)([
(0, vue.unref)(ppNs).b(),
(0, vue.unref)(dpNs).b(),
(0, vue.unref)(ppNs).is("border", _ctx.border),
(0, vue.unref)(ppNs).is("disabled", (0, vue.unref)(dateDisabled)),
{
"has-sidebar": _ctx.$slots.sidebar || hasShortcuts.value,
"has-time": showTime.value
}
]) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("body-wrapper")) }, [
(0, vue.renderSlot)(_ctx.$slots, "sidebar", { class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("sidebar")) }),
hasShortcuts.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("sidebar"))
}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(shortcuts), (shortcut, key) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key,
type: "button",
disabled: (0, vue.unref)(dateDisabled),
class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("shortcut")),
onClick: ($event) => handleShortcutClick(shortcut)
}, (0, vue.toDisplayString)(shortcut.text), 11, _hoisted_1$47);
}), 128))], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("body")) }, [
showTime.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(dpNs).e("time-header"))
}, [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(dpNs).e("editor-wrap")) }, [(0, vue.createVNode)((0, vue.unref)(ElInput), {
placeholder: (0, vue.unref)(t)("el.datepicker.selectDate"),
"model-value": visibleDate.value,
size: "small",
"validate-event": false,
disabled: (0, vue.unref)(dateDisabled),
readonly: !_ctx.editable,
onInput: _cache[0] || (_cache[0] = (val) => userInputDate.value = val),
onChange: handleVisibleDateChange
}, null, 8, [
"placeholder",
"model-value",
"disabled",
"readonly"
])], 2), (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(dpNs).e("editor-wrap")) }, [(0, vue.createVNode)((0, vue.unref)(ElInput), {
placeholder: (0, vue.unref)(t)("el.datepicker.selectTime"),
"model-value": visibleTime.value,
size: "small",
"validate-event": false,
disabled: (0, vue.unref)(dateDisabled),
readonly: !_ctx.editable,
onFocus: onTimePickerInputFocus,
onInput: _cache[1] || (_cache[1] = (val) => userInputTime.value = val),
onChange: handleVisibleTimeChange
}, null, 8, [
"placeholder",
"model-value",
"disabled",
"readonly"
]), (0, vue.createVNode)((0, vue.unref)(panel_time_pick_default), {
visible: timePickerVisible.value,
format: timeFormat.value,
"parsed-value": innerDate.value,
onPick: handleTimePick
}, null, 8, [
"visible",
"format",
"parsed-value"
])], 2)), [[(0, vue.unref)(ClickOutside), handleTimePickClose]])], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.withDirectives)((0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)([(0, vue.unref)(dpNs).e("header"), (currentView.value === "year" || currentView.value === "month") && (0, vue.unref)(dpNs).em("header", "bordered")]) }, [
(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(dpNs).e("prev-btn")) }, [(0, vue.createElementVNode)("button", {
type: "button",
"aria-label": (0, vue.unref)(t)(`el.datepicker.prevYear`),
class: (0, vue.normalizeClass)(["d-arrow-left", (0, vue.unref)(ppNs).e("icon-btn")]),
disabled: (0, vue.unref)(dateDisabled),
onClick: _cache[2] || (_cache[2] = ($event) => moveByYear(false))
}, [(0, vue.renderSlot)(_ctx.$slots, "prev-year", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(d_arrow_left_default))]),
_: 1
})])], 10, _hoisted_2$29), (0, vue.withDirectives)((0, vue.createElementVNode)("button", {
type: "button",
"aria-label": (0, vue.unref)(t)(`el.datepicker.prevMonth`),
class: (0, vue.normalizeClass)([(0, vue.unref)(ppNs).e("icon-btn"), "arrow-left"]),
disabled: (0, vue.unref)(dateDisabled),
onClick: _cache[3] || (_cache[3] = ($event) => moveByMonth(false))
}, [(0, vue.renderSlot)(_ctx.$slots, "prev-month", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(arrow_left_default))]),
_: 1
})])], 10, _hoisted_3$14), [[vue.vShow, currentView.value === "date"]])], 2),
(0, vue.createElementVNode)("span", {
role: "button",
class: (0, vue.normalizeClass)((0, vue.unref)(dpNs).e("header-label")),
"aria-live": "polite",
tabindex: _ctx.disabled ? void 0 : 0,
"aria-disabled": _ctx.disabled,
onKeydown: _cache[4] || (_cache[4] = (0, vue.withKeys)(($event) => showPicker("year"), ["enter"])),
onClick: _cache[5] || (_cache[5] = ($event) => showPicker("year"))
}, (0, vue.toDisplayString)(yearLabel.value), 43, _hoisted_4$11),
(0, vue.withDirectives)((0, vue.createElementVNode)("span", {
role: "button",
"aria-live": "polite",
tabindex: _ctx.disabled ? void 0 : 0,
"aria-disabled": _ctx.disabled,
class: (0, vue.normalizeClass)([(0, vue.unref)(dpNs).e("header-label"), { active: currentView.value === "month" }]),
onKeydown: _cache[6] || (_cache[6] = (0, vue.withKeys)(($event) => showPicker("month"), ["enter"])),
onClick: _cache[7] || (_cache[7] = ($event) => showPicker("month"))
}, (0, vue.toDisplayString)((0, vue.unref)(t)(`el.datepicker.month${month.value + 1}`)), 43, _hoisted_5$8), [[vue.vShow, currentView.value === "date"]]),
(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(dpNs).e("next-btn")) }, [(0, vue.withDirectives)((0, vue.createElementVNode)("button", {
type: "button",
"aria-label": (0, vue.unref)(t)(`el.datepicker.nextMonth`),
class: (0, vue.normalizeClass)([(0, vue.unref)(ppNs).e("icon-btn"), "arrow-right"]),
disabled: (0, vue.unref)(dateDisabled),
onClick: _cache[8] || (_cache[8] = ($event) => moveByMonth(true))
}, [(0, vue.renderSlot)(_ctx.$slots, "next-month", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(arrow_right_default))]),
_: 1
})])], 10, _hoisted_6$3), [[vue.vShow, currentView.value === "date"]]), (0, vue.createElementVNode)("button", {
type: "button",
"aria-label": (0, vue.unref)(t)(`el.datepicker.nextYear`),
class: (0, vue.normalizeClass)([(0, vue.unref)(ppNs).e("icon-btn"), "d-arrow-right"]),
disabled: (0, vue.unref)(dateDisabled),
onClick: _cache[9] || (_cache[9] = ($event) => moveByYear(true))
}, [(0, vue.renderSlot)(_ctx.$slots, "next-year", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(d_arrow_right_default))]),
_: 1
})])], 10, _hoisted_7$2)], 2)
], 2), [[vue.vShow, currentView.value !== "time"]]),
(0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("content")),
onKeydown: handleKeydownTable
}, [
currentView.value === "date" ? ((0, vue.openBlock)(), (0, vue.createBlock)(basic_date_table_default, {
key: 0,
ref_key: "currentViewRef",
ref: currentViewRef,
"selection-mode": selectionMode.value,
date: innerDate.value,
"parsed-value": _ctx.parsedValue,
"disabled-date": (0, vue.unref)(disabledDate),
disabled: (0, vue.unref)(dateDisabled),
"cell-class-name": (0, vue.unref)(cellClassName),
"show-week-number": _ctx.showWeekNumber,
onPick: handleDatePick
}, null, 8, [
"selection-mode",
"date",
"parsed-value",
"disabled-date",
"disabled",
"cell-class-name",
"show-week-number"
])) : (0, vue.createCommentVNode)("v-if", true),
currentView.value === "year" ? ((0, vue.openBlock)(), (0, vue.createBlock)(basic_year_table_default, {
key: 1,
ref_key: "currentViewRef",
ref: currentViewRef,
"selection-mode": selectionMode.value,
date: innerDate.value,
"disabled-date": (0, vue.unref)(disabledDate),
disabled: (0, vue.unref)(dateDisabled),
"parsed-value": _ctx.parsedValue,
"cell-class-name": (0, vue.unref)(cellClassName),
onPick: handleYearPick
}, null, 8, [
"selection-mode",
"date",
"disabled-date",
"disabled",
"parsed-value",
"cell-class-name"
])) : (0, vue.createCommentVNode)("v-if", true),
currentView.value === "month" ? ((0, vue.openBlock)(), (0, vue.createBlock)(basic_month_table_default, {
key: 2,
ref_key: "currentViewRef",
ref: currentViewRef,
"selection-mode": selectionMode.value,
date: innerDate.value,
"parsed-value": _ctx.parsedValue,
"disabled-date": (0, vue.unref)(disabledDate),
disabled: (0, vue.unref)(dateDisabled),
"cell-class-name": (0, vue.unref)(cellClassName),
onPick: handleMonthPick
}, null, 8, [
"selection-mode",
"date",
"parsed-value",
"disabled-date",
"disabled",
"cell-class-name"
])) : (0, vue.createCommentVNode)("v-if", true)
], 34)
], 2)
], 2), _ctx.showFooter && footerVisible.value && footerFilled.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("footer"))
}, [(0, vue.withDirectives)((0, vue.createVNode)((0, vue.unref)(ElButton), {
text: "",
size: "small",
class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("link-btn")),
disabled: disabledNow.value,
onClick: changeToNow
}, {
default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(t)("el.datepicker.now")), 1)]),
_: 1
}, 8, ["class", "disabled"]), [[vue.vShow, !isMultipleType.value && _ctx.showNow]]), _ctx.showConfirm ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElButton), {
key: 0,
plain: "",
size: "small",
class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("link-btn")),
disabled: disabledConfirm.value,
onClick: onConfirm
}, {
default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(t)("el.datepicker.confirm")), 1)]),
_: 1
}, 8, ["class", "disabled"])) : (0, vue.createCommentVNode)("v-if", true)], 2)) : (0, vue.createCommentVNode)("v-if", true)], 2);
};
}
});
//#endregion
//#region ../../packages/components/date-picker-panel/src/date-picker-com/panel-date-pick.vue
var panel_date_pick_default = panel_date_pick_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/date-picker-panel/src/props/panel-date-range.ts
const panelDateRangeProps = buildProps({
...panelSharedProps,
...panelRangeSharedProps
});
//#endregion
//#region ../../packages/components/date-picker-panel/src/composables/use-shortcut.ts
const useShortcut = (lang) => {
const { emit } = (0, vue.getCurrentInstance)();
const attrs = (0, vue.useAttrs)();
const slots = (0, vue.useSlots)();
const handleShortcutClick = (shortcut) => {
const shortcutValues = isFunction$1(shortcut.value) ? shortcut.value() : shortcut.value;
if (shortcutValues) {
emit("pick", [(0, import_dayjs_min.default)(shortcutValues[0]).locale(lang.value), (0, import_dayjs_min.default)(shortcutValues[1]).locale(lang.value)]);
return;
}
if (shortcut.onClick) shortcut.onClick({
attrs,
slots,
emit
});
};
return handleShortcutClick;
};
//#endregion
//#region ../../packages/components/date-picker-panel/src/composables/use-range-picker.ts
const useRangePicker = (props, { defaultValue, defaultTime, leftDate, rightDate, step, unit, sortDates }) => {
const { emit } = (0, vue.getCurrentInstance)();
const { pickerNs } = (0, vue.inject)(ROOT_PICKER_INJECTION_KEY);
const drpNs = useNamespace("date-range-picker");
const { t, lang } = useLocale();
const handleShortcutClick = useShortcut(lang);
const minDate = (0, vue.ref)();
const maxDate = (0, vue.ref)();
const rangeState = (0, vue.ref)({
endDate: null,
selecting: false
});
const handleChangeRange = (val) => {
rangeState.value = val;
};
const handleRangeConfirm = (visible = false) => {
const _minDate = (0, vue.unref)(minDate);
const _maxDate = (0, vue.unref)(maxDate);
if (isValidRange([_minDate, _maxDate])) emit("pick", [_minDate, _maxDate], visible);
};
const onSelect = (selecting) => {
rangeState.value.selecting = selecting;
if (!selecting) rangeState.value.endDate = null;
};
const parseValue = (parsedValue) => {
if (isArray$1(parsedValue) && parsedValue.length === 2) {
const [start, end] = parsedValue;
minDate.value = start;
leftDate.value = start;
maxDate.value = end;
sortDates((0, vue.unref)(minDate), (0, vue.unref)(maxDate));
} else restoreDefault();
};
const restoreDefault = () => {
let [start, end] = getDefaultValue((0, vue.unref)(defaultValue), {
lang: (0, vue.unref)(lang),
step,
unit,
unlinkPanels: props.unlinkPanels
});
const getShift = (day) => {
return day.diff(day.startOf("d"), "ms");
};
const maybeTimes = (0, vue.unref)(defaultTime);
if (maybeTimes) {
let leftShift = 0;
let rightShift = 0;
if (isArray$1(maybeTimes)) {
const [timeStart, timeEnd] = maybeTimes.map(import_dayjs_min.default);
leftShift = getShift(timeStart);
rightShift = getShift(timeEnd);
} else {
const shift = getShift((0, import_dayjs_min.default)(maybeTimes));
leftShift = shift;
rightShift = shift;
}
start = start.startOf("d").add(leftShift, "ms");
end = end.startOf("d").add(rightShift, "ms");
}
minDate.value = void 0;
maxDate.value = void 0;
leftDate.value = start;
rightDate.value = end;
};
(0, vue.watch)(defaultValue, (val) => {
if (val) restoreDefault();
}, { immediate: true });
(0, vue.watch)(() => props.parsedValue, (parsedValue) => {
if (!parsedValue?.length || !isEqual$1(parsedValue, [minDate.value, maxDate.value])) parseValue(parsedValue);
}, { immediate: true });
(0, vue.watch)(() => props.visible, () => {
if (props.visible) parseValue(props.parsedValue);
}, { immediate: true });
return {
minDate,
maxDate,
rangeState,
lang,
ppNs: pickerNs,
drpNs,
handleChangeRange,
handleRangeConfirm,
handleShortcutClick,
onSelect,
parseValue,
t
};
};
//#endregion
//#region ../../packages/components/date-picker-panel/src/composables/use-panel-date-range.ts
const usePanelDateRange = (props, emit, leftDate, rightDate) => {
const leftCurrentView = (0, vue.ref)("date");
const leftCurrentViewRef = (0, vue.ref)();
const rightCurrentView = (0, vue.ref)("date");
const rightCurrentViewRef = (0, vue.ref)();
const { disabledDate } = (0, vue.inject)(PICKER_BASE_INJECTION_KEY).props;
const { t, lang } = useLocale();
const leftYear = (0, vue.computed)(() => {
return leftDate.value.year();
});
const leftMonth = (0, vue.computed)(() => {
return leftDate.value.month();
});
const rightYear = (0, vue.computed)(() => {
return rightDate.value.year();
});
const rightMonth = (0, vue.computed)(() => {
return rightDate.value.month();
});
function computedYearLabel(currentView, yearValue) {
const yearTranslation = t("el.datepicker.year");
if (currentView.value === "year") {
const startYear = Math.floor(yearValue.value / 10) * 10;
return yearTranslation ? `${startYear} ${yearTranslation} - ${startYear + 9} ${yearTranslation}` : `${startYear} - ${startYear + 9}`;
}
return `${yearValue.value} ${yearTranslation}`;
}
function focusPicker(currentViewRef) {
currentViewRef?.focus();
}
async function showPicker(pickerType, view) {
if (props.disabled) return;
const currentView = pickerType === "left" ? leftCurrentView : rightCurrentView;
const currentViewRef = pickerType === "left" ? leftCurrentViewRef : rightCurrentViewRef;
currentView.value = view;
await (0, vue.nextTick)();
focusPicker(currentViewRef.value);
}
async function handlePick(mode, pickerType, value) {
if (props.disabled) return;
const isLeftPicker = pickerType === "left";
const startDate = isLeftPicker ? leftDate : rightDate;
const endDate = isLeftPicker ? rightDate : leftDate;
const currentView = isLeftPicker ? leftCurrentView : rightCurrentView;
const currentViewRef = isLeftPicker ? leftCurrentViewRef : rightCurrentViewRef;
if (mode === "year") startDate.value = getValidDateOfYear(startDate.value.year(value), lang.value, disabledDate);
if (mode === "month") startDate.value = getValidDateOfMonth(startDate.value, startDate.value.year(), value, lang.value, disabledDate);
if (!props.unlinkPanels) endDate.value = pickerType === "left" ? startDate.value.add(1, "month") : startDate.value.subtract(1, "month");
currentView.value = mode === "year" ? "month" : "date";
await (0, vue.nextTick)();
focusPicker(currentViewRef.value);
handlePanelChange(mode);
}
function handlePanelChange(mode) {
emit("panel-change", [leftDate.value.toDate(), rightDate.value.toDate()], mode);
}
function adjustDateByView(currentView, date, forward) {
const action = forward ? "add" : "subtract";
return currentView === "year" ? date[action](10, "year") : date[action](1, "year");
}
return {
leftCurrentView,
rightCurrentView,
leftCurrentViewRef,
rightCurrentViewRef,
leftYear,
rightYear,
leftMonth,
rightMonth,
leftYearLabel: (0, vue.computed)(() => computedYearLabel(leftCurrentView, leftYear)),
rightYearLabel: (0, vue.computed)(() => computedYearLabel(rightCurrentView, rightYear)),
showLeftPicker: (view) => showPicker("left", view),
showRightPicker: (view) => showPicker("right", view),
handleLeftYearPick: (year) => handlePick("year", "left", year),
handleRightYearPick: (year) => handlePick("year", "right", year),
handleLeftMonthPick: (month) => handlePick("month", "left", month),
handleRightMonthPick: (month) => handlePick("month", "right", month),
handlePanelChange,
adjustDateByView
};
};
//#endregion
//#region ../../packages/components/date-picker-panel/src/date-picker-com/panel-date-range.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$46 = ["disabled", "onClick"];
const _hoisted_2$28 = ["aria-label", "disabled"];
const _hoisted_3$13 = ["aria-label", "disabled"];
const _hoisted_4$10 = ["disabled", "aria-label"];
const _hoisted_5$7 = ["disabled", "aria-label"];
const _hoisted_6$2 = ["tabindex", "aria-disabled"];
const _hoisted_7$1 = ["tabindex", "aria-disabled"];
const _hoisted_8$1 = ["disabled", "aria-label"];
const _hoisted_9$1 = ["disabled", "aria-label"];
const _hoisted_10$1 = ["aria-label", "disabled"];
const _hoisted_11$1 = ["disabled", "aria-label"];
const _hoisted_12$1 = ["tabindex", "aria-disabled"];
const _hoisted_13$1 = ["tabindex", "aria-disabled"];
const unit$2 = "month";
var panel_date_range_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
__name: "panel-date-range",
props: panelDateRangeProps,
emits: [
"pick",
"set-picker-option",
"calendar-change",
"panel-change",
"clear"
],
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const pickerBase = (0, vue.inject)(PICKER_BASE_INJECTION_KEY);
const isDefaultFormat = (0, vue.inject)(ROOT_PICKER_IS_DEFAULT_FORMAT_INJECTION_KEY, void 0);
const { disabledDate, cellClassName, defaultTime, clearable } = pickerBase.props;
const format = (0, vue.toRef)(pickerBase.props, "format");
const shortcuts = (0, vue.toRef)(pickerBase.props, "shortcuts");
const defaultValue = (0, vue.toRef)(pickerBase.props, "defaultValue");
const { lang } = useLocale();
const leftDate = (0, vue.ref)((0, import_dayjs_min.default)().locale(lang.value));
const rightDate = (0, vue.ref)((0, import_dayjs_min.default)().locale(lang.value).add(1, unit$2));
const { minDate, maxDate, rangeState, ppNs, drpNs, handleChangeRange, handleRangeConfirm, handleShortcutClick, onSelect, parseValue, t } = useRangePicker(props, {
defaultValue,
defaultTime,
leftDate,
rightDate,
unit: unit$2,
sortDates
});
(0, vue.watch)(() => props.visible, (visible) => {
if (!visible && rangeState.value.selecting) {
parseValue(props.parsedValue);
onSelect(false);
}
});
const dateUserInput = (0, vue.ref)({
min: null,
max: null
});
const timeUserInput = (0, vue.ref)({
min: null,
max: null
});
const { leftCurrentView, rightCurrentView, leftCurrentViewRef, rightCurrentViewRef, leftYear, rightYear, leftMonth, rightMonth, leftYearLabel, rightYearLabel, showLeftPicker, showRightPicker, handleLeftYearPick, handleRightYearPick, handleLeftMonthPick, handleRightMonthPick, handlePanelChange, adjustDateByView } = usePanelDateRange(props, emit, leftDate, rightDate);
const hasShortcuts = (0, vue.computed)(() => !!shortcuts.value.length);
const minVisibleDate = (0, vue.computed)(() => {
if (dateUserInput.value.min !== null) return dateUserInput.value.min;
if (minDate.value) return minDate.value.format(dateFormat.value);
return "";
});
const maxVisibleDate = (0, vue.computed)(() => {
if (dateUserInput.value.max !== null) return dateUserInput.value.max;
if (maxDate.value || minDate.value) return (maxDate.value || minDate.value).format(dateFormat.value);
return "";
});
const minVisibleTime = (0, vue.computed)(() => {
if (timeUserInput.value.min !== null) return timeUserInput.value.min;
if (minDate.value) return minDate.value.format(timeFormat.value);
return "";
});
const maxVisibleTime = (0, vue.computed)(() => {
if (timeUserInput.value.max !== null) return timeUserInput.value.max;
if (maxDate.value || minDate.value) return (maxDate.value || minDate.value).format(timeFormat.value);
return "";
});
const timeFormat = (0, vue.computed)(() => {
return props.timeFormat || extractTimeFormat(format.value || "") || DEFAULT_FORMATS_TIME;
});
const dateFormat = (0, vue.computed)(() => {
return props.dateFormat || extractDateFormat(format.value || "") || DEFAULT_FORMATS_DATE;
});
const isValidValue = (date) => {
return isValidRange(date) && (disabledDate ? !disabledDate(date[0].toDate()) && !disabledDate(date[1].toDate()) : true);
};
const leftPrevYear = () => {
leftDate.value = adjustDateByView(leftCurrentView.value, leftDate.value, false);
if (!props.unlinkPanels) rightDate.value = leftDate.value.add(1, "month");
handlePanelChange("year");
};
const leftPrevMonth = () => {
leftDate.value = leftDate.value.subtract(1, "month");
if (!props.unlinkPanels) rightDate.value = leftDate.value.add(1, "month");
handlePanelChange("month");
};
const rightNextYear = () => {
if (!props.unlinkPanels) {
leftDate.value = adjustDateByView(rightCurrentView.value, leftDate.value, true);
rightDate.value = leftDate.value.add(1, "month");
} else rightDate.value = adjustDateByView(rightCurrentView.value, rightDate.value, true);
handlePanelChange("year");
};
const rightNextMonth = () => {
if (!props.unlinkPanels) {
leftDate.value = leftDate.value.add(1, "month");
rightDate.value = leftDate.value.add(1, "month");
} else rightDate.value = rightDate.value.add(1, "month");
handlePanelChange("month");
};
const leftNextYear = () => {
leftDate.value = adjustDateByView(leftCurrentView.value, leftDate.value, true);
handlePanelChange("year");
};
const leftNextMonth = () => {
leftDate.value = leftDate.value.add(1, "month");
handlePanelChange("month");
};
const rightPrevYear = () => {
rightDate.value = adjustDateByView(rightCurrentView.value, rightDate.value, false);
handlePanelChange("year");
};
const rightPrevMonth = () => {
rightDate.value = rightDate.value.subtract(1, "month");
handlePanelChange("month");
};
const enableMonthArrow = (0, vue.computed)(() => {
const nextMonth = (leftMonth.value + 1) % 12;
const yearOffset = leftMonth.value + 1 >= 12 ? 1 : 0;
return props.unlinkPanels && new Date(leftYear.value + yearOffset, nextMonth) < new Date(rightYear.value, rightMonth.value);
});
const enableYearArrow = (0, vue.computed)(() => {
return props.unlinkPanels && rightYear.value * 12 + rightMonth.value - (leftYear.value * 12 + leftMonth.value + 1) >= 12;
});
const dateRangeDisabled = useFormDisabled();
const btnDisabled = (0, vue.computed)(() => {
return !(minDate.value && maxDate.value && !rangeState.value.selecting && isValidRange([minDate.value, maxDate.value]) && !dateRangeDisabled.value);
});
const showTime = (0, vue.computed)(() => props.type === "datetime" || props.type === "datetimerange");
const formatEmit = (emitDayjs, index) => {
if (!emitDayjs) return;
if (defaultTime) return (0, import_dayjs_min.default)(defaultTime[index] || defaultTime).locale(lang.value).year(emitDayjs.year()).month(emitDayjs.month()).date(emitDayjs.date());
return emitDayjs;
};
const handleRangePick = (val, close = true) => {
const min_ = val.minDate;
const max_ = val.maxDate;
const minDate_ = formatEmit(min_, 0);
const maxDate_ = formatEmit(max_, 1);
if (maxDate.value === maxDate_ && minDate.value === minDate_) return;
emit("calendar-change", [min_.toDate(), max_ && max_.toDate()]);
maxDate.value = maxDate_;
minDate.value = minDate_;
if (!showTime.value && close) close = !minDate_ || !maxDate_;
handleRangeConfirm(close);
};
const minTimePickerVisible = (0, vue.ref)(false);
const maxTimePickerVisible = (0, vue.ref)(false);
const handleMinTimeClose = () => {
minTimePickerVisible.value = false;
};
const handleMaxTimeClose = () => {
maxTimePickerVisible.value = false;
};
const handleDateInput = (value, type) => {
dateUserInput.value[type] = value;
const parsedValueD = (0, import_dayjs_min.default)(value, dateFormat.value).locale(lang.value);
if (parsedValueD.isValid()) {
if (disabledDate && disabledDate(parsedValueD.toDate())) return;
if (type === "min") {
leftDate.value = parsedValueD;
minDate.value = (minDate.value || leftDate.value).year(parsedValueD.year()).month(parsedValueD.month()).date(parsedValueD.date());
if (!props.unlinkPanels && (!maxDate.value || maxDate.value.isBefore(minDate.value))) {
rightDate.value = parsedValueD.add(1, "month");
maxDate.value = minDate.value.add(1, "month");
}
} else {
rightDate.value = parsedValueD;
maxDate.value = (maxDate.value || rightDate.value).year(parsedValueD.year()).month(parsedValueD.month()).date(parsedValueD.date());
if (!props.unlinkPanels && (!minDate.value || minDate.value.isAfter(maxDate.value))) {
leftDate.value = parsedValueD.subtract(1, "month");
minDate.value = maxDate.value.subtract(1, "month");
}
}
sortDates(minDate.value, maxDate.value);
handleRangeConfirm(true);
}
};
const handleDateChange = (_, type) => {
dateUserInput.value[type] = null;
};
const handleTimeInput = (value, type) => {
timeUserInput.value[type] = value;
const parsedValueD = (0, import_dayjs_min.default)(value, timeFormat.value).locale(lang.value);
if (parsedValueD.isValid()) if (type === "min") {
minTimePickerVisible.value = true;
minDate.value = (minDate.value || leftDate.value).hour(parsedValueD.hour()).minute(parsedValueD.minute()).second(parsedValueD.second());
leftDate.value = minDate.value;
} else {
maxTimePickerVisible.value = true;
maxDate.value = (maxDate.value || rightDate.value).hour(parsedValueD.hour()).minute(parsedValueD.minute()).second(parsedValueD.second());
rightDate.value = maxDate.value;
}
};
const handleTimeChange = (_value, type) => {
timeUserInput.value[type] = null;
if (type === "min") {
leftDate.value = minDate.value;
minTimePickerVisible.value = false;
if (!maxDate.value || maxDate.value.isBefore(minDate.value)) maxDate.value = minDate.value;
} else {
rightDate.value = maxDate.value;
maxTimePickerVisible.value = false;
if (maxDate.value && maxDate.value.isBefore(minDate.value)) minDate.value = maxDate.value;
}
handleRangeConfirm(true);
};
const handleMinTimePick = (value, visible, first) => {
if (timeUserInput.value.min) return;
if (value) minDate.value = (minDate.value || leftDate.value).hour(value.hour()).minute(value.minute()).second(value.second());
if (!first) minTimePickerVisible.value = visible;
if (!maxDate.value || maxDate.value.isBefore(minDate.value)) {
maxDate.value = minDate.value;
rightDate.value = value;
(0, vue.nextTick)(() => {
parseValue(props.parsedValue);
});
}
handleRangeConfirm(true);
};
const handleMaxTimePick = (value, visible, first) => {
if (timeUserInput.value.max) return;
if (value) maxDate.value = (maxDate.value || rightDate.value).hour(value.hour()).minute(value.minute()).second(value.second());
if (!first) maxTimePickerVisible.value = visible;
if (maxDate.value && maxDate.value.isBefore(minDate.value)) minDate.value = maxDate.value;
handleRangeConfirm(true);
};
const onClear = () => {
handleClear();
emit("clear");
};
const handleClear = () => {
let valueOnClear = null;
if (pickerBase?.emptyValues) valueOnClear = pickerBase.emptyValues.valueOnClear.value;
leftDate.value = getDefaultValue((0, vue.unref)(defaultValue), {
lang: (0, vue.unref)(lang),
unit: "month",
unlinkPanels: props.unlinkPanels
})[0];
rightDate.value = leftDate.value.add(1, "month");
maxDate.value = void 0;
minDate.value = void 0;
handleRangeConfirm(true);
emit("pick", valueOnClear);
};
const parseUserInput = (value) => {
return correctlyParseUserInput(value, format.value || "", lang.value, isDefaultFormat);
};
function sortDates(minDate, maxDate) {
if (props.unlinkPanels && maxDate) {
const minDateYear = minDate?.year() || 0;
const minDateMonth = minDate?.month() || 0;
const maxDateYear = maxDate.year();
const maxDateMonth = maxDate.month();
rightDate.value = minDateYear === maxDateYear && minDateMonth === maxDateMonth ? maxDate.add(1, unit$2) : maxDate;
} else {
rightDate.value = leftDate.value.add(1, unit$2);
if (maxDate) rightDate.value = rightDate.value.hour(maxDate.hour()).minute(maxDate.minute()).second(maxDate.second());
}
}
emit("set-picker-option", ["isValidValue", isValidValue]);
emit("set-picker-option", ["parseUserInput", parseUserInput]);
emit("set-picker-option", ["handleClear", handleClear]);
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)([
(0, vue.unref)(ppNs).b(),
(0, vue.unref)(drpNs).b(),
(0, vue.unref)(ppNs).is("border", _ctx.border),
(0, vue.unref)(ppNs).is("disabled", (0, vue.unref)(dateRangeDisabled)),
{
"has-sidebar": _ctx.$slots.sidebar || hasShortcuts.value,
"has-time": showTime.value
}
]) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("body-wrapper")) }, [
(0, vue.renderSlot)(_ctx.$slots, "sidebar", { class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("sidebar")) }),
hasShortcuts.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("sidebar"))
}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(shortcuts.value, (shortcut, key) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key,
type: "button",
disabled: (0, vue.unref)(dateRangeDisabled),
class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("shortcut")),
onClick: ($event) => (0, vue.unref)(handleShortcutClick)(shortcut)
}, (0, vue.toDisplayString)(shortcut.text), 11, _hoisted_1$46);
}), 128))], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("body")) }, [
showTime.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(drpNs).e("time-header"))
}, [
(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(drpNs).e("editors-wrap")) }, [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(drpNs).e("time-picker-wrap")) }, [(0, vue.createVNode)((0, vue.unref)(ElInput), {
size: "small",
disabled: (0, vue.unref)(rangeState).selecting || (0, vue.unref)(dateRangeDisabled),
placeholder: (0, vue.unref)(t)("el.datepicker.startDate"),
class: (0, vue.normalizeClass)((0, vue.unref)(drpNs).e("editor")),
"model-value": minVisibleDate.value,
"validate-event": false,
readonly: !_ctx.editable,
onInput: _cache[0] || (_cache[0] = (val) => handleDateInput(val, "min")),
onChange: _cache[1] || (_cache[1] = (val) => handleDateChange(val, "min"))
}, null, 8, [
"disabled",
"placeholder",
"class",
"model-value",
"readonly"
])], 2), (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(drpNs).e("time-picker-wrap")) }, [(0, vue.createVNode)((0, vue.unref)(ElInput), {
size: "small",
class: (0, vue.normalizeClass)((0, vue.unref)(drpNs).e("editor")),
disabled: (0, vue.unref)(rangeState).selecting || (0, vue.unref)(dateRangeDisabled),
placeholder: (0, vue.unref)(t)("el.datepicker.startTime"),
"model-value": minVisibleTime.value,
"validate-event": false,
readonly: !_ctx.editable,
onFocus: _cache[2] || (_cache[2] = ($event) => minTimePickerVisible.value = true),
onInput: _cache[3] || (_cache[3] = (val) => handleTimeInput(val, "min")),
onChange: _cache[4] || (_cache[4] = (val) => handleTimeChange(val, "min"))
}, null, 8, [
"class",
"disabled",
"placeholder",
"model-value",
"readonly"
]), (0, vue.createVNode)((0, vue.unref)(panel_time_pick_default), {
visible: minTimePickerVisible.value,
format: timeFormat.value,
"datetime-role": "start",
"parsed-value": (0, vue.unref)(minDate) || leftDate.value,
onPick: handleMinTimePick
}, null, 8, [
"visible",
"format",
"parsed-value"
])], 2)), [[(0, vue.unref)(ClickOutside), handleMinTimeClose]])], 2),
(0, vue.createElementVNode)("span", null, [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(arrow_right_default))]),
_: 1
})]),
(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)([(0, vue.unref)(drpNs).e("editors-wrap"), "is-right"]) }, [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(drpNs).e("time-picker-wrap")) }, [(0, vue.createVNode)((0, vue.unref)(ElInput), {
size: "small",
class: (0, vue.normalizeClass)((0, vue.unref)(drpNs).e("editor")),
disabled: (0, vue.unref)(rangeState).selecting || (0, vue.unref)(dateRangeDisabled),
placeholder: (0, vue.unref)(t)("el.datepicker.endDate"),
"model-value": maxVisibleDate.value,
readonly: !(0, vue.unref)(minDate) || !_ctx.editable,
"validate-event": false,
onInput: _cache[5] || (_cache[5] = (val) => handleDateInput(val, "max")),
onChange: _cache[6] || (_cache[6] = (val) => handleDateChange(val, "max"))
}, null, 8, [
"class",
"disabled",
"placeholder",
"model-value",
"readonly"
])], 2), (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(drpNs).e("time-picker-wrap")) }, [(0, vue.createVNode)((0, vue.unref)(ElInput), {
size: "small",
class: (0, vue.normalizeClass)((0, vue.unref)(drpNs).e("editor")),
disabled: (0, vue.unref)(rangeState).selecting || (0, vue.unref)(dateRangeDisabled),
placeholder: (0, vue.unref)(t)("el.datepicker.endTime"),
"model-value": maxVisibleTime.value,
readonly: !(0, vue.unref)(minDate) || !_ctx.editable,
"validate-event": false,
onFocus: _cache[7] || (_cache[7] = ($event) => (0, vue.unref)(minDate) && (maxTimePickerVisible.value = true)),
onInput: _cache[8] || (_cache[8] = (val) => handleTimeInput(val, "max")),
onChange: _cache[9] || (_cache[9] = (val) => handleTimeChange(val, "max"))
}, null, 8, [
"class",
"disabled",
"placeholder",
"model-value",
"readonly"
]), (0, vue.createVNode)((0, vue.unref)(panel_time_pick_default), {
"datetime-role": "end",
visible: maxTimePickerVisible.value,
format: timeFormat.value,
"parsed-value": (0, vue.unref)(maxDate) || rightDate.value,
onPick: handleMaxTimePick
}, null, 8, [
"visible",
"format",
"parsed-value"
])], 2)), [[(0, vue.unref)(ClickOutside), handleMaxTimeClose]])], 2)
], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)([[(0, vue.unref)(ppNs).e("content"), (0, vue.unref)(drpNs).e("content")], "is-left"]) }, [
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(drpNs).e("header")) }, [
(0, vue.createElementVNode)("button", {
type: "button",
class: (0, vue.normalizeClass)([(0, vue.unref)(ppNs).e("icon-btn"), "d-arrow-left"]),
"aria-label": (0, vue.unref)(t)(`el.datepicker.prevYear`),
disabled: (0, vue.unref)(dateRangeDisabled),
onClick: leftPrevYear
}, [(0, vue.renderSlot)(_ctx.$slots, "prev-year", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(d_arrow_left_default))]),
_: 1
})])], 10, _hoisted_2$28),
(0, vue.withDirectives)((0, vue.createElementVNode)("button", {
type: "button",
class: (0, vue.normalizeClass)([(0, vue.unref)(ppNs).e("icon-btn"), "arrow-left"]),
"aria-label": (0, vue.unref)(t)(`el.datepicker.prevMonth`),
disabled: (0, vue.unref)(dateRangeDisabled),
onClick: leftPrevMonth
}, [(0, vue.renderSlot)(_ctx.$slots, "prev-month", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(arrow_left_default))]),
_: 1
})])], 10, _hoisted_3$13), [[vue.vShow, (0, vue.unref)(leftCurrentView) === "date"]]),
_ctx.unlinkPanels ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key: 0,
type: "button",
disabled: !enableYearArrow.value || (0, vue.unref)(dateRangeDisabled),
class: (0, vue.normalizeClass)([[(0, vue.unref)(ppNs).e("icon-btn"), (0, vue.unref)(ppNs).is("disabled", !enableYearArrow.value || (0, vue.unref)(dateRangeDisabled))], "d-arrow-right"]),
"aria-label": (0, vue.unref)(t)(`el.datepicker.nextYear`),
onClick: leftNextYear
}, [(0, vue.renderSlot)(_ctx.$slots, "next-year", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(d_arrow_right_default))]),
_: 1
})])], 10, _hoisted_4$10)) : (0, vue.createCommentVNode)("v-if", true),
_ctx.unlinkPanels && (0, vue.unref)(leftCurrentView) === "date" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key: 1,
type: "button",
disabled: !enableMonthArrow.value || (0, vue.unref)(dateRangeDisabled),
class: (0, vue.normalizeClass)([[(0, vue.unref)(ppNs).e("icon-btn"), (0, vue.unref)(ppNs).is("disabled", !enableMonthArrow.value || (0, vue.unref)(dateRangeDisabled))], "arrow-right"]),
"aria-label": (0, vue.unref)(t)(`el.datepicker.nextMonth`),
onClick: leftNextMonth
}, [(0, vue.renderSlot)(_ctx.$slots, "next-month", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(arrow_right_default))]),
_: 1
})])], 10, _hoisted_5$7)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", null, [(0, vue.createElementVNode)("span", {
role: "button",
class: (0, vue.normalizeClass)((0, vue.unref)(drpNs).e("header-label")),
"aria-live": "polite",
tabindex: _ctx.disabled ? void 0 : 0,
"aria-disabled": _ctx.disabled,
onKeydown: _cache[10] || (_cache[10] = (0, vue.withKeys)(($event) => (0, vue.unref)(showLeftPicker)("year"), ["enter"])),
onClick: _cache[11] || (_cache[11] = ($event) => (0, vue.unref)(showLeftPicker)("year"))
}, (0, vue.toDisplayString)((0, vue.unref)(leftYearLabel)), 43, _hoisted_6$2), (0, vue.withDirectives)((0, vue.createElementVNode)("span", {
role: "button",
"aria-live": "polite",
tabindex: _ctx.disabled ? void 0 : 0,
"aria-disabled": _ctx.disabled,
class: (0, vue.normalizeClass)([(0, vue.unref)(drpNs).e("header-label"), { active: (0, vue.unref)(leftCurrentView) === "month" }]),
onKeydown: _cache[12] || (_cache[12] = (0, vue.withKeys)(($event) => (0, vue.unref)(showLeftPicker)("month"), ["enter"])),
onClick: _cache[13] || (_cache[13] = ($event) => (0, vue.unref)(showLeftPicker)("month"))
}, (0, vue.toDisplayString)((0, vue.unref)(t)(`el.datepicker.month${leftDate.value.month() + 1}`)), 43, _hoisted_7$1), [[vue.vShow, (0, vue.unref)(leftCurrentView) === "date"]])])
], 2),
(0, vue.unref)(leftCurrentView) === "date" ? ((0, vue.openBlock)(), (0, vue.createBlock)(basic_date_table_default, {
key: 0,
ref_key: "leftCurrentViewRef",
ref: leftCurrentViewRef,
"selection-mode": "range",
date: leftDate.value,
"min-date": (0, vue.unref)(minDate),
"max-date": (0, vue.unref)(maxDate),
"range-state": (0, vue.unref)(rangeState),
"disabled-date": (0, vue.unref)(disabledDate),
"cell-class-name": (0, vue.unref)(cellClassName),
"show-week-number": _ctx.showWeekNumber,
disabled: (0, vue.unref)(dateRangeDisabled),
onChangerange: (0, vue.unref)(handleChangeRange),
onPick: handleRangePick,
onSelect: (0, vue.unref)(onSelect)
}, null, 8, [
"date",
"min-date",
"max-date",
"range-state",
"disabled-date",
"cell-class-name",
"show-week-number",
"disabled",
"onChangerange",
"onSelect"
])) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.unref)(leftCurrentView) === "year" ? ((0, vue.openBlock)(), (0, vue.createBlock)(basic_year_table_default, {
key: 1,
ref_key: "leftCurrentViewRef",
ref: leftCurrentViewRef,
"selection-mode": "year",
date: leftDate.value,
"disabled-date": (0, vue.unref)(disabledDate),
"parsed-value": _ctx.parsedValue,
disabled: (0, vue.unref)(dateRangeDisabled),
onPick: (0, vue.unref)(handleLeftYearPick)
}, null, 8, [
"date",
"disabled-date",
"parsed-value",
"disabled",
"onPick"
])) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.unref)(leftCurrentView) === "month" ? ((0, vue.openBlock)(), (0, vue.createBlock)(basic_month_table_default, {
key: 2,
ref_key: "leftCurrentViewRef",
ref: leftCurrentViewRef,
"selection-mode": "month",
date: leftDate.value,
"parsed-value": _ctx.parsedValue,
"disabled-date": (0, vue.unref)(disabledDate),
disabled: (0, vue.unref)(dateRangeDisabled),
onPick: (0, vue.unref)(handleLeftMonthPick)
}, null, 8, [
"date",
"parsed-value",
"disabled-date",
"disabled",
"onPick"
])) : (0, vue.createCommentVNode)("v-if", true)
], 2),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)([[(0, vue.unref)(ppNs).e("content"), (0, vue.unref)(drpNs).e("content")], "is-right"]) }, [
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(drpNs).e("header")) }, [
_ctx.unlinkPanels ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key: 0,
type: "button",
disabled: !enableYearArrow.value || (0, vue.unref)(dateRangeDisabled),
class: (0, vue.normalizeClass)([[(0, vue.unref)(ppNs).e("icon-btn"), (0, vue.unref)(ppNs).is("disabled", !enableYearArrow.value || (0, vue.unref)(dateRangeDisabled))], "d-arrow-left"]),
"aria-label": (0, vue.unref)(t)(`el.datepicker.prevYear`),
onClick: rightPrevYear
}, [(0, vue.renderSlot)(_ctx.$slots, "prev-year", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(d_arrow_left_default))]),
_: 1
})])], 10, _hoisted_8$1)) : (0, vue.createCommentVNode)("v-if", true),
_ctx.unlinkPanels && (0, vue.unref)(rightCurrentView) === "date" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key: 1,
type: "button",
disabled: !enableMonthArrow.value || (0, vue.unref)(dateRangeDisabled),
class: (0, vue.normalizeClass)([[(0, vue.unref)(ppNs).e("icon-btn"), (0, vue.unref)(ppNs).is("disabled", !enableMonthArrow.value || (0, vue.unref)(dateRangeDisabled))], "arrow-left"]),
"aria-label": (0, vue.unref)(t)(`el.datepicker.prevMonth`),
onClick: rightPrevMonth
}, [(0, vue.renderSlot)(_ctx.$slots, "prev-month", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(arrow_left_default))]),
_: 1
})])], 10, _hoisted_9$1)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("button", {
type: "button",
"aria-label": (0, vue.unref)(t)(`el.datepicker.nextYear`),
class: (0, vue.normalizeClass)([(0, vue.unref)(ppNs).e("icon-btn"), "d-arrow-right"]),
disabled: (0, vue.unref)(dateRangeDisabled),
onClick: rightNextYear
}, [(0, vue.renderSlot)(_ctx.$slots, "next-year", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(d_arrow_right_default))]),
_: 1
})])], 10, _hoisted_10$1),
(0, vue.withDirectives)((0, vue.createElementVNode)("button", {
type: "button",
class: (0, vue.normalizeClass)([(0, vue.unref)(ppNs).e("icon-btn"), "arrow-right"]),
disabled: (0, vue.unref)(dateRangeDisabled),
"aria-label": (0, vue.unref)(t)(`el.datepicker.nextMonth`),
onClick: rightNextMonth
}, [(0, vue.renderSlot)(_ctx.$slots, "next-month", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(arrow_right_default))]),
_: 1
})])], 10, _hoisted_11$1), [[vue.vShow, (0, vue.unref)(rightCurrentView) === "date"]]),
(0, vue.createElementVNode)("div", null, [(0, vue.createElementVNode)("span", {
role: "button",
class: (0, vue.normalizeClass)((0, vue.unref)(drpNs).e("header-label")),
"aria-live": "polite",
tabindex: _ctx.disabled ? void 0 : 0,
"aria-disabled": _ctx.disabled,
onKeydown: _cache[14] || (_cache[14] = (0, vue.withKeys)(($event) => (0, vue.unref)(showRightPicker)("year"), ["enter"])),
onClick: _cache[15] || (_cache[15] = ($event) => (0, vue.unref)(showRightPicker)("year"))
}, (0, vue.toDisplayString)((0, vue.unref)(rightYearLabel)), 43, _hoisted_12$1), (0, vue.withDirectives)((0, vue.createElementVNode)("span", {
role: "button",
"aria-live": "polite",
tabindex: _ctx.disabled ? void 0 : 0,
"aria-disabled": _ctx.disabled,
class: (0, vue.normalizeClass)([(0, vue.unref)(drpNs).e("header-label"), { active: (0, vue.unref)(rightCurrentView) === "month" }]),
onKeydown: _cache[16] || (_cache[16] = (0, vue.withKeys)(($event) => (0, vue.unref)(showRightPicker)("month"), ["enter"])),
onClick: _cache[17] || (_cache[17] = ($event) => (0, vue.unref)(showRightPicker)("month"))
}, (0, vue.toDisplayString)((0, vue.unref)(t)(`el.datepicker.month${rightDate.value.month() + 1}`)), 43, _hoisted_13$1), [[vue.vShow, (0, vue.unref)(rightCurrentView) === "date"]])])
], 2),
(0, vue.unref)(rightCurrentView) === "date" ? ((0, vue.openBlock)(), (0, vue.createBlock)(basic_date_table_default, {
key: 0,
ref_key: "rightCurrentViewRef",
ref: rightCurrentViewRef,
"selection-mode": "range",
date: rightDate.value,
"min-date": (0, vue.unref)(minDate),
"max-date": (0, vue.unref)(maxDate),
"range-state": (0, vue.unref)(rangeState),
"disabled-date": (0, vue.unref)(disabledDate),
"cell-class-name": (0, vue.unref)(cellClassName),
"show-week-number": _ctx.showWeekNumber,
disabled: (0, vue.unref)(dateRangeDisabled),
onChangerange: (0, vue.unref)(handleChangeRange),
onPick: handleRangePick,
onSelect: (0, vue.unref)(onSelect)
}, null, 8, [
"date",
"min-date",
"max-date",
"range-state",
"disabled-date",
"cell-class-name",
"show-week-number",
"disabled",
"onChangerange",
"onSelect"
])) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.unref)(rightCurrentView) === "year" ? ((0, vue.openBlock)(), (0, vue.createBlock)(basic_year_table_default, {
key: 1,
ref_key: "rightCurrentViewRef",
ref: rightCurrentViewRef,
"selection-mode": "year",
date: rightDate.value,
"disabled-date": (0, vue.unref)(disabledDate),
"parsed-value": _ctx.parsedValue,
disabled: (0, vue.unref)(dateRangeDisabled),
onPick: (0, vue.unref)(handleRightYearPick)
}, null, 8, [
"date",
"disabled-date",
"parsed-value",
"disabled",
"onPick"
])) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.unref)(rightCurrentView) === "month" ? ((0, vue.openBlock)(), (0, vue.createBlock)(basic_month_table_default, {
key: 2,
ref_key: "rightCurrentViewRef",
ref: rightCurrentViewRef,
"selection-mode": "month",
date: rightDate.value,
"parsed-value": _ctx.parsedValue,
"disabled-date": (0, vue.unref)(disabledDate),
disabled: (0, vue.unref)(dateRangeDisabled),
onPick: (0, vue.unref)(handleRightMonthPick)
}, null, 8, [
"date",
"parsed-value",
"disabled-date",
"disabled",
"onPick"
])) : (0, vue.createCommentVNode)("v-if", true)
], 2)
], 2)
], 2), _ctx.showFooter && showTime.value && (_ctx.showConfirm || (0, vue.unref)(clearable)) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("footer"))
}, [(0, vue.unref)(clearable) ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElButton), {
key: 0,
text: "",
size: "small",
class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("link-btn")),
onClick: onClear
}, {
default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(t)("el.datepicker.clear")), 1)]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true), _ctx.showConfirm ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElButton), {
key: 1,
plain: "",
size: "small",
class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("link-btn")),
disabled: btnDisabled.value,
onClick: _cache[18] || (_cache[18] = ($event) => (0, vue.unref)(handleRangeConfirm)(false))
}, {
default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(t)("el.datepicker.confirm")), 1)]),
_: 1
}, 8, ["class", "disabled"])) : (0, vue.createCommentVNode)("v-if", true)], 2)) : (0, vue.createCommentVNode)("v-if", true)], 2);
};
}
});
//#endregion
//#region ../../packages/components/date-picker-panel/src/date-picker-com/panel-date-range.vue
var panel_date_range_default = panel_date_range_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/date-picker-panel/src/props/panel-month-range.ts
const panelMonthRangeProps = buildProps({ ...panelRangeSharedProps });
const panelMonthRangeEmits = [
"pick",
"set-picker-option",
"calendar-change"
];
//#endregion
//#region ../../packages/components/date-picker-panel/src/composables/use-month-range-header.ts
const useMonthRangeHeader = ({ unlinkPanels, leftDate, rightDate }) => {
const { t } = useLocale();
const leftPrevYear = () => {
leftDate.value = leftDate.value.subtract(1, "year");
if (!unlinkPanels.value) rightDate.value = rightDate.value.subtract(1, "year");
};
const rightNextYear = () => {
if (!unlinkPanels.value) leftDate.value = leftDate.value.add(1, "year");
rightDate.value = rightDate.value.add(1, "year");
};
const leftNextYear = () => {
leftDate.value = leftDate.value.add(1, "year");
};
const rightPrevYear = () => {
rightDate.value = rightDate.value.subtract(1, "year");
};
return {
leftPrevYear,
rightNextYear,
leftNextYear,
rightPrevYear,
leftLabel: (0, vue.computed)(() => {
return `${leftDate.value.year()} ${t("el.datepicker.year")}`;
}),
rightLabel: (0, vue.computed)(() => {
return `${rightDate.value.year()} ${t("el.datepicker.year")}`;
}),
leftYear: (0, vue.computed)(() => {
return leftDate.value.year();
}),
rightYear: (0, vue.computed)(() => {
return rightDate.value.year() === leftDate.value.year() ? leftDate.value.year() + 1 : rightDate.value.year();
})
};
};
//#endregion
//#region ../../packages/components/date-picker-panel/src/date-picker-com/panel-month-range.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$45 = ["disabled", "onClick"];
const _hoisted_2$27 = ["disabled"];
const _hoisted_3$12 = ["disabled"];
const _hoisted_4$9 = ["disabled"];
const _hoisted_5$6 = ["disabled"];
const unit$1 = "year";
var panel_month_range_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "DatePickerMonthRange",
__name: "panel-month-range",
props: panelMonthRangeProps,
emits: panelMonthRangeEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const { lang } = useLocale();
const pickerBase = (0, vue.inject)(PICKER_BASE_INJECTION_KEY);
const isDefaultFormat = (0, vue.inject)(ROOT_PICKER_IS_DEFAULT_FORMAT_INJECTION_KEY, void 0);
const { shortcuts, disabledDate, cellClassName } = pickerBase.props;
const format = (0, vue.toRef)(pickerBase.props, "format");
const defaultValue = (0, vue.toRef)(pickerBase.props, "defaultValue");
const leftDate = (0, vue.ref)((0, import_dayjs_min.default)().locale(lang.value));
const rightDate = (0, vue.ref)((0, import_dayjs_min.default)().locale(lang.value).add(1, unit$1));
const { minDate, maxDate, rangeState, ppNs, drpNs, handleChangeRange, handleRangeConfirm, handleShortcutClick, onSelect, parseValue } = useRangePicker(props, {
defaultValue,
leftDate,
rightDate,
unit: unit$1,
sortDates
});
const hasShortcuts = (0, vue.computed)(() => !!shortcuts.length);
const { leftPrevYear, rightNextYear, leftNextYear, rightPrevYear, leftLabel, rightLabel, leftYear, rightYear } = useMonthRangeHeader({
unlinkPanels: (0, vue.toRef)(props, "unlinkPanels"),
leftDate,
rightDate
});
const enableYearArrow = (0, vue.computed)(() => {
return props.unlinkPanels && rightYear.value > leftYear.value + 1;
});
const handleRangePick = (val, close = true) => {
const minDate_ = val.minDate;
const maxDate_ = val.maxDate;
if (maxDate.value === maxDate_ && minDate.value === minDate_) return;
emit("calendar-change", [minDate_.toDate(), maxDate_ && maxDate_.toDate()]);
maxDate.value = maxDate_;
minDate.value = minDate_;
if (!close) return;
handleRangeConfirm();
};
const handleClear = () => {
let valueOnClear = null;
if (pickerBase?.emptyValues) valueOnClear = pickerBase.emptyValues.valueOnClear.value;
leftDate.value = getDefaultValue((0, vue.unref)(defaultValue), {
lang: (0, vue.unref)(lang),
unit: "year",
unlinkPanels: props.unlinkPanels
})[0];
rightDate.value = leftDate.value.add(1, "year");
emit("pick", valueOnClear);
};
const parseUserInput = (value) => {
return correctlyParseUserInput(value, format.value, lang.value, isDefaultFormat);
};
function sortDates(minDate, maxDate) {
if (props.unlinkPanels && maxDate) rightDate.value = (minDate?.year() || 0) === maxDate.year() ? maxDate.add(1, unit$1) : maxDate;
else rightDate.value = leftDate.value.add(1, unit$1);
}
const monthRangeDisabled = useFormDisabled();
(0, vue.watch)(() => props.visible, (visible) => {
if (!visible && rangeState.value.selecting) {
parseValue(props.parsedValue);
onSelect(false);
}
});
emit("set-picker-option", ["isValidValue", isValidRange]);
emit("set-picker-option", ["parseUserInput", parseUserInput]);
emit("set-picker-option", ["handleClear", handleClear]);
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)([
(0, vue.unref)(ppNs).b(),
(0, vue.unref)(drpNs).b(),
(0, vue.unref)(ppNs).is("border", _ctx.border),
(0, vue.unref)(ppNs).is("disabled", (0, vue.unref)(monthRangeDisabled)),
{ "has-sidebar": Boolean(_ctx.$slots.sidebar) || hasShortcuts.value }
]) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("body-wrapper")) }, [
(0, vue.renderSlot)(_ctx.$slots, "sidebar", { class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("sidebar")) }),
hasShortcuts.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("sidebar"))
}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(shortcuts), (shortcut, key) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key,
type: "button",
class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("shortcut")),
disabled: (0, vue.unref)(monthRangeDisabled),
onClick: ($event) => (0, vue.unref)(handleShortcutClick)(shortcut)
}, (0, vue.toDisplayString)(shortcut.text), 11, _hoisted_1$45);
}), 128))], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("body")) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)([[(0, vue.unref)(ppNs).e("content"), (0, vue.unref)(drpNs).e("content")], "is-left"]) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(drpNs).e("header")) }, [
(0, vue.createElementVNode)("button", {
type: "button",
class: (0, vue.normalizeClass)([(0, vue.unref)(ppNs).e("icon-btn"), "d-arrow-left"]),
disabled: (0, vue.unref)(monthRangeDisabled),
onClick: _cache[0] || (_cache[0] = (...args) => (0, vue.unref)(leftPrevYear) && (0, vue.unref)(leftPrevYear)(...args))
}, [(0, vue.renderSlot)(_ctx.$slots, "prev-year", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(d_arrow_left_default))]),
_: 1
})])], 10, _hoisted_2$27),
_ctx.unlinkPanels ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key: 0,
type: "button",
disabled: !enableYearArrow.value || (0, vue.unref)(monthRangeDisabled),
class: (0, vue.normalizeClass)([[(0, vue.unref)(ppNs).e("icon-btn"), (0, vue.unref)(ppNs).is("disabled", !enableYearArrow.value || (0, vue.unref)(monthRangeDisabled))], "d-arrow-right"]),
onClick: _cache[1] || (_cache[1] = (...args) => (0, vue.unref)(leftNextYear) && (0, vue.unref)(leftNextYear)(...args))
}, [(0, vue.renderSlot)(_ctx.$slots, "next-year", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(d_arrow_right_default))]),
_: 1
})])], 10, _hoisted_3$12)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", null, (0, vue.toDisplayString)((0, vue.unref)(leftLabel)), 1)
], 2), (0, vue.createVNode)(basic_month_table_default, {
"selection-mode": "range",
date: leftDate.value,
"min-date": (0, vue.unref)(minDate),
"max-date": (0, vue.unref)(maxDate),
"range-state": (0, vue.unref)(rangeState),
"disabled-date": (0, vue.unref)(disabledDate),
disabled: (0, vue.unref)(monthRangeDisabled),
"cell-class-name": (0, vue.unref)(cellClassName),
onChangerange: (0, vue.unref)(handleChangeRange),
onPick: handleRangePick,
onSelect: (0, vue.unref)(onSelect)
}, null, 8, [
"date",
"min-date",
"max-date",
"range-state",
"disabled-date",
"disabled",
"cell-class-name",
"onChangerange",
"onSelect"
])], 2), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)([[(0, vue.unref)(ppNs).e("content"), (0, vue.unref)(drpNs).e("content")], "is-right"]) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(drpNs).e("header")) }, [
_ctx.unlinkPanels ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key: 0,
type: "button",
disabled: !enableYearArrow.value || (0, vue.unref)(monthRangeDisabled),
class: (0, vue.normalizeClass)([[(0, vue.unref)(ppNs).e("icon-btn"), (0, vue.unref)(ppNs).is("disabled", !enableYearArrow.value || (0, vue.unref)(monthRangeDisabled))], "d-arrow-left"]),
onClick: _cache[2] || (_cache[2] = (...args) => (0, vue.unref)(rightPrevYear) && (0, vue.unref)(rightPrevYear)(...args))
}, [(0, vue.renderSlot)(_ctx.$slots, "prev-year", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(d_arrow_left_default))]),
_: 1
})])], 10, _hoisted_4$9)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("button", {
type: "button",
class: (0, vue.normalizeClass)([(0, vue.unref)(ppNs).e("icon-btn"), "d-arrow-right"]),
disabled: (0, vue.unref)(monthRangeDisabled),
onClick: _cache[3] || (_cache[3] = (...args) => (0, vue.unref)(rightNextYear) && (0, vue.unref)(rightNextYear)(...args))
}, [(0, vue.renderSlot)(_ctx.$slots, "next-year", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(d_arrow_right_default))]),
_: 1
})])], 10, _hoisted_5$6),
(0, vue.createElementVNode)("div", null, (0, vue.toDisplayString)((0, vue.unref)(rightLabel)), 1)
], 2), (0, vue.createVNode)(basic_month_table_default, {
"selection-mode": "range",
date: rightDate.value,
"min-date": (0, vue.unref)(minDate),
"max-date": (0, vue.unref)(maxDate),
"range-state": (0, vue.unref)(rangeState),
"disabled-date": (0, vue.unref)(disabledDate),
disabled: (0, vue.unref)(monthRangeDisabled),
"cell-class-name": (0, vue.unref)(cellClassName),
onChangerange: (0, vue.unref)(handleChangeRange),
onPick: handleRangePick,
onSelect: (0, vue.unref)(onSelect)
}, null, 8, [
"date",
"min-date",
"max-date",
"range-state",
"disabled-date",
"disabled",
"cell-class-name",
"onChangerange",
"onSelect"
])], 2)], 2)
], 2)], 2);
};
}
});
//#endregion
//#region ../../packages/components/date-picker-panel/src/date-picker-com/panel-month-range.vue
var panel_month_range_default = panel_month_range_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/date-picker-panel/src/props/panel-year-range.ts
const panelYearRangeProps = buildProps({ ...panelRangeSharedProps });
const panelYearRangeEmits = [
"pick",
"set-picker-option",
"calendar-change"
];
//#endregion
//#region ../../packages/components/date-picker-panel/src/composables/use-year-range-header.ts
const useYearRangeHeader = ({ unlinkPanels, leftDate, rightDate }) => {
const leftPrevYear = () => {
leftDate.value = leftDate.value.subtract(10, "year");
if (!unlinkPanels.value) rightDate.value = rightDate.value.subtract(10, "year");
};
const rightNextYear = () => {
if (!unlinkPanels.value) leftDate.value = leftDate.value.add(10, "year");
rightDate.value = rightDate.value.add(10, "year");
};
const leftNextYear = () => {
leftDate.value = leftDate.value.add(10, "year");
};
const rightPrevYear = () => {
rightDate.value = rightDate.value.subtract(10, "year");
};
return {
leftPrevYear,
rightNextYear,
leftNextYear,
rightPrevYear,
leftLabel: (0, vue.computed)(() => {
const leftStartDate = Math.floor(leftDate.value.year() / 10) * 10;
return `${leftStartDate}-${leftStartDate + 9}`;
}),
rightLabel: (0, vue.computed)(() => {
const rightStartDate = Math.floor(rightDate.value.year() / 10) * 10;
return `${rightStartDate}-${rightStartDate + 9}`;
}),
leftYear: (0, vue.computed)(() => {
return Math.floor(leftDate.value.year() / 10) * 10 + 9;
}),
rightYear: (0, vue.computed)(() => {
return Math.floor(rightDate.value.year() / 10) * 10;
})
};
};
//#endregion
//#region ../../packages/components/date-picker-panel/src/date-picker-com/panel-year-range.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$44 = ["disabled", "onClick"];
const _hoisted_2$26 = ["disabled"];
const _hoisted_3$11 = ["disabled"];
const _hoisted_4$8 = ["disabled"];
const _hoisted_5$5 = ["disabled"];
const step = 10;
const unit = "year";
var panel_year_range_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "DatePickerYearRange",
__name: "panel-year-range",
props: panelYearRangeProps,
emits: panelYearRangeEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const { lang } = useLocale();
const leftDate = (0, vue.ref)((0, import_dayjs_min.default)().locale(lang.value));
const rightDate = (0, vue.ref)((0, import_dayjs_min.default)().locale(lang.value).add(step, unit));
const isDefaultFormat = (0, vue.inject)(ROOT_PICKER_IS_DEFAULT_FORMAT_INJECTION_KEY, void 0);
const pickerBase = (0, vue.inject)(PICKER_BASE_INJECTION_KEY);
const { shortcuts, disabledDate, cellClassName } = pickerBase.props;
const format = (0, vue.toRef)(pickerBase.props, "format");
const defaultValue = (0, vue.toRef)(pickerBase.props, "defaultValue");
const { minDate, maxDate, rangeState, ppNs, drpNs, handleChangeRange, handleRangeConfirm, handleShortcutClick, onSelect, parseValue } = useRangePicker(props, {
defaultValue,
leftDate,
rightDate,
step,
unit,
sortDates
});
const { leftPrevYear, rightNextYear, leftNextYear, rightPrevYear, leftLabel, rightLabel, leftYear, rightYear } = useYearRangeHeader({
unlinkPanels: (0, vue.toRef)(props, "unlinkPanels"),
leftDate,
rightDate
});
const yearRangeDisabled = useFormDisabled();
const hasShortcuts = (0, vue.computed)(() => !!shortcuts.length);
const panelKls = (0, vue.computed)(() => [
ppNs.b(),
drpNs.b(),
ppNs.is("border", props.border),
ppNs.is("disabled", yearRangeDisabled.value),
{ "has-sidebar": Boolean((0, vue.useSlots)().sidebar) || hasShortcuts.value }
]);
const leftPanelKls = (0, vue.computed)(() => {
return {
content: [
ppNs.e("content"),
drpNs.e("content"),
"is-left"
],
arrowLeftBtn: [ppNs.e("icon-btn"), "d-arrow-left"],
arrowRightBtn: [
ppNs.e("icon-btn"),
ppNs.is("disabled", !enableYearArrow.value || yearRangeDisabled.value),
"d-arrow-right"
]
};
});
const rightPanelKls = (0, vue.computed)(() => {
return {
content: [
ppNs.e("content"),
drpNs.e("content"),
"is-right"
],
arrowLeftBtn: [
ppNs.e("icon-btn"),
ppNs.is("disabled", !enableYearArrow.value || yearRangeDisabled.value),
"d-arrow-left"
],
arrowRightBtn: [ppNs.e("icon-btn"), "d-arrow-right"]
};
});
const enableYearArrow = (0, vue.computed)(() => {
return props.unlinkPanels && rightYear.value > leftYear.value + 1;
});
const handleRangePick = (val, close = true) => {
const minDate_ = val.minDate;
const maxDate_ = val.maxDate;
if (maxDate.value === maxDate_ && minDate.value === minDate_) return;
emit("calendar-change", [minDate_.toDate(), maxDate_ && maxDate_.toDate()]);
maxDate.value = maxDate_;
minDate.value = minDate_;
if (!close) return;
handleRangeConfirm();
};
const parseUserInput = (value) => {
return correctlyParseUserInput(value, format.value, lang.value, isDefaultFormat);
};
const isValidValue = (date) => {
return isValidRange(date) && (disabledDate ? !disabledDate(date[0].toDate()) && !disabledDate(date[1].toDate()) : true);
};
const handleClear = () => {
let valueOnClear = null;
if (pickerBase?.emptyValues) valueOnClear = pickerBase.emptyValues.valueOnClear.value;
const defaultArr = getDefaultValue((0, vue.unref)(defaultValue), {
lang: (0, vue.unref)(lang),
step,
unit,
unlinkPanels: props.unlinkPanels
});
leftDate.value = defaultArr[0];
rightDate.value = defaultArr[1];
emit("pick", valueOnClear);
};
function sortDates(minDate, maxDate) {
if (props.unlinkPanels && maxDate) {
const minDateYear = minDate?.year() || 0;
const maxDateYear = maxDate.year();
rightDate.value = minDateYear + step > maxDateYear ? maxDate.add(step, unit) : maxDate;
} else rightDate.value = leftDate.value.add(step, unit);
}
(0, vue.watch)(() => props.visible, (visible) => {
if (!visible && rangeState.value.selecting) {
parseValue(props.parsedValue);
onSelect(false);
}
});
emit("set-picker-option", ["isValidValue", isValidValue]);
emit("set-picker-option", ["parseUserInput", parseUserInput]);
emit("set-picker-option", ["handleClear", handleClear]);
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)(panelKls.value) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("body-wrapper")) }, [
(0, vue.renderSlot)(_ctx.$slots, "sidebar", { class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("sidebar")) }),
hasShortcuts.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("sidebar"))
}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(shortcuts), (shortcut, key) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key,
type: "button",
class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("shortcut")),
disabled: (0, vue.unref)(yearRangeDisabled),
onClick: ($event) => (0, vue.unref)(handleShortcutClick)(shortcut)
}, (0, vue.toDisplayString)(shortcut.text), 11, _hoisted_1$44);
}), 128))], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ppNs).e("body")) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)(leftPanelKls.value.content) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(drpNs).e("header")) }, [
(0, vue.createElementVNode)("button", {
type: "button",
class: (0, vue.normalizeClass)(leftPanelKls.value.arrowLeftBtn),
disabled: (0, vue.unref)(yearRangeDisabled),
onClick: _cache[0] || (_cache[0] = (...args) => (0, vue.unref)(leftPrevYear) && (0, vue.unref)(leftPrevYear)(...args))
}, [(0, vue.renderSlot)(_ctx.$slots, "prev-year", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(d_arrow_left_default))]),
_: 1
})])], 10, _hoisted_2$26),
_ctx.unlinkPanels ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key: 0,
type: "button",
disabled: !enableYearArrow.value || (0, vue.unref)(yearRangeDisabled),
class: (0, vue.normalizeClass)(leftPanelKls.value.arrowRightBtn),
onClick: _cache[1] || (_cache[1] = (...args) => (0, vue.unref)(leftNextYear) && (0, vue.unref)(leftNextYear)(...args))
}, [(0, vue.renderSlot)(_ctx.$slots, "next-year", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(d_arrow_right_default))]),
_: 1
})])], 10, _hoisted_3$11)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", null, (0, vue.toDisplayString)((0, vue.unref)(leftLabel)), 1)
], 2), (0, vue.createVNode)(basic_year_table_default, {
"selection-mode": "range",
date: leftDate.value,
"min-date": (0, vue.unref)(minDate),
"max-date": (0, vue.unref)(maxDate),
"range-state": (0, vue.unref)(rangeState),
"disabled-date": (0, vue.unref)(disabledDate),
disabled: (0, vue.unref)(yearRangeDisabled),
"cell-class-name": (0, vue.unref)(cellClassName),
onChangerange: (0, vue.unref)(handleChangeRange),
onPick: handleRangePick,
onSelect: (0, vue.unref)(onSelect)
}, null, 8, [
"date",
"min-date",
"max-date",
"range-state",
"disabled-date",
"disabled",
"cell-class-name",
"onChangerange",
"onSelect"
])], 2), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)(rightPanelKls.value.content) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(drpNs).e("header")) }, [
_ctx.unlinkPanels ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key: 0,
type: "button",
disabled: !enableYearArrow.value || (0, vue.unref)(yearRangeDisabled),
class: (0, vue.normalizeClass)(rightPanelKls.value.arrowLeftBtn),
onClick: _cache[2] || (_cache[2] = (...args) => (0, vue.unref)(rightPrevYear) && (0, vue.unref)(rightPrevYear)(...args))
}, [(0, vue.renderSlot)(_ctx.$slots, "prev-year", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(d_arrow_left_default))]),
_: 1
})])], 10, _hoisted_4$8)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("button", {
type: "button",
class: (0, vue.normalizeClass)(rightPanelKls.value.arrowRightBtn),
disabled: (0, vue.unref)(yearRangeDisabled),
onClick: _cache[3] || (_cache[3] = (...args) => (0, vue.unref)(rightNextYear) && (0, vue.unref)(rightNextYear)(...args))
}, [(0, vue.renderSlot)(_ctx.$slots, "next-year", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(d_arrow_right_default))]),
_: 1
})])], 10, _hoisted_5$5),
(0, vue.createElementVNode)("div", null, (0, vue.toDisplayString)((0, vue.unref)(rightLabel)), 1)
], 2), (0, vue.createVNode)(basic_year_table_default, {
"selection-mode": "range",
date: rightDate.value,
"min-date": (0, vue.unref)(minDate),
"max-date": (0, vue.unref)(maxDate),
"range-state": (0, vue.unref)(rangeState),
"disabled-date": (0, vue.unref)(disabledDate),
disabled: (0, vue.unref)(yearRangeDisabled),
"cell-class-name": (0, vue.unref)(cellClassName),
onChangerange: (0, vue.unref)(handleChangeRange),
onPick: handleRangePick,
onSelect: (0, vue.unref)(onSelect)
}, null, 8, [
"date",
"min-date",
"max-date",
"range-state",
"disabled-date",
"disabled",
"cell-class-name",
"onChangerange",
"onSelect"
])], 2)], 2)
], 2)], 2);
};
}
});
//#endregion
//#region ../../packages/components/date-picker-panel/src/date-picker-com/panel-year-range.vue
var panel_year_range_default = panel_year_range_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/date-picker-panel/src/panel-utils.ts
const getPanel = function(type) {
switch (type) {
case "daterange":
case "datetimerange": return panel_date_range_default;
case "monthrange": return panel_month_range_default;
case "yearrange": return panel_year_range_default;
default: return panel_date_pick_default;
}
};
//#endregion
//#region ../../packages/components/date-picker-panel/src/date-picker-panel.tsx
function _isSlot$7(s) {
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !(0, vue.isVNode)(s);
}
import_dayjs_min.default.extend(import_localeData.default);
import_dayjs_min.default.extend(import_advancedFormat.default);
import_dayjs_min.default.extend(import_customParseFormat.default);
import_dayjs_min.default.extend(import_weekOfYear.default);
import_dayjs_min.default.extend(import_weekYear.default);
import_dayjs_min.default.extend(import_dayOfYear.default);
import_dayjs_min.default.extend(import_isSameOrAfter.default);
import_dayjs_min.default.extend(import_isSameOrBefore.default);
var date_picker_panel_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElDatePickerPanel",
install: null,
inheritAttrs: false,
props: datePickerPanelProps,
emits: [
UPDATE_MODEL_EVENT,
"calendar-change",
"panel-change",
"visible-change",
"clear"
],
setup(props, { slots, emit, attrs }) {
const ns = useNamespace("picker-panel");
if (isUndefined((0, vue.inject)(PICKER_BASE_INJECTION_KEY, void 0))) (0, vue.provide)(PICKER_BASE_INJECTION_KEY, { props: (0, vue.reactive)({ ...(0, vue.toRefs)(props) }) });
(0, vue.provide)(ROOT_PICKER_INJECTION_KEY, {
slots,
pickerNs: ns
});
const { parsedValue, onCalendarChange, onPanelChange, onSetPickerOption, onPick } = (0, vue.inject)(ROOT_COMMON_PICKER_INJECTION_KEY, () => useCommonPicker(props, emit), true);
return () => {
return (0, vue.createVNode)(getPanel(props.type), (0, vue.mergeProps)(omit(attrs, "onPick"), props, {
"parsedValue": parsedValue.value,
"onSet-picker-option": onSetPickerOption,
"onCalendar-change": onCalendarChange,
"onPanel-change": onPanelChange,
"onClear": () => emit("clear"),
"onPick": onPick
}), _isSlot$7(slots) ? slots : { default: () => [slots] });
};
}
});
//#endregion
//#region ../../packages/components/date-picker-panel/index.ts
const ElDatePickerPanel = withInstall(date_picker_panel_default);
//#endregion
//#region ../../packages/components/date-picker/src/props.ts
const datePickerProps = buildProps({
...timePickerDefaultProps,
type: {
type: definePropType(String),
default: "date"
}
});
//#endregion
//#region ../../packages/components/date-picker/src/date-picker.tsx
function _isSlot$6(s) {
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !(0, vue.isVNode)(s);
}
var date_picker_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElDatePicker",
install: null,
props: datePickerProps,
emits: [UPDATE_MODEL_EVENT],
setup(props, { expose, emit, slots }) {
(0, vue.provide)(ROOT_PICKER_IS_DEFAULT_FORMAT_INJECTION_KEY, (0, vue.computed)(() => {
return !props.format;
}));
(0, vue.provide)(PICKER_POPPER_OPTIONS_INJECTION_KEY, (0, vue.reactive)((0, vue.toRef)(props, "popperOptions")));
const commonPicker = (0, vue.ref)();
expose({
focus: () => {
commonPicker.value?.focus();
},
blur: () => {
commonPicker.value?.blur();
},
handleOpen: () => {
commonPicker.value?.handleOpen();
},
handleClose: () => {
commonPicker.value?.handleClose();
}
});
const onModelValueUpdated = (val) => {
emit(UPDATE_MODEL_EVENT, val);
};
return () => {
const format = props.format ?? (DEFAULT_FORMATS_DATEPICKER[props.type] || DEFAULT_FORMATS_DATE);
return (0, vue.createVNode)(picker_default, (0, vue.mergeProps)(props, {
"format": format,
"type": props.type,
"ref": commonPicker,
"onUpdate:modelValue": onModelValueUpdated
}), {
default: (scopedProps) => (0, vue.createVNode)(ElDatePickerPanel, (0, vue.mergeProps)({
"disabled": props.disabled,
"editable": props.editable,
"border": false
}, scopedProps), _isSlot$6(slots) ? slots : { default: () => [slots] }),
"range-separator": slots["range-separator"]
});
};
}
});
//#endregion
//#region ../../packages/components/date-picker/index.ts
const ElDatePicker = withInstall(date_picker_default);
//#endregion
//#region ../../packages/components/descriptions/src/description.ts
/**
* @deprecated Removed after 3.0.0, Use `DescriptionProps` instead.
*/
const descriptionProps = buildProps({
border: Boolean,
column: {
type: Number,
default: 3
},
direction: {
type: String,
values: ["horizontal", "vertical"],
default: "horizontal"
},
size: useSizeProp,
title: {
type: String,
default: ""
},
extra: {
type: String,
default: ""
},
labelWidth: { type: [String, Number] }
});
//#endregion
//#region ../../packages/components/descriptions/src/descriptions-row.ts
/**
* @deprecated Removed after 3.0.0, Use `DescriptionsRowProps` instead.
*/
const descriptionsRowProps = buildProps({ row: {
type: definePropType(Array),
default: () => []
} });
//#endregion
//#region ../../packages/components/descriptions/src/token.ts
const descriptionsKey = Symbol("elDescriptions");
//#endregion
//#region ../../packages/components/descriptions/src/descriptions-cell.ts
var descriptions_cell_default = (0, vue.defineComponent)({
name: "ElDescriptionsCell",
props: {
cell: { type: Object },
tag: {
type: String,
default: "td"
},
type: { type: String }
},
setup() {
return { descriptions: (0, vue.inject)(descriptionsKey, {}) };
},
render() {
const item = getNormalizedProps(this.cell);
const directives = (this.cell?.dirs || []).map((dire) => {
const { dir, arg, modifiers, value } = dire;
return [
dir,
value,
arg,
modifiers
];
});
const { border, direction } = this.descriptions;
const isVertical = direction === "vertical";
const renderLabel = () => this.cell?.children?.label?.() || item.label;
const renderContent = () => this.cell?.children?.default?.();
const span = item.span;
const rowspan = item.rowspan;
const align = item.align ? `is-${item.align}` : "";
const labelAlign = item.labelAlign ? `is-${item.labelAlign}` : align;
const className = item.className;
const labelClassName = item.labelClassName;
const style = {
width: addUnit(this.type === "label" ? item.labelWidth ?? this.descriptions.labelWidth ?? item.width : item.width),
minWidth: addUnit(item.minWidth)
};
const ns = useNamespace("descriptions");
switch (this.type) {
case "label": return (0, vue.withDirectives)((0, vue.h)(this.tag, {
style,
class: [
ns.e("cell"),
ns.e("label"),
ns.is("bordered-label", border),
ns.is("vertical-label", isVertical),
labelAlign,
labelClassName
],
colSpan: isVertical ? span : 1,
rowspan: isVertical ? 1 : rowspan
}, renderLabel()), directives);
case "content": return (0, vue.withDirectives)((0, vue.h)(this.tag, {
style,
class: [
ns.e("cell"),
ns.e("content"),
ns.is("bordered-content", border),
ns.is("vertical-content", isVertical),
align,
className
],
colSpan: isVertical ? span : span * 2 - 1,
rowspan: isVertical ? rowspan * 2 - 1 : rowspan
}, renderContent()), directives);
default: {
const label = renderLabel();
const labelStyle = {};
const width = addUnit(item.labelWidth ?? this.descriptions.labelWidth);
if (width) {
labelStyle.width = width;
labelStyle.display = "inline-block";
}
return (0, vue.withDirectives)((0, vue.h)("td", {
style,
class: [ns.e("cell"), align],
colSpan: span,
rowspan
}, [!isNil(label) ? (0, vue.h)("span", {
style: labelStyle,
class: [ns.e("label"), labelClassName]
}, label) : void 0, (0, vue.h)("span", { class: [ns.e("content"), className] }, renderContent())]), directives);
}
}
}
});
//#endregion
//#region ../../packages/components/descriptions/src/descriptions-row.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$43 = { key: 1 };
var descriptions_row_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElDescriptionsRow",
__name: "descriptions-row",
props: descriptionsRowProps,
setup(__props) {
const descriptions = (0, vue.inject)(descriptionsKey, {});
return (_ctx, _cache) => {
return (0, vue.unref)(descriptions).direction === "vertical" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [(0, vue.createElementVNode)("tr", null, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.row, (cell, _index) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(descriptions_cell_default), {
key: `tr1-${_index}`,
cell,
tag: "th",
type: "label"
}, null, 8, ["cell"]);
}), 128))]), (0, vue.createElementVNode)("tr", null, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.row, (cell, _index) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(descriptions_cell_default), {
key: `tr2-${_index}`,
cell,
tag: "td",
type: "content"
}, null, 8, ["cell"]);
}), 128))])], 64)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("tr", _hoisted_1$43, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.row, (cell, _index) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: `tr3-${_index}` }, [(0, vue.unref)(descriptions).border ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [(0, vue.createVNode)((0, vue.unref)(descriptions_cell_default), {
cell,
tag: "td",
type: "label"
}, null, 8, ["cell"]), (0, vue.createVNode)((0, vue.unref)(descriptions_cell_default), {
cell,
tag: "td",
type: "content"
}, null, 8, ["cell"])], 64)) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(descriptions_cell_default), {
key: 1,
cell,
tag: "td",
type: "both"
}, null, 8, ["cell"]))], 64);
}), 128))]));
};
}
});
//#endregion
//#region ../../packages/components/descriptions/src/descriptions-row.vue
var descriptions_row_default = descriptions_row_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/descriptions/src/constants.ts
const COMPONENT_NAME$10 = "ElDescriptionsItem";
//#endregion
//#region ../../packages/components/descriptions/src/description.vue?vue&type=script&setup=true&lang.ts
var description_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElDescriptions",
__name: "description",
props: descriptionProps,
setup(__props) {
const props = __props;
const ns = useNamespace("descriptions");
const descriptionsSize = useFormSize();
const slots = (0, vue.useSlots)();
(0, vue.provide)(descriptionsKey, props);
const descriptionKls = (0, vue.computed)(() => [ns.b(), ns.m(descriptionsSize.value)]);
const filledNode = (node, span, count, isLast = false) => {
if (!node.props) node.props = {};
if (span > count) node.props.span = count;
if (isLast) node.props.span = span;
return node;
};
const getRows = () => {
if (!slots.default) return [];
const children = flattedChildren(slots.default()).filter((node) => node?.type?.name === COMPONENT_NAME$10);
const rows = [];
let temp = [];
let count = props.column;
let totalSpan = 0;
const rowspanTemp = [];
children.forEach((node, index) => {
const span = node.props?.span || 1;
const rowspan = node.props?.rowspan || 1;
const rowNo = rows.length;
rowspanTemp[rowNo] ||= 0;
if (rowspan > 1) for (let i = 1; i < rowspan; i++) {
rowspanTemp[rowNo + i] ||= 0;
rowspanTemp[rowNo + i]++;
totalSpan++;
}
if (rowspanTemp[rowNo] > 0) {
count -= rowspanTemp[rowNo];
rowspanTemp[rowNo] = 0;
}
if (index < children.length - 1) totalSpan += span > count ? count : span;
if (index === children.length - 1) {
const lastSpan = props.column - totalSpan % props.column;
temp.push(filledNode(node, lastSpan, count, true));
rows.push(temp);
return;
}
if (span < count) {
count -= span;
temp.push(node);
} else {
temp.push(filledNode(node, span, count));
rows.push(temp);
count = props.column;
temp = [];
}
});
return rows;
};
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)(descriptionKls.value) }, [__props.title || __props.extra || _ctx.$slots.title || _ctx.$slots.extra ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("header"))
}, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("title")) }, [(0, vue.renderSlot)(_ctx.$slots, "title", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.title), 1)])], 2), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("extra")) }, [(0, vue.renderSlot)(_ctx.$slots, "extra", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.extra), 1)])], 2)], 2)) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("body")) }, [(0, vue.createElementVNode)("table", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("table"), (0, vue.unref)(ns).is("bordered", __props.border)]) }, [(0, vue.createElementVNode)("tbody", null, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(getRows(), (row, _index) => {
return (0, vue.openBlock)(), (0, vue.createBlock)(descriptions_row_default, {
key: _index,
row
}, null, 8, ["row"]);
}), 128))])], 2)], 2)], 2);
};
}
});
//#endregion
//#region ../../packages/components/descriptions/src/description.vue
var description_default = description_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/descriptions/src/description-item.ts
const descriptionItemProps = buildProps({
label: {
type: String,
default: ""
},
span: {
type: Number,
default: 1
},
rowspan: {
type: Number,
default: 1
},
width: {
type: [String, Number],
default: ""
},
minWidth: {
type: [String, Number],
default: ""
},
labelWidth: { type: [String, Number] },
align: {
type: String,
values: columnAlignment,
default: "left"
},
labelAlign: {
type: String,
values: columnAlignment
},
className: {
type: String,
default: ""
},
labelClassName: {
type: String,
default: ""
}
});
const DescriptionItem = (0, vue.defineComponent)({
name: COMPONENT_NAME$10,
props: descriptionItemProps
});
//#endregion
//#region ../../packages/components/descriptions/index.ts
const ElDescriptions = withInstall(description_default, { DescriptionsItem: DescriptionItem });
const ElDescriptionsItem = withNoopInstall(DescriptionItem);
//#endregion
//#region ../../packages/components/dialog/src/dialog-content.ts
/**
* @deprecated Removed after 3.0.0, Use `DialogContentProps` instead.
*/
const dialogContentProps = buildProps({
center: Boolean,
alignCenter: {
type: Boolean,
default: void 0
},
closeIcon: { type: iconPropType },
draggable: {
type: Boolean,
default: void 0
},
overflow: {
type: Boolean,
default: void 0
},
fullscreen: Boolean,
headerClass: String,
bodyClass: String,
footerClass: String,
showClose: {
type: Boolean,
default: true
},
title: {
type: String,
default: ""
},
ariaLevel: {
type: String,
default: "2"
}
});
const dialogContentEmits = { close: () => true };
const dialogContentPropsDefaults = {
alignCenter: void 0,
draggable: void 0,
overflow: void 0,
showClose: true,
title: "",
ariaLevel: "2"
};
//#endregion
//#region ../../packages/components/dialog/src/dialog.ts
/**
* @deprecated Removed after 3.0.0, Use `DialogProps` instead.
*/
const dialogProps = buildProps({
...dialogContentProps,
appendToBody: Boolean,
appendTo: {
type: teleportProps.to.type,
default: "body"
},
beforeClose: { type: definePropType(Function) },
destroyOnClose: Boolean,
closeOnClickModal: {
type: Boolean,
default: true
},
closeOnPressEscape: {
type: Boolean,
default: true
},
lockScroll: {
type: Boolean,
default: true
},
modal: {
type: Boolean,
default: true
},
modalPenetrable: Boolean,
openDelay: {
type: Number,
default: 0
},
closeDelay: {
type: Number,
default: 0
},
top: { type: String },
modelValue: Boolean,
modalClass: String,
headerClass: String,
bodyClass: String,
footerClass: String,
width: { type: [String, Number] },
zIndex: { type: Number },
trapFocus: Boolean,
headerAriaLevel: {
type: String,
default: "2"
},
transition: {
type: definePropType([String, Object]),
default: void 0
}
});
const dialogEmits = {
open: () => true,
opened: () => true,
close: () => true,
closed: () => true,
[UPDATE_MODEL_EVENT]: (value) => isBoolean(value),
openAutoFocus: () => true,
closeAutoFocus: () => true
};
const dialogContextKey = Symbol("dialogContextKey");
const dialogPropsDefaults = {
...dialogContentPropsDefaults,
appendTo: "body",
closeOnClickModal: true,
closeOnPressEscape: true,
lockScroll: true,
modal: true,
openDelay: 0,
closeDelay: 0,
headerAriaLevel: "2",
transition: void 0
};
//#endregion
//#region ../../packages/components/overlay/src/overlay.ts
const overlayProps = buildProps({
mask: {
type: Boolean,
default: true
},
customMaskEvent: Boolean,
overlayClass: { type: definePropType([
String,
Array,
Object
]) },
zIndex: { type: definePropType([String, Number]) }
});
const overlayEmits = { click: (evt) => evt instanceof MouseEvent };
const BLOCK = "overlay";
var overlay_default = (0, vue.defineComponent)({
name: "ElOverlay",
props: overlayProps,
emits: overlayEmits,
setup(props, { slots, emit }) {
const ns = useNamespace(BLOCK);
const onMaskClick = (e) => {
emit("click", e);
};
const { onClick, onMousedown, onMouseup } = useSameTarget(props.customMaskEvent ? void 0 : onMaskClick);
return () => {
return props.mask ? (0, vue.createVNode)("div", {
class: [ns.b(), props.overlayClass],
style: { zIndex: props.zIndex },
onClick,
onMousedown,
onMouseup
}, [(0, vue.renderSlot)(slots, "default")], PatchFlags.STYLE | PatchFlags.CLASS | PatchFlags.PROPS, [
"onClick",
"onMouseup",
"onMousedown"
]) : (0, vue.h)("div", {
class: props.overlayClass,
style: {
zIndex: props.zIndex,
position: "fixed",
top: "0px",
right: "0px",
bottom: "0px",
left: "0px"
}
}, [(0, vue.renderSlot)(slots, "default")]);
};
}
});
//#endregion
//#region ../../packages/components/overlay/index.ts
const ElOverlay = overlay_default;
//#endregion
//#region ../../packages/components/dialog/src/constants.ts
const dialogInjectionKey = Symbol("dialogInjectionKey");
const DEFAULT_DIALOG_TRANSITION = "dialog-fade";
//#endregion
//#region ../../packages/components/dialog/src/dialog-content.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$42 = ["aria-level"];
const _hoisted_2$25 = ["aria-label"];
const _hoisted_3$10 = ["id"];
var dialog_content_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElDialogContent",
__name: "dialog-content",
props: dialogContentProps,
emits: dialogContentEmits,
setup(__props, { expose: __expose }) {
const { t } = useLocale();
const { Close } = CloseComponents;
const props = __props;
const { dialogRef, headerRef, bodyId, ns, style } = (0, vue.inject)(dialogInjectionKey);
const { focusTrapRef } = (0, vue.inject)(FOCUS_TRAP_INJECTION_KEY);
const composedDialogRef = composeRefs(focusTrapRef, dialogRef);
const draggable = (0, vue.computed)(() => !!props.draggable);
const { resetPosition, updatePosition, isDragging } = useDraggable(dialogRef, headerRef, draggable, (0, vue.computed)(() => !!props.overflow));
const dialogKls = (0, vue.computed)(() => [
ns.b(),
ns.is("fullscreen", props.fullscreen),
ns.is("draggable", draggable.value),
ns.is("dragging", isDragging.value),
ns.is("align-center", !!props.alignCenter),
{ [ns.m("center")]: props.center }
]);
__expose({
resetPosition,
updatePosition
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref: (0, vue.unref)(composedDialogRef),
class: (0, vue.normalizeClass)(dialogKls.value),
style: (0, vue.normalizeStyle)((0, vue.unref)(style)),
tabindex: "-1"
}, [
(0, vue.createElementVNode)("header", {
ref_key: "headerRef",
ref: headerRef,
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).e("header"),
__props.headerClass,
{ "show-close": __props.showClose }
])
}, [(0, vue.renderSlot)(_ctx.$slots, "header", {}, () => [(0, vue.createElementVNode)("span", {
role: "heading",
"aria-level": __props.ariaLevel,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("title"))
}, (0, vue.toDisplayString)(__props.title), 11, _hoisted_1$42)]), __props.showClose ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key: 0,
"aria-label": (0, vue.unref)(t)("el.dialog.close"),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("headerbtn")),
type: "button",
onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("close"))
}, [(0, vue.createVNode)((0, vue.unref)(ElIcon), { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("close")) }, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.closeIcon || (0, vue.unref)(Close))))]),
_: 1
}, 8, ["class"])], 10, _hoisted_2$25)) : (0, vue.createCommentVNode)("v-if", true)], 2),
(0, vue.createElementVNode)("div", {
id: (0, vue.unref)(bodyId),
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("body"), __props.bodyClass])
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 10, _hoisted_3$10),
_ctx.$slots.footer ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("footer", {
key: 0,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("footer"), __props.footerClass])
}, [(0, vue.renderSlot)(_ctx.$slots, "footer")], 2)) : (0, vue.createCommentVNode)("v-if", true)
], 6);
};
}
});
//#endregion
//#region ../../packages/components/dialog/src/dialog-content.vue
var dialog_content_default = dialog_content_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/dialog/src/use-dialog.ts
const COMPONENT_NAME$9 = "ElDialog";
const useDialog = (props, targetRef) => {
const emit = (0, vue.getCurrentInstance)().emit;
const { nextZIndex } = useZIndex();
let lastPosition = "";
const titleId = useId();
const bodyId = useId();
const visible = (0, vue.ref)(false);
const closed = (0, vue.ref)(false);
const rendered = (0, vue.ref)(false);
const zIndex = (0, vue.ref)(props.zIndex ?? nextZIndex());
const closing = (0, vue.ref)(false);
let openTimer = void 0;
let closeTimer = void 0;
const config = useGlobalConfig();
const namespace = (0, vue.computed)(() => config.value?.namespace ?? defaultNamespace);
const globalConfig = (0, vue.computed)(() => config.value?.dialog);
const style = (0, vue.computed)(() => {
const style = {};
const varPrefix = `--${namespace.value}-dialog`;
if (!props.fullscreen) {
if (props.top) style[`${varPrefix}-margin-top`] = props.top;
const width = addUnit(props.width);
if (width) style[`${varPrefix}-width`] = width;
}
return style;
});
const _draggable = (0, vue.computed)(() => (props.draggable ?? globalConfig.value?.draggable ?? false) && !props.fullscreen);
const _alignCenter = (0, vue.computed)(() => props.alignCenter ?? globalConfig.value?.alignCenter ?? false);
const _overflow = (0, vue.computed)(() => props.overflow ?? globalConfig.value?.overflow ?? false);
const penetrable = (0, vue.computed)(() => props.modalPenetrable && !props.modal && !props.fullscreen);
const overlayDialogStyle = (0, vue.computed)(() => {
if (_alignCenter.value) return { display: "flex" };
return {};
});
const transitionConfig = (0, vue.computed)(() => {
const transition = props.transition ?? globalConfig.value?.transition ?? DEFAULT_DIALOG_TRANSITION;
const baseConfig = {
name: transition,
onAfterEnter: afterEnter,
onBeforeLeave: beforeLeave,
onAfterLeave: afterLeave
};
if (isObject$1(transition)) {
const config = { ...transition };
const _mergeHook = (userHook, defaultHook) => {
return (el) => {
if (isArray$1(userHook)) userHook.forEach((fn) => {
if (isFunction$1(fn)) fn(el);
});
else if (isFunction$1(userHook)) userHook(el);
defaultHook();
};
};
config.onAfterEnter = _mergeHook(config.onAfterEnter, afterEnter);
config.onBeforeLeave = _mergeHook(config.onBeforeLeave, beforeLeave);
config.onAfterLeave = _mergeHook(config.onAfterLeave, afterLeave);
if (!config.name) {
config.name = DEFAULT_DIALOG_TRANSITION;
/* @__PURE__ */ debugWarn(COMPONENT_NAME$9, `transition.name is missing when using object syntax, fallback to '${DEFAULT_DIALOG_TRANSITION}'`);
}
return config;
}
return baseConfig;
});
function afterEnter() {
emit("opened");
}
function afterLeave() {
emit("closed");
emit(UPDATE_MODEL_EVENT, false);
if (props.destroyOnClose) rendered.value = false;
closing.value = false;
}
function beforeLeave() {
closing.value = true;
emit("close");
}
function open() {
closeTimer?.();
openTimer?.();
if (props.openDelay && props.openDelay > 0) ({stop: openTimer} = useTimeoutFn(() => doOpen(), props.openDelay));
else doOpen();
}
function close() {
openTimer?.();
closeTimer?.();
if (props.closeDelay && props.closeDelay > 0) ({stop: closeTimer} = useTimeoutFn(() => doClose(), props.closeDelay));
else doClose();
}
function handleClose() {
function hide(shouldCancel) {
if (shouldCancel) return;
closed.value = true;
visible.value = false;
}
if (props.beforeClose) props.beforeClose(hide);
else close();
}
function onModalClick() {
if (props.closeOnClickModal) handleClose();
}
function doOpen() {
if (!isClient) return;
visible.value = true;
}
function doClose() {
visible.value = false;
}
function onOpenAutoFocus() {
emit("openAutoFocus");
}
function onCloseAutoFocus() {
emit("closeAutoFocus");
}
function onFocusoutPrevented(event) {
if (event.detail?.focusReason === "pointer") event.preventDefault();
}
if (props.lockScroll) useLockscreen(visible);
function onCloseRequested() {
if (props.closeOnPressEscape) handleClose();
}
function bringToFront() {
if (!visible.value || !penetrable.value || props.zIndex !== void 0) return;
zIndex.value = nextZIndex();
}
(0, vue.watch)(() => props.zIndex, () => {
zIndex.value = props.zIndex ?? nextZIndex();
});
(0, vue.watch)(() => props.modelValue, (val) => {
if (val) {
closed.value = false;
closing.value = false;
open();
rendered.value = true;
zIndex.value = props.zIndex ?? nextZIndex();
(0, vue.nextTick)(() => {
emit("open");
if (targetRef.value) {
targetRef.value.parentElement.scrollTop = 0;
targetRef.value.parentElement.scrollLeft = 0;
targetRef.value.scrollTop = 0;
}
});
} else if (visible.value) close();
});
(0, vue.watch)(() => props.fullscreen, (val) => {
if (!targetRef.value) return;
if (val) {
lastPosition = targetRef.value.style.transform;
targetRef.value.style.transform = "";
} else targetRef.value.style.transform = lastPosition;
});
(0, vue.onMounted)(() => {
if (props.modelValue) {
visible.value = true;
rendered.value = true;
open();
}
});
return {
afterEnter,
afterLeave,
beforeLeave,
handleClose,
onModalClick,
close,
doClose,
onOpenAutoFocus,
onCloseAutoFocus,
onCloseRequested,
onFocusoutPrevented,
bringToFront,
titleId,
bodyId,
closed,
style,
overlayDialogStyle,
rendered,
visible,
zIndex,
transitionConfig,
_draggable,
_alignCenter,
_overflow,
closing,
penetrable
};
};
//#endregion
//#region ../../packages/components/dialog/src/dialog.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$41 = [
"aria-label",
"aria-labelledby",
"aria-describedby"
];
var dialog_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElDialog",
inheritAttrs: false,
__name: "dialog",
props: dialogProps,
emits: dialogEmits,
setup(__props, { expose: __expose }) {
const props = __props;
const slots = (0, vue.useSlots)();
useDeprecated({
scope: "el-dialog",
from: "the title slot",
replacement: "the header slot",
version: "3.0.0",
ref: "https://element-plus.org/en-US/component/dialog.html#slots"
}, (0, vue.computed)(() => !!slots.title));
const ns = useNamespace("dialog");
const dialogRef = (0, vue.ref)();
const headerRef = (0, vue.ref)();
const dialogContentRef = (0, vue.ref)();
const { visible, titleId, bodyId, style, overlayDialogStyle, rendered, transitionConfig, zIndex, _draggable, _alignCenter, _overflow, penetrable, handleClose, onModalClick, onOpenAutoFocus, onCloseAutoFocus, onCloseRequested, onFocusoutPrevented, bringToFront, closing } = useDialog(props, dialogRef);
(0, vue.provide)(dialogInjectionKey, {
dialogRef,
headerRef,
bodyId,
ns,
rendered,
style
});
const overlayEvent = useSameTarget(onModalClick);
const resetPosition = () => {
dialogContentRef.value?.resetPosition();
};
__expose({
visible,
dialogContentRef,
resetPosition,
handleClose
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElTeleport), {
to: __props.appendTo,
disabled: __props.appendTo !== "body" ? false : !__props.appendToBody
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)(vue.Transition, (0, vue.mergeProps)((0, vue.unref)(transitionConfig), { persisted: "" }), {
default: (0, vue.withCtx)(() => [(0, vue.withDirectives)((0, vue.createVNode)((0, vue.unref)(ElOverlay), {
"custom-mask-event": "",
mask: __props.modal,
"overlay-class": [
__props.modalClass ?? "",
`${(0, vue.unref)(ns).namespace.value}-modal-dialog`,
(0, vue.unref)(ns).is("penetrable", (0, vue.unref)(penetrable))
],
"z-index": (0, vue.unref)(zIndex)
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", {
role: "dialog",
"aria-modal": "true",
"aria-label": __props.title || void 0,
"aria-labelledby": !__props.title ? (0, vue.unref)(titleId) : void 0,
"aria-describedby": (0, vue.unref)(bodyId),
class: (0, vue.normalizeClass)([`${(0, vue.unref)(ns).namespace.value}-overlay-dialog`, (0, vue.unref)(ns).is("closing", (0, vue.unref)(closing))]),
style: (0, vue.normalizeStyle)((0, vue.unref)(overlayDialogStyle)),
onClick: _cache[0] || (_cache[0] = (...args) => (0, vue.unref)(overlayEvent).onClick && (0, vue.unref)(overlayEvent).onClick(...args)),
onMousedown: _cache[1] || (_cache[1] = (...args) => (0, vue.unref)(overlayEvent).onMousedown && (0, vue.unref)(overlayEvent).onMousedown(...args)),
onMouseup: _cache[2] || (_cache[2] = (...args) => (0, vue.unref)(overlayEvent).onMouseup && (0, vue.unref)(overlayEvent).onMouseup(...args))
}, [(0, vue.createVNode)((0, vue.unref)(focus_trap_default), {
loop: "",
trapped: (0, vue.unref)(visible),
"focus-start-el": "container",
onFocusAfterTrapped: (0, vue.unref)(onOpenAutoFocus),
onFocusAfterReleased: (0, vue.unref)(onCloseAutoFocus),
onFocusoutPrevented: (0, vue.unref)(onFocusoutPrevented),
onReleaseRequested: (0, vue.unref)(onCloseRequested)
}, {
default: (0, vue.withCtx)(() => [(0, vue.unref)(rendered) ? ((0, vue.openBlock)(), (0, vue.createBlock)(dialog_content_default, (0, vue.mergeProps)({
key: 0,
ref_key: "dialogContentRef",
ref: dialogContentRef
}, _ctx.$attrs, {
center: __props.center,
"align-center": (0, vue.unref)(_alignCenter),
"close-icon": __props.closeIcon,
draggable: (0, vue.unref)(_draggable),
overflow: (0, vue.unref)(_overflow),
fullscreen: __props.fullscreen,
"header-class": __props.headerClass,
"body-class": __props.bodyClass,
"footer-class": __props.footerClass,
"show-close": __props.showClose,
title: __props.title,
"aria-level": __props.headerAriaLevel,
onClose: (0, vue.unref)(handleClose),
onMousedown: (0, vue.unref)(bringToFront)
}), (0, vue.createSlots)({
header: (0, vue.withCtx)(() => [!_ctx.$slots.title ? (0, vue.renderSlot)(_ctx.$slots, "header", {
key: 0,
close: (0, vue.unref)(handleClose),
titleId: (0, vue.unref)(titleId),
titleClass: (0, vue.unref)(ns).e("title")
}) : (0, vue.renderSlot)(_ctx.$slots, "title", { key: 1 })]),
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 2
}, [_ctx.$slots.footer ? {
name: "footer",
fn: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "footer")]),
key: "0"
} : void 0]), 1040, [
"center",
"align-center",
"close-icon",
"draggable",
"overflow",
"fullscreen",
"header-class",
"body-class",
"footer-class",
"show-close",
"title",
"aria-level",
"onClose",
"onMousedown"
])) : (0, vue.createCommentVNode)("v-if", true)]),
_: 3
}, 8, [
"trapped",
"onFocusAfterTrapped",
"onFocusAfterReleased",
"onFocusoutPrevented",
"onReleaseRequested"
])], 46, _hoisted_1$41)]),
_: 3
}, 8, [
"mask",
"overlay-class",
"z-index"
]), [[vue.vShow, (0, vue.unref)(visible)]])]),
_: 3
}, 16)]),
_: 3
}, 8, ["to", "disabled"]);
};
}
});
//#endregion
//#region ../../packages/components/dialog/src/dialog.vue
var dialog_default = dialog_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/dialog/index.ts
const ElDialog = withInstall(dialog_default);
//#endregion
//#region ../../packages/components/divider/src/divider.ts
/**
* @deprecated Removed after 3.0.0, Use `DividerProps` instead.
*/
const dividerProps = buildProps({
direction: {
type: String,
values: ["horizontal", "vertical"],
default: "horizontal"
},
contentPosition: {
type: String,
values: [
"left",
"center",
"right"
],
default: "center"
},
borderStyle: {
type: definePropType(String),
default: "solid"
}
});
//#endregion
//#region ../../packages/components/divider/src/divider.vue?vue&type=script&setup=true&lang.ts
var divider_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElDivider",
__name: "divider",
props: dividerProps,
setup(__props) {
const props = __props;
const ns = useNamespace("divider");
const dividerStyle = (0, vue.computed)(() => {
return ns.cssVar({ "border-style": props.borderStyle });
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).b(), (0, vue.unref)(ns).m(__props.direction)]),
style: (0, vue.normalizeStyle)(dividerStyle.value),
role: "separator"
}, [_ctx.$slots.default && __props.direction !== "vertical" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("text"), (0, vue.unref)(ns).is(__props.contentPosition)])
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2)) : (0, vue.createCommentVNode)("v-if", true)], 6);
};
}
});
//#endregion
//#region ../../packages/components/divider/src/divider.vue
var divider_default = divider_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/divider/index.ts
const ElDivider = withInstall(divider_default);
//#endregion
//#region ../../packages/components/drawer/src/drawer.ts
/**
* @deprecated Removed after 3.0.0, Use `DrawerProps` instead.
*/
const drawerProps = buildProps({
...dialogProps,
direction: {
type: String,
default: "rtl",
values: [
"ltr",
"rtl",
"ttb",
"btt"
]
},
resizable: Boolean,
size: {
type: [String, Number],
default: "30%"
},
withHeader: {
type: Boolean,
default: true
},
modalFade: {
type: Boolean,
default: true
},
headerAriaLevel: {
type: String,
default: "2"
}
});
const drawerEmits = {
...dialogEmits,
"resize-start": (evt, size) => evt instanceof MouseEvent && typeof size === "number",
resize: (evt, size) => evt instanceof MouseEvent && typeof size === "number",
"resize-end": (evt, size) => evt instanceof MouseEvent && typeof size === "number"
};
//#endregion
//#region ../../packages/components/drawer/src/composables/useResizable.ts
function useResizable(props, target, emit) {
const { width, height } = useWindowSize();
const isHorizontal = (0, vue.computed)(() => ["ltr", "rtl"].includes(props.direction));
const sign = (0, vue.computed)(() => ["ltr", "ttb"].includes(props.direction) ? 1 : -1);
const windowSize = (0, vue.computed)(() => isHorizontal.value ? width.value : height.value);
const getSize = (0, vue.computed)(() => {
return clamp$2(startSize.value + sign.value * offset.value, 4, windowSize.value);
});
const startSize = (0, vue.ref)(0);
const offset = (0, vue.ref)(0);
const isResizing = (0, vue.ref)(false);
const hasStartedDragging = (0, vue.ref)(false);
let startPos = [];
let cleanups = [];
const getActualSize = () => {
const drawerEl = target.value?.closest("[aria-modal=\"true\"]");
if (drawerEl) return isHorizontal.value ? drawerEl.offsetWidth : drawerEl.offsetHeight;
return 100;
};
(0, vue.watch)(() => [props.size, props.resizable], () => {
hasStartedDragging.value = false;
startSize.value = 0;
offset.value = 0;
onMouseUp();
});
const onMousedown = (e) => {
if (!props.resizable) return;
if (!hasStartedDragging.value) {
startSize.value = getActualSize();
hasStartedDragging.value = true;
}
startPos = [e.pageX, e.pageY];
isResizing.value = true;
emit("resize-start", e, startSize.value);
cleanups.push(useEventListener(window, "mouseup", onMouseUp), useEventListener(window, "mousemove", onMouseMove));
};
const onMouseMove = (e) => {
const { pageX, pageY } = e;
const offsetX = pageX - startPos[0];
const offsetY = pageY - startPos[1];
offset.value = isHorizontal.value ? offsetX : offsetY;
emit("resize", e, getSize.value);
};
const onMouseUp = (e) => {
if (!isResizing.value) return;
startPos = [];
startSize.value = getSize.value;
offset.value = 0;
isResizing.value = false;
cleanups.forEach((cleanup) => cleanup?.());
cleanups = [];
if (e) emit("resize-end", e, startSize.value);
};
const cleanup = useEventListener(target, "mousedown", onMousedown);
(0, vue.onBeforeUnmount)(() => {
cleanup();
onMouseUp();
});
return {
size: (0, vue.computed)(() => {
return hasStartedDragging.value ? `${getSize.value}px` : addUnit(props.size);
}),
isResizing,
isHorizontal
};
}
//#endregion
//#region ../../packages/components/drawer/src/drawer.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$40 = [
"aria-label",
"aria-labelledby",
"aria-describedby"
];
const _hoisted_2$24 = ["id", "aria-level"];
const _hoisted_3$9 = ["aria-label"];
const _hoisted_4$7 = ["id"];
var drawer_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElDrawer",
inheritAttrs: false,
__name: "drawer",
props: drawerProps,
emits: drawerEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const slots = (0, vue.useSlots)();
useDeprecated({
scope: "el-drawer",
from: "the title slot",
replacement: "the header slot",
version: "3.0.0",
ref: "https://element-plus.org/en-US/component/drawer.html#slots"
}, (0, vue.computed)(() => !!slots.title));
const drawerRef = (0, vue.ref)();
const focusStartRef = (0, vue.ref)();
const draggerRef = (0, vue.ref)();
const ns = useNamespace("drawer");
const { t } = useLocale();
const { afterEnter, afterLeave, beforeLeave, visible, rendered, titleId, bodyId, zIndex, onModalClick, onOpenAutoFocus, onCloseAutoFocus, onFocusoutPrevented, onCloseRequested, handleClose } = useDialog(props, drawerRef);
const { isHorizontal, size, isResizing } = useResizable(props, draggerRef, emit);
const penetrable = (0, vue.computed)(() => props.modalPenetrable && !props.modal);
__expose({
handleClose,
afterEnter,
afterLeave
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElTeleport), {
to: __props.appendTo,
disabled: __props.appendTo !== "body" ? false : !__props.appendToBody
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)(vue.Transition, {
name: (0, vue.unref)(ns).b("fade"),
onAfterEnter: (0, vue.unref)(afterEnter),
onAfterLeave: (0, vue.unref)(afterLeave),
onBeforeLeave: (0, vue.unref)(beforeLeave),
persisted: ""
}, {
default: (0, vue.withCtx)(() => [(0, vue.withDirectives)((0, vue.createVNode)((0, vue.unref)(ElOverlay), {
mask: __props.modal,
"overlay-class": [
(0, vue.unref)(ns).is("drawer"),
__props.modalClass ?? "",
`${(0, vue.unref)(ns).namespace.value}-modal-drawer`,
(0, vue.unref)(ns).is("penetrable", penetrable.value)
],
"z-index": (0, vue.unref)(zIndex),
onClick: (0, vue.unref)(onModalClick)
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(focus_trap_default), {
loop: "",
trapped: (0, vue.unref)(visible),
"focus-trap-el": drawerRef.value,
"focus-start-el": focusStartRef.value,
onFocusAfterTrapped: (0, vue.unref)(onOpenAutoFocus),
onFocusAfterReleased: (0, vue.unref)(onCloseAutoFocus),
onFocusoutPrevented: (0, vue.unref)(onFocusoutPrevented),
onReleaseRequested: (0, vue.unref)(onCloseRequested)
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", (0, vue.mergeProps)({
ref_key: "drawerRef",
ref: drawerRef,
"aria-modal": "true",
"aria-label": __props.title || void 0,
"aria-labelledby": !__props.title ? (0, vue.unref)(titleId) : void 0,
"aria-describedby": (0, vue.unref)(bodyId)
}, _ctx.$attrs, {
class: [
(0, vue.unref)(ns).b(),
__props.direction,
(0, vue.unref)(visible) && "open",
(0, vue.unref)(ns).is("dragging", (0, vue.unref)(isResizing))
],
style: { [(0, vue.unref)(isHorizontal) ? "width" : "height"]: (0, vue.unref)(size) },
role: "dialog",
onClick: _cache[1] || (_cache[1] = (0, vue.withModifiers)(() => {}, ["stop"]))
}), [
(0, vue.createElementVNode)("span", {
ref_key: "focusStartRef",
ref: focusStartRef,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("sr-focus")),
tabindex: "-1"
}, null, 2),
__props.withHeader ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("header", {
key: 0,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("header"), __props.headerClass])
}, [!_ctx.$slots.title ? (0, vue.renderSlot)(_ctx.$slots, "header", {
key: 0,
close: (0, vue.unref)(handleClose),
titleId: (0, vue.unref)(titleId),
titleClass: (0, vue.unref)(ns).e("title")
}, () => [(0, vue.createElementVNode)("span", {
id: (0, vue.unref)(titleId),
role: "heading",
"aria-level": __props.headerAriaLevel,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("title"))
}, (0, vue.toDisplayString)(__props.title), 11, _hoisted_2$24)]) : (0, vue.renderSlot)(_ctx.$slots, "title", { key: 1 }, () => [(0, vue.createCommentVNode)(" DEPRECATED SLOT ")]), __props.showClose ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key: 2,
"aria-label": (0, vue.unref)(t)("el.drawer.close"),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("close-btn")),
type: "button",
onClick: _cache[0] || (_cache[0] = (...args) => (0, vue.unref)(handleClose) && (0, vue.unref)(handleClose)(...args))
}, [(0, vue.createVNode)((0, vue.unref)(ElIcon), { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("close")) }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(close_default))]),
_: 1
}, 8, ["class"])], 10, _hoisted_3$9)) : (0, vue.createCommentVNode)("v-if", true)], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.unref)(rendered) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
id: (0, vue.unref)(bodyId),
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("body"), __props.bodyClass])
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 10, _hoisted_4$7)) : (0, vue.createCommentVNode)("v-if", true),
_ctx.$slots.footer ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 2,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("footer"), __props.footerClass])
}, [(0, vue.renderSlot)(_ctx.$slots, "footer")], 2)) : (0, vue.createCommentVNode)("v-if", true),
__props.resizable ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 3,
ref_key: "draggerRef",
ref: draggerRef,
style: (0, vue.normalizeStyle)({ zIndex: (0, vue.unref)(zIndex) }),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("dragger"))
}, null, 6)) : (0, vue.createCommentVNode)("v-if", true)
], 16, _hoisted_1$40)]),
_: 3
}, 8, [
"trapped",
"focus-trap-el",
"focus-start-el",
"onFocusAfterTrapped",
"onFocusAfterReleased",
"onFocusoutPrevented",
"onReleaseRequested"
])]),
_: 3
}, 8, [
"mask",
"overlay-class",
"z-index",
"onClick"
]), [[vue.vShow, (0, vue.unref)(visible)]])]),
_: 3
}, 8, [
"name",
"onAfterEnter",
"onAfterLeave",
"onBeforeLeave"
])]),
_: 3
}, 8, ["to", "disabled"]);
};
}
});
//#endregion
//#region ../../packages/components/drawer/src/drawer.vue
var drawer_default = drawer_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/drawer/index.ts
const ElDrawer = withInstall(drawer_default);
//#endregion
//#region ../../packages/components/collection/src/collection.vue?vue&type=script&lang.ts
var collection_vue_vue_type_script_lang_default = (0, vue.defineComponent)({ inheritAttrs: false });
//#endregion
//#region ../../packages/components/collection/src/collection.vue
function _sfc_render$16(_ctx, _cache, $props, $setup, $data, $options) {
return (0, vue.renderSlot)(_ctx.$slots, "default");
}
var collection_default = /* @__PURE__ */ _plugin_vue_export_helper_default(collection_vue_vue_type_script_lang_default, [["render", _sfc_render$16]]);
//#endregion
//#region ../../packages/components/collection/src/collection-item.vue?vue&type=script&lang.ts
var collection_item_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElCollectionItem",
inheritAttrs: false
});
//#endregion
//#region ../../packages/components/collection/src/collection-item.vue
function _sfc_render$15(_ctx, _cache, $props, $setup, $data, $options) {
return (0, vue.renderSlot)(_ctx.$slots, "default");
}
var collection_item_default = /* @__PURE__ */ _plugin_vue_export_helper_default(collection_item_vue_vue_type_script_lang_default, [["render", _sfc_render$15]]);
//#endregion
//#region ../../packages/components/collection/src/collection.ts
const COLLECTION_ITEM_SIGN = `data-el-collection-item`;
const createCollectionWithScope = (name) => {
const COLLECTION_NAME = `El${name}Collection`;
const COLLECTION_ITEM_NAME = `${COLLECTION_NAME}Item`;
const COLLECTION_INJECTION_KEY = Symbol(COLLECTION_NAME);
const COLLECTION_ITEM_INJECTION_KEY = Symbol(COLLECTION_ITEM_NAME);
return {
COLLECTION_INJECTION_KEY,
COLLECTION_ITEM_INJECTION_KEY,
ElCollection: Object.assign({}, collection_default, {
name: COLLECTION_NAME,
setup() {
const collectionRef = (0, vue.ref)();
const itemMap = /* @__PURE__ */ new Map();
const getItems = (() => {
const collectionEl = (0, vue.unref)(collectionRef);
if (!collectionEl) return [];
const orderedNodes = Array.from(collectionEl.querySelectorAll(`[${COLLECTION_ITEM_SIGN}]`));
return [...itemMap.values()].sort((a, b) => orderedNodes.indexOf(a.ref) - orderedNodes.indexOf(b.ref));
});
(0, vue.provide)(COLLECTION_INJECTION_KEY, {
itemMap,
getItems,
collectionRef
});
}
}),
ElCollectionItem: Object.assign({}, collection_item_default, {
name: COLLECTION_ITEM_NAME,
setup(_, { attrs }) {
const collectionItemRef = (0, vue.ref)();
const collectionInjection = (0, vue.inject)(COLLECTION_INJECTION_KEY, void 0);
(0, vue.provide)(COLLECTION_ITEM_INJECTION_KEY, { collectionItemRef });
(0, vue.onMounted)(() => {
const collectionItemEl = (0, vue.unref)(collectionItemRef);
if (collectionItemEl) collectionInjection.itemMap.set(collectionItemEl, {
ref: collectionItemEl,
...attrs
});
});
(0, vue.onBeforeUnmount)(() => {
const collectionItemEl = (0, vue.unref)(collectionItemRef);
collectionInjection.itemMap.delete(collectionItemEl);
});
}
})
};
};
//#endregion
//#region ../../packages/components/roving-focus-group/src/roving-focus-group.ts
const rovingFocusGroupProps = buildProps({
style: { type: definePropType([
String,
Array,
Object
]) },
currentTabId: { type: definePropType(String) },
defaultCurrentTabId: String,
loop: Boolean,
dir: {
type: String,
values: ["ltr", "rtl"],
default: "ltr"
},
orientation: { type: definePropType(String) },
onBlur: Function,
onFocus: Function,
onMousedown: Function
});
const { ElCollection, ElCollectionItem, COLLECTION_INJECTION_KEY, COLLECTION_ITEM_INJECTION_KEY } = createCollectionWithScope("RovingFocusGroup");
//#endregion
//#region ../../packages/components/roving-focus-group/src/tokens.ts
const ROVING_FOCUS_GROUP_INJECTION_KEY = Symbol("elRovingFocusGroup");
const ROVING_FOCUS_GROUP_ITEM_INJECTION_KEY = Symbol("elRovingFocusGroupItem");
//#endregion
//#region ../../packages/components/roving-focus-group/src/utils.ts
const MAP_KEY_TO_FOCUS_INTENT = {
ArrowLeft: "prev",
ArrowUp: "prev",
ArrowRight: "next",
ArrowDown: "next",
PageUp: "first",
Home: "first",
PageDown: "last",
End: "last"
};
const getDirectionAwareKey = (key, dir) => {
if (dir !== "rtl") return key;
switch (key) {
case EVENT_CODE.right: return EVENT_CODE.left;
case EVENT_CODE.left: return EVENT_CODE.right;
default: return key;
}
};
const getFocusIntent = (event, orientation, dir) => {
const key = getDirectionAwareKey(getEventCode(event), dir);
if (orientation === "vertical" && [EVENT_CODE.left, EVENT_CODE.right].includes(key)) return void 0;
if (orientation === "horizontal" && [EVENT_CODE.up, EVENT_CODE.down].includes(key)) return void 0;
return MAP_KEY_TO_FOCUS_INTENT[key];
};
const reorderArray = (array, atIdx) => {
return array.map((_, idx) => array[(idx + atIdx) % array.length]);
};
const focusFirst = (elements) => {
const { activeElement: prevActive } = document;
for (const element of elements) {
if (element === prevActive) return;
element.focus();
if (prevActive !== document.activeElement) return;
}
};
//#endregion
//#region ../../packages/components/roving-focus-group/src/roving-focus-group-impl.vue?vue&type=script&lang.ts
const CURRENT_TAB_ID_CHANGE_EVT = "currentTabIdChange";
const ENTRY_FOCUS_EVT = "rovingFocusGroup.entryFocus";
const EVT_OPTS = {
bubbles: false,
cancelable: true
};
var roving_focus_group_impl_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElRovingFocusGroupImpl",
inheritAttrs: false,
props: rovingFocusGroupProps,
emits: [CURRENT_TAB_ID_CHANGE_EVT, "entryFocus"],
setup(props, { emit }) {
const currentTabbedId = (0, vue.ref)((props.currentTabId || props.defaultCurrentTabId) ?? null);
const isBackingOut = (0, vue.ref)(false);
const isClickFocus = (0, vue.ref)(false);
const rovingFocusGroupRef = (0, vue.ref)();
const { getItems } = (0, vue.inject)(COLLECTION_INJECTION_KEY, void 0);
const rovingFocusGroupRootStyle = (0, vue.computed)(() => {
return [{ outline: "none" }, props.style];
});
const onItemFocus = (tabbedId) => {
emit(CURRENT_TAB_ID_CHANGE_EVT, tabbedId);
};
const onItemShiftTab = () => {
isBackingOut.value = true;
};
const onMousedown = composeEventHandlers((e) => {
props.onMousedown?.(e);
}, () => {
isClickFocus.value = true;
});
const onFocus = composeEventHandlers((e) => {
props.onFocus?.(e);
}, (e) => {
const isKeyboardFocus = !(0, vue.unref)(isClickFocus);
const { target, currentTarget } = e;
if (target === currentTarget && isKeyboardFocus && !(0, vue.unref)(isBackingOut)) {
const entryFocusEvt = new Event(ENTRY_FOCUS_EVT, EVT_OPTS);
currentTarget?.dispatchEvent(entryFocusEvt);
if (!entryFocusEvt.defaultPrevented) {
const items = getItems().filter((item) => item.focusable);
focusFirst([
items.find((item) => item.active),
items.find((item) => item.id === (0, vue.unref)(currentTabbedId)),
...items
].filter(Boolean).map((item) => item.ref));
}
}
isClickFocus.value = false;
});
const onBlur = composeEventHandlers((e) => {
props.onBlur?.(e);
}, () => {
isBackingOut.value = false;
});
const handleEntryFocus = (...args) => {
emit("entryFocus", ...args);
};
const onKeydown = (e) => {
const focusIntent = getFocusIntent(e);
if (focusIntent) {
e.preventDefault();
let elements = getItems().filter((item) => item.focusable).map((item) => item.ref);
switch (focusIntent) {
case "last":
elements.reverse();
break;
case "prev":
case "next": {
if (focusIntent === "prev") elements.reverse();
const currentIdx = elements.indexOf(e.currentTarget);
elements = props.loop ? reorderArray(elements, currentIdx + 1) : elements.slice(currentIdx + 1);
break;
}
default: break;
}
(0, vue.nextTick)(() => {
focusFirst(elements);
});
}
};
(0, vue.provide)(ROVING_FOCUS_GROUP_INJECTION_KEY, {
currentTabbedId: (0, vue.readonly)(currentTabbedId),
loop: (0, vue.toRef)(props, "loop"),
tabIndex: (0, vue.computed)(() => {
return (0, vue.unref)(isBackingOut) ? -1 : 0;
}),
rovingFocusGroupRef,
rovingFocusGroupRootStyle,
orientation: (0, vue.toRef)(props, "orientation"),
dir: (0, vue.toRef)(props, "dir"),
onItemFocus,
onItemShiftTab,
onBlur,
onFocus,
onMousedown,
onKeydown
});
(0, vue.watch)(() => props.currentTabId, (val) => {
currentTabbedId.value = val ?? null;
});
useEventListener(rovingFocusGroupRef, ENTRY_FOCUS_EVT, handleEntryFocus);
}
});
//#endregion
//#region ../../packages/components/roving-focus-group/src/roving-focus-group-impl.vue
function _sfc_render$14(_ctx, _cache, $props, $setup, $data, $options) {
return (0, vue.renderSlot)(_ctx.$slots, "default");
}
var roving_focus_group_impl_default = /* @__PURE__ */ _plugin_vue_export_helper_default(roving_focus_group_impl_vue_vue_type_script_lang_default, [["render", _sfc_render$14]]);
//#endregion
//#region ../../packages/components/roving-focus-group/src/roving-focus-group.vue?vue&type=script&lang.ts
var roving_focus_group_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElRovingFocusGroup",
components: {
ElFocusGroupCollection: ElCollection,
ElRovingFocusGroupImpl: roving_focus_group_impl_default
}
});
//#endregion
//#region ../../packages/components/roving-focus-group/src/roving-focus-group.vue
function _sfc_render$13(_ctx, _cache, $props, $setup, $data, $options) {
const _component_el_roving_focus_group_impl = (0, vue.resolveComponent)("el-roving-focus-group-impl");
const _component_el_focus_group_collection = (0, vue.resolveComponent)("el-focus-group-collection");
return (0, vue.openBlock)(), (0, vue.createBlock)(_component_el_focus_group_collection, null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_el_roving_focus_group_impl, (0, vue.normalizeProps)((0, vue.guardReactiveProps)(_ctx.$attrs)), {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 16)]),
_: 3
});
}
var roving_focus_group_default$1 = /* @__PURE__ */ _plugin_vue_export_helper_default(roving_focus_group_vue_vue_type_script_lang_default, [["render", _sfc_render$13]]);
//#endregion
//#region ../../packages/components/roving-focus-group/src/roving-focus-item.vue?vue&type=script&lang.ts
var roving_focus_item_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
components: { ElRovingFocusCollectionItem: ElCollectionItem },
props: {
focusable: {
type: Boolean,
default: true
},
active: Boolean
},
emits: [
"mousedown",
"focus",
"keydown"
],
setup(props, { emit }) {
const { currentTabbedId, onItemFocus, onItemShiftTab, onKeydown } = (0, vue.inject)(ROVING_FOCUS_GROUP_INJECTION_KEY, void 0);
const id = useId();
const rovingFocusGroupItemRef = (0, vue.ref)();
const handleMousedown = composeEventHandlers((e) => {
emit("mousedown", e);
}, (e) => {
if (!props.focusable) e.preventDefault();
else onItemFocus((0, vue.unref)(id));
});
const handleFocus = composeEventHandlers((e) => {
emit("focus", e);
}, () => {
onItemFocus((0, vue.unref)(id));
});
const handleKeydown = composeEventHandlers((e) => {
emit("keydown", e);
}, (e) => {
const { shiftKey, target, currentTarget } = e;
if (getEventCode(e) === EVENT_CODE.tab && shiftKey) {
onItemShiftTab();
return;
}
if (target !== currentTarget) return;
onKeydown(e);
});
const isCurrentTab = (0, vue.computed)(() => currentTabbedId.value === (0, vue.unref)(id));
(0, vue.provide)(ROVING_FOCUS_GROUP_ITEM_INJECTION_KEY, {
rovingFocusGroupItemRef,
tabIndex: (0, vue.computed)(() => (0, vue.unref)(isCurrentTab) ? 0 : -1),
handleMousedown,
handleFocus,
handleKeydown
});
return {
id,
handleKeydown,
handleFocus,
handleMousedown
};
}
});
//#endregion
//#region ../../packages/components/roving-focus-group/src/roving-focus-item.vue
function _sfc_render$12(_ctx, _cache, $props, $setup, $data, $options) {
const _component_el_roving_focus_collection_item = (0, vue.resolveComponent)("el-roving-focus-collection-item");
return (0, vue.openBlock)(), (0, vue.createBlock)(_component_el_roving_focus_collection_item, {
id: _ctx.id,
focusable: _ctx.focusable,
active: _ctx.active
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 8, [
"id",
"focusable",
"active"
]);
}
var roving_focus_item_default = /* @__PURE__ */ _plugin_vue_export_helper_default(roving_focus_item_vue_vue_type_script_lang_default, [["render", _sfc_render$12]]);
//#endregion
//#region ../../packages/components/roving-focus-group/index.ts
var roving_focus_group_default = roving_focus_group_default$1;
//#endregion
//#region ../../packages/components/dropdown/src/dropdown.ts
const dropdownProps = buildProps({
trigger: {
...useTooltipTriggerProps.trigger,
type: definePropType([String, Array])
},
triggerKeys: {
type: definePropType(Array),
default: () => [
EVENT_CODE.enter,
EVENT_CODE.numpadEnter,
EVENT_CODE.space,
EVENT_CODE.down
]
},
virtualTriggering: useTooltipTriggerProps.virtualTriggering,
virtualRef: useTooltipTriggerProps.virtualRef,
effect: {
...useTooltipContentProps.effect,
default: "light"
},
type: { type: definePropType(String) },
placement: {
type: definePropType(String),
default: "bottom"
},
popperOptions: {
type: definePropType(Object),
default: () => ({})
},
id: String,
size: {
type: String,
default: ""
},
splitButton: Boolean,
hideOnClick: {
type: Boolean,
default: true
},
loop: {
type: Boolean,
default: true
},
showArrow: {
type: Boolean,
default: true
},
showTimeout: {
type: Number,
default: 150
},
hideTimeout: {
type: Number,
default: 150
},
tabindex: {
type: definePropType([Number, String]),
default: 0
},
maxHeight: {
type: definePropType([Number, String]),
default: ""
},
popperClass: useTooltipContentProps.popperClass,
popperStyle: useTooltipContentProps.popperStyle,
disabled: Boolean,
role: {
type: String,
values: roleTypes,
default: "menu"
},
buttonProps: { type: definePropType(Object) },
teleported: useTooltipContentProps.teleported,
appendTo: useTooltipContentProps.appendTo,
persistent: {
type: Boolean,
default: true
}
});
const dropdownItemProps = buildProps({
command: {
type: [
Object,
String,
Number
],
default: () => ({})
},
disabled: Boolean,
divided: Boolean,
textValue: String,
icon: { type: iconPropType }
});
const dropdownMenuProps = buildProps({ onKeydown: { type: definePropType(Function) } });
const FIRST_KEYS = [
EVENT_CODE.down,
EVENT_CODE.pageDown,
EVENT_CODE.home
];
const LAST_KEYS = [
EVENT_CODE.up,
EVENT_CODE.pageUp,
EVENT_CODE.end
];
const FIRST_LAST_KEYS = [...FIRST_KEYS, ...LAST_KEYS];
//#endregion
//#region ../../packages/components/dropdown/src/tokens.ts
const DROPDOWN_INJECTION_KEY = Symbol("elDropdown");
const DROPDOWN_INSTANCE_INJECTION_KEY = "elDropdown";
//#endregion
//#region ../../packages/components/dropdown/src/dropdown.vue?vue&type=script&lang.ts
const { ButtonGroup: ElButtonGroup$1 } = ElButton;
var dropdown_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElDropdown",
components: {
ElButton,
ElButtonGroup: ElButtonGroup$1,
ElScrollbar,
ElTooltip,
ElRovingFocusGroup: roving_focus_group_default,
ElOnlyChild: OnlyChild,
ElIcon,
ArrowDown: arrow_down_default
},
props: dropdownProps,
emits: [
"visible-change",
"click",
"command"
],
setup(props, { emit }) {
const _instance = (0, vue.getCurrentInstance)();
const ns = useNamespace("dropdown");
const { t } = useLocale();
const triggeringElementRef = (0, vue.ref)();
const referenceElementRef = (0, vue.ref)();
const popperRef = (0, vue.ref)();
const contentRef = (0, vue.ref)();
const scrollbar = (0, vue.ref)(null);
const currentTabId = (0, vue.ref)(null);
const isUsingKeyboard = (0, vue.ref)(false);
const wrapStyle = (0, vue.computed)(() => ({ maxHeight: addUnit(props.maxHeight) }));
const dropdownTriggerKls = (0, vue.computed)(() => [ns.m(dropdownSize.value)]);
const trigger = (0, vue.computed)(() => castArray$1(props.trigger));
const defaultTriggerId = useId().value;
const triggerId = (0, vue.computed)(() => props.id || defaultTriggerId);
function handleClick() {
popperRef.value?.onClose(void 0, 0);
}
function handleClose() {
popperRef.value?.onClose();
}
function handleOpen() {
popperRef.value?.onOpen();
}
const dropdownSize = useFormSize();
function commandHandler(...args) {
emit("command", ...args);
}
function onItemEnter() {}
function onItemLeave() {
const contentEl = (0, vue.unref)(contentRef);
trigger.value.includes("hover") && contentEl?.focus({ preventScroll: true });
currentTabId.value = null;
}
function handleCurrentTabIdChange(id) {
currentTabId.value = id;
}
function handleBeforeShowTooltip() {
emit("visible-change", true);
}
function handleShowTooltip(event) {
isUsingKeyboard.value = event?.type === "keydown";
contentRef.value?.focus();
}
function handleBeforeHideTooltip() {
emit("visible-change", false);
}
(0, vue.provide)(DROPDOWN_INJECTION_KEY, {
contentRef,
role: (0, vue.computed)(() => props.role),
triggerId,
isUsingKeyboard,
onItemEnter,
onItemLeave,
handleClose
});
(0, vue.provide)(DROPDOWN_INSTANCE_INJECTION_KEY, {
instance: _instance,
dropdownSize,
handleClick,
commandHandler,
trigger: (0, vue.toRef)(props, "trigger"),
hideOnClick: (0, vue.toRef)(props, "hideOnClick")
});
const handlerMainButtonClick = (event) => {
emit("click", event);
};
return {
t,
ns,
scrollbar,
wrapStyle,
dropdownTriggerKls,
dropdownSize,
triggerId,
currentTabId,
handleCurrentTabIdChange,
handlerMainButtonClick,
handleClose,
handleOpen,
handleBeforeShowTooltip,
handleShowTooltip,
handleBeforeHideTooltip,
popperRef,
contentRef,
triggeringElementRef,
referenceElementRef
};
}
});
//#endregion
//#region ../../packages/components/dropdown/src/dropdown.vue
function _sfc_render$11(_ctx, _cache, $props, $setup, $data, $options) {
const _component_el_roving_focus_group = (0, vue.resolveComponent)("el-roving-focus-group");
const _component_el_scrollbar = (0, vue.resolveComponent)("el-scrollbar");
const _component_el_only_child = (0, vue.resolveComponent)("el-only-child");
const _component_el_tooltip = (0, vue.resolveComponent)("el-tooltip");
const _component_el_button = (0, vue.resolveComponent)("el-button");
const _component_arrow_down = (0, vue.resolveComponent)("arrow-down");
const _component_el_icon = (0, vue.resolveComponent)("el-icon");
const _component_el_button_group = (0, vue.resolveComponent)("el-button-group");
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)([_ctx.ns.b(), _ctx.ns.is("disabled", _ctx.disabled)]) }, [(0, vue.createVNode)(_component_el_tooltip, {
ref: "popperRef",
role: _ctx.role,
effect: _ctx.effect,
"fallback-placements": ["bottom", "top"],
"popper-options": _ctx.popperOptions,
"gpu-acceleration": false,
placement: _ctx.placement,
"popper-class": [_ctx.ns.e("popper"), _ctx.popperClass],
"popper-style": _ctx.popperStyle,
trigger: _ctx.trigger,
"trigger-keys": _ctx.triggerKeys,
"trigger-target-el": _ctx.contentRef,
"show-arrow": _ctx.showArrow,
"show-after": _ctx.trigger === "hover" ? _ctx.showTimeout : 0,
"hide-after": _ctx.trigger === "hover" ? _ctx.hideTimeout : 0,
"virtual-ref": _ctx.virtualRef ?? _ctx.triggeringElementRef,
"virtual-triggering": _ctx.virtualTriggering || _ctx.splitButton,
disabled: _ctx.disabled,
transition: `${_ctx.ns.namespace.value}-zoom-in-top`,
teleported: _ctx.teleported,
"append-to": _ctx.appendTo,
pure: "",
"focus-on-target": "",
persistent: _ctx.persistent,
onBeforeShow: _ctx.handleBeforeShowTooltip,
onShow: _ctx.handleShowTooltip,
onBeforeHide: _ctx.handleBeforeHideTooltip
}, (0, vue.createSlots)({
content: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_el_scrollbar, {
ref: "scrollbar",
"wrap-style": _ctx.wrapStyle,
tag: "div",
"view-class": _ctx.ns.e("list")
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_el_roving_focus_group, {
loop: _ctx.loop,
"current-tab-id": _ctx.currentTabId,
orientation: "horizontal",
onCurrentTabIdChange: _ctx.handleCurrentTabIdChange
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "dropdown")]),
_: 3
}, 8, [
"loop",
"current-tab-id",
"onCurrentTabIdChange"
])]),
_: 3
}, 8, ["wrap-style", "view-class"])]),
_: 2
}, [!_ctx.splitButton ? {
name: "default",
fn: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_el_only_child, {
id: _ctx.triggerId,
ref: "triggeringElementRef",
role: "button",
tabindex: _ctx.tabindex
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 8, ["id", "tabindex"])]),
key: "0"
} : void 0]), 1032, [
"role",
"effect",
"popper-options",
"placement",
"popper-class",
"popper-style",
"trigger",
"trigger-keys",
"trigger-target-el",
"show-arrow",
"show-after",
"hide-after",
"virtual-ref",
"virtual-triggering",
"disabled",
"transition",
"teleported",
"append-to",
"persistent",
"onBeforeShow",
"onShow",
"onBeforeHide"
]), _ctx.splitButton ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_button_group, { key: 0 }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_el_button, (0, vue.mergeProps)({ ref: "referenceElementRef" }, _ctx.buttonProps, {
size: _ctx.dropdownSize,
type: _ctx.type,
disabled: _ctx.disabled,
tabindex: _ctx.tabindex,
onClick: _ctx.handlerMainButtonClick
}), {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 16, [
"size",
"type",
"disabled",
"tabindex",
"onClick"
]), (0, vue.createVNode)(_component_el_button, (0, vue.mergeProps)({
id: _ctx.triggerId,
ref: "triggeringElementRef"
}, _ctx.buttonProps, {
role: "button",
size: _ctx.dropdownSize,
type: _ctx.type,
class: _ctx.ns.e("caret-button"),
disabled: _ctx.disabled,
tabindex: _ctx.tabindex,
"aria-label": _ctx.t("el.dropdown.toggleDropdown")
}), {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_el_icon, { class: (0, vue.normalizeClass)(_ctx.ns.e("icon")) }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_arrow_down)]),
_: 1
}, 8, ["class"])]),
_: 1
}, 16, [
"id",
"size",
"type",
"class",
"disabled",
"tabindex",
"aria-label"
])]),
_: 3
})) : (0, vue.createCommentVNode)("v-if", true)], 2);
}
var dropdown_default = /* @__PURE__ */ _plugin_vue_export_helper_default(dropdown_vue_vue_type_script_lang_default, [["render", _sfc_render$11]]);
//#endregion
//#region ../../packages/components/dropdown/src/dropdown-item-impl.vue?vue&type=script&lang.ts
var dropdown_item_impl_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "DropdownItemImpl",
components: { ElIcon },
props: dropdownItemProps,
emits: [
"pointermove",
"pointerleave",
"click",
"clickimpl"
],
setup(_, { emit }) {
const ns = useNamespace("dropdown");
const { role: menuRole } = (0, vue.inject)(DROPDOWN_INJECTION_KEY, void 0);
const { collectionItemRef: rovingFocusCollectionItemRef } = (0, vue.inject)(COLLECTION_ITEM_INJECTION_KEY, void 0);
const { rovingFocusGroupItemRef, tabIndex, handleFocus, handleKeydown: handleItemKeydown, handleMousedown } = (0, vue.inject)(ROVING_FOCUS_GROUP_ITEM_INJECTION_KEY, void 0);
const itemRef = composeRefs(rovingFocusCollectionItemRef, rovingFocusGroupItemRef);
const role = (0, vue.computed)(() => {
if (menuRole.value === "menu") return "menuitem";
else if (menuRole.value === "navigation") return "link";
return "button";
});
const handleKeydown = composeEventHandlers((e) => {
const code = getEventCode(e);
if ([
EVENT_CODE.enter,
EVENT_CODE.numpadEnter,
EVENT_CODE.space
].includes(code)) {
e.preventDefault();
e.stopImmediatePropagation();
emit("clickimpl", e);
return true;
}
}, handleItemKeydown);
return {
ns,
itemRef,
dataset: { [COLLECTION_ITEM_SIGN]: "" },
role,
tabIndex,
handleFocus,
handleKeydown,
handleMousedown
};
}
});
//#endregion
//#region ../../packages/components/dropdown/src/dropdown-item-impl.vue
const _hoisted_1$39 = [
"aria-disabled",
"tabindex",
"role"
];
function _sfc_render$10(_ctx, _cache, $props, $setup, $data, $options) {
const _component_el_icon = (0, vue.resolveComponent)("el-icon");
return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, [_ctx.divided ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
key: 0,
role: "separator",
class: (0, vue.normalizeClass)(_ctx.ns.bem("menu", "item", "divided"))
}, null, 2)) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createElementVNode)("li", (0, vue.mergeProps)({ ref: _ctx.itemRef }, {
..._ctx.dataset,
..._ctx.$attrs
}, {
"aria-disabled": _ctx.disabled,
class: [_ctx.ns.be("menu", "item"), _ctx.ns.is("disabled", _ctx.disabled)],
tabindex: _ctx.tabIndex,
role: _ctx.role,
onClick: _cache[0] || (_cache[0] = (e) => _ctx.$emit("clickimpl", e)),
onFocus: _cache[1] || (_cache[1] = (...args) => _ctx.handleFocus && _ctx.handleFocus(...args)),
onKeydown: _cache[2] || (_cache[2] = (0, vue.withModifiers)((...args) => _ctx.handleKeydown && _ctx.handleKeydown(...args), ["self"])),
onMousedown: _cache[3] || (_cache[3] = (...args) => _ctx.handleMousedown && _ctx.handleMousedown(...args)),
onPointermove: _cache[4] || (_cache[4] = (e) => _ctx.$emit("pointermove", e)),
onPointerleave: _cache[5] || (_cache[5] = (e) => _ctx.$emit("pointerleave", e))
}), [_ctx.icon || _ctx.$slots.icon ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_icon, { key: 0 }, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "icon", {}, () => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(_ctx.icon)))])]),
_: 3
})) : (0, vue.createCommentVNode)("v-if", true), (0, vue.renderSlot)(_ctx.$slots, "default")], 16, _hoisted_1$39)], 64);
}
var dropdown_item_impl_default = /* @__PURE__ */ _plugin_vue_export_helper_default(dropdown_item_impl_vue_vue_type_script_lang_default, [["render", _sfc_render$10]]);
//#endregion
//#region ../../packages/components/dropdown/src/useDropdown.ts
const useDropdown = () => {
const elDropdown = (0, vue.inject)(DROPDOWN_INSTANCE_INJECTION_KEY, {});
return {
elDropdown,
_elDropdownSize: (0, vue.computed)(() => elDropdown?.dropdownSize)
};
};
//#endregion
//#region ../../packages/components/dropdown/src/dropdown-item.vue?vue&type=script&lang.ts
var dropdown_item_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElDropdownItem",
components: {
ElRovingFocusItem: roving_focus_item_default,
ElDropdownItemImpl: dropdown_item_impl_default
},
inheritAttrs: false,
props: dropdownItemProps,
emits: [
"pointermove",
"pointerleave",
"click"
],
setup(props, { emit, attrs }) {
const { elDropdown } = useDropdown();
const _instance = (0, vue.getCurrentInstance)();
const { onItemEnter, onItemLeave } = (0, vue.inject)(DROPDOWN_INJECTION_KEY, void 0);
const handlePointerMove = composeEventHandlers((e) => {
emit("pointermove", e);
return e.defaultPrevented;
}, whenMouse((e) => {
if (props.disabled) {
onItemLeave(e);
return;
}
const target = e.currentTarget;
/**
* This handles the following scenario:
* when the item contains a form element such as input element
* when the mouse is moving over the element itself which is contained by
* the item, the default focusing logic should be prevented so that
* it won't cause weird action.
*/
if (target === document.activeElement || target.contains(document.activeElement)) return;
onItemEnter(e);
if (!e.defaultPrevented) target?.focus({ preventScroll: true });
}));
const handlePointerLeave = composeEventHandlers((e) => {
emit("pointerleave", e);
return e.defaultPrevented;
}, whenMouse(onItemLeave));
return {
handleClick: composeEventHandlers((e) => {
if (props.disabled) return;
emit("click", e);
return e.type !== "keydown" && e.defaultPrevented;
}, (e) => {
if (props.disabled) {
e.stopImmediatePropagation();
return;
}
if (elDropdown?.hideOnClick?.value) elDropdown.handleClick?.();
elDropdown.commandHandler?.(props.command, _instance, e);
}),
handlePointerMove,
handlePointerLeave,
propsAndAttrs: (0, vue.computed)(() => ({
...props,
...attrs
}))
};
}
});
//#endregion
//#region ../../packages/components/dropdown/src/dropdown-item.vue
function _sfc_render$9(_ctx, _cache, $props, $setup, $data, $options) {
const _component_el_dropdown_item_impl = (0, vue.resolveComponent)("el-dropdown-item-impl");
const _component_el_roving_focus_item = (0, vue.resolveComponent)("el-roving-focus-item");
return (0, vue.openBlock)(), (0, vue.createBlock)(_component_el_roving_focus_item, { focusable: !_ctx.disabled }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_el_dropdown_item_impl, (0, vue.mergeProps)(_ctx.propsAndAttrs, {
onPointerleave: _ctx.handlePointerLeave,
onPointermove: _ctx.handlePointerMove,
onClickimpl: _ctx.handleClick
}), (0, vue.createSlots)({
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 2
}, [_ctx.$slots.icon ? {
name: "icon",
fn: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "icon")]),
key: "0"
} : void 0]), 1040, [
"onPointerleave",
"onPointermove",
"onClickimpl"
])]),
_: 3
}, 8, ["focusable"]);
}
var dropdown_item_default = /* @__PURE__ */ _plugin_vue_export_helper_default(dropdown_item_vue_vue_type_script_lang_default, [["render", _sfc_render$9]]);
//#endregion
//#region ../../packages/components/dropdown/src/dropdown-menu.vue?vue&type=script&lang.ts
var dropdown_menu_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElDropdownMenu",
props: dropdownMenuProps,
setup(props) {
const ns = useNamespace("dropdown");
const { _elDropdownSize } = useDropdown();
const size = _elDropdownSize.value;
const { contentRef, role, triggerId, isUsingKeyboard, handleClose } = (0, vue.inject)(DROPDOWN_INJECTION_KEY, void 0);
const { rovingFocusGroupRef, rovingFocusGroupRootStyle, onBlur, onFocus, onKeydown, onMousedown } = (0, vue.inject)(ROVING_FOCUS_GROUP_INJECTION_KEY, void 0);
const { collectionRef: rovingFocusGroupCollectionRef } = (0, vue.inject)(COLLECTION_INJECTION_KEY, void 0);
const dropdownKls = (0, vue.computed)(() => {
return [ns.b("menu"), ns.bm("menu", size?.value)];
});
const dropdownListWrapperRef = composeRefs(contentRef, rovingFocusGroupRef, rovingFocusGroupCollectionRef);
const handleKeydown = composeEventHandlers((e) => {
props.onKeydown?.(e);
}, (e) => {
const { currentTarget, target } = e;
const code = getEventCode(e);
if (currentTarget.contains(target)) {}
if (EVENT_CODE.tab === code) return handleClose();
onKeydown(e);
});
function handleFocus(e) {
isUsingKeyboard.value && onFocus(e);
}
return {
size,
rovingFocusGroupRootStyle,
dropdownKls,
role,
triggerId,
dropdownListWrapperRef,
handleKeydown,
onBlur,
handleFocus,
onMousedown
};
}
});
//#endregion
//#region ../../packages/components/dropdown/src/dropdown-menu.vue
const _hoisted_1$38 = ["role", "aria-labelledby"];
function _sfc_render$8(_ctx, _cache, $props, $setup, $data, $options) {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("ul", {
ref: _ctx.dropdownListWrapperRef,
class: (0, vue.normalizeClass)(_ctx.dropdownKls),
style: (0, vue.normalizeStyle)(_ctx.rovingFocusGroupRootStyle),
tabindex: -1,
role: _ctx.role,
"aria-labelledby": _ctx.triggerId,
onFocusin: _cache[0] || (_cache[0] = (...args) => _ctx.handleFocus && _ctx.handleFocus(...args)),
onFocusout: _cache[1] || (_cache[1] = (...args) => _ctx.onBlur && _ctx.onBlur(...args)),
onKeydown: _cache[2] || (_cache[2] = (0, vue.withModifiers)((...args) => _ctx.handleKeydown && _ctx.handleKeydown(...args), ["self"])),
onMousedown: _cache[3] || (_cache[3] = (0, vue.withModifiers)((...args) => _ctx.onMousedown && _ctx.onMousedown(...args), ["self"]))
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 46, _hoisted_1$38);
}
var dropdown_menu_default = /* @__PURE__ */ _plugin_vue_export_helper_default(dropdown_menu_vue_vue_type_script_lang_default, [["render", _sfc_render$8]]);
//#endregion
//#region ../../packages/components/dropdown/index.ts
const ElDropdown = withInstall(dropdown_default, {
DropdownItem: dropdown_item_default,
DropdownMenu: dropdown_menu_default
});
const ElDropdownItem = withNoopInstall(dropdown_item_default);
const ElDropdownMenu = withNoopInstall(dropdown_menu_default);
//#endregion
//#region ../../packages/components/empty/src/empty.ts
/**
* @deprecated Removed after 3.0.0, Use `EmptyProps` instead.
*/
const emptyProps = buildProps({
image: {
type: String,
default: ""
},
imageSize: Number,
description: {
type: String,
default: ""
}
});
//#endregion
//#region ../../packages/components/empty/src/img-empty.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$37 = {
viewBox: "0 0 79 86",
version: "1.1",
xmlns: "http://www.w3.org/2000/svg",
"xmlns:xlink": "http://www.w3.org/1999/xlink"
};
const _hoisted_2$23 = ["id"];
const _hoisted_3$8 = ["stop-color"];
const _hoisted_4$6 = ["stop-color"];
const _hoisted_5$4 = ["id"];
const _hoisted_6$1 = ["stop-color"];
const _hoisted_7 = ["stop-color"];
const _hoisted_8 = ["id"];
const _hoisted_9 = {
stroke: "none",
"stroke-width": "1",
fill: "none",
"fill-rule": "evenodd"
};
const _hoisted_10 = { transform: "translate(-1268.000000, -535.000000)" };
const _hoisted_11 = { transform: "translate(1268.000000, 535.000000)" };
const _hoisted_12 = ["fill"];
const _hoisted_13 = ["fill"];
const _hoisted_14 = { transform: "translate(34.500000, 31.500000) scale(-1, 1) rotate(-25.000000) translate(-34.500000, -31.500000) translate(7.000000, 10.000000)" };
const _hoisted_15 = ["fill"];
const _hoisted_16 = ["fill"];
const _hoisted_17 = ["fill"];
const _hoisted_18 = ["fill"];
const _hoisted_19 = ["fill"];
const _hoisted_20 = { transform: "translate(53.000000, 45.000000)" };
const _hoisted_21 = ["fill", "xlink:href"];
const _hoisted_22 = ["fill", "mask"];
const _hoisted_23 = ["fill"];
var img_empty_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ImgEmpty",
__name: "img-empty",
setup(__props) {
const ns = useNamespace("empty");
const id = useId();
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$37, [(0, vue.createElementVNode)("defs", null, [
(0, vue.createElementVNode)("linearGradient", {
id: `linearGradient-1-${(0, vue.unref)(id)}`,
x1: "38.8503086%",
y1: "0%",
x2: "61.1496914%",
y2: "100%"
}, [(0, vue.createElementVNode)("stop", {
"stop-color": `var(${(0, vue.unref)(ns).cssVarBlockName("fill-color-1")})`,
offset: "0%"
}, null, 8, _hoisted_3$8), (0, vue.createElementVNode)("stop", {
"stop-color": `var(${(0, vue.unref)(ns).cssVarBlockName("fill-color-4")})`,
offset: "100%"
}, null, 8, _hoisted_4$6)], 8, _hoisted_2$23),
(0, vue.createElementVNode)("linearGradient", {
id: `linearGradient-2-${(0, vue.unref)(id)}`,
x1: "0%",
y1: "9.5%",
x2: "100%",
y2: "90.5%"
}, [(0, vue.createElementVNode)("stop", {
"stop-color": `var(${(0, vue.unref)(ns).cssVarBlockName("fill-color-1")})`,
offset: "0%"
}, null, 8, _hoisted_6$1), (0, vue.createElementVNode)("stop", {
"stop-color": `var(${(0, vue.unref)(ns).cssVarBlockName("fill-color-6")})`,
offset: "100%"
}, null, 8, _hoisted_7)], 8, _hoisted_5$4),
(0, vue.createElementVNode)("rect", {
id: `path-3-${(0, vue.unref)(id)}`,
x: "0",
y: "0",
width: "17",
height: "36"
}, null, 8, _hoisted_8)
]), (0, vue.createElementVNode)("g", _hoisted_9, [(0, vue.createElementVNode)("g", _hoisted_10, [(0, vue.createElementVNode)("g", _hoisted_11, [
(0, vue.createElementVNode)("path", {
d: "M39.5,86 C61.3152476,86 79,83.9106622 79,81.3333333 C79,78.7560045 57.3152476,78 35.5,78 C13.6847524,78 0,78.7560045 0,81.3333333 C0,83.9106622 17.6847524,86 39.5,86 Z",
fill: `var(${(0, vue.unref)(ns).cssVarBlockName("fill-color-3")})`
}, null, 8, _hoisted_12),
(0, vue.createElementVNode)("polygon", {
fill: `var(${(0, vue.unref)(ns).cssVarBlockName("fill-color-7")})`,
transform: "translate(27.500000, 51.500000) scale(1, -1) translate(-27.500000, -51.500000) ",
points: "13 58 53 58 42 45 2 45"
}, null, 8, _hoisted_13),
(0, vue.createElementVNode)("g", _hoisted_14, [
(0, vue.createElementVNode)("polygon", {
fill: `var(${(0, vue.unref)(ns).cssVarBlockName("fill-color-7")})`,
transform: "translate(11.500000, 5.000000) scale(1, -1) translate(-11.500000, -5.000000) ",
points: "2.84078316e-14 3 18 3 23 7 5 7"
}, null, 8, _hoisted_15),
(0, vue.createElementVNode)("polygon", {
fill: `var(${(0, vue.unref)(ns).cssVarBlockName("fill-color-5")})`,
points: "-3.69149156e-15 7 38 7 38 43 -3.69149156e-15 43"
}, null, 8, _hoisted_16),
(0, vue.createElementVNode)("rect", {
fill: `url(#linearGradient-1-${(0, vue.unref)(id)})`,
transform: "translate(46.500000, 25.000000) scale(-1, 1) translate(-46.500000, -25.000000) ",
x: "38",
y: "7",
width: "17",
height: "36"
}, null, 8, _hoisted_17),
(0, vue.createElementVNode)("polygon", {
fill: `var(${(0, vue.unref)(ns).cssVarBlockName("fill-color-2")})`,
transform: "translate(39.500000, 3.500000) scale(-1, 1) translate(-39.500000, -3.500000) ",
points: "24 7 41 7 55 -3.63806207e-12 38 -3.63806207e-12"
}, null, 8, _hoisted_18)
]),
(0, vue.createElementVNode)("rect", {
fill: `url(#linearGradient-2-${(0, vue.unref)(id)})`,
x: "13",
y: "45",
width: "40",
height: "36"
}, null, 8, _hoisted_19),
(0, vue.createElementVNode)("g", _hoisted_20, [(0, vue.createElementVNode)("use", {
fill: `var(${(0, vue.unref)(ns).cssVarBlockName("fill-color-8")})`,
transform: "translate(8.500000, 18.000000) scale(-1, 1) translate(-8.500000, -18.000000) ",
"xlink:href": `#path-3-${(0, vue.unref)(id)}`
}, null, 8, _hoisted_21), (0, vue.createElementVNode)("polygon", {
fill: `var(${(0, vue.unref)(ns).cssVarBlockName("fill-color-9")})`,
mask: `url(#mask-4-${(0, vue.unref)(id)})`,
transform: "translate(12.000000, 9.000000) scale(-1, 1) translate(-12.000000, -9.000000) ",
points: "7 0 24 0 20 18 7 16.5"
}, null, 8, _hoisted_22)]),
(0, vue.createElementVNode)("polygon", {
fill: `var(${(0, vue.unref)(ns).cssVarBlockName("fill-color-2")})`,
transform: "translate(66.000000, 51.500000) scale(-1, 1) translate(-66.000000, -51.500000) ",
points: "62 45 79 45 70 58 53 58"
}, null, 8, _hoisted_23)
])])])]);
};
}
});
//#endregion
//#region ../../packages/components/empty/src/img-empty.vue
var img_empty_default = img_empty_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/empty/src/empty.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$36 = ["src"];
const _hoisted_2$22 = { key: 1 };
var empty_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElEmpty",
__name: "empty",
props: emptyProps,
setup(__props) {
const props = __props;
const { t } = useLocale();
const ns = useNamespace("empty");
const emptyDescription = (0, vue.computed)(() => props.description || t("el.table.emptyText"));
const imageStyle = (0, vue.computed)(() => ({ width: addUnit(props.imageSize) }));
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()) }, [
(0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("image")),
style: (0, vue.normalizeStyle)(imageStyle.value)
}, [__props.image ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("img", {
key: 0,
src: __props.image,
ondragstart: "return false"
}, null, 8, _hoisted_1$36)) : (0, vue.renderSlot)(_ctx.$slots, "image", { key: 1 }, () => [(0, vue.createVNode)(img_empty_default)])], 6),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("description")) }, [_ctx.$slots.description ? (0, vue.renderSlot)(_ctx.$slots, "description", { key: 0 }) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("p", _hoisted_2$22, (0, vue.toDisplayString)(emptyDescription.value), 1))], 2),
_ctx.$slots.default ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("bottom"))
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2)) : (0, vue.createCommentVNode)("v-if", true)
], 2);
};
}
});
//#endregion
//#region ../../packages/components/empty/src/empty.vue
var empty_default = empty_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/empty/index.ts
const ElEmpty = withInstall(empty_default);
//#endregion
//#region ../../packages/components/image/src/image.ts
/**
* @deprecated Removed after 3.0.0, Use `ImageProps` instead.
*/
const imageProps = buildProps({
hideOnClickModal: Boolean,
src: {
type: String,
default: ""
},
fit: {
type: String,
values: [
"",
"contain",
"cover",
"fill",
"none",
"scale-down"
],
default: ""
},
loading: {
type: String,
values: ["eager", "lazy"]
},
lazy: Boolean,
scrollContainer: { type: definePropType([String, Object]) },
previewSrcList: {
type: definePropType(Array),
default: () => mutable([])
},
previewTeleported: Boolean,
zIndex: { type: Number },
initialIndex: {
type: Number,
default: 0
},
infinite: {
type: Boolean,
default: true
},
closeOnPressEscape: {
type: Boolean,
default: true
},
zoomRate: {
type: Number,
default: 1.2
},
scale: {
type: Number,
default: 1
},
minScale: {
type: Number,
default: .2
},
maxScale: {
type: Number,
default: 7
},
showProgress: Boolean,
crossorigin: { type: definePropType(String) }
});
const imageEmits = {
load: (evt) => evt instanceof Event,
error: (evt) => evt instanceof Event,
switch: (val) => isNumber(val),
close: () => true,
show: () => true
};
//#endregion
//#region ../../packages/components/image-viewer/src/image-viewer.ts
/**
* @deprecated Removed after 3.0.0, Use `ImageViewerProps` instead.
*/
const imageViewerProps = buildProps({
urlList: {
type: definePropType(Array),
default: () => mutable([])
},
zIndex: { type: Number },
initialIndex: {
type: Number,
default: 0
},
infinite: {
type: Boolean,
default: true
},
hideOnClickModal: Boolean,
teleported: Boolean,
closeOnPressEscape: {
type: Boolean,
default: true
},
zoomRate: {
type: Number,
default: 1.2
},
scale: {
type: Number,
default: 1
},
minScale: {
type: Number,
default: .2
},
maxScale: {
type: Number,
default: 7
},
showProgress: Boolean,
crossorigin: { type: definePropType(String) }
});
const imageViewerEmits = {
close: () => true,
error: (evt) => evt instanceof Event,
switch: (index) => isNumber(index),
rotate: (deg) => isNumber(deg)
};
//#endregion
//#region ../../packages/components/image-viewer/src/image-viewer.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$35 = ["src", "crossorigin"];
var image_viewer_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElImageViewer",
__name: "image-viewer",
props: imageViewerProps,
emits: imageViewerEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const modes = {
CONTAIN: {
name: "contain",
icon: (0, vue.markRaw)(full_screen_default)
},
ORIGINAL: {
name: "original",
icon: (0, vue.markRaw)(scale_to_original_default)
}
};
const props = __props;
const emit = __emit;
let stopWheelListener;
const { t } = useLocale();
const ns = useNamespace("image-viewer");
const { nextZIndex } = useZIndex();
const wrapper = (0, vue.ref)();
const imgRef = (0, vue.ref)();
const scopeEventListener = (0, vue.effectScope)();
const scaleClamped = (0, vue.computed)(() => {
const { scale, minScale, maxScale } = props;
return clamp$2(scale, minScale, maxScale);
});
const loading = (0, vue.ref)(true);
const loadError = (0, vue.ref)(false);
const visible = (0, vue.ref)(false);
const activeIndex = (0, vue.ref)(props.initialIndex);
const mode = (0, vue.shallowRef)(modes.CONTAIN);
const transform = (0, vue.ref)({
scale: scaleClamped.value,
deg: 0,
offsetX: 0,
offsetY: 0,
enableTransition: false
});
const zIndex = (0, vue.ref)(props.zIndex ?? nextZIndex());
useLockscreen(visible, { ns });
const isSingle = (0, vue.computed)(() => {
const { urlList } = props;
return urlList.length <= 1;
});
const isFirst = (0, vue.computed)(() => activeIndex.value === 0);
const isLast = (0, vue.computed)(() => activeIndex.value === props.urlList.length - 1);
const currentImg = (0, vue.computed)(() => props.urlList[activeIndex.value]);
const arrowPrevKls = (0, vue.computed)(() => [
ns.e("btn"),
ns.e("prev"),
ns.is("disabled", !props.infinite && isFirst.value)
]);
const arrowNextKls = (0, vue.computed)(() => [
ns.e("btn"),
ns.e("next"),
ns.is("disabled", !props.infinite && isLast.value)
]);
const imgStyle = (0, vue.computed)(() => {
const { scale, deg, offsetX, offsetY, enableTransition } = transform.value;
let translateX = offsetX / scale;
let translateY = offsetY / scale;
const radian = deg * Math.PI / 180;
const cosRadian = Math.cos(radian);
const sinRadian = Math.sin(radian);
translateX = translateX * cosRadian + translateY * sinRadian;
translateY = translateY * cosRadian - offsetX / scale * sinRadian;
const style = {
transform: `scale(${scale}) rotate(${deg}deg) translate(${translateX}px, ${translateY}px)`,
transition: enableTransition ? "transform .3s" : ""
};
if (mode.value.name === modes.CONTAIN.name) style.maxWidth = style.maxHeight = "100%";
return style;
});
const progress = (0, vue.computed)(() => `${activeIndex.value + 1} / ${props.urlList.length}`);
function hide() {
unregisterEventListener();
stopWheelListener?.();
visible.value = false;
emit("close");
}
function registerEventListener() {
const keydownHandler = throttle((e) => {
switch (getEventCode(e)) {
case EVENT_CODE.esc:
props.closeOnPressEscape && hide();
break;
case EVENT_CODE.space:
toggleMode();
break;
case EVENT_CODE.left:
prev();
break;
case EVENT_CODE.up:
handleActions("zoomIn");
break;
case EVENT_CODE.right:
next();
break;
case EVENT_CODE.down:
handleActions("zoomOut");
break;
}
});
const mousewheelHandler = throttle((e) => {
handleActions((e.deltaY || e.deltaX) < 0 ? "zoomIn" : "zoomOut", {
zoomRate: props.zoomRate,
enableTransition: false
});
});
scopeEventListener.run(() => {
useEventListener(document, "keydown", keydownHandler);
useEventListener(wrapper, "wheel", mousewheelHandler);
});
}
function unregisterEventListener() {
scopeEventListener.stop();
}
function handleImgLoad() {
loading.value = false;
}
function handleImgError(e) {
loadError.value = true;
loading.value = false;
emit("error", e);
e.target.alt = t("el.image.error");
}
function handleMouseDown(e) {
if (loading.value || e.button !== 0 || !wrapper.value) return;
transform.value.enableTransition = false;
const { offsetX, offsetY } = transform.value;
const startX = e.pageX;
const startY = e.pageY;
const dragHandler = throttle((ev) => {
transform.value = {
...transform.value,
offsetX: offsetX + ev.pageX - startX,
offsetY: offsetY + ev.pageY - startY
};
});
const removeMousemove = useEventListener(document, "mousemove", dragHandler);
const removeMouseup = useEventListener(document, "mouseup", () => {
removeMousemove();
removeMouseup();
});
e.preventDefault();
}
function handleTouchStart(e) {
if (loading.value || !wrapper.value || e.touches.length !== 1) return;
transform.value.enableTransition = false;
const { offsetX, offsetY } = transform.value;
const { pageX: startX, pageY: startY } = e.touches[0];
const dragHandler = throttle((ev) => {
const targetTouch = ev.touches[0];
transform.value = {
...transform.value,
offsetX: offsetX + targetTouch.pageX - startX,
offsetY: offsetY + targetTouch.pageY - startY
};
});
const removeTouchmove = useEventListener(document, "touchmove", dragHandler);
const removeTouchend = useEventListener(document, "touchend", () => {
removeTouchmove();
removeTouchend();
});
e.preventDefault();
}
function reset() {
transform.value = {
scale: scaleClamped.value,
deg: 0,
offsetX: 0,
offsetY: 0,
enableTransition: false
};
}
function toggleMode() {
if (loading.value || loadError.value) return;
const modeNames = keysOf(modes);
const modeValues = Object.values(modes);
const currentMode = mode.value.name;
mode.value = modes[modeNames[(modeValues.findIndex((i) => i.name === currentMode) + 1) % modeNames.length]];
reset();
}
function setActiveItem(index) {
loadError.value = false;
const len = props.urlList.length;
activeIndex.value = (index + len) % len;
}
function prev() {
if (isFirst.value && !props.infinite) return;
setActiveItem(activeIndex.value - 1);
}
function next() {
if (isLast.value && !props.infinite) return;
setActiveItem(activeIndex.value + 1);
}
function handleActions(action, options = {}) {
if (loading.value || loadError.value) return;
const { minScale, maxScale } = props;
const { zoomRate, rotateDeg, enableTransition } = {
zoomRate: props.zoomRate,
rotateDeg: 90,
enableTransition: true,
...options
};
switch (action) {
case "zoomOut":
if (transform.value.scale > minScale) transform.value.scale = Number.parseFloat((transform.value.scale / zoomRate).toFixed(3));
break;
case "zoomIn":
if (transform.value.scale < maxScale) transform.value.scale = Number.parseFloat((transform.value.scale * zoomRate).toFixed(3));
break;
case "clockwise":
transform.value.deg += rotateDeg;
emit("rotate", transform.value.deg);
break;
case "anticlockwise":
transform.value.deg -= rotateDeg;
emit("rotate", transform.value.deg);
break;
}
transform.value.enableTransition = enableTransition;
}
function onFocusoutPrevented(event) {
if (event.detail?.focusReason === "pointer") event.preventDefault();
}
function onCloseRequested() {
if (props.closeOnPressEscape) hide();
}
function wheelHandler(e) {
if (!e.ctrlKey) return;
if (e.deltaY < 0) {
e.preventDefault();
return false;
} else if (e.deltaY > 0) {
e.preventDefault();
return false;
}
}
(0, vue.watch)(() => scaleClamped.value, (val) => {
transform.value.scale = val;
});
(0, vue.watch)(currentImg, () => {
(0, vue.nextTick)(() => {
if (!imgRef.value?.complete) loading.value = true;
});
});
(0, vue.watch)(activeIndex, (val) => {
reset();
emit("switch", val);
});
(0, vue.onMounted)(() => {
visible.value = true;
registerEventListener();
stopWheelListener = useEventListener("wheel", wheelHandler, { passive: false });
});
__expose({ setActiveItem });
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElTeleport), {
to: "body",
disabled: !__props.teleported
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)(vue.Transition, {
name: "viewer-fade",
appear: ""
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", {
ref_key: "wrapper",
ref: wrapper,
tabindex: -1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("wrapper")),
style: (0, vue.normalizeStyle)({ zIndex: zIndex.value })
}, [(0, vue.createVNode)((0, vue.unref)(focus_trap_default), {
loop: "",
trapped: "",
"focus-trap-el": wrapper.value,
"focus-start-el": "container",
onFocusoutPrevented,
onReleaseRequested: onCloseRequested
}, {
default: (0, vue.withCtx)(() => [
(0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("mask")),
onClick: _cache[0] || (_cache[0] = (0, vue.withModifiers)(($event) => __props.hideOnClickModal && hide(), ["self"]))
}, null, 2),
(0, vue.createCommentVNode)(" CLOSE "),
(0, vue.createElementVNode)("span", {
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("btn"), (0, vue.unref)(ns).e("close")]),
onClick: hide
}, [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(close_default))]),
_: 1
})], 2),
(0, vue.createCommentVNode)(" ARROW "),
!isSingle.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [(0, vue.createElementVNode)("span", {
class: (0, vue.normalizeClass)(arrowPrevKls.value),
onClick: prev
}, [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(arrow_left_default))]),
_: 1
})], 2), (0, vue.createElementVNode)("span", {
class: (0, vue.normalizeClass)(arrowNextKls.value),
onClick: next
}, [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(arrow_right_default))]),
_: 1
})], 2)], 64)) : (0, vue.createCommentVNode)("v-if", true),
_ctx.$slots.progress || __props.showProgress ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("btn"), (0, vue.unref)(ns).e("progress")])
}, [(0, vue.renderSlot)(_ctx.$slots, "progress", {
activeIndex: activeIndex.value,
total: __props.urlList.length
}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(progress.value), 1)])], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createCommentVNode)(" ACTIONS "),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("btn"), (0, vue.unref)(ns).e("actions")]) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("actions__inner")) }, [(0, vue.renderSlot)(_ctx.$slots, "toolbar", {
actions: handleActions,
prev,
next,
reset: toggleMode,
activeIndex: activeIndex.value,
setActiveItem
}, () => [
(0, vue.createVNode)((0, vue.unref)(ElIcon), { onClick: _cache[1] || (_cache[1] = ($event) => handleActions("zoomOut")) }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(zoom_out_default))]),
_: 1
}),
(0, vue.createVNode)((0, vue.unref)(ElIcon), { onClick: _cache[2] || (_cache[2] = ($event) => handleActions("zoomIn")) }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(zoom_in_default))]),
_: 1
}),
(0, vue.createElementVNode)("i", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("actions__divider")) }, null, 2),
(0, vue.createVNode)((0, vue.unref)(ElIcon), { onClick: toggleMode }, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(mode.value.icon)))]),
_: 1
}),
(0, vue.createElementVNode)("i", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("actions__divider")) }, null, 2),
(0, vue.createVNode)((0, vue.unref)(ElIcon), { onClick: _cache[3] || (_cache[3] = ($event) => handleActions("anticlockwise")) }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(refresh_left_default))]),
_: 1
}),
(0, vue.createVNode)((0, vue.unref)(ElIcon), { onClick: _cache[4] || (_cache[4] = ($event) => handleActions("clockwise")) }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(refresh_right_default))]),
_: 1
})
])], 2)], 2),
(0, vue.createCommentVNode)(" CANVAS "),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("canvas")) }, [loadError.value && _ctx.$slots["viewer-error"] ? (0, vue.renderSlot)(_ctx.$slots, "viewer-error", {
key: 0,
activeIndex: activeIndex.value,
src: currentImg.value
}) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("img", {
ref_key: "imgRef",
ref: imgRef,
key: currentImg.value,
src: currentImg.value,
style: (0, vue.normalizeStyle)(imgStyle.value),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("img")),
crossorigin: __props.crossorigin,
onLoad: handleImgLoad,
onError: handleImgError,
onMousedown: handleMouseDown,
onTouchstart: handleTouchStart
}, null, 46, _hoisted_1$35))], 2),
(0, vue.renderSlot)(_ctx.$slots, "default")
]),
_: 3
}, 8, ["focus-trap-el"])], 6)]),
_: 3
})]),
_: 3
}, 8, ["disabled"]);
};
}
});
//#endregion
//#region ../../packages/components/image-viewer/src/image-viewer.vue
var image_viewer_default = image_viewer_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/image-viewer/index.ts
const ElImageViewer = withInstall(image_viewer_default);
//#endregion
//#region ../../packages/components/image/src/image.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$34 = [
"src",
"loading",
"crossorigin"
];
const _hoisted_2$21 = { key: 0 };
var image_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElImage",
inheritAttrs: false,
__name: "image",
props: imageProps,
emits: imageEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const { t } = useLocale();
const ns = useNamespace("image");
const rawAttrs = (0, vue.useAttrs)();
const containerAttrs = (0, vue.computed)(() => {
return fromPairs(Object.entries(rawAttrs).filter(([key]) => /^(data-|on[A-Z])/i.test(key) || ["id", "style"].includes(key)));
});
const imgAttrs = useAttrs({
excludeListeners: true,
excludeKeys: (0, vue.computed)(() => {
return Object.keys(containerAttrs.value);
})
});
const imageSrc = (0, vue.ref)();
const hasLoadError = (0, vue.ref)(false);
const isLoading = (0, vue.ref)(true);
const showViewer = (0, vue.ref)(false);
const container = (0, vue.ref)();
const _scrollContainer = (0, vue.ref)();
const supportLoading = isClient && "loading" in HTMLImageElement.prototype;
let stopScrollListener;
const imageKls = (0, vue.computed)(() => [
ns.e("inner"),
preview.value && ns.e("preview"),
isLoading.value && ns.is("loading")
]);
const imageStyle = (0, vue.computed)(() => {
const { fit } = props;
if (isClient && fit) return { objectFit: fit };
return {};
});
const preview = (0, vue.computed)(() => {
const { previewSrcList } = props;
return isArray$1(previewSrcList) && previewSrcList.length > 0;
});
const imageIndex = (0, vue.computed)(() => {
const { previewSrcList, initialIndex } = props;
let previewIndex = initialIndex;
if (initialIndex > previewSrcList.length - 1) previewIndex = 0;
return previewIndex;
});
const isManual = (0, vue.computed)(() => {
if (props.loading === "eager") return false;
return !supportLoading && props.loading === "lazy" || props.lazy;
});
const loadImage = () => {
if (!isClient) return;
isLoading.value = true;
hasLoadError.value = false;
imageSrc.value = props.src;
};
function handleLoad(event) {
isLoading.value = false;
hasLoadError.value = false;
emit("load", event);
}
function handleError(event) {
isLoading.value = false;
hasLoadError.value = true;
emit("error", event);
}
function handleLazyLoad(isIntersecting) {
if (isIntersecting) {
loadImage();
removeLazyLoadListener();
}
}
const lazyLoadHandler = useThrottleFn(handleLazyLoad, 200, true);
async function addLazyLoadListener() {
if (!isClient) return;
await (0, vue.nextTick)();
const { scrollContainer } = props;
if (isElement$1(scrollContainer)) _scrollContainer.value = scrollContainer;
else if (isString(scrollContainer) && scrollContainer !== "") _scrollContainer.value = document.querySelector(scrollContainer) ?? void 0;
else if (container.value) {
const scrollContainer = getScrollContainer(container.value);
_scrollContainer.value = isWindow(scrollContainer) ? void 0 : scrollContainer;
}
const { stop } = useIntersectionObserver(container, ([entry]) => {
lazyLoadHandler(entry.isIntersecting);
}, { root: _scrollContainer });
stopScrollListener = stop;
}
function removeLazyLoadListener() {
if (!isClient || !lazyLoadHandler) return;
stopScrollListener?.();
_scrollContainer.value = void 0;
stopScrollListener = void 0;
}
function clickHandler() {
if (!preview.value) return;
showViewer.value = true;
emit("show");
}
function closeViewer() {
showViewer.value = false;
emit("close");
}
function switchViewer(val) {
emit("switch", val);
}
(0, vue.watch)(() => props.src, () => {
if (isManual.value) {
isLoading.value = true;
hasLoadError.value = false;
removeLazyLoadListener();
addLazyLoadListener();
} else loadImage();
});
(0, vue.onMounted)(() => {
if (isManual.value) addLazyLoadListener();
else loadImage();
});
__expose({ showPreview: clickHandler });
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", (0, vue.mergeProps)({
ref_key: "container",
ref: container
}, containerAttrs.value, { class: [(0, vue.unref)(ns).b(), _ctx.$attrs.class] }), [hasLoadError.value ? (0, vue.renderSlot)(_ctx.$slots, "error", { key: 0 }, () => [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("error")) }, (0, vue.toDisplayString)((0, vue.unref)(t)("el.image.error")), 3)]) : ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, [imageSrc.value !== void 0 ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("img", (0, vue.mergeProps)({ key: 0 }, (0, vue.unref)(imgAttrs), {
src: imageSrc.value,
loading: __props.loading,
style: imageStyle.value,
class: imageKls.value,
crossorigin: __props.crossorigin,
onClick: clickHandler,
onLoad: handleLoad,
onError: handleError
}), null, 16, _hoisted_1$34)) : (0, vue.createCommentVNode)("v-if", true), isLoading.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("wrapper"))
}, [(0, vue.renderSlot)(_ctx.$slots, "placeholder", {}, () => [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("placeholder")) }, null, 2)])], 2)) : (0, vue.createCommentVNode)("v-if", true)], 64)), preview.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 2 }, [showViewer.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElImageViewer), {
key: 0,
"z-index": __props.zIndex,
"initial-index": imageIndex.value,
infinite: __props.infinite,
"zoom-rate": __props.zoomRate,
"min-scale": __props.minScale,
"max-scale": __props.maxScale,
"show-progress": __props.showProgress,
"url-list": __props.previewSrcList,
scale: __props.scale,
crossorigin: __props.crossorigin,
"hide-on-click-modal": __props.hideOnClickModal,
teleported: __props.previewTeleported,
"close-on-press-escape": __props.closeOnPressEscape,
onClose: closeViewer,
onSwitch: switchViewer
}, (0, vue.createSlots)({
toolbar: (0, vue.withCtx)((toolbar) => [(0, vue.renderSlot)(_ctx.$slots, "toolbar", (0, vue.normalizeProps)((0, vue.guardReactiveProps)(toolbar)))]),
default: (0, vue.withCtx)(() => [_ctx.$slots.viewer ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_2$21, [(0, vue.renderSlot)(_ctx.$slots, "viewer")])) : (0, vue.createCommentVNode)("v-if", true)]),
_: 2
}, [_ctx.$slots.progress ? {
name: "progress",
fn: (0, vue.withCtx)((progress) => [(0, vue.renderSlot)(_ctx.$slots, "progress", (0, vue.normalizeProps)((0, vue.guardReactiveProps)(progress)))]),
key: "0"
} : void 0, _ctx.$slots["viewer-error"] ? {
name: "viewer-error",
fn: (0, vue.withCtx)((viewerError) => [(0, vue.renderSlot)(_ctx.$slots, "viewer-error", (0, vue.normalizeProps)((0, vue.guardReactiveProps)(viewerError)))]),
key: "1"
} : void 0]), 1032, [
"z-index",
"initial-index",
"infinite",
"zoom-rate",
"min-scale",
"max-scale",
"show-progress",
"url-list",
"scale",
"crossorigin",
"hide-on-click-modal",
"teleported",
"close-on-press-escape"
])) : (0, vue.createCommentVNode)("v-if", true)], 64)) : (0, vue.createCommentVNode)("v-if", true)], 16);
};
}
});
//#endregion
//#region ../../packages/components/image/src/image.vue
var image_default = image_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/image/index.ts
const ElImage = withInstall(image_default);
//#endregion
//#region ../../packages/components/input-number/src/input-number.ts
/**
* @deprecated Removed after 3.0.0, Use `InputNumberProps` instead.
*/
const inputNumberProps = buildProps({
id: {
type: String,
default: void 0
},
step: {
type: Number,
default: 1
},
stepStrictly: Boolean,
max: {
type: Number,
default: Number.MAX_SAFE_INTEGER
},
min: {
type: Number,
default: Number.MIN_SAFE_INTEGER
},
modelValue: { type: [Number, null] },
readonly: Boolean,
disabled: {
type: Boolean,
default: void 0
},
size: useSizeProp,
controls: {
type: Boolean,
default: true
},
controlsPosition: {
type: String,
default: "",
values: ["", "right"]
},
valueOnClear: {
type: definePropType([
String,
Number,
null
]),
validator: (val) => val === null || isNumber(val) || ["min", "max"].includes(val),
default: null
},
name: String,
placeholder: String,
precision: {
type: Number,
validator: (val) => val >= 0 && val === Number.parseInt(`${val}`, 10)
},
validateEvent: {
type: Boolean,
default: true
},
...useAriaProps(["ariaLabel"]),
inputmode: {
type: definePropType(String),
default: void 0
},
align: {
type: definePropType(String),
default: "center"
},
disabledScientific: Boolean
});
const inputNumberEmits = {
[CHANGE_EVENT]: (cur, prev) => prev !== cur,
blur: (e) => e instanceof FocusEvent,
focus: (e) => e instanceof FocusEvent,
[INPUT_EVENT]: (val) => isNumber(val) || isNil(val),
[UPDATE_MODEL_EVENT]: (val) => isNumber(val) || isNil(val)
};
//#endregion
//#region ../../packages/components/input-number/src/input-number.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$33 = ["aria-label"];
const _hoisted_2$20 = ["aria-label"];
var input_number_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElInputNumber",
__name: "input-number",
props: inputNumberProps,
emits: inputNumberEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const { t } = useLocale();
const ns = useNamespace("input-number");
const input = (0, vue.ref)();
const data = (0, vue.reactive)({
currentValue: props.modelValue,
userInput: null
});
const { formItem } = useFormItem();
const minDisabled = (0, vue.computed)(() => isNumber(props.modelValue) && props.modelValue <= props.min);
const maxDisabled = (0, vue.computed)(() => isNumber(props.modelValue) && props.modelValue >= props.max);
const numPrecision = (0, vue.computed)(() => {
const stepPrecision = getPrecision(props.step);
if (!isUndefined(props.precision)) {
if (stepPrecision > props.precision) /* @__PURE__ */ debugWarn("InputNumber", "precision should not be less than the decimal places of step");
return props.precision;
} else return Math.max(getPrecision(props.modelValue), stepPrecision);
});
const controlsAtRight = (0, vue.computed)(() => {
return props.controls && props.controlsPosition === "right";
});
const inputNumberSize = useFormSize();
const inputNumberDisabled = useFormDisabled();
const displayValue = (0, vue.computed)(() => {
if (data.userInput !== null) return data.userInput;
let currentValue = data.currentValue;
if (isNil(currentValue)) return "";
if (isNumber(currentValue)) {
if (Number.isNaN(currentValue)) return "";
if (!isUndefined(props.precision)) currentValue = currentValue.toFixed(props.precision);
}
return currentValue;
});
const toPrecision = (num, pre) => {
if (isUndefined(pre)) pre = numPrecision.value;
if (pre === 0) return Math.round(num);
let snum = String(num);
const pointPos = snum.indexOf(".");
if (pointPos === -1) return num;
if (!snum.replace(".", "").split("")[pointPos + pre]) return num;
const length = snum.length;
if (snum.charAt(length - 1) === "5") snum = `${snum.slice(0, Math.max(0, length - 1))}6`;
return Number.parseFloat(Number(snum).toFixed(pre));
};
const getPrecision = (value) => {
if (isNil(value)) return 0;
const valueString = value.toString();
const dotPosition = valueString.indexOf(".");
let precision = 0;
if (dotPosition !== -1) precision = valueString.length - dotPosition - 1;
return precision;
};
const ensurePrecision = (val, coefficient = 1) => {
if (!isNumber(val)) return data.currentValue;
if (val >= Number.MAX_SAFE_INTEGER && coefficient === 1) {
/* @__PURE__ */ debugWarn("InputNumber", "The value has reached the maximum safe integer limit.");
return val;
} else if (val <= Number.MIN_SAFE_INTEGER && coefficient === -1) {
/* @__PURE__ */ debugWarn("InputNumber", "The value has reached the minimum safe integer limit.");
return val;
}
return toPrecision(val + props.step * coefficient);
};
const handleKeydown = (event) => {
const code = getEventCode(event);
const key = getEventKey(event);
if (props.disabledScientific && ["e", "E"].includes(key)) {
event.preventDefault();
return;
}
switch (code) {
case EVENT_CODE.up:
event.preventDefault();
increase();
break;
case EVENT_CODE.down:
event.preventDefault();
decrease();
break;
}
};
const increase = () => {
if (props.readonly || inputNumberDisabled.value || maxDisabled.value) return;
setCurrentValue(ensurePrecision(Number(displayValue.value) || 0));
emit(INPUT_EVENT, data.currentValue);
setCurrentValueToModelValue();
};
const decrease = () => {
if (props.readonly || inputNumberDisabled.value || minDisabled.value) return;
setCurrentValue(ensurePrecision(Number(displayValue.value) || 0, -1));
emit(INPUT_EVENT, data.currentValue);
setCurrentValueToModelValue();
};
const verifyValue = (value, update) => {
const { max, min, step, precision, stepStrictly, valueOnClear } = props;
if (max < min) throwError("InputNumber", "min should not be greater than max.");
let newVal = Number(value);
if (isNil(value) || Number.isNaN(newVal)) return null;
if (value === "") {
if (valueOnClear === null) return null;
newVal = isString(valueOnClear) ? {
min,
max
}[valueOnClear] : valueOnClear;
}
if (stepStrictly) {
newVal = toPrecision(Math.round(toPrecision(newVal / step)) * step, precision);
if (newVal !== value) update && emit(UPDATE_MODEL_EVENT, newVal);
}
if (!isUndefined(precision)) newVal = toPrecision(newVal, precision);
if (newVal > max || newVal < min) {
newVal = newVal > max ? max : min;
update && emit(UPDATE_MODEL_EVENT, newVal);
}
return newVal;
};
const setCurrentValue = (value, emitChange = true) => {
const oldVal = data.currentValue;
const newVal = verifyValue(value);
if (!emitChange) {
emit(UPDATE_MODEL_EVENT, newVal);
return;
}
data.userInput = null;
if (oldVal === newVal && value) return;
emit(UPDATE_MODEL_EVENT, newVal);
if (oldVal !== newVal) emit(CHANGE_EVENT, newVal, oldVal);
if (props.validateEvent) formItem?.validate?.("change").catch((err) => /* @__PURE__ */ debugWarn(err));
data.currentValue = newVal;
};
const handleInput = (value) => {
data.userInput = value;
const newVal = value === "" ? null : Number(value);
emit(INPUT_EVENT, newVal);
setCurrentValue(newVal, false);
};
const handleInputChange = (value) => {
const newVal = value !== "" ? Number(value) : "";
if (isNumber(newVal) && !Number.isNaN(newVal) || value === "") setCurrentValue(newVal);
setCurrentValueToModelValue();
data.userInput = null;
};
const focus = () => {
input.value?.focus?.();
};
const blur = () => {
input.value?.blur?.();
};
const handleFocus = (event) => {
emit("focus", event);
};
const handleBlur = (event) => {
data.userInput = null;
if (data.currentValue === null && input.value?.input) input.value.input.value = "";
emit("blur", event);
if (props.validateEvent) formItem?.validate?.("blur").catch((err) => /* @__PURE__ */ debugWarn(err));
};
const setCurrentValueToModelValue = () => {
if (data.currentValue !== props.modelValue) data.currentValue = props.modelValue;
};
const handleWheel = (e) => {
if (document.activeElement === e.target) e.preventDefault();
};
(0, vue.watch)(() => props.modelValue, (value, oldValue) => {
const newValue = verifyValue(value, true);
if (data.userInput === null && newValue !== oldValue) data.currentValue = newValue;
}, { immediate: true });
(0, vue.watch)(() => props.precision, () => {
data.currentValue = verifyValue(props.modelValue);
});
(0, vue.onMounted)(() => {
const { min, max, modelValue } = props;
const innerInput = input.value?.input;
innerInput.setAttribute("role", "spinbutton");
if (Number.isFinite(max)) innerInput.setAttribute("aria-valuemax", String(max));
else innerInput.removeAttribute("aria-valuemax");
if (Number.isFinite(min)) innerInput.setAttribute("aria-valuemin", String(min));
else innerInput.removeAttribute("aria-valuemin");
innerInput.setAttribute("aria-valuenow", data.currentValue || data.currentValue === 0 ? String(data.currentValue) : "");
innerInput.setAttribute("aria-disabled", String(inputNumberDisabled.value));
if (!isNumber(modelValue) && modelValue != null) {
let val = Number(modelValue);
if (Number.isNaN(val)) val = null;
emit(UPDATE_MODEL_EVENT, val);
}
innerInput.addEventListener("wheel", handleWheel, { passive: false });
});
(0, vue.onUpdated)(() => {
(input.value?.input)?.setAttribute("aria-valuenow", `${data.currentValue ?? ""}`);
});
__expose({
focus,
blur
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).b(),
(0, vue.unref)(ns).m((0, vue.unref)(inputNumberSize)),
(0, vue.unref)(ns).is("disabled", (0, vue.unref)(inputNumberDisabled)),
(0, vue.unref)(ns).is("without-controls", !__props.controls),
(0, vue.unref)(ns).is("controls-right", controlsAtRight.value),
(0, vue.unref)(ns).is(__props.align, !!__props.align)
]),
onDragstart: _cache[0] || (_cache[0] = (0, vue.withModifiers)(() => {}, ["prevent"]))
}, [
__props.controls ? (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 0,
role: "button",
"aria-label": (0, vue.unref)(t)("el.inputNumber.decrease"),
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("decrease"), (0, vue.unref)(ns).is("disabled", minDisabled.value)]),
onKeydown: (0, vue.withKeys)(decrease, ["enter"])
}, [(0, vue.renderSlot)(_ctx.$slots, "decrease-icon", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [controlsAtRight.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(arrow_down_default), { key: 0 })) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(minus_default), { key: 1 }))]),
_: 1
})])], 42, _hoisted_1$33)), [[(0, vue.unref)(vRepeatClick), decrease]]) : (0, vue.createCommentVNode)("v-if", true),
__props.controls ? (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 1,
role: "button",
"aria-label": (0, vue.unref)(t)("el.inputNumber.increase"),
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("increase"), (0, vue.unref)(ns).is("disabled", maxDisabled.value)]),
onKeydown: (0, vue.withKeys)(increase, ["enter"])
}, [(0, vue.renderSlot)(_ctx.$slots, "increase-icon", {}, () => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [controlsAtRight.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(arrow_up_default), { key: 0 })) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(plus_default), { key: 1 }))]),
_: 1
})])], 42, _hoisted_2$20)), [[(0, vue.unref)(vRepeatClick), increase]]) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createVNode)((0, vue.unref)(ElInput), {
id: __props.id,
ref_key: "input",
ref: input,
type: "number",
step: __props.step,
"model-value": displayValue.value,
placeholder: __props.placeholder,
readonly: __props.readonly,
disabled: (0, vue.unref)(inputNumberDisabled),
size: (0, vue.unref)(inputNumberSize),
max: __props.max,
min: __props.min,
name: __props.name,
"aria-label": __props.ariaLabel,
"validate-event": false,
inputmode: __props.inputmode,
onKeydown: handleKeydown,
onBlur: handleBlur,
onFocus: handleFocus,
onInput: handleInput,
onChange: handleInputChange
}, (0, vue.createSlots)({ _: 2 }, [_ctx.$slots.prefix ? {
name: "prefix",
fn: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "prefix")]),
key: "0"
} : void 0, _ctx.$slots.suffix ? {
name: "suffix",
fn: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "suffix")]),
key: "1"
} : void 0]), 1032, [
"id",
"step",
"model-value",
"placeholder",
"readonly",
"disabled",
"size",
"max",
"min",
"name",
"aria-label",
"inputmode"
])
], 34);
};
}
});
//#endregion
//#region ../../packages/components/input-number/src/input-number.vue
var input_number_default = input_number_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/input-number/index.ts
const ElInputNumber = withInstall(input_number_default);
//#endregion
//#region ../../packages/components/input-tag/src/input-tag.ts
/**
* @deprecated Removed after 3.0.0, Use `InputTagProps` instead.
*/
const inputTagProps = buildProps({
modelValue: { type: definePropType(Array) },
max: Number,
tagType: {
...tagProps.type,
default: "info"
},
tagEffect: tagProps.effect,
effect: {
type: definePropType(String),
default: "light"
},
trigger: {
type: definePropType(String),
default: EVENT_CODE.enter
},
draggable: Boolean,
delimiter: {
type: [String, RegExp],
default: ""
},
size: useSizeProp,
clearable: Boolean,
clearIcon: {
type: iconPropType,
default: circle_close_default
},
disabled: {
type: Boolean,
default: void 0
},
validateEvent: {
type: Boolean,
default: true
},
readonly: Boolean,
autofocus: Boolean,
id: {
type: String,
default: void 0
},
tabindex: {
type: [String, Number],
default: 0
},
maxlength: { type: [String, Number] },
minlength: { type: [String, Number] },
placeholder: String,
autocomplete: {
type: definePropType(String),
default: "off"
},
saveOnBlur: {
type: Boolean,
default: true
},
collapseTags: Boolean,
collapseTagsTooltip: Boolean,
maxCollapseTags: {
type: Number,
default: 1
},
ariaLabel: String
});
const inputTagEmits = {
[UPDATE_MODEL_EVENT]: (value) => isArray$1(value) || isUndefined(value),
[CHANGE_EVENT]: (value) => isArray$1(value) || isUndefined(value),
[INPUT_EVENT]: (value) => isString(value),
"add-tag": (value) => isString(value) || isArray$1(value),
"remove-tag": (value, index) => isString(value) && isNumber(index),
"drag-tag": (oldIndex, newIndex, value) => isNumber(oldIndex) && isNumber(newIndex) && isString(value),
focus: (evt) => evt instanceof FocusEvent,
blur: (evt) => evt instanceof FocusEvent,
clear: () => true
};
//#endregion
//#region ../../packages/components/input-tag/src/composables/use-drag-tag.ts
function useDragTag({ wrapperRef, handleDragged, afterDragged }) {
const ns = useNamespace("input-tag");
const dropIndicatorRef = (0, vue.shallowRef)();
const showDropIndicator = (0, vue.ref)(false);
let draggingIndex;
let draggingTag;
let dropIndex;
let dropType;
function getTagClassName(index) {
return `.${ns.e("inner")} .${ns.namespace.value}-tag:nth-child(${index + 1})`;
}
function handleDragStart(event, index) {
draggingIndex = index;
draggingTag = wrapperRef.value.querySelector(getTagClassName(index));
if (draggingTag) draggingTag.style.opacity = "0.5";
event.dataTransfer.effectAllowed = "move";
}
function handleDragOver(event, index) {
dropIndex = index;
event.preventDefault();
event.dataTransfer.dropEffect = "move";
if (isUndefined(draggingIndex) || draggingIndex === index) {
showDropIndicator.value = false;
return;
}
const dropPosition = wrapperRef.value.querySelector(getTagClassName(index)).getBoundingClientRect();
const dropPrev = !(draggingIndex + 1 === index);
const dropNext = !(draggingIndex - 1 === index);
const distance = event.clientX - dropPosition.left;
const prevPercent = dropPrev ? dropNext ? .5 : 1 : -1;
const nextPercent = dropNext ? dropPrev ? .5 : 0 : 1;
if (distance <= dropPosition.width * prevPercent) dropType = "before";
else if (distance > dropPosition.width * nextPercent) dropType = "after";
else dropType = void 0;
const innerEl = wrapperRef.value.querySelector(`.${ns.e("inner")}`);
const innerPosition = innerEl.getBoundingClientRect();
const gap = Number.parseFloat(getStyle(innerEl, "gap")) / 2;
const indicatorTop = dropPosition.top - innerPosition.top;
let indicatorLeft = -9999;
if (dropType === "before") indicatorLeft = Math.max(dropPosition.left - innerPosition.left - gap, Math.floor(-gap / 2));
else if (dropType === "after") {
const left = dropPosition.right - innerPosition.left;
indicatorLeft = left + (innerPosition.width === left ? Math.floor(gap / 2) : gap);
}
setStyle(dropIndicatorRef.value, {
top: `${indicatorTop}px`,
left: `${indicatorLeft}px`
});
showDropIndicator.value = !!dropType;
}
function handleDragEnd(event) {
event.preventDefault();
if (draggingTag) draggingTag.style.opacity = "";
if (dropType && !isUndefined(draggingIndex) && !isUndefined(dropIndex) && draggingIndex !== dropIndex) handleDragged(draggingIndex, dropIndex, dropType);
showDropIndicator.value = false;
draggingIndex = void 0;
draggingTag = null;
dropIndex = void 0;
dropType = void 0;
afterDragged?.();
}
return {
dropIndicatorRef,
showDropIndicator,
handleDragStart,
handleDragOver,
handleDragEnd
};
}
//#endregion
//#region ../../packages/components/input-tag/src/composables/use-hovering.ts
function useHovering() {
const hovering = (0, vue.ref)(false);
const handleMouseEnter = () => {
hovering.value = true;
};
const handleMouseLeave = () => {
hovering.value = false;
};
return {
hovering,
handleMouseEnter,
handleMouseLeave
};
}
//#endregion
//#region ../../packages/components/input-tag/src/composables/use-input-tag.ts
function useInputTag({ props, emit, formItem }) {
const disabled = useFormDisabled();
const size = useFormSize();
const inputRef = (0, vue.shallowRef)();
const inputValue = (0, vue.ref)();
const tagTooltipRef = (0, vue.ref)();
const tagSize = (0, vue.computed)(() => {
return ["small"].includes(size.value) ? "small" : "default";
});
const placeholder = (0, vue.computed)(() => {
return props.modelValue?.length ? void 0 : props.placeholder;
});
const closable = (0, vue.computed)(() => !(props.readonly || disabled.value));
const inputLimit = (0, vue.computed)(() => {
return isUndefined(props.max) ? false : (props.modelValue?.length ?? 0) >= props.max;
});
const showTagList = (0, vue.computed)(() => {
return props.collapseTags ? props.modelValue?.slice(0, props.maxCollapseTags) : props.modelValue;
});
const collapseTagList = (0, vue.computed)(() => {
return props.collapseTags ? props.modelValue?.slice(props.maxCollapseTags) : [];
});
const addTagsEmit = (value) => {
const list = [...props.modelValue ?? [], ...castArray$1(value)];
emit(UPDATE_MODEL_EVENT, list);
emit(CHANGE_EVENT, list);
emit("add-tag", value);
inputValue.value = void 0;
};
const getDelimitedTags = (input) => {
const parts = input.split(props.delimiter);
const tags = parts.length > 1 ? parts.map((val) => val.trim()).filter(Boolean) : [];
if (props.max) {
const maxInsert = props.max - (props.modelValue?.length ?? 0);
tags.splice(maxInsert);
}
return tags.length === 1 ? tags[0] : tags;
};
const handlePaste = (event) => {
const pasted = event.clipboardData?.getData("text");
if (props.readonly || inputLimit.value || !props.delimiter || !pasted) return;
const { selectionStart = 0, selectionEnd = 0, value } = event.target;
const nextValue = value.slice(0, selectionStart) + pasted + value.slice(selectionEnd);
const tags = getDelimitedTags(nextValue);
if (tags.length) {
addTagsEmit(tags);
emit(INPUT_EVENT, nextValue);
event.preventDefault();
}
};
const handleInput = (event) => {
if (inputLimit.value) {
inputValue.value = void 0;
return;
}
if (isComposing.value) return;
if (props.delimiter && inputValue.value) {
const tags = getDelimitedTags(inputValue.value);
if (tags.length) addTagsEmit(tags);
}
emit(INPUT_EVENT, event.target.value);
};
const handleKeydown = (event) => {
if (isComposing.value) return;
switch (getEventCode(event)) {
case props.trigger:
event.preventDefault();
event.stopPropagation();
handleAddTag();
break;
case EVENT_CODE.numpadEnter:
if (props.trigger === EVENT_CODE.enter) {
event.preventDefault();
event.stopPropagation();
handleAddTag();
}
break;
case EVENT_CODE.backspace:
if (!inputValue.value && props.modelValue?.length) {
event.preventDefault();
event.stopPropagation();
handleRemoveTag(props.modelValue.length - 1);
}
break;
}
};
const handleKeyup = (event) => {
if (isComposing.value || !isAndroid()) return;
switch (getEventCode(event)) {
case EVENT_CODE.space:
if (props.trigger === EVENT_CODE.space) {
event.preventDefault();
event.stopPropagation();
handleAddTag();
}
break;
}
};
const handleAddTag = () => {
const value = inputValue.value?.trim();
if (!value || inputLimit.value) return;
addTagsEmit(value);
};
const handleRemoveTag = (index) => {
const value = (props.modelValue ?? []).slice();
const [item] = value.splice(index, 1);
emit(UPDATE_MODEL_EVENT, value);
emit(CHANGE_EVENT, value);
emit("remove-tag", item, index);
};
const handleClear = () => {
inputValue.value = void 0;
emit(UPDATE_MODEL_EVENT, void 0);
emit(CHANGE_EVENT, void 0);
emit("clear");
};
const handleDragged = (draggingIndex, dropIndex, type) => {
const value = (props.modelValue ?? []).slice();
const [draggedItem] = value.splice(draggingIndex, 1);
const step = dropIndex > draggingIndex && type === "before" ? -1 : dropIndex < draggingIndex && type === "after" ? 1 : 0;
value.splice(dropIndex + step, 0, draggedItem);
emit(UPDATE_MODEL_EVENT, value);
emit(CHANGE_EVENT, value);
emit("drag-tag", draggingIndex, dropIndex + step, draggedItem);
};
const focus = () => {
inputRef.value?.focus();
};
const blur = () => {
inputRef.value?.blur();
};
const { wrapperRef, isFocused } = useFocusController(inputRef, {
disabled,
beforeBlur(event) {
return tagTooltipRef.value?.isFocusInsideContent(event);
},
afterBlur() {
if (props.saveOnBlur) handleAddTag();
else inputValue.value = void 0;
if (props.validateEvent) formItem?.validate?.("blur").catch((err) => /* @__PURE__ */ debugWarn(err));
}
});
const { isComposing, handleCompositionStart, handleCompositionUpdate, handleCompositionEnd } = useComposition({ afterComposition: handleInput });
(0, vue.watch)(() => props.modelValue, () => {
if (props.validateEvent) formItem?.validate?.(CHANGE_EVENT).catch((err) => /* @__PURE__ */ debugWarn(err));
});
return {
inputRef,
wrapperRef,
tagTooltipRef,
isFocused,
isComposing,
inputValue,
size,
tagSize,
placeholder,
closable,
disabled,
inputLimit,
showTagList,
collapseTagList,
handleDragged,
handlePaste,
handleInput,
handleKeydown,
handleKeyup,
handleAddTag,
handleRemoveTag,
handleClear,
handleCompositionStart,
handleCompositionUpdate,
handleCompositionEnd,
focus,
blur
};
}
//#endregion
//#region ../../packages/components/input-tag/src/composables/use-input-tag-dom.ts
function useInputTagDom({ props, isFocused, hovering, disabled, inputValue, size, validateState, validateIcon, needStatusIcon }) {
const attrs = (0, vue.useAttrs)();
const slots = (0, vue.useSlots)();
const ns = useNamespace("input-tag");
const nsInput = useNamespace("input");
const collapseItemRef = (0, vue.ref)();
const innerRef = (0, vue.ref)();
const containerKls = (0, vue.computed)(() => [
ns.b(),
ns.is("focused", isFocused.value),
ns.is("hovering", hovering.value),
ns.is("disabled", disabled.value),
ns.m(size.value),
ns.e("wrapper"),
attrs.class
]);
const containerStyle = (0, vue.computed)(() => [attrs.style]);
const innerKls = (0, vue.computed)(() => [
ns.e("inner"),
ns.is("draggable", props.draggable),
ns.is("left-space", !props.modelValue?.length && !slots.prefix),
ns.is("right-space", !props.modelValue?.length && !showSuffix.value)
]);
const showClear = (0, vue.computed)(() => {
return props.clearable && !disabled.value && !props.readonly && (props.modelValue?.length || inputValue.value) && (isFocused.value || hovering.value);
});
const showSuffix = (0, vue.computed)(() => {
return slots.suffix || showClear.value || validateState.value && validateIcon.value && needStatusIcon.value;
});
const states = (0, vue.reactive)({
innerWidth: 0,
collapseItemWidth: 0
});
const getGapWidth = () => {
if (!innerRef.value) return 0;
const style = window.getComputedStyle(innerRef.value);
return Number.parseFloat(style.gap || "6px");
};
const resetInnerWidth = () => {
states.innerWidth = Number.parseFloat(window.getComputedStyle(innerRef.value).width);
};
const resetCollapseItemWidth = () => {
states.collapseItemWidth = collapseItemRef.value.getBoundingClientRect().width;
};
const tagStyle = (0, vue.computed)(() => {
if (!props.collapseTags) return {};
const gapWidth = getGapWidth();
const inputSlotWidth = gapWidth + MINIMUM_INPUT_WIDTH;
const maxWidth = collapseItemRef.value && props.maxCollapseTags === 1 ? states.innerWidth - states.collapseItemWidth - gapWidth - inputSlotWidth : states.innerWidth - inputSlotWidth;
return { maxWidth: `${Math.max(maxWidth, 0)}px` };
});
useResizeObserver(innerRef, resetInnerWidth);
useResizeObserver(collapseItemRef, resetCollapseItemWidth);
return {
ns,
nsInput,
containerKls,
containerStyle,
innerKls,
showClear,
showSuffix,
tagStyle,
collapseItemRef,
innerRef
};
}
//#endregion
//#region ../../packages/components/input-tag/src/input-tag.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$32 = [
"id",
"minlength",
"maxlength",
"disabled",
"readonly",
"autocomplete",
"tabindex",
"placeholder",
"autofocus",
"ariaLabel"
];
const _hoisted_2$19 = ["textContent"];
var input_tag_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElInputTag",
inheritAttrs: false,
__name: "input-tag",
props: inputTagProps,
emits: inputTagEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const attrs = useAttrs();
const slots = (0, vue.useSlots)();
const { form, formItem } = useFormItem();
const { inputId } = useFormItemInputId(props, { formItemContext: formItem });
const needStatusIcon = (0, vue.computed)(() => form?.statusIcon ?? false);
const validateState = (0, vue.computed)(() => formItem?.validateState || "");
const validateIcon = (0, vue.computed)(() => {
return validateState.value && ValidateComponentsMap[validateState.value];
});
const { inputRef, wrapperRef, tagTooltipRef, isFocused, inputValue, size, tagSize, placeholder, closable, disabled, showTagList, collapseTagList, handleDragged, handlePaste, handleInput, handleKeydown, handleKeyup, handleRemoveTag, handleClear, handleCompositionStart, handleCompositionUpdate, handleCompositionEnd, focus, blur } = useInputTag({
props,
emit,
formItem
});
const { hovering, handleMouseEnter, handleMouseLeave } = useHovering();
const { calculatorRef, inputStyle } = useCalcInputWidth();
const { dropIndicatorRef, showDropIndicator, handleDragStart, handleDragOver, handleDragEnd } = useDragTag({
wrapperRef,
handleDragged,
afterDragged: focus
});
const { ns, nsInput, containerKls, containerStyle, innerKls, showClear, showSuffix, tagStyle, collapseItemRef, innerRef } = useInputTagDom({
props,
hovering,
isFocused,
inputValue,
disabled,
size,
validateState,
validateIcon,
needStatusIcon
});
__expose({
focus,
blur
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref_key: "wrapperRef",
ref: wrapperRef,
class: (0, vue.normalizeClass)((0, vue.unref)(containerKls)),
style: (0, vue.normalizeStyle)((0, vue.unref)(containerStyle)),
onMouseenter: _cache[9] || (_cache[9] = (...args) => (0, vue.unref)(handleMouseEnter) && (0, vue.unref)(handleMouseEnter)(...args)),
onMouseleave: _cache[10] || (_cache[10] = (...args) => (0, vue.unref)(handleMouseLeave) && (0, vue.unref)(handleMouseLeave)(...args))
}, [
(0, vue.unref)(slots).prefix ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("prefix"))
}, [(0, vue.renderSlot)(_ctx.$slots, "prefix")], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", {
ref_key: "innerRef",
ref: innerRef,
class: (0, vue.normalizeClass)((0, vue.unref)(innerKls))
}, [
((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(showTagList), (item, index) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElTag), {
key: index,
size: (0, vue.unref)(tagSize),
closable: (0, vue.unref)(closable),
type: __props.tagType,
effect: __props.tagEffect,
draggable: (0, vue.unref)(closable) && __props.draggable,
style: (0, vue.normalizeStyle)((0, vue.unref)(tagStyle)),
"disable-transitions": "",
onClose: ($event) => (0, vue.unref)(handleRemoveTag)(index),
onDragstart: (event) => (0, vue.unref)(handleDragStart)(event, index),
onDragover: (event) => (0, vue.unref)(handleDragOver)(event, index),
onDragend: (0, vue.unref)(handleDragEnd),
onDrop: _cache[0] || (_cache[0] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "tag", {
value: item,
index
}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(item), 1)])]),
_: 2
}, 1032, [
"size",
"closable",
"type",
"effect",
"draggable",
"style",
"onClose",
"onDragstart",
"onDragover",
"onDragend"
]);
}), 128)),
__props.collapseTags && __props.modelValue && __props.modelValue.length > __props.maxCollapseTags ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElTooltip), {
key: 0,
ref_key: "tagTooltipRef",
ref: tagTooltipRef,
disabled: !__props.collapseTagsTooltip,
"fallback-placements": [
"bottom",
"top",
"right",
"left"
],
effect: __props.effect,
placement: "bottom"
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", {
ref_key: "collapseItemRef",
ref: collapseItemRef,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("collapse-tag"))
}, [(0, vue.createVNode)((0, vue.unref)(ElTag), {
closable: false,
size: (0, vue.unref)(tagSize),
type: __props.tagType,
effect: __props.tagEffect,
"disable-transitions": ""
}, {
default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)(" + " + (0, vue.toDisplayString)(__props.modelValue.length - __props.maxCollapseTags), 1)]),
_: 1
}, 8, [
"size",
"type",
"effect"
])], 2)]),
content: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("input-tag-list")) }, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(collapseTagList), (item, index) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElTag), {
key: index,
size: (0, vue.unref)(tagSize),
closable: (0, vue.unref)(closable),
type: __props.tagType,
effect: __props.tagEffect,
"disable-transitions": "",
onClose: ($event) => (0, vue.unref)(handleRemoveTag)(index + __props.maxCollapseTags)
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "tag", {
value: item,
index: index + __props.maxCollapseTags
}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(item), 1)])]),
_: 2
}, 1032, [
"size",
"closable",
"type",
"effect",
"onClose"
]);
}), 128))], 2)]),
_: 3
}, 8, ["disabled", "effect"])) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("input-wrapper")) }, [(0, vue.withDirectives)((0, vue.createElementVNode)("input", (0, vue.mergeProps)({
id: (0, vue.unref)(inputId),
ref_key: "inputRef",
ref: inputRef,
"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => (0, vue.isRef)(inputValue) ? inputValue.value = $event : null)
}, (0, vue.unref)(attrs), {
type: "text",
minlength: __props.minlength,
maxlength: __props.maxlength,
disabled: (0, vue.unref)(disabled),
readonly: __props.readonly,
autocomplete: __props.autocomplete,
tabindex: __props.tabindex,
placeholder: (0, vue.unref)(placeholder),
autofocus: __props.autofocus,
ariaLabel: __props.ariaLabel,
class: (0, vue.unref)(ns).e("input"),
style: (0, vue.unref)(inputStyle),
onCompositionstart: _cache[2] || (_cache[2] = (...args) => (0, vue.unref)(handleCompositionStart) && (0, vue.unref)(handleCompositionStart)(...args)),
onCompositionupdate: _cache[3] || (_cache[3] = (...args) => (0, vue.unref)(handleCompositionUpdate) && (0, vue.unref)(handleCompositionUpdate)(...args)),
onCompositionend: _cache[4] || (_cache[4] = (...args) => (0, vue.unref)(handleCompositionEnd) && (0, vue.unref)(handleCompositionEnd)(...args)),
onPaste: _cache[5] || (_cache[5] = (...args) => (0, vue.unref)(handlePaste) && (0, vue.unref)(handlePaste)(...args)),
onInput: _cache[6] || (_cache[6] = (...args) => (0, vue.unref)(handleInput) && (0, vue.unref)(handleInput)(...args)),
onKeydown: _cache[7] || (_cache[7] = (...args) => (0, vue.unref)(handleKeydown) && (0, vue.unref)(handleKeydown)(...args)),
onKeyup: _cache[8] || (_cache[8] = (...args) => (0, vue.unref)(handleKeyup) && (0, vue.unref)(handleKeyup)(...args))
}), null, 16, _hoisted_1$32), [[vue.vModelText, (0, vue.unref)(inputValue)]]), (0, vue.createElementVNode)("span", {
ref_key: "calculatorRef",
ref: calculatorRef,
"aria-hidden": "true",
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("input-calculator")),
textContent: (0, vue.toDisplayString)((0, vue.unref)(inputValue))
}, null, 10, _hoisted_2$19)], 2),
(0, vue.withDirectives)((0, vue.createElementVNode)("div", {
ref_key: "dropIndicatorRef",
ref: dropIndicatorRef,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("drop-indicator"))
}, null, 2), [[vue.vShow, (0, vue.unref)(showDropIndicator)]])
], 2),
(0, vue.unref)(showSuffix) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("suffix"))
}, [
(0, vue.renderSlot)(_ctx.$slots, "suffix"),
(0, vue.unref)(showClear) ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("icon"), (0, vue.unref)(ns).e("clear")]),
onMousedown: (0, vue.withModifiers)((0, vue.unref)(NOOP), ["prevent"]),
onClick: (0, vue.unref)(handleClear)
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.clearIcon)))]),
_: 1
}, 8, [
"class",
"onMousedown",
"onClick"
])) : (0, vue.createCommentVNode)("v-if", true),
validateState.value && validateIcon.value && needStatusIcon.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 1,
class: (0, vue.normalizeClass)([
(0, vue.unref)(nsInput).e("icon"),
(0, vue.unref)(nsInput).e("validateIcon"),
(0, vue.unref)(nsInput).is("loading", validateState.value === "validating")
])
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(validateIcon.value)))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true)
], 2)) : (0, vue.createCommentVNode)("v-if", true)
], 38);
};
}
});
//#endregion
//#region ../../packages/components/input-tag/src/input-tag.vue
var input_tag_default = input_tag_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/input-tag/index.ts
const ElInputTag = withInstall(input_tag_default);
//#endregion
//#region ../../packages/components/link/src/link.ts
/**
* @deprecated Removed after 3.0.0, Use `LinkProps` instead.
*/
const linkProps = buildProps({
type: {
type: String,
values: [
"primary",
"success",
"warning",
"info",
"danger",
"default"
],
default: void 0
},
underline: {
type: [Boolean, String],
values: [
true,
false,
"always",
"never",
"hover"
],
default: void 0
},
disabled: Boolean,
href: {
type: String,
default: ""
},
target: {
type: String,
default: "_self"
},
icon: { type: iconPropType }
});
const linkEmits = { click: (evt) => evt instanceof MouseEvent };
//#endregion
//#region ../../packages/components/link/src/link.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$31 = ["href", "target"];
var link_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElLink",
__name: "link",
props: linkProps,
emits: linkEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const globalConfig = useGlobalConfig("link");
useDeprecated({
scope: "el-link",
from: "The underline option (boolean)",
replacement: "'always' | 'hover' | 'never'",
version: "3.0.0",
ref: "https://element-plus.org/en-US/component/link.html#underline"
}, (0, vue.computed)(() => isBoolean(props.underline)));
const ns = useNamespace("link");
const linkKls = (0, vue.computed)(() => [
ns.b(),
ns.m(props.type ?? globalConfig.value?.type ?? "default"),
ns.is("disabled", props.disabled),
ns.is("underline", underline.value === "always"),
ns.is("hover-underline", underline.value === "hover" && !props.disabled)
]);
const underline = (0, vue.computed)(() => {
if (isBoolean(props.underline)) return props.underline ? "hover" : "never";
else return props.underline ?? globalConfig.value?.underline ?? "hover";
});
function handleClick(event) {
if (!props.disabled) emit("click", event);
}
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("a", {
class: (0, vue.normalizeClass)(linkKls.value),
href: __props.disabled || !__props.href ? void 0 : __props.href,
target: __props.disabled || !__props.href ? void 0 : __props.target,
onClick: handleClick
}, [
__props.icon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), { key: 0 }, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.icon)))]),
_: 1
})) : (0, vue.createCommentVNode)("v-if", true),
_ctx.$slots.default ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("inner"))
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2)) : (0, vue.createCommentVNode)("v-if", true),
_ctx.$slots.icon ? (0, vue.renderSlot)(_ctx.$slots, "icon", { key: 2 }) : (0, vue.createCommentVNode)("v-if", true)
], 10, _hoisted_1$31);
};
}
});
//#endregion
//#region ../../packages/components/link/src/link.vue
var link_default = link_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/link/index.ts
const ElLink = withInstall(link_default);
//#endregion
//#region ../../packages/components/menu/src/utils/submenu.ts
var SubMenu = class {
constructor(parent, domNode) {
this.parent = parent;
this.domNode = domNode;
this.subIndex = 0;
this.subIndex = 0;
this.init();
}
init() {
this.subMenuItems = this.domNode.querySelectorAll("li");
this.addListeners();
}
gotoSubIndex(idx) {
if (idx === this.subMenuItems.length) idx = 0;
else if (idx < 0) idx = this.subMenuItems.length - 1;
this.subMenuItems[idx].focus();
this.subIndex = idx;
}
addListeners() {
const parentNode = this.parent.domNode;
Array.prototype.forEach.call(this.subMenuItems, (el) => {
el.addEventListener("keydown", (event) => {
const code = getEventCode(event);
let prevDef = false;
switch (code) {
case EVENT_CODE.down:
this.gotoSubIndex(this.subIndex + 1);
prevDef = true;
break;
case EVENT_CODE.up:
this.gotoSubIndex(this.subIndex - 1);
prevDef = true;
break;
case EVENT_CODE.tab:
triggerEvent(parentNode, "mouseleave");
break;
case EVENT_CODE.enter:
case EVENT_CODE.numpadEnter:
case EVENT_CODE.space:
prevDef = true;
event.currentTarget.click();
break;
}
if (prevDef) {
event.preventDefault();
event.stopPropagation();
}
return false;
});
});
}
};
//#endregion
//#region ../../packages/components/menu/src/utils/menu-item.ts
var MenuItem = class {
constructor(domNode, namespace) {
this.domNode = domNode;
this.submenu = null;
this.submenu = null;
this.init(namespace);
}
init(namespace) {
this.domNode.setAttribute("tabindex", "0");
const menuChild = this.domNode.querySelector(`.${namespace}-menu`);
if (menuChild) this.submenu = new SubMenu(this, menuChild);
this.addListeners();
}
addListeners() {
this.domNode.addEventListener("keydown", (event) => {
const code = getEventCode(event);
let prevDef = false;
switch (code) {
case EVENT_CODE.down:
triggerEvent(event.currentTarget, "mouseenter");
this.submenu && this.submenu.gotoSubIndex(0);
prevDef = true;
break;
case EVENT_CODE.up:
triggerEvent(event.currentTarget, "mouseenter");
this.submenu && this.submenu.gotoSubIndex(this.submenu.subMenuItems.length - 1);
prevDef = true;
break;
case EVENT_CODE.tab:
triggerEvent(event.currentTarget, "mouseleave");
break;
case EVENT_CODE.enter:
case EVENT_CODE.numpadEnter:
case EVENT_CODE.space:
prevDef = true;
event.currentTarget.click();
break;
}
if (prevDef) event.preventDefault();
});
}
};
//#endregion
//#region ../../packages/components/menu/src/utils/menu-bar.ts
var Menu = class {
constructor(domNode, namespace) {
this.domNode = domNode;
this.init(namespace);
}
init(namespace) {
const menuChildren = this.domNode.childNodes;
Array.from(menuChildren).forEach((child) => {
if (child.nodeType === 1) new MenuItem(child, namespace);
});
}
};
//#endregion
//#region ../../packages/components/menu/src/menu-collapse-transition.vue?vue&type=script&setup=true&lang.ts
var menu_collapse_transition_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElMenuCollapseTransition",
__name: "menu-collapse-transition",
setup(__props) {
const ns = useNamespace("menu");
const listeners = {
onBeforeEnter: (el) => el.style.opacity = "0.2",
onEnter(el, done) {
addClass(el, `${ns.namespace.value}-opacity-transition`);
el.style.opacity = "1";
done();
},
onAfterEnter(el) {
removeClass(el, `${ns.namespace.value}-opacity-transition`);
el.style.opacity = "";
},
onBeforeLeave(el) {
if (!el.dataset) el.dataset = {};
if (hasClass(el, ns.m("collapse"))) {
removeClass(el, ns.m("collapse"));
el.dataset.oldOverflow = el.style.overflow;
el.dataset.scrollWidth = el.clientWidth.toString();
addClass(el, ns.m("collapse"));
} else {
addClass(el, ns.m("collapse"));
el.dataset.oldOverflow = el.style.overflow;
el.dataset.scrollWidth = el.clientWidth.toString();
removeClass(el, ns.m("collapse"));
}
el.style.width = `${el.scrollWidth}px`;
el.style.overflow = "hidden";
},
onLeave(el) {
addClass(el, "horizontal-collapse-transition");
el.style.width = `${el.dataset.scrollWidth}px`;
}
};
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)(vue.Transition, (0, vue.mergeProps)({ mode: "out-in" }, listeners), {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 16);
};
}
});
//#endregion
//#region ../../packages/components/menu/src/menu-collapse-transition.vue
var menu_collapse_transition_default = menu_collapse_transition_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/menu/src/use-menu.ts
function useMenu(instance, currentIndex) {
const indexPath = (0, vue.computed)(() => {
let parent = instance.parent;
const path = [currentIndex.value];
while (parent.type.name !== "ElMenu") {
if (parent.props.index) path.unshift(parent.props.index);
parent = parent.parent;
}
return path;
});
return {
parentMenu: (0, vue.computed)(() => {
let parent = instance.parent;
while (parent && !["ElMenu", "ElSubMenu"].includes(parent.type.name)) parent = parent.parent;
return parent;
}),
indexPath
};
}
//#endregion
//#region ../../packages/components/menu/src/use-menu-color.ts
function useMenuColor(props) {
return (0, vue.computed)(() => {
const color = props.backgroundColor;
return color ? new TinyColor(color).shade(20).toString() : "";
});
}
//#endregion
//#region ../../packages/components/menu/src/use-menu-css-var.ts
const useMenuCssVar = (props, level) => {
const ns = useNamespace("menu");
return (0, vue.computed)(() => ns.cssVarBlock({
"text-color": props.textColor || "",
"hover-text-color": props.textColor || "",
"bg-color": props.backgroundColor || "",
"hover-bg-color": useMenuColor(props).value || "",
"active-color": props.activeTextColor || "",
level: `${level}`
}));
};
//#endregion
//#region ../../packages/components/menu/src/tokens.ts
const MENU_INJECTION_KEY = "rootMenu";
const SUB_MENU_INJECTION_KEY = "subMenu:";
//#endregion
//#region ../../packages/components/menu/src/sub-menu.ts
const subMenuProps = buildProps({
index: {
type: String,
required: true
},
showTimeout: Number,
hideTimeout: Number,
popperClass: String,
popperStyle: { type: definePropType([String, Object]) },
disabled: Boolean,
teleported: {
type: Boolean,
default: void 0
},
popperOffset: Number,
expandCloseIcon: { type: iconPropType },
expandOpenIcon: { type: iconPropType },
collapseCloseIcon: { type: iconPropType },
collapseOpenIcon: { type: iconPropType }
});
const COMPONENT_NAME$8 = "ElSubMenu";
var sub_menu_default = (0, vue.defineComponent)({
name: COMPONENT_NAME$8,
props: subMenuProps,
setup(props, { slots, expose }) {
const instance = (0, vue.getCurrentInstance)();
const { indexPath, parentMenu } = useMenu(instance, (0, vue.computed)(() => props.index));
const nsMenu = useNamespace("menu");
const nsSubMenu = useNamespace("sub-menu");
const rootMenu = (0, vue.inject)(MENU_INJECTION_KEY);
if (!rootMenu) throwError(COMPONENT_NAME$8, "can not inject root menu");
const subMenu = (0, vue.inject)(`${SUB_MENU_INJECTION_KEY}${parentMenu.value.uid}`);
if (!subMenu) throwError(COMPONENT_NAME$8, "can not inject sub menu");
const items = (0, vue.ref)({});
const subMenus = (0, vue.ref)({});
let timeout;
const mouseInChild = (0, vue.ref)(false);
const verticalTitleRef = (0, vue.ref)();
const vPopper = (0, vue.ref)();
const isFirstLevel = (0, vue.computed)(() => subMenu.level === 0);
const currentPlacement = (0, vue.computed)(() => mode.value === "horizontal" && isFirstLevel.value ? "bottom-start" : "right-start");
const subMenuTitleIcon = (0, vue.computed)(() => {
if (mode.value === "horizontal" && isFirstLevel.value || mode.value === "vertical" && !rootMenu.props.collapse) {
if (props.expandCloseIcon && props.expandOpenIcon) return opened.value ? props.expandOpenIcon : props.expandCloseIcon;
return arrow_down_default;
} else {
if (props.collapseCloseIcon && props.collapseOpenIcon) return opened.value ? props.collapseOpenIcon : props.collapseCloseIcon;
return arrow_right_default;
}
});
const appendToBody = (0, vue.computed)(() => {
const value = props.teleported;
return isUndefined(value) ? isFirstLevel.value : value;
});
const menuTransitionName = (0, vue.computed)(() => rootMenu.props.collapse ? `${nsMenu.namespace.value}-zoom-in-left` : `${nsMenu.namespace.value}-zoom-in-top`);
const fallbackPlacements = (0, vue.computed)(() => mode.value === "horizontal" && isFirstLevel.value ? [
"bottom-start",
"bottom-end",
"top-start",
"top-end",
"right-start",
"left-start"
] : [
"right-start",
"right",
"right-end",
"left-start",
"bottom-start",
"bottom-end",
"top-start",
"top-end"
]);
const opened = (0, vue.computed)(() => rootMenu.openedMenus.includes(props.index));
const active = (0, vue.computed)(() => [...Object.values(items.value), ...Object.values(subMenus.value)].some(({ active }) => active));
const mode = (0, vue.computed)(() => rootMenu.props.mode);
const persistent = (0, vue.computed)(() => rootMenu.props.persistent);
const item = (0, vue.reactive)({
index: props.index,
indexPath,
active
});
const ulStyle = useMenuCssVar(rootMenu.props, subMenu.level + 1);
const subMenuPopperOffset = (0, vue.computed)(() => props.popperOffset ?? rootMenu.props.popperOffset);
const subMenuPopperClass = (0, vue.computed)(() => props.popperClass ?? rootMenu.props.popperClass);
const subMenuPopperStyle = (0, vue.computed)(() => props.popperStyle ?? rootMenu.props.popperStyle);
const subMenuShowTimeout = (0, vue.computed)(() => props.showTimeout ?? rootMenu.props.showTimeout);
const subMenuHideTimeout = (0, vue.computed)(() => props.hideTimeout ?? rootMenu.props.hideTimeout);
const doDestroy = () => vPopper.value?.popperRef?.popperInstanceRef?.destroy();
const handleCollapseToggle = (value) => {
if (!value) doDestroy();
};
const handleClick = () => {
if (rootMenu.props.menuTrigger === "hover" && rootMenu.props.mode === "horizontal" || rootMenu.props.collapse && rootMenu.props.mode === "vertical" || props.disabled) return;
rootMenu.handleSubMenuClick({
index: props.index,
indexPath: indexPath.value,
active: active.value
});
};
const handleMouseenter = (event, showTimeout = subMenuShowTimeout.value) => {
if (event.type === "focus") return;
if (rootMenu.props.menuTrigger === "click" && rootMenu.props.mode === "horizontal" || !rootMenu.props.collapse && rootMenu.props.mode === "vertical" || props.disabled) {
subMenu.mouseInChild.value = true;
return;
}
subMenu.mouseInChild.value = true;
timeout?.();
({stop: timeout} = useTimeoutFn(() => {
rootMenu.openMenu(props.index, indexPath.value);
}, showTimeout));
if (appendToBody.value) parentMenu.value.vnode.el?.dispatchEvent(new MouseEvent("mouseenter"));
if (event.type === "mouseenter" && event.target) (0, vue.nextTick)(() => {
focusElement(event.target, { preventScroll: true });
});
};
const handleMouseleave = (deepDispatch = false) => {
if (rootMenu.props.menuTrigger === "click" && rootMenu.props.mode === "horizontal" || !rootMenu.props.collapse && rootMenu.props.mode === "vertical") {
subMenu.mouseInChild.value = false;
return;
}
timeout?.();
subMenu.mouseInChild.value = false;
({stop: timeout} = useTimeoutFn(() => !mouseInChild.value && rootMenu.closeMenu(props.index, indexPath.value), subMenuHideTimeout.value));
if (appendToBody.value && deepDispatch) subMenu.handleMouseleave?.(true);
};
(0, vue.watch)(() => rootMenu.props.collapse, (value) => handleCollapseToggle(Boolean(value)));
{
const addSubMenu = (item) => {
subMenus.value[item.index] = item;
};
const removeSubMenu = (item) => {
delete subMenus.value[item.index];
};
(0, vue.provide)(`${SUB_MENU_INJECTION_KEY}${instance.uid}`, {
addSubMenu,
removeSubMenu,
handleMouseleave,
mouseInChild,
level: subMenu.level + 1
});
}
expose({ opened });
(0, vue.onMounted)(() => {
rootMenu.addSubMenu(item);
subMenu.addSubMenu(item);
});
(0, vue.onBeforeUnmount)(() => {
subMenu.removeSubMenu(item);
rootMenu.removeSubMenu(item);
});
return () => {
const titleTag = [slots.title?.(), (0, vue.h)(ElIcon, {
class: nsSubMenu.e("icon-arrow"),
style: { transform: opened.value ? props.expandCloseIcon && props.expandOpenIcon || props.collapseCloseIcon && props.collapseOpenIcon && rootMenu.props.collapse ? "none" : "rotateZ(180deg)" : "none" }
}, { default: () => isString(subMenuTitleIcon.value) ? (0, vue.h)(instance.appContext.components[subMenuTitleIcon.value]) : (0, vue.h)(subMenuTitleIcon.value) })];
const child = rootMenu.isMenuPopup ? (0, vue.h)(ElTooltip, {
ref: vPopper,
visible: opened.value,
effect: "light",
pure: true,
offset: subMenuPopperOffset.value,
showArrow: false,
persistent: persistent.value,
popperClass: subMenuPopperClass.value,
popperStyle: subMenuPopperStyle.value,
placement: currentPlacement.value,
teleported: appendToBody.value,
fallbackPlacements: fallbackPlacements.value,
transition: menuTransitionName.value,
gpuAcceleration: false
}, {
content: () => (0, vue.h)("div", {
class: [
nsMenu.m(mode.value),
nsMenu.m("popup-container"),
subMenuPopperClass.value
],
onMouseenter: (evt) => handleMouseenter(evt, 100),
onMouseleave: () => handleMouseleave(true),
onFocus: (evt) => handleMouseenter(evt, 100)
}, [(0, vue.h)("ul", {
class: [
nsMenu.b(),
nsMenu.m("popup"),
nsMenu.m(`popup-${currentPlacement.value}`)
],
style: ulStyle.value
}, [slots.default?.()])]),
default: () => (0, vue.h)("div", {
class: nsSubMenu.e("title"),
onClick: handleClick
}, titleTag)
}) : (0, vue.h)(vue.Fragment, {}, [(0, vue.h)("div", {
class: nsSubMenu.e("title"),
ref: verticalTitleRef,
onClick: handleClick
}, titleTag), (0, vue.h)(ElCollapseTransition, {}, { default: () => (0, vue.withDirectives)((0, vue.h)("ul", {
role: "menu",
class: [nsMenu.b(), nsMenu.m("inline")],
style: ulStyle.value
}, [slots.default?.()]), [[vue.vShow, opened.value]]) })]);
return (0, vue.h)("li", {
class: [
nsSubMenu.b(),
nsSubMenu.is("active", active.value),
nsSubMenu.is("opened", opened.value),
nsSubMenu.is("disabled", props.disabled)
],
role: "menuitem",
ariaHaspopup: true,
ariaExpanded: opened.value,
onMouseenter: handleMouseenter,
onMouseleave: () => handleMouseleave(),
onFocus: handleMouseenter
}, [child]);
};
}
});
//#endregion
//#region ../../packages/components/menu/src/menu.ts
const menuProps = buildProps({
mode: {
type: String,
values: ["horizontal", "vertical"],
default: "vertical"
},
defaultActive: {
type: String,
default: ""
},
defaultOpeneds: {
type: definePropType(Array),
default: () => mutable([])
},
uniqueOpened: Boolean,
router: Boolean,
menuTrigger: {
type: String,
values: ["hover", "click"],
default: "hover"
},
collapse: Boolean,
backgroundColor: String,
textColor: String,
activeTextColor: String,
closeOnClickOutside: Boolean,
collapseTransition: {
type: Boolean,
default: true
},
ellipsis: {
type: Boolean,
default: true
},
popperOffset: {
type: Number,
default: 6
},
ellipsisIcon: {
type: iconPropType,
default: () => more_default
},
popperEffect: {
type: definePropType(String),
default: "dark"
},
popperClass: String,
popperStyle: { type: definePropType([String, Object]) },
showTimeout: {
type: Number,
default: 300
},
hideTimeout: {
type: Number,
default: 300
},
persistent: {
type: Boolean,
default: true
}
});
const checkIndexPath = (indexPath) => isArray$1(indexPath) && indexPath.every((path) => isString(path));
const menuEmits = {
close: (index, indexPath) => isString(index) && checkIndexPath(indexPath),
open: (index, indexPath) => isString(index) && checkIndexPath(indexPath),
select: (index, indexPath, item, routerResult) => isString(index) && checkIndexPath(indexPath) && isObject$1(item) && (isUndefined(routerResult) || routerResult instanceof Promise)
};
const DEFAULT_MORE_ITEM_WIDTH = 64;
var menu_default = (0, vue.defineComponent)({
name: "ElMenu",
props: menuProps,
emits: menuEmits,
setup(props, { emit, slots, expose }) {
const instance = (0, vue.getCurrentInstance)();
const router = instance.appContext.config.globalProperties.$router;
const menu = (0, vue.ref)();
const subMenu = (0, vue.ref)();
const nsMenu = useNamespace("menu");
const nsSubMenu = useNamespace("sub-menu");
let moreItemWidth = DEFAULT_MORE_ITEM_WIDTH;
const sliceIndex = (0, vue.ref)(-1);
const openedMenus = (0, vue.ref)(props.defaultOpeneds && !props.collapse ? props.defaultOpeneds.slice(0) : []);
const activeIndex = (0, vue.ref)(props.defaultActive);
const items = (0, vue.ref)({});
const subMenus = (0, vue.ref)({});
const isMenuPopup = (0, vue.computed)(() => props.mode === "horizontal" || props.mode === "vertical" && props.collapse);
const initMenu = () => {
const activeItem = activeIndex.value && items.value[activeIndex.value];
if (!activeItem || props.mode === "horizontal" || props.collapse) return;
activeItem.indexPath.forEach((index) => {
const subMenu = subMenus.value[index];
subMenu && openMenu(index, subMenu.indexPath);
});
};
const openMenu = (index, indexPath) => {
if (openedMenus.value.includes(index)) return;
if (props.uniqueOpened) openedMenus.value = openedMenus.value.filter((index) => indexPath.includes(index));
openedMenus.value.push(index);
emit("open", index, indexPath);
};
const close = (index) => {
const i = openedMenus.value.indexOf(index);
if (i !== -1) openedMenus.value.splice(i, 1);
};
const closeMenu = (index, indexPath) => {
close(index);
emit("close", index, indexPath);
};
const handleSubMenuClick = ({ index, indexPath }) => {
openedMenus.value.includes(index) ? closeMenu(index, indexPath) : openMenu(index, indexPath);
};
const handleMenuItemClick = (menuItem) => {
if (props.mode === "horizontal" || props.collapse) openedMenus.value = [];
const { index, indexPath } = menuItem;
if (isNil(index) || isNil(indexPath)) return;
if (props.router && router) {
const route = menuItem.route || index;
const routerResult = router.push(route).then((res) => {
if (!res) activeIndex.value = index;
return res;
});
emit("select", index, indexPath, {
index,
indexPath,
route
}, routerResult);
} else {
activeIndex.value = index;
emit("select", index, indexPath, {
index,
indexPath
});
}
};
const updateActiveIndex = (val) => {
const itemsInData = items.value;
activeIndex.value = (itemsInData[val] || activeIndex.value && itemsInData[activeIndex.value] || itemsInData[props.defaultActive])?.index ?? val;
};
const calcMenuItemWidth = (menuItem) => {
const computedStyle = getComputedStyle(menuItem);
const marginLeft = Number.parseInt(computedStyle.marginLeft, 10);
const marginRight = Number.parseInt(computedStyle.marginRight, 10);
return menuItem.offsetWidth + marginLeft + marginRight || 0;
};
const calcSliceIndex = () => {
if (!menu.value) return -1;
const items = Array.from(menu.value.childNodes).filter((item) => item.nodeName !== "#comment" && (item.nodeName !== "#text" || item.nodeValue));
const computedMenuStyle = getComputedStyle(menu.value);
const paddingLeft = Number.parseInt(computedMenuStyle.paddingLeft, 10);
const paddingRight = Number.parseInt(computedMenuStyle.paddingRight, 10);
const menuWidth = menu.value.clientWidth - paddingLeft - paddingRight;
let calcWidth = 0;
let sliceIndex = 0;
items.forEach((item, index) => {
calcWidth += calcMenuItemWidth(item);
if (calcWidth <= menuWidth - moreItemWidth) sliceIndex = index + 1;
});
return sliceIndex === items.length ? -1 : sliceIndex;
};
const getIndexPath = (index) => subMenus.value[index].indexPath;
const debounce = (fn, wait = 33.34) => {
let timer;
return () => {
timer && clearTimeout(timer);
timer = setTimeout(() => {
fn();
}, wait);
};
};
let isFirstTimeRender = true;
const handleResize = () => {
const el = unrefElement(subMenu);
if (el) moreItemWidth = calcMenuItemWidth(el) || DEFAULT_MORE_ITEM_WIDTH;
if (sliceIndex.value === calcSliceIndex()) return;
const callback = () => {
sliceIndex.value = -1;
(0, vue.nextTick)(() => {
sliceIndex.value = calcSliceIndex();
});
};
isFirstTimeRender ? callback() : debounce(callback)();
isFirstTimeRender = false;
};
(0, vue.watch)(() => props.defaultActive, (currentActive) => {
if (!items.value[currentActive]) activeIndex.value = "";
updateActiveIndex(currentActive);
});
(0, vue.watch)(() => props.collapse, (value) => {
if (value) openedMenus.value = [];
});
(0, vue.watch)(items.value, initMenu);
let resizeStopper;
(0, vue.watchEffect)(() => {
if (props.mode === "horizontal" && props.ellipsis) resizeStopper = useResizeObserver(menu, handleResize).stop;
else resizeStopper?.();
});
const mouseInChild = (0, vue.ref)(false);
{
const addSubMenu = (item) => {
subMenus.value[item.index] = item;
};
const removeSubMenu = (item) => {
delete subMenus.value[item.index];
};
const addMenuItem = (item) => {
items.value[item.index] = item;
};
const removeMenuItem = (item) => {
delete items.value[item.index];
};
(0, vue.provide)(MENU_INJECTION_KEY, (0, vue.reactive)({
props,
openedMenus,
items,
subMenus,
activeIndex,
isMenuPopup,
addMenuItem,
removeMenuItem,
addSubMenu,
removeSubMenu,
openMenu,
closeMenu,
handleMenuItemClick,
handleSubMenuClick
}));
(0, vue.provide)(`${SUB_MENU_INJECTION_KEY}${instance.uid}`, {
addSubMenu,
removeSubMenu,
mouseInChild,
level: 0
});
}
(0, vue.onMounted)(() => {
if (props.mode === "horizontal") new Menu(instance.vnode.el, nsMenu.namespace.value);
});
{
const open = (index) => {
const { indexPath } = subMenus.value[index];
indexPath.forEach((i) => openMenu(i, indexPath));
};
expose({
open,
close,
updateActiveIndex,
handleResize
});
}
const ulStyle = useMenuCssVar(props, 0);
return () => {
let slot = slots.default?.() ?? [];
const vShowMore = [];
if (props.mode === "horizontal" && menu.value) {
const originalSlot = flattedChildren(slot).filter((vnode) => {
return vnode?.shapeFlag !== 8;
});
const slotDefault = sliceIndex.value === -1 ? originalSlot : originalSlot.slice(0, sliceIndex.value);
const slotMore = sliceIndex.value === -1 ? [] : originalSlot.slice(sliceIndex.value);
if (slotMore?.length && props.ellipsis) {
slot = slotDefault;
vShowMore.push((0, vue.h)(sub_menu_default, {
ref: subMenu,
index: "sub-menu-more",
class: nsSubMenu.e("hide-arrow"),
popperOffset: props.popperOffset
}, {
title: () => (0, vue.h)(ElIcon, { class: nsSubMenu.e("icon-more") }, { default: () => (0, vue.h)(props.ellipsisIcon) }),
default: () => slotMore
}));
}
}
const directives = props.closeOnClickOutside ? [[ClickOutside, () => {
if (!openedMenus.value.length) return;
if (!mouseInChild.value) {
openedMenus.value.forEach((openedMenu) => emit("close", openedMenu, getIndexPath(openedMenu)));
openedMenus.value = [];
}
}]] : [];
const vMenu = (0, vue.withDirectives)((0, vue.h)("ul", {
key: String(props.collapse),
role: "menubar",
ref: menu,
style: ulStyle.value,
class: {
[nsMenu.b()]: true,
[nsMenu.m(props.mode)]: true,
[nsMenu.m("collapse")]: props.collapse
}
}, [...slot, ...vShowMore]), directives);
if (props.collapseTransition && props.mode === "vertical") return (0, vue.h)(menu_collapse_transition_default, () => vMenu);
return vMenu;
};
}
});
//#endregion
//#region ../../packages/components/menu/src/menu-item.ts
/**
* @deprecated Removed after 3.0.0, Use `MenuItemProps` instead.
*/
const menuItemProps = buildProps({
index: {
type: definePropType([String, null]),
default: null
},
route: { type: definePropType([String, Object]) },
disabled: Boolean
});
const menuItemEmits = { click: (item) => isString(item.index) && isArray$1(item.indexPath) };
//#endregion
//#region ../../packages/components/menu/src/menu-item.vue?vue&type=script&setup=true&lang.ts
const COMPONENT_NAME$7 = "ElMenuItem";
var menu_item_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: COMPONENT_NAME$7,
__name: "menu-item",
props: menuItemProps,
emits: menuItemEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
isPropAbsent(props.index) && /* @__PURE__ */ debugWarn(COMPONENT_NAME$7, "Missing required prop: \"index\"");
const instance = (0, vue.getCurrentInstance)();
const rootMenu = (0, vue.inject)(MENU_INJECTION_KEY);
const nsMenu = useNamespace("menu");
const nsMenuItem = useNamespace("menu-item");
if (!rootMenu) throwError(COMPONENT_NAME$7, "can not inject root menu");
const { parentMenu, indexPath } = useMenu(instance, (0, vue.toRef)(props, "index"));
const subMenu = (0, vue.inject)(`${SUB_MENU_INJECTION_KEY}${parentMenu.value.uid}`);
if (!subMenu) throwError(COMPONENT_NAME$7, "can not inject sub menu");
const active = (0, vue.computed)(() => props.index === rootMenu.activeIndex);
const item = (0, vue.reactive)({
index: props.index,
indexPath,
active
});
const handleClick = () => {
if (!props.disabled) {
rootMenu.handleMenuItemClick({
index: props.index,
indexPath: indexPath.value,
route: props.route
});
emit("click", item);
}
};
(0, vue.onMounted)(() => {
subMenu.addSubMenu(item);
rootMenu.addMenuItem(item);
});
(0, vue.onBeforeUnmount)(() => {
subMenu.removeSubMenu(item);
rootMenu.removeMenuItem(item);
});
__expose({
parentMenu,
rootMenu,
active,
nsMenu,
nsMenuItem,
handleClick
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
class: (0, vue.normalizeClass)([
(0, vue.unref)(nsMenuItem).b(),
(0, vue.unref)(nsMenuItem).is("active", active.value),
(0, vue.unref)(nsMenuItem).is("disabled", __props.disabled)
]),
role: "menuitem",
tabindex: "-1",
onClick: handleClick
}, [(0, vue.unref)(parentMenu).type.name === "ElMenu" && (0, vue.unref)(rootMenu).props.collapse && _ctx.$slots.title ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElTooltip), {
key: 0,
effect: (0, vue.unref)(rootMenu).props.popperEffect,
placement: "right",
"fallback-placements": ["left"],
"popper-class": (0, vue.unref)(rootMenu).props.popperClass,
"popper-style": (0, vue.unref)(rootMenu).props.popperStyle,
persistent: (0, vue.unref)(rootMenu).props.persistent,
"focus-on-target": ""
}, {
content: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "title")]),
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(nsMenu).be("tooltip", "trigger")) }, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2)]),
_: 3
}, 8, [
"effect",
"popper-class",
"popper-style",
"persistent"
])) : ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, [(0, vue.renderSlot)(_ctx.$slots, "default"), (0, vue.renderSlot)(_ctx.$slots, "title")], 64))], 2);
};
}
});
//#endregion
//#region ../../packages/components/menu/src/menu-item.vue
var menu_item_default = menu_item_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/menu/src/menu-item-group.ts
/**
* @deprecated Removed after 3.0.0, Use `MenuItemGroupProps` instead.
*/
const menuItemGroupProps = { title: String };
//#endregion
//#region ../../packages/components/menu/src/menu-item-group.vue?vue&type=script&setup=true&lang.ts
var menu_item_group_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElMenuItemGroup",
__name: "menu-item-group",
props: menuItemGroupProps,
setup(__props) {
const ns = useNamespace("menu-item-group");
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("li", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("title")) }, [!_ctx.$slots.title ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.title), 1)], 64)) : (0, vue.renderSlot)(_ctx.$slots, "title", { key: 1 })], 2), (0, vue.createElementVNode)("ul", null, [(0, vue.renderSlot)(_ctx.$slots, "default")])], 2);
};
}
});
//#endregion
//#region ../../packages/components/menu/src/menu-item-group.vue
var menu_item_group_default = menu_item_group_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/menu/index.ts
const ElMenu = withInstall(menu_default, {
MenuItem: menu_item_default,
MenuItemGroup: menu_item_group_default,
SubMenu: sub_menu_default
});
const ElMenuItem = withNoopInstall(menu_item_default);
const ElMenuItemGroup = withNoopInstall(menu_item_group_default);
const ElSubMenu = withNoopInstall(sub_menu_default);
//#endregion
//#region ../../packages/components/page-header/src/page-header.ts
/**
* @deprecated Removed after 3.0.0, Use `PageHeaderProps` instead.
*/
const pageHeaderProps = buildProps({
icon: {
type: iconPropType,
default: () => back_default
},
title: String,
content: {
type: String,
default: ""
}
});
const pageHeaderEmits = { back: () => true };
//#endregion
//#region ../../packages/components/page-header/src/page-header.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$30 = ["aria-label"];
var page_header_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElPageHeader",
__name: "page-header",
props: pageHeaderProps,
emits: pageHeaderEmits,
setup(__props, { emit: __emit }) {
const emit = __emit;
const { t } = useLocale();
const ns = useNamespace("page-header");
function handleClick() {
emit("back");
}
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).b(),
(0, vue.unref)(ns).is("contentful", !!_ctx.$slots.default),
{
[(0, vue.unref)(ns).m("has-breadcrumb")]: !!_ctx.$slots.breadcrumb,
[(0, vue.unref)(ns).m("has-extra")]: !!_ctx.$slots.extra
}
]) }, [
_ctx.$slots.breadcrumb ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("breadcrumb"))
}, [(0, vue.renderSlot)(_ctx.$slots, "breadcrumb")], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("header")) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("left")) }, [
(0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("back")),
role: "button",
tabindex: "0",
onClick: handleClick
}, [__props.icon || _ctx.$slots.icon ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
"aria-label": __props.title || (0, vue.unref)(t)("el.pageHeader.title"),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("icon"))
}, [(0, vue.renderSlot)(_ctx.$slots, "icon", {}, () => [__props.icon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), { key: 0 }, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.icon)))]),
_: 1
})) : (0, vue.createCommentVNode)("v-if", true)])], 10, _hoisted_1$30)) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("title")) }, [(0, vue.renderSlot)(_ctx.$slots, "title", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.title || (0, vue.unref)(t)("el.pageHeader.title")), 1)])], 2)], 2),
(0, vue.createVNode)((0, vue.unref)(ElDivider), { direction: "vertical" }),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("content")) }, [(0, vue.renderSlot)(_ctx.$slots, "content", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.content), 1)])], 2)
], 2), _ctx.$slots.extra ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("extra"))
}, [(0, vue.renderSlot)(_ctx.$slots, "extra")], 2)) : (0, vue.createCommentVNode)("v-if", true)], 2),
_ctx.$slots.default ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("main"))
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2)) : (0, vue.createCommentVNode)("v-if", true)
], 2);
};
}
});
//#endregion
//#region ../../packages/components/page-header/src/page-header.vue
var page_header_default = page_header_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/page-header/index.ts
const ElPageHeader = withInstall(page_header_default);
//#endregion
//#region ../../packages/components/pagination/src/constants.ts
const elPaginationKey = Symbol("elPaginationKey");
//#endregion
//#region ../../packages/components/pagination/src/components/prev.ts
const paginationPrevProps = buildProps({
disabled: Boolean,
currentPage: {
type: Number,
default: 1
},
prevText: { type: String },
prevIcon: { type: iconPropType }
});
const paginationPrevEmits = { click: (evt) => evt instanceof MouseEvent };
//#endregion
//#region ../../packages/components/pagination/src/components/prev.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$29 = [
"disabled",
"aria-label",
"aria-disabled"
];
const _hoisted_2$18 = { key: 0 };
var prev_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElPaginationPrev",
__name: "prev",
props: paginationPrevProps,
emits: paginationPrevEmits,
setup(__props) {
const props = __props;
const { t } = useLocale();
const internalDisabled = (0, vue.computed)(() => props.disabled || props.currentPage <= 1);
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
type: "button",
class: "btn-prev",
disabled: internalDisabled.value,
"aria-label": _ctx.prevText || (0, vue.unref)(t)("el.pagination.prev"),
"aria-disabled": internalDisabled.value,
onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("click", $event))
}, [_ctx.prevText ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_2$18, (0, vue.toDisplayString)(_ctx.prevText), 1)) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), { key: 1 }, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(_ctx.prevIcon)))]),
_: 1
}))], 8, _hoisted_1$29);
};
}
});
//#endregion
//#region ../../packages/components/pagination/src/components/prev.vue
var prev_default = prev_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/pagination/src/components/next.ts
const paginationNextProps = buildProps({
disabled: Boolean,
currentPage: {
type: Number,
default: 1
},
pageCount: {
type: Number,
default: 50
},
nextText: { type: String },
nextIcon: { type: iconPropType }
});
//#endregion
//#region ../../packages/components/pagination/src/components/next.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$28 = [
"disabled",
"aria-label",
"aria-disabled"
];
const _hoisted_2$17 = { key: 0 };
var next_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElPaginationNext",
__name: "next",
props: paginationNextProps,
emits: ["click"],
setup(__props) {
const props = __props;
const { t } = useLocale();
const internalDisabled = (0, vue.computed)(() => props.disabled || props.currentPage === props.pageCount || props.pageCount === 0);
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
type: "button",
class: "btn-next",
disabled: internalDisabled.value,
"aria-label": _ctx.nextText || (0, vue.unref)(t)("el.pagination.next"),
"aria-disabled": internalDisabled.value,
onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("click", $event))
}, [_ctx.nextText ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_2$17, (0, vue.toDisplayString)(_ctx.nextText), 1)) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), { key: 1 }, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(_ctx.nextIcon)))]),
_: 1
}))], 8, _hoisted_1$28);
};
}
});
//#endregion
//#region ../../packages/components/pagination/src/components/next.vue
var next_default = next_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/pagination/src/usePagination.ts
const usePagination = () => (0, vue.inject)(elPaginationKey, {});
//#endregion
//#region ../../packages/components/pagination/src/components/sizes.ts
const paginationSizesProps = buildProps({
pageSize: {
type: Number,
required: true
},
pageSizes: {
type: definePropType(Array),
default: () => mutable([
10,
20,
30,
40,
50,
100
])
},
popperClass: { type: String },
popperStyle: { type: definePropType([String, Object]) },
disabled: Boolean,
teleported: Boolean,
size: {
type: String,
values: componentSizes
},
appendSizeTo: String
});
//#endregion
//#region ../../packages/components/pagination/src/components/sizes.vue?vue&type=script&setup=true&lang.ts
var sizes_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElPaginationSizes",
__name: "sizes",
props: paginationSizesProps,
emits: ["page-size-change"],
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const { t } = useLocale();
const ns = useNamespace("pagination");
const pagination = usePagination();
const innerPageSize = (0, vue.ref)(props.pageSize);
(0, vue.watch)(() => props.pageSizes, (newVal, oldVal) => {
if (isEqual$1(newVal, oldVal)) return;
if (isArray$1(newVal)) emit("page-size-change", newVal.includes(props.pageSize) ? props.pageSize : props.pageSizes[0]);
});
(0, vue.watch)(() => props.pageSize, (newVal) => {
innerPageSize.value = newVal;
});
const innerPageSizes = (0, vue.computed)(() => props.pageSizes);
function handleChange(val) {
if (val !== innerPageSize.value) {
innerPageSize.value = val;
pagination.handleSizeChange?.(Number(val));
}
}
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("sizes")) }, [(0, vue.createVNode)((0, vue.unref)(ElSelect), {
"model-value": innerPageSize.value,
disabled: _ctx.disabled,
"popper-class": _ctx.popperClass,
"popper-style": _ctx.popperStyle,
size: _ctx.size,
teleported: _ctx.teleported,
"validate-event": false,
"append-to": _ctx.appendSizeTo,
onChange: handleChange
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(innerPageSizes.value, (item) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElOption), {
key: item,
value: item,
label: item + (0, vue.unref)(t)("el.pagination.pagesize")
}, null, 8, ["value", "label"]);
}), 128))]),
_: 1
}, 8, [
"model-value",
"disabled",
"popper-class",
"popper-style",
"size",
"teleported",
"append-to"
])], 2);
};
}
});
//#endregion
//#region ../../packages/components/pagination/src/components/sizes.vue
var sizes_default = sizes_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/pagination/src/components/jumper.ts
const paginationJumperProps = buildProps({ size: {
type: String,
values: componentSizes
} });
//#endregion
//#region ../../packages/components/pagination/src/components/jumper.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$27 = ["disabled"];
var jumper_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElPaginationJumper",
__name: "jumper",
props: paginationJumperProps,
setup(__props) {
const { t } = useLocale();
const ns = useNamespace("pagination");
const { pageCount, disabled, currentPage, changeEvent } = usePagination();
const userInput = (0, vue.ref)();
const innerValue = (0, vue.computed)(() => userInput.value ?? currentPage?.value);
function handleInput(val) {
userInput.value = val ? +val : "";
}
function handleChange(val) {
val = Math.trunc(+val);
changeEvent?.(val);
userInput.value = void 0;
}
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("jump")),
disabled: (0, vue.unref)(disabled)
}, [
(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("goto")]) }, (0, vue.toDisplayString)((0, vue.unref)(t)("el.pagination.goto")), 3),
(0, vue.createVNode)((0, vue.unref)(ElInput), {
size: _ctx.size,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("editor"), (0, vue.unref)(ns).is("in-pagination")]),
min: 1,
max: (0, vue.unref)(pageCount),
disabled: (0, vue.unref)(disabled),
"model-value": innerValue.value,
"validate-event": false,
"aria-label": (0, vue.unref)(t)("el.pagination.page"),
type: "number",
"onUpdate:modelValue": handleInput,
onChange: handleChange
}, null, 8, [
"size",
"class",
"max",
"disabled",
"model-value",
"aria-label"
]),
(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("classifier")]) }, (0, vue.toDisplayString)((0, vue.unref)(t)("el.pagination.pageClassifier")), 3)
], 10, _hoisted_1$27);
};
}
});
//#endregion
//#region ../../packages/components/pagination/src/components/jumper.vue
var jumper_default = jumper_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/pagination/src/components/total.ts
const paginationTotalProps = buildProps({ total: {
type: Number,
default: 1e3
} });
//#endregion
//#region ../../packages/components/pagination/src/components/total.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$26 = ["disabled"];
var total_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElPaginationTotal",
__name: "total",
props: paginationTotalProps,
setup(__props) {
const { t } = useLocale();
const ns = useNamespace("pagination");
const { disabled } = usePagination();
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("total")),
disabled: (0, vue.unref)(disabled)
}, (0, vue.toDisplayString)((0, vue.unref)(t)("el.pagination.total", { total: _ctx.total })), 11, _hoisted_1$26);
};
}
});
//#endregion
//#region ../../packages/components/pagination/src/components/total.vue
var total_default = total_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/pagination/src/components/pager.ts
const paginationPagerProps = buildProps({
currentPage: {
type: Number,
default: 1
},
pageCount: {
type: Number,
required: true
},
pagerCount: {
type: Number,
default: 7
},
disabled: Boolean
});
//#endregion
//#region ../../packages/components/pagination/src/components/pager.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$25 = [
"aria-current",
"aria-label",
"tabindex"
];
const _hoisted_2$16 = ["tabindex", "aria-label"];
const _hoisted_3$7 = [
"aria-current",
"aria-label",
"tabindex"
];
const _hoisted_4$5 = ["tabindex", "aria-label"];
const _hoisted_5$3 = [
"aria-current",
"aria-label",
"tabindex"
];
var pager_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElPaginationPager",
__name: "pager",
props: paginationPagerProps,
emits: [CHANGE_EVENT],
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const nsPager = useNamespace("pager");
const nsIcon = useNamespace("icon");
const { t } = useLocale();
const showPrevMore = (0, vue.ref)(false);
const showNextMore = (0, vue.ref)(false);
const quickPrevHover = (0, vue.ref)(false);
const quickNextHover = (0, vue.ref)(false);
const quickPrevFocus = (0, vue.ref)(false);
const quickNextFocus = (0, vue.ref)(false);
const pagers = (0, vue.computed)(() => {
const pagerCount = props.pagerCount;
const halfPagerCount = (pagerCount - 1) / 2;
const currentPage = Number(props.currentPage);
const pageCount = Number(props.pageCount);
let showPrevMore = false;
let showNextMore = false;
if (pageCount > pagerCount) {
if (currentPage > pagerCount - halfPagerCount) showPrevMore = true;
if (currentPage < pageCount - halfPagerCount) showNextMore = true;
}
const array = [];
if (showPrevMore && !showNextMore) {
const startPage = pageCount - (pagerCount - 2);
for (let i = startPage; i < pageCount; i++) array.push(i);
} else if (!showPrevMore && showNextMore) for (let i = 2; i < pagerCount; i++) array.push(i);
else if (showPrevMore && showNextMore) {
const offset = Math.floor(pagerCount / 2) - 1;
for (let i = currentPage - offset; i <= currentPage + offset; i++) array.push(i);
} else for (let i = 2; i < pageCount; i++) array.push(i);
return array;
});
const prevMoreKls = (0, vue.computed)(() => [
"more",
"btn-quickprev",
nsIcon.b(),
nsPager.is("disabled", props.disabled)
]);
const nextMoreKls = (0, vue.computed)(() => [
"more",
"btn-quicknext",
nsIcon.b(),
nsPager.is("disabled", props.disabled)
]);
const tabindex = (0, vue.computed)(() => props.disabled ? -1 : 0);
(0, vue.watch)(() => [
props.pageCount,
props.pagerCount,
props.currentPage
], ([pageCount, pagerCount, currentPage]) => {
const halfPagerCount = (pagerCount - 1) / 2;
let showPrev = false;
let showNext = false;
if (pageCount > pagerCount) {
showPrev = currentPage > pagerCount - halfPagerCount;
showNext = currentPage < pageCount - halfPagerCount;
}
quickPrevHover.value &&= showPrev;
quickNextHover.value &&= showNext;
showPrevMore.value = showPrev;
showNextMore.value = showNext;
}, { immediate: true });
function onMouseEnter(forward = false) {
if (props.disabled) return;
if (forward) quickPrevHover.value = true;
else quickNextHover.value = true;
}
function onFocus(forward = false) {
if (forward) quickPrevFocus.value = true;
else quickNextFocus.value = true;
}
function onEnter(e) {
const target = e.target;
if (target.tagName.toLowerCase() === "li" && Array.from(target.classList).includes("number")) {
const newPage = Number(target.textContent);
if (newPage !== props.currentPage) emit(CHANGE_EVENT, newPage);
} else if (target.tagName.toLowerCase() === "li" && Array.from(target.classList).includes("more")) onPagerClick(e);
}
function onPagerClick(event) {
const target = event.target;
if (target.tagName.toLowerCase() === "ul" || props.disabled) return;
let newPage = Number(target.textContent);
const pageCount = props.pageCount;
const currentPage = props.currentPage;
const pagerCountOffset = props.pagerCount - 2;
if (target.className.includes("more")) {
if (target.className.includes("quickprev")) newPage = currentPage - pagerCountOffset;
else if (target.className.includes("quicknext")) newPage = currentPage + pagerCountOffset;
}
if (!Number.isNaN(+newPage)) {
if (newPage < 1) newPage = 1;
if (newPage > pageCount) newPage = pageCount;
}
if (newPage !== currentPage) emit(CHANGE_EVENT, newPage);
}
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("ul", {
class: (0, vue.normalizeClass)((0, vue.unref)(nsPager).b()),
onClick: onPagerClick,
onKeyup: (0, vue.withKeys)(onEnter, ["enter"])
}, [
_ctx.pageCount > 0 ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
key: 0,
class: (0, vue.normalizeClass)([[(0, vue.unref)(nsPager).is("active", _ctx.currentPage === 1), (0, vue.unref)(nsPager).is("disabled", _ctx.disabled)], "number"]),
"aria-current": _ctx.currentPage === 1,
"aria-label": (0, vue.unref)(t)("el.pagination.currentPage", { pager: 1 }),
tabindex: tabindex.value
}, " 1 ", 10, _hoisted_1$25)) : (0, vue.createCommentVNode)("v-if", true),
showPrevMore.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
key: 1,
class: (0, vue.normalizeClass)(prevMoreKls.value),
tabindex: tabindex.value,
"aria-label": (0, vue.unref)(t)("el.pagination.prevPages", { pager: _ctx.pagerCount - 2 }),
onMouseenter: _cache[0] || (_cache[0] = ($event) => onMouseEnter(true)),
onMouseleave: _cache[1] || (_cache[1] = ($event) => quickPrevHover.value = false),
onFocus: _cache[2] || (_cache[2] = ($event) => onFocus(true)),
onBlur: _cache[3] || (_cache[3] = ($event) => quickPrevFocus.value = false)
}, [(quickPrevHover.value || quickPrevFocus.value) && !_ctx.disabled ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(d_arrow_left_default), { key: 0 })) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(more_filled_default), { key: 1 }))], 42, _hoisted_2$16)) : (0, vue.createCommentVNode)("v-if", true),
((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(pagers.value, (pager) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
key: pager,
class: (0, vue.normalizeClass)([[(0, vue.unref)(nsPager).is("active", _ctx.currentPage === pager), (0, vue.unref)(nsPager).is("disabled", _ctx.disabled)], "number"]),
"aria-current": _ctx.currentPage === pager,
"aria-label": (0, vue.unref)(t)("el.pagination.currentPage", { pager }),
tabindex: tabindex.value
}, (0, vue.toDisplayString)(pager), 11, _hoisted_3$7);
}), 128)),
showNextMore.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
key: 2,
class: (0, vue.normalizeClass)(nextMoreKls.value),
tabindex: tabindex.value,
"aria-label": (0, vue.unref)(t)("el.pagination.nextPages", { pager: _ctx.pagerCount - 2 }),
onMouseenter: _cache[4] || (_cache[4] = ($event) => onMouseEnter()),
onMouseleave: _cache[5] || (_cache[5] = ($event) => quickNextHover.value = false),
onFocus: _cache[6] || (_cache[6] = ($event) => onFocus()),
onBlur: _cache[7] || (_cache[7] = ($event) => quickNextFocus.value = false)
}, [(quickNextHover.value || quickNextFocus.value) && !_ctx.disabled ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(d_arrow_right_default), { key: 0 })) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(more_filled_default), { key: 1 }))], 42, _hoisted_4$5)) : (0, vue.createCommentVNode)("v-if", true),
_ctx.pageCount > 1 ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
key: 3,
class: (0, vue.normalizeClass)([[(0, vue.unref)(nsPager).is("active", _ctx.currentPage === _ctx.pageCount), (0, vue.unref)(nsPager).is("disabled", _ctx.disabled)], "number"]),
"aria-current": _ctx.currentPage === _ctx.pageCount,
"aria-label": (0, vue.unref)(t)("el.pagination.currentPage", { pager: _ctx.pageCount }),
tabindex: tabindex.value
}, (0, vue.toDisplayString)(_ctx.pageCount), 11, _hoisted_5$3)) : (0, vue.createCommentVNode)("v-if", true)
], 34);
};
}
});
//#endregion
//#region ../../packages/components/pagination/src/components/pager.vue
var pager_default = pager_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/pagination/src/pagination.ts
/**
* It it user's responsibility to guarantee that the value of props.total... is number
* (same as pageSize, defaultPageSize, currentPage, defaultCurrentPage, pageCount)
* Otherwise we can reasonable infer that the corresponding field is absent
*/
const isAbsent = (v) => typeof v !== "number";
const paginationProps = buildProps({
pageSize: Number,
defaultPageSize: Number,
total: Number,
pageCount: Number,
pagerCount: {
type: Number,
validator: (value) => {
return isNumber(value) && Math.trunc(value) === value && value > 4 && value < 22 && value % 2 === 1;
},
default: 7
},
currentPage: Number,
defaultCurrentPage: Number,
layout: {
type: String,
default: [
"prev",
"pager",
"next",
"jumper",
"->",
"total"
].join(", ")
},
pageSizes: {
type: definePropType(Array),
default: () => mutable([
10,
20,
30,
40,
50,
100
])
},
popperClass: {
type: String,
default: ""
},
popperStyle: { type: definePropType([String, Object]) },
prevText: {
type: String,
default: ""
},
prevIcon: {
type: iconPropType,
default: () => arrow_left_default
},
nextText: {
type: String,
default: ""
},
nextIcon: {
type: iconPropType,
default: () => arrow_right_default
},
teleported: {
type: Boolean,
default: true
},
small: Boolean,
size: useSizeProp,
background: Boolean,
disabled: Boolean,
hideOnSinglePage: Boolean,
appendSizeTo: String
});
const paginationEmits = {
"update:current-page": (val) => isNumber(val),
"update:page-size": (val) => isNumber(val),
"size-change": (val) => isNumber(val),
change: (currentPage, pageSize) => isNumber(currentPage) && isNumber(pageSize),
"current-change": (val) => isNumber(val),
"prev-click": (val) => isNumber(val),
"next-click": (val) => isNumber(val)
};
const componentName = "ElPagination";
var pagination_default = (0, vue.defineComponent)({
name: componentName,
props: paginationProps,
emits: paginationEmits,
setup(props, { emit, slots }) {
const { t } = useLocale();
const ns = useNamespace("pagination");
const vnodeProps = (0, vue.getCurrentInstance)().vnode.props || {};
const _globalSize = useGlobalSize();
const _size = (0, vue.computed)(() => props.small ? "small" : props.size ?? _globalSize.value);
useDeprecated({
from: "small",
replacement: "size",
version: "3.0.0",
scope: "el-pagination",
ref: "https://element-plus.org/zh-CN/component/pagination.html"
}, (0, vue.computed)(() => !!props.small));
const hasCurrentPageListener = "onUpdate:currentPage" in vnodeProps || "onUpdate:current-page" in vnodeProps || "onCurrentChange" in vnodeProps;
const hasPageSizeListener = "onUpdate:pageSize" in vnodeProps || "onUpdate:page-size" in vnodeProps || "onSizeChange" in vnodeProps;
const assertValidUsage = (0, vue.computed)(() => {
if (isAbsent(props.total) && isAbsent(props.pageCount)) return false;
if (!isAbsent(props.currentPage) && !hasCurrentPageListener) return false;
if (props.layout.includes("sizes")) {
if (!isAbsent(props.pageCount)) {
if (!hasPageSizeListener) return false;
} else if (!isAbsent(props.total)) {
if (!isAbsent(props.pageSize)) {
if (!hasPageSizeListener) return false;
}
}
}
return true;
});
const innerPageSize = (0, vue.ref)(isAbsent(props.defaultPageSize) ? 10 : props.defaultPageSize);
const innerCurrentPage = (0, vue.ref)(isAbsent(props.defaultCurrentPage) ? 1 : props.defaultCurrentPage);
const pageSizeBridge = (0, vue.computed)({
get() {
return isAbsent(props.pageSize) ? innerPageSize.value : props.pageSize;
},
set(v) {
if (isAbsent(props.pageSize)) innerPageSize.value = v;
if (hasPageSizeListener) {
emit("update:page-size", v);
emit("size-change", v);
}
}
});
const pageCountBridge = (0, vue.computed)(() => {
let pageCount = 0;
if (!isAbsent(props.pageCount)) pageCount = props.pageCount;
else if (!isAbsent(props.total)) pageCount = Math.max(1, Math.ceil(props.total / pageSizeBridge.value));
return pageCount;
});
const currentPageBridge = (0, vue.computed)({
get() {
return isAbsent(props.currentPage) ? innerCurrentPage.value : props.currentPage;
},
set(v) {
let newCurrentPage = v;
if (v < 1) newCurrentPage = 1;
else if (v > pageCountBridge.value) newCurrentPage = pageCountBridge.value;
if (isAbsent(props.currentPage)) innerCurrentPage.value = newCurrentPage;
if (hasCurrentPageListener) {
emit("update:current-page", newCurrentPage);
emit("current-change", newCurrentPage);
}
}
});
(0, vue.watch)(pageCountBridge, (val) => {
if (currentPageBridge.value > val) currentPageBridge.value = val;
});
(0, vue.watch)([currentPageBridge, pageSizeBridge], (value) => {
emit(CHANGE_EVENT, ...value);
}, { flush: "post" });
function handleCurrentChange(val) {
currentPageBridge.value = val;
}
function handleSizeChange(val) {
pageSizeBridge.value = val;
const newPageCount = pageCountBridge.value;
if (currentPageBridge.value > newPageCount) currentPageBridge.value = newPageCount;
}
function prev() {
if (props.disabled) return;
currentPageBridge.value -= 1;
emit("prev-click", currentPageBridge.value);
}
function next() {
if (props.disabled) return;
currentPageBridge.value += 1;
emit("next-click", currentPageBridge.value);
}
function addClass(element, cls) {
if (element) {
if (!element.props) element.props = {};
element.props.class = [element.props.class, cls].join(" ");
}
}
(0, vue.provide)(elPaginationKey, {
pageCount: pageCountBridge,
disabled: (0, vue.computed)(() => props.disabled),
currentPage: currentPageBridge,
changeEvent: handleCurrentChange,
handleSizeChange
});
return () => {
if (!assertValidUsage.value) {
/* @__PURE__ */ debugWarn(componentName, t("el.pagination.deprecationWarning"));
return null;
}
if (!props.layout) return null;
if (props.hideOnSinglePage && pageCountBridge.value <= 1) return null;
const rootChildren = [];
const rightWrapperChildren = [];
const rightWrapperRoot = (0, vue.h)("div", { class: ns.e("rightwrapper") }, rightWrapperChildren);
const TEMPLATE_MAP = {
prev: (0, vue.h)(prev_default, {
disabled: props.disabled,
currentPage: currentPageBridge.value,
prevText: props.prevText,
prevIcon: props.prevIcon,
onClick: prev
}),
jumper: (0, vue.h)(jumper_default, { size: _size.value }),
pager: (0, vue.h)(pager_default, {
currentPage: currentPageBridge.value,
pageCount: pageCountBridge.value,
pagerCount: props.pagerCount,
onChange: handleCurrentChange,
disabled: props.disabled
}),
next: (0, vue.h)(next_default, {
disabled: props.disabled,
currentPage: currentPageBridge.value,
pageCount: pageCountBridge.value,
nextText: props.nextText,
nextIcon: props.nextIcon,
onClick: next
}),
sizes: (0, vue.h)(sizes_default, {
pageSize: pageSizeBridge.value,
pageSizes: props.pageSizes,
popperClass: props.popperClass,
popperStyle: props.popperStyle,
disabled: props.disabled,
teleported: props.teleported,
size: _size.value,
appendSizeTo: props.appendSizeTo
}),
slot: slots?.default?.() ?? null,
total: (0, vue.h)(total_default, { total: isAbsent(props.total) ? 0 : props.total })
};
const components = props.layout.split(",").map((item) => item.trim());
let haveRightWrapper = false;
components.forEach((c) => {
if (c === "->") {
haveRightWrapper = true;
return;
}
if (!haveRightWrapper) rootChildren.push(TEMPLATE_MAP[c]);
else rightWrapperChildren.push(TEMPLATE_MAP[c]);
});
addClass(rootChildren[0], ns.is("first"));
addClass(rootChildren[rootChildren.length - 1], ns.is("last"));
if (haveRightWrapper && rightWrapperChildren.length > 0) {
addClass(rightWrapperChildren[0], ns.is("first"));
addClass(rightWrapperChildren[rightWrapperChildren.length - 1], ns.is("last"));
rootChildren.push(rightWrapperRoot);
}
return (0, vue.h)("div", { class: [
ns.b(),
ns.is("background", props.background),
ns.m(_size.value)
] }, rootChildren);
};
}
});
//#endregion
//#region ../../packages/components/pagination/index.ts
const ElPagination = withInstall(pagination_default);
//#endregion
//#region ../../packages/components/popconfirm/src/popconfirm.ts
/**
* @deprecated Removed after 3.0.0, Use `PopconfirmProps` instead.
*/
const popconfirmProps = buildProps({
title: String,
confirmButtonText: String,
cancelButtonText: String,
confirmButtonType: {
type: String,
values: buttonTypes,
default: "primary"
},
cancelButtonType: {
type: String,
values: buttonTypes,
default: "text"
},
icon: {
type: iconPropType,
default: () => question_filled_default
},
iconColor: {
type: String,
default: "#f90"
},
hideIcon: Boolean,
hideAfter: {
type: Number,
default: 200
},
effect: {
...useTooltipContentProps.effect,
default: "light"
},
teleported: useTooltipContentProps.teleported,
persistent: useTooltipContentProps.persistent,
width: {
type: [String, Number],
default: 150
},
virtualTriggering: useTooltipTriggerProps.virtualTriggering,
virtualRef: useTooltipTriggerProps.virtualRef
});
const popconfirmEmits = {
confirm: (e) => e instanceof MouseEvent,
cancel: (e) => e instanceof MouseEvent
};
//#endregion
//#region ../../packages/components/popconfirm/src/popconfirm.vue?vue&type=script&setup=true&lang.ts
var popconfirm_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElPopconfirm",
__name: "popconfirm",
props: popconfirmProps,
emits: popconfirmEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const { t } = useLocale();
const ns = useNamespace("popconfirm");
const tooltipRef = (0, vue.ref)();
const rootRef = (0, vue.ref)();
const popperRef = (0, vue.computed)(() => {
return (0, vue.unref)(tooltipRef)?.popperRef;
});
const showPopper = () => {
rootRef.value?.focus?.();
};
const hidePopper = () => {
tooltipRef.value?.onClose?.();
};
const style = (0, vue.computed)(() => {
return { width: addUnit(props.width) };
});
const confirm = (e) => {
emit("confirm", e);
hidePopper();
};
const cancel = (e) => {
emit("cancel", e);
hidePopper();
};
const finalConfirmButtonText = (0, vue.computed)(() => props.confirmButtonText || t("el.popconfirm.confirmButtonText"));
const finalCancelButtonText = (0, vue.computed)(() => props.cancelButtonText || t("el.popconfirm.cancelButtonText"));
__expose({
popperRef,
hide: hidePopper
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElTooltip), (0, vue.mergeProps)({
ref_key: "tooltipRef",
ref: tooltipRef,
trigger: "click",
effect: __props.effect
}, _ctx.$attrs, {
"virtual-triggering": __props.virtualTriggering,
"virtual-ref": __props.virtualRef,
"popper-class": `${(0, vue.unref)(ns).namespace.value}-popover`,
"popper-style": style.value,
teleported: __props.teleported,
"fallback-placements": [
"bottom",
"top",
"right",
"left"
],
"hide-after": __props.hideAfter,
persistent: __props.persistent,
loop: "",
onShow: showPopper
}), {
content: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", {
ref_key: "rootRef",
ref: rootRef,
tabindex: "-1",
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b())
}, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("main")) }, [!__props.hideIcon && __props.icon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("icon")),
style: (0, vue.normalizeStyle)({ color: __props.iconColor })
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.icon)))]),
_: 1
}, 8, ["class", "style"])) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createTextVNode)(" " + (0, vue.toDisplayString)(__props.title), 1)], 2), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("action")) }, [(0, vue.renderSlot)(_ctx.$slots, "actions", {
confirm,
cancel
}, () => [(0, vue.createVNode)((0, vue.unref)(ElButton), {
size: "small",
type: __props.cancelButtonType === "text" ? "" : __props.cancelButtonType,
text: __props.cancelButtonType === "text",
onClick: cancel
}, {
default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)(finalCancelButtonText.value), 1)]),
_: 1
}, 8, ["type", "text"]), (0, vue.createVNode)((0, vue.unref)(ElButton), {
size: "small",
type: __props.confirmButtonType === "text" ? "" : __props.confirmButtonType,
text: __props.confirmButtonType === "text",
onClick: confirm
}, {
default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)(finalConfirmButtonText.value), 1)]),
_: 1
}, 8, ["type", "text"])])], 2)], 2)]),
default: (0, vue.withCtx)(() => [_ctx.$slots.reference ? (0, vue.renderSlot)(_ctx.$slots, "reference", { key: 0 }) : (0, vue.createCommentVNode)("v-if", true)]),
_: 3
}, 16, [
"effect",
"virtual-triggering",
"virtual-ref",
"popper-class",
"popper-style",
"teleported",
"hide-after",
"persistent"
]);
};
}
});
//#endregion
//#region ../../packages/components/popconfirm/src/popconfirm.vue
var popconfirm_default = popconfirm_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/popconfirm/index.ts
const ElPopconfirm = withInstall(popconfirm_default);
//#endregion
//#region ../../packages/components/popover/src/popover.ts
/**
* @deprecated Removed after 3.0.0, Use `PopoverProps` instead.
*/
const popoverProps = buildProps({
trigger: useTooltipTriggerProps.trigger,
triggerKeys: useTooltipTriggerProps.triggerKeys,
placement: dropdownProps.placement,
disabled: useTooltipTriggerProps.disabled,
visible: useTooltipContentProps.visible,
transition: useTooltipContentProps.transition,
popperOptions: dropdownProps.popperOptions,
tabindex: dropdownProps.tabindex,
content: useTooltipContentProps.content,
popperStyle: useTooltipContentProps.popperStyle,
popperClass: useTooltipContentProps.popperClass,
enterable: {
...useTooltipContentProps.enterable,
default: true
},
effect: {
...useTooltipContentProps.effect,
default: "light"
},
teleported: useTooltipContentProps.teleported,
appendTo: useTooltipContentProps.appendTo,
title: String,
width: {
type: [String, Number],
default: 150
},
offset: {
type: Number,
default: void 0
},
showAfter: {
type: Number,
default: 0
},
hideAfter: {
type: Number,
default: 200
},
autoClose: {
type: Number,
default: 0
},
showArrow: {
type: Boolean,
default: true
},
persistent: {
type: Boolean,
default: true
},
"onUpdate:visible": { type: Function }
});
const popoverEmits = {
"update:visible": (value) => isBoolean(value),
"before-enter": () => true,
"before-leave": () => true,
"after-enter": () => true,
"after-leave": () => true
};
/**
* @description default values for PopoverProps
*/
const popoverPropsDefaults = {
trigger: "hover",
triggerKeys: () => [
EVENT_CODE.enter,
EVENT_CODE.numpadEnter,
EVENT_CODE.space
],
placement: "bottom",
visible: null,
popperOptions: () => ({}),
tabindex: 0,
content: "",
popperStyle: void 0,
enterable: true,
effect: "light",
teleported: true,
width: 150,
offset: void 0,
showAfter: 0,
hideAfter: 200,
autoClose: 0,
showArrow: true,
persistent: true
};
//#endregion
//#region ../../packages/components/popover/src/popover.vue?vue&type=script&setup=true&lang.ts
const updateEventKeyRaw = `onUpdate:visible`;
var popover_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElPopover",
__name: "popover",
props: popoverProps,
emits: popoverEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const onUpdateVisible = (0, vue.computed)(() => {
return props[updateEventKeyRaw];
});
const ns = useNamespace("popover");
const tooltipRef = (0, vue.ref)();
const popperRef = (0, vue.computed)(() => {
return (0, vue.unref)(tooltipRef)?.popperRef;
});
const style = (0, vue.computed)(() => {
return [{ width: addUnit(props.width) }, props.popperStyle];
});
const kls = (0, vue.computed)(() => {
return [
ns.b(),
props.popperClass,
{ [ns.m("plain")]: !!props.content }
];
});
const gpuAcceleration = (0, vue.computed)(() => {
return props.transition === `${ns.namespace.value}-fade-in-linear`;
});
const hide = () => {
tooltipRef.value?.hide();
};
const beforeEnter = () => {
emit("before-enter");
};
const beforeLeave = () => {
emit("before-leave");
};
const afterEnter = () => {
emit("after-enter");
};
const afterLeave = () => {
emit("update:visible", false);
emit("after-leave");
};
__expose({
popperRef,
hide
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElTooltip), (0, vue.mergeProps)({
ref_key: "tooltipRef",
ref: tooltipRef
}, _ctx.$attrs, {
trigger: __props.trigger,
"trigger-keys": __props.triggerKeys,
placement: __props.placement,
disabled: __props.disabled,
visible: __props.visible,
transition: __props.transition,
"popper-options": __props.popperOptions,
tabindex: __props.tabindex,
content: __props.content,
offset: __props.offset,
"show-after": __props.showAfter,
"hide-after": __props.hideAfter,
"auto-close": __props.autoClose,
"show-arrow": __props.showArrow,
"aria-label": __props.title,
effect: __props.effect,
enterable: __props.enterable,
"popper-class": kls.value,
"popper-style": style.value,
teleported: __props.teleported,
"append-to": __props.appendTo,
persistent: __props.persistent,
"gpu-acceleration": gpuAcceleration.value,
"onUpdate:visible": onUpdateVisible.value,
onBeforeShow: beforeEnter,
onBeforeHide: beforeLeave,
onShow: afterEnter,
onHide: afterLeave
}), {
content: (0, vue.withCtx)(() => [__props.title ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("title")),
role: "title"
}, (0, vue.toDisplayString)(__props.title), 3)) : (0, vue.createCommentVNode)("v-if", true), (0, vue.renderSlot)(_ctx.$slots, "default", { hide }, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.content), 1)])]),
default: (0, vue.withCtx)(() => [_ctx.$slots.reference ? (0, vue.renderSlot)(_ctx.$slots, "reference", { key: 0 }) : (0, vue.createCommentVNode)("v-if", true)]),
_: 3
}, 16, [
"trigger",
"trigger-keys",
"placement",
"disabled",
"visible",
"transition",
"popper-options",
"tabindex",
"content",
"offset",
"show-after",
"hide-after",
"auto-close",
"show-arrow",
"aria-label",
"effect",
"enterable",
"popper-class",
"popper-style",
"teleported",
"append-to",
"persistent",
"gpu-acceleration",
"onUpdate:visible"
]);
};
}
});
//#endregion
//#region ../../packages/components/popover/src/popover.vue
var popover_default = popover_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/popover/src/directive.ts
const attachEvents = (el, binding) => {
const popover = (binding.arg || binding.value)?.popperRef;
if (popover) popover.triggerRef = el;
};
var directive_default = {
mounted(el, binding) {
attachEvents(el, binding);
},
updated(el, binding) {
attachEvents(el, binding);
}
};
const VPopover = "popover";
//#endregion
//#region ../../packages/components/popover/index.ts
const ElPopoverDirective = withInstallDirective(directive_default, VPopover);
const ElPopover = withInstall(popover_default, { directive: ElPopoverDirective });
//#endregion
//#region ../../packages/components/progress/src/progress.ts
/**
* @deprecated Removed after 3.0.0, Use `ProgressProps` instead.
*/
const progressProps = buildProps({
type: {
type: String,
default: "line",
values: [
"line",
"circle",
"dashboard"
]
},
percentage: {
type: Number,
default: 0,
validator: (val) => val >= 0 && val <= 100
},
status: {
type: String,
default: "",
values: [
"",
"success",
"exception",
"warning"
]
},
indeterminate: Boolean,
duration: {
type: Number,
default: 3
},
strokeWidth: {
type: Number,
default: 6
},
strokeLinecap: {
type: definePropType(String),
default: "round"
},
textInside: Boolean,
width: {
type: Number,
default: 126
},
showText: {
type: Boolean,
default: true
},
color: {
type: definePropType([
String,
Array,
Function
]),
default: ""
},
striped: Boolean,
stripedFlow: Boolean,
format: {
type: definePropType(Function),
default: (percentage) => `${percentage}%`
}
});
//#endregion
//#region ../../packages/components/progress/src/progress.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$24 = ["aria-valuenow"];
const _hoisted_2$15 = { viewBox: "0 0 100 100" };
const _hoisted_3$6 = [
"d",
"stroke",
"stroke-linecap",
"stroke-width"
];
const _hoisted_4$4 = [
"d",
"stroke",
"opacity",
"stroke-linecap",
"stroke-width"
];
const _hoisted_5$2 = { key: 0 };
var progress_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElProgress",
__name: "progress",
props: progressProps,
setup(__props) {
const STATUS_COLOR_MAP = {
success: "#13ce66",
exception: "#ff4949",
warning: "#e6a23c",
default: "#20a0ff"
};
const props = __props;
const ns = useNamespace("progress");
const barStyle = (0, vue.computed)(() => {
const barStyle = {
width: `${props.percentage}%`,
animationDuration: `${props.duration}s`
};
const color = getCurrentColor(props.percentage);
if (color.includes("gradient")) barStyle.background = color;
else barStyle.backgroundColor = color;
return barStyle;
});
const relativeStrokeWidth = (0, vue.computed)(() => (props.strokeWidth / props.width * 100).toFixed(1));
const radius = (0, vue.computed)(() => {
if (["circle", "dashboard"].includes(props.type)) return Number.parseInt(`${50 - Number.parseFloat(relativeStrokeWidth.value) / 2}`, 10);
return 0;
});
const trackPath = (0, vue.computed)(() => {
const r = radius.value;
const isDashboard = props.type === "dashboard";
return `
M 50 50
m 0 ${isDashboard ? "" : "-"}${r}
a ${r} ${r} 0 1 1 0 ${isDashboard ? "-" : ""}${r * 2}
a ${r} ${r} 0 1 1 0 ${isDashboard ? "" : "-"}${r * 2}
`;
});
const perimeter = (0, vue.computed)(() => 2 * Math.PI * radius.value);
const rate = (0, vue.computed)(() => props.type === "dashboard" ? .75 : 1);
const strokeDashoffset = (0, vue.computed)(() => {
return `${-1 * perimeter.value * (1 - rate.value) / 2}px`;
});
const trailPathStyle = (0, vue.computed)(() => ({
strokeDasharray: `${perimeter.value * rate.value}px, ${perimeter.value}px`,
strokeDashoffset: strokeDashoffset.value
}));
const circlePathStyle = (0, vue.computed)(() => ({
strokeDasharray: `${perimeter.value * rate.value * (props.percentage / 100)}px, ${perimeter.value}px`,
strokeDashoffset: strokeDashoffset.value,
transition: "stroke-dasharray 0.6s ease 0s, stroke 0.6s ease, opacity ease 0.6s"
}));
const stroke = (0, vue.computed)(() => {
let ret;
if (props.color) ret = getCurrentColor(props.percentage);
else ret = STATUS_COLOR_MAP[props.status] || STATUS_COLOR_MAP.default;
return ret;
});
const statusIcon = (0, vue.computed)(() => {
if (props.status === "warning") return warning_filled_default;
if (props.type === "line") return props.status === "success" ? circle_check_default : circle_close_default;
else return props.status === "success" ? check_default : close_default;
});
const progressTextSize = (0, vue.computed)(() => {
return props.type === "line" ? 12 + props.strokeWidth * .4 : props.width * .111111 + 2;
});
const content = (0, vue.computed)(() => props.format(props.percentage));
function getColors(color) {
const span = 100 / color.length;
return color.map((seriesColor, index) => {
if (isString(seriesColor)) return {
color: seriesColor,
percentage: (index + 1) * span
};
return seriesColor;
}).sort((a, b) => a.percentage - b.percentage);
}
const getCurrentColor = (percentage) => {
const { color } = props;
if (isFunction$1(color)) return color(percentage);
else if (isString(color)) return color;
else {
const colors = getColors(color);
for (const color of colors) if (color.percentage > percentage) return color.color;
return colors[colors.length - 1]?.color;
}
};
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).b(),
(0, vue.unref)(ns).m(__props.type),
(0, vue.unref)(ns).is(__props.status),
{
[(0, vue.unref)(ns).m("without-text")]: !__props.showText,
[(0, vue.unref)(ns).m("text-inside")]: __props.textInside
}
]),
role: "progressbar",
"aria-valuenow": __props.percentage,
"aria-valuemin": "0",
"aria-valuemax": "100"
}, [__props.type === "line" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b("bar"))
}, [(0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("bar", "outer")),
style: (0, vue.normalizeStyle)({ height: `${__props.strokeWidth}px` })
}, [(0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).be("bar", "inner"),
{ [(0, vue.unref)(ns).bem("bar", "inner", "indeterminate")]: __props.indeterminate },
{ [(0, vue.unref)(ns).bem("bar", "inner", "striped")]: __props.striped },
{ [(0, vue.unref)(ns).bem("bar", "inner", "striped-flow")]: __props.stripedFlow }
]),
style: (0, vue.normalizeStyle)(barStyle.value)
}, [(__props.showText || _ctx.$slots.default) && __props.textInside ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("bar", "innerText"))
}, [(0, vue.renderSlot)(_ctx.$slots, "default", { percentage: __props.percentage }, () => [(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(content.value), 1)])], 2)) : (0, vue.createCommentVNode)("v-if", true)], 6)], 6)], 2)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b("circle")),
style: (0, vue.normalizeStyle)({
height: `${__props.width}px`,
width: `${__props.width}px`
})
}, [((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_2$15, [(0, vue.createElementVNode)("path", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("circle", "track")),
d: trackPath.value,
stroke: `var(${(0, vue.unref)(ns).cssVarName("fill-color-light")}, #e5e9f2)`,
"stroke-linecap": __props.strokeLinecap,
"stroke-width": relativeStrokeWidth.value,
fill: "none",
style: (0, vue.normalizeStyle)(trailPathStyle.value)
}, null, 14, _hoisted_3$6), (0, vue.createElementVNode)("path", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("circle", "path")),
d: trackPath.value,
stroke: stroke.value,
fill: "none",
opacity: __props.percentage ? 1 : 0,
"stroke-linecap": __props.strokeLinecap,
"stroke-width": relativeStrokeWidth.value,
style: (0, vue.normalizeStyle)(circlePathStyle.value)
}, null, 14, _hoisted_4$4)]))], 6)), (__props.showText || _ctx.$slots.default) && !__props.textInside ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 2,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("text")),
style: (0, vue.normalizeStyle)({ fontSize: `${progressTextSize.value}px` })
}, [(0, vue.renderSlot)(_ctx.$slots, "default", { percentage: __props.percentage }, () => [!__props.status ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_5$2, (0, vue.toDisplayString)(content.value), 1)) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), { key: 1 }, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(statusIcon.value)))]),
_: 1
}))])], 6)) : (0, vue.createCommentVNode)("v-if", true)], 10, _hoisted_1$24);
};
}
});
//#endregion
//#region ../../packages/components/progress/src/progress.vue
var progress_default = progress_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/progress/index.ts
const ElProgress = withInstall(progress_default);
//#endregion
//#region ../../packages/components/rate/src/rate.ts
/**
* @deprecated Removed after 3.0.0, Use `RateProps` instead.
*/
const rateProps = buildProps({
modelValue: {
type: Number,
default: 0
},
id: {
type: String,
default: void 0
},
lowThreshold: {
type: Number,
default: 2
},
highThreshold: {
type: Number,
default: 4
},
max: {
type: Number,
default: 5
},
colors: {
type: definePropType([Array, Object]),
default: () => mutable([
"",
"",
""
])
},
voidColor: {
type: String,
default: ""
},
disabledVoidColor: {
type: String,
default: ""
},
icons: {
type: definePropType([Array, Object]),
default: () => [
star_filled_default,
star_filled_default,
star_filled_default
]
},
voidIcon: {
type: iconPropType,
default: () => star_default
},
disabledVoidIcon: {
type: iconPropType,
default: () => star_filled_default
},
disabled: {
type: Boolean,
default: void 0
},
allowHalf: Boolean,
showText: Boolean,
showScore: Boolean,
textColor: {
type: String,
default: ""
},
texts: {
type: definePropType(Array),
default: () => mutable([
"Extremely bad",
"Disappointed",
"Fair",
"Satisfied",
"Surprise"
])
},
scoreTemplate: {
type: String,
default: "{value}"
},
size: useSizeProp,
clearable: Boolean,
...useAriaProps(["ariaLabel"])
});
const rateEmits = {
[CHANGE_EVENT]: (value) => isNumber(value),
[UPDATE_MODEL_EVENT]: (value) => isNumber(value)
};
//#endregion
//#region ../../packages/components/rate/src/rate.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$23 = [
"id",
"aria-label",
"aria-labelledby",
"aria-valuenow",
"aria-valuetext",
"aria-valuemax",
"tabindex",
"aria-disabled"
];
const _hoisted_2$14 = ["onMousemove", "onClick"];
var rate_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElRate",
__name: "rate",
props: rateProps,
emits: rateEmits,
setup(__props, { expose: __expose, emit: __emit }) {
function getValueFromMap(value, map) {
const isExcludedObject = (val) => isObject$1(val);
const matchedValue = map[Object.keys(map).map((key) => +key).filter((key) => {
const val = map[key];
return (isExcludedObject(val) ? val.excluded : false) ? value < key : value <= key;
}).sort((a, b) => a - b)[0]];
return isExcludedObject(matchedValue) && matchedValue.value || matchedValue;
}
const props = __props;
const emit = __emit;
const formItemContext = (0, vue.inject)(formItemContextKey, void 0);
const rateSize = useFormSize();
const ns = useNamespace("rate");
const { inputId, isLabeledByFormItem } = useFormItemInputId(props, { formItemContext });
const currentValue = (0, vue.ref)(clamp$1(props.modelValue, 0, props.max));
const hoverIndex = (0, vue.ref)(-1);
const pointerAtLeftHalf = (0, vue.ref)(true);
const iconRefs = (0, vue.ref)([]);
const iconClientWidths = (0, vue.computed)(() => iconRefs.value.map((icon) => icon.$el.clientWidth));
const rateClasses = (0, vue.computed)(() => [ns.b(), ns.m(rateSize.value)]);
const rateDisabled = useFormDisabled();
const rateStyles = (0, vue.computed)(() => {
return ns.cssVarBlock({
"void-color": props.voidColor,
"disabled-void-color": props.disabledVoidColor,
"fill-color": activeColor.value
});
});
const text = (0, vue.computed)(() => {
let result = "";
if (props.showScore) result = props.scoreTemplate.replace(/\{\s*value\s*\}/, rateDisabled.value ? `${props.modelValue}` : `${currentValue.value}`);
else if (props.showText) result = props.texts[Math.ceil(currentValue.value) - 1];
return result;
});
const valueDecimal = (0, vue.computed)(() => props.modelValue * 100 - Math.floor(props.modelValue) * 100);
const colorMap = (0, vue.computed)(() => isArray$1(props.colors) ? {
[props.lowThreshold]: props.colors[0],
[props.highThreshold]: {
value: props.colors[1],
excluded: true
},
[props.max]: props.colors[2]
} : props.colors);
const activeColor = (0, vue.computed)(() => {
const color = getValueFromMap(currentValue.value, colorMap.value);
return isObject$1(color) ? "" : color;
});
const decimalStyle = (0, vue.computed)(() => {
let width = "";
if (rateDisabled.value) width = `${valueDecimal.value}%`;
else if (props.allowHalf) width = "50%";
return {
color: activeColor.value,
width
};
});
const componentMap = (0, vue.computed)(() => {
let icons = isArray$1(props.icons) ? [...props.icons] : { ...props.icons };
icons = (0, vue.markRaw)(icons);
return isArray$1(icons) ? {
[props.lowThreshold]: icons[0],
[props.highThreshold]: {
value: icons[1],
excluded: true
},
[props.max]: icons[2]
} : icons;
});
const decimalIconComponent = (0, vue.computed)(() => getValueFromMap(props.modelValue, componentMap.value));
const voidComponent = (0, vue.computed)(() => rateDisabled.value ? isString(props.disabledVoidIcon) ? props.disabledVoidIcon : (0, vue.markRaw)(props.disabledVoidIcon) : isString(props.voidIcon) ? props.voidIcon : (0, vue.markRaw)(props.voidIcon));
const activeComponent = (0, vue.computed)(() => getValueFromMap(currentValue.value, componentMap.value));
function showDecimalIcon(item) {
const showWhenDisabled = rateDisabled.value && valueDecimal.value > 0 && item - 1 < props.modelValue && item > props.modelValue;
const showWhenAllowHalf = props.allowHalf && pointerAtLeftHalf.value && item - .5 <= currentValue.value && item > currentValue.value;
return showWhenDisabled || showWhenAllowHalf;
}
function emitValue(value) {
if (props.clearable && value === props.modelValue) value = 0;
emit(UPDATE_MODEL_EVENT, value);
if (props.modelValue !== value) emit(CHANGE_EVENT, value);
}
function selectValue(value) {
if (rateDisabled.value) return;
if (props.allowHalf && pointerAtLeftHalf.value) emitValue(currentValue.value);
else emitValue(value);
}
function handleKey(e) {
if (rateDisabled.value) return;
const code = getEventCode(e);
const step = props.allowHalf ? .5 : 1;
let _currentValue = currentValue.value;
switch (code) {
case EVENT_CODE.up:
case EVENT_CODE.right:
_currentValue += step;
break;
case EVENT_CODE.left:
case EVENT_CODE.down:
_currentValue -= step;
break;
}
_currentValue = clamp$1(_currentValue, 0, props.max);
if (_currentValue === currentValue.value) return;
e.stopPropagation();
e.preventDefault();
emit(UPDATE_MODEL_EVENT, _currentValue);
emit(CHANGE_EVENT, _currentValue);
return _currentValue;
}
function setCurrentValue(value, event) {
if (rateDisabled.value) return;
if (props.allowHalf && event) {
pointerAtLeftHalf.value = event.offsetX * 2 <= iconClientWidths.value[value - 1];
currentValue.value = pointerAtLeftHalf.value ? value - .5 : value;
} else currentValue.value = value;
hoverIndex.value = value;
}
function resetCurrentValue() {
if (rateDisabled.value) return;
if (props.allowHalf) pointerAtLeftHalf.value = props.modelValue !== Math.floor(props.modelValue);
currentValue.value = clamp$1(props.modelValue, 0, props.max);
hoverIndex.value = -1;
}
(0, vue.watch)(() => props.modelValue, (val) => {
currentValue.value = clamp$1(val, 0, props.max);
pointerAtLeftHalf.value = props.modelValue !== Math.floor(props.modelValue);
});
if (!props.modelValue) emit(UPDATE_MODEL_EVENT, 0);
__expose({
setCurrentValue,
resetCurrentValue
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
id: (0, vue.unref)(inputId),
class: (0, vue.normalizeClass)([rateClasses.value, (0, vue.unref)(ns).is("disabled", (0, vue.unref)(rateDisabled))]),
role: "slider",
"aria-label": !(0, vue.unref)(isLabeledByFormItem) ? __props.ariaLabel || "rating" : void 0,
"aria-labelledby": (0, vue.unref)(isLabeledByFormItem) ? (0, vue.unref)(formItemContext)?.labelId : void 0,
"aria-valuenow": currentValue.value,
"aria-valuetext": text.value || void 0,
"aria-valuemin": "0",
"aria-valuemax": __props.max,
style: (0, vue.normalizeStyle)(rateStyles.value),
tabindex: (0, vue.unref)(rateDisabled) ? void 0 : 0,
"aria-disabled": (0, vue.unref)(rateDisabled),
onKeydown: handleKey
}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.max, (item, key) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("item")),
onMousemove: ($event) => setCurrentValue(item, $event),
onMouseleave: resetCurrentValue,
onClick: ($event) => selectValue(item)
}, [(0, vue.createVNode)((0, vue.unref)(ElIcon), {
ref_for: true,
ref_key: "iconRefs",
ref: iconRefs,
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).e("icon"),
{ hover: hoverIndex.value === item },
(0, vue.unref)(ns).is("active", item <= currentValue.value),
(0, vue.unref)(ns).is("focus-visible", item === Math.ceil(currentValue.value || 1))
])
}, {
default: (0, vue.withCtx)(() => [
(0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(activeComponent.value), null, null, 512)), [[vue.vShow, !showDecimalIcon(item) && item <= currentValue.value]]),
(0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(voidComponent.value), null, null, 512)), [[vue.vShow, !showDecimalIcon(item) && item > currentValue.value]]),
(0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(voidComponent.value), { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).em("decimal", "box")]) }, null, 8, ["class"])), [[vue.vShow, showDecimalIcon(item)]]),
(0, vue.withDirectives)((0, vue.createVNode)((0, vue.unref)(ElIcon), {
style: (0, vue.normalizeStyle)(decimalStyle.value),
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("icon"), (0, vue.unref)(ns).e("decimal")])
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(decimalIconComponent.value)))]),
_: 1
}, 8, ["style", "class"]), [[vue.vShow, showDecimalIcon(item)]])
]),
_: 2
}, 1032, ["class"])], 42, _hoisted_2$14);
}), 128)), __props.showText || __props.showScore ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("text")),
style: (0, vue.normalizeStyle)({ color: __props.textColor })
}, (0, vue.toDisplayString)(text.value), 7)) : (0, vue.createCommentVNode)("v-if", true)], 46, _hoisted_1$23);
};
}
});
//#endregion
//#region ../../packages/components/rate/src/rate.vue
var rate_default = rate_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/rate/index.ts
const ElRate = withInstall(rate_default);
//#endregion
//#region ../../packages/components/result/src/result.ts
const IconMap = {
primary: "icon-primary",
success: "icon-success",
warning: "icon-warning",
error: "icon-error",
info: "icon-info"
};
const IconComponentMap = {
[IconMap.primary]: info_filled_default,
[IconMap.success]: circle_check_filled_default,
[IconMap.warning]: warning_filled_default,
[IconMap.error]: circle_close_filled_default,
[IconMap.info]: info_filled_default
};
/**
* @deprecated Removed after 3.0.0, Use `ResultProps` instead.
*/
const resultProps = buildProps({
title: {
type: String,
default: ""
},
subTitle: {
type: String,
default: ""
},
icon: {
type: String,
values: [
"primary",
"success",
"warning",
"info",
"error"
],
default: "info"
}
});
//#endregion
//#region ../../packages/components/result/src/result.vue?vue&type=script&setup=true&lang.ts
var result_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElResult",
__name: "result",
props: resultProps,
setup(__props) {
const props = __props;
const ns = useNamespace("result");
const resultIcon = (0, vue.computed)(() => {
const icon = props.icon;
const iconClass = icon && IconMap[icon] ? IconMap[icon] : "icon-info";
return {
class: iconClass,
component: IconComponentMap[iconClass] || IconComponentMap["icon-info"]
};
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()) }, [
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("icon")) }, [(0, vue.renderSlot)(_ctx.$slots, "icon", {}, () => [resultIcon.value.component ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(resultIcon.value.component), {
key: 0,
class: (0, vue.normalizeClass)(resultIcon.value.class)
}, null, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true)])], 2),
__props.title || _ctx.$slots.title ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("title"))
}, [(0, vue.renderSlot)(_ctx.$slots, "title", {}, () => [(0, vue.createElementVNode)("p", null, (0, vue.toDisplayString)(__props.title), 1)])], 2)) : (0, vue.createCommentVNode)("v-if", true),
__props.subTitle || _ctx.$slots["sub-title"] ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("subtitle"))
}, [(0, vue.renderSlot)(_ctx.$slots, "sub-title", {}, () => [(0, vue.createElementVNode)("p", null, (0, vue.toDisplayString)(__props.subTitle), 1)])], 2)) : (0, vue.createCommentVNode)("v-if", true),
_ctx.$slots.extra ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 2,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("extra"))
}, [(0, vue.renderSlot)(_ctx.$slots, "extra")], 2)) : (0, vue.createCommentVNode)("v-if", true)
], 2);
};
}
});
//#endregion
//#region ../../packages/components/result/src/result.vue
var result_default = result_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/result/index.ts
const ElResult = withInstall(result_default);
//#endregion
//#region ../../node_modules/.pnpm/memoize-one@6.0.0/node_modules/memoize-one/dist/memoize-one.esm.js
var safeIsNaN = Number.isNaN || function ponyfill(value) {
return typeof value === "number" && value !== value;
};
function isEqual(first, second) {
if (first === second) return true;
if (safeIsNaN(first) && safeIsNaN(second)) return true;
return false;
}
function areInputsEqual(newInputs, lastInputs) {
if (newInputs.length !== lastInputs.length) return false;
for (var i = 0; i < newInputs.length; i++) if (!isEqual(newInputs[i], lastInputs[i])) return false;
return true;
}
function memoizeOne(resultFn, isEqual) {
if (isEqual === void 0) isEqual = areInputsEqual;
var cache = null;
function memoized() {
var newArgs = [];
for (var _i = 0; _i < arguments.length; _i++) newArgs[_i] = arguments[_i];
if (cache && cache.lastThis === this && isEqual(newArgs, cache.lastArgs)) return cache.lastResult;
var lastResult = resultFn.apply(this, newArgs);
cache = {
lastResult,
lastArgs: newArgs,
lastThis: this
};
return lastResult;
}
memoized.clear = function clear() {
cache = null;
};
return memoized;
}
//#endregion
//#region ../../packages/components/virtual-list/src/hooks/use-cache.ts
const useCache = () => {
const props = (0, vue.getCurrentInstance)().proxy.$props;
return (0, vue.computed)(() => {
const _getItemStyleCache = (_, __, ___) => ({});
return props.perfMode ? memoize(_getItemStyleCache) : memoizeOne(_getItemStyleCache);
});
};
//#endregion
//#region ../../packages/components/virtual-list/src/defaults.ts
const DEFAULT_DYNAMIC_LIST_ITEM_SIZE = 50;
const ITEM_RENDER_EVT = "itemRendered";
const SCROLL_EVT = "scroll";
const FORWARD = "forward";
const BACKWARD = "backward";
const AUTO_ALIGNMENT = "auto";
const SMART_ALIGNMENT = "smart";
const START_ALIGNMENT = "start";
const CENTERED_ALIGNMENT = "center";
const END_ALIGNMENT = "end";
const HORIZONTAL = "horizontal";
const VERTICAL = "vertical";
const LTR = "ltr";
const RTL = "rtl";
const RTL_OFFSET_NAG = "negative";
const RTL_OFFSET_POS_ASC = "positive-ascending";
const RTL_OFFSET_POS_DESC = "positive-descending";
const ScrollbarSizeKey = {
[HORIZONTAL]: "height",
[VERTICAL]: "width"
};
const ScrollbarDirKey = {
[HORIZONTAL]: "left",
[VERTICAL]: "top"
};
const SCROLLBAR_MIN_SIZE = 20;
//#endregion
//#region ../../packages/components/virtual-list/src/hooks/use-wheel.ts
const useWheel = ({ atEndEdge, atStartEdge, layout }, onWheelDelta) => {
let frameHandle;
let offset = 0;
const hasReachedEdge = (offset) => {
return offset < 0 && atStartEdge.value || offset > 0 && atEndEdge.value;
};
const onWheel = (e) => {
cAF(frameHandle);
let { deltaX, deltaY } = e;
if (e.shiftKey && deltaY !== 0) {
deltaX = deltaY;
deltaY = 0;
}
const newOffset = layout.value === HORIZONTAL ? deltaX : deltaY;
if (hasReachedEdge(newOffset)) return;
offset += newOffset;
if (!isFirefox() && newOffset !== 0) e.preventDefault();
frameHandle = rAF(() => {
onWheelDelta(offset);
offset = 0;
});
};
return {
hasReachedEdge,
onWheel
};
};
//#endregion
//#region ../../packages/components/virtual-list/src/props.ts
const itemSize$1 = buildProp({
type: definePropType([Number, Function]),
required: true
});
const estimatedItemSize = buildProp({ type: Number });
const cache = buildProp({
type: Number,
default: 2
});
const direction = buildProp({
type: String,
values: ["ltr", "rtl"],
default: "ltr"
});
const initScrollOffset = buildProp({
type: Number,
default: 0
});
const total = buildProp({
type: Number,
required: true
});
const layout = buildProp({
type: String,
values: ["horizontal", "vertical"],
default: VERTICAL
});
const virtualizedProps = buildProps({
className: {
type: String,
default: ""
},
containerElement: {
type: definePropType([String, Object]),
default: "div"
},
data: {
type: definePropType(Array),
default: () => mutable([])
},
direction,
height: {
type: [String, Number],
required: true
},
innerElement: {
type: [String, Object],
default: "div"
},
innerProps: {
type: definePropType(Object),
default: () => ({})
},
style: { type: definePropType([
Object,
String,
Array
]) },
useIsScrolling: Boolean,
width: {
type: [Number, String],
required: false
},
perfMode: {
type: Boolean,
default: true
},
scrollbarAlwaysOn: Boolean
});
const virtualizedListProps = buildProps({
cache,
estimatedItemSize,
layout,
initScrollOffset,
total,
itemSize: itemSize$1,
...virtualizedProps
});
const scrollbarSize = {
type: Number,
default: 6
};
const startGap = {
type: Number,
default: 0
};
const endGap = {
type: Number,
default: 2
};
const virtualizedGridProps = buildProps({
columnCache: cache,
columnWidth: itemSize$1,
estimatedColumnWidth: estimatedItemSize,
estimatedRowHeight: estimatedItemSize,
initScrollLeft: initScrollOffset,
initScrollTop: initScrollOffset,
itemKey: {
type: definePropType(Function),
default: ({ columnIndex, rowIndex }) => `${rowIndex}:${columnIndex}`
},
rowCache: cache,
rowHeight: itemSize$1,
totalColumn: total,
totalRow: total,
hScrollbarSize: scrollbarSize,
vScrollbarSize: scrollbarSize,
scrollbarStartGap: startGap,
scrollbarEndGap: endGap,
role: String,
...virtualizedProps
});
const virtualizedScrollbarProps = buildProps({
alwaysOn: Boolean,
class: String,
layout,
total,
ratio: {
type: Number,
required: true
},
clientSize: {
type: Number,
required: true
},
scrollFrom: {
type: Number,
required: true
},
scrollbarSize,
startGap,
endGap,
visible: Boolean
});
//#endregion
//#region ../../packages/components/virtual-list/src/utils.ts
const getScrollDir = (prev, cur) => prev < cur ? FORWARD : BACKWARD;
const isHorizontal = (dir) => dir === LTR || dir === RTL || dir === HORIZONTAL;
const isRTL = (dir) => dir === RTL;
let cachedRTLResult = null;
function getRTLOffsetType(recalculate = false) {
if (cachedRTLResult === null || recalculate) {
const outerDiv = document.createElement("div");
const outerStyle = outerDiv.style;
outerStyle.width = "50px";
outerStyle.height = "50px";
outerStyle.overflow = "scroll";
outerStyle.direction = "rtl";
const innerDiv = document.createElement("div");
const innerStyle = innerDiv.style;
innerStyle.width = "100px";
innerStyle.height = "100px";
outerDiv.appendChild(innerDiv);
document.body.appendChild(outerDiv);
if (outerDiv.scrollLeft > 0) cachedRTLResult = RTL_OFFSET_POS_DESC;
else {
outerDiv.scrollLeft = 1;
if (outerDiv.scrollLeft === 0) cachedRTLResult = RTL_OFFSET_NAG;
else cachedRTLResult = RTL_OFFSET_POS_ASC;
}
document.body.removeChild(outerDiv);
return cachedRTLResult;
}
return cachedRTLResult;
}
function renderThumbStyle$1({ move, size, bar }, layout) {
const style = {};
const translate = `translate${bar.axis}(${move}px)`;
style[bar.size] = size;
style.transform = translate;
if (layout === "horizontal") style.height = "100%";
else style.width = "100%";
return style;
}
//#endregion
//#region ../../packages/components/virtual-list/src/components/scrollbar.ts
const ScrollBar = (0, vue.defineComponent)({
name: "ElVirtualScrollBar",
props: virtualizedScrollbarProps,
emits: [
"scroll",
"start-move",
"stop-move"
],
setup(props, { emit }) {
const GAP = (0, vue.computed)(() => props.startGap + props.endGap);
const nsVirtualScrollbar = useNamespace("virtual-scrollbar");
const nsScrollbar = useNamespace("scrollbar");
const trackRef = (0, vue.ref)();
const thumbRef = (0, vue.ref)();
let frameHandle = null;
let onselectstartStore = null;
const state = (0, vue.reactive)({
isDragging: false,
traveled: 0
});
const bar = (0, vue.computed)(() => BAR_MAP[props.layout]);
const trackSize = (0, vue.computed)(() => props.clientSize - (0, vue.unref)(GAP));
const trackStyle = (0, vue.computed)(() => ({
position: "absolute",
width: `${HORIZONTAL === props.layout ? trackSize.value : props.scrollbarSize}px`,
height: `${HORIZONTAL === props.layout ? props.scrollbarSize : trackSize.value}px`,
[ScrollbarDirKey[props.layout]]: "2px",
right: "2px",
bottom: "2px",
borderRadius: "4px"
}));
const thumbSize = (0, vue.computed)(() => {
const ratio = props.ratio;
if (ratio >= 100) return Number.POSITIVE_INFINITY;
if (ratio >= 50) return ratio * trackSize.value / 100;
const SCROLLBAR_MAX_SIZE = trackSize.value / 3;
return Math.floor(Math.min(Math.max(ratio * trackSize.value / 100, SCROLLBAR_MIN_SIZE), SCROLLBAR_MAX_SIZE));
});
const thumbStyle = (0, vue.computed)(() => {
if (!Number.isFinite(thumbSize.value)) return { display: "none" };
const thumb = `${thumbSize.value}px`;
return renderThumbStyle$1({
bar: bar.value,
size: thumb,
move: state.traveled
}, props.layout);
});
const totalSteps = (0, vue.computed)(() => Math.ceil(props.clientSize - thumbSize.value - (0, vue.unref)(GAP)));
const attachEvents = () => {
window.addEventListener("mousemove", onMouseMove);
window.addEventListener("mouseup", onMouseUp);
const thumbEl = (0, vue.unref)(thumbRef);
if (!thumbEl) return;
onselectstartStore = document.onselectstart;
document.onselectstart = () => false;
thumbEl.addEventListener("touchmove", onMouseMove, { passive: true });
thumbEl.addEventListener("touchend", onMouseUp);
};
const detachEvents = () => {
window.removeEventListener("mousemove", onMouseMove);
window.removeEventListener("mouseup", onMouseUp);
document.onselectstart = onselectstartStore;
onselectstartStore = null;
const thumbEl = (0, vue.unref)(thumbRef);
if (!thumbEl) return;
thumbEl.removeEventListener("touchmove", onMouseMove);
thumbEl.removeEventListener("touchend", onMouseUp);
};
const onThumbMouseDown = (e) => {
e.stopImmediatePropagation();
if (e.ctrlKey || [1, 2].includes(e.button)) return;
state.isDragging = true;
state[bar.value.axis] = e.currentTarget[bar.value.offset] - (e[bar.value.client] - e.currentTarget.getBoundingClientRect()[bar.value.direction]);
emit("start-move");
attachEvents();
};
const onMouseUp = () => {
state.isDragging = false;
state[bar.value.axis] = 0;
emit("stop-move");
detachEvents();
};
const onMouseMove = (e) => {
const { isDragging } = state;
if (!isDragging) return;
if (!thumbRef.value || !trackRef.value) return;
const prevPage = state[bar.value.axis];
if (!prevPage) return;
cAF(frameHandle);
/**
* +--------------+ +--------------+
* | - <--------- thumb.offsetTop | |
* | |+| <--+ | |
* | - | | |
* | Content | | | |
* | | | | |
* | | | | |
* | | | | -
* | | +--> | |+|
* | | | -
* +--------------+ +--------------+
*/
const distance = (trackRef.value.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]) * -1 - (thumbRef.value[bar.value.offset] - prevPage);
frameHandle = rAF(() => {
state.traveled = Math.max(0, Math.min(distance, totalSteps.value));
emit("scroll", distance, totalSteps.value);
});
};
const clickTrackHandler = (e) => {
const distance = Math.abs(e.target.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]) - thumbRef.value[bar.value.offset] / 2;
state.traveled = Math.max(0, Math.min(distance, totalSteps.value));
emit("scroll", distance, totalSteps.value);
};
(0, vue.watch)(() => props.scrollFrom, (v) => {
if (state.isDragging) return;
/**
* this is simply mapping the current scrollbar offset
*
* formula 1:
* v = scrollOffset / (estimatedTotalSize - clientSize)
* traveled = v * (clientSize - thumbSize - GAP) --> v * totalSteps
*
* formula 2:
* traveled = (v * clientSize) / (clientSize / totalSteps) --> (v * clientSize) * (totalSteps / clientSize) --> v * totalSteps
*/
state.traveled = Math.ceil(v * totalSteps.value);
});
(0, vue.onBeforeUnmount)(() => {
detachEvents();
});
return () => {
return (0, vue.h)("div", {
role: "presentation",
ref: trackRef,
class: [
nsVirtualScrollbar.b(),
props.class,
(props.alwaysOn || state.isDragging) && "always-on"
],
style: trackStyle.value,
onMousedown: (0, vue.withModifiers)(clickTrackHandler, ["stop", "prevent"]),
onTouchstartPrevent: onThumbMouseDown
}, (0, vue.h)("div", {
ref: thumbRef,
class: nsScrollbar.e("thumb"),
style: thumbStyle.value,
onMousedown: onThumbMouseDown
}, []));
};
}
});
//#endregion
//#region ../../packages/components/virtual-list/src/builders/build-list.ts
const createList = ({ name, getOffset, getItemSize, getItemOffset, getEstimatedTotalSize, getStartIndexForOffset, getStopIndexForStartIndex, initCache, clearCache, validateProps }) => {
return (0, vue.defineComponent)({
name: name ?? "ElVirtualList",
props: virtualizedListProps,
emits: [ITEM_RENDER_EVT, SCROLL_EVT],
setup(props, { emit, expose }) {
validateProps(props);
const instance = (0, vue.getCurrentInstance)();
const ns = useNamespace("vl");
const dynamicSizeCache = (0, vue.ref)(initCache(props, instance));
const getItemStyleCache = useCache();
const windowRef = (0, vue.ref)();
const innerRef = (0, vue.ref)();
const scrollbarRef = (0, vue.ref)();
const states = (0, vue.ref)({
isScrolling: false,
scrollDir: "forward",
scrollOffset: isNumber(props.initScrollOffset) ? props.initScrollOffset : 0,
updateRequested: false,
isScrollbarDragging: false,
scrollbarAlwaysOn: props.scrollbarAlwaysOn
});
const itemsToRender = (0, vue.computed)(() => {
const { total, cache } = props;
const { isScrolling, scrollDir, scrollOffset } = (0, vue.unref)(states);
if (total === 0) return [
0,
0,
0,
0
];
const startIndex = getStartIndexForOffset(props, scrollOffset, (0, vue.unref)(dynamicSizeCache));
const stopIndex = getStopIndexForStartIndex(props, startIndex, scrollOffset, (0, vue.unref)(dynamicSizeCache));
const cacheBackward = !isScrolling || scrollDir === BACKWARD ? Math.max(1, cache) : 1;
const cacheForward = !isScrolling || scrollDir === FORWARD ? Math.max(1, cache) : 1;
return [
Math.max(0, startIndex - cacheBackward),
Math.max(0, Math.min(total - 1, stopIndex + cacheForward)),
startIndex,
stopIndex
];
});
const estimatedTotalSize = (0, vue.computed)(() => getEstimatedTotalSize(props, (0, vue.unref)(dynamicSizeCache)));
const _isHorizontal = (0, vue.computed)(() => isHorizontal(props.layout));
const windowStyle = (0, vue.computed)(() => [
{
position: "relative",
[`overflow-${_isHorizontal.value ? "x" : "y"}`]: "scroll",
WebkitOverflowScrolling: "touch",
willChange: "transform"
},
{
direction: props.direction,
height: isNumber(props.height) ? `${props.height}px` : props.height,
width: isNumber(props.width) ? `${props.width}px` : props.width
},
props.style
]);
const innerStyle = (0, vue.computed)(() => {
const size = (0, vue.unref)(estimatedTotalSize);
const horizontal = (0, vue.unref)(_isHorizontal);
return {
height: horizontal ? "100%" : `${size}px`,
pointerEvents: (0, vue.unref)(states).isScrolling ? "none" : void 0,
width: horizontal ? `${size}px` : "100%",
margin: 0,
boxSizing: "border-box"
};
});
const clientSize = (0, vue.computed)(() => _isHorizontal.value ? props.width : props.height);
const { onWheel } = useWheel({
atStartEdge: (0, vue.computed)(() => states.value.scrollOffset <= 0),
atEndEdge: (0, vue.computed)(() => states.value.scrollOffset >= estimatedTotalSize.value),
layout: (0, vue.computed)(() => props.layout)
}, (offset) => {
scrollbarRef.value.onMouseUp?.();
scrollTo(Math.min(states.value.scrollOffset + offset, estimatedTotalSize.value - clientSize.value));
});
useEventListener(windowRef, "wheel", onWheel, { passive: false });
const emitEvents = () => {
const { total } = props;
if (total > 0) {
const [cacheStart, cacheEnd, visibleStart, visibleEnd] = (0, vue.unref)(itemsToRender);
emit(ITEM_RENDER_EVT, cacheStart, cacheEnd, visibleStart, visibleEnd);
}
const { scrollDir, scrollOffset, updateRequested } = (0, vue.unref)(states);
emit(SCROLL_EVT, scrollDir, scrollOffset, updateRequested);
};
const scrollVertically = (e) => {
const { clientHeight, scrollHeight, scrollTop } = e.currentTarget;
const _states = (0, vue.unref)(states);
if (_states.scrollOffset === scrollTop) return;
const scrollOffset = Math.max(0, Math.min(scrollTop, scrollHeight - clientHeight));
states.value = {
..._states,
isScrolling: true,
scrollDir: getScrollDir(_states.scrollOffset, scrollOffset),
scrollOffset,
updateRequested: false
};
(0, vue.nextTick)(resetIsScrolling);
};
const scrollHorizontally = (e) => {
const { clientWidth, scrollLeft, scrollWidth } = e.currentTarget;
const _states = (0, vue.unref)(states);
if (_states.scrollOffset === scrollLeft) return;
const { direction } = props;
let scrollOffset = scrollLeft;
if (direction === RTL) switch (getRTLOffsetType()) {
case RTL_OFFSET_NAG:
scrollOffset = -scrollLeft;
break;
case RTL_OFFSET_POS_DESC:
scrollOffset = scrollWidth - clientWidth - scrollLeft;
break;
}
scrollOffset = Math.max(0, Math.min(scrollOffset, scrollWidth - clientWidth));
states.value = {
..._states,
isScrolling: true,
scrollDir: getScrollDir(_states.scrollOffset, scrollOffset),
scrollOffset,
updateRequested: false
};
(0, vue.nextTick)(resetIsScrolling);
};
const onScroll = (e) => {
(0, vue.unref)(_isHorizontal) ? scrollHorizontally(e) : scrollVertically(e);
emitEvents();
};
const onScrollbarScroll = (distanceToGo, totalSteps) => {
const offset = (estimatedTotalSize.value - clientSize.value) / totalSteps * distanceToGo;
scrollTo(Math.min(estimatedTotalSize.value - clientSize.value, offset));
};
const scrollTo = (offset) => {
offset = Math.max(offset, 0);
if (offset === (0, vue.unref)(states).scrollOffset) return;
states.value = {
...(0, vue.unref)(states),
scrollOffset: offset,
scrollDir: getScrollDir((0, vue.unref)(states).scrollOffset, offset),
updateRequested: true
};
(0, vue.nextTick)(resetIsScrolling);
};
const scrollToItem = (idx, alignment = AUTO_ALIGNMENT) => {
const { scrollOffset } = (0, vue.unref)(states);
idx = Math.max(0, Math.min(idx, props.total - 1));
scrollTo(getOffset(props, idx, alignment, scrollOffset, (0, vue.unref)(dynamicSizeCache)));
};
const getItemStyle = (idx) => {
const { direction, itemSize, layout } = props;
const itemStyleCache = getItemStyleCache.value(clearCache && itemSize, clearCache && layout, clearCache && direction);
let style;
if (hasOwn(itemStyleCache, String(idx))) style = itemStyleCache[idx];
else {
const offset = getItemOffset(props, idx, (0, vue.unref)(dynamicSizeCache));
const size = getItemSize(props, idx, (0, vue.unref)(dynamicSizeCache));
const horizontal = (0, vue.unref)(_isHorizontal);
const isRtl = direction === RTL;
const offsetHorizontal = horizontal ? offset : 0;
itemStyleCache[idx] = style = {
position: "absolute",
left: isRtl ? void 0 : `${offsetHorizontal}px`,
right: isRtl ? `${offsetHorizontal}px` : void 0,
top: !horizontal ? `${offset}px` : 0,
height: !horizontal ? `${size}px` : "100%",
width: horizontal ? `${size}px` : "100%"
};
}
return style;
};
const resetIsScrolling = () => {
states.value.isScrolling = false;
(0, vue.nextTick)(() => {
getItemStyleCache.value(-1, null, null);
});
};
const resetScrollTop = () => {
const window = windowRef.value;
if (window) window.scrollTop = 0;
};
(0, vue.onMounted)(() => {
if (!isClient) return;
const { initScrollOffset } = props;
const windowElement = (0, vue.unref)(windowRef);
if (isNumber(initScrollOffset) && windowElement) if ((0, vue.unref)(_isHorizontal)) windowElement.scrollLeft = initScrollOffset;
else windowElement.scrollTop = initScrollOffset;
emitEvents();
});
(0, vue.onUpdated)(() => {
const { direction, layout } = props;
const { scrollOffset, updateRequested } = (0, vue.unref)(states);
const windowElement = (0, vue.unref)(windowRef);
if (updateRequested && windowElement) if (layout === HORIZONTAL) if (direction === RTL) switch (getRTLOffsetType()) {
case RTL_OFFSET_NAG:
windowElement.scrollLeft = -scrollOffset;
break;
case RTL_OFFSET_POS_ASC:
windowElement.scrollLeft = scrollOffset;
break;
default: {
const { clientWidth, scrollWidth } = windowElement;
windowElement.scrollLeft = scrollWidth - clientWidth - scrollOffset;
break;
}
}
else windowElement.scrollLeft = scrollOffset;
else windowElement.scrollTop = scrollOffset;
});
(0, vue.onActivated)(() => {
(0, vue.unref)(windowRef).scrollTop = (0, vue.unref)(states).scrollOffset;
});
const api = {
ns,
clientSize,
estimatedTotalSize,
windowStyle,
windowRef,
innerRef,
innerStyle,
itemsToRender,
scrollbarRef,
states,
getItemStyle,
onScroll,
onScrollbarScroll,
onWheel,
scrollTo,
scrollToItem,
resetScrollTop
};
expose({
windowRef,
innerRef,
getItemStyleCache,
scrollTo,
scrollToItem,
resetScrollTop,
states
});
return api;
},
render(ctx) {
const { $slots, className, clientSize, containerElement, data, getItemStyle, innerElement, itemsToRender, innerStyle, layout, total, onScroll, onScrollbarScroll, states, useIsScrolling, windowStyle, ns } = ctx;
const [start, end] = itemsToRender;
const Container = (0, vue.resolveDynamicComponent)(containerElement);
const Inner = (0, vue.resolveDynamicComponent)(innerElement);
const children = [];
if (total > 0) for (let i = start; i <= end; i++) children.push((0, vue.h)(vue.Fragment, { key: i }, $slots.default?.({
data,
index: i,
isScrolling: useIsScrolling ? states.isScrolling : void 0,
style: getItemStyle(i)
})));
const InnerNode = [(0, vue.h)(Inner, (0, vue.mergeProps)(ctx.innerProps, {
style: innerStyle,
ref: "innerRef"
}), !isString(Inner) ? { default: () => children } : children)];
const scrollbar = (0, vue.h)(ScrollBar, {
ref: "scrollbarRef",
clientSize,
layout,
onScroll: onScrollbarScroll,
ratio: clientSize * 100 / this.estimatedTotalSize,
scrollFrom: states.scrollOffset / (this.estimatedTotalSize - clientSize),
total,
alwaysOn: states.scrollbarAlwaysOn
});
const listContainer = (0, vue.h)(Container, {
class: [ns.e("window"), className],
style: windowStyle,
onScroll,
ref: "windowRef",
key: 0
}, !isString(Container) ? { default: () => [InnerNode] } : [InnerNode]);
return (0, vue.h)("div", {
key: 0,
class: [ns.e("wrapper"), states.scrollbarAlwaysOn ? "always-on" : ""]
}, [listContainer, scrollbar]);
}
});
};
//#endregion
//#region ../../packages/components/virtual-list/src/components/fixed-size-list.ts
const FixedSizeList = createList({
name: "ElFixedSizeList",
getItemOffset: ({ itemSize }, index) => index * itemSize,
getItemSize: ({ itemSize }) => itemSize,
getEstimatedTotalSize: ({ total, itemSize }) => itemSize * total,
getOffset: ({ height, total, itemSize, layout, width }, index, alignment, scrollOffset) => {
const size = isHorizontal(layout) ? width : height;
const lastItemOffset = Math.max(0, total * itemSize - size);
const maxOffset = Math.min(lastItemOffset, index * itemSize);
const minOffset = Math.max(0, (index + 1) * itemSize - size);
if (alignment === SMART_ALIGNMENT) if (scrollOffset >= minOffset - size && scrollOffset <= maxOffset + size) alignment = AUTO_ALIGNMENT;
else alignment = CENTERED_ALIGNMENT;
switch (alignment) {
case START_ALIGNMENT: return maxOffset;
case END_ALIGNMENT: return minOffset;
case CENTERED_ALIGNMENT: {
const middleOffset = Math.round(minOffset + (maxOffset - minOffset) / 2);
if (middleOffset < Math.ceil(size / 2)) return 0;
else if (middleOffset > lastItemOffset + Math.floor(size / 2)) return lastItemOffset;
else return middleOffset;
}
case AUTO_ALIGNMENT:
default: if (scrollOffset >= minOffset && scrollOffset <= maxOffset) return scrollOffset;
else if (scrollOffset < minOffset) return minOffset;
else return maxOffset;
}
},
getStartIndexForOffset: ({ total, itemSize }, offset) => Math.max(0, Math.min(total - 1, Math.floor(offset / itemSize))),
getStopIndexForStartIndex: ({ height, total, itemSize, layout, width }, startIndex, scrollOffset) => {
const offset = startIndex * itemSize;
const size = isHorizontal(layout) ? width : height;
const numVisibleItems = Math.ceil((size + scrollOffset - offset) / itemSize);
return Math.max(0, Math.min(total - 1, startIndex + numVisibleItems - 1));
},
initCache() {},
clearCache: true,
validateProps() {}
});
//#endregion
//#region ../../packages/components/virtual-list/src/components/dynamic-size-list.ts
const getItemFromCache$1 = (props, index, listCache) => {
const { itemSize } = props;
const { items, lastVisitedIndex } = listCache;
if (index > lastVisitedIndex) {
let offset = 0;
if (lastVisitedIndex >= 0) {
const item = items[lastVisitedIndex];
offset = item.offset + item.size;
}
for (let i = lastVisitedIndex + 1; i <= index; i++) {
const size = itemSize(i);
items[i] = {
offset,
size
};
offset += size;
}
listCache.lastVisitedIndex = index;
}
return items[index];
};
const findItem$1 = (props, listCache, offset) => {
const { items, lastVisitedIndex } = listCache;
if ((lastVisitedIndex > 0 ? items[lastVisitedIndex].offset : 0) >= offset) return bs$1(props, listCache, 0, lastVisitedIndex, offset);
return es$1(props, listCache, Math.max(0, lastVisitedIndex), offset);
};
const bs$1 = (props, listCache, low, high, offset) => {
while (low <= high) {
const mid = low + Math.floor((high - low) / 2);
const currentOffset = getItemFromCache$1(props, mid, listCache).offset;
if (currentOffset === offset) return mid;
else if (currentOffset < offset) low = mid + 1;
else if (currentOffset > offset) high = mid - 1;
}
return Math.max(0, low - 1);
};
const es$1 = (props, listCache, index, offset) => {
const { total } = props;
let exponent = 1;
while (index < total && getItemFromCache$1(props, index, listCache).offset < offset) {
index += exponent;
exponent *= 2;
}
return bs$1(props, listCache, Math.floor(index / 2), Math.min(index, total - 1), offset);
};
const getEstimatedTotalSize = ({ total }, { items, estimatedItemSize, lastVisitedIndex }) => {
let totalSizeOfMeasuredItems = 0;
if (lastVisitedIndex >= total) lastVisitedIndex = total - 1;
if (lastVisitedIndex >= 0) {
const item = items[lastVisitedIndex];
totalSizeOfMeasuredItems = item.offset + item.size;
}
const totalSizeOfUnmeasuredItems = (total - lastVisitedIndex - 1) * estimatedItemSize;
return totalSizeOfMeasuredItems + totalSizeOfUnmeasuredItems;
};
const DynamicSizeList = createList({
name: "ElDynamicSizeList",
getItemOffset: (props, index, listCache) => getItemFromCache$1(props, index, listCache).offset,
getItemSize: (_, index, { items }) => items[index].size,
getEstimatedTotalSize,
getOffset: (props, index, alignment, scrollOffset, listCache) => {
const { height, layout, width } = props;
const size = isHorizontal(layout) ? width : height;
const item = getItemFromCache$1(props, index, listCache);
const estimatedTotalSize = getEstimatedTotalSize(props, listCache);
const maxOffset = Math.max(0, Math.min(estimatedTotalSize - size, item.offset));
const minOffset = Math.max(0, item.offset - size + item.size);
if (alignment === SMART_ALIGNMENT) if (scrollOffset >= minOffset - size && scrollOffset <= maxOffset + size) alignment = AUTO_ALIGNMENT;
else alignment = CENTERED_ALIGNMENT;
switch (alignment) {
case START_ALIGNMENT: return maxOffset;
case END_ALIGNMENT: return minOffset;
case CENTERED_ALIGNMENT: return Math.round(minOffset + (maxOffset - minOffset) / 2);
case AUTO_ALIGNMENT:
default: if (scrollOffset >= minOffset && scrollOffset <= maxOffset) return scrollOffset;
else if (scrollOffset < minOffset) return minOffset;
else return maxOffset;
}
},
getStartIndexForOffset: (props, offset, listCache) => findItem$1(props, listCache, offset),
getStopIndexForStartIndex: (props, startIndex, scrollOffset, listCache) => {
const { height, total, layout, width } = props;
const size = isHorizontal(layout) ? width : height;
const item = getItemFromCache$1(props, startIndex, listCache);
const maxOffset = scrollOffset + size;
let offset = item.offset + item.size;
let stopIndex = startIndex;
while (stopIndex < total - 1 && offset < maxOffset) {
stopIndex++;
offset += getItemFromCache$1(props, stopIndex, listCache).size;
}
return stopIndex;
},
initCache({ estimatedItemSize = DEFAULT_DYNAMIC_LIST_ITEM_SIZE }, instance) {
const cache = {
items: {},
estimatedItemSize,
lastVisitedIndex: -1
};
cache.clearCacheAfterIndex = (index, forceUpdate = true) => {
cache.lastVisitedIndex = Math.min(cache.lastVisitedIndex, index - 1);
instance.exposed?.getItemStyleCache(-1);
if (forceUpdate) instance.proxy?.$forceUpdate();
};
return cache;
},
clearCache: false,
validateProps: ({ itemSize }) => {}
});
//#endregion
//#region ../../packages/components/virtual-list/src/hooks/use-grid-wheel.ts
const useGridWheel = ({ atXEndEdge, atXStartEdge, atYEndEdge, atYStartEdge }, onWheelDelta) => {
let frameHandle = null;
let xOffset = 0;
let yOffset = 0;
const hasReachedEdge = (x, y) => {
const xEdgeReached = x < 0 && atXStartEdge.value || x > 0 && atXEndEdge.value;
const yEdgeReached = y < 0 && atYStartEdge.value || y > 0 && atYEndEdge.value;
return xEdgeReached || yEdgeReached;
};
const onWheel = (e) => {
cAF(frameHandle);
let x = e.deltaX;
let y = e.deltaY;
if (Math.abs(x) > Math.abs(y)) y = 0;
else x = 0;
if (e.shiftKey && y !== 0) {
x = y;
y = 0;
}
if (hasReachedEdge(x, y)) {
if (e.deltaX !== 0 && x === 0) e.preventDefault();
return;
}
xOffset += x;
yOffset += y;
e.preventDefault();
frameHandle = rAF(() => {
onWheelDelta(xOffset, yOffset);
xOffset = 0;
yOffset = 0;
});
};
return {
hasReachedEdge,
onWheel
};
};
//#endregion
//#region ../../packages/components/virtual-list/src/hooks/use-grid-touch.ts
const useGridTouch = (windowRef, states, scrollTo, estimatedTotalWidth, estimatedTotalHeight, parsedWidth, parsedHeight) => {
const touchStartX = (0, vue.ref)(0);
const touchStartY = (0, vue.ref)(0);
let frameHandle;
let deltaX = 0;
let deltaY = 0;
const handleTouchStart = (event) => {
cAF(frameHandle);
touchStartX.value = event.touches[0].clientX;
touchStartY.value = event.touches[0].clientY;
deltaX = 0;
deltaY = 0;
};
const handleTouchMove = (event) => {
event.preventDefault();
cAF(frameHandle);
deltaX += touchStartX.value - event.touches[0].clientX;
deltaY += touchStartY.value - event.touches[0].clientY;
touchStartX.value = event.touches[0].clientX;
touchStartY.value = event.touches[0].clientY;
frameHandle = rAF(() => {
const maxScrollLeft = estimatedTotalWidth.value - (0, vue.unref)(parsedWidth);
const maxScrollTop = estimatedTotalHeight.value - (0, vue.unref)(parsedHeight);
scrollTo({
scrollLeft: Math.min(states.value.scrollLeft + deltaX, maxScrollLeft),
scrollTop: Math.min(states.value.scrollTop + deltaY, maxScrollTop)
});
deltaX = 0;
deltaY = 0;
});
};
useEventListener(windowRef, "touchstart", handleTouchStart, { passive: true });
useEventListener(windowRef, "touchmove", handleTouchMove, { passive: false });
return {
touchStartX,
touchStartY,
handleTouchStart,
handleTouchMove
};
};
//#endregion
//#region ../../packages/components/virtual-list/src/builders/build-grid.ts
const createGrid = ({ name, clearCache, getColumnPosition, getColumnStartIndexForOffset, getColumnStopIndexForStartIndex, getEstimatedTotalHeight, getEstimatedTotalWidth, getColumnOffset, getRowOffset, getRowPosition, getRowStartIndexForOffset, getRowStopIndexForStartIndex, initCache, injectToInstance, validateProps }) => {
return (0, vue.defineComponent)({
name: name ?? "ElVirtualList",
props: virtualizedGridProps,
emits: [ITEM_RENDER_EVT, SCROLL_EVT],
setup(props, { emit, expose, slots }) {
const ns = useNamespace("vl");
validateProps(props);
const instance = (0, vue.getCurrentInstance)();
const cache = (0, vue.ref)(initCache(props, instance));
injectToInstance?.(instance, cache);
const windowRef = (0, vue.ref)();
const hScrollbar = (0, vue.ref)();
const vScrollbar = (0, vue.ref)();
const innerRef = (0, vue.ref)();
const states = (0, vue.ref)({
isScrolling: false,
scrollLeft: isNumber(props.initScrollLeft) ? props.initScrollLeft : 0,
scrollTop: isNumber(props.initScrollTop) ? props.initScrollTop : 0,
updateRequested: false,
xAxisScrollDir: FORWARD,
yAxisScrollDir: FORWARD
});
const getItemStyleCache = useCache();
const parsedHeight = (0, vue.computed)(() => Number.parseInt(`${props.height}`, 10));
const parsedWidth = (0, vue.computed)(() => Number.parseInt(`${props.width}`, 10));
const columnsToRender = (0, vue.computed)(() => {
const { totalColumn, totalRow, columnCache } = props;
const { isScrolling, xAxisScrollDir, scrollLeft } = (0, vue.unref)(states);
if (totalColumn === 0 || totalRow === 0) return [
0,
0,
0,
0
];
const startIndex = getColumnStartIndexForOffset(props, scrollLeft, (0, vue.unref)(cache));
const stopIndex = getColumnStopIndexForStartIndex(props, startIndex, scrollLeft, (0, vue.unref)(cache));
const cacheBackward = !isScrolling || xAxisScrollDir === BACKWARD ? Math.max(1, columnCache) : 1;
const cacheForward = !isScrolling || xAxisScrollDir === FORWARD ? Math.max(1, columnCache) : 1;
return [
Math.max(0, startIndex - cacheBackward),
Math.max(0, Math.min(totalColumn - 1, stopIndex + cacheForward)),
startIndex,
stopIndex
];
});
const rowsToRender = (0, vue.computed)(() => {
const { totalColumn, totalRow, rowCache } = props;
const { isScrolling, yAxisScrollDir, scrollTop } = (0, vue.unref)(states);
if (totalColumn === 0 || totalRow === 0) return [
0,
0,
0,
0
];
const startIndex = getRowStartIndexForOffset(props, scrollTop, (0, vue.unref)(cache));
const stopIndex = getRowStopIndexForStartIndex(props, startIndex, scrollTop, (0, vue.unref)(cache));
const cacheBackward = !isScrolling || yAxisScrollDir === BACKWARD ? Math.max(1, rowCache) : 1;
const cacheForward = !isScrolling || yAxisScrollDir === FORWARD ? Math.max(1, rowCache) : 1;
return [
Math.max(0, startIndex - cacheBackward),
Math.max(0, Math.min(totalRow - 1, stopIndex + cacheForward)),
startIndex,
stopIndex
];
});
const estimatedTotalHeight = (0, vue.computed)(() => getEstimatedTotalHeight(props, (0, vue.unref)(cache)));
const estimatedTotalWidth = (0, vue.computed)(() => getEstimatedTotalWidth(props, (0, vue.unref)(cache)));
const windowStyle = (0, vue.computed)(() => [
{
position: "relative",
overflow: "hidden",
WebkitOverflowScrolling: "touch",
willChange: "transform"
},
{
direction: props.direction,
height: isNumber(props.height) ? `${props.height}px` : props.height,
width: isNumber(props.width) ? `${props.width}px` : props.width
},
props.style ?? {}
]);
const innerStyle = (0, vue.computed)(() => {
const width = `${(0, vue.unref)(estimatedTotalWidth)}px`;
return {
height: `${(0, vue.unref)(estimatedTotalHeight)}px`,
pointerEvents: (0, vue.unref)(states).isScrolling ? "none" : void 0,
width,
margin: 0,
boxSizing: "border-box"
};
});
const emitEvents = () => {
const { totalColumn, totalRow } = props;
if (totalColumn > 0 && totalRow > 0) {
const [columnCacheStart, columnCacheEnd, columnVisibleStart, columnVisibleEnd] = (0, vue.unref)(columnsToRender);
const [rowCacheStart, rowCacheEnd, rowVisibleStart, rowVisibleEnd] = (0, vue.unref)(rowsToRender);
emit(ITEM_RENDER_EVT, {
columnCacheStart,
columnCacheEnd,
rowCacheStart,
rowCacheEnd,
columnVisibleStart,
columnVisibleEnd,
rowVisibleStart,
rowVisibleEnd
});
}
const { scrollLeft, scrollTop, updateRequested, xAxisScrollDir, yAxisScrollDir } = (0, vue.unref)(states);
emit(SCROLL_EVT, {
xAxisScrollDir,
scrollLeft,
yAxisScrollDir,
scrollTop,
updateRequested
});
};
const onScroll = (e) => {
const { clientHeight, clientWidth, scrollHeight, scrollLeft, scrollTop, scrollWidth } = e.currentTarget;
const _states = (0, vue.unref)(states);
if (_states.scrollTop === scrollTop && _states.scrollLeft === scrollLeft) return;
let _scrollLeft = scrollLeft;
if (isRTL(props.direction)) switch (getRTLOffsetType()) {
case RTL_OFFSET_NAG:
_scrollLeft = -scrollLeft;
break;
case RTL_OFFSET_POS_DESC:
_scrollLeft = scrollWidth - clientWidth - scrollLeft;
break;
}
states.value = {
..._states,
isScrolling: true,
scrollLeft: _scrollLeft,
scrollTop: Math.max(0, Math.min(scrollTop, scrollHeight - clientHeight)),
updateRequested: true,
xAxisScrollDir: getScrollDir(_states.scrollLeft, _scrollLeft),
yAxisScrollDir: getScrollDir(_states.scrollTop, scrollTop)
};
(0, vue.nextTick)(() => resetIsScrolling());
onUpdated();
emitEvents();
};
const onVerticalScroll = (distance, totalSteps) => {
const height = (0, vue.unref)(parsedHeight);
const offset = (estimatedTotalHeight.value - height) / totalSteps * distance;
scrollTo({ scrollTop: Math.min(estimatedTotalHeight.value - height, offset) });
};
const onHorizontalScroll = (distance, totalSteps) => {
const width = (0, vue.unref)(parsedWidth);
const offset = (estimatedTotalWidth.value - width) / totalSteps * distance;
scrollTo({ scrollLeft: Math.min(estimatedTotalWidth.value - width, offset) });
};
const { onWheel } = useGridWheel({
atXStartEdge: (0, vue.computed)(() => states.value.scrollLeft <= 0),
atXEndEdge: (0, vue.computed)(() => states.value.scrollLeft >= estimatedTotalWidth.value - (0, vue.unref)(parsedWidth)),
atYStartEdge: (0, vue.computed)(() => states.value.scrollTop <= 0),
atYEndEdge: (0, vue.computed)(() => states.value.scrollTop >= estimatedTotalHeight.value - (0, vue.unref)(parsedHeight))
}, (x, y) => {
hScrollbar.value?.onMouseUp?.();
vScrollbar.value?.onMouseUp?.();
const width = (0, vue.unref)(parsedWidth);
const height = (0, vue.unref)(parsedHeight);
scrollTo({
scrollLeft: Math.min(states.value.scrollLeft + x, estimatedTotalWidth.value - width),
scrollTop: Math.min(states.value.scrollTop + y, estimatedTotalHeight.value - height)
});
});
useEventListener(windowRef, "wheel", onWheel, { passive: false });
const scrollTo = ({ scrollLeft = states.value.scrollLeft, scrollTop = states.value.scrollTop }) => {
scrollLeft = Math.max(scrollLeft, 0);
scrollTop = Math.max(scrollTop, 0);
const _states = (0, vue.unref)(states);
if (scrollTop === _states.scrollTop && scrollLeft === _states.scrollLeft) return;
states.value = {
..._states,
xAxisScrollDir: getScrollDir(_states.scrollLeft, scrollLeft),
yAxisScrollDir: getScrollDir(_states.scrollTop, scrollTop),
scrollLeft,
scrollTop,
updateRequested: true
};
(0, vue.nextTick)(() => resetIsScrolling());
onUpdated();
emitEvents();
};
const { touchStartX, touchStartY, handleTouchStart, handleTouchMove } = useGridTouch(windowRef, states, scrollTo, estimatedTotalWidth, estimatedTotalHeight, parsedWidth, parsedHeight);
const scrollToItem = (rowIndex = 0, columnIdx = 0, alignment = AUTO_ALIGNMENT) => {
const _states = (0, vue.unref)(states);
columnIdx = Math.max(0, Math.min(columnIdx, props.totalColumn - 1));
rowIndex = Math.max(0, Math.min(rowIndex, props.totalRow - 1));
const scrollBarWidth = getScrollBarWidth(ns.namespace.value);
const _cache = (0, vue.unref)(cache);
const estimatedHeight = getEstimatedTotalHeight(props, _cache);
const estimatedWidth = getEstimatedTotalWidth(props, _cache);
scrollTo({
scrollLeft: getColumnOffset(props, columnIdx, alignment, _states.scrollLeft, _cache, estimatedWidth > props.width ? scrollBarWidth : 0),
scrollTop: getRowOffset(props, rowIndex, alignment, _states.scrollTop, _cache, estimatedHeight > props.height ? scrollBarWidth : 0)
});
};
const getItemStyle = (rowIndex, columnIndex) => {
const { columnWidth, direction, rowHeight } = props;
const itemStyleCache = getItemStyleCache.value(clearCache && columnWidth, clearCache && rowHeight, clearCache && direction);
const key = `${rowIndex},${columnIndex}`;
if (hasOwn(itemStyleCache, key)) return itemStyleCache[key];
else {
const [, left] = getColumnPosition(props, columnIndex, (0, vue.unref)(cache));
const _cache = (0, vue.unref)(cache);
const rtl = isRTL(direction);
const [height, top] = getRowPosition(props, rowIndex, _cache);
const [width] = getColumnPosition(props, columnIndex, _cache);
itemStyleCache[key] = {
position: "absolute",
left: rtl ? void 0 : `${left}px`,
right: rtl ? `${left}px` : void 0,
top: `${top}px`,
height: `${height}px`,
width: `${width}px`
};
return itemStyleCache[key];
}
};
const resetIsScrolling = () => {
states.value.isScrolling = false;
(0, vue.nextTick)(() => {
getItemStyleCache.value(-1, null, null);
});
};
(0, vue.onMounted)(() => {
if (!isClient) return;
const { initScrollLeft, initScrollTop } = props;
const windowElement = (0, vue.unref)(windowRef);
if (windowElement) {
if (isNumber(initScrollLeft)) windowElement.scrollLeft = initScrollLeft;
if (isNumber(initScrollTop)) windowElement.scrollTop = initScrollTop;
}
emitEvents();
});
const onUpdated = () => {
const { direction } = props;
const { scrollLeft, scrollTop, updateRequested } = (0, vue.unref)(states);
const windowElement = (0, vue.unref)(windowRef);
if (updateRequested && windowElement) {
if (direction === RTL) switch (getRTLOffsetType()) {
case RTL_OFFSET_NAG:
windowElement.scrollLeft = -scrollLeft;
break;
case RTL_OFFSET_POS_ASC:
windowElement.scrollLeft = scrollLeft;
break;
default: {
const { clientWidth, scrollWidth } = windowElement;
windowElement.scrollLeft = scrollWidth - clientWidth - scrollLeft;
break;
}
}
else windowElement.scrollLeft = Math.max(0, scrollLeft);
windowElement.scrollTop = Math.max(0, scrollTop);
}
};
const { resetAfterColumnIndex, resetAfterRowIndex, resetAfter } = instance.proxy;
expose({
windowRef,
innerRef,
getItemStyleCache,
touchStartX,
touchStartY,
handleTouchStart,
handleTouchMove,
scrollTo,
scrollToItem,
states,
resetAfterColumnIndex,
resetAfterRowIndex,
resetAfter
});
const renderScrollbars = () => {
const { scrollbarAlwaysOn, scrollbarStartGap, scrollbarEndGap, totalColumn, totalRow } = props;
const width = (0, vue.unref)(parsedWidth);
const height = (0, vue.unref)(parsedHeight);
const estimatedWidth = (0, vue.unref)(estimatedTotalWidth);
const estimatedHeight = (0, vue.unref)(estimatedTotalHeight);
const { scrollLeft, scrollTop } = (0, vue.unref)(states);
return {
horizontalScrollbar: (0, vue.h)(ScrollBar, {
ref: hScrollbar,
alwaysOn: scrollbarAlwaysOn,
startGap: scrollbarStartGap,
endGap: scrollbarEndGap,
class: ns.e("horizontal"),
clientSize: width,
layout: "horizontal",
onScroll: onHorizontalScroll,
ratio: width * 100 / estimatedWidth,
scrollFrom: scrollLeft / (estimatedWidth - width),
total: totalRow,
visible: true
}),
verticalScrollbar: (0, vue.h)(ScrollBar, {
ref: vScrollbar,
alwaysOn: scrollbarAlwaysOn,
startGap: scrollbarStartGap,
endGap: scrollbarEndGap,
class: ns.e("vertical"),
clientSize: height,
layout: "vertical",
onScroll: onVerticalScroll,
ratio: height * 100 / estimatedHeight,
scrollFrom: scrollTop / (estimatedHeight - height),
total: totalColumn,
visible: true
})
};
};
const renderItems = () => {
const [columnStart, columnEnd] = (0, vue.unref)(columnsToRender);
const [rowStart, rowEnd] = (0, vue.unref)(rowsToRender);
const { data, totalColumn, totalRow, useIsScrolling, itemKey } = props;
const children = [];
if (totalRow > 0 && totalColumn > 0) for (let row = rowStart; row <= rowEnd; row++) for (let column = columnStart; column <= columnEnd; column++) {
const key = itemKey({
columnIndex: column,
data,
rowIndex: row
});
children.push((0, vue.h)(vue.Fragment, { key }, slots.default?.({
columnIndex: column,
data,
isScrolling: useIsScrolling ? (0, vue.unref)(states).isScrolling : void 0,
style: getItemStyle(row, column),
rowIndex: row
})));
}
return children;
};
const renderInner = () => {
const Inner = (0, vue.resolveDynamicComponent)(props.innerElement);
const children = renderItems();
return [(0, vue.h)(Inner, (0, vue.mergeProps)(props.innerProps, {
style: (0, vue.unref)(innerStyle),
ref: innerRef
}), !isString(Inner) ? { default: () => children } : children)];
};
const renderWindow = () => {
const Container = (0, vue.resolveDynamicComponent)(props.containerElement);
const { horizontalScrollbar, verticalScrollbar } = renderScrollbars();
const Inner = renderInner();
return (0, vue.h)("div", {
key: 0,
class: ns.e("wrapper"),
role: props.role
}, [
(0, vue.h)(Container, {
class: props.className,
style: (0, vue.unref)(windowStyle),
onScroll,
ref: windowRef
}, !isString(Container) ? { default: () => Inner } : Inner),
horizontalScrollbar,
verticalScrollbar
]);
};
return renderWindow;
}
});
};
//#endregion
//#region ../../packages/components/virtual-list/src/components/fixed-size-grid.ts
const FixedSizeGrid = createGrid({
name: "ElFixedSizeGrid",
getColumnPosition: ({ columnWidth }, index) => [columnWidth, index * columnWidth],
getRowPosition: ({ rowHeight }, index) => [rowHeight, index * rowHeight],
getEstimatedTotalHeight: ({ totalRow, rowHeight }) => rowHeight * totalRow,
getEstimatedTotalWidth: ({ totalColumn, columnWidth }) => columnWidth * totalColumn,
getColumnOffset: ({ totalColumn, columnWidth, width }, columnIndex, alignment, scrollLeft, _, scrollBarWidth) => {
width = Number(width);
const lastColumnOffset = Math.max(0, totalColumn * columnWidth - width);
const maxOffset = Math.min(lastColumnOffset, columnIndex * columnWidth);
const minOffset = Math.max(0, columnIndex * columnWidth - width + scrollBarWidth + columnWidth);
if (alignment === "smart") if (scrollLeft >= minOffset - width && scrollLeft <= maxOffset + width) alignment = AUTO_ALIGNMENT;
else alignment = CENTERED_ALIGNMENT;
switch (alignment) {
case START_ALIGNMENT: return maxOffset;
case END_ALIGNMENT: return minOffset;
case CENTERED_ALIGNMENT: {
const middleOffset = Math.round(minOffset + (maxOffset - minOffset) / 2);
if (middleOffset < Math.ceil(width / 2)) return 0;
else if (middleOffset > lastColumnOffset + Math.floor(width / 2)) return lastColumnOffset;
else return middleOffset;
}
case AUTO_ALIGNMENT:
default: if (scrollLeft >= minOffset && scrollLeft <= maxOffset) return scrollLeft;
else if (minOffset > maxOffset) return minOffset;
else if (scrollLeft < minOffset) return minOffset;
else return maxOffset;
}
},
getRowOffset: ({ rowHeight, height, totalRow }, rowIndex, align, scrollTop, _, scrollBarWidth) => {
height = Number(height);
const lastRowOffset = Math.max(0, totalRow * rowHeight - height);
const maxOffset = Math.min(lastRowOffset, rowIndex * rowHeight);
const minOffset = Math.max(0, rowIndex * rowHeight - height + scrollBarWidth + rowHeight);
if (align === SMART_ALIGNMENT) if (scrollTop >= minOffset - height && scrollTop <= maxOffset + height) align = AUTO_ALIGNMENT;
else align = CENTERED_ALIGNMENT;
switch (align) {
case START_ALIGNMENT: return maxOffset;
case END_ALIGNMENT: return minOffset;
case CENTERED_ALIGNMENT: {
const middleOffset = Math.round(minOffset + (maxOffset - minOffset) / 2);
if (middleOffset < Math.ceil(height / 2)) return 0;
else if (middleOffset > lastRowOffset + Math.floor(height / 2)) return lastRowOffset;
else return middleOffset;
}
case AUTO_ALIGNMENT:
default: if (scrollTop >= minOffset && scrollTop <= maxOffset) return scrollTop;
else if (minOffset > maxOffset) return minOffset;
else if (scrollTop < minOffset) return minOffset;
else return maxOffset;
}
},
getColumnStartIndexForOffset: ({ columnWidth, totalColumn }, scrollLeft) => Math.max(0, Math.min(totalColumn - 1, Math.floor(scrollLeft / columnWidth))),
getColumnStopIndexForStartIndex: ({ columnWidth, totalColumn, width }, startIndex, scrollLeft) => {
const left = startIndex * columnWidth;
const visibleColumnsCount = Math.ceil((width + scrollLeft - left) / columnWidth);
return Math.max(0, Math.min(totalColumn - 1, startIndex + visibleColumnsCount - 1));
},
getRowStartIndexForOffset: ({ rowHeight, totalRow }, scrollTop) => Math.max(0, Math.min(totalRow - 1, Math.floor(scrollTop / rowHeight))),
getRowStopIndexForStartIndex: ({ rowHeight, totalRow, height }, startIndex, scrollTop) => {
const top = startIndex * rowHeight;
const numVisibleRows = Math.ceil((height + scrollTop - top) / rowHeight);
return Math.max(0, Math.min(totalRow - 1, startIndex + numVisibleRows - 1));
},
initCache: () => void 0,
clearCache: true,
validateProps: ({ columnWidth, rowHeight }) => {}
});
//#endregion
//#region ../../packages/components/virtual-list/src/components/dynamic-size-grid.ts
const { max, min, floor } = Math;
const ACCESS_SIZER_KEY_MAP = {
column: "columnWidth",
row: "rowHeight"
};
const ACCESS_LAST_VISITED_KEY_MAP = {
column: "lastVisitedColumnIndex",
row: "lastVisitedRowIndex"
};
const getItemFromCache = (props, index, gridCache, type) => {
const [cachedItems, sizer, lastVisited] = [
gridCache[type],
props[ACCESS_SIZER_KEY_MAP[type]],
gridCache[ACCESS_LAST_VISITED_KEY_MAP[type]]
];
if (index > lastVisited) {
let offset = 0;
if (lastVisited >= 0) {
const item = cachedItems[lastVisited];
offset = item.offset + item.size;
}
for (let i = lastVisited + 1; i <= index; i++) {
const size = sizer(i);
cachedItems[i] = {
offset,
size
};
offset += size;
}
gridCache[ACCESS_LAST_VISITED_KEY_MAP[type]] = index;
}
return cachedItems[index];
};
const bs = (props, gridCache, low, high, offset, type) => {
while (low <= high) {
const mid = low + floor((high - low) / 2);
const currentOffset = getItemFromCache(props, mid, gridCache, type).offset;
if (currentOffset === offset) return mid;
else if (currentOffset < offset) low = mid + 1;
else high = mid - 1;
}
return max(0, low - 1);
};
const es = (props, gridCache, idx, offset, type) => {
const total = type === "column" ? props.totalColumn : props.totalRow;
let exponent = 1;
while (idx < total && getItemFromCache(props, idx, gridCache, type).offset < offset) {
idx += exponent;
exponent *= 2;
}
return bs(props, gridCache, floor(idx / 2), min(idx, total - 1), offset, type);
};
const findItem = (props, gridCache, offset, type) => {
const [cache, lastVisitedIndex] = [gridCache[type], gridCache[ACCESS_LAST_VISITED_KEY_MAP[type]]];
if ((lastVisitedIndex > 0 ? cache[lastVisitedIndex].offset : 0) >= offset) return bs(props, gridCache, 0, lastVisitedIndex, offset, type);
return es(props, gridCache, max(0, lastVisitedIndex), offset, type);
};
const getEstimatedTotalHeight = ({ totalRow }, { estimatedRowHeight, lastVisitedRowIndex, row }) => {
let sizeOfVisitedRows = 0;
if (lastVisitedRowIndex >= totalRow) lastVisitedRowIndex = totalRow - 1;
if (lastVisitedRowIndex >= 0) {
const item = row[lastVisitedRowIndex];
sizeOfVisitedRows = item.offset + item.size;
}
const sizeOfUnvisitedItems = (totalRow - lastVisitedRowIndex - 1) * estimatedRowHeight;
return sizeOfVisitedRows + sizeOfUnvisitedItems;
};
const getEstimatedTotalWidth = ({ totalColumn }, { column, estimatedColumnWidth, lastVisitedColumnIndex }) => {
let sizeOfVisitedColumns = 0;
if (lastVisitedColumnIndex > totalColumn) lastVisitedColumnIndex = totalColumn - 1;
if (lastVisitedColumnIndex >= 0) {
const item = column[lastVisitedColumnIndex];
sizeOfVisitedColumns = item.offset + item.size;
}
const sizeOfUnvisitedItems = (totalColumn - lastVisitedColumnIndex - 1) * estimatedColumnWidth;
return sizeOfVisitedColumns + sizeOfUnvisitedItems;
};
const ACCESS_ESTIMATED_SIZE_KEY_MAP = {
column: getEstimatedTotalWidth,
row: getEstimatedTotalHeight
};
const getOffset$1 = (props, index, alignment, scrollOffset, cache, type, scrollBarWidth) => {
const [size, estimatedSizeAssociates] = [type === "row" ? props.height : props.width, ACCESS_ESTIMATED_SIZE_KEY_MAP[type]];
const item = getItemFromCache(props, index, cache, type);
const maxOffset = max(0, min(estimatedSizeAssociates(props, cache) - size, item.offset));
const minOffset = max(0, item.offset - size + scrollBarWidth + item.size);
if (alignment === SMART_ALIGNMENT) if (scrollOffset >= minOffset - size && scrollOffset <= maxOffset + size) alignment = AUTO_ALIGNMENT;
else alignment = CENTERED_ALIGNMENT;
switch (alignment) {
case START_ALIGNMENT: return maxOffset;
case END_ALIGNMENT: return minOffset;
case CENTERED_ALIGNMENT: return Math.round(minOffset + (maxOffset - minOffset) / 2);
case AUTO_ALIGNMENT:
default: if (scrollOffset >= minOffset && scrollOffset <= maxOffset) return scrollOffset;
else if (minOffset > maxOffset) return minOffset;
else if (scrollOffset < minOffset) return minOffset;
else return maxOffset;
}
};
const DynamicSizeGrid = createGrid({
name: "ElDynamicSizeGrid",
getColumnPosition: (props, idx, cache) => {
const item = getItemFromCache(props, idx, cache, "column");
return [item.size, item.offset];
},
getRowPosition: (props, idx, cache) => {
const item = getItemFromCache(props, idx, cache, "row");
return [item.size, item.offset];
},
getColumnOffset: (props, columnIndex, alignment, scrollLeft, cache, scrollBarWidth) => getOffset$1(props, columnIndex, alignment, scrollLeft, cache, "column", scrollBarWidth),
getRowOffset: (props, rowIndex, alignment, scrollTop, cache, scrollBarWidth) => getOffset$1(props, rowIndex, alignment, scrollTop, cache, "row", scrollBarWidth),
getColumnStartIndexForOffset: (props, scrollLeft, cache) => findItem(props, cache, scrollLeft, "column"),
getColumnStopIndexForStartIndex: (props, startIndex, scrollLeft, cache) => {
const item = getItemFromCache(props, startIndex, cache, "column");
const maxOffset = scrollLeft + props.width;
let offset = item.offset + item.size;
let stopIndex = startIndex;
while (stopIndex < props.totalColumn - 1 && offset < maxOffset) {
stopIndex++;
offset += getItemFromCache(props, startIndex, cache, "column").size;
}
return stopIndex;
},
getEstimatedTotalHeight,
getEstimatedTotalWidth,
getRowStartIndexForOffset: (props, scrollTop, cache) => findItem(props, cache, scrollTop, "row"),
getRowStopIndexForStartIndex: (props, startIndex, scrollTop, cache) => {
const { totalRow, height } = props;
const item = getItemFromCache(props, startIndex, cache, "row");
const maxOffset = scrollTop + height;
let offset = item.size + item.offset;
let stopIndex = startIndex;
while (stopIndex < totalRow - 1 && offset < maxOffset) {
stopIndex++;
offset += getItemFromCache(props, stopIndex, cache, "row").size;
}
return stopIndex;
},
injectToInstance: (instance, cache) => {
const resetAfter = ({ columnIndex, rowIndex }, forceUpdate) => {
forceUpdate = isUndefined(forceUpdate) ? true : forceUpdate;
if (isNumber(columnIndex)) cache.value.lastVisitedColumnIndex = Math.min(cache.value.lastVisitedColumnIndex, columnIndex - 1);
if (isNumber(rowIndex)) cache.value.lastVisitedRowIndex = Math.min(cache.value.lastVisitedRowIndex, rowIndex - 1);
instance.exposed?.getItemStyleCache.value(-1, null, null);
if (forceUpdate) instance.proxy?.$forceUpdate();
};
const resetAfterColumnIndex = (columnIndex, forceUpdate) => {
resetAfter({ columnIndex }, forceUpdate);
};
const resetAfterRowIndex = (rowIndex, forceUpdate) => {
resetAfter({ rowIndex }, forceUpdate);
};
Object.assign(instance.proxy, {
resetAfterColumnIndex,
resetAfterRowIndex,
resetAfter
});
},
initCache: ({ estimatedColumnWidth = DEFAULT_DYNAMIC_LIST_ITEM_SIZE, estimatedRowHeight = DEFAULT_DYNAMIC_LIST_ITEM_SIZE }) => {
return {
column: {},
estimatedColumnWidth,
estimatedRowHeight,
lastVisitedColumnIndex: -1,
lastVisitedRowIndex: -1,
row: {}
};
},
clearCache: false,
validateProps: ({ columnWidth, rowHeight }) => {}
});
//#endregion
//#region ../../packages/components/select-v2/src/group-item.vue?vue&type=script&lang.ts
var group_item_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
props: {
item: {
type: Object,
required: true
},
style: { type: Object },
height: Number
},
setup() {
return { ns: useNamespace("select") };
}
});
//#endregion
//#region ../../packages/components/select-v2/src/group-item.vue
function _sfc_render$7(_ctx, _cache, $props, $setup, $data, $options) {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
class: (0, vue.normalizeClass)(_ctx.ns.be("group", "title")),
style: (0, vue.normalizeStyle)({
..._ctx.style,
lineHeight: `${_ctx.height}px`
})
}, (0, vue.toDisplayString)(_ctx.item.label), 7);
}
var group_item_default = /* @__PURE__ */ _plugin_vue_export_helper_default(group_item_vue_vue_type_script_lang_default, [["render", _sfc_render$7]]);
//#endregion
//#region ../../packages/components/select-v2/src/useOption.ts
function useOption(props, { emit }) {
return {
hoverItem: () => {
if (!props.disabled) emit("hover", props.index);
},
selectOptionClick: () => {
if (!props.disabled) emit("select", props.item, props.index);
}
};
}
//#endregion
//#region ../../packages/components/select-v2/src/defaults.ts
const selectV2Props = buildProps({
allowCreate: Boolean,
autocomplete: {
type: definePropType(String),
default: "none"
},
automaticDropdown: Boolean,
clearable: Boolean,
clearIcon: {
type: iconPropType,
default: circle_close_default
},
effect: {
type: definePropType(String),
default: "light"
},
collapseTags: Boolean,
collapseTagsTooltip: Boolean,
tagTooltip: {
type: definePropType(Object),
default: () => ({})
},
maxCollapseTags: {
type: Number,
default: 1
},
defaultFirstOption: Boolean,
disabled: {
type: Boolean,
default: void 0
},
estimatedOptionHeight: {
type: Number,
default: void 0
},
filterable: Boolean,
filterMethod: { type: definePropType(Function) },
height: {
type: Number,
default: 274
},
itemHeight: {
type: Number,
default: 34
},
id: String,
loading: Boolean,
loadingText: String,
modelValue: {
type: definePropType([
Array,
String,
Number,
Boolean,
Object
]),
default: void 0
},
multiple: Boolean,
multipleLimit: {
type: Number,
default: 0
},
name: String,
noDataText: String,
noMatchText: String,
remoteMethod: { type: definePropType(Function) },
reserveKeyword: {
type: Boolean,
default: true
},
options: {
type: definePropType(Array),
required: true
},
placeholder: { type: String },
teleported: useTooltipContentProps.teleported,
persistent: {
type: Boolean,
default: true
},
popperClass: useTooltipContentProps.popperClass,
popperStyle: useTooltipContentProps.popperStyle,
popperOptions: {
type: definePropType(Object),
default: () => ({})
},
remote: Boolean,
debounce: {
type: Number,
default: 300
},
size: useSizeProp,
props: {
type: definePropType(Object),
default: () => defaultProps$2
},
valueKey: {
type: String,
default: "value"
},
scrollbarAlwaysOn: Boolean,
validateEvent: {
type: Boolean,
default: true
},
offset: {
type: Number,
default: 12
},
remoteShowSuffix: Boolean,
showArrow: {
type: Boolean,
default: true
},
placement: {
type: definePropType(String),
values: Ee,
default: "bottom-start"
},
fallbackPlacements: {
type: definePropType(Array),
default: [
"bottom-start",
"top-start",
"right",
"left"
]
},
tagType: {
...tagProps.type,
default: "info"
},
tagEffect: {
...tagProps.effect,
default: "light"
},
tabindex: {
type: [String, Number],
default: 0
},
appendTo: useTooltipContentProps.appendTo,
fitInputWidth: {
type: [Boolean, Number],
default: true,
validator(val) {
return isBoolean(val) || isNumber(val);
}
},
suffixIcon: {
type: iconPropType,
default: arrow_down_default
},
...useEmptyValuesProps,
...useAriaProps(["ariaLabel"])
});
const optionV2Props = buildProps({
data: Array,
disabled: Boolean,
hovering: Boolean,
item: {
type: definePropType(Object),
required: true
},
index: Number,
style: Object,
selected: Boolean,
created: Boolean
});
const selectV2Emits = {
[UPDATE_MODEL_EVENT]: (val) => true,
[CHANGE_EVENT]: (val) => true,
"remove-tag": (val) => true,
"visible-change": (visible) => true,
focus: (evt) => evt instanceof FocusEvent,
blur: (evt) => evt instanceof FocusEvent,
clear: () => true
};
const optionV2Emits = {
hover: (index) => isNumber(index),
select: (val, index) => true
};
//#endregion
//#region ../../packages/components/select-v2/src/token.ts
const selectV2InjectionKey = Symbol("ElSelectV2Injection");
//#endregion
//#region ../../packages/components/select-v2/src/option-item.vue?vue&type=script&lang.ts
var option_item_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
props: optionV2Props,
emits: optionV2Emits,
setup(props, { emit }) {
const select = (0, vue.inject)(selectV2InjectionKey);
const ns = useNamespace("select");
const { hoverItem, selectOptionClick } = useOption(props, { emit });
const { getLabel } = useProps(select.props);
const contentId = select.contentId;
const handleMousedown = (event) => {
let target = event.target;
const currentTarget = event.currentTarget;
while (target && target !== currentTarget) {
if (isFocusable(target)) return;
target = target.parentElement;
}
event.preventDefault();
};
return {
ns,
contentId,
hoverItem,
handleMousedown,
selectOptionClick,
getLabel
};
}
});
//#endregion
//#region ../../packages/components/select-v2/src/option-item.vue
const _hoisted_1$22 = [
"id",
"aria-selected",
"aria-disabled"
];
function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
id: `${_ctx.contentId}-${_ctx.index}`,
role: "option",
"aria-selected": _ctx.selected,
"aria-disabled": _ctx.disabled || void 0,
style: (0, vue.normalizeStyle)(_ctx.style),
class: (0, vue.normalizeClass)([
_ctx.ns.be("dropdown", "item"),
_ctx.ns.is("selected", _ctx.selected),
_ctx.ns.is("disabled", _ctx.disabled),
_ctx.ns.is("created", _ctx.created),
_ctx.ns.is("hovering", _ctx.hovering)
]),
onMousemove: _cache[0] || (_cache[0] = (...args) => _ctx.hoverItem && _ctx.hoverItem(...args)),
onMousedown: _cache[1] || (_cache[1] = (...args) => _ctx.handleMousedown && _ctx.handleMousedown(...args)),
onClick: _cache[2] || (_cache[2] = (0, vue.withModifiers)((...args) => _ctx.selectOptionClick && _ctx.selectOptionClick(...args), ["stop"]))
}, [(0, vue.renderSlot)(_ctx.$slots, "default", {
item: _ctx.item,
index: _ctx.index,
disabled: _ctx.disabled
}, () => [(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(_ctx.getLabel(_ctx.item)), 1)])], 46, _hoisted_1$22);
}
var option_item_default = /* @__PURE__ */ _plugin_vue_export_helper_default(option_item_vue_vue_type_script_lang_default, [["render", _sfc_render$6]]);
//#endregion
//#region ../../packages/components/select-v2/src/select-dropdown.tsx
const props = {
loading: Boolean,
data: {
type: Array,
required: true
},
hoveringIndex: Number,
width: Number,
id: String,
ariaLabel: String
};
var select_dropdown_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElSelectDropdown",
props,
setup(props, { slots, expose }) {
const select = (0, vue.inject)(selectV2InjectionKey);
const ns = useNamespace("select");
const { getLabel, getValue, getDisabled } = useProps(select.props);
const cachedHeights = (0, vue.ref)([]);
const listRef = (0, vue.ref)();
const size = (0, vue.computed)(() => props.data.length);
(0, vue.watch)(() => size.value, () => {
select.tooltipRef.value?.updatePopper?.();
});
const isSized = (0, vue.computed)(() => isUndefined(select.props.estimatedOptionHeight));
const listProps = (0, vue.computed)(() => {
if (isSized.value) return { itemSize: select.props.itemHeight };
return {
estimatedSize: select.props.estimatedOptionHeight,
itemSize: (idx) => cachedHeights.value[idx]
};
});
const contains = (arr = [], target) => {
const { props: { valueKey } } = select;
if (!isObject$1(target)) return arr.includes(target);
return arr && arr.some((item) => {
return (0, vue.toRaw)(get(item, valueKey)) === get(target, valueKey);
});
};
const isEqual = (selected, target) => {
if (!isObject$1(target)) return selected === target;
else {
const { valueKey } = select.props;
return get(selected, valueKey) === get(target, valueKey);
}
};
const isItemSelected = (modelValue, target) => {
if (select.props.multiple) return contains(modelValue, getValue(target));
return isEqual(modelValue, getValue(target));
};
const isItemDisabled = (modelValue, selected) => {
const { disabled, multiple, multipleLimit } = select.props;
return disabled || !selected && (multiple ? multipleLimit > 0 && modelValue.length >= multipleLimit : false);
};
const isItemHovering = (target) => props.hoveringIndex === target;
const scrollToItem = (index) => {
const list = listRef.value;
if (list) list.scrollToItem(index);
};
const resetScrollTop = () => {
const list = listRef.value;
if (list) list.resetScrollTop();
};
expose({
listRef,
isSized,
isItemDisabled,
isItemHovering,
isItemSelected,
scrollToItem,
resetScrollTop
});
const Item = (itemProps) => {
const { index, data, style } = itemProps;
const sized = (0, vue.unref)(isSized);
const { itemSize, estimatedSize } = (0, vue.unref)(listProps);
const { modelValue } = select.props;
const { onSelect, onHover } = select;
const item = data[index];
if (item.type === "Group") return (0, vue.createVNode)(group_item_default, {
"item": item,
"style": style,
"height": sized ? itemSize : estimatedSize
}, null);
const isSelected = isItemSelected(modelValue, item);
const isDisabled = isItemDisabled(modelValue, isSelected);
const isHovering = isItemHovering(index);
return (0, vue.createVNode)(option_item_default, (0, vue.mergeProps)(itemProps, {
"selected": isSelected,
"disabled": getDisabled(item) || isDisabled,
"created": !!item.created,
"hovering": isHovering,
"item": item,
"onSelect": onSelect,
"onHover": onHover
}), { default: (props) => slots.default?.(props) || (0, vue.createVNode)("span", null, [getLabel(item)]) });
};
const { onKeyboardNavigate, onKeyboardSelect } = select;
const onForward = () => {
onKeyboardNavigate("forward");
};
const onBackward = () => {
onKeyboardNavigate("backward");
};
const onEscOrTab = () => {};
const onKeydown = (e) => {
const code = getEventCode(e);
const { tab, esc, down, up, enter, numpadEnter } = EVENT_CODE;
if ([
esc,
down,
up,
enter,
numpadEnter
].includes(code)) {
e.preventDefault();
e.stopPropagation();
}
switch (code) {
case tab:
case esc:
onEscOrTab();
break;
case down:
onForward();
break;
case up:
onBackward();
break;
case enter:
case numpadEnter:
onKeyboardSelect();
break;
}
};
return () => {
const { data, width } = props;
const { height, multiple, scrollbarAlwaysOn } = select.props;
const isScrollbarAlwaysOn = (0, vue.computed)(() => {
return isIOS ? true : scrollbarAlwaysOn;
});
const List = (0, vue.unref)(isSized) ? FixedSizeList : DynamicSizeList;
return (0, vue.createVNode)("div", {
"class": [ns.b("dropdown"), ns.is("multiple", multiple)],
"style": { width: `${width}px` }
}, [
slots.header?.(),
slots.loading?.() || slots.empty?.() || (0, vue.createVNode)(List, (0, vue.mergeProps)({ "ref": listRef }, (0, vue.unref)(listProps), {
"className": ns.be("dropdown", "list"),
"scrollbarAlwaysOn": isScrollbarAlwaysOn.value,
"data": data,
"height": height,
"width": width,
"total": data.length,
"innerElement": "ul",
"innerProps": {
id: props.id,
role: "listbox",
"aria-label": props.ariaLabel,
"aria-orientation": "vertical"
},
"onKeydown": onKeydown
}), { default: (props) => (0, vue.createVNode)(Item, props, null) }),
slots.footer?.()
]);
};
}
});
//#endregion
//#region ../../packages/components/select-v2/src/useAllowCreate.ts
function useAllowCreate(props, states) {
const { aliasProps, getLabel, getValue } = useProps(props);
const createOptionCount = (0, vue.ref)(0);
const cachedSelectedOption = (0, vue.ref)();
const enableAllowCreateMode = (0, vue.computed)(() => {
return props.allowCreate && props.filterable;
});
(0, vue.watch)(() => props.options, (options) => {
const optionLabelsSet = new Set(options.map((option) => getLabel(option)));
states.createdOptions = states.createdOptions.filter((createdOption) => !optionLabelsSet.has(getLabel(createdOption)));
});
function hasExistingOption(query) {
const hasOption = (option) => getLabel(option) === query;
return props.options && props.options.some(hasOption) || states.createdOptions.some(hasOption);
}
function selectNewOption(option) {
if (!enableAllowCreateMode.value) return;
if (props.multiple && option.created) createOptionCount.value++;
else cachedSelectedOption.value = option;
}
function createNewOption(query) {
if (enableAllowCreateMode.value) if (query && query.length > 0) {
if (hasExistingOption(query)) {
states.createdOptions = states.createdOptions.filter((createdOption) => getLabel(createdOption) !== states.previousQuery);
return;
}
const newOption = {
[aliasProps.value.value]: query,
[aliasProps.value.label]: query,
created: true,
[aliasProps.value.disabled]: false
};
if (states.createdOptions.length >= createOptionCount.value) states.createdOptions[createOptionCount.value] = newOption;
else states.createdOptions.push(newOption);
} else if (props.multiple) states.createdOptions.length = createOptionCount.value;
else {
const selectedOption = cachedSelectedOption.value;
states.createdOptions.length = 0;
if (selectedOption && selectedOption.created) states.createdOptions.push(selectedOption);
}
}
function removeNewOption(option) {
if (!enableAllowCreateMode.value || !option || !option.created || option.created && props.reserveKeyword && states.inputValue === getLabel(option)) return;
const idx = states.createdOptions.findIndex((it) => getValue(it) === getValue(option));
if (~idx) {
states.createdOptions.splice(idx, 1);
createOptionCount.value--;
}
}
function clearAllNewOption() {
if (enableAllowCreateMode.value) {
states.createdOptions.length = 0;
createOptionCount.value = 0;
}
}
return {
createNewOption,
removeNewOption,
selectNewOption,
clearAllNewOption
};
}
//#endregion
//#region ../../packages/components/select-v2/src/useSelect.ts
const useSelect$1 = (props, emit) => {
const { t } = useLocale();
const slots = (0, vue.useSlots)();
const nsSelect = useNamespace("select");
const nsInput = useNamespace("input");
const { form: elForm, formItem: elFormItem } = useFormItem();
const { inputId } = useFormItemInputId(props, { formItemContext: elFormItem });
const { aliasProps, getLabel, getValue, getDisabled, getOptions } = useProps(props);
const { valueOnClear, isEmptyValue } = useEmptyValues(props);
const states = (0, vue.reactive)({
inputValue: "",
cachedOptions: [],
createdOptions: [],
hoveringIndex: -1,
inputHovering: false,
selectionWidth: 0,
collapseItemWidth: 0,
previousQuery: null,
previousValue: void 0,
selectedLabel: "",
menuVisibleOnFocus: false,
isBeforeHide: false
});
const popperSize = (0, vue.ref)(-1);
const debouncing = (0, vue.ref)(false);
const selectRef = (0, vue.ref)();
const selectionRef = (0, vue.ref)();
const tooltipRef = (0, vue.ref)();
const tagTooltipRef = (0, vue.ref)();
const inputRef = (0, vue.ref)();
const prefixRef = (0, vue.ref)();
const suffixRef = (0, vue.ref)();
const menuRef = (0, vue.ref)();
const tagMenuRef = (0, vue.ref)();
const collapseItemRef = (0, vue.ref)();
const { isComposing, handleCompositionStart, handleCompositionEnd, handleCompositionUpdate } = useComposition({ afterComposition: (e) => onInput(e) });
const selectDisabled = useFormDisabled();
const { wrapperRef, isFocused, handleBlur } = useFocusController(inputRef, {
disabled: selectDisabled,
afterFocus() {
if (props.automaticDropdown && !expanded.value) {
expanded.value = true;
states.menuVisibleOnFocus = true;
}
},
beforeBlur(event) {
return tooltipRef.value?.isFocusInsideContent(event) || tagTooltipRef.value?.isFocusInsideContent(event);
},
afterBlur() {
expanded.value = false;
states.menuVisibleOnFocus = false;
if (props.validateEvent) elFormItem?.validate?.("blur").catch((err) => /* @__PURE__ */ debugWarn(err));
}
});
const allOptions = (0, vue.computed)(() => filterOptions(""));
const hasOptions = (0, vue.computed)(() => {
if (props.loading) return false;
return props.options.length > 0 || states.createdOptions.length > 0;
});
const filteredOptions = (0, vue.ref)([]);
const expanded = (0, vue.ref)(false);
const needStatusIcon = (0, vue.computed)(() => elForm?.statusIcon ?? false);
const popupHeight = (0, vue.computed)(() => {
const totalHeight = filteredOptions.value.length * props.itemHeight;
return totalHeight > props.height ? props.height : totalHeight;
});
const hasModelValue = (0, vue.computed)(() => {
return props.multiple ? isArray$1(props.modelValue) && props.modelValue.length > 0 : !isEmptyValue(props.modelValue);
});
const showClearBtn = (0, vue.computed)(() => {
return props.clearable && !selectDisabled.value && hasModelValue.value && (isFocused.value || states.inputHovering);
});
const iconComponent = (0, vue.computed)(() => props.remote && props.filterable && !props.remoteShowSuffix ? "" : props.suffixIcon);
const iconReverse = (0, vue.computed)(() => iconComponent.value && nsSelect.is("reverse", expanded.value));
const validateState = (0, vue.computed)(() => elFormItem?.validateState || "");
const validateIcon = (0, vue.computed)(() => {
if (!validateState.value) return;
return ValidateComponentsMap[validateState.value];
});
const debounce = (0, vue.computed)(() => props.remote ? props.debounce : 0);
const isRemoteSearchEmpty = (0, vue.computed)(() => props.remote && !states.inputValue && !hasOptions.value);
const emptyText = (0, vue.computed)(() => {
if (props.loading) return props.loadingText || t("el.select.loading");
else {
if (props.filterable && states.inputValue && hasOptions.value && filteredOptions.value.length === 0) return props.noMatchText || t("el.select.noMatch");
if (!hasOptions.value) return props.noDataText || t("el.select.noData");
}
return null;
});
const isFilterMethodValid = (0, vue.computed)(() => props.filterable && isFunction$1(props.filterMethod));
const isRemoteMethodValid = (0, vue.computed)(() => props.filterable && props.remote && isFunction$1(props.remoteMethod));
const filterOptions = (query) => {
const regexp = new RegExp(escapeStringRegexp(query), "i");
const isValidOption = (o) => {
if (isFilterMethodValid.value || isRemoteMethodValid.value) return true;
return query ? regexp.test(getLabel(o) || "") : true;
};
if (props.loading) return [];
return [...states.createdOptions, ...props.options].reduce((all, item) => {
const options = getOptions(item);
if (isArray$1(options)) {
const filtered = options.filter(isValidOption);
if (filtered.length > 0) all.push({
label: getLabel(item),
type: "Group"
}, ...filtered);
} else if (props.remote || isValidOption(item)) all.push(item);
return all;
}, []);
};
const updateOptions = () => {
filteredOptions.value = filterOptions(states.inputValue);
};
const allOptionsValueMap = (0, vue.computed)(() => {
const valueMap = /* @__PURE__ */ new Map();
allOptions.value.forEach((option, index) => {
valueMap.set(getValueKey(getValue(option)), {
option,
index
});
});
return valueMap;
});
const filteredOptionsValueMap = (0, vue.computed)(() => {
const valueMap = /* @__PURE__ */ new Map();
filteredOptions.value.forEach((option, index) => {
valueMap.set(getValueKey(getValue(option)), {
option,
index
});
});
return valueMap;
});
const optionsAllDisabled = (0, vue.computed)(() => filteredOptions.value.every((option) => getDisabled(option)));
const selectSize = useFormSize();
const collapseTagSize = (0, vue.computed)(() => "small" === selectSize.value ? "small" : "default");
const calculatePopperSize = () => {
if (isNumber(props.fitInputWidth)) {
popperSize.value = props.fitInputWidth;
return;
}
const width = selectRef.value?.offsetWidth || 200;
if (!props.fitInputWidth && hasOptions.value) (0, vue.nextTick)(() => {
popperSize.value = Math.max(width, calculateLabelMaxWidth());
});
else popperSize.value = width;
};
const calculateLabelMaxWidth = () => {
const ctx = document.createElement("canvas").getContext("2d");
const selector = nsSelect.be("dropdown", "item");
const dropdownItemEl = (menuRef.value?.listRef?.innerRef || document).querySelector(`.${selector}`);
if (dropdownItemEl === null || ctx === null) return 0;
const style = getComputedStyle(dropdownItemEl);
const padding = Number.parseFloat(style.paddingLeft) + Number.parseFloat(style.paddingRight);
ctx.font = `bold ${style.font.replace(new RegExp(`\\b${style.fontWeight}\\b`), "")}`;
return filteredOptions.value.reduce((max, option) => {
const metrics = ctx.measureText(getLabel(option));
return Math.max(metrics.width, max);
}, 0) + padding;
};
const getGapWidth = () => {
if (!selectionRef.value) return 0;
const style = window.getComputedStyle(selectionRef.value);
return Number.parseFloat(style.gap || "6px");
};
const tagStyle = (0, vue.computed)(() => {
const gapWidth = getGapWidth();
const inputSlotWidth = props.filterable ? gapWidth + MINIMUM_INPUT_WIDTH : 0;
return { maxWidth: `${collapseItemRef.value && props.maxCollapseTags === 1 ? states.selectionWidth - states.collapseItemWidth - gapWidth - inputSlotWidth : states.selectionWidth - inputSlotWidth}px` };
});
const collapseTagStyle = (0, vue.computed)(() => {
return { maxWidth: `${states.selectionWidth}px` };
});
const shouldShowPlaceholder = (0, vue.computed)(() => {
if (isArray$1(props.modelValue)) return props.modelValue.length === 0 && !states.inputValue;
return props.filterable ? !states.inputValue : true;
});
const currentPlaceholder = (0, vue.computed)(() => {
const _placeholder = props.placeholder ?? t("el.select.placeholder");
return props.multiple || !hasModelValue.value ? _placeholder : states.selectedLabel;
});
const popperRef = (0, vue.computed)(() => tooltipRef.value?.popperRef?.contentRef);
const indexRef = (0, vue.computed)(() => {
if (props.multiple) {
const len = props.modelValue.length;
if (len > 0 && filteredOptionsValueMap.value.has(props.modelValue[len - 1])) {
const { index } = filteredOptionsValueMap.value.get(props.modelValue[len - 1]);
return index;
}
} else if (!isEmptyValue(props.modelValue) && filteredOptionsValueMap.value.has(props.modelValue)) {
const { index } = filteredOptionsValueMap.value.get(props.modelValue);
return index;
}
return -1;
});
const dropdownMenuVisible = (0, vue.computed)({
get() {
return expanded.value && (props.loading || !isRemoteSearchEmpty.value || props.remote && !!slots.empty) && (!debouncing.value || !isEmpty(states.previousQuery) || hasOptions.value);
},
set(val) {
expanded.value = val;
}
});
const showTagList = (0, vue.computed)(() => {
if (!props.multiple) return [];
return props.collapseTags ? states.cachedOptions.slice(0, props.maxCollapseTags) : states.cachedOptions;
});
const collapseTagList = (0, vue.computed)(() => {
if (!props.multiple) return [];
return props.collapseTags ? states.cachedOptions.slice(props.maxCollapseTags) : [];
});
const { createNewOption, removeNewOption, selectNewOption, clearAllNewOption } = useAllowCreate(props, states);
const toggleMenu = (event) => {
if (selectDisabled.value || props.filterable && expanded.value && event && !suffixRef.value?.contains(event.target)) return;
if (states.menuVisibleOnFocus) states.menuVisibleOnFocus = false;
else expanded.value = !expanded.value;
};
const onInputChange = () => {
if (states.inputValue.length > 0 && !expanded.value) expanded.value = true;
createNewOption(states.inputValue);
(0, vue.nextTick)(() => {
handleQueryChange(states.inputValue);
});
};
const debouncedOnInputChange = useDebounceFn(() => {
onInputChange();
debouncing.value = false;
}, debounce);
const handleQueryChange = (val) => {
if (states.previousQuery === val || isComposing.value) return;
states.previousQuery = val;
if (props.filterable && isFunction$1(props.filterMethod)) props.filterMethod(val);
else if (props.filterable && props.remote && isFunction$1(props.remoteMethod)) props.remoteMethod(val);
if (props.defaultFirstOption && (props.filterable || props.remote) && filteredOptions.value.length) (0, vue.nextTick)(checkDefaultFirstOption);
else (0, vue.nextTick)(updateHoveringIndex);
};
/**
* find and highlight first option as default selected
* @remark
* - if the first option in dropdown list is user-created,
* it would be at the end of the optionsArray
* so find it and set hover.
* (NOTE: there must be only one user-created option in dropdown list with query)
* - if there's no user-created option in list, just find the first one as usual
* (NOTE: exclude options that are disabled or in disabled-group)
*/
const checkDefaultFirstOption = () => {
const optionsInDropdown = filteredOptions.value.filter((n) => !n.disabled && n.type !== "Group");
const userCreatedOption = optionsInDropdown.find((n) => n.created);
const firstOriginOption = optionsInDropdown[0];
states.hoveringIndex = getValueIndex(filteredOptions.value, userCreatedOption || firstOriginOption);
};
const emitChange = (val) => {
if (!isEqual$1(props.modelValue, val)) emit(CHANGE_EVENT, val);
};
const update = (val) => {
emit(UPDATE_MODEL_EVENT, val);
emitChange(val);
states.previousValue = props.multiple ? String(val) : val;
(0, vue.nextTick)(() => {
if (props.multiple && isArray$1(props.modelValue)) {
const cachedOptions = states.cachedOptions.slice();
const selectedOptions = props.modelValue.map((value) => getOption(value, cachedOptions));
if (!isEqual$1(states.cachedOptions, selectedOptions)) states.cachedOptions = selectedOptions;
} else initStates(true);
});
};
const getValueIndex = (arr = [], value) => {
if (!isObject$1(value)) return arr.indexOf(value);
const valueKey = props.valueKey;
let index = -1;
arr.some((item, i) => {
if (get(item, valueKey) === get(value, valueKey)) {
index = i;
return true;
}
return false;
});
return index;
};
const getValueKey = (item) => {
return isObject$1(item) ? get(item, props.valueKey) : item;
};
const handleResize = () => {
calculatePopperSize();
};
const resetSelectionWidth = () => {
states.selectionWidth = Number.parseFloat(window.getComputedStyle(selectionRef.value).width);
};
const resetCollapseItemWidth = () => {
states.collapseItemWidth = collapseItemRef.value.getBoundingClientRect().width;
};
const updateTooltip = () => {
tooltipRef.value?.updatePopper?.();
};
const updateTagTooltip = () => {
tagTooltipRef.value?.updatePopper?.();
};
const onSelect = (option) => {
const optionValue = getValue(option);
if (props.multiple) {
let selectedOptions = props.modelValue.slice();
const index = getValueIndex(selectedOptions, optionValue);
if (index > -1) {
selectedOptions = [...selectedOptions.slice(0, index), ...selectedOptions.slice(index + 1)];
states.cachedOptions.splice(index, 1);
removeNewOption(option);
} else if (props.multipleLimit <= 0 || selectedOptions.length < props.multipleLimit) {
selectedOptions = [...selectedOptions, optionValue];
states.cachedOptions.push(option);
selectNewOption(option);
}
update(selectedOptions);
if (option.created) handleQueryChange("");
if (props.filterable && (option.created || !props.reserveKeyword)) states.inputValue = "";
} else {
states.selectedLabel = getLabel(option);
!isEqual$1(props.modelValue, optionValue) && update(optionValue);
expanded.value = false;
selectNewOption(option);
if (!option.created) clearAllNewOption();
}
focus();
};
const deleteTag = (event, option) => {
let selectedOptions = props.modelValue.slice();
const index = getValueIndex(selectedOptions, getValue(option));
if (index > -1 && !selectDisabled.value) {
selectedOptions = [...props.modelValue.slice(0, index), ...props.modelValue.slice(index + 1)];
states.cachedOptions.splice(index, 1);
update(selectedOptions);
emit("remove-tag", getValue(option));
removeNewOption(option);
}
event.stopPropagation();
focus();
};
const focus = () => {
inputRef.value?.focus();
};
const blur = () => {
if (expanded.value) {
expanded.value = false;
(0, vue.nextTick)(() => inputRef.value?.blur());
return;
}
inputRef.value?.blur();
};
const handleEsc = () => {
if (states.inputValue.length > 0) states.inputValue = "";
else expanded.value = false;
};
const getLastNotDisabledIndex = (value) => findLastIndex(value, (it) => !states.cachedOptions.some((option) => getValue(option) === it && getDisabled(option)));
const handleDel = (e) => {
const code = getEventCode(e);
if (!props.multiple) return;
if (code === EVENT_CODE.delete) return;
if (states.inputValue.length === 0) {
e.preventDefault();
const selected = props.modelValue.slice();
const lastNotDisabledIndex = getLastNotDisabledIndex(selected);
if (lastNotDisabledIndex < 0) return;
const removeTagValue = selected[lastNotDisabledIndex];
selected.splice(lastNotDisabledIndex, 1);
const option = states.cachedOptions[lastNotDisabledIndex];
states.cachedOptions.splice(lastNotDisabledIndex, 1);
removeNewOption(option);
update(selected);
emit("remove-tag", removeTagValue);
}
};
const handleClear = () => {
let emptyValue;
if (isArray$1(props.modelValue)) emptyValue = [];
else emptyValue = valueOnClear.value;
states.selectedLabel = "";
expanded.value = false;
update(emptyValue);
emit("clear");
clearAllNewOption();
focus();
};
const onKeyboardNavigate = (direction, hoveringIndex = void 0) => {
const options = filteredOptions.value;
if (!["forward", "backward"].includes(direction) || selectDisabled.value || options.length <= 0 || optionsAllDisabled.value || isComposing.value) return;
if (!expanded.value) return toggleMenu();
if (isUndefined(hoveringIndex)) hoveringIndex = states.hoveringIndex;
let newIndex = -1;
if (direction === "forward") {
newIndex = hoveringIndex + 1;
if (newIndex >= options.length) newIndex = 0;
} else if (direction === "backward") {
newIndex = hoveringIndex - 1;
if (newIndex < 0 || newIndex >= options.length) newIndex = options.length - 1;
}
const option = options[newIndex];
if (getDisabled(option) || option.type === "Group") return onKeyboardNavigate(direction, newIndex);
else {
states.hoveringIndex = newIndex;
scrollToItem(newIndex);
}
};
const onKeyboardSelect = () => {
if (!expanded.value) return toggleMenu();
else if (~states.hoveringIndex && filteredOptions.value[states.hoveringIndex]) onSelect(filteredOptions.value[states.hoveringIndex]);
};
const onHoverOption = (idx) => {
states.hoveringIndex = idx ?? -1;
};
const updateHoveringIndex = () => {
if (!props.multiple) states.hoveringIndex = filteredOptions.value.findIndex((item) => {
return getValueKey(getValue(item)) === getValueKey(props.modelValue);
});
else {
const length = props.modelValue.length;
if (length > 0) {
const lastValue = props.modelValue[length - 1];
states.hoveringIndex = filteredOptions.value.findIndex((item) => getValueKey(lastValue) === getValueKey(getValue(item)));
} else states.hoveringIndex = -1;
}
};
const onInput = (event) => {
states.inputValue = event.target.value;
if (props.remote) {
debouncing.value = true;
debouncedOnInputChange();
} else return onInputChange();
};
const handleClickOutside = (event) => {
expanded.value = false;
if (isFocused.value) handleBlur(new FocusEvent("blur", event));
};
const handleMenuEnter = () => {
states.isBeforeHide = false;
return (0, vue.nextTick)(() => {
if (~indexRef.value) scrollToItem(indexRef.value);
});
};
const scrollToItem = (index) => {
menuRef.value.scrollToItem(index);
};
const getOption = (value, cachedOptions) => {
const selectValue = getValueKey(value);
if (allOptionsValueMap.value.has(selectValue)) {
const { option } = allOptionsValueMap.value.get(selectValue);
return option;
}
if (cachedOptions && cachedOptions.length) {
const option = cachedOptions.find((option) => getValueKey(getValue(option)) === selectValue);
if (option) return option;
}
return {
[aliasProps.value.value]: value,
[aliasProps.value.label]: value
};
};
const getIndex = (option) => allOptionsValueMap.value.get(getValue(option))?.index ?? -1;
const initStates = (needUpdateSelectedLabel = false) => {
if (props.multiple) if (props.modelValue.length > 0) {
const cachedOptions = states.cachedOptions.slice();
states.cachedOptions.length = 0;
states.previousValue = props.modelValue.toString();
for (const value of props.modelValue) {
const option = getOption(value, cachedOptions);
states.cachedOptions.push(option);
}
} else {
states.cachedOptions = [];
states.previousValue = void 0;
}
else if (hasModelValue.value) {
states.previousValue = props.modelValue;
const options = filteredOptions.value;
const selectedItemIndex = options.findIndex((option) => getValueKey(getValue(option)) === getValueKey(props.modelValue));
if (~selectedItemIndex) states.selectedLabel = getLabel(options[selectedItemIndex]);
else if (!states.selectedLabel || needUpdateSelectedLabel) states.selectedLabel = getValueKey(props.modelValue);
} else {
states.selectedLabel = "";
states.previousValue = void 0;
}
clearAllNewOption();
calculatePopperSize();
};
(0, vue.watch)(() => props.fitInputWidth, () => {
calculatePopperSize();
});
(0, vue.watch)(expanded, (val) => {
if (val) {
if (!props.persistent) calculatePopperSize();
handleQueryChange("");
} else {
states.inputValue = "";
states.previousQuery = null;
states.isBeforeHide = true;
states.menuVisibleOnFocus = false;
createNewOption("");
}
});
(0, vue.watch)(() => props.modelValue, (val, oldVal) => {
if (!val || isArray$1(val) && val.length === 0 || props.multiple && !isEqual$1(val.toString(), states.previousValue) || !props.multiple && getValueKey(val) !== getValueKey(states.previousValue)) initStates(true);
if (!isEqual$1(val, oldVal) && props.validateEvent) elFormItem?.validate?.("change").catch((err) => /* @__PURE__ */ debugWarn(err));
}, { deep: true });
(0, vue.watch)(() => props.options, () => {
const input = inputRef.value;
if (!input || input && document.activeElement !== input) initStates();
}, {
deep: true,
flush: "post"
});
(0, vue.watch)(() => filteredOptions.value, () => {
calculatePopperSize();
return menuRef.value && (0, vue.nextTick)(menuRef.value.resetScrollTop);
});
(0, vue.watchEffect)(() => {
if (states.isBeforeHide) return;
updateOptions();
});
(0, vue.watchEffect)(() => {
const { valueKey, options } = props;
const duplicateValue = /* @__PURE__ */ new Map();
for (const item of options) {
const optionValue = getValue(item);
let v = optionValue;
if (isObject$1(v)) v = get(optionValue, valueKey);
if (duplicateValue.get(v)) {
/* @__PURE__ */ debugWarn("ElSelectV2", `The option values you provided seem to be duplicated, which may cause some problems, please check.`);
break;
} else duplicateValue.set(v, true);
}
});
(0, vue.onMounted)(() => {
initStates();
});
useResizeObserver(selectRef, handleResize);
useResizeObserver(selectionRef, resetSelectionWidth);
useResizeObserver(wrapperRef, updateTooltip);
useResizeObserver(tagMenuRef, updateTagTooltip);
useResizeObserver(collapseItemRef, resetCollapseItemWidth);
let stop;
(0, vue.watch)(() => dropdownMenuVisible.value, (newVal) => {
if (newVal) stop = useResizeObserver(menuRef, updateTooltip).stop;
else {
stop?.();
stop = void 0;
}
emit("visible-change", newVal);
});
return {
inputId,
collapseTagSize,
currentPlaceholder,
expanded,
emptyText,
popupHeight,
debounce,
allOptions,
allOptionsValueMap,
filteredOptions,
iconComponent,
iconReverse,
tagStyle,
collapseTagStyle,
popperSize,
dropdownMenuVisible,
hasModelValue,
shouldShowPlaceholder,
selectDisabled,
selectSize,
needStatusIcon,
showClearBtn,
states,
isFocused,
nsSelect,
nsInput,
inputRef,
menuRef,
tagMenuRef,
tooltipRef,
tagTooltipRef,
selectRef,
wrapperRef,
selectionRef,
prefixRef,
suffixRef,
collapseItemRef,
popperRef,
validateState,
validateIcon,
showTagList,
collapseTagList,
debouncedOnInputChange,
deleteTag,
getLabel,
getValue,
getDisabled,
getValueKey,
getIndex,
handleClear,
handleClickOutside,
handleDel,
handleEsc,
focus,
blur,
handleMenuEnter,
handleResize,
resetSelectionWidth,
updateTooltip,
updateTagTooltip,
updateOptions,
toggleMenu,
scrollTo: scrollToItem,
onInput,
onKeyboardNavigate,
onKeyboardSelect,
onSelect,
onHover: onHoverOption,
handleCompositionStart,
handleCompositionEnd,
handleCompositionUpdate
};
};
//#endregion
//#region ../../packages/components/select-v2/src/select.vue?vue&type=script&lang.ts
var select_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElSelectV2",
components: {
ElSelectMenu: select_dropdown_default,
ElTag,
ElTooltip,
ElIcon
},
directives: { ClickOutside },
props: selectV2Props,
emits: selectV2Emits,
setup(props, { emit }) {
const modelValue = (0, vue.computed)(() => {
const { modelValue: rawModelValue, multiple } = props;
const fallback = multiple ? [] : void 0;
if (isArray$1(rawModelValue)) return multiple ? rawModelValue : fallback;
return multiple ? fallback : rawModelValue;
});
const API = useSelect$1((0, vue.reactive)({
...(0, vue.toRefs)(props),
modelValue
}), emit);
const { calculatorRef, inputStyle } = useCalcInputWidth();
const contentId = useId();
(0, vue.provide)(selectV2InjectionKey, {
props: (0, vue.reactive)({
...(0, vue.toRefs)(props),
height: API.popupHeight,
modelValue
}),
expanded: API.expanded,
tooltipRef: API.tooltipRef,
contentId,
onSelect: API.onSelect,
onHover: API.onHover,
onKeyboardNavigate: API.onKeyboardNavigate,
onKeyboardSelect: API.onKeyboardSelect
});
const selectedLabel = (0, vue.computed)(() => {
if (!props.multiple) return API.states.selectedLabel;
return API.states.cachedOptions.map((i) => API.getLabel(i));
});
return {
...API,
modelValue,
selectedLabel,
calculatorRef,
inputStyle,
contentId,
BORDER_HORIZONTAL_WIDTH
};
}
});
//#endregion
//#region ../../packages/components/select-v2/src/select.vue
const _hoisted_1$21 = [
"id",
"value",
"autocomplete",
"tabindex",
"aria-expanded",
"aria-label",
"disabled",
"aria-controls",
"aria-activedescendant",
"readonly",
"name"
];
const _hoisted_2$13 = ["textContent"];
const _hoisted_3$5 = { key: 1 };
function _sfc_render$5(_ctx, _cache, $props, $setup, $data, $options) {
const _component_el_tag = (0, vue.resolveComponent)("el-tag");
const _component_el_tooltip = (0, vue.resolveComponent)("el-tooltip");
const _component_el_icon = (0, vue.resolveComponent)("el-icon");
const _component_el_select_menu = (0, vue.resolveComponent)("el-select-menu");
const _directive_click_outside = (0, vue.resolveDirective)("click-outside");
return (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref: "selectRef",
class: (0, vue.normalizeClass)([_ctx.nsSelect.b(), _ctx.nsSelect.m(_ctx.selectSize)]),
onMouseenter: _cache[15] || (_cache[15] = ($event) => _ctx.states.inputHovering = true),
onMouseleave: _cache[16] || (_cache[16] = ($event) => _ctx.states.inputHovering = false)
}, [(0, vue.createVNode)(_component_el_tooltip, {
ref: "tooltipRef",
visible: _ctx.dropdownMenuVisible,
teleported: _ctx.teleported,
"popper-class": [_ctx.nsSelect.e("popper"), _ctx.popperClass],
"popper-style": _ctx.popperStyle,
"gpu-acceleration": false,
"stop-popper-mouse-event": false,
"popper-options": _ctx.popperOptions,
"fallback-placements": _ctx.fallbackPlacements,
effect: _ctx.effect,
placement: _ctx.placement,
pure: "",
transition: `${_ctx.nsSelect.namespace.value}-zoom-in-top`,
trigger: "click",
persistent: _ctx.persistent,
"append-to": _ctx.appendTo,
"show-arrow": _ctx.showArrow,
offset: _ctx.offset,
onBeforeShow: _ctx.handleMenuEnter,
onHide: _cache[14] || (_cache[14] = ($event) => _ctx.states.isBeforeHide = false)
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", {
ref: "wrapperRef",
class: (0, vue.normalizeClass)([
_ctx.nsSelect.e("wrapper"),
_ctx.nsSelect.is("focused", _ctx.isFocused),
_ctx.nsSelect.is("hovering", _ctx.states.inputHovering),
_ctx.nsSelect.is("filterable", _ctx.filterable),
_ctx.nsSelect.is("disabled", _ctx.selectDisabled)
]),
onClick: _cache[11] || (_cache[11] = (0, vue.withModifiers)((...args) => _ctx.toggleMenu && _ctx.toggleMenu(...args), ["prevent"]))
}, [
_ctx.$slots.prefix ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
ref: "prefixRef",
class: (0, vue.normalizeClass)(_ctx.nsSelect.e("prefix"))
}, [(0, vue.renderSlot)(_ctx.$slots, "prefix")], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", {
ref: "selectionRef",
class: (0, vue.normalizeClass)([_ctx.nsSelect.e("selection"), _ctx.nsSelect.is("near", _ctx.multiple && !_ctx.$slots.prefix && !!_ctx.modelValue.length)])
}, [
_ctx.multiple ? (0, vue.renderSlot)(_ctx.$slots, "tag", {
key: 0,
data: _ctx.states.cachedOptions,
deleteTag: _ctx.deleteTag,
selectDisabled: _ctx.selectDisabled
}, () => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(_ctx.showTagList, (item) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: _ctx.getValueKey(_ctx.getValue(item)),
class: (0, vue.normalizeClass)(_ctx.nsSelect.e("selected-item"))
}, [(0, vue.createVNode)(_component_el_tag, {
closable: !_ctx.selectDisabled && !_ctx.getDisabled(item),
size: _ctx.collapseTagSize,
type: _ctx.tagType,
effect: _ctx.tagEffect,
"disable-transitions": "",
style: (0, vue.normalizeStyle)(_ctx.tagStyle),
onClose: ($event) => _ctx.deleteTag($event, item)
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)(_ctx.nsSelect.e("tags-text")) }, [(0, vue.renderSlot)(_ctx.$slots, "label", {
index: _ctx.getIndex(item),
label: _ctx.getLabel(item),
value: _ctx.getValue(item)
}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(_ctx.getLabel(item)), 1)])], 2)]),
_: 2
}, 1032, [
"closable",
"size",
"type",
"effect",
"style",
"onClose"
])], 2);
}), 128)), _ctx.collapseTags && _ctx.states.cachedOptions.length > _ctx.maxCollapseTags ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_tooltip, {
key: 0,
ref: "tagTooltipRef",
disabled: _ctx.dropdownMenuVisible || !_ctx.collapseTagsTooltip,
"fallback-placements": _ctx.tagTooltip?.fallbackPlacements ?? [
"bottom",
"top",
"right",
"left"
],
effect: _ctx.tagTooltip?.effect ?? _ctx.effect,
placement: _ctx.tagTooltip?.placement ?? "bottom",
"popper-class": _ctx.tagTooltip?.popperClass ?? _ctx.popperClass,
"popper-style": _ctx.tagTooltip?.popperStyle ?? _ctx.popperStyle,
teleported: _ctx.tagTooltip?.teleported ?? _ctx.teleported,
"append-to": _ctx.tagTooltip?.appendTo ?? _ctx.appendTo,
"popper-options": _ctx.tagTooltip?.popperOptions ?? _ctx.popperOptions,
transition: _ctx.tagTooltip?.transition,
"show-after": _ctx.tagTooltip?.showAfter,
"hide-after": _ctx.tagTooltip?.hideAfter,
"auto-close": _ctx.tagTooltip?.autoClose,
offset: _ctx.tagTooltip?.offset
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", {
ref: "collapseItemRef",
class: (0, vue.normalizeClass)(_ctx.nsSelect.e("selected-item"))
}, [(0, vue.createVNode)(_component_el_tag, {
closable: false,
size: _ctx.collapseTagSize,
type: _ctx.tagType,
effect: _ctx.tagEffect,
style: (0, vue.normalizeStyle)(_ctx.collapseTagStyle),
"disable-transitions": ""
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)(_ctx.nsSelect.e("tags-text")) }, " + " + (0, vue.toDisplayString)(_ctx.states.cachedOptions.length - _ctx.maxCollapseTags), 3)]),
_: 1
}, 8, [
"size",
"type",
"effect",
"style"
])], 2)]),
content: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", {
ref: "tagMenuRef",
class: (0, vue.normalizeClass)(_ctx.nsSelect.e("selection"))
}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(_ctx.collapseTagList, (selected) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: _ctx.getValueKey(_ctx.getValue(selected)),
class: (0, vue.normalizeClass)(_ctx.nsSelect.e("selected-item"))
}, [(0, vue.createVNode)(_component_el_tag, {
class: "in-tooltip",
closable: !_ctx.selectDisabled && !_ctx.getDisabled(selected),
size: _ctx.collapseTagSize,
type: _ctx.tagType,
effect: _ctx.tagEffect,
"disable-transitions": "",
onClose: ($event) => _ctx.deleteTag($event, selected)
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)(_ctx.nsSelect.e("tags-text")) }, [(0, vue.renderSlot)(_ctx.$slots, "label", {
index: _ctx.getIndex(selected),
label: _ctx.getLabel(selected),
value: _ctx.getValue(selected)
}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(_ctx.getLabel(selected)), 1)])], 2)]),
_: 2
}, 1032, [
"closable",
"size",
"type",
"effect",
"onClose"
])], 2);
}), 128))], 2)]),
_: 3
}, 8, [
"disabled",
"fallback-placements",
"effect",
"placement",
"popper-class",
"popper-style",
"teleported",
"append-to",
"popper-options",
"transition",
"show-after",
"hide-after",
"auto-close",
"offset"
])) : (0, vue.createCommentVNode)("v-if", true)]) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)([
_ctx.nsSelect.e("selected-item"),
_ctx.nsSelect.e("input-wrapper"),
_ctx.nsSelect.is("hidden", !_ctx.filterable || _ctx.selectDisabled || !_ctx.states.inputValue && !_ctx.isFocused)
]) }, [(0, vue.createElementVNode)("input", {
id: _ctx.inputId,
ref: "inputRef",
value: _ctx.states.inputValue,
style: (0, vue.normalizeStyle)(_ctx.inputStyle),
autocomplete: _ctx.autocomplete,
tabindex: _ctx.tabindex,
"aria-autocomplete": "none",
"aria-haspopup": "listbox",
autocapitalize: "off",
"aria-expanded": _ctx.expanded,
"aria-label": _ctx.ariaLabel,
class: (0, vue.normalizeClass)([_ctx.nsSelect.e("input"), _ctx.nsSelect.is(_ctx.selectSize)]),
disabled: _ctx.selectDisabled,
role: "combobox",
"aria-controls": _ctx.contentId,
"aria-activedescendant": _ctx.states.hoveringIndex >= 0 ? `${_ctx.contentId}-${_ctx.states.hoveringIndex}` : "",
readonly: !_ctx.filterable,
spellcheck: "false",
type: "text",
name: _ctx.name,
onInput: _cache[0] || (_cache[0] = (...args) => _ctx.onInput && _ctx.onInput(...args)),
onChange: _cache[1] || (_cache[1] = (0, vue.withModifiers)(() => {}, ["stop"])),
onCompositionstart: _cache[2] || (_cache[2] = (...args) => _ctx.handleCompositionStart && _ctx.handleCompositionStart(...args)),
onCompositionupdate: _cache[3] || (_cache[3] = (...args) => _ctx.handleCompositionUpdate && _ctx.handleCompositionUpdate(...args)),
onCompositionend: _cache[4] || (_cache[4] = (...args) => _ctx.handleCompositionEnd && _ctx.handleCompositionEnd(...args)),
onKeydown: [
_cache[5] || (_cache[5] = (0, vue.withKeys)((0, vue.withModifiers)(($event) => _ctx.onKeyboardNavigate("backward"), ["stop", "prevent"]), ["up"])),
_cache[6] || (_cache[6] = (0, vue.withKeys)((0, vue.withModifiers)(($event) => _ctx.onKeyboardNavigate("forward"), ["stop", "prevent"]), ["down"])),
_cache[7] || (_cache[7] = (0, vue.withKeys)((0, vue.withModifiers)((...args) => _ctx.onKeyboardSelect && _ctx.onKeyboardSelect(...args), ["stop", "prevent"]), ["enter"])),
_cache[8] || (_cache[8] = (0, vue.withKeys)((0, vue.withModifiers)((...args) => _ctx.handleEsc && _ctx.handleEsc(...args), ["stop", "prevent"]), ["esc"])),
_cache[9] || (_cache[9] = (0, vue.withKeys)((0, vue.withModifiers)((...args) => _ctx.handleDel && _ctx.handleDel(...args), ["stop"]), ["delete"]))
],
onClick: _cache[10] || (_cache[10] = (0, vue.withModifiers)((...args) => _ctx.toggleMenu && _ctx.toggleMenu(...args), ["stop"]))
}, null, 46, _hoisted_1$21), _ctx.filterable ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 0,
ref: "calculatorRef",
"aria-hidden": "true",
class: (0, vue.normalizeClass)(_ctx.nsSelect.e("input-calculator")),
textContent: (0, vue.toDisplayString)(_ctx.states.inputValue)
}, null, 10, _hoisted_2$13)) : (0, vue.createCommentVNode)("v-if", true)], 2),
_ctx.shouldShowPlaceholder ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)([
_ctx.nsSelect.e("selected-item"),
_ctx.nsSelect.e("placeholder"),
_ctx.nsSelect.is("transparent", !_ctx.hasModelValue || _ctx.expanded && !_ctx.states.inputValue)
])
}, [_ctx.hasModelValue ? (0, vue.renderSlot)(_ctx.$slots, "label", {
key: 0,
index: _ctx.allOptionsValueMap.get(_ctx.modelValue)?.index ?? -1,
label: _ctx.currentPlaceholder,
value: _ctx.modelValue
}, () => [(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(_ctx.currentPlaceholder), 1)]) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_3$5, (0, vue.toDisplayString)(_ctx.currentPlaceholder), 1))], 2)) : (0, vue.createCommentVNode)("v-if", true)
], 2),
(0, vue.createElementVNode)("div", {
ref: "suffixRef",
class: (0, vue.normalizeClass)(_ctx.nsSelect.e("suffix"))
}, [
_ctx.iconComponent ? (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_icon, {
key: 0,
class: (0, vue.normalizeClass)([
_ctx.nsSelect.e("caret"),
_ctx.nsInput.e("icon"),
_ctx.iconReverse
])
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(_ctx.iconComponent)))]),
_: 1
}, 8, ["class"])), [[vue.vShow, !_ctx.showClearBtn]]) : (0, vue.createCommentVNode)("v-if", true),
_ctx.showClearBtn && _ctx.clearIcon ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_icon, {
key: 1,
class: (0, vue.normalizeClass)([
_ctx.nsSelect.e("caret"),
_ctx.nsInput.e("icon"),
_ctx.nsSelect.e("clear")
]),
onClick: (0, vue.withModifiers)(_ctx.handleClear, ["prevent", "stop"])
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(_ctx.clearIcon)))]),
_: 1
}, 8, ["class", "onClick"])) : (0, vue.createCommentVNode)("v-if", true),
_ctx.validateState && _ctx.validateIcon && _ctx.needStatusIcon ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_icon, {
key: 2,
class: (0, vue.normalizeClass)([
_ctx.nsInput.e("icon"),
_ctx.nsInput.e("validateIcon"),
_ctx.nsInput.is("loading", _ctx.validateState === "validating")
])
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(_ctx.validateIcon)))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true)
], 2)
], 2)]),
content: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_el_select_menu, {
id: _ctx.contentId,
ref: "menuRef",
data: _ctx.filteredOptions,
width: _ctx.popperSize - _ctx.BORDER_HORIZONTAL_WIDTH,
"hovering-index": _ctx.states.hoveringIndex,
"scrollbar-always-on": _ctx.scrollbarAlwaysOn,
"aria-label": _ctx.ariaLabel
}, (0, vue.createSlots)({
default: (0, vue.withCtx)((scope) => [(0, vue.renderSlot)(_ctx.$slots, "default", (0, vue.normalizeProps)((0, vue.guardReactiveProps)(scope)))]),
_: 2
}, [
_ctx.$slots.header ? {
name: "header",
fn: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)(_ctx.nsSelect.be("dropdown", "header")),
onClick: _cache[12] || (_cache[12] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, [(0, vue.renderSlot)(_ctx.$slots, "header")], 2)]),
key: "0"
} : void 0,
_ctx.$slots.loading && _ctx.loading ? {
name: "loading",
fn: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)(_ctx.nsSelect.be("dropdown", "loading")) }, [(0, vue.renderSlot)(_ctx.$slots, "loading")], 2)]),
key: "1"
} : _ctx.loading || _ctx.filteredOptions.length === 0 ? {
name: "empty",
fn: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)(_ctx.nsSelect.be("dropdown", "empty")) }, [(0, vue.renderSlot)(_ctx.$slots, "empty", {}, () => [(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(_ctx.emptyText), 1)])], 2)]),
key: "2"
} : void 0,
_ctx.$slots.footer ? {
name: "footer",
fn: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)(_ctx.nsSelect.be("dropdown", "footer")),
onClick: _cache[13] || (_cache[13] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, [(0, vue.renderSlot)(_ctx.$slots, "footer")], 2)]),
key: "3"
} : void 0
]), 1032, [
"id",
"data",
"width",
"hovering-index",
"scrollbar-always-on",
"aria-label"
])]),
_: 3
}, 8, [
"visible",
"teleported",
"popper-class",
"popper-style",
"popper-options",
"fallback-placements",
"effect",
"placement",
"transition",
"persistent",
"append-to",
"show-arrow",
"offset",
"onBeforeShow"
])], 34)), [[
_directive_click_outside,
_ctx.handleClickOutside,
_ctx.popperRef
]]);
}
var select_default = /* @__PURE__ */ _plugin_vue_export_helper_default(select_vue_vue_type_script_lang_default, [["render", _sfc_render$5]]);
//#endregion
//#region ../../packages/components/select-v2/index.ts
const ElSelectV2 = withInstall(select_default);
//#endregion
//#region ../../packages/components/skeleton/src/skeleton.ts
/**
* @deprecated Removed after 3.0.0, Use `SkeletonProps` instead.
*/
const skeletonProps = buildProps({
animated: Boolean,
count: {
type: Number,
default: 1
},
rows: {
type: Number,
default: 3
},
loading: {
type: Boolean,
default: true
},
throttle: { type: definePropType([Number, Object]) }
});
//#endregion
//#region ../../packages/components/skeleton/src/skeleton-item.ts
/**
* @deprecated Removed after 3.0.0, Use `SkeletonItemProps` instead.
*/
const skeletonItemProps = buildProps({ variant: {
type: String,
values: [
"circle",
"rect",
"h1",
"h3",
"text",
"caption",
"p",
"image",
"button"
],
default: "text"
} });
//#endregion
//#region ../../packages/components/skeleton/src/skeleton-item.vue?vue&type=script&setup=true&lang.ts
var skeleton_item_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElSkeletonItem",
__name: "skeleton-item",
props: skeletonItemProps,
setup(__props) {
const ns = useNamespace("skeleton");
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("item"), (0, vue.unref)(ns).e(__props.variant)]) }, [__props.variant === "image" ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(picture_filled_default), { key: 0 })) : (0, vue.createCommentVNode)("v-if", true)], 2);
};
}
});
//#endregion
//#region ../../packages/components/skeleton/src/skeleton-item.vue
var skeleton_item_default = skeleton_item_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/skeleton/src/skeleton.vue?vue&type=script&setup=true&lang.ts
var skeleton_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElSkeleton",
__name: "skeleton",
props: skeletonProps,
setup(__props, { expose: __expose }) {
const props = __props;
const ns = useNamespace("skeleton");
const uiLoading = useThrottleRender((0, vue.toRef)(props, "loading"), props.throttle);
__expose({ uiLoading });
return (_ctx, _cache) => {
return (0, vue.unref)(uiLoading) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", (0, vue.mergeProps)({
key: 0,
class: [(0, vue.unref)(ns).b(), (0, vue.unref)(ns).is("animated", __props.animated)]
}, _ctx.$attrs), [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.count, (i) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: i }, [(0, vue.unref)(uiLoading) ? (0, vue.renderSlot)(_ctx.$slots, "template", { key: i }, () => [(0, vue.createVNode)(skeleton_item_default, {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).is("first")),
variant: "p"
}, null, 8, ["class"]), ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.rows, (item) => {
return (0, vue.openBlock)(), (0, vue.createBlock)(skeleton_item_default, {
key: item,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("paragraph"), (0, vue.unref)(ns).is("last", item === __props.rows && __props.rows > 1)]),
variant: "p"
}, null, 8, ["class"]);
}), 128))]) : (0, vue.createCommentVNode)("v-if", true)], 64);
}), 128))], 16)) : (0, vue.renderSlot)(_ctx.$slots, "default", (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 1 }, _ctx.$attrs)));
};
}
});
//#endregion
//#region ../../packages/components/skeleton/src/skeleton.vue
var skeleton_default = skeleton_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/skeleton/index.ts
const ElSkeleton = withInstall(skeleton_default, { SkeletonItem: skeleton_item_default });
const ElSkeletonItem = withNoopInstall(skeleton_item_default);
//#endregion
//#region ../../packages/components/slider/src/constants.ts
const sliderContextKey = Symbol("sliderContextKey");
//#endregion
//#region ../../packages/components/slider/src/slider.ts
const sliderProps = buildProps({
modelValue: {
type: definePropType([Number, Array]),
default: 0
},
id: {
type: String,
default: void 0
},
min: {
type: Number,
default: 0
},
max: {
type: Number,
default: 100
},
step: {
type: definePropType([Number, String]),
default: 1
},
showInput: Boolean,
showInputControls: {
type: Boolean,
default: true
},
size: useSizeProp,
inputSize: useSizeProp,
showStops: Boolean,
showTooltip: {
type: Boolean,
default: true
},
formatTooltip: {
type: definePropType(Function),
default: void 0
},
disabled: {
type: Boolean,
default: void 0
},
range: Boolean,
vertical: Boolean,
height: String,
rangeStartLabel: {
type: String,
default: void 0
},
rangeEndLabel: {
type: String,
default: void 0
},
formatValueText: {
type: definePropType(Function),
default: void 0
},
tooltipClass: {
type: String,
default: void 0
},
placement: {
type: String,
values: Ee,
default: "top"
},
marks: { type: definePropType(Object) },
validateEvent: {
type: Boolean,
default: true
},
persistent: {
type: Boolean,
default: true
},
...useAriaProps(["ariaLabel"])
});
const isValidValue$1 = (value) => isNumber(value) || isArray$1(value) && value.every(isNumber);
const sliderEmits = {
[UPDATE_MODEL_EVENT]: isValidValue$1,
[INPUT_EVENT]: isValidValue$1,
[CHANGE_EVENT]: isValidValue$1
};
//#endregion
//#region ../../packages/components/slider/src/composables/use-lifecycle.ts
const useLifecycle = (props, initData, resetSize) => {
const sliderWrapper = (0, vue.ref)();
(0, vue.onMounted)(async () => {
if (props.range) {
if (isArray$1(props.modelValue)) {
initData.firstValue = Math.max(props.min, props.modelValue[0]);
initData.secondValue = Math.min(props.max, props.modelValue[1]);
} else {
initData.firstValue = props.min;
initData.secondValue = props.max;
}
initData.oldValue = [initData.firstValue, initData.secondValue];
} else {
if (!isNumber(props.modelValue) || Number.isNaN(props.modelValue)) initData.firstValue = props.min;
else initData.firstValue = Math.min(props.max, Math.max(props.min, props.modelValue));
initData.oldValue = initData.firstValue;
}
useEventListener(window, "resize", resetSize);
await (0, vue.nextTick)();
resetSize();
});
return { sliderWrapper };
};
//#endregion
//#region ../../packages/components/slider/src/composables/use-marks.ts
const useMarks = (props) => {
const markList = (0, vue.computed)(() => {
if (!props.marks) return [];
return Object.keys(props.marks).map(Number.parseFloat).sort((a, b) => a - b).filter((point) => point <= props.max && point >= props.min).map((point) => ({
point,
position: (point - props.min) * 100 / (props.max - props.min),
mark: props.marks[point]
}));
});
(0, vue.watchEffect)(() => {
if (props.step === "mark" && !props.marks) /* @__PURE__ */ debugWarn("ElSlider", "marks prop must be provided when step is mark");
if (props.marks) {
const keys = Object.keys(props.marks);
const validPoints = markList.value.map((m) => m.point);
const invalidKeys = keys.filter((key) => {
const parsed = Number.parseFloat(key);
return Number.isNaN(parsed) || !validPoints.includes(parsed);
});
if (invalidKeys.length > 0) /* @__PURE__ */ debugWarn("ElSlider", `Some marks keys are invalid (not a number or out of [min, max]): [${invalidKeys.map((k) => `'${k}'`).join(", ")}] and will be ignored.`);
}
});
return markList;
};
//#endregion
//#region ../../packages/components/slider/src/composables/use-slide.ts
const useSlide = (props, initData, emit) => {
const { formItem: elFormItem } = useFormItem();
const slider = (0, vue.shallowRef)();
const firstButton = (0, vue.ref)();
const secondButton = (0, vue.ref)();
const buttonRefs = {
firstButton,
secondButton
};
const sliderDisabled = useFormDisabled();
const minValue = (0, vue.computed)(() => {
return Math.min(initData.firstValue, initData.secondValue);
});
const maxValue = (0, vue.computed)(() => {
return Math.max(initData.firstValue, initData.secondValue);
});
const barSize = (0, vue.computed)(() => {
return props.range ? `${100 * (maxValue.value - minValue.value) / (props.max - props.min)}%` : `${100 * (initData.firstValue - props.min) / (props.max - props.min)}%`;
});
const barStart = (0, vue.computed)(() => {
return props.range ? `${100 * (minValue.value - props.min) / (props.max - props.min)}%` : "0%";
});
const runwayStyle = (0, vue.computed)(() => {
return props.vertical ? { height: props.height } : {};
});
const barStyle = (0, vue.computed)(() => {
return props.vertical ? {
height: barSize.value,
bottom: barStart.value
} : {
width: barSize.value,
left: barStart.value
};
});
const resetSize = () => {
if (slider.value) initData.sliderSize = slider.value.getBoundingClientRect()[props.vertical ? "height" : "width"];
};
const getButtonRefByPercent = (percent) => {
const targetValue = props.min + percent * (props.max - props.min) / 100;
if (!props.range) return firstButton;
let buttonRefName;
if (Math.abs(minValue.value - targetValue) < Math.abs(maxValue.value - targetValue)) buttonRefName = initData.firstValue < initData.secondValue ? "firstButton" : "secondButton";
else buttonRefName = initData.firstValue > initData.secondValue ? "firstButton" : "secondButton";
return buttonRefs[buttonRefName];
};
const setPosition = (percent) => {
const buttonRef = getButtonRefByPercent(percent);
buttonRef.value.setPosition(percent);
return buttonRef;
};
const setFirstValue = (firstValue) => {
initData.firstValue = firstValue ?? props.min;
_emit(props.range ? [minValue.value, maxValue.value] : firstValue ?? props.min);
};
const setSecondValue = (secondValue) => {
initData.secondValue = secondValue;
if (props.range) _emit([minValue.value, maxValue.value]);
};
const _emit = (val) => {
emit(UPDATE_MODEL_EVENT, val);
emit(INPUT_EVENT, val);
};
const emitChange = async () => {
await (0, vue.nextTick)();
emit(CHANGE_EVENT, props.range ? [minValue.value, maxValue.value] : props.modelValue);
};
const handleSliderPointerEvent = (event) => {
if (sliderDisabled.value || initData.dragging) return;
resetSize();
let newPercent = 0;
if (props.vertical) {
const clientY = event.touches?.item(0)?.clientY ?? event.clientY;
newPercent = (slider.value.getBoundingClientRect().bottom - clientY) / initData.sliderSize * 100;
} else newPercent = ((event.touches?.item(0)?.clientX ?? event.clientX) - slider.value.getBoundingClientRect().left) / initData.sliderSize * 100;
if (newPercent < 0 || newPercent > 100) return;
return setPosition(newPercent);
};
const onSliderWrapperPrevent = (event) => {
if (buttonRefs["firstButton"].value?.dragging || buttonRefs["secondButton"].value?.dragging) event.preventDefault();
};
const onSliderDown = async (event) => {
const buttonRef = handleSliderPointerEvent(event);
if (buttonRef) {
await (0, vue.nextTick)();
buttonRef.value.onButtonDown(event);
}
};
const onSliderClick = (event) => {
if (handleSliderPointerEvent(event)) emitChange();
};
const onSliderMarkerDown = (position) => {
if (sliderDisabled.value || initData.dragging) return;
if (setPosition(position)) emitChange();
};
return {
elFormItem,
slider,
firstButton,
secondButton,
sliderDisabled,
minValue,
maxValue,
runwayStyle,
barStyle,
resetSize,
setPosition,
emitChange,
onSliderWrapperPrevent,
onSliderClick,
onSliderDown,
onSliderMarkerDown,
setFirstValue,
setSecondValue
};
};
//#endregion
//#region ../../packages/components/slider/src/composables/use-slider-button.ts
const useTooltip = (props, formatTooltip, showTooltip) => {
const tooltip = (0, vue.ref)();
const tooltipVisible = (0, vue.ref)(false);
const enableFormat = (0, vue.computed)(() => {
return formatTooltip.value instanceof Function;
});
return {
tooltip,
tooltipVisible,
formatValue: (0, vue.computed)(() => {
return enableFormat.value && formatTooltip.value(props.modelValue) || props.modelValue;
}),
displayTooltip: debounce(() => {
showTooltip.value && (tooltipVisible.value = true);
}, 50),
hideTooltip: debounce(() => {
showTooltip.value && (tooltipVisible.value = false);
}, 50)
};
};
const useSliderButton = (props, initData, emit) => {
const { disabled, min, max, step, showTooltip, persistent, precision, sliderSize, formatTooltip, emitChange, resetSize, updateDragging, markList } = (0, vue.inject)(sliderContextKey);
const { tooltip, tooltipVisible, formatValue, displayTooltip, hideTooltip } = useTooltip(props, formatTooltip, showTooltip);
const button = (0, vue.ref)();
const currentPosition = (0, vue.computed)(() => {
return `${(props.modelValue - min.value) / (max.value - min.value) * 100}%`;
});
const wrapperStyle = (0, vue.computed)(() => {
return props.vertical ? { bottom: currentPosition.value } : { left: currentPosition.value };
});
const shouldMoveToMark = (0, vue.computed)(() => {
return step.value === "mark" && markList.value.length > 0;
});
const handleMouseEnter = () => {
initData.hovering = true;
displayTooltip();
};
const handleMouseLeave = () => {
initData.hovering = false;
if (!initData.dragging) hideTooltip();
};
const onButtonDown = (event) => {
if (disabled.value) return;
event.preventDefault();
onDragStart(event);
window.addEventListener("mousemove", onDragging);
window.addEventListener("touchmove", onDragging);
window.addEventListener("mouseup", onDragEnd);
window.addEventListener("touchend", onDragEnd);
window.addEventListener("contextmenu", onDragEnd);
button.value.focus();
};
const incrementPosition = (amount) => {
if (disabled.value) return;
initData.newPosition = Number.parseFloat(currentPosition.value) + amount / (max.value - min.value) * 100;
setPosition(initData.newPosition);
emitChange();
};
const moveToMark = (amount) => {
if (disabled.value || !markList.value.length) return;
const current = props.modelValue;
const epsilon = Number.EPSILON;
const stride = Math.abs(amount);
let target;
if (amount > 0) {
const startIndex = markList.value.findIndex((m) => m.point > current + epsilon);
if (startIndex !== -1) {
const targetIndex = Math.min(startIndex + stride - 1, markList.value.length - 1);
target = markList.value[targetIndex].point;
}
} else {
let startIndex = -1;
for (let i = markList.value.length - 1; i >= 0; i--) if (markList.value[i].point < current - epsilon) {
startIndex = i;
break;
}
if (startIndex !== -1) {
const targetIndex = Math.max(startIndex - (stride - 1), 0);
target = markList.value[targetIndex].point;
}
}
if (target !== void 0 && target !== current) {
setPosition((target - min.value) / (max.value - min.value) * 100);
emitChange();
}
};
const onLeftKeyDown = () => {
if (shouldMoveToMark.value) moveToMark(-1);
else if (isNumber(step.value)) incrementPosition(-step.value);
};
const onRightKeyDown = () => {
if (shouldMoveToMark.value) moveToMark(1);
else if (isNumber(step.value)) incrementPosition(step.value);
};
const onPageDownKeyDown = () => {
if (shouldMoveToMark.value) moveToMark(-4);
else if (isNumber(step.value)) incrementPosition(-step.value * 4);
};
const onPageUpKeyDown = () => {
if (shouldMoveToMark.value) moveToMark(4);
else if (isNumber(step.value)) incrementPosition(step.value * 4);
};
const onHomeKeyDown = () => {
if (disabled.value) return;
setPosition(0);
emitChange();
};
const onEndKeyDown = () => {
if (disabled.value) return;
setPosition(100);
emitChange();
};
const onKeyDown = (event) => {
const code = getEventCode(event);
let isPreventDefault = true;
switch (code) {
case EVENT_CODE.left:
case EVENT_CODE.down:
onLeftKeyDown();
break;
case EVENT_CODE.right:
case EVENT_CODE.up:
onRightKeyDown();
break;
case EVENT_CODE.home:
onHomeKeyDown();
break;
case EVENT_CODE.end:
onEndKeyDown();
break;
case EVENT_CODE.pageDown:
onPageDownKeyDown();
break;
case EVENT_CODE.pageUp:
onPageUpKeyDown();
break;
default:
isPreventDefault = false;
break;
}
isPreventDefault && event.preventDefault();
};
const getClientXY = (event) => {
let clientX;
let clientY;
if (event.type.startsWith("touch")) {
clientY = event.touches[0].clientY;
clientX = event.touches[0].clientX;
} else {
clientY = event.clientY;
clientX = event.clientX;
}
return {
clientX,
clientY
};
};
const onDragStart = (event) => {
initData.dragging = true;
initData.isClick = true;
const { clientX, clientY } = getClientXY(event);
if (props.vertical) initData.startY = clientY;
else initData.startX = clientX;
initData.startPosition = Number.parseFloat(currentPosition.value);
initData.newPosition = initData.startPosition;
};
const onDragging = (event) => {
if (initData.dragging) {
initData.isClick = false;
displayTooltip();
resetSize();
let diff;
const { clientX, clientY } = getClientXY(event);
if (props.vertical) {
initData.currentY = clientY;
diff = (initData.startY - initData.currentY) / sliderSize.value * 100;
} else {
initData.currentX = clientX;
diff = (initData.currentX - initData.startX) / sliderSize.value * 100;
}
initData.newPosition = initData.startPosition + diff;
setPosition(initData.newPosition);
}
};
const onDragEnd = () => {
if (initData.dragging) {
setTimeout(() => {
initData.dragging = false;
if (!initData.hovering) hideTooltip();
if (!initData.isClick) setPosition(initData.newPosition);
emitChange();
}, 0);
window.removeEventListener("mousemove", onDragging);
window.removeEventListener("touchmove", onDragging);
window.removeEventListener("mouseup", onDragEnd);
window.removeEventListener("touchend", onDragEnd);
window.removeEventListener("contextmenu", onDragEnd);
}
};
const setPosition = async (newPosition) => {
if (newPosition === null || Number.isNaN(+newPosition)) return;
newPosition = clamp$1(newPosition, 0, 100);
let value;
if (step.value === "mark") if (markList.value.length === 0) value = newPosition <= 50 ? min.value : max.value;
else value = markList.value.reduce((prev, curr) => {
return Math.abs(curr.position - newPosition) < Math.abs(prev.position - newPosition) ? curr : prev;
}).point;
else {
const fullSteps = Math.floor((max.value - min.value) / step.value);
const fullRangePercentage = fullSteps * step.value / (max.value - min.value) * 100;
const threshold = fullRangePercentage + (100 - fullRangePercentage) / 2;
if (newPosition < fullRangePercentage) {
const valueBetween = fullRangePercentage / fullSteps;
const steps = Math.round(newPosition / valueBetween);
value = min.value + steps * step.value;
} else if (newPosition < threshold) value = min.value + fullSteps * step.value;
else value = max.value;
value = Number.parseFloat(value.toFixed(precision.value));
}
if (value !== props.modelValue) emit(UPDATE_MODEL_EVENT, value);
if (!initData.dragging && props.modelValue !== initData.oldValue) initData.oldValue = props.modelValue;
await (0, vue.nextTick)();
initData.dragging && displayTooltip();
tooltip.value.updatePopper();
};
(0, vue.watch)(() => initData.dragging, (val) => {
updateDragging(val);
});
useEventListener(button, "touchstart", onButtonDown, { passive: false });
return {
disabled,
button,
tooltip,
tooltipVisible,
showTooltip,
persistent,
wrapperStyle,
formatValue,
handleMouseEnter,
handleMouseLeave,
onButtonDown,
onKeyDown,
setPosition
};
};
//#endregion
//#region ../../packages/components/slider/src/composables/use-stops.ts
const useStops = (props, initData, minValue, maxValue) => {
const stops = (0, vue.computed)(() => {
if (!props.showStops || props.min > props.max) return [];
if (props.step === "mark" || props.step === 0) {
if (props.step === 0) /* @__PURE__ */ debugWarn("ElSlider", "step should not be 0.");
return [];
}
const stopCount = Math.ceil((props.max - props.min) / props.step);
const stepWidth = 100 * props.step / (props.max - props.min);
const result = Array.from({ length: stopCount - 1 }).map((_, index) => (index + 1) * stepWidth);
if (props.range) return result.filter((step) => {
return step < 100 * (minValue.value - props.min) / (props.max - props.min) || step > 100 * (maxValue.value - props.min) / (props.max - props.min);
});
else return result.filter((step) => step > 100 * (initData.firstValue - props.min) / (props.max - props.min));
});
const getStopStyle = (position) => {
return props.vertical ? { bottom: `${position}%` } : { left: `${position}%` };
};
return {
stops,
getStopStyle
};
};
//#endregion
//#region ../../packages/components/slider/src/composables/use-watch.ts
const useWatch = (props, initData, minValue, maxValue, emit, elFormItem) => {
const _emit = (val) => {
emit(UPDATE_MODEL_EVENT, val);
emit(INPUT_EVENT, val);
};
const valueChanged = () => {
if (props.range) return ![minValue.value, maxValue.value].every((item, index) => item === initData.oldValue[index]);
else return props.modelValue !== initData.oldValue;
};
const setValues = () => {
if (props.min > props.max) throwError("Slider", "min should not be greater than max.");
const val = props.modelValue;
if (props.range && isArray$1(val)) if (val[1] < props.min) _emit([props.min, props.min]);
else if (val[0] > props.max) _emit([props.max, props.max]);
else if (val[0] < props.min) _emit([props.min, val[1]]);
else if (val[1] > props.max) _emit([val[0], props.max]);
else {
initData.firstValue = val[0];
initData.secondValue = val[1];
if (valueChanged()) {
if (props.validateEvent) elFormItem?.validate?.("change").catch((err) => /* @__PURE__ */ debugWarn(err));
initData.oldValue = val.slice();
}
}
else if (!props.range && isNumber(val) && !Number.isNaN(val)) if (val < props.min) _emit(props.min);
else if (val > props.max) _emit(props.max);
else {
initData.firstValue = val;
if (valueChanged()) {
if (props.validateEvent) elFormItem?.validate?.("change").catch((err) => /* @__PURE__ */ debugWarn(err));
initData.oldValue = val;
}
}
};
setValues();
(0, vue.watch)(() => initData.dragging, (val) => {
if (!val) setValues();
});
(0, vue.watch)(() => props.modelValue, (val, oldVal) => {
if (initData.dragging || isArray$1(val) && isArray$1(oldVal) && val.every((item, index) => item === oldVal[index]) && initData.firstValue === val[0] && initData.secondValue === val[1]) return;
setValues();
}, { deep: true });
(0, vue.watch)(() => [props.min, props.max], () => {
setValues();
});
};
//#endregion
//#region ../../packages/components/slider/src/button.ts
const sliderButtonProps = buildProps({
modelValue: {
type: Number,
default: 0
},
vertical: Boolean,
tooltipClass: String,
placement: {
type: String,
values: Ee,
default: "top"
}
});
const sliderButtonEmits = { [UPDATE_MODEL_EVENT]: (value) => isNumber(value) };
//#endregion
//#region ../../packages/components/slider/src/button.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$20 = ["tabindex"];
var button_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElSliderButton",
__name: "button",
props: sliderButtonProps,
emits: sliderButtonEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const ns = useNamespace("slider");
const initData = (0, vue.reactive)({
hovering: false,
dragging: false,
isClick: false,
startX: 0,
currentX: 0,
startY: 0,
currentY: 0,
startPosition: 0,
newPosition: 0,
oldValue: props.modelValue
});
const tooltipPersistent = (0, vue.computed)(() => !showTooltip.value ? false : persistent.value);
const { disabled, button, tooltip, showTooltip, persistent, tooltipVisible, wrapperStyle, formatValue, handleMouseEnter, handleMouseLeave, onButtonDown, onKeyDown, setPosition } = useSliderButton(props, initData, emit);
const { hovering, dragging } = (0, vue.toRefs)(initData);
__expose({
onButtonDown,
onKeyDown,
setPosition,
hovering,
dragging
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref_key: "button",
ref: button,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("button-wrapper"), {
hover: (0, vue.unref)(hovering),
dragging: (0, vue.unref)(dragging)
}]),
style: (0, vue.normalizeStyle)((0, vue.unref)(wrapperStyle)),
tabindex: (0, vue.unref)(disabled) ? void 0 : 0,
onMouseenter: _cache[0] || (_cache[0] = (...args) => (0, vue.unref)(handleMouseEnter) && (0, vue.unref)(handleMouseEnter)(...args)),
onMouseleave: _cache[1] || (_cache[1] = (...args) => (0, vue.unref)(handleMouseLeave) && (0, vue.unref)(handleMouseLeave)(...args)),
onMousedown: _cache[2] || (_cache[2] = (...args) => (0, vue.unref)(onButtonDown) && (0, vue.unref)(onButtonDown)(...args)),
onFocus: _cache[3] || (_cache[3] = (...args) => (0, vue.unref)(handleMouseEnter) && (0, vue.unref)(handleMouseEnter)(...args)),
onBlur: _cache[4] || (_cache[4] = (...args) => (0, vue.unref)(handleMouseLeave) && (0, vue.unref)(handleMouseLeave)(...args)),
onKeydown: _cache[5] || (_cache[5] = (...args) => (0, vue.unref)(onKeyDown) && (0, vue.unref)(onKeyDown)(...args))
}, [(0, vue.createVNode)((0, vue.unref)(ElTooltip), {
ref_key: "tooltip",
ref: tooltip,
visible: (0, vue.unref)(tooltipVisible),
placement: _ctx.placement,
"fallback-placements": [
"top",
"bottom",
"right",
"left"
],
"stop-popper-mouse-event": false,
"popper-class": _ctx.tooltipClass,
disabled: !(0, vue.unref)(showTooltip),
persistent: tooltipPersistent.value
}, {
content: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)((0, vue.unref)(formatValue)), 1)]),
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("button"), {
hover: (0, vue.unref)(hovering),
dragging: (0, vue.unref)(dragging)
}]) }, null, 2)]),
_: 1
}, 8, [
"visible",
"placement",
"popper-class",
"disabled",
"persistent"
])], 46, _hoisted_1$20);
};
}
});
//#endregion
//#region ../../packages/components/slider/src/button.vue
var button_default = button_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/slider/src/marker.ts
const sliderMarkerProps = buildProps({ mark: {
type: definePropType([String, Object]),
default: void 0
} });
var marker_default = (0, vue.defineComponent)({
name: "ElSliderMarker",
props: sliderMarkerProps,
setup(props) {
const ns = useNamespace("slider");
const label = (0, vue.computed)(() => {
return isString(props.mark) ? props.mark : props.mark.label;
});
const style = (0, vue.computed)(() => isString(props.mark) ? void 0 : props.mark.style);
return () => (0, vue.h)("div", {
class: ns.e("marks-text"),
style: style.value
}, label.value);
}
});
//#endregion
//#region ../../packages/components/slider/src/slider.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$19 = [
"id",
"role",
"aria-label",
"aria-labelledby"
];
const _hoisted_2$12 = { key: 1 };
var slider_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElSlider",
__name: "slider",
props: sliderProps,
emits: sliderEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const ns = useNamespace("slider");
const { t } = useLocale();
const initData = (0, vue.reactive)({
firstValue: 0,
secondValue: 0,
oldValue: 0,
dragging: false,
sliderSize: 1
});
const { elFormItem, slider, firstButton, secondButton, sliderDisabled, minValue, maxValue, runwayStyle, barStyle, resetSize, emitChange, onSliderWrapperPrevent, onSliderClick, onSliderDown, onSliderMarkerDown, setFirstValue, setSecondValue } = useSlide(props, initData, emit);
const { stops, getStopStyle } = useStops(props, initData, minValue, maxValue);
const { inputId, isLabeledByFormItem } = useFormItemInputId(props, { formItemContext: elFormItem });
const sliderWrapperSize = useFormSize();
const sliderInputSize = (0, vue.computed)(() => props.inputSize || sliderWrapperSize.value);
const renderInput = (0, vue.computed)(() => {
return props.showInput && !props.range && props.step !== "mark";
});
const groupLabel = (0, vue.computed)(() => {
return props.ariaLabel || t("el.slider.defaultLabel", {
min: props.min,
max: props.max
});
});
const firstButtonLabel = (0, vue.computed)(() => {
if (props.range) return props.rangeStartLabel || t("el.slider.defaultRangeStartLabel");
else return groupLabel.value;
});
const firstValueText = (0, vue.computed)(() => {
return props.formatValueText ? props.formatValueText(firstValue.value) : `${firstValue.value}`;
});
const secondButtonLabel = (0, vue.computed)(() => {
return props.rangeEndLabel || t("el.slider.defaultRangeEndLabel");
});
const secondValueText = (0, vue.computed)(() => {
return props.formatValueText ? props.formatValueText(secondValue.value) : `${secondValue.value}`;
});
const sliderKls = (0, vue.computed)(() => [
ns.b(),
ns.m(sliderWrapperSize.value),
ns.is("vertical", props.vertical),
{ [ns.m("with-input")]: renderInput.value }
]);
const markList = useMarks(props);
useWatch(props, initData, minValue, maxValue, emit, elFormItem);
const sliderInputStep = (0, vue.computed)(() => {
return isNumber(props.step) ? props.step : 1;
});
const precision = (0, vue.computed)(() => {
const stepValue = isNumber(props.step) ? props.step : 1;
const precisions = [
props.min,
props.max,
stepValue
].map((item) => {
const decimal = `${item}`.split(".")[1];
return decimal ? decimal.length : 0;
});
return Math.max.apply(null, precisions);
});
const { sliderWrapper } = useLifecycle(props, initData, resetSize);
const { firstValue, secondValue, sliderSize } = (0, vue.toRefs)(initData);
const updateDragging = (val) => {
initData.dragging = val;
};
useEventListener(sliderWrapper, "touchstart", onSliderWrapperPrevent, { passive: false });
useEventListener(sliderWrapper, "touchmove", onSliderWrapperPrevent, { passive: false });
(0, vue.provide)(sliderContextKey, {
...(0, vue.toRefs)(props),
sliderSize,
disabled: sliderDisabled,
precision,
markList,
emitChange,
resetSize,
updateDragging
});
__expose({ onSliderClick });
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
id: _ctx.range ? (0, vue.unref)(inputId) : void 0,
ref_key: "sliderWrapper",
ref: sliderWrapper,
class: (0, vue.normalizeClass)(sliderKls.value),
role: _ctx.range ? "group" : void 0,
"aria-label": _ctx.range && !(0, vue.unref)(isLabeledByFormItem) ? groupLabel.value : void 0,
"aria-labelledby": _ctx.range && (0, vue.unref)(isLabeledByFormItem) ? (0, vue.unref)(elFormItem)?.labelId : void 0
}, [(0, vue.createElementVNode)("div", {
ref_key: "slider",
ref: slider,
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).e("runway"),
{ "show-input": renderInput.value },
(0, vue.unref)(ns).is("disabled", (0, vue.unref)(sliderDisabled))
]),
style: (0, vue.normalizeStyle)((0, vue.unref)(runwayStyle)),
onMousedown: _cache[0] || (_cache[0] = (...args) => (0, vue.unref)(onSliderDown) && (0, vue.unref)(onSliderDown)(...args)),
onTouchstartPassive: _cache[1] || (_cache[1] = (...args) => (0, vue.unref)(onSliderDown) && (0, vue.unref)(onSliderDown)(...args))
}, [
(0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("bar")),
style: (0, vue.normalizeStyle)((0, vue.unref)(barStyle))
}, null, 6),
(0, vue.createVNode)(button_default, {
id: !_ctx.range ? (0, vue.unref)(inputId) : void 0,
ref_key: "firstButton",
ref: firstButton,
"model-value": (0, vue.unref)(firstValue),
vertical: _ctx.vertical,
"tooltip-class": _ctx.tooltipClass,
placement: _ctx.placement,
role: "slider",
"aria-label": _ctx.range || !(0, vue.unref)(isLabeledByFormItem) ? firstButtonLabel.value : void 0,
"aria-labelledby": !_ctx.range && (0, vue.unref)(isLabeledByFormItem) ? (0, vue.unref)(elFormItem)?.labelId : void 0,
"aria-valuemin": _ctx.min,
"aria-valuemax": _ctx.range ? (0, vue.unref)(secondValue) : _ctx.max,
"aria-valuenow": (0, vue.unref)(firstValue),
"aria-valuetext": firstValueText.value,
"aria-orientation": _ctx.vertical ? "vertical" : "horizontal",
"aria-disabled": (0, vue.unref)(sliderDisabled),
"onUpdate:modelValue": (0, vue.unref)(setFirstValue)
}, null, 8, [
"id",
"model-value",
"vertical",
"tooltip-class",
"placement",
"aria-label",
"aria-labelledby",
"aria-valuemin",
"aria-valuemax",
"aria-valuenow",
"aria-valuetext",
"aria-orientation",
"aria-disabled",
"onUpdate:modelValue"
]),
_ctx.range ? ((0, vue.openBlock)(), (0, vue.createBlock)(button_default, {
key: 0,
ref_key: "secondButton",
ref: secondButton,
"model-value": (0, vue.unref)(secondValue),
vertical: _ctx.vertical,
"tooltip-class": _ctx.tooltipClass,
placement: _ctx.placement,
role: "slider",
"aria-label": secondButtonLabel.value,
"aria-valuemin": (0, vue.unref)(firstValue),
"aria-valuemax": _ctx.max,
"aria-valuenow": (0, vue.unref)(secondValue),
"aria-valuetext": secondValueText.value,
"aria-orientation": _ctx.vertical ? "vertical" : "horizontal",
"aria-disabled": (0, vue.unref)(sliderDisabled),
"onUpdate:modelValue": (0, vue.unref)(setSecondValue)
}, null, 8, [
"model-value",
"vertical",
"tooltip-class",
"placement",
"aria-label",
"aria-valuemin",
"aria-valuemax",
"aria-valuenow",
"aria-valuetext",
"aria-orientation",
"aria-disabled",
"onUpdate:modelValue"
])) : (0, vue.createCommentVNode)("v-if", true),
_ctx.showStops ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_2$12, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(stops), (item, key) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("stop")),
style: (0, vue.normalizeStyle)((0, vue.unref)(getStopStyle)(item))
}, null, 6);
}), 128))])) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.unref)(markList).length > 0 ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 2 }, [(0, vue.createElementVNode)("div", null, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(markList), (item, key) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key,
style: (0, vue.normalizeStyle)((0, vue.unref)(getStopStyle)(item.position)),
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("stop"), (0, vue.unref)(ns).e("marks-stop")])
}, null, 6);
}), 128))]), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("marks")) }, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(markList), (item, key) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(marker_default), {
key,
mark: item.mark,
style: (0, vue.normalizeStyle)((0, vue.unref)(getStopStyle)(item.position)),
onMousedown: (0, vue.withModifiers)(($event) => (0, vue.unref)(onSliderMarkerDown)(item.position), ["stop"])
}, null, 8, [
"mark",
"style",
"onMousedown"
]);
}), 128))], 2)], 64)) : (0, vue.createCommentVNode)("v-if", true)
], 38), renderInput.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElInputNumber), {
key: 0,
ref: "input",
"model-value": (0, vue.unref)(firstValue),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("input")),
step: sliderInputStep.value,
disabled: (0, vue.unref)(sliderDisabled),
controls: _ctx.showInputControls,
min: _ctx.min,
max: _ctx.max,
precision: precision.value,
size: sliderInputSize.value,
"onUpdate:modelValue": (0, vue.unref)(setFirstValue),
onChange: (0, vue.unref)(emitChange)
}, null, 8, [
"model-value",
"class",
"step",
"disabled",
"controls",
"min",
"max",
"precision",
"size",
"onUpdate:modelValue",
"onChange"
])) : (0, vue.createCommentVNode)("v-if", true)], 10, _hoisted_1$19);
};
}
});
//#endregion
//#region ../../packages/components/slider/src/slider.vue
var slider_default = slider_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/slider/index.ts
const ElSlider = withInstall(slider_default);
//#endregion
//#region ../../packages/components/space/src/item.ts
const spaceItemProps = buildProps({ prefixCls: { type: String } });
const SpaceItem = (0, vue.defineComponent)({
name: "ElSpaceItem",
props: spaceItemProps,
setup(props, { slots }) {
const ns = useNamespace("space");
const classes = (0, vue.computed)(() => `${props.prefixCls || ns.b()}__item`);
return () => (0, vue.h)("div", { class: classes.value }, (0, vue.renderSlot)(slots, "default"));
}
});
//#endregion
//#region ../../packages/components/space/src/use-space.ts
const SIZE_MAP = {
small: 8,
default: 12,
large: 16
};
function useSpace(props) {
const ns = useNamespace("space");
const classes = (0, vue.computed)(() => [
ns.b(),
ns.m(props.direction),
props.class
]);
const horizontalSize = (0, vue.ref)(0);
const verticalSize = (0, vue.ref)(0);
const containerStyle = (0, vue.computed)(() => {
return [
props.wrap || props.fill ? { flexWrap: "wrap" } : {},
{ alignItems: props.alignment },
{
rowGap: `${verticalSize.value}px`,
columnGap: `${horizontalSize.value}px`
},
props.style
];
});
const itemStyle = (0, vue.computed)(() => {
return props.fill ? {
flexGrow: 1,
minWidth: `${props.fillRatio}%`
} : {};
});
(0, vue.watchEffect)(() => {
const { size = "small", wrap, direction: dir, fill } = props;
if (isArray$1(size)) {
const [h = 0, v = 0] = size;
horizontalSize.value = h;
verticalSize.value = v;
} else {
let val;
if (isNumber(size)) val = size;
else val = SIZE_MAP[size || "small"] || SIZE_MAP.small;
if ((wrap || fill) && dir === "horizontal") horizontalSize.value = verticalSize.value = val;
else if (dir === "horizontal") {
horizontalSize.value = val;
verticalSize.value = 0;
} else {
verticalSize.value = val;
horizontalSize.value = 0;
}
}
});
return {
classes,
containerStyle,
itemStyle
};
}
//#endregion
//#region ../../packages/components/space/src/space.ts
const spaceProps = buildProps({
direction: {
type: String,
values: ["horizontal", "vertical"],
default: "horizontal"
},
class: {
type: definePropType([
String,
Object,
Array
]),
default: ""
},
style: {
type: definePropType([
String,
Array,
Object
]),
default: ""
},
alignment: {
type: definePropType(String),
default: "center"
},
prefixCls: { type: String },
spacer: {
type: definePropType([
Object,
String,
Number,
Array
]),
default: null,
validator: (val) => (0, vue.isVNode)(val) || isNumber(val) || isString(val)
},
wrap: Boolean,
fill: Boolean,
fillRatio: {
type: Number,
default: 100
},
size: {
type: [
String,
Array,
Number
],
values: componentSizes,
validator: (val) => {
return isNumber(val) || isArray$1(val) && val.length === 2 && val.every(isNumber);
}
}
});
const Space = (0, vue.defineComponent)({
name: "ElSpace",
props: spaceProps,
setup(props, { slots }) {
const { classes, containerStyle, itemStyle } = useSpace(props);
function extractChildren(children, parentKey = "", extractedChildren = []) {
const { prefixCls } = props;
children.forEach((child, loopKey) => {
if (isFragment(child)) {
if (isArray$1(child.children)) child.children.forEach((nested, key) => {
if (isFragment(nested) && isArray$1(nested.children)) extractChildren(nested.children, `${parentKey + key}-`, extractedChildren);
else if ((0, vue.isVNode)(nested) && nested?.type === vue.Comment) extractedChildren.push(nested);
else extractedChildren.push((0, vue.createVNode)(SpaceItem, {
style: itemStyle.value,
prefixCls,
key: `nested-${parentKey + key}`
}, { default: () => [nested] }, PatchFlags.PROPS | PatchFlags.STYLE, ["style", "prefixCls"]));
});
} else if (isValidElementNode(child)) extractedChildren.push((0, vue.createVNode)(SpaceItem, {
style: itemStyle.value,
prefixCls,
key: `LoopKey${parentKey + loopKey}`
}, { default: () => [child] }, PatchFlags.PROPS | PatchFlags.STYLE, ["style", "prefixCls"]));
});
return extractedChildren;
}
return () => {
const { spacer, direction } = props;
const children = (0, vue.renderSlot)(slots, "default", { key: 0 }, () => []);
if ((children.children ?? []).length === 0) return null;
if (isArray$1(children.children)) {
let extractedChildren = extractChildren(children.children);
if (spacer) {
const len = extractedChildren.length - 1;
extractedChildren = extractedChildren.reduce((acc, child, idx) => {
const children = [...acc, child];
if (idx !== len) children.push((0, vue.createVNode)("span", {
style: [itemStyle.value, direction === "vertical" ? "width: 100%" : null],
key: idx
}, [(0, vue.isVNode)(spacer) ? spacer : (0, vue.createTextVNode)(spacer, PatchFlags.TEXT)], PatchFlags.STYLE));
return children;
}, []);
}
return (0, vue.createVNode)("div", {
class: classes.value,
style: containerStyle.value
}, extractedChildren, PatchFlags.STYLE | PatchFlags.CLASS);
}
return children.children;
};
}
});
//#endregion
//#region ../../packages/components/space/index.ts
const ElSpace = withInstall(Space);
//#endregion
//#region ../../packages/components/statistic/src/statistic.ts
/**
* @deprecated Removed after 3.0.0, Use `StatisticProps` instead.
*/
const statisticProps = buildProps({
decimalSeparator: {
type: String,
default: "."
},
groupSeparator: {
type: String,
default: ","
},
precision: {
type: Number,
default: 0
},
formatter: Function,
value: {
type: definePropType([Number, Object]),
default: 0
},
prefix: String,
suffix: String,
title: String,
valueStyle: { type: definePropType([
String,
Object,
Array
]) }
});
//#endregion
//#region ../../packages/components/statistic/src/statistic.vue?vue&type=script&setup=true&lang.ts
var statistic_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElStatistic",
__name: "statistic",
props: statisticProps,
setup(__props, { expose: __expose }) {
const props = __props;
const ns = useNamespace("statistic");
const displayValue = (0, vue.computed)(() => {
const { value, formatter, precision, decimalSeparator, groupSeparator } = props;
if (isFunction$1(formatter)) return formatter(value);
if (!isNumber(value) || Number.isNaN(value)) return value;
let [integer, decimal = ""] = String(value).split(".");
decimal = decimal.padEnd(precision, "0").slice(0, precision > 0 ? precision : 0);
integer = integer.replace(/\B(?=(\d{3})+(?!\d))/g, groupSeparator);
return [integer, decimal].join(decimal ? decimalSeparator : "");
});
__expose({ displayValue });
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()) }, [_ctx.$slots.title || __props.title ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("head"))
}, [(0, vue.renderSlot)(_ctx.$slots, "title", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.title), 1)])], 2)) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("content")) }, [
_ctx.$slots.prefix || __props.prefix ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("prefix"))
}, [(0, vue.renderSlot)(_ctx.$slots, "prefix", {}, () => [(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(__props.prefix), 1)])], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("span", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("number")),
style: (0, vue.normalizeStyle)(__props.valueStyle)
}, (0, vue.toDisplayString)(displayValue.value), 7),
_ctx.$slots.suffix || __props.suffix ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("suffix"))
}, [(0, vue.renderSlot)(_ctx.$slots, "suffix", {}, () => [(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(__props.suffix), 1)])], 2)) : (0, vue.createCommentVNode)("v-if", true)
], 2)], 2);
};
}
});
//#endregion
//#region ../../packages/components/statistic/src/statistic.vue
var statistic_default = statistic_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/statistic/index.ts
const ElStatistic = withInstall(statistic_default);
//#endregion
//#region ../../packages/components/countdown/src/countdown.ts
/**
* @deprecated Removed after 3.0.0, Use `CountdownProps` instead.
*/
const countdownProps = buildProps({
format: {
type: String,
default: "HH:mm:ss"
},
prefix: String,
suffix: String,
title: String,
value: {
type: definePropType([Number, Object]),
default: 0
},
valueStyle: { type: definePropType([
String,
Object,
Array
]) }
});
const countdownEmits = {
finish: () => true,
[CHANGE_EVENT]: (value) => isNumber(value)
};
//#endregion
//#region ../../packages/components/countdown/src/utils.ts
const timeUnits$1 = [
["Y", 1e3 * 60 * 60 * 24 * 365],
["M", 1e3 * 60 * 60 * 24 * 30],
["D", 1e3 * 60 * 60 * 24],
["H", 1e3 * 60 * 60],
["m", 1e3 * 60],
["s", 1e3],
["S", 1]
];
const getTime = (value) => {
return isNumber(value) ? new Date(value).getTime() : value.valueOf();
};
const formatTime$1 = (timestamp, format) => {
let timeLeft = timestamp;
return timeUnits$1.reduce((current, [name, unit]) => {
const replaceRegex = new RegExp(`${name}+(?![^\\[\\]]*\\])`, "g");
if (replaceRegex.test(current)) {
const value = Math.floor(timeLeft / unit);
timeLeft -= value * unit;
return current.replace(replaceRegex, (match) => String(value).padStart(match.length, "0"));
}
return current;
}, format).replace(/\[([^\]]*)]/g, "$1");
};
//#endregion
//#region ../../packages/components/countdown/src/countdown.vue?vue&type=script&setup=true&lang.ts
var countdown_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElCountdown",
__name: "countdown",
props: countdownProps,
emits: countdownEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
let timer;
const rawValue = (0, vue.ref)(0);
const displayValue = (0, vue.computed)(() => formatTime$1(rawValue.value, props.format));
const formatter = (val) => formatTime$1(val, props.format);
const stopTimer = () => {
if (timer) {
cAF(timer);
timer = void 0;
}
};
const startTimer = () => {
const timestamp = getTime(props.value);
const frameFunc = () => {
let diff = timestamp - Date.now();
emit(CHANGE_EVENT, diff);
if (diff <= 0) {
diff = 0;
stopTimer();
emit("finish");
} else timer = rAF(frameFunc);
rawValue.value = diff;
};
timer = rAF(frameFunc);
};
(0, vue.onMounted)(() => {
rawValue.value = getTime(props.value) - Date.now();
(0, vue.watch)(() => [props.value, props.format], () => {
stopTimer();
startTimer();
}, { immediate: true });
});
(0, vue.onBeforeUnmount)(() => {
stopTimer();
});
__expose({ displayValue });
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElStatistic), {
value: rawValue.value,
title: __props.title,
prefix: __props.prefix,
suffix: __props.suffix,
"value-style": __props.valueStyle,
formatter
}, (0, vue.createSlots)({ _: 2 }, [(0, vue.renderList)(_ctx.$slots, (_, name) => {
return {
name,
fn: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, name)])
};
})]), 1032, [
"value",
"title",
"prefix",
"suffix",
"value-style"
]);
};
}
});
//#endregion
//#region ../../packages/components/countdown/src/countdown.vue
var countdown_default = countdown_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/countdown/index.ts
const ElCountdown = withInstall(countdown_default);
//#endregion
//#region ../../packages/components/steps/src/steps.ts
/**
* @deprecated Removed after 3.0.0, Use `StepsProps` instead.
*/
const stepsProps = buildProps({
space: {
type: [Number, String],
default: ""
},
active: {
type: Number,
default: 0
},
direction: {
type: String,
default: "horizontal",
values: ["horizontal", "vertical"]
},
alignCenter: { type: Boolean },
simple: { type: Boolean },
finishStatus: {
type: String,
values: [
"wait",
"process",
"finish",
"error",
"success"
],
default: "finish"
},
processStatus: {
type: String,
values: [
"wait",
"process",
"finish",
"error",
"success"
],
default: "process"
}
});
const stepsEmits = { [CHANGE_EVENT]: (newVal, oldVal) => [newVal, oldVal].every(isNumber) };
//#endregion
//#region ../../packages/components/steps/src/tokens.ts
const STEPS_INJECTION_KEY = "ElSteps";
//#endregion
//#region ../../packages/components/steps/src/steps.vue?vue&type=script&setup=true&lang.ts
var steps_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElSteps",
__name: "steps",
props: stepsProps,
emits: stepsEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const ns = useNamespace("steps");
const { children: steps, addChild: addStep, removeChild: removeStep, ChildrenSorter: StepsSorter } = useOrderedChildren((0, vue.getCurrentInstance)(), "ElStep");
(0, vue.watch)(steps, () => {
steps.value.forEach((instance, index) => {
instance.setIndex(index);
});
});
(0, vue.provide)(STEPS_INJECTION_KEY, {
props,
steps,
addStep,
removeStep
});
(0, vue.watch)(() => props.active, (newVal, oldVal) => {
emit(CHANGE_EVENT, newVal, oldVal);
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).b(), (0, vue.unref)(ns).m(__props.simple ? "simple" : __props.direction)]) }, [(0, vue.renderSlot)(_ctx.$slots, "default"), (0, vue.createVNode)((0, vue.unref)(StepsSorter))], 2);
};
}
});
//#endregion
//#region ../../packages/components/steps/src/steps.vue
var steps_default$1 = steps_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/steps/src/item.ts
/**
* @deprecated Removed after 3.0.0, Use `StepProps` instead.
*/
const stepProps = buildProps({
title: {
type: String,
default: ""
},
icon: { type: iconPropType },
description: {
type: String,
default: ""
},
status: {
type: String,
values: [
"",
"wait",
"process",
"finish",
"error",
"success"
],
default: ""
}
});
//#endregion
//#region ../../packages/components/steps/src/item.vue?vue&type=script&setup=true&lang.ts
var item_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElStep",
__name: "item",
props: stepProps,
setup(__props) {
const props = __props;
const ns = useNamespace("step");
const index = (0, vue.ref)(-1);
const lineStyle = (0, vue.ref)({});
const internalStatus = (0, vue.ref)("");
const parent = (0, vue.inject)(STEPS_INJECTION_KEY);
const currentInstance = (0, vue.getCurrentInstance)();
let stepDiff = 0;
let beforeActive = 0;
(0, vue.onMounted)(() => {
(0, vue.watch)([
() => parent.props.active,
() => parent.props.processStatus,
() => parent.props.finishStatus
], ([active], [oldActive]) => {
beforeActive = oldActive || 0;
stepDiff = active - beforeActive;
updateStatus(active);
}, { immediate: true });
});
const currentStatus = (0, vue.computed)(() => {
return props.status || internalStatus.value;
});
const prevInternalStatus = (0, vue.computed)(() => {
const prevStep = parent.steps.value[index.value - 1];
return prevStep ? prevStep.internalStatus.value : "wait";
});
const isCenter = (0, vue.computed)(() => {
return parent.props.alignCenter;
});
const isVertical = (0, vue.computed)(() => {
return parent.props.direction === "vertical";
});
const isSimple = (0, vue.computed)(() => {
return parent.props.simple;
});
const stepsCount = (0, vue.computed)(() => {
return parent.steps.value.length;
});
const isLast = (0, vue.computed)(() => {
return parent.steps.value[stepsCount.value - 1]?.uid === currentInstance.uid;
});
const space = (0, vue.computed)(() => {
return isSimple.value ? "" : parent.props.space;
});
const containerKls = (0, vue.computed)(() => {
return [
ns.b(),
ns.is(isSimple.value ? "simple" : parent.props.direction),
ns.is("flex", isLast.value && !space.value && !isCenter.value),
ns.is("center", isCenter.value && !isVertical.value && !isSimple.value)
];
});
const style = (0, vue.computed)(() => {
const style = { flexBasis: isNumber(space.value) ? `${space.value}px` : space.value ? space.value : `${100 / (stepsCount.value - (isCenter.value ? 0 : 1))}%` };
if (isVertical.value) return style;
if (isLast.value) style.maxWidth = `${100 / stepsCount.value}%`;
return style;
});
const setIndex = (val) => {
index.value = val;
};
const calcProgress = (status) => {
const isWait = status === "wait";
const style = { transitionDelay: `${Math.abs(stepDiff) === 1 ? 0 : stepDiff > 0 ? (index.value + 1 - beforeActive) * 150 : -(index.value + 1 - parent.props.active) * 150}ms` };
const step = status === parent.props.processStatus || isWait ? 0 : 100;
style.borderWidth = step && !isSimple.value ? "1px" : 0;
style[parent.props.direction === "vertical" ? "height" : "width"] = `${step}%`;
lineStyle.value = style;
};
const updateStatus = (activeIndex) => {
if (activeIndex > index.value) internalStatus.value = parent.props.finishStatus;
else if (activeIndex === index.value && prevInternalStatus.value !== "error") internalStatus.value = parent.props.processStatus;
else internalStatus.value = "wait";
const prevChild = parent.steps.value[index.value - 1];
if (prevChild) prevChild.calcProgress(internalStatus.value);
};
const stepItemState = {
uid: currentInstance.uid,
getVnode: () => currentInstance.vnode,
currentStatus,
internalStatus,
setIndex,
calcProgress
};
parent.addStep(stepItemState);
(0, vue.onBeforeUnmount)(() => {
parent.removeStep(stepItemState);
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
style: (0, vue.normalizeStyle)(style.value),
class: (0, vue.normalizeClass)(containerKls.value)
}, [
(0, vue.createCommentVNode)(" icon & line "),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("head"), (0, vue.unref)(ns).is(currentStatus.value)]) }, [!isSimple.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("line"))
}, [(0, vue.createElementVNode)("i", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("line-inner")),
style: (0, vue.normalizeStyle)(lineStyle.value)
}, null, 6)], 2)) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("icon"), (0, vue.unref)(ns).is(__props.icon || _ctx.$slots.icon ? "icon" : "text")]) }, [(0, vue.renderSlot)(_ctx.$slots, "icon", {}, () => [__props.icon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("icon-inner"))
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.icon)))]),
_: 1
}, 8, ["class"])) : currentStatus.value === "success" ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 1,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("icon-inner"), (0, vue.unref)(ns).is("status")])
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(check_default))]),
_: 1
}, 8, ["class"])) : currentStatus.value === "error" ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 2,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("icon-inner"), (0, vue.unref)(ns).is("status")])
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(close_default))]),
_: 1
}, 8, ["class"])) : !isSimple.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 3,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("icon-inner"))
}, (0, vue.toDisplayString)(index.value + 1), 3)) : (0, vue.createCommentVNode)("v-if", true)])], 2)], 2),
(0, vue.createCommentVNode)(" title & description "),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("main")) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("title"), (0, vue.unref)(ns).is(currentStatus.value)]) }, [(0, vue.renderSlot)(_ctx.$slots, "title", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.title), 1)])], 2), isSimple.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("arrow"))
}, null, 2)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("description"), (0, vue.unref)(ns).is(currentStatus.value)])
}, [(0, vue.renderSlot)(_ctx.$slots, "description", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.description), 1)])], 2))], 2)
], 6);
};
}
});
//#endregion
//#region ../../packages/components/steps/src/item.vue
var item_default = item_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/steps/index.ts
const ElSteps = withInstall(steps_default$1, { Step: item_default });
const ElStep = withNoopInstall(item_default);
//#endregion
//#region ../../packages/components/switch/src/switch.ts
/**
* @deprecated Removed after 3.0.0, Use `SwitchProps` instead.
*/
const switchProps = buildProps({
modelValue: {
type: [
Boolean,
String,
Number
],
default: false
},
disabled: {
type: Boolean,
default: void 0
},
loading: Boolean,
size: {
type: String,
validator: isValidComponentSize
},
width: {
type: [String, Number],
default: ""
},
inlinePrompt: Boolean,
inactiveActionIcon: { type: iconPropType },
activeActionIcon: { type: iconPropType },
activeIcon: { type: iconPropType },
inactiveIcon: { type: iconPropType },
activeText: {
type: String,
default: ""
},
inactiveText: {
type: String,
default: ""
},
activeValue: {
type: [
Boolean,
String,
Number
],
default: true
},
inactiveValue: {
type: [
Boolean,
String,
Number
],
default: false
},
name: {
type: String,
default: ""
},
validateEvent: {
type: Boolean,
default: true
},
beforeChange: { type: definePropType(Function) },
id: String,
tabindex: { type: [String, Number] },
...useAriaProps(["ariaLabel"])
});
const switchEmits = {
[UPDATE_MODEL_EVENT]: (val) => isBoolean(val) || isString(val) || isNumber(val),
[CHANGE_EVENT]: (val) => isBoolean(val) || isString(val) || isNumber(val),
[INPUT_EVENT]: (val) => isBoolean(val) || isString(val) || isNumber(val)
};
//#endregion
//#region ../../packages/components/switch/src/switch.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$18 = [
"id",
"aria-checked",
"aria-disabled",
"aria-label",
"name",
"true-value",
"false-value",
"disabled",
"tabindex"
];
const _hoisted_2$11 = ["aria-hidden"];
const _hoisted_3$4 = { key: 1 };
const _hoisted_4$3 = { key: 1 };
const _hoisted_5$1 = ["aria-hidden"];
const COMPONENT_NAME$6 = "ElSwitch";
var switch_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: COMPONENT_NAME$6,
__name: "switch",
props: switchProps,
emits: switchEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const { formItem } = useFormItem();
const switchSize = useFormSize();
const ns = useNamespace("switch");
const { inputId } = useFormItemInputId(props, { formItemContext: formItem });
const switchDisabled = useFormDisabled((0, vue.computed)(() => {
if (props.loading) return true;
}));
const isControlled = (0, vue.ref)(props.modelValue !== false);
const input = (0, vue.shallowRef)();
const switchKls = (0, vue.computed)(() => [
ns.b(),
ns.m(switchSize.value),
ns.is("disabled", switchDisabled.value),
ns.is("checked", checked.value)
]);
const labelLeftKls = (0, vue.computed)(() => [
ns.e("label"),
ns.em("label", "left"),
ns.is("active", !checked.value)
]);
const labelRightKls = (0, vue.computed)(() => [
ns.e("label"),
ns.em("label", "right"),
ns.is("active", checked.value)
]);
const coreStyle = (0, vue.computed)(() => ({ width: addUnit(props.width) }));
(0, vue.watch)(() => props.modelValue, () => {
isControlled.value = true;
});
const actualValue = (0, vue.computed)(() => {
return isControlled.value ? props.modelValue : false;
});
const checked = (0, vue.computed)(() => actualValue.value === props.activeValue);
if (![props.activeValue, props.inactiveValue].includes(actualValue.value)) {
emit(UPDATE_MODEL_EVENT, props.inactiveValue);
emit(CHANGE_EVENT, props.inactiveValue);
emit(INPUT_EVENT, props.inactiveValue);
}
(0, vue.watch)(checked, (val) => {
input.value.checked = val;
if (props.validateEvent) formItem?.validate?.("change").catch((err) => /* @__PURE__ */ debugWarn(err));
});
const handleChange = () => {
const val = checked.value ? props.inactiveValue : props.activeValue;
emit(UPDATE_MODEL_EVENT, val);
emit(CHANGE_EVENT, val);
emit(INPUT_EVENT, val);
(0, vue.nextTick)(() => {
input.value.checked = checked.value;
});
};
const switchValue = () => {
if (switchDisabled.value) return;
const { beforeChange } = props;
if (!beforeChange) {
handleChange();
return;
}
const shouldChange = beforeChange();
if (![isPromise(shouldChange), isBoolean(shouldChange)].includes(true)) throwError(COMPONENT_NAME$6, "beforeChange must return type `Promise<boolean>` or `boolean`");
if (isPromise(shouldChange)) shouldChange.then((result) => {
if (result) handleChange();
}).catch((e) => {
/* @__PURE__ */ debugWarn(COMPONENT_NAME$6, `some error occurred: ${e}`);
});
else if (shouldChange) handleChange();
};
const focus = () => {
input.value?.focus?.();
};
(0, vue.onMounted)(() => {
input.value.checked = checked.value;
});
__expose({
focus,
checked
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
class: (0, vue.normalizeClass)(switchKls.value),
onClick: (0, vue.withModifiers)(switchValue, ["prevent"])
}, [
(0, vue.createElementVNode)("input", {
id: (0, vue.unref)(inputId),
ref_key: "input",
ref: input,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("input")),
type: "checkbox",
role: "switch",
"aria-checked": checked.value,
"aria-disabled": (0, vue.unref)(switchDisabled),
"aria-label": __props.ariaLabel,
name: __props.name,
"true-value": __props.activeValue,
"false-value": __props.inactiveValue,
disabled: (0, vue.unref)(switchDisabled),
tabindex: __props.tabindex,
onChange: handleChange,
onKeydown: (0, vue.withKeys)(switchValue, ["enter"])
}, null, 42, _hoisted_1$18),
!__props.inlinePrompt && (__props.inactiveIcon || __props.inactiveText || _ctx.$slots.inactive) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 0,
class: (0, vue.normalizeClass)(labelLeftKls.value)
}, [(0, vue.renderSlot)(_ctx.$slots, "inactive", {}, () => [__props.inactiveIcon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), { key: 0 }, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.inactiveIcon)))]),
_: 1
})) : (0, vue.createCommentVNode)("v-if", true), !__props.inactiveIcon && __props.inactiveText ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 1,
"aria-hidden": checked.value
}, (0, vue.toDisplayString)(__props.inactiveText), 9, _hoisted_2$11)) : (0, vue.createCommentVNode)("v-if", true)])], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("span", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("core")),
style: (0, vue.normalizeStyle)(coreStyle.value)
}, [__props.inlinePrompt ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("inner"))
}, [!checked.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("inner-wrapper"))
}, [(0, vue.renderSlot)(_ctx.$slots, "inactive", {}, () => [__props.inactiveIcon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), { key: 0 }, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.inactiveIcon)))]),
_: 1
})) : (0, vue.createCommentVNode)("v-if", true), !__props.inactiveIcon && __props.inactiveText ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_3$4, (0, vue.toDisplayString)(__props.inactiveText), 1)) : (0, vue.createCommentVNode)("v-if", true)])], 2)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("inner-wrapper"))
}, [(0, vue.renderSlot)(_ctx.$slots, "active", {}, () => [__props.activeIcon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), { key: 0 }, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.activeIcon)))]),
_: 1
})) : (0, vue.createCommentVNode)("v-if", true), !__props.activeIcon && __props.activeText ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_4$3, (0, vue.toDisplayString)(__props.activeText), 1)) : (0, vue.createCommentVNode)("v-if", true)])], 2))], 2)) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("action")) }, [__props.loading ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).is("loading"))
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(loading_default))]),
_: 1
}, 8, ["class"])) : checked.value ? (0, vue.renderSlot)(_ctx.$slots, "active-action", { key: 1 }, () => [__props.activeActionIcon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), { key: 0 }, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.activeActionIcon)))]),
_: 1
})) : (0, vue.createCommentVNode)("v-if", true)]) : !checked.value ? (0, vue.renderSlot)(_ctx.$slots, "inactive-action", { key: 2 }, () => [__props.inactiveActionIcon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), { key: 0 }, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.inactiveActionIcon)))]),
_: 1
})) : (0, vue.createCommentVNode)("v-if", true)]) : (0, vue.createCommentVNode)("v-if", true)], 2)], 6),
!__props.inlinePrompt && (__props.activeIcon || __props.activeText || _ctx.$slots.active) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 1,
class: (0, vue.normalizeClass)(labelRightKls.value)
}, [(0, vue.renderSlot)(_ctx.$slots, "active", {}, () => [__props.activeIcon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), { key: 0 }, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.activeIcon)))]),
_: 1
})) : (0, vue.createCommentVNode)("v-if", true), !__props.activeIcon && __props.activeText ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 1,
"aria-hidden": !checked.value
}, (0, vue.toDisplayString)(__props.activeText), 9, _hoisted_5$1)) : (0, vue.createCommentVNode)("v-if", true)])], 2)) : (0, vue.createCommentVNode)("v-if", true)
], 2);
};
}
});
//#endregion
//#region ../../packages/components/switch/src/switch.vue
var switch_default = switch_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/switch/index.ts
const ElSwitch = withInstall(switch_default);
//#endregion
//#region ../../packages/components/table/src/util.ts
const getCell = function(event) {
return event.target?.closest("td");
};
const orderBy = function(array, sortKey, reverse, sortMethod, sortBy) {
if (!sortKey && !sortMethod && (!sortBy || isArray$1(sortBy) && !sortBy.length)) return array;
if (isString(reverse)) reverse = reverse === "descending" ? -1 : 1;
else reverse = reverse && reverse < 0 ? -1 : 1;
const getKey = sortMethod ? null : function(value, index) {
if (sortBy) return flatMap(castArray$1(sortBy), (by) => {
if (isString(by)) return get(value, by);
else return by(value, index, array);
});
if (sortKey !== "$key") {
if (isObject$1(value) && "$value" in value) value = value.$value;
}
return [isObject$1(value) ? sortKey ? get(value, sortKey) : null : value];
};
const compare = function(a, b) {
if (sortMethod) return sortMethod(a.value, b.value);
for (let i = 0, len = a.key?.length ?? 0; i < len; i++) {
if (a.key?.[i] < b.key?.[i]) return -1;
if (a.key?.[i] > b.key?.[i]) return 1;
}
return 0;
};
return array.map((value, index) => {
return {
value,
index,
key: getKey ? getKey(value, index) : null
};
}).sort((a, b) => {
let order = compare(a, b);
if (!order) order = a.index - b.index;
return order * +reverse;
}).map((item) => item.value);
};
const getColumnById = function(table, columnId) {
let column = null;
table.columns.forEach((item) => {
if (item.id === columnId) column = item;
});
return column;
};
const getColumnByKey = function(table, columnKey) {
let column = null;
for (let i = 0; i < table.columns.length; i++) {
const item = table.columns[i];
if (item.columnKey === columnKey) {
column = item;
break;
}
}
if (!column) throwError("ElTable", `No column matching with column-key: ${columnKey}`);
return column;
};
const getColumnByCell = function(table, cell, namespace) {
const matches = (cell.className || "").match(new RegExp(`${namespace}-table_[^\\s]+`, "gm"));
if (matches) return getColumnById(table, matches[0]);
return null;
};
const getRowIdentity = (row, rowKey) => {
if (!row) throw new Error("Row is required when get row identity");
if (isString(rowKey)) {
if (!rowKey.includes(".")) return `${row[rowKey]}`;
const key = rowKey.split(".");
let current = row;
for (const element of key) current = current[element];
return `${current}`;
} else if (isFunction$1(rowKey)) return rowKey.call(null, row);
return "";
};
const getKeysMap = function(array, rowKey, flatten = false, childrenKey = "children") {
const data = array || [];
const arrayMap = {};
data.forEach((row, index) => {
arrayMap[getRowIdentity(row, rowKey)] = {
row,
index
};
if (flatten) {
const children = row[childrenKey];
if (isArray$1(children)) Object.assign(arrayMap, getKeysMap(children, rowKey, true, childrenKey));
}
});
return arrayMap;
};
function mergeOptions(defaults, config) {
const options = {};
let key;
for (key in defaults) options[key] = defaults[key];
for (key in config) if (hasOwn(config, key)) {
const value = config[key];
if (!isUndefined(value)) options[key] = value;
}
return options;
}
function parseWidth(width) {
if (width === "") return width;
if (!isUndefined(width)) {
width = Number.parseInt(width, 10);
if (Number.isNaN(width)) width = "";
}
return width;
}
function parseMinWidth(minWidth) {
if (minWidth === "") return minWidth;
if (!isUndefined(minWidth)) {
minWidth = parseWidth(minWidth);
if (Number.isNaN(minWidth)) minWidth = 80;
}
return minWidth;
}
function parseHeight(height) {
if (isNumber(height)) return height;
if (isString(height)) if (/^\d+(?:px)?$/.test(height)) return Number.parseInt(height, 10);
else return height;
return null;
}
function compose(...funcs) {
if (funcs.length === 0) return (arg) => arg;
if (funcs.length === 1) return funcs[0];
return funcs.reduce((a, b) => (...args) => a(b(...args)));
}
function toggleRowStatus(statusArr, row, newVal, tableTreeProps, selectable, rowIndex, rowKey) {
let _rowIndex = rowIndex ?? 0;
let changed = false;
const getIndex = () => {
if (!rowKey) return statusArr.indexOf(row);
const id = getRowIdentity(row, rowKey);
return statusArr.findIndex((item) => getRowIdentity(item, rowKey) === id);
};
const index = getIndex();
const included = index !== -1;
const isRowSelectable = selectable?.call(null, row, _rowIndex);
const toggleStatus = (type) => {
if (type === "add") statusArr.push(row);
else statusArr.splice(index, 1);
changed = true;
};
const getChildrenCount = (row) => {
let count = 0;
const children = tableTreeProps?.children && row[tableTreeProps.children];
if (children && isArray$1(children)) {
count += children.length;
children.forEach((item) => {
count += getChildrenCount(item);
});
}
return count;
};
if (!selectable || isRowSelectable) if (isBoolean(newVal)) {
if (newVal && !included) toggleStatus("add");
else if (!newVal && included) toggleStatus("remove");
} else included ? toggleStatus("remove") : toggleStatus("add");
if (!tableTreeProps?.checkStrictly && tableTreeProps?.children && isArray$1(row[tableTreeProps.children])) row[tableTreeProps.children].forEach((item) => {
const childChanged = toggleRowStatus(statusArr, item, newVal ?? !included, tableTreeProps, selectable, _rowIndex + 1, rowKey);
_rowIndex += getChildrenCount(item) + 1;
if (childChanged) changed = childChanged;
});
return changed;
}
function walkTreeNode(root, cb, childrenKey = "children", lazyKey = "hasChildren", lazy = false) {
const isNil = (array) => !(isArray$1(array) && array.length);
function _walker(parent, children, level) {
cb(parent, children, level);
children.forEach((item) => {
if (item[lazyKey] && lazy) {
cb(item, null, level + 1);
return;
}
const children = item[childrenKey];
if (!isNil(children)) _walker(item, children, level + 1);
});
}
root.forEach((item) => {
if (item[lazyKey] && lazy) {
cb(item, null, 0);
return;
}
const children = item[childrenKey];
if (!isNil(children)) _walker(item, children, 0);
});
}
const getTableOverflowTooltipProps = (props, innerText, row, column) => {
const popperOptions = {
strategy: "fixed",
...props.popperOptions
};
const tooltipFormatterContent = isFunction$1(column?.tooltipFormatter) ? column.tooltipFormatter({
row,
column,
cellValue: getProp(row, column.property).value
}) : void 0;
if ((0, vue.isVNode)(tooltipFormatterContent)) return {
slotContent: tooltipFormatterContent,
content: null,
...props,
popperOptions
};
return {
slotContent: null,
content: tooltipFormatterContent ?? innerText,
...props,
popperOptions
};
};
let removePopper = null;
function createTablePopper(props, popperContent, row, column, trigger, table) {
const tableOverflowTooltipProps = getTableOverflowTooltipProps(props, popperContent, row, column);
const mergedProps = {
...tableOverflowTooltipProps,
slotContent: void 0
};
if (removePopper?.trigger === trigger) {
const comp = removePopper.vm?.component;
merge(comp?.props, mergedProps);
if (comp && tableOverflowTooltipProps.slotContent) comp.slots.content = () => [tableOverflowTooltipProps.slotContent];
return;
}
removePopper?.();
const parentNode = table?.refs.tableWrapper;
const ns = parentNode?.dataset.prefix;
const vm = (0, vue.createVNode)(ElTooltip, {
virtualTriggering: true,
virtualRef: trigger,
appendTo: parentNode,
placement: "top",
transition: "none",
offset: 0,
hideAfter: 0,
...mergedProps
}, tableOverflowTooltipProps.slotContent ? { content: () => tableOverflowTooltipProps.slotContent } : void 0);
vm.appContext = {
...table.appContext,
...table
};
const container = document.createElement("div");
(0, vue.render)(vm, container);
vm.component.exposed.onOpen();
const scrollContainer = parentNode?.querySelector(`.${ns}-scrollbar__wrap`);
removePopper = () => {
if (vm.component?.exposed?.onClose) vm.component.exposed.onClose();
(0, vue.render)(null, container);
const currentRemovePopper = removePopper;
scrollContainer?.removeEventListener("scroll", currentRemovePopper);
currentRemovePopper.trigger = void 0;
currentRemovePopper.vm = void 0;
removePopper = null;
};
removePopper.trigger = trigger ?? void 0;
removePopper.vm = vm;
scrollContainer?.addEventListener("scroll", removePopper);
}
function getCurrentColumns(column) {
if (column.children) return flatMap(column.children, getCurrentColumns);
else return [column];
}
function getColSpan(colSpan, column) {
return colSpan + column.colSpan;
}
const isFixedColumn = (index, fixed, store, realColumns) => {
let start = 0;
let after = index;
const columns = store.states.columns.value;
if (realColumns) {
const curColumns = getCurrentColumns(realColumns[index]);
start = columns.slice(0, columns.indexOf(curColumns[0])).reduce(getColSpan, 0);
after = start + curColumns.reduce(getColSpan, 0) - 1;
} else start = index;
let fixedLayout;
switch (fixed) {
case "left":
if (after < store.states.fixedLeafColumnsLength.value) fixedLayout = "left";
break;
case "right":
if (start >= columns.length - store.states.rightFixedLeafColumnsLength.value) fixedLayout = "right";
break;
default: if (after < store.states.fixedLeafColumnsLength.value) fixedLayout = "left";
else if (start >= columns.length - store.states.rightFixedLeafColumnsLength.value) fixedLayout = "right";
}
return fixedLayout ? {
direction: fixedLayout,
start,
after
} : {};
};
const getFixedColumnsClass = (namespace, index, fixed, store, realColumns, offset = 0) => {
const classes = [];
const { direction, start, after } = isFixedColumn(index, fixed, store, realColumns);
if (direction) {
const isLeft = direction === "left";
classes.push(`${namespace}-fixed-column--${direction}`);
if (isLeft && after + offset === store.states.fixedLeafColumnsLength.value - 1) classes.push("is-last-column");
else if (!isLeft && start - offset === store.states.columns.value.length - store.states.rightFixedLeafColumnsLength.value) classes.push("is-first-column");
}
return classes;
};
function getOffset(offset, column) {
return offset + (isNull(column.realWidth) || Number.isNaN(column.realWidth) ? Number(column.width) : column.realWidth);
}
const getFixedColumnOffset = (index, fixed, store, realColumns) => {
const { direction, start = 0, after = 0 } = isFixedColumn(index, fixed, store, realColumns);
if (!direction) return;
const styles = {};
const isLeft = direction === "left";
const columns = store.states.columns.value;
if (isLeft) styles.left = columns.slice(0, start).reduce(getOffset, 0);
else styles.right = columns.slice(after + 1).reverse().reduce(getOffset, 0);
return styles;
};
const ensurePosition = (style, key) => {
if (!style) return;
if (!Number.isNaN(style[key])) style[key] = `${style[key]}px`;
};
function ensureValidVNode(vnodes) {
return vnodes.some((child) => {
if (!(0, vue.isVNode)(child)) return true;
if (child.type === vue.Comment) return false;
if (child.type === vue.Fragment && !ensureValidVNode(child.children)) return false;
return true;
}) ? vnodes : null;
}
//#endregion
//#region ../../packages/components/table/src/store/expand.ts
function useExpand(watcherData) {
const instance = (0, vue.getCurrentInstance)();
const defaultExpandAll = (0, vue.ref)(false);
const expandRows = (0, vue.ref)([]);
const canRowExpand = (row, index) => {
const expandableFn = instance.store.states.rowExpandable.value;
return expandableFn?.(row, index) ?? true;
};
const updateExpandRows = () => {
const data = watcherData.data.value || [];
const rowKey = watcherData.rowKey.value;
if (defaultExpandAll.value) expandRows.value = instance.store.states.rowExpandable.value ? data.filter(canRowExpand) : data.slice();
else if (rowKey) {
const expandRowsMap = getKeysMap(expandRows.value, rowKey);
expandRows.value = data.filter((row, index) => {
return !!expandRowsMap[getRowIdentity(row, rowKey)] && canRowExpand(row, index);
});
} else expandRows.value = [];
};
const toggleRowExpansion = (row, expanded) => {
const rowIndex = (watcherData.data.value || []).indexOf(row);
if (rowIndex > -1 && !canRowExpand(row, rowIndex)) return;
if (toggleRowStatus(expandRows.value, row, expanded, void 0, void 0, void 0, watcherData.rowKey.value)) instance.emit("expand-change", row, expandRows.value.slice());
};
const setExpandRowKeys = (rowKeys) => {
instance.store.assertRowKey();
const data = watcherData.data.value || [];
const rowKey = watcherData.rowKey.value;
const keysMap = getKeysMap(data, rowKey);
expandRows.value = rowKeys.reduce((prev, cur) => {
const info = keysMap[cur];
if (info && canRowExpand(info.row, info.index)) prev.push(info.row);
return prev;
}, []);
};
const isRowExpanded = (row) => {
const rowKey = watcherData.rowKey.value;
if (rowKey) return !!getKeysMap(expandRows.value, rowKey)[getRowIdentity(row, rowKey)];
return expandRows.value.includes(row);
};
return {
updateExpandRows,
toggleRowExpansion,
setExpandRowKeys,
isRowExpanded,
states: {
expandRows,
defaultExpandAll
}
};
}
//#endregion
//#region ../../packages/components/table/src/store/current.ts
function useCurrent(watcherData) {
const instance = (0, vue.getCurrentInstance)();
const _currentRowKey = (0, vue.ref)(null);
const currentRow = (0, vue.ref)(null);
const setCurrentRowKey = (key) => {
instance.store.assertRowKey();
_currentRowKey.value = key;
setCurrentRowByKey(key);
};
const restoreCurrentRowKey = () => {
_currentRowKey.value = null;
};
const setCurrentRowByKey = (key) => {
const { data, rowKey } = watcherData;
const oldCurrentRow = currentRow.value;
let _currentRow = null;
if (rowKey.value) _currentRow = ((0, vue.unref)(data) || []).find((item) => getRowIdentity(item, rowKey.value) === key) ?? null;
currentRow.value = _currentRow ?? null;
instance.emit("current-change", currentRow.value, oldCurrentRow);
};
const updateCurrentRow = (_currentRow) => {
const oldCurrentRow = currentRow.value;
if (_currentRow && _currentRow !== oldCurrentRow) {
currentRow.value = _currentRow;
instance.emit("current-change", currentRow.value, oldCurrentRow);
return;
}
if (!_currentRow && oldCurrentRow) {
currentRow.value = null;
instance.emit("current-change", null, oldCurrentRow);
}
};
const updateCurrentRowData = () => {
const rowKey = watcherData.rowKey.value;
const data = watcherData.data.value || [];
const oldCurrentRow = currentRow.value;
if (oldCurrentRow && !data.includes(oldCurrentRow)) if (rowKey) setCurrentRowByKey(getRowIdentity(oldCurrentRow, rowKey));
else {
currentRow.value = null;
instance.emit("current-change", null, oldCurrentRow);
}
else if (_currentRowKey.value) {
setCurrentRowByKey(_currentRowKey.value);
restoreCurrentRowKey();
}
};
return {
setCurrentRowKey,
restoreCurrentRowKey,
setCurrentRowByKey,
updateCurrentRow,
updateCurrentRowData,
states: {
_currentRowKey,
currentRow
}
};
}
//#endregion
//#region ../../packages/components/table/src/store/tree.ts
function useTree$2(watcherData) {
const expandRowKeys = (0, vue.ref)([]);
const treeData = (0, vue.ref)({});
const indent = (0, vue.ref)(16);
const lazy = (0, vue.ref)(false);
const lazyTreeNodeMap = (0, vue.ref)({});
const lazyColumnIdentifier = (0, vue.ref)("hasChildren");
const childrenColumnName = (0, vue.ref)("children");
const checkStrictly = (0, vue.ref)(false);
const instance = (0, vue.getCurrentInstance)();
const normalizedData = (0, vue.computed)(() => {
if (!watcherData.rowKey.value) return {};
return normalize(watcherData.data.value || []);
});
const normalizedLazyNode = (0, vue.computed)(() => {
const rowKey = watcherData.rowKey.value;
const keys = Object.keys(lazyTreeNodeMap.value);
const res = {};
if (!keys.length) return res;
keys.forEach((key) => {
if (lazyTreeNodeMap.value[key].length) {
const item = { children: [] };
lazyTreeNodeMap.value[key].forEach((row) => {
const currentRowKey = getRowIdentity(row, rowKey);
item.children.push(currentRowKey);
if (row[lazyColumnIdentifier.value] && !res[currentRowKey]) res[currentRowKey] = { children: [] };
});
res[key] = item;
}
});
return res;
});
const normalize = (data) => {
const rowKey = watcherData.rowKey.value;
const res = {};
walkTreeNode(data, (parent, children, level) => {
const parentId = getRowIdentity(parent, rowKey);
if (isArray$1(children)) res[parentId] = {
children: children.map((row) => getRowIdentity(row, rowKey)),
level
};
else if (lazy.value) res[parentId] = {
children: [],
lazy: true,
level
};
}, childrenColumnName.value, lazyColumnIdentifier.value, lazy.value);
return res;
};
const updateTreeData = (ifChangeExpandRowKeys = false, ifExpandAll) => {
ifExpandAll ||= instance.store?.states.defaultExpandAll.value;
const nested = normalizedData.value;
const normalizedLazyNode_ = normalizedLazyNode.value;
const keys = Object.keys(nested);
const newTreeData = {};
if (keys.length) {
const oldTreeData = (0, vue.unref)(treeData);
const rootLazyRowKeys = [];
const getExpanded = (oldValue, key) => {
if (ifChangeExpandRowKeys) if (expandRowKeys.value) return ifExpandAll || expandRowKeys.value.includes(key);
else return !!(ifExpandAll || oldValue?.expanded);
else {
const included = ifExpandAll || expandRowKeys.value && expandRowKeys.value.includes(key);
return !!(oldValue?.expanded || included);
}
};
keys.forEach((key) => {
const oldValue = oldTreeData[key];
const newValue = { ...nested[key] };
newValue.expanded = getExpanded(oldValue, key);
if (newValue.lazy) {
const { loaded = false, loading = false } = oldValue || {};
newValue.loaded = !!loaded;
newValue.loading = !!loading;
rootLazyRowKeys.push(key);
}
newTreeData[key] = newValue;
});
const lazyKeys = Object.keys(normalizedLazyNode_);
if (lazy.value && lazyKeys.length && rootLazyRowKeys.length) lazyKeys.forEach((key) => {
const oldValue = oldTreeData[key];
const lazyNodeChildren = normalizedLazyNode_[key].children;
if (rootLazyRowKeys.includes(key)) {
if (newTreeData[key].children?.length !== 0) throw new Error("[ElTable]children must be an empty array.");
newTreeData[key].children = lazyNodeChildren;
} else {
const { loaded = false, loading = false } = oldValue || {};
newTreeData[key] = {
lazy: true,
loaded: !!loaded,
loading: !!loading,
expanded: getExpanded(oldValue, key),
children: lazyNodeChildren,
level: void 0
};
}
});
}
treeData.value = newTreeData;
instance.store?.updateTableScrollY();
};
(0, vue.watch)(() => expandRowKeys.value, () => {
updateTreeData(true);
}, { deep: true });
(0, vue.watch)(() => normalizedData.value, () => {
updateTreeData();
});
(0, vue.watch)(() => normalizedLazyNode.value, () => {
updateTreeData();
});
const updateTreeExpandKeys = (value) => {
expandRowKeys.value = value;
updateTreeData();
};
const isUseLazy = (data) => {
return lazy.value && data && "loaded" in data && !data.loaded;
};
const toggleTreeExpansion = (row, expanded) => {
instance.store.assertRowKey();
const rowKey = watcherData.rowKey.value;
const id = getRowIdentity(row, rowKey);
const data = id && treeData.value[id];
if (id && data && "expanded" in data) {
const oldExpanded = data.expanded;
expanded = isUndefined(expanded) ? !data.expanded : expanded;
treeData.value[id].expanded = expanded;
if (oldExpanded !== expanded) instance.emit("expand-change", row, expanded);
expanded && isUseLazy(data) && loadData(row, id, data);
instance.store.updateTableScrollY();
}
};
const loadOrToggle = (row) => {
instance.store.assertRowKey();
const rowKey = watcherData.rowKey.value;
const id = getRowIdentity(row, rowKey);
const data = treeData.value[id];
if (isUseLazy(data)) loadData(row, id, data);
else toggleTreeExpansion(row, void 0);
};
const loadData = (row, key, treeNode) => {
const { load } = instance.props;
if (load && !treeData.value[key].loaded) {
treeData.value[key].loading = true;
load(row, treeNode, (data) => {
if (!isArray$1(data)) throw new TypeError("[ElTable] data must be an array");
treeData.value[key].loading = false;
treeData.value[key].loaded = true;
treeData.value[key].expanded = true;
if (data.length) lazyTreeNodeMap.value[key] = data;
instance.emit("expand-change", row, true);
});
}
};
const updateKeyChildren = (key, data) => {
const { lazy, rowKey } = instance.props;
if (!lazy) return;
if (!rowKey) throw new Error("[Table] rowKey is required in updateKeyChild");
if (lazyTreeNodeMap.value[key]) lazyTreeNodeMap.value[key] = data;
};
return {
loadData,
loadOrToggle,
toggleTreeExpansion,
updateTreeExpandKeys,
updateTreeData,
updateKeyChildren,
normalize,
states: {
expandRowKeys,
treeData,
indent,
lazy,
lazyTreeNodeMap,
lazyColumnIdentifier,
childrenColumnName,
checkStrictly
}
};
}
//#endregion
//#region ../../packages/components/table/src/store/watcher.ts
const sortData = (data, states) => {
const sortingColumn = states.sortingColumn;
if (!sortingColumn || isString(sortingColumn.sortable)) return data;
return orderBy(data, states.sortProp, states.sortOrder, sortingColumn.sortMethod, sortingColumn.sortBy);
};
const doFlattenColumns = (columns) => {
const result = [];
columns.forEach((column) => {
if (column.children && column.children.length > 0) result.push.apply(result, doFlattenColumns(column.children));
else result.push(column);
});
return result;
};
function useWatcher$1() {
const instance = (0, vue.getCurrentInstance)();
const { size: tableSize } = (0, vue.toRefs)(instance.proxy?.$props);
const rowKey = (0, vue.ref)(null);
const data = (0, vue.ref)([]);
const _data = (0, vue.ref)([]);
const isComplex = (0, vue.ref)(false);
const _columns = (0, vue.ref)([]);
const originColumns = (0, vue.ref)([]);
const columns = (0, vue.ref)([]);
const fixedColumns = (0, vue.ref)([]);
const rightFixedColumns = (0, vue.ref)([]);
const leafColumns = (0, vue.ref)([]);
const fixedLeafColumns = (0, vue.ref)([]);
const rightFixedLeafColumns = (0, vue.ref)([]);
const updateOrderFns = [];
const leafColumnsLength = (0, vue.ref)(0);
const fixedLeafColumnsLength = (0, vue.ref)(0);
const rightFixedLeafColumnsLength = (0, vue.ref)(0);
const isAllSelected = (0, vue.ref)(false);
const selection = (0, vue.ref)([]);
const reserveSelection = (0, vue.ref)(false);
const selectOnIndeterminate = (0, vue.ref)(false);
const selectable = (0, vue.ref)(null);
const rowExpandable = (0, vue.ref)(null);
const filters = (0, vue.ref)({});
const filteredData = (0, vue.ref)(null);
const sortingColumn = (0, vue.ref)(null);
const sortProp = (0, vue.ref)(null);
const sortOrder = (0, vue.ref)(null);
const hoverRow = (0, vue.ref)(null);
const selectedMap = (0, vue.computed)(() => {
return rowKey.value ? getKeysMap(selection.value, rowKey.value) : void 0;
});
(0, vue.watch)(data, () => {
if (instance.state) {
scheduleLayout(false);
if (instance.props.tableLayout === "auto") instance.refs.tableHeaderRef?.updateFixedColumnStyle();
}
}, { deep: true });
const assertRowKey = () => {
if (!rowKey.value) throw new Error("[ElTable] prop row-key is required");
};
const updateChildFixed = (column) => {
column.children?.forEach((childColumn) => {
childColumn.fixed = column.fixed;
updateChildFixed(childColumn);
});
};
const updateColumns = () => {
_columns.value.forEach((column) => {
updateChildFixed(column);
});
fixedColumns.value = _columns.value.filter((column) => [true, "left"].includes(column.fixed));
const selectColumn = _columns.value.find((column) => column.type === "selection");
let selectColFixLeft;
if (selectColumn && selectColumn.fixed !== "right" && !fixedColumns.value.includes(selectColumn)) {
if (_columns.value.indexOf(selectColumn) === 0 && fixedColumns.value.length) {
fixedColumns.value.unshift(selectColumn);
selectColFixLeft = true;
}
}
rightFixedColumns.value = _columns.value.filter((column) => column.fixed === "right");
const notFixedColumns = _columns.value.filter((column) => (selectColFixLeft ? column.type !== "selection" : true) && !column.fixed);
originColumns.value = Array.from(fixedColumns.value).concat(notFixedColumns).concat(rightFixedColumns.value);
const leafColumns = doFlattenColumns(notFixedColumns);
const fixedLeafColumns = doFlattenColumns(fixedColumns.value);
const rightFixedLeafColumns = doFlattenColumns(rightFixedColumns.value);
leafColumnsLength.value = leafColumns.length;
fixedLeafColumnsLength.value = fixedLeafColumns.length;
rightFixedLeafColumnsLength.value = rightFixedLeafColumns.length;
columns.value = Array.from(fixedLeafColumns).concat(leafColumns).concat(rightFixedLeafColumns);
isComplex.value = fixedColumns.value.length > 0 || rightFixedColumns.value.length > 0;
};
const scheduleLayout = (needUpdateColumns, immediate = false) => {
if (needUpdateColumns) updateColumns();
if (immediate) instance.state.doLayout();
else instance.state.debouncedUpdateLayout();
};
const isSelected = (row) => {
if (selectedMap.value) return !!selectedMap.value[getRowIdentity(row, rowKey.value)];
else return selection.value.includes(row);
};
const clearSelection = () => {
isAllSelected.value = false;
const oldSelection = selection.value;
selection.value = [];
if (oldSelection.length) instance.emit("selection-change", []);
};
const cleanSelection = () => {
let deleted;
if (rowKey.value) {
deleted = [];
const childrenKey = instance?.store?.states?.childrenColumnName.value;
const dataMap = getKeysMap(data.value, rowKey.value, true, childrenKey);
for (const key in selectedMap.value) if (hasOwn(selectedMap.value, key) && !dataMap[key]) deleted.push(selectedMap.value[key].row);
} else deleted = selection.value.filter((item) => !data.value.includes(item));
if (deleted.length) {
const newSelection = selection.value.filter((item) => !deleted.includes(item));
selection.value = newSelection;
instance.emit("selection-change", newSelection.slice());
}
};
const getSelectionRows = () => {
return (selection.value || []).slice();
};
const toggleRowSelection = (row, selected, emitChange = true, ignoreSelectable = false) => {
const treeProps = {
children: instance?.store?.states?.childrenColumnName.value,
checkStrictly: instance?.store?.states?.checkStrictly.value
};
if (toggleRowStatus(selection.value, row, selected, treeProps, ignoreSelectable ? void 0 : selectable.value, data.value.indexOf(row), rowKey.value)) {
const newSelection = (selection.value || []).slice();
if (emitChange) instance.emit("select", newSelection, row);
instance.emit("selection-change", newSelection);
}
};
const _toggleAllSelection = () => {
const value = selectOnIndeterminate.value ? !isAllSelected.value : !(isAllSelected.value || selection.value.length);
isAllSelected.value = value;
let selectionChanged = false;
let childrenCount = 0;
const rowKey = instance?.store?.states?.rowKey.value;
const { childrenColumnName } = instance.store.states;
const treeProps = {
children: childrenColumnName.value,
checkStrictly: false
};
data.value.forEach((row, index) => {
const rowIndex = index + childrenCount;
if (toggleRowStatus(selection.value, row, value, treeProps, selectable.value, rowIndex, rowKey)) selectionChanged = true;
childrenCount += getChildrenCount(getRowIdentity(row, rowKey));
});
if (selectionChanged) instance.emit("selection-change", selection.value ? selection.value.slice() : []);
instance.emit("select-all", (selection.value || []).slice());
};
const updateAllSelected = () => {
if (data.value?.length === 0) {
isAllSelected.value = false;
return;
}
const { childrenColumnName } = instance.store.states;
let rowIndex = 0;
let selectedCount = 0;
const checkSelectedStatus = (data) => {
for (const row of data) {
const isRowSelectable = selectable.value && selectable.value.call(null, row, rowIndex);
if (!isSelected(row)) {
if (!selectable.value || isRowSelectable) return false;
} else selectedCount++;
rowIndex++;
if (row[childrenColumnName.value]?.length && !checkSelectedStatus(row[childrenColumnName.value])) return false;
}
return true;
};
const isAllSelected_ = checkSelectedStatus(data.value || []);
isAllSelected.value = selectedCount === 0 ? false : isAllSelected_;
};
const getChildrenCount = (rowKey) => {
if (!instance || !instance.store) return 0;
const { treeData } = instance.store.states;
let count = 0;
const children = treeData.value[rowKey]?.children;
if (children) {
count += children.length;
children.forEach((childKey) => {
count += getChildrenCount(childKey);
});
}
return count;
};
const updateFilters = (column, values) => {
const filters_ = {};
castArray$1(column).forEach((col) => {
filters.value[col.id] = values;
filters_[col.columnKey || col.id] = values;
});
return filters_;
};
const updateSort = (column, prop, order) => {
if (sortingColumn.value && sortingColumn.value !== column) sortingColumn.value.order = null;
sortingColumn.value = column;
sortProp.value = prop;
sortOrder.value = order;
};
const execFilter = () => {
let sourceData = (0, vue.unref)(_data);
Object.keys(filters.value).forEach((columnId) => {
const values = filters.value[columnId];
if (!values || values.length === 0) return;
const column = getColumnById({ columns: columns.value }, columnId);
if (column && column.filterMethod) sourceData = sourceData.filter((row) => {
return values.some((value) => column.filterMethod.call(null, value, row, column));
});
});
filteredData.value = sourceData;
};
const execSort = () => {
data.value = sortData(filteredData.value ?? [], {
sortingColumn: sortingColumn.value,
sortProp: sortProp.value,
sortOrder: sortOrder.value
});
};
const execQuery = (ignore = void 0) => {
if (!ignore?.filter) execFilter();
execSort();
};
const clearFilter = (columnKeys) => {
const { tableHeaderRef } = instance.refs;
if (!tableHeaderRef) return;
const panels = Object.assign({}, tableHeaderRef.filterPanels);
const keys = Object.keys(panels);
if (!keys.length) return;
if (isString(columnKeys)) columnKeys = [columnKeys];
if (isArray$1(columnKeys)) {
const columns_ = columnKeys.map((key) => getColumnByKey({ columns: columns.value }, key));
keys.forEach((key) => {
const column = columns_.find((col) => col.id === key);
if (column) column.filteredValue = [];
});
instance.store.commit("filterChange", {
column: columns_,
values: [],
silent: true,
multi: true
});
} else {
keys.forEach((key) => {
const column = columns.value.find((col) => col.id === key);
if (column) column.filteredValue = [];
});
filters.value = {};
instance.store.commit("filterChange", {
column: {},
values: [],
silent: true
});
}
};
const clearSort = () => {
if (!sortingColumn.value) return;
updateSort(null, null, null);
instance.store.commit("changeSortCondition", { silent: true });
};
const { setExpandRowKeys, toggleRowExpansion, updateExpandRows, states: expandStates, isRowExpanded } = useExpand({
data,
rowKey
});
const { updateTreeExpandKeys, toggleTreeExpansion, updateTreeData, updateKeyChildren, loadOrToggle, states: treeStates } = useTree$2({
data,
rowKey
});
const { updateCurrentRowData, updateCurrentRow, setCurrentRowKey, states: currentData } = useCurrent({
data,
rowKey
});
const setExpandRowKeysAdapter = (val) => {
setExpandRowKeys(val);
updateTreeExpandKeys(val);
};
const toggleRowExpansionAdapter = (row, expanded) => {
if (columns.value.some(({ type }) => type === "expand")) toggleRowExpansion(row, expanded);
else toggleTreeExpansion(row, expanded);
};
return {
assertRowKey,
updateColumns,
scheduleLayout,
isSelected,
clearSelection,
cleanSelection,
getSelectionRows,
toggleRowSelection,
_toggleAllSelection,
toggleAllSelection: null,
updateAllSelected,
updateFilters,
updateCurrentRow,
updateSort,
execFilter,
execSort,
execQuery,
clearFilter,
clearSort,
toggleRowExpansion,
setExpandRowKeysAdapter,
setCurrentRowKey,
toggleRowExpansionAdapter,
isRowExpanded,
updateExpandRows,
updateCurrentRowData,
loadOrToggle,
updateTreeData,
updateKeyChildren,
states: {
tableSize,
rowKey,
data,
_data,
isComplex,
_columns,
originColumns,
columns,
fixedColumns,
rightFixedColumns,
leafColumns,
fixedLeafColumns,
rightFixedLeafColumns,
updateOrderFns,
leafColumnsLength,
fixedLeafColumnsLength,
rightFixedLeafColumnsLength,
isAllSelected,
selection,
reserveSelection,
selectOnIndeterminate,
selectable,
rowExpandable,
filters,
filteredData,
sortingColumn,
sortProp,
sortOrder,
hoverRow,
...expandStates,
...treeStates,
...currentData
}
};
}
//#endregion
//#region ../../packages/components/table/src/store/index.ts
function replaceColumn(array, column) {
return array.map((item) => {
if (item.id === column.id) return column;
else if (item.children?.length) item.children = replaceColumn(item.children, column);
return item;
});
}
function sortColumn(array) {
array.forEach((item) => {
item.no = item.getColumnIndex?.();
if (item.children?.length) sortColumn(item.children);
});
array.sort((cur, pre) => cur.no - pre.no);
}
function useStore() {
const instance = (0, vue.getCurrentInstance)();
const watcher = useWatcher$1();
const ns = useNamespace("table");
const { t } = useLocale();
const mutations = {
setData(states, data) {
const dataInstanceChanged = (0, vue.unref)(states._data) !== data;
states.data.value = data;
states._data.value = data;
instance.store.execQuery();
instance.store.updateCurrentRowData();
instance.store.updateExpandRows();
instance.store.updateTreeData(instance.store.states.defaultExpandAll.value);
if ((0, vue.unref)(states.reserveSelection)) instance.store.assertRowKey();
else if (dataInstanceChanged) instance.store.clearSelection();
else instance.store.cleanSelection();
instance.store.updateAllSelected();
if (instance.$ready) instance.store.scheduleLayout();
},
insertColumn(states, column, parent, updateColumnOrder) {
const array = (0, vue.unref)(states._columns);
let newColumns = [];
if (!parent) {
array.push(column);
newColumns = array;
} else {
if (parent && !parent.children) parent.children = [];
parent.children?.push(column);
newColumns = replaceColumn(array, parent);
}
sortColumn(newColumns);
states._columns.value = newColumns;
states.updateOrderFns.push(updateColumnOrder);
if (column.type === "selection") {
states.selectable.value = column.selectable;
states.reserveSelection.value = column.reserveSelection;
}
if (instance.$ready) {
instance.store.updateColumns();
instance.store.scheduleLayout();
}
},
updateColumnOrder(states, column) {
if (column.getColumnIndex?.() === column.no) return;
sortColumn(states._columns.value);
if (instance.$ready) instance.store.updateColumns();
},
removeColumn(states, column, parent, updateColumnOrder) {
const array = (0, vue.unref)(states._columns) || [];
if (parent) {
parent.children?.splice(parent.children.findIndex((item) => item.id === column.id), 1);
(0, vue.nextTick)(() => {
if (parent.children?.length === 0) delete parent.children;
});
states._columns.value = replaceColumn(array, parent);
} else {
const index = array.indexOf(column);
if (index > -1) {
array.splice(index, 1);
states._columns.value = array;
}
}
const updateFnIndex = states.updateOrderFns.indexOf(updateColumnOrder);
updateFnIndex > -1 && states.updateOrderFns.splice(updateFnIndex, 1);
if (instance.$ready) {
instance.store.updateColumns();
instance.store.scheduleLayout();
}
},
sort(states, options) {
const { prop, order, init } = options;
if (prop) {
const column = (0, vue.unref)(states.columns).find((column) => column.property === prop);
if (column) {
column.order = order;
instance.store.updateSort(column, prop, order);
instance.store.commit("changeSortCondition", { init });
}
}
},
changeSortCondition(states, options) {
const { sortingColumn, sortProp, sortOrder } = states;
const columnValue = (0, vue.unref)(sortingColumn), propValue = (0, vue.unref)(sortProp), orderValue = (0, vue.unref)(sortOrder);
if (isNull(orderValue)) {
states.sortingColumn.value = null;
states.sortProp.value = null;
}
instance.store.execQuery({ filter: true });
if (!options || !(options.silent || options.init)) instance.emit("sort-change", {
column: columnValue,
prop: propValue,
order: orderValue
});
instance.store.updateTableScrollY();
},
filterChange(_states, options) {
const { column, values, silent } = options;
const newFilters = instance.store.updateFilters(column, values);
instance.store.execQuery();
if (!silent) instance.emit("filter-change", newFilters);
instance.store.updateTableScrollY();
},
toggleAllSelection() {
instance.store.toggleAllSelection?.();
},
rowSelectedChanged(_states, row) {
instance.store.toggleRowSelection(row);
instance.store.updateAllSelected();
},
setHoverRow(states, row) {
states.hoverRow.value = row;
},
setCurrentRow(_states, row) {
instance.store.updateCurrentRow(row);
}
};
const commit = function(name, ...args) {
const mutations = instance.store.mutations;
if (mutations[name]) mutations[name].apply(instance, [instance.store.states, ...args]);
else throw new Error(`Action not found: ${name}`);
};
const updateTableScrollY = function() {
(0, vue.nextTick)(() => instance.layout.updateScrollY.apply(instance.layout));
};
return {
ns,
t,
...watcher,
mutations,
commit,
updateTableScrollY
};
}
//#endregion
//#region ../../packages/components/table/src/store/helper.ts
const InitialStateMap = {
rowKey: "rowKey",
defaultExpandAll: "defaultExpandAll",
rowExpandable: "rowExpandable",
selectOnIndeterminate: "selectOnIndeterminate",
indent: "indent",
lazy: "lazy",
["treeProps.hasChildren"]: {
key: "lazyColumnIdentifier",
default: "hasChildren"
},
["treeProps.children"]: {
key: "childrenColumnName",
default: "children"
},
["treeProps.checkStrictly"]: {
key: "checkStrictly",
default: false
}
};
function createStore(table, props) {
if (!table) throw new Error("Table is required.");
const store = useStore();
store.toggleAllSelection = debounce(store._toggleAllSelection, 10);
Object.keys(InitialStateMap).forEach((key) => {
handleValue(getArrKeysValue(props, key), key, store);
});
proxyTableProps(store, props);
return store;
}
function proxyTableProps(store, props) {
Object.keys(InitialStateMap).forEach((key) => {
(0, vue.watch)(() => getArrKeysValue(props, key), (value) => {
handleValue(value, key, store);
});
});
}
function handleValue(value, propsKey, store) {
let newVal = value;
let storeKey = InitialStateMap[propsKey];
if (isObject$1(storeKey)) {
newVal = newVal || storeKey.default;
storeKey = storeKey.key;
}
store.states[storeKey].value = newVal;
}
function getArrKeysValue(props, key) {
if (key.includes(".")) {
const keyList = key.split(".");
let value = props;
keyList.forEach((k) => {
value = value[k];
});
return value;
} else return props[key];
}
//#endregion
//#region ../../packages/components/table/src/table-layout.ts
var TableLayout = class {
constructor(options) {
this.observers = [];
this.table = null;
this.store = null;
this.columns = [];
this.fit = true;
this.showHeader = true;
this.height = (0, vue.ref)(null);
this.scrollX = (0, vue.ref)(false);
this.scrollY = (0, vue.ref)(false);
this.bodyWidth = (0, vue.ref)(null);
this.fixedWidth = (0, vue.ref)(null);
this.rightFixedWidth = (0, vue.ref)(null);
this.gutterWidth = 0;
for (const name in options) if (hasOwn(options, name)) if ((0, vue.isRef)(this[name])) this[name].value = options[name];
else this[name] = options[name];
if (!this.table) throw new Error("Table is required for Table Layout");
if (!this.store) throw new Error("Store is required for Table Layout");
}
updateScrollY() {
const height = this.height.value;
/**
* When the height is not initialized, it is null.
* After the table is initialized, when the height is not configured, the height is 0.
*/
if (isNull(height)) return false;
const scrollBarRef = this.table.refs.scrollBarRef;
if (this.table.vnode.el && scrollBarRef?.wrapRef) {
let scrollY = true;
const prevScrollY = this.scrollY.value;
scrollY = scrollBarRef.wrapRef.scrollHeight > scrollBarRef.wrapRef.clientHeight;
this.scrollY.value = scrollY;
return prevScrollY !== scrollY;
}
return false;
}
setHeight(value, prop = "height") {
if (!isClient) return;
const el = this.table.vnode.el;
value = parseHeight(value);
this.height.value = Number(value);
if (!el && (value || value === 0)) {
(0, vue.nextTick)(() => this.setHeight(value, prop));
return;
}
if (el && isNumber(value)) {
el.style[prop] = `${value}px`;
this.updateElsHeight();
} else if (el && isString(value)) {
el.style[prop] = value;
this.updateElsHeight();
}
}
setMaxHeight(value) {
this.setHeight(value, "max-height");
}
getFlattenColumns() {
const flattenColumns = [];
this.table.store.states.columns.value.forEach((column) => {
if (column.isColumnGroup) flattenColumns.push.apply(flattenColumns, column.columns);
else flattenColumns.push(column);
});
return flattenColumns;
}
updateElsHeight() {
this.updateScrollY();
this.notifyObservers("scrollable");
}
headerDisplayNone(elm) {
if (!elm) return true;
let headerChild = elm;
while (headerChild.tagName !== "DIV") {
if (getComputedStyle(headerChild).display === "none") return true;
headerChild = headerChild.parentElement;
}
return false;
}
updateColumnsWidth() {
if (!isClient) return;
const fit = this.fit;
const bodyWidth = this.table.vnode.el?.clientWidth;
let bodyMinWidth = 0;
const flattenColumns = this.getFlattenColumns();
const flexColumns = flattenColumns.filter((column) => !isNumber(column.width));
flattenColumns.forEach((column) => {
if (isNumber(column.width) && column.realWidth) column.realWidth = null;
});
if (flexColumns.length > 0 && fit) {
flattenColumns.forEach((column) => {
bodyMinWidth += Number(column.width || column.minWidth || 80);
});
if (bodyMinWidth <= bodyWidth) {
this.scrollX.value = false;
const totalFlexWidth = bodyWidth - bodyMinWidth;
if (flexColumns.length === 1) flexColumns[0].realWidth = Number(flexColumns[0].minWidth || 80) + totalFlexWidth;
else {
const flexWidthPerPixel = totalFlexWidth / flexColumns.reduce((prev, column) => prev + Number(column.minWidth || 80), 0);
let noneFirstWidth = 0;
flexColumns.forEach((column, index) => {
if (index === 0) return;
const flexWidth = Math.floor(Number(column.minWidth || 80) * flexWidthPerPixel);
noneFirstWidth += flexWidth;
column.realWidth = Number(column.minWidth || 80) + flexWidth;
});
flexColumns[0].realWidth = Number(flexColumns[0].minWidth || 80) + totalFlexWidth - noneFirstWidth;
}
} else {
this.scrollX.value = true;
flexColumns.forEach((column) => {
column.realWidth = Number(column.minWidth);
});
}
this.bodyWidth.value = Math.max(bodyMinWidth, bodyWidth);
this.table.state.resizeState.value.width = this.bodyWidth.value;
} else {
flattenColumns.forEach((column) => {
if (!column.width && !column.minWidth) column.realWidth = 80;
else column.realWidth = Number(column.width || column.minWidth);
bodyMinWidth += column.realWidth;
});
this.scrollX.value = bodyMinWidth > bodyWidth;
this.bodyWidth.value = bodyMinWidth;
}
const fixedColumns = this.store.states.fixedColumns.value;
if (fixedColumns.length > 0) {
let fixedWidth = 0;
fixedColumns.forEach((column) => {
fixedWidth += Number(column.realWidth || column.width);
});
this.fixedWidth.value = fixedWidth;
}
const rightFixedColumns = this.store.states.rightFixedColumns.value;
if (rightFixedColumns.length > 0) {
let rightFixedWidth = 0;
rightFixedColumns.forEach((column) => {
rightFixedWidth += Number(column.realWidth || column.width);
});
this.rightFixedWidth.value = rightFixedWidth;
}
this.notifyObservers("columns");
}
addObserver(observer) {
this.observers.push(observer);
}
removeObserver(observer) {
const index = this.observers.indexOf(observer);
if (index !== -1) this.observers.splice(index, 1);
}
notifyObservers(event) {
this.observers.forEach((observer) => {
switch (event) {
case "columns":
observer.state?.onColumnsChange(this);
break;
case "scrollable":
observer.state?.onScrollableChange(this);
break;
default: throw new Error(`Table Layout don't have event ${event}.`);
}
});
}
};
//#endregion
//#region ../../packages/components/table/src/filter-panel.vue?vue&type=script&lang.ts
var filter_panel_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElTableFilterPanel",
components: {
ElCheckbox,
ElCheckboxGroup,
ElScrollbar,
ElTooltip,
ElIcon,
ArrowDown: arrow_down_default,
ArrowUp: arrow_up_default
},
props: {
placement: {
type: String,
default: "bottom-start"
},
store: { type: Object },
column: { type: Object },
upDataColumn: { type: Function },
appendTo: useTooltipContentProps.appendTo
},
setup(props) {
const instance = (0, vue.getCurrentInstance)();
const { t } = useLocale();
const ns = useNamespace("table-filter");
const parent = instance?.parent;
if (props.column && !parent.filterPanels.value[props.column.id]) parent.filterPanels.value[props.column.id] = instance;
const tooltipRef = (0, vue.ref)(null);
const rootRef = (0, vue.ref)(null);
const checkedIndex = (0, vue.ref)(0);
const filters = (0, vue.computed)(() => {
return props.column && props.column.filters;
});
const filterClassName = (0, vue.computed)(() => {
if (props.column && props.column.filterClassName) return `${ns.b()} ${props.column.filterClassName}`;
return ns.b();
});
const filterValue = (0, vue.computed)({
get: () => (props.column?.filteredValue || [])[0],
set: (value) => {
if (filteredValue.value) if (!isPropAbsent(value)) filteredValue.value.splice(0, 1, value);
else filteredValue.value.splice(0, 1);
}
});
const filteredValue = (0, vue.computed)({
get() {
if (props.column) return props.column.filteredValue || [];
return [];
},
set(value) {
if (props.column) props.upDataColumn?.("filteredValue", value);
}
});
const multiple = (0, vue.computed)(() => {
if (props.column) return props.column.filterMultiple;
return true;
});
const isActive = (filter) => {
return filter.value === filterValue.value;
};
const hidden = () => {
tooltipRef.value?.onClose();
};
const handleConfirm = () => {
confirmFilter(filteredValue.value);
hidden();
};
const handleReset = () => {
filteredValue.value = [];
confirmFilter(filteredValue.value);
hidden();
};
const handleSelect = (_filterValue, index) => {
filterValue.value = _filterValue;
checkedIndex.value = index;
if (!isPropAbsent(_filterValue)) confirmFilter(filteredValue.value);
else confirmFilter([]);
hidden();
};
const confirmFilter = (filteredValue) => {
props.store?.commit("filterChange", {
column: props.column,
values: filteredValue
});
props.store?.updateAllSelected();
};
const handleShowTooltip = () => {
rootRef.value?.focus();
!multiple.value && initCheckedIndex();
if (props.column) props.upDataColumn?.("filterOpened", true);
};
const handleHideTooltip = () => {
if (props.column) props.upDataColumn?.("filterOpened", false);
};
const initCheckedIndex = () => {
if (isPropAbsent(filterValue)) {
checkedIndex.value = 0;
return;
}
const idx = (filters.value || []).findIndex((item) => {
return item.value === filterValue.value;
});
checkedIndex.value = idx >= 0 ? idx + 1 : 0;
};
const handleKeydown = (event) => {
const code = getEventCode(event);
const len = (filters.value ? filters.value.length : 0) + 1;
let index = checkedIndex.value;
let isPreventDefault = true;
switch (code) {
case EVENT_CODE.down:
case EVENT_CODE.right:
index = (index + 1) % len;
break;
case EVENT_CODE.up:
case EVENT_CODE.left:
index = (index - 1 + len) % len;
break;
case EVENT_CODE.tab:
hidden();
isPreventDefault = false;
break;
case EVENT_CODE.enter:
case EVENT_CODE.space:
if (index === 0) handleSelect(null, 0);
else {
const item = (filters.value || [])[index - 1];
item.value && handleSelect(item.value, index);
}
break;
default:
isPreventDefault = false;
break;
}
isPreventDefault && event.preventDefault();
checkedIndex.value = index;
rootRef.value?.querySelector(`.${ns.e("list-item")}:nth-child(${index + 1})`)?.focus();
};
return {
multiple,
filterClassName,
filteredValue,
filterValue,
filters,
handleConfirm,
handleReset,
handleSelect,
isPropAbsent,
isActive,
t,
ns,
tooltipRef,
rootRef,
checkedIndex,
handleShowTooltip,
handleHideTooltip,
handleKeydown
};
}
});
//#endregion
//#region ../../packages/components/table/src/filter-panel.vue
const _hoisted_1$17 = ["disabled"];
const _hoisted_2$10 = ["tabindex", "aria-checked"];
const _hoisted_3$3 = [
"tabindex",
"aria-checked",
"onClick"
];
const _hoisted_4$2 = ["aria-label"];
function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
const _component_el_checkbox = (0, vue.resolveComponent)("el-checkbox");
const _component_el_checkbox_group = (0, vue.resolveComponent)("el-checkbox-group");
const _component_el_scrollbar = (0, vue.resolveComponent)("el-scrollbar");
const _component_arrow_up = (0, vue.resolveComponent)("arrow-up");
const _component_arrow_down = (0, vue.resolveComponent)("arrow-down");
const _component_el_icon = (0, vue.resolveComponent)("el-icon");
const _component_el_tooltip = (0, vue.resolveComponent)("el-tooltip");
return (0, vue.openBlock)(), (0, vue.createBlock)(_component_el_tooltip, {
ref: "tooltipRef",
offset: 0,
placement: _ctx.placement,
"show-arrow": false,
trigger: "click",
role: "dialog",
teleported: "",
effect: "light",
pure: "",
loop: "",
"popper-class": _ctx.filterClassName,
persistent: "",
"append-to": _ctx.appendTo,
onShow: _ctx.handleShowTooltip,
onHide: _ctx.handleHideTooltip
}, {
content: (0, vue.withCtx)(() => [_ctx.multiple ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
ref: "rootRef",
tabindex: "-1",
class: (0, vue.normalizeClass)(_ctx.ns.e("multiple"))
}, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)(_ctx.ns.e("content")) }, [(0, vue.createVNode)(_component_el_scrollbar, { "wrap-class": _ctx.ns.e("wrap") }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_el_checkbox_group, {
modelValue: _ctx.filteredValue,
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.filteredValue = $event),
class: (0, vue.normalizeClass)(_ctx.ns.e("checkbox-group"))
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(_ctx.filters, (filter) => {
return (0, vue.openBlock)(), (0, vue.createBlock)(_component_el_checkbox, {
key: filter.value,
value: filter.value
}, {
default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)(filter.text), 1)]),
_: 2
}, 1032, ["value"]);
}), 128))]),
_: 1
}, 8, ["modelValue", "class"])]),
_: 1
}, 8, ["wrap-class"])], 2), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)(_ctx.ns.e("bottom")) }, [(0, vue.createElementVNode)("button", {
class: (0, vue.normalizeClass)(_ctx.ns.is("disabled", _ctx.filteredValue.length === 0)),
disabled: _ctx.filteredValue.length === 0,
type: "button",
onClick: _cache[1] || (_cache[1] = (...args) => _ctx.handleConfirm && _ctx.handleConfirm(...args))
}, (0, vue.toDisplayString)(_ctx.t("el.table.confirmFilter")), 11, _hoisted_1$17), (0, vue.createElementVNode)("button", {
type: "button",
onClick: _cache[2] || (_cache[2] = (...args) => _ctx.handleReset && _ctx.handleReset(...args))
}, (0, vue.toDisplayString)(_ctx.t("el.table.resetFilter")), 1)], 2)], 2)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("ul", {
key: 1,
ref: "rootRef",
tabindex: "-1",
role: "radiogroup",
class: (0, vue.normalizeClass)(_ctx.ns.e("list")),
onKeydown: _cache[4] || (_cache[4] = (...args) => _ctx.handleKeydown && _ctx.handleKeydown(...args))
}, [(0, vue.createElementVNode)("li", {
role: "radio",
class: (0, vue.normalizeClass)([_ctx.ns.e("list-item"), _ctx.ns.is("active", _ctx.isPropAbsent(_ctx.filterValue))]),
tabindex: _ctx.checkedIndex === 0 ? 0 : -1,
"aria-checked": _ctx.isPropAbsent(_ctx.filterValue),
onClick: _cache[3] || (_cache[3] = ($event) => _ctx.handleSelect(null, 0))
}, (0, vue.toDisplayString)(_ctx.t("el.table.clearFilter")), 11, _hoisted_2$10), ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(_ctx.filters, (filter, idx) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
key: filter.value,
role: "radio",
class: (0, vue.normalizeClass)([_ctx.ns.e("list-item"), _ctx.ns.is("active", _ctx.isActive(filter))]),
tabindex: _ctx.checkedIndex === idx + 1 ? 0 : -1,
"aria-checked": _ctx.isActive(filter),
onClick: ($event) => _ctx.handleSelect(filter.value, idx + 1)
}, (0, vue.toDisplayString)(filter.text), 11, _hoisted_3$3);
}), 128))], 34))]),
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("button", {
type: "button",
class: (0, vue.normalizeClass)(`${_ctx.ns.namespace.value}-table__column-filter-trigger`),
"aria-label": _ctx.t("el.table.filterLabel", { column: _ctx.column?.label || "" })
}, [(0, vue.createVNode)(_component_el_icon, null, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "filter-icon", {}, () => [_ctx.column?.filterOpened ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_arrow_up, { key: 0 })) : ((0, vue.openBlock)(), (0, vue.createBlock)(_component_arrow_down, { key: 1 }))])]),
_: 3
})], 10, _hoisted_4$2)]),
_: 3
}, 8, [
"placement",
"popper-class",
"append-to",
"onShow",
"onHide"
]);
}
var filter_panel_default = /* @__PURE__ */ _plugin_vue_export_helper_default(filter_panel_vue_vue_type_script_lang_default, [["render", _sfc_render$4]]);
//#endregion
//#region ../../packages/components/table/src/layout-observer.ts
function useLayoutObserver(root) {
const instance = (0, vue.getCurrentInstance)();
(0, vue.onBeforeMount)(() => {
tableLayout.value.addObserver(instance);
});
(0, vue.onMounted)(() => {
onColumnsChange(tableLayout.value);
onScrollableChange(tableLayout.value);
});
(0, vue.onUpdated)(() => {
onColumnsChange(tableLayout.value);
onScrollableChange(tableLayout.value);
});
(0, vue.onUnmounted)(() => {
tableLayout.value.removeObserver(instance);
});
const tableLayout = (0, vue.computed)(() => {
const layout = root.layout;
if (!layout) throw new Error("Can not find table layout.");
return layout;
});
const onColumnsChange = (layout) => {
const cols = root.vnode.el?.querySelectorAll("colgroup > col") || [];
if (!cols.length) return;
const flattenColumns = layout.getFlattenColumns();
const columnsMap = {};
flattenColumns.forEach((column) => {
columnsMap[column.id] = column;
});
for (let i = 0, j = cols.length; i < j; i++) {
const col = cols[i];
const column = columnsMap[col.getAttribute("name")];
if (column) col.setAttribute("width", column.realWidth || column.width);
}
};
const onScrollableChange = (layout) => {
const cols = root.vnode.el?.querySelectorAll("colgroup > col[name=gutter]") || [];
for (let i = 0, j = cols.length; i < j; i++) cols[i].setAttribute("width", layout.scrollY.value ? layout.gutterWidth : "0");
const ths = root.vnode.el?.querySelectorAll("th.gutter") || [];
for (let i = 0, j = ths.length; i < j; i++) {
const th = ths[i];
th.style.width = layout.scrollY.value ? `${layout.gutterWidth}px` : "0";
th.style.display = layout.scrollY.value ? "" : "none";
}
};
return {
tableLayout: tableLayout.value,
onColumnsChange,
onScrollableChange
};
}
//#endregion
//#region ../../packages/components/table/src/tokens.ts
const TABLE_INJECTION_KEY = Symbol("ElTable");
//#endregion
//#region ../../packages/components/table/src/table-header/event-helper.ts
function useEvent(props, emit) {
const instance = (0, vue.getCurrentInstance)();
const parent = (0, vue.inject)(TABLE_INJECTION_KEY);
const handleFilterClick = (event) => {
event.stopPropagation();
};
const handleHeaderClick = (event, column) => {
if (!column.filters && column.sortable) handleSortClick(event, column, false);
else if (column.filterable && !column.sortable) handleFilterClick(event);
parent?.emit("header-click", column, event);
};
const handleHeaderContextMenu = (event, column) => {
parent?.emit("header-contextmenu", column, event);
};
const draggingColumn = (0, vue.ref)(null);
const dragging = (0, vue.ref)(false);
const dragState = (0, vue.ref)();
const handleMouseDown = (event, column) => {
if (!isClient) return;
if (column.children && column.children.length > 0) return;
/* istanbul ignore if */
if (draggingColumn.value && props.border && draggingColumn.value.id === column.id) {
dragging.value = true;
const table = parent;
emit("set-drag-visible", true);
const tableLeft = (table?.vnode.el)?.getBoundingClientRect().left;
const columnEl = instance?.vnode?.el?.querySelector(`th.${column.id}`);
const columnRect = columnEl.getBoundingClientRect();
const minLeft = columnRect.left - tableLeft + 30;
addClass(columnEl, "noclick");
dragState.value = {
startMouseLeft: event.clientX,
startLeft: columnRect.right - tableLeft,
startColumnLeft: columnRect.left - tableLeft,
tableLeft
};
const resizeProxy = table?.refs.resizeProxy;
resizeProxy.style.left = `${dragState.value.startLeft}px`;
document.onselectstart = function() {
return false;
};
document.ondragstart = function() {
return false;
};
const handleMouseMove = (event) => {
const deltaLeft = event.clientX - dragState.value.startMouseLeft;
const proxyLeft = dragState.value.startLeft + deltaLeft;
resizeProxy.style.left = `${Math.max(minLeft, proxyLeft)}px`;
};
const handleMouseUp = () => {
if (dragging.value) {
const { startColumnLeft, startLeft } = dragState.value;
column.width = column.realWidth = Number.parseInt(resizeProxy.style.left, 10) - startColumnLeft;
table?.emit("header-dragend", column.width, startLeft - startColumnLeft, column, event);
requestAnimationFrame(() => {
props.store.scheduleLayout(false, true);
});
document.body.style.cursor = "";
dragging.value = false;
draggingColumn.value = null;
dragState.value = void 0;
emit("set-drag-visible", false);
}
document.removeEventListener("mousemove", handleMouseMove);
document.removeEventListener("mouseup", handleMouseUp);
document.onselectstart = null;
document.ondragstart = null;
setTimeout(() => {
removeClass(columnEl, "noclick");
}, 0);
};
document.addEventListener("mousemove", handleMouseMove);
document.addEventListener("mouseup", handleMouseUp);
}
};
const handleMouseMove = (event, column) => {
if (!props.border || column.children && column.children.length > 0) return;
const el = event.target;
const target = isElement$1(el) ? el.closest("th") : null;
if (!target) return;
const isSortable = hasClass(target, "is-sortable");
if (isSortable) {
const cursor = dragging.value ? "col-resize" : "";
target.style.cursor = cursor;
const caret = target.querySelector(".caret-wrapper");
if (caret) caret.style.cursor = cursor;
}
if (!column.resizable || dragging.value) {
draggingColumn.value = null;
return;
}
const rect = target.getBoundingClientRect();
const isLastTh = target.parentNode?.lastElementChild === target;
const allowDrag = props.allowDragLastColumn || !isLastTh;
const isResizeHandleActive = rect.width > 12 && rect.right - event.clientX < 8 && allowDrag;
const cursor = isResizeHandleActive ? "col-resize" : "";
document.body.style.cursor = cursor;
draggingColumn.value = isResizeHandleActive ? column : null;
if (isSortable) target.style.cursor = cursor;
};
const handleMouseOut = () => {
if (!isClient || dragging.value) return;
document.body.style.cursor = "";
};
const toggleOrder = ({ order, sortOrders }) => {
if (order === "") return sortOrders[0];
const index = sortOrders.indexOf(order || null);
return sortOrders[index > sortOrders.length - 2 ? 0 : index + 1];
};
const handleSortClick = (event, column, givenOrder) => {
event.stopPropagation();
const order = column.order === givenOrder ? null : givenOrder || toggleOrder(column);
const target = event.target?.closest("th");
if (target) {
if (hasClass(target, "noclick")) {
removeClass(target, "noclick");
return;
}
}
if (!column.sortable) return;
const clickTarget = event.currentTarget;
if (["ascending", "descending"].some((str) => hasClass(clickTarget, str) && !column.sortOrders.includes(str))) return;
const states = props.store.states;
let sortProp = states.sortProp.value;
let sortOrder;
const sortingColumn = states.sortingColumn.value;
if (sortingColumn !== column || sortingColumn === column && isNull(sortingColumn.order)) {
if (sortingColumn) sortingColumn.order = null;
states.sortingColumn.value = column;
sortProp = column.property;
}
if (!order) sortOrder = column.order = null;
else sortOrder = column.order = order;
states.sortProp.value = sortProp;
states.sortOrder.value = sortOrder;
parent?.store.commit("changeSortCondition");
};
return {
handleHeaderClick,
handleHeaderContextMenu,
handleMouseDown,
handleMouseMove,
handleMouseOut,
handleSortClick,
handleFilterClick
};
}
//#endregion
//#region ../../packages/components/table/src/table-header/style.helper.ts
function useStyle$2(props) {
const parent = (0, vue.inject)(TABLE_INJECTION_KEY);
const ns = useNamespace("table");
const getHeaderRowStyle = (rowIndex) => {
const headerRowStyle = parent?.props.headerRowStyle;
if (isFunction$1(headerRowStyle)) return headerRowStyle.call(null, { rowIndex });
return headerRowStyle;
};
const getHeaderRowClass = (rowIndex) => {
const classes = [];
const headerRowClassName = parent?.props.headerRowClassName;
if (isString(headerRowClassName)) classes.push(headerRowClassName);
else if (isFunction$1(headerRowClassName)) classes.push(headerRowClassName.call(null, { rowIndex }));
return classes.join(" ");
};
const getHeaderCellStyle = (rowIndex, columnIndex, row, column) => {
let headerCellStyles = parent?.props.headerCellStyle ?? {};
if (isFunction$1(headerCellStyles)) headerCellStyles = headerCellStyles.call(null, {
rowIndex,
columnIndex,
row,
column
});
const fixedStyle = getFixedColumnOffset(columnIndex, column.fixed, props.store, row);
ensurePosition(fixedStyle, "left");
ensurePosition(fixedStyle, "right");
return Object.assign({}, headerCellStyles, fixedStyle);
};
const getHeaderCellClass = (rowIndex, columnIndex, row, column) => {
const fixedClasses = getFixedColumnsClass(ns.b(), columnIndex, column.fixed, props.store, row);
const classes = [
column.id,
column.order,
column.headerAlign,
column.className,
column.labelClassName,
...fixedClasses
];
if (!column.children) classes.push("is-leaf");
if (column.sortable) classes.push("is-sortable");
const headerCellClassName = parent?.props.headerCellClassName;
if (isString(headerCellClassName)) classes.push(headerCellClassName);
else if (isFunction$1(headerCellClassName)) classes.push(headerCellClassName.call(null, {
rowIndex,
columnIndex,
row,
column
}));
classes.push(ns.e("cell"));
return classes.filter((className) => Boolean(className)).join(" ");
};
return {
getHeaderRowStyle,
getHeaderRowClass,
getHeaderCellStyle,
getHeaderCellClass
};
}
//#endregion
//#region ../../packages/components/table/src/table-header/utils-helper.ts
const getAllColumns = (columns) => {
const result = [];
columns.forEach((column) => {
if (column.children) {
result.push(column);
result.push.apply(result, getAllColumns(column.children));
} else result.push(column);
});
return result;
};
const convertToRows = (originColumns) => {
let maxLevel = 1;
const traverse = (column, parent) => {
if (parent) {
column.level = parent.level + 1;
if (maxLevel < column.level) maxLevel = column.level;
}
if (column.children) {
let colSpan = 0;
column.children.forEach((subColumn) => {
traverse(subColumn, column);
colSpan += subColumn.colSpan;
});
column.colSpan = colSpan;
} else column.colSpan = 1;
};
originColumns.forEach((column) => {
column.level = 1;
traverse(column, void 0);
});
const rows = [];
for (let i = 0; i < maxLevel; i++) rows.push([]);
getAllColumns(originColumns).forEach((column) => {
if (!column.children) column.rowSpan = maxLevel - column.level + 1;
else {
column.rowSpan = 1;
column.children.forEach((col) => col.isSubColumn = true);
}
rows[column.level - 1].push(column);
});
return rows;
};
function useUtils$1(props) {
const parent = (0, vue.inject)(TABLE_INJECTION_KEY);
const columnRows = (0, vue.computed)(() => {
return convertToRows(props.store.states.originColumns.value);
});
const isGroup = (0, vue.computed)(() => {
const result = columnRows.value.length > 1;
if (result && parent) parent.state.isGroup.value = true;
return result;
});
const toggleAllSelection = (event) => {
event.stopPropagation();
parent?.store.commit("toggleAllSelection");
};
return {
isGroup,
toggleAllSelection,
columnRows
};
}
//#endregion
//#region ../../packages/components/table/src/table-header/index.ts
var table_header_default = (0, vue.defineComponent)({
name: "ElTableHeader",
components: { ElCheckbox },
props: {
fixed: {
type: String,
default: ""
},
store: {
required: true,
type: Object
},
border: Boolean,
defaultSort: {
type: Object,
default: () => {
return {
prop: "",
order: ""
};
}
},
appendFilterPanelTo: { type: String },
allowDragLastColumn: { type: Boolean }
},
setup(props, { emit }) {
const instance = (0, vue.getCurrentInstance)();
const parent = (0, vue.inject)(TABLE_INJECTION_KEY);
const ns = useNamespace("table");
const filterPanels = (0, vue.ref)({});
const { onColumnsChange, onScrollableChange } = useLayoutObserver(parent);
const isTableLayoutAuto = parent?.props.tableLayout === "auto";
const saveIndexSelection = (0, vue.reactive)(/* @__PURE__ */ new Map());
const theadRef = (0, vue.ref)();
let delayId;
const updateFixedColumnStyle = () => {
delayId = setTimeout(() => {
if (saveIndexSelection.size > 0) {
saveIndexSelection.forEach((column, key) => {
const el = theadRef.value.querySelector(`.${key.replace(/\s/g, ".")}`);
if (el) column.width = el.getBoundingClientRect().width || column.width;
});
saveIndexSelection.clear();
}
});
};
(0, vue.watch)(saveIndexSelection, updateFixedColumnStyle);
(0, vue.onBeforeUnmount)(() => {
if (delayId) {
clearTimeout(delayId);
delayId = void 0;
}
});
(0, vue.onMounted)(async () => {
await (0, vue.nextTick)();
await (0, vue.nextTick)();
const { prop, order } = props.defaultSort;
parent?.store.commit("sort", {
prop,
order,
init: true
});
updateFixedColumnStyle();
});
const { handleHeaderClick, handleHeaderContextMenu, handleMouseDown, handleMouseMove, handleMouseOut, handleSortClick, handleFilterClick } = useEvent(props, emit);
const { getHeaderRowStyle, getHeaderRowClass, getHeaderCellStyle, getHeaderCellClass } = useStyle$2(props);
const { isGroup, toggleAllSelection, columnRows } = useUtils$1(props);
const { t } = useLocale();
instance.state = {
onColumnsChange,
onScrollableChange
};
instance.filterPanels = filterPanels;
return {
ns,
t,
filterPanels,
onColumnsChange,
onScrollableChange,
columnRows,
getHeaderRowClass,
getHeaderRowStyle,
getHeaderCellClass,
getHeaderCellStyle,
handleHeaderClick,
handleHeaderContextMenu,
handleMouseDown,
handleMouseMove,
handleMouseOut,
handleSortClick,
handleFilterClick,
isGroup,
toggleAllSelection,
saveIndexSelection,
isTableLayoutAuto,
theadRef,
updateFixedColumnStyle
};
},
render() {
const { ns, t, isGroup, columnRows, getHeaderCellStyle, getHeaderCellClass, getHeaderRowClass, getHeaderRowStyle, handleHeaderClick, handleHeaderContextMenu, handleMouseDown, handleMouseMove, handleSortClick, handleMouseOut, store, $parent, saveIndexSelection, isTableLayoutAuto } = this;
let rowSpan = 1;
return (0, vue.h)("thead", {
ref: "theadRef",
class: ns.is("group", isGroup)
}, columnRows.map((subColumns, rowIndex) => (0, vue.h)("tr", {
class: getHeaderRowClass(rowIndex),
key: rowIndex,
style: getHeaderRowStyle(rowIndex)
}, subColumns.map((column, cellIndex) => {
if (column.rowSpan > rowSpan) rowSpan = column.rowSpan;
const _class = getHeaderCellClass(rowIndex, cellIndex, subColumns, column);
if (isTableLayoutAuto && column.fixed) saveIndexSelection.set(_class, column);
return (0, vue.h)("th", {
class: _class,
colspan: column.colSpan,
key: `${column.id}-thead`,
rowspan: column.rowSpan,
scope: column.colSpan > 1 ? "colgroup" : "col",
ariaSort: column.sortable ? column.order : void 0,
style: getHeaderCellStyle(rowIndex, cellIndex, subColumns, column),
onClick: ($event) => {
if ($event.currentTarget?.classList.contains("noclick")) return;
handleHeaderClick($event, column);
},
onContextmenu: ($event) => handleHeaderContextMenu($event, column),
onMousedown: ($event) => handleMouseDown($event, column),
onMousemove: ($event) => handleMouseMove($event, column),
onMouseout: handleMouseOut
}, [(0, vue.h)("div", { class: ["cell", column.filteredValue && column.filteredValue.length > 0 ? "highlight" : ""] }, [
column.renderHeader ? column.renderHeader({
column,
$index: cellIndex,
store,
_self: $parent
}) : column.label,
column.sortable && (0, vue.h)("button", {
type: "button",
class: "caret-wrapper",
"aria-label": t("el.table.sortLabel", { column: column.label || "" }),
onClick: ($event) => handleSortClick($event, column)
}, [(0, vue.h)("i", {
onClick: ($event) => handleSortClick($event, column, "ascending"),
class: "sort-caret ascending"
}), (0, vue.h)("i", {
onClick: ($event) => handleSortClick($event, column, "descending"),
class: "sort-caret descending"
})]),
column.filterable && (0, vue.h)(filter_panel_default, {
store,
placement: column.filterPlacement || "bottom-start",
appendTo: $parent?.appendFilterPanelTo,
column,
upDataColumn: (key, value) => {
column[key] = value;
}
}, { "filter-icon": () => column.renderFilterIcon ? column.renderFilterIcon({ filterOpened: column.filterOpened }) : null })
])]);
}))));
}
});
//#endregion
//#region ../../packages/components/table/src/table-body/events-helper.ts
function useEvents(props) {
const parent = (0, vue.inject)(TABLE_INJECTION_KEY);
const tooltipContent = (0, vue.ref)("");
const tooltipTrigger = (0, vue.ref)((0, vue.h)("div"));
const handleEvent = (event, row, name) => {
const table = parent;
const cell = getCell(event);
let column = null;
const namespace = table?.vnode.el?.dataset.prefix;
if (cell) {
column = getColumnByCell({ columns: props.store?.states.columns.value ?? [] }, cell, namespace);
if (column) table?.emit(`cell-${name}`, row, column, cell, event);
}
table?.emit(`row-${name}`, row, column, event);
};
const handleDoubleClick = (event, row) => {
handleEvent(event, row, "dblclick");
};
const handleClick = (event, row) => {
props.store?.commit("setCurrentRow", row);
handleEvent(event, row, "click");
};
const handleContextMenu = (event, row) => {
handleEvent(event, row, "contextmenu");
};
const handleMouseEnter = debounce((index) => {
props.store?.commit("setHoverRow", index);
}, 30);
const handleMouseLeave = debounce(() => {
props.store?.commit("setHoverRow", null);
}, 30);
const getPadding = (el) => {
const style = window.getComputedStyle(el, null);
return {
left: Number.parseInt(style.paddingLeft, 10) || 0,
right: Number.parseInt(style.paddingRight, 10) || 0,
top: Number.parseInt(style.paddingTop, 10) || 0,
bottom: Number.parseInt(style.paddingBottom, 10) || 0
};
};
const toggleRowClassByCell = (rowSpan, event, toggle) => {
let node = (event?.target)?.parentNode;
while (rowSpan > 1) {
node = node?.nextSibling;
if (!node || node.nodeName !== "TR") break;
toggle(node, "hover-row hover-fixed-row");
rowSpan--;
}
};
const handleCellMouseEnter = (event, row, tooltipOptions) => {
if (!parent) return;
const table = parent;
const cell = getCell(event);
const namespace = table?.vnode.el?.dataset.prefix;
let column = null;
if (cell) {
column = getColumnByCell({ columns: props.store?.states.columns.value ?? [] }, cell, namespace);
if (!column) return;
if (cell.rowSpan > 1) toggleRowClassByCell(cell.rowSpan, event, addClass);
const hoverState = table.hoverState = {
cell,
column,
row
};
table?.emit("cell-mouse-enter", hoverState.row, hoverState.column, hoverState.cell, event);
}
if (!tooltipOptions) {
if (removePopper?.trigger === cell) removePopper?.();
return;
}
const cellChild = event.target.querySelector(".cell");
if (!(hasClass(cellChild, `${namespace}-tooltip`) && cellChild.childNodes.length && cellChild.textContent?.trim())) return;
const range = document.createRange();
range.setStart(cellChild, 0);
range.setEnd(cellChild, cellChild.childNodes.length);
/** detail: https://github.com/element-plus/element-plus/issues/10790
* What went wrong?
* UI > Browser > Zoom, In Blink/WebKit, getBoundingClientRect() sometimes returns inexact values, probably due to lost precision during internal calculations. In the example above:
* - Expected: 188
* - Actual: 188.00000762939453
*/
const { width: rangeWidth, height: rangeHeight } = range.getBoundingClientRect();
const { width: cellChildWidth, height: cellChildHeight } = cellChild.getBoundingClientRect();
const { top, left, right, bottom } = getPadding(cellChild);
const horizontalPadding = left + right;
const verticalPadding = top + bottom;
if (isGreaterThan(rangeWidth + horizontalPadding, cellChildWidth) || isGreaterThan(rangeHeight + verticalPadding, cellChildHeight) || isGreaterThan(cellChild.scrollWidth, cellChildWidth)) createTablePopper(tooltipOptions, (cell?.innerText || cell?.textContent) ?? "", row, column, cell, table);
else if (removePopper?.trigger === cell) removePopper?.();
};
const handleCellMouseLeave = (event) => {
const cell = getCell(event);
if (!cell) return;
if (cell.rowSpan > 1) toggleRowClassByCell(cell.rowSpan, event, removeClass);
const oldHoverState = parent?.hoverState;
parent?.emit("cell-mouse-leave", oldHoverState?.row, oldHoverState?.column, oldHoverState?.cell, event);
};
return {
handleDoubleClick,
handleClick,
handleContextMenu,
handleMouseEnter,
handleMouseLeave,
handleCellMouseEnter,
handleCellMouseLeave,
tooltipContent,
tooltipTrigger
};
}
//#endregion
//#region ../../packages/components/table/src/table-body/styles-helper.ts
function useStyles$1(props) {
const parent = (0, vue.inject)(TABLE_INJECTION_KEY);
const ns = useNamespace("table");
const getRowStyle = (row, rowIndex) => {
const rowStyle = parent?.props.rowStyle;
if (isFunction$1(rowStyle)) return rowStyle.call(null, {
row,
rowIndex
});
return rowStyle || null;
};
const getRowClass = (row, rowIndex, displayIndex) => {
const classes = [ns.e("row")];
if (parent?.props.highlightCurrentRow && row === props.store?.states.currentRow.value) classes.push("current-row");
if (props.stripe && displayIndex % 2 === 1) classes.push(ns.em("row", "striped"));
const rowClassName = parent?.props.rowClassName;
if (isString(rowClassName)) classes.push(rowClassName);
else if (isFunction$1(rowClassName)) classes.push(rowClassName.call(null, {
row,
rowIndex
}));
return classes;
};
const getCellStyle = (rowIndex, columnIndex, row, column) => {
const cellStyle = parent?.props.cellStyle;
let cellStyles = cellStyle ?? {};
if (isFunction$1(cellStyle)) cellStyles = cellStyle.call(null, {
rowIndex,
columnIndex,
row,
column
});
const fixedStyle = getFixedColumnOffset(columnIndex, props?.fixed, props.store);
ensurePosition(fixedStyle, "left");
ensurePosition(fixedStyle, "right");
return Object.assign({}, cellStyles, fixedStyle);
};
const getCellClass = (rowIndex, columnIndex, row, column, offset) => {
const fixedClasses = getFixedColumnsClass(ns.b(), columnIndex, props?.fixed, props.store, void 0, offset);
const classes = [
column.id,
column.align,
column.className,
...fixedClasses
];
const cellClassName = parent?.props.cellClassName;
if (isString(cellClassName)) classes.push(cellClassName);
else if (isFunction$1(cellClassName)) classes.push(cellClassName.call(null, {
rowIndex,
columnIndex,
row,
column
}));
classes.push(ns.e("cell"));
return classes.filter((className) => Boolean(className)).join(" ");
};
const getSpan = (row, column, rowIndex, columnIndex) => {
let rowspan = 1;
let colspan = 1;
const fn = parent?.props.spanMethod;
if (isFunction$1(fn)) {
const result = fn({
row,
column,
rowIndex,
columnIndex
});
if (isArray$1(result)) {
rowspan = result[0];
colspan = result[1];
} else if (isObject$1(result)) {
rowspan = result.rowspan;
colspan = result.colspan;
}
}
return {
rowspan,
colspan
};
};
const getColspanRealWidth = (columns, colspan, index) => {
if (colspan < 1) return columns[index].realWidth;
const widthArr = columns.map(({ realWidth, width }) => realWidth || width).slice(index, index + colspan);
return Number(widthArr.reduce((acc, width) => Number(acc) + Number(width), -1));
};
return {
getRowStyle,
getRowClass,
getCellStyle,
getCellClass,
getSpan,
getColspanRealWidth
};
}
//#endregion
//#region ../../packages/components/table/src/table-body/td-wrapper.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$16 = ["colspan", "rowspan"];
var td_wrapper_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "TableTdWrapper",
__name: "td-wrapper",
props: {
colspan: {
type: Number,
default: 1
},
rowspan: {
type: Number,
default: 1
}
},
setup(__props) {
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("td", {
colspan: __props.colspan,
rowspan: __props.rowspan
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 8, _hoisted_1$16);
};
}
});
//#endregion
//#region ../../packages/components/table/src/table-body/td-wrapper.vue
var td_wrapper_default = td_wrapper_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/table/src/table-body/render-helper.ts
function useRender$1(props) {
const parent = (0, vue.inject)(TABLE_INJECTION_KEY);
const ns = useNamespace("table");
const { handleDoubleClick, handleClick, handleContextMenu, handleMouseEnter, handleMouseLeave, handleCellMouseEnter, handleCellMouseLeave, tooltipContent, tooltipTrigger } = useEvents(props);
const { getRowStyle, getRowClass, getCellStyle, getCellClass, getSpan, getColspanRealWidth } = useStyles$1(props);
let displayIndex = -1;
const firstDefaultColumnIndex = (0, vue.computed)(() => {
return props.store?.states.columns.value.findIndex(({ type }) => type === "default");
});
const getKeyOfRow = (row, index) => {
const rowKey = (parent?.props)?.rowKey;
if (rowKey) return getRowIdentity(row, rowKey);
return index;
};
const rowRender = (row, $index, treeRowData, expanded = false) => {
const { tooltipEffect, tooltipOptions, store } = props;
const { indent, columns } = store.states;
const rowClasses = [];
let display = true;
if (treeRowData) {
rowClasses.push(ns.em("row", `level-${treeRowData.level}`));
display = !!treeRowData.display;
}
if ($index === 0) displayIndex = -1;
if (props.stripe && display) displayIndex++;
rowClasses.push(...getRowClass(row, $index, displayIndex));
return (0, vue.h)("tr", {
style: [display ? null : { display: "none" }, getRowStyle(row, $index)],
class: rowClasses,
key: getKeyOfRow(row, $index),
onDblclick: ($event) => handleDoubleClick($event, row),
onClick: ($event) => handleClick($event, row),
onContextmenu: ($event) => handleContextMenu($event, row),
onMouseenter: () => handleMouseEnter($index),
onMouseleave: handleMouseLeave
}, columns.value.map((column, cellIndex) => {
const { rowspan, colspan } = getSpan(row, column, $index, cellIndex);
if (!rowspan || !colspan) return null;
const columnData = Object.assign({}, column);
columnData.realWidth = getColspanRealWidth(columns.value, colspan, cellIndex);
const data = {
store,
_self: props.context || parent,
column: columnData,
row,
$index,
cellIndex,
expanded
};
if (cellIndex === firstDefaultColumnIndex.value && treeRowData) {
data.treeNode = {
indent: treeRowData.level && treeRowData.level * indent.value,
level: treeRowData.level
};
if (isBoolean(treeRowData.expanded)) {
data.treeNode.expanded = treeRowData.expanded;
if ("loading" in treeRowData) data.treeNode.loading = treeRowData.loading;
if ("noLazyChildren" in treeRowData) data.treeNode.noLazyChildren = treeRowData.noLazyChildren;
}
}
const baseKey = `${getKeyOfRow(row, $index)},${cellIndex}`;
const patchKey = columnData.columnKey || columnData.rawColumnKey || "";
const mergedTooltipOptions = column.showOverflowTooltip && merge({ effect: tooltipEffect }, tooltipOptions, column.showOverflowTooltip);
return (0, vue.h)(td_wrapper_default, {
style: getCellStyle($index, cellIndex, row, column),
class: getCellClass($index, cellIndex, row, column, colspan - 1),
key: `${patchKey}${baseKey}`,
rowspan,
colspan,
onMouseenter: ($event) => handleCellMouseEnter($event, row, mergedTooltipOptions),
onMouseleave: handleCellMouseLeave
}, { default: () => cellChildren(cellIndex, column, data) });
}));
};
const cellChildren = (_cellIndex, column, data) => {
return column.renderCell(data);
};
const wrappedRowRender = (row, $index) => {
const store = props.store;
const { isRowExpanded, assertRowKey } = store;
const { treeData, lazyTreeNodeMap, childrenColumnName, rowKey } = store.states;
const columns = store.states.columns.value;
if (columns.some(({ type }) => type === "expand")) {
const expanded = isRowExpanded(row);
const tr = rowRender(row, $index, void 0, expanded);
const renderExpanded = parent?.renderExpanded;
if (!renderExpanded) {
console.error("[Element Error]renderExpanded is required.");
return tr;
}
const rows = [[tr]];
if (parent.props.preserveExpandedContent || expanded) rows[0].push((0, vue.h)("tr", {
key: `expanded-row__${tr.key}`,
style: { display: expanded ? "" : "none" }
}, [(0, vue.h)("td", {
colspan: columns.length,
class: `${ns.e("cell")} ${ns.e("expanded-cell")}`
}, [renderExpanded({
row,
$index,
store,
expanded
})])]));
return rows;
} else if (Object.keys(treeData.value).length) {
assertRowKey();
const key = getRowIdentity(row, rowKey.value);
let cur = treeData.value[key];
let treeRowData = null;
if (cur) {
treeRowData = {
expanded: cur.expanded,
level: cur.level,
display: true,
noLazyChildren: void 0,
loading: void 0
};
if (isBoolean(cur.lazy)) {
if (treeRowData && isBoolean(cur.loaded) && cur.loaded) treeRowData.noLazyChildren = !(cur.children && cur.children.length);
treeRowData.loading = cur.loading;
}
}
const tmp = [rowRender(row, $index, treeRowData ?? void 0)];
if (cur) {
let i = 0;
const traverse = (children, parent) => {
if (!(children && children.length && parent)) return;
children.forEach((node) => {
const innerTreeRowData = {
display: parent.display && parent.expanded,
level: parent.level + 1,
expanded: false,
noLazyChildren: false,
loading: false
};
const childKey = getRowIdentity(node, rowKey.value);
if (isPropAbsent(childKey)) throw new Error("For nested data item, row-key is required.");
cur = { ...treeData.value[childKey] };
if (cur) {
innerTreeRowData.expanded = cur.expanded;
cur.level = cur.level || innerTreeRowData.level;
cur.display = !!(cur.expanded && innerTreeRowData.display);
if (isBoolean(cur.lazy)) {
if (isBoolean(cur.loaded) && cur.loaded) innerTreeRowData.noLazyChildren = !(cur.children && cur.children.length);
innerTreeRowData.loading = cur.loading;
}
}
i++;
tmp.push(rowRender(node, $index + i, innerTreeRowData));
if (cur) traverse(lazyTreeNodeMap.value[childKey] || node[childrenColumnName.value], cur);
});
};
cur.display = true;
traverse(lazyTreeNodeMap.value[key] || row[childrenColumnName.value], cur);
}
return tmp;
} else return rowRender(row, $index, void 0);
};
return {
wrappedRowRender,
tooltipContent,
tooltipTrigger
};
}
//#endregion
//#region ../../packages/components/table/src/table-body/defaults.ts
const defaultProps$1 = {
store: {
required: true,
type: Object
},
stripe: Boolean,
tooltipEffect: String,
tooltipOptions: { type: Object },
context: {
default: () => ({}),
type: Object
},
rowClassName: [String, Function],
rowStyle: [Object, Function],
fixed: {
type: String,
default: ""
},
highlight: Boolean
};
//#endregion
//#region ../../packages/components/table/src/table-body/index.ts
var table_body_default = (0, vue.defineComponent)({
name: "ElTableBody",
props: defaultProps$1,
setup(props) {
const instance = (0, vue.getCurrentInstance)();
const parent = (0, vue.inject)(TABLE_INJECTION_KEY);
const ns = useNamespace("table");
const { wrappedRowRender, tooltipContent, tooltipTrigger } = useRender$1(props);
const { onColumnsChange, onScrollableChange } = useLayoutObserver(parent);
const hoveredCellList = [];
(0, vue.watch)(props.store?.states.hoverRow, (newVal, oldVal) => {
const el = instance?.vnode.el;
const rows = Array.from(el?.children || []).filter((e) => e?.classList.contains(`${ns.e("row")}`));
let rowNum = newVal;
const childNodes = rows[rowNum]?.childNodes;
if (childNodes?.length) {
let control = 0;
Array.from(childNodes).reduce((acc, item, index) => {
if (childNodes[index]?.colSpan > 1) control = childNodes[index]?.colSpan;
if (item.nodeName !== "TD" && control === 0) acc.push(index);
control > 0 && control--;
return acc;
}, []).forEach((rowIndex) => {
rowNum = newVal;
while (rowNum > 0) {
const preChildNodes = rows[rowNum - 1]?.childNodes;
if (preChildNodes[rowIndex] && preChildNodes[rowIndex].nodeName === "TD" && preChildNodes[rowIndex].rowSpan > 1) {
addClass(preChildNodes[rowIndex], "hover-cell");
hoveredCellList.push(preChildNodes[rowIndex]);
break;
}
rowNum--;
}
});
} else {
hoveredCellList.forEach((item) => removeClass(item, "hover-cell"));
hoveredCellList.length = 0;
}
if (!props.store?.states.isComplex.value || !isClient) return;
rAF(() => {
const oldRow = rows[oldVal];
const newRow = rows[newVal];
if (oldRow && !oldRow.classList.contains("hover-fixed-row")) removeClass(oldRow, "hover-row");
if (newRow) addClass(newRow, "hover-row");
});
});
(0, vue.onUnmounted)(() => {
removePopper?.();
});
return {
ns,
onColumnsChange,
onScrollableChange,
wrappedRowRender,
tooltipContent,
tooltipTrigger
};
},
render() {
const { wrappedRowRender, store } = this;
return (0, vue.h)("tbody", { tabIndex: -1 }, [(store?.states.data.value || []).reduce((acc, row) => {
return acc.concat(wrappedRowRender(row, acc.length));
}, [])]);
}
});
//#endregion
//#region ../../packages/components/table/src/table-footer/mapState-helper.ts
function useMapState() {
const store = (0, vue.inject)(TABLE_INJECTION_KEY)?.store;
return {
leftFixedLeafCount: (0, vue.computed)(() => {
return store?.states.fixedLeafColumnsLength.value ?? 0;
}),
rightFixedLeafCount: (0, vue.computed)(() => {
return store?.states.rightFixedColumns.value.length ?? 0;
}),
columnsCount: (0, vue.computed)(() => {
return store?.states.columns.value.length ?? 0;
}),
leftFixedCount: (0, vue.computed)(() => {
return store?.states.fixedColumns.value.length ?? 0;
}),
rightFixedCount: (0, vue.computed)(() => {
return store?.states.rightFixedColumns.value.length ?? 0;
}),
columns: (0, vue.computed)(() => store?.states.columns.value ?? [])
};
}
//#endregion
//#region ../../packages/components/table/src/table-footer/style-helper.ts
function useStyle$1(props) {
const { columns } = useMapState();
const ns = useNamespace("table");
const getCellClasses = (columns, cellIndex) => {
const column = columns[cellIndex];
const classes = [
ns.e("cell"),
column.id,
column.align,
column.labelClassName,
...getFixedColumnsClass(ns.b(), cellIndex, column.fixed, props.store)
];
if (column.className) classes.push(column.className);
if (!column.children) classes.push(ns.is("leaf"));
return classes;
};
const getCellStyles = (column, cellIndex) => {
const fixedStyle = getFixedColumnOffset(cellIndex, column.fixed, props.store);
ensurePosition(fixedStyle, "left");
ensurePosition(fixedStyle, "right");
return fixedStyle;
};
return {
getCellClasses,
getCellStyles,
columns
};
}
//#endregion
//#region ../../packages/components/table/src/table-footer/index.ts
var table_footer_default = (0, vue.defineComponent)({
name: "ElTableFooter",
props: {
fixed: {
type: String,
default: ""
},
store: {
required: true,
type: Object
},
summaryMethod: Function,
sumText: String,
border: Boolean,
defaultSort: {
type: Object,
default: () => {
return {
prop: "",
order: ""
};
}
}
},
setup(props) {
const parent = (0, vue.inject)(TABLE_INJECTION_KEY);
const ns = useNamespace("table");
const { getCellClasses, getCellStyles, columns } = useStyle$1(props);
const { onScrollableChange, onColumnsChange } = useLayoutObserver(parent);
return {
ns,
onScrollableChange,
onColumnsChange,
getCellClasses,
getCellStyles,
columns
};
},
render() {
const { columns, getCellStyles, getCellClasses, summaryMethod, sumText } = this;
const data = this.store.states.data.value;
let sums = [];
if (summaryMethod) sums = summaryMethod({
columns,
data
});
else columns.forEach((column, index) => {
if (index === 0) {
sums[index] = sumText;
return;
}
const values = data.map((item) => Number(item[column.property]));
const precisions = [];
let notNumber = true;
values.forEach((value) => {
if (!Number.isNaN(+value)) {
notNumber = false;
const decimal = `${value}`.split(".")[1];
precisions.push(decimal ? decimal.length : 0);
}
});
const precision = Math.max.apply(null, precisions);
if (!notNumber) sums[index] = values.reduce((prev, curr) => {
const value = Number(curr);
if (!Number.isNaN(+value)) return Number.parseFloat((prev + curr).toFixed(Math.min(precision, 20)));
else return prev;
}, 0);
else sums[index] = "";
});
return (0, vue.h)((0, vue.h)("tfoot", [(0, vue.h)("tr", {}, [...columns.map((column, cellIndex) => (0, vue.h)("td", {
key: cellIndex,
colspan: column.colSpan,
rowspan: column.rowSpan,
class: getCellClasses(columns, cellIndex),
style: getCellStyles(column, cellIndex)
}, [(0, vue.h)("div", { class: ["cell", column.labelClassName] }, [sums[cellIndex]])]))])]));
}
});
//#endregion
//#region ../../packages/components/table/src/table/utils-helper.ts
function useUtils(store) {
const setCurrentRow = (row) => {
store.commit("setCurrentRow", row);
};
const getSelectionRows = () => {
return store.getSelectionRows();
};
const toggleRowSelection = (row, selected, ignoreSelectable = true) => {
store.toggleRowSelection(row, selected, false, ignoreSelectable);
store.updateAllSelected();
};
const clearSelection = () => {
store.clearSelection();
};
const clearFilter = (columnKeys) => {
store.clearFilter(columnKeys);
};
const toggleAllSelection = () => {
store.commit("toggleAllSelection");
};
const toggleRowExpansion = (row, expanded) => {
store.toggleRowExpansionAdapter(row, expanded);
};
const clearSort = () => {
store.clearSort();
};
const sort = (prop, order) => {
store.commit("sort", {
prop,
order
});
};
const updateKeyChildren = (key, data) => {
store.updateKeyChildren(key, data);
};
return {
setCurrentRow,
getSelectionRows,
toggleRowSelection,
clearSelection,
clearFilter,
toggleAllSelection,
toggleRowExpansion,
clearSort,
sort,
updateKeyChildren
};
}
//#endregion
//#region ../../packages/components/table/src/table/style-helper.ts
function useStyle(props, layout, store, table) {
const isHidden = (0, vue.ref)(false);
const renderExpanded = (0, vue.ref)(null);
const resizeProxyVisible = (0, vue.ref)(false);
const setDragVisible = (visible) => {
resizeProxyVisible.value = visible;
};
const resizeState = (0, vue.ref)({
width: null,
height: null,
headerHeight: null
});
const isGroup = (0, vue.ref)(false);
const scrollbarViewStyle = {
display: "inline-block",
verticalAlign: "middle"
};
const tableWidth = (0, vue.ref)();
const tableScrollHeight = (0, vue.ref)(0);
const bodyScrollHeight = (0, vue.ref)(0);
const headerScrollHeight = (0, vue.ref)(0);
const footerScrollHeight = (0, vue.ref)(0);
const appendScrollHeight = (0, vue.ref)(0);
(0, vue.watch)(() => props.height, (value) => {
layout.setHeight(value ?? null);
}, { immediate: true });
(0, vue.watch)(() => props.maxHeight, (value) => {
layout.setMaxHeight(value ?? null);
}, { immediate: true });
(0, vue.watch)(() => [props.currentRowKey, store.states.rowKey], ([currentRowKey, rowKey]) => {
if (!(0, vue.unref)(rowKey) || !(0, vue.unref)(currentRowKey)) return;
store.setCurrentRowKey(`${currentRowKey}`);
}, { immediate: true });
(0, vue.watch)(() => props.data, (data) => {
table.store.commit("setData", data);
}, {
immediate: true,
deep: true
});
(0, vue.watchEffect)(() => {
if (props.expandRowKeys) store.setExpandRowKeysAdapter(props.expandRowKeys);
});
const handleMouseLeave = () => {
table.store.commit("setHoverRow", null);
if (table.hoverState) table.hoverState = null;
};
const handleHeaderFooterMousewheel = (_event, data) => {
const { pixelX, pixelY } = data;
if (Math.abs(pixelX) >= Math.abs(pixelY)) table.refs.bodyWrapper.scrollLeft += data.pixelX / 5;
};
const shouldUpdateHeight = (0, vue.computed)(() => {
return props.height || props.maxHeight || store.states.fixedColumns.value.length > 0 || store.states.rightFixedColumns.value.length > 0;
});
const tableBodyStyles = (0, vue.computed)(() => {
return { width: layout.bodyWidth.value ? `${layout.bodyWidth.value}px` : "" };
});
const doLayout = () => {
if (shouldUpdateHeight.value) layout.updateElsHeight();
layout.updateColumnsWidth();
if (typeof window === "undefined") return;
requestAnimationFrame(syncPosition);
};
(0, vue.onMounted)(async () => {
await (0, vue.nextTick)();
store.updateColumns();
bindEvents();
requestAnimationFrame(doLayout);
const el = table.vnode.el;
const tableHeader = table.refs.headerWrapper;
if (props.flexible && el && el.parentElement) el.parentElement.style.minWidth = "0";
resizeState.value = {
width: tableWidth.value = el.offsetWidth,
height: el.offsetHeight,
headerHeight: props.showHeader && tableHeader ? tableHeader.offsetHeight : null
};
store.states.columns.value.forEach((column) => {
if (column.filteredValue && column.filteredValue.length) table.store.commit("filterChange", {
column,
values: column.filteredValue,
silent: true
});
});
table.$ready = true;
});
const setScrollClassByEl = (el, className) => {
if (!el) return;
const classList = Array.from(el.classList).filter((item) => !item.startsWith("is-scrolling-"));
classList.push(layout.scrollX.value ? className : "is-scrolling-none");
el.className = classList.join(" ");
};
const setScrollClass = (className) => {
const { tableWrapper } = table.refs;
setScrollClassByEl(tableWrapper, className);
};
const hasScrollClass = (className) => {
const { tableWrapper } = table.refs;
return !!(tableWrapper && tableWrapper.classList.contains(className));
};
const syncPosition = function() {
if (!table.refs.scrollBarRef) return;
if (!layout.scrollX.value) {
const scrollingNoneClass = "is-scrolling-none";
if (!hasScrollClass(scrollingNoneClass)) setScrollClass(scrollingNoneClass);
return;
}
const scrollContainer = table.refs.scrollBarRef.wrapRef;
if (!scrollContainer) return;
const { scrollLeft, offsetWidth, scrollWidth } = scrollContainer;
const { headerWrapper, footerWrapper } = table.refs;
if (headerWrapper) headerWrapper.scrollLeft = scrollLeft;
if (footerWrapper) footerWrapper.scrollLeft = scrollLeft;
if (scrollLeft >= scrollWidth - offsetWidth - 1) setScrollClass("is-scrolling-right");
else if (scrollLeft === 0) setScrollClass("is-scrolling-left");
else setScrollClass("is-scrolling-middle");
};
const bindEvents = () => {
if (!table.refs.scrollBarRef) return;
if (table.refs.scrollBarRef.wrapRef) useEventListener(table.refs.scrollBarRef.wrapRef, "scroll", syncPosition, { passive: true });
if (props.fit) useResizeObserver(table.vnode.el, resizeListener);
else useEventListener(window, "resize", resizeListener);
useResizeObserver(table.refs.tableInnerWrapper, () => {
resizeListener();
table.refs?.scrollBarRef?.update();
});
};
const resizeListener = () => {
const el = table.vnode.el;
if (!table.$ready || !el) return;
let shouldUpdateLayout = false;
const { width: oldWidth, height: oldHeight, headerHeight: oldHeaderHeight } = resizeState.value;
const width = tableWidth.value = el.offsetWidth;
if (oldWidth !== width) shouldUpdateLayout = true;
const height = el.offsetHeight;
if ((props.height || shouldUpdateHeight.value) && oldHeight !== height) shouldUpdateLayout = true;
const tableHeader = props.tableLayout === "fixed" ? table.refs.headerWrapper : table.refs.tableHeaderRef?.$el;
if (props.showHeader && tableHeader?.offsetHeight !== oldHeaderHeight) shouldUpdateLayout = true;
tableScrollHeight.value = table.refs.tableWrapper?.scrollHeight || 0;
headerScrollHeight.value = tableHeader?.scrollHeight || 0;
footerScrollHeight.value = table.refs.footerWrapper?.offsetHeight || 0;
appendScrollHeight.value = table.refs.appendWrapper?.offsetHeight || 0;
bodyScrollHeight.value = tableScrollHeight.value - headerScrollHeight.value - footerScrollHeight.value - appendScrollHeight.value;
if (shouldUpdateLayout) {
resizeState.value = {
width,
height,
headerHeight: props.showHeader && tableHeader?.offsetHeight || 0
};
doLayout();
}
};
const tableSize = useFormSize();
const bodyWidth = (0, vue.computed)(() => {
const { bodyWidth: bodyWidth_, scrollY, gutterWidth } = layout;
return bodyWidth_.value ? `${bodyWidth_.value - (scrollY.value ? gutterWidth : 0)}px` : "";
});
const tableLayout = (0, vue.computed)(() => {
if (props.maxHeight) return "fixed";
return props.tableLayout;
});
return {
isHidden,
renderExpanded,
setDragVisible,
isGroup,
handleMouseLeave,
handleHeaderFooterMousewheel,
tableSize,
emptyBlockStyle: (0, vue.computed)(() => {
if (props.data && props.data.length) return;
let height = "100%";
if (props.height && bodyScrollHeight.value) height = `${bodyScrollHeight.value}px`;
const width = tableWidth.value;
return {
width: width ? `${width}px` : "",
height
};
}),
resizeProxyVisible,
bodyWidth,
resizeState,
doLayout,
tableBodyStyles,
tableLayout,
scrollbarViewStyle,
scrollbarStyle: (0, vue.computed)(() => {
if (props.height) return { height: "100%" };
if (props.maxHeight) if (!Number.isNaN(Number(props.maxHeight))) return { maxHeight: `${+props.maxHeight - headerScrollHeight.value - footerScrollHeight.value}px` };
else return { maxHeight: `calc(${props.maxHeight} - ${headerScrollHeight.value + footerScrollHeight.value}px)` };
return {};
})
};
}
//#endregion
//#region ../../packages/components/table/src/table/key-render-helper.ts
function useKeyRender(table) {
let observer;
const initWatchDom = () => {
const columnsWrapper = table.vnode.el.querySelector(".hidden-columns");
const config = {
childList: true,
subtree: true
};
const updateOrderFns = table.store.states.updateOrderFns;
observer = new MutationObserver(() => {
updateOrderFns.forEach((fn) => fn());
});
observer.observe(columnsWrapper, config);
};
(0, vue.onMounted)(() => {
initWatchDom();
});
(0, vue.onUnmounted)(() => {
observer?.disconnect();
});
}
//#endregion
//#region ../../packages/components/table/src/table/defaults.ts
var defaults_default$2 = {
data: {
type: Array,
default: () => []
},
size: useSizeProp,
width: [String, Number],
height: [String, Number],
maxHeight: [String, Number],
fit: {
type: Boolean,
default: true
},
stripe: Boolean,
border: Boolean,
rowKey: [String, Function],
showHeader: {
type: Boolean,
default: true
},
showSummary: Boolean,
sumText: String,
summaryMethod: Function,
rowClassName: [String, Function],
rowStyle: [Object, Function],
cellClassName: [String, Function],
cellStyle: [Object, Function],
headerRowClassName: [String, Function],
headerRowStyle: [Object, Function],
headerCellClassName: [String, Function],
headerCellStyle: [Object, Function],
highlightCurrentRow: Boolean,
currentRowKey: [String, Number],
emptyText: String,
expandRowKeys: Array,
defaultExpandAll: Boolean,
rowExpandable: { type: Function },
defaultSort: Object,
tooltipEffect: String,
tooltipOptions: Object,
spanMethod: Function,
selectOnIndeterminate: {
type: Boolean,
default: true
},
indent: {
type: Number,
default: 16
},
treeProps: {
type: Object,
default: () => {
return {
hasChildren: "hasChildren",
children: "children",
checkStrictly: false
};
}
},
lazy: Boolean,
load: Function,
style: {
type: [
String,
Object,
Array
],
default: () => ({})
},
className: {
type: String,
default: ""
},
tableLayout: {
type: String,
default: "fixed"
},
scrollbarAlwaysOn: Boolean,
flexible: Boolean,
showOverflowTooltip: {
type: [Boolean, Object],
default: void 0
},
tooltipFormatter: Function,
appendFilterPanelTo: String,
scrollbarTabindex: {
type: [Number, String],
default: void 0
},
allowDragLastColumn: {
type: Boolean,
default: true
},
preserveExpandedContent: Boolean,
nativeScrollbar: Boolean
};
//#endregion
//#region ../../packages/components/table/src/h-helper.ts
function hColgroup(props) {
const isAuto = props.tableLayout === "auto";
let columns = props.columns || [];
if (isAuto) {
if (columns.every(({ width }) => isUndefined(width))) columns = [];
}
const getPropsData = (column) => {
const propsData = {
key: `${props.tableLayout}_${column.id}`,
style: {},
name: void 0
};
if (isAuto) propsData.style = { width: `${column.width}px` };
else propsData.name = column.id;
return propsData;
};
return (0, vue.h)("colgroup", {}, columns.map((column) => (0, vue.h)("col", getPropsData(column))));
}
hColgroup.props = ["columns", "tableLayout"];
//#endregion
//#region ../../packages/components/table/src/composables/use-scrollbar.ts
const useScrollbar$1 = () => {
const scrollBarRef = (0, vue.ref)();
const scrollTo = (options, yCoord) => {
const scrollbar = scrollBarRef.value;
if (scrollbar) scrollbar.scrollTo(options, yCoord);
};
const setScrollPosition = (position, offset) => {
const scrollbar = scrollBarRef.value;
if (scrollbar && isNumber(offset) && ["Top", "Left"].includes(position)) scrollbar[`setScroll${position}`](offset);
};
const setScrollTop = (top) => setScrollPosition("Top", top);
const setScrollLeft = (left) => setScrollPosition("Left", left);
return {
scrollBarRef,
scrollTo,
setScrollTop,
setScrollLeft
};
};
//#endregion
//#region ../../packages/components/table/src/table.vue?vue&type=script&lang.ts
let tableIdSeed = 1;
var table_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElTable",
directives: { Mousewheel },
components: {
TableHeader: table_header_default,
TableBody: table_body_default,
TableFooter: table_footer_default,
ElScrollbar,
hColgroup
},
props: defaults_default$2,
emits: [
"select",
"select-all",
"selection-change",
"cell-mouse-enter",
"cell-mouse-leave",
"cell-contextmenu",
"cell-click",
"cell-dblclick",
"row-click",
"row-contextmenu",
"row-dblclick",
"header-click",
"header-contextmenu",
"sort-change",
"filter-change",
"current-change",
"header-dragend",
"expand-change",
"scroll"
],
setup(props) {
const { t } = useLocale();
const ns = useNamespace("table");
const globalConfig = useGlobalConfig("table");
const table = (0, vue.getCurrentInstance)();
(0, vue.provide)(TABLE_INJECTION_KEY, table);
const store = createStore(table, props);
table.store = store;
const layout = new TableLayout({
store: table.store,
table,
fit: props.fit,
showHeader: props.showHeader
});
table.layout = layout;
const isEmpty = (0, vue.computed)(() => (store.states.data.value || []).length === 0);
/**
* open functions
*/
const { setCurrentRow, getSelectionRows, toggleRowSelection, clearSelection, clearFilter, toggleAllSelection, toggleRowExpansion, clearSort, sort, updateKeyChildren } = useUtils(store);
const { isHidden, renderExpanded, setDragVisible, isGroup, handleMouseLeave, handleHeaderFooterMousewheel, tableSize, emptyBlockStyle, resizeProxyVisible, bodyWidth, resizeState, doLayout, tableBodyStyles, tableLayout, scrollbarViewStyle, scrollbarStyle } = useStyle(props, layout, store, table);
const { scrollBarRef, scrollTo, setScrollLeft, setScrollTop } = useScrollbar$1();
const debouncedUpdateLayout = debounce(doLayout, 50);
const tableId = `${ns.namespace.value}-table_${tableIdSeed++}`;
table.tableId = tableId;
table.state = {
isGroup,
resizeState,
doLayout,
debouncedUpdateLayout
};
const computedSumText = (0, vue.computed)(() => props.sumText ?? t("el.table.sumText"));
const computedEmptyText = (0, vue.computed)(() => {
return props.emptyText ?? t("el.table.emptyText");
});
const computedTooltipEffect = (0, vue.computed)(() => props.tooltipEffect ?? globalConfig.value?.tooltipEffect);
const computedTooltipOptions = (0, vue.computed)(() => props.tooltipOptions ?? globalConfig.value?.tooltipOptions);
const columns = (0, vue.computed)(() => {
return convertToRows(store.states.originColumns.value)[0];
});
useKeyRender(table);
(0, vue.onBeforeUnmount)(() => {
debouncedUpdateLayout.cancel();
});
return {
ns,
layout,
store,
columns,
handleHeaderFooterMousewheel,
handleMouseLeave,
tableId,
tableSize,
isHidden,
isEmpty,
renderExpanded,
resizeProxyVisible,
resizeState,
isGroup,
bodyWidth,
tableBodyStyles,
emptyBlockStyle,
debouncedUpdateLayout,
setCurrentRow,
getSelectionRows,
toggleRowSelection,
clearSelection,
clearFilter,
toggleAllSelection,
toggleRowExpansion,
clearSort,
doLayout,
sort,
updateKeyChildren,
t,
setDragVisible,
context: table,
computedSumText,
computedEmptyText,
computedTooltipEffect,
computedTooltipOptions,
tableLayout,
scrollbarViewStyle,
scrollbarStyle,
scrollBarRef,
scrollTo,
setScrollLeft,
setScrollTop,
allowDragLastColumn: props.allowDragLastColumn
};
}
});
//#endregion
//#region ../../packages/components/table/src/table.vue
const _hoisted_1$15 = ["data-prefix"];
const _hoisted_2$9 = {
ref: "hiddenColumns",
class: "hidden-columns"
};
function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
const _component_hColgroup = (0, vue.resolveComponent)("hColgroup");
const _component_table_header = (0, vue.resolveComponent)("table-header");
const _component_table_body = (0, vue.resolveComponent)("table-body");
const _component_table_footer = (0, vue.resolveComponent)("table-footer");
const _component_el_scrollbar = (0, vue.resolveComponent)("el-scrollbar");
const _directive_mousewheel = (0, vue.resolveDirective)("mousewheel");
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref: "tableWrapper",
class: (0, vue.normalizeClass)([
{
[_ctx.ns.m("fit")]: _ctx.fit,
[_ctx.ns.m("striped")]: _ctx.stripe,
[_ctx.ns.m("border")]: _ctx.border || _ctx.isGroup,
[_ctx.ns.m("hidden")]: _ctx.isHidden,
[_ctx.ns.m("group")]: _ctx.isGroup,
[_ctx.ns.m("fluid-height")]: _ctx.maxHeight,
[_ctx.ns.m("scrollable-x")]: _ctx.layout.scrollX.value,
[_ctx.ns.m("scrollable-y")]: _ctx.layout.scrollY.value,
[_ctx.ns.m("enable-row-hover")]: !_ctx.store.states.isComplex.value,
[_ctx.ns.m("enable-row-transition")]: (_ctx.store.states.data.value || []).length !== 0 && (_ctx.store.states.data.value || []).length < 100,
"has-footer": _ctx.showSummary
},
_ctx.ns.m(_ctx.tableSize),
_ctx.className,
_ctx.ns.b(),
_ctx.ns.m(`layout-${_ctx.tableLayout}`)
]),
style: (0, vue.normalizeStyle)(_ctx.style),
"data-prefix": _ctx.ns.namespace.value,
onMouseleave: _cache[1] || (_cache[1] = (...args) => _ctx.handleMouseLeave && _ctx.handleMouseLeave(...args))
}, [(0, vue.createElementVNode)("div", {
ref: "tableInnerWrapper",
class: (0, vue.normalizeClass)(_ctx.ns.e("inner-wrapper"))
}, [
(0, vue.createElementVNode)("div", _hoisted_2$9, [(0, vue.renderSlot)(_ctx.$slots, "default")], 512),
_ctx.showHeader && _ctx.tableLayout === "fixed" ? (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
ref: "headerWrapper",
class: (0, vue.normalizeClass)(_ctx.ns.e("header-wrapper"))
}, [(0, vue.createElementVNode)("table", {
ref: "tableHeader",
class: (0, vue.normalizeClass)(_ctx.ns.e("header")),
style: (0, vue.normalizeStyle)(_ctx.tableBodyStyles),
border: "0",
cellpadding: "0",
cellspacing: "0"
}, [(0, vue.createVNode)(_component_hColgroup, {
columns: _ctx.store.states.columns.value,
"table-layout": _ctx.tableLayout
}, null, 8, ["columns", "table-layout"]), (0, vue.createVNode)(_component_table_header, {
ref: "tableHeaderRef",
border: _ctx.border,
"default-sort": _ctx.defaultSort,
store: _ctx.store,
"append-filter-panel-to": _ctx.appendFilterPanelTo,
"allow-drag-last-column": _ctx.allowDragLastColumn,
onSetDragVisible: _ctx.setDragVisible
}, null, 8, [
"border",
"default-sort",
"store",
"append-filter-panel-to",
"allow-drag-last-column",
"onSetDragVisible"
])], 6)], 2)), [[_directive_mousewheel, _ctx.handleHeaderFooterMousewheel]]) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", {
ref: "bodyWrapper",
class: (0, vue.normalizeClass)(_ctx.ns.e("body-wrapper"))
}, [(0, vue.createVNode)(_component_el_scrollbar, {
ref: "scrollBarRef",
"view-style": _ctx.scrollbarViewStyle,
"wrap-style": _ctx.scrollbarStyle,
always: _ctx.scrollbarAlwaysOn,
tabindex: _ctx.scrollbarTabindex,
native: _ctx.nativeScrollbar,
onScroll: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("scroll", $event))
}, {
default: (0, vue.withCtx)(() => [
(0, vue.createElementVNode)("table", {
ref: "tableBody",
class: (0, vue.normalizeClass)(_ctx.ns.e("body")),
cellspacing: "0",
cellpadding: "0",
border: "0",
style: (0, vue.normalizeStyle)({
width: _ctx.bodyWidth,
tableLayout: _ctx.tableLayout
})
}, [
(0, vue.createVNode)(_component_hColgroup, {
columns: _ctx.store.states.columns.value,
"table-layout": _ctx.tableLayout
}, null, 8, ["columns", "table-layout"]),
_ctx.showHeader && _ctx.tableLayout === "auto" ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_table_header, {
key: 0,
ref: "tableHeaderRef",
class: (0, vue.normalizeClass)(_ctx.ns.e("body-header")),
border: _ctx.border,
"default-sort": _ctx.defaultSort,
store: _ctx.store,
"append-filter-panel-to": _ctx.appendFilterPanelTo,
onSetDragVisible: _ctx.setDragVisible
}, null, 8, [
"class",
"border",
"default-sort",
"store",
"append-filter-panel-to",
"onSetDragVisible"
])) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createVNode)(_component_table_body, {
context: _ctx.context,
highlight: _ctx.highlightCurrentRow,
"row-class-name": _ctx.rowClassName,
"tooltip-effect": _ctx.computedTooltipEffect,
"tooltip-options": _ctx.computedTooltipOptions,
"row-style": _ctx.rowStyle,
store: _ctx.store,
stripe: _ctx.stripe
}, null, 8, [
"context",
"highlight",
"row-class-name",
"tooltip-effect",
"tooltip-options",
"row-style",
"store",
"stripe"
]),
_ctx.showSummary && _ctx.tableLayout === "auto" ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_table_footer, {
key: 1,
class: (0, vue.normalizeClass)(_ctx.ns.e("body-footer")),
border: _ctx.border,
"default-sort": _ctx.defaultSort,
store: _ctx.store,
"sum-text": _ctx.computedSumText,
"summary-method": _ctx.summaryMethod
}, null, 8, [
"class",
"border",
"default-sort",
"store",
"sum-text",
"summary-method"
])) : (0, vue.createCommentVNode)("v-if", true)
], 6),
_ctx.isEmpty ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
ref: "emptyBlock",
style: (0, vue.normalizeStyle)(_ctx.emptyBlockStyle),
class: (0, vue.normalizeClass)(_ctx.ns.e("empty-block"))
}, [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)(_ctx.ns.e("empty-text")) }, [(0, vue.renderSlot)(_ctx.$slots, "empty", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(_ctx.computedEmptyText), 1)])], 2)], 6)) : (0, vue.createCommentVNode)("v-if", true),
_ctx.$slots.append ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
ref: "appendWrapper",
class: (0, vue.normalizeClass)(_ctx.ns.e("append-wrapper"))
}, [(0, vue.renderSlot)(_ctx.$slots, "append")], 2)) : (0, vue.createCommentVNode)("v-if", true)
]),
_: 3
}, 8, [
"view-style",
"wrap-style",
"always",
"tabindex",
"native"
])], 2),
_ctx.showSummary && _ctx.tableLayout === "fixed" ? (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
ref: "footerWrapper",
class: (0, vue.normalizeClass)(_ctx.ns.e("footer-wrapper"))
}, [(0, vue.createElementVNode)("table", {
class: (0, vue.normalizeClass)(_ctx.ns.e("footer")),
cellspacing: "0",
cellpadding: "0",
border: "0",
style: (0, vue.normalizeStyle)(_ctx.tableBodyStyles)
}, [(0, vue.createVNode)(_component_hColgroup, {
columns: _ctx.store.states.columns.value,
"table-layout": _ctx.tableLayout
}, null, 8, ["columns", "table-layout"]), (0, vue.createVNode)(_component_table_footer, {
border: _ctx.border,
"default-sort": _ctx.defaultSort,
store: _ctx.store,
"sum-text": _ctx.computedSumText,
"summary-method": _ctx.summaryMethod
}, null, 8, [
"border",
"default-sort",
"store",
"sum-text",
"summary-method"
])], 6)], 2)), [[vue.vShow, !_ctx.isEmpty], [_directive_mousewheel, _ctx.handleHeaderFooterMousewheel]]) : (0, vue.createCommentVNode)("v-if", true),
_ctx.border || _ctx.isGroup ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 2,
class: (0, vue.normalizeClass)(_ctx.ns.e("border-left-patch"))
}, null, 2)) : (0, vue.createCommentVNode)("v-if", true)
], 2), (0, vue.withDirectives)((0, vue.createElementVNode)("div", {
ref: "resizeProxy",
class: (0, vue.normalizeClass)(_ctx.ns.e("column-resize-proxy"))
}, null, 2), [[vue.vShow, _ctx.resizeProxyVisible]])], 46, _hoisted_1$15);
}
var table_default = /* @__PURE__ */ _plugin_vue_export_helper_default(table_vue_vue_type_script_lang_default, [["render", _sfc_render$3]]);
//#endregion
//#region ../../packages/components/table/src/config.ts
const defaultClassNames = {
selection: "table-column--selection",
expand: "table__expand-column"
};
const cellStarts = {
default: { order: "" },
selection: {
width: 48,
minWidth: 48,
realWidth: 48,
order: ""
},
expand: {
width: 48,
minWidth: 48,
realWidth: 48,
order: ""
},
index: {
width: 48,
minWidth: 48,
realWidth: 48,
order: ""
}
};
const getDefaultClassName = (type) => {
return defaultClassNames[type] || "";
};
const cellForced = {
selection: {
renderHeader({ store }) {
function isDisabled() {
return store.states.data.value && store.states.data.value.length === 0;
}
return (0, vue.h)(ElCheckbox, {
disabled: isDisabled(),
size: store.states.tableSize.value,
indeterminate: store.states.selection.value.length > 0 && !store.states.isAllSelected.value,
"onUpdate:modelValue": store.toggleAllSelection ?? void 0,
modelValue: store.states.isAllSelected.value,
ariaLabel: store.t("el.table.selectAllLabel")
});
},
renderCell({ row, column, store, $index }) {
return (0, vue.h)(ElCheckbox, {
disabled: column.selectable ? !column.selectable.call(null, row, $index) : false,
size: store.states.tableSize.value,
onChange: () => {
store.commit("rowSelectedChanged", row);
},
onClick: (event) => event.stopPropagation(),
modelValue: store.isSelected(row),
ariaLabel: store.t("el.table.selectRowLabel")
});
},
sortable: false,
resizable: false
},
index: {
renderHeader({ column }) {
return column.label || "#";
},
renderCell({ column, $index }) {
let i = $index + 1;
const index = column.index;
if (isNumber(index)) i = $index + index;
else if (isFunction$1(index)) i = index($index);
return (0, vue.h)("div", {}, [i]);
},
sortable: false
},
expand: {
renderHeader({ column }) {
return column.label || "";
},
renderCell({ column, row, store, expanded, $index }) {
const { ns } = store;
const classes = [ns.e("expand-icon")];
if (!column.renderExpand && expanded) classes.push(ns.em("expand-icon", "expanded"));
const callback = function(e) {
e.stopPropagation();
store.toggleRowExpansion(row);
};
const isRowExpandable = store.states.rowExpandable.value?.(row, $index) ?? true;
if (!isRowExpandable) classes.push(ns.is("disabled"));
return (0, vue.h)("button", {
type: "button",
disabled: !isRowExpandable,
"aria-label": store.t(expanded ? "el.table.collapseRowLabel" : "el.table.expandRowLabel"),
"aria-expanded": expanded,
class: classes,
onClick: callback
}, { default: () => {
if (column.renderExpand) return [column.renderExpand({
expanded,
expandable: isRowExpandable
})];
return [(0, vue.h)(ElIcon, null, { default: () => {
return [(0, vue.h)(arrow_right_default)];
} })];
} });
},
sortable: false,
resizable: false
}
};
function defaultRenderCell({ row, column, $index }) {
const property = column.property;
const value = property && getProp(row, property).value;
if (column && column.formatter) return column.formatter(row, column, value, $index);
return value?.toString?.() || "";
}
function treeCellPrefix({ row, treeNode, store }, createPlaceholder = false) {
const { ns } = store;
if (!treeNode) {
if (createPlaceholder) return [(0, vue.h)("span", { class: ns.e("placeholder") })];
return null;
}
const ele = [];
const callback = function(e) {
e.stopPropagation();
if (treeNode.loading) return;
store.loadOrToggle(row);
};
if (treeNode.indent) ele.push((0, vue.h)("span", {
class: ns.e("indent"),
style: { "padding-left": `${treeNode.indent}px` }
}));
if (isBoolean(treeNode.expanded) && !treeNode.noLazyChildren) {
const expandClasses = [ns.e("expand-icon"), treeNode.expanded ? ns.em("expand-icon", "expanded") : ""];
let icon = arrow_right_default;
if (treeNode.loading) icon = loading_default;
ele.push((0, vue.h)("button", {
type: "button",
"aria-label": store.t(treeNode.expanded ? "el.table.collapseRowLabel" : "el.table.expandRowLabel"),
"aria-expanded": treeNode.expanded,
class: expandClasses,
onClick: callback
}, { default: () => {
return [(0, vue.h)(ElIcon, { class: ns.is("loading", treeNode.loading) }, { default: () => [(0, vue.h)(icon)] })];
} }));
} else ele.push((0, vue.h)("span", { class: ns.e("placeholder") }));
return ele;
}
//#endregion
//#region ../../packages/components/table/src/table-column/watcher-helper.ts
function getAllAliases(props, aliases) {
return props.reduce((prev, cur) => {
prev[cur] = cur;
return prev;
}, aliases);
}
function useWatcher(owner, props_) {
const instance = (0, vue.getCurrentInstance)();
const registerComplexWatchers = () => {
const props = ["fixed"];
const aliases = {
realWidth: "width",
realMinWidth: "minWidth"
};
const allAliases = getAllAliases(props, aliases);
Object.keys(allAliases).forEach((key) => {
const columnKey = aliases[key];
if (hasOwn(props_, columnKey)) (0, vue.watch)(() => props_[columnKey], (newVal) => {
let value = newVal;
if (columnKey === "width" && key === "realWidth") value = parseWidth(newVal);
if (columnKey === "minWidth" && key === "realMinWidth") value = parseMinWidth(newVal);
instance.columnConfig.value[columnKey] = value;
instance.columnConfig.value[key] = value;
const updateColumns = columnKey === "fixed";
owner.value.store.scheduleLayout(updateColumns);
});
});
};
const registerNormalWatchers = () => {
const props = [
"label",
"filters",
"filterMultiple",
"filteredValue",
"sortable",
"index",
"formatter",
"className",
"labelClassName",
"filterClassName",
"showOverflowTooltip",
"tooltipFormatter",
"resizable"
];
const parentProps = ["showOverflowTooltip"];
const aliases = {
property: "prop",
align: "realAlign",
headerAlign: "realHeaderAlign"
};
const allAliases = getAllAliases(props, aliases);
Object.keys(allAliases).forEach((key) => {
const columnKey = aliases[key];
if (hasOwn(props_, columnKey)) (0, vue.watch)(() => props_[columnKey], (newVal) => {
instance.columnConfig.value[key] = newVal;
if (key === "filters" || key === "filterMethod") instance.columnConfig.value["filterable"] = !!(instance.columnConfig.value["filters"] || instance.columnConfig.value["filterMethod"]);
});
});
parentProps.forEach((key) => {
if (hasOwn(owner.value.props, key)) (0, vue.watch)(() => owner.value.props[key], (newVal) => {
if (instance.columnConfig.value.type === "selection") return;
if (!isUndefined(props_[key])) return;
instance.columnConfig.value[key] = newVal;
});
});
const globalConfig = useGlobalConfig("table");
if (globalConfig.value && hasOwn(globalConfig.value, "showOverflowTooltip")) (0, vue.watch)(() => globalConfig.value?.showOverflowTooltip, (newVal) => {
if (instance.columnConfig.value.type === "selection") return;
if (!isUndefined(props_.showOverflowTooltip) || !isUndefined(owner.value.props.showOverflowTooltip)) return;
instance.columnConfig.value.showOverflowTooltip = newVal;
});
};
return {
registerComplexWatchers,
registerNormalWatchers
};
}
//#endregion
//#region ../../packages/components/table/src/table-column/render-helper.ts
function useRender(props, slots, owner) {
const instance = (0, vue.getCurrentInstance)();
const columnId = (0, vue.ref)("");
const isSubColumn = (0, vue.ref)(false);
const realAlign = (0, vue.ref)();
const realHeaderAlign = (0, vue.ref)();
const ns = useNamespace("table");
(0, vue.watchEffect)(() => {
realAlign.value = props.align ? `is-${props.align}` : null;
realAlign.value;
});
(0, vue.watchEffect)(() => {
realHeaderAlign.value = props.headerAlign ? `is-${props.headerAlign}` : realAlign.value;
realHeaderAlign.value;
});
const columnOrTableParent = (0, vue.computed)(() => {
let parent = instance.vnode.vParent || instance.parent;
while (parent && !parent.tableId && !parent.columnId) parent = parent.vnode.vParent || parent.parent;
return parent;
});
const hasTreeColumn = (0, vue.computed)(() => {
const { store } = instance.parent;
if (!store) return false;
const { treeData } = store.states;
const treeDataValue = treeData.value;
return treeDataValue && Object.keys(treeDataValue).length > 0;
});
const realWidth = (0, vue.ref)(parseWidth(props.width));
const realMinWidth = (0, vue.ref)(parseMinWidth(props.minWidth));
const setColumnWidth = (column) => {
if (realWidth.value) column.width = realWidth.value;
if (realMinWidth.value) column.minWidth = realMinWidth.value;
if (!realWidth.value && realMinWidth.value) column.width = void 0;
if (!column.minWidth) column.minWidth = 80;
column.realWidth = Number(isUndefined(column.width) ? column.minWidth : column.width);
return column;
};
const setColumnForcedProps = (column) => {
const type = column.type;
const source = cellForced[type] || {};
Object.keys(source).forEach((prop) => {
const value = source[prop];
if (prop !== "className" && !isUndefined(value)) column[prop] = value;
});
const className = getDefaultClassName(type);
if (className) {
const forceClass = `${(0, vue.unref)(ns.namespace)}-${className}`;
column.className = column.className ? `${column.className} ${forceClass}` : forceClass;
}
return column;
};
const checkSubColumn = (children) => {
if (isArray$1(children)) children.forEach((child) => check(child));
else check(children);
function check(item) {
if (item?.type?.name === "ElTableColumn") item.vParent = instance;
}
};
const setColumnRenders = (column) => {
if (props.renderHeader) /* @__PURE__ */ debugWarn("TableColumn", "Comparing to render-header, scoped-slot header is easier to use. We recommend users to use scoped-slot header.");
else if (column.type !== "selection") column.renderHeader = (scope) => {
instance.columnConfig.value["label"];
if (slots.header) {
const slotResult = slots.header(scope);
if (ensureValidVNode(slotResult)) return (0, vue.h)(vue.Fragment, slotResult);
}
return (0, vue.createTextVNode)(column.label);
};
if (slots["filter-icon"]) column.renderFilterIcon = (scope) => {
return (0, vue.renderSlot)(slots, "filter-icon", scope);
};
if (slots.expand) column.renderExpand = (scope) => {
return (0, vue.renderSlot)(slots, "expand", scope);
};
let originRenderCell = column.renderCell;
if (column.type === "expand") {
column.renderCell = (data) => (0, vue.h)("div", { class: "cell" }, [originRenderCell(data)]);
owner.value.renderExpanded = (row) => {
return slots.default ? slots.default(row) : slots.default;
};
} else {
originRenderCell = originRenderCell || defaultRenderCell;
column.renderCell = (data) => {
let children = null;
if (slots.default) {
const vnodes = slots.default(data);
children = vnodes.some((v) => v.type !== vue.Comment) ? vnodes : originRenderCell(data);
} else children = originRenderCell(data);
const { columns } = owner.value.store.states;
const firstUserColumnIndex = columns.value.findIndex((item) => item.type === "default");
const prefix = treeCellPrefix(data, hasTreeColumn.value && data.cellIndex === firstUserColumnIndex);
const props = {
class: "cell",
style: {}
};
if (column.showOverflowTooltip) {
props.class = `${props.class} ${(0, vue.unref)(ns.namespace)}-tooltip`;
props.style = { width: `${(data.column.realWidth || Number(data.column.width)) - 1}px` };
}
checkSubColumn(children);
return (0, vue.h)("div", props, [prefix, children]);
};
}
return column;
};
const getPropsData = (...propsKey) => {
return propsKey.reduce((prev, cur) => {
if (isArray$1(cur)) cur.forEach((key) => {
prev[key] = props[key];
});
return prev;
}, {});
};
const getColumnElIndex = (children, child) => {
return Array.prototype.indexOf.call(children, child);
};
const updateColumnOrder = () => {
owner.value.store.commit("updateColumnOrder", instance.columnConfig.value);
};
return {
columnId,
realAlign,
isSubColumn,
realHeaderAlign,
columnOrTableParent,
setColumnWidth,
setColumnForcedProps,
setColumnRenders,
getPropsData,
getColumnElIndex,
updateColumnOrder
};
}
//#endregion
//#region ../../packages/components/table/src/table-column/defaults.ts
var defaults_default$1 = {
type: {
type: String,
default: "default"
},
label: String,
className: String,
labelClassName: String,
property: String,
prop: String,
width: {
type: [String, Number],
default: ""
},
minWidth: {
type: [String, Number],
default: ""
},
renderHeader: Function,
sortable: {
type: [Boolean, String],
default: false
},
sortMethod: Function,
sortBy: [
String,
Function,
Array
],
resizable: {
type: Boolean,
default: true
},
columnKey: String,
align: String,
headerAlign: String,
showOverflowTooltip: {
type: [Boolean, Object],
default: void 0
},
tooltipFormatter: Function,
fixed: [Boolean, String],
formatter: Function,
selectable: Function,
reserveSelection: Boolean,
filterMethod: Function,
filteredValue: Array,
filters: Array,
filterPlacement: String,
filterMultiple: {
type: Boolean,
default: true
},
filterClassName: String,
index: [Number, Function],
sortOrders: {
type: Array,
default: () => {
return [
"ascending",
"descending",
null
];
},
validator: (val) => {
return val.every((order) => [
"ascending",
"descending",
null
].includes(order));
}
}
};
//#endregion
//#region ../../packages/components/table/src/table-column/index.ts
let columnIdSeed = 1;
var table_column_default = (0, vue.defineComponent)({
name: "ElTableColumn",
components: { ElCheckbox },
props: defaults_default$1,
setup(props, { slots }) {
const instance = (0, vue.getCurrentInstance)();
const globalConfig = useGlobalConfig("table");
const columnConfig = (0, vue.ref)({});
const owner = (0, vue.computed)(() => {
let parent = instance.parent;
while (parent && !parent.tableId) parent = parent.parent;
return parent;
});
const { registerNormalWatchers, registerComplexWatchers } = useWatcher(owner, props);
const { columnId, isSubColumn, realHeaderAlign, columnOrTableParent, setColumnWidth, setColumnForcedProps, setColumnRenders, getPropsData, getColumnElIndex, realAlign, updateColumnOrder } = useRender(props, slots, owner);
const parent = columnOrTableParent.value;
columnId.value = `${"tableId" in parent && parent.tableId || "columnId" in parent && parent.columnId}_column_${columnIdSeed++}`;
(0, vue.onBeforeMount)(() => {
isSubColumn.value = owner.value !== parent;
const type = props.type || "default";
const sortable = props.sortable === "" ? true : props.sortable;
const showOverflowTooltip = type === "selection" ? false : isUndefined(props.showOverflowTooltip) ? parent.props.showOverflowTooltip ?? globalConfig.value?.showOverflowTooltip : props.showOverflowTooltip;
const tooltipFormatter = isUndefined(props.tooltipFormatter) ? parent.props.tooltipFormatter ?? globalConfig.value?.tooltipFormatter : props.tooltipFormatter;
const defaults = {
...cellStarts[type],
id: columnId.value,
type,
property: props.prop || props.property,
align: realAlign,
headerAlign: realHeaderAlign,
showOverflowTooltip,
tooltipFormatter,
filterable: props.filters || props.filterMethod,
filteredValue: [],
filterPlacement: "",
filterClassName: "",
isColumnGroup: false,
isSubColumn: false,
filterOpened: false,
sortable,
index: props.index,
rawColumnKey: instance.vnode.key
};
let column = getPropsData([
"columnKey",
"label",
"className",
"labelClassName",
"type",
"renderHeader",
"formatter",
"fixed",
"resizable"
], [
"sortMethod",
"sortBy",
"sortOrders"
], ["selectable", "reserveSelection"], [
"filterMethod",
"filters",
"filterMultiple",
"filterOpened",
"filteredValue",
"filterPlacement",
"filterClassName"
]);
column = mergeOptions(defaults, column);
column = compose(setColumnRenders, setColumnWidth, setColumnForcedProps)(column);
columnConfig.value = column;
registerNormalWatchers();
registerComplexWatchers();
});
(0, vue.onMounted)(() => {
const parent = columnOrTableParent.value;
const children = isSubColumn.value ? parent.vnode.el?.children : parent.refs.hiddenColumns?.children;
const getColumnIndex = () => getColumnElIndex(children || [], instance.vnode.el);
columnConfig.value.getColumnIndex = getColumnIndex;
getColumnIndex() > -1 && owner.value.store.commit("insertColumn", columnConfig.value, isSubColumn.value ? "columnConfig" in parent && parent.columnConfig.value : null, updateColumnOrder);
});
(0, vue.onBeforeUnmount)(() => {
const getColumnIndex = columnConfig.value.getColumnIndex;
(getColumnIndex ? getColumnIndex() : -1) > -1 && owner.value.store.commit("removeColumn", columnConfig.value, isSubColumn.value ? "columnConfig" in parent && parent.columnConfig.value : null, updateColumnOrder);
});
instance.columnId = columnId.value;
instance.columnConfig = columnConfig;
},
render() {
try {
const renderDefault = this.$slots.default?.({
row: {},
column: {},
$index: -1
});
const children = [];
if (isArray$1(renderDefault)) {
for (const childNode of renderDefault) if (childNode.type?.name === "ElTableColumn" || childNode.shapeFlag & 2) children.push(childNode);
else if (childNode.type === vue.Fragment && isArray$1(childNode.children)) childNode.children.forEach((vnode) => {
if (vnode?.patchFlag !== 1024 && !isString(vnode?.children)) children.push(vnode);
});
}
return (0, vue.h)("div", children);
} catch {
return (0, vue.h)("div", []);
}
}
});
//#endregion
//#region ../../packages/components/table/src/tableColumn.ts
var tableColumn_default = table_column_default;
//#endregion
//#region ../../packages/components/table/index.ts
const ElTable = withInstall(table_default, { TableColumn: tableColumn_default });
const ElTableColumn = withNoopInstall(tableColumn_default);
//#endregion
//#region ../../packages/components/table-v2/src/constants.ts
let SortOrder = /* @__PURE__ */ function(SortOrder) {
SortOrder["ASC"] = "asc";
SortOrder["DESC"] = "desc";
return SortOrder;
}({});
let Alignment = /* @__PURE__ */ function(Alignment) {
Alignment["LEFT"] = "left";
Alignment["CENTER"] = "center";
Alignment["RIGHT"] = "right";
return Alignment;
}({});
let FixedDir = /* @__PURE__ */ function(FixedDir) {
FixedDir["LEFT"] = "left";
FixedDir["RIGHT"] = "right";
return FixedDir;
}({});
const oppositeOrderMap = {
[SortOrder.ASC]: SortOrder.DESC,
[SortOrder.DESC]: SortOrder.ASC
};
const sortOrders = [SortOrder.ASC, SortOrder.DESC];
//#endregion
//#region ../../packages/components/table-v2/src/private.ts
const placeholderSign = Symbol("placeholder");
//#endregion
//#region ../../packages/components/table-v2/src/composables/utils.ts
const calcColumnStyle = (column, fixedColumn, fixed) => {
const flex = {
flexGrow: 0,
flexShrink: 0,
...fixed ? {} : {
flexGrow: column.flexGrow ?? 0,
flexShrink: column.flexShrink ?? 1
}
};
const style = {
...column.style ?? {},
...flex,
flexBasis: "auto",
width: column.width
};
if (!fixedColumn) {
if (column.maxWidth) style.maxWidth = column.maxWidth;
if (column.minWidth) style.minWidth = column.minWidth;
}
return style;
};
//#endregion
//#region ../../packages/components/table-v2/src/composables/use-columns.ts
function useColumns(props, columns, fixed) {
const _columns = (0, vue.computed)(() => (0, vue.unref)(columns).map((column, index) => ({
...column,
key: column.key ?? column.dataKey ?? index
})));
const visibleColumns = (0, vue.computed)(() => {
return (0, vue.unref)(_columns).filter((column) => !column.hidden);
});
const fixedColumnsOnLeft = (0, vue.computed)(() => (0, vue.unref)(visibleColumns).filter((column) => column.fixed === "left" || column.fixed === true));
const fixedColumnsOnRight = (0, vue.computed)(() => (0, vue.unref)(visibleColumns).filter((column) => column.fixed === "right"));
const normalColumns = (0, vue.computed)(() => (0, vue.unref)(visibleColumns).filter((column) => !column.fixed));
const mainColumns = (0, vue.computed)(() => {
const ret = [];
(0, vue.unref)(fixedColumnsOnLeft).forEach((column) => {
ret.push({
...column,
placeholderSign
});
});
(0, vue.unref)(normalColumns).forEach((column) => {
ret.push(column);
});
(0, vue.unref)(fixedColumnsOnRight).forEach((column) => {
ret.push({
...column,
placeholderSign
});
});
return ret;
});
const hasFixedColumns = (0, vue.computed)(() => {
return (0, vue.unref)(fixedColumnsOnLeft).length || (0, vue.unref)(fixedColumnsOnRight).length;
});
const columnsStyles = (0, vue.computed)(() => {
return (0, vue.unref)(_columns).reduce((style, column) => {
style[column.key] = calcColumnStyle(column, (0, vue.unref)(fixed), props.fixed);
return style;
}, {});
});
const columnsTotalWidth = (0, vue.computed)(() => {
return (0, vue.unref)(visibleColumns).reduce((width, column) => width + column.width, 0);
});
const getColumn = (key) => {
return (0, vue.unref)(_columns).find((column) => column.key === key);
};
const getColumnStyle = (key) => {
return (0, vue.unref)(columnsStyles)[key];
};
const updateColumnWidth = (column, width) => {
column.width = width;
};
function onColumnSorted(e) {
const { key } = e.currentTarget.dataset;
if (!key) return;
const { sortState, sortBy } = props;
let order = SortOrder.ASC;
if (isObject$1(sortState)) order = oppositeOrderMap[sortState[key]];
else order = oppositeOrderMap[sortBy.order];
props.onColumnSort?.({
column: getColumn(key),
key,
order
});
}
return {
columns: _columns,
columnsStyles,
columnsTotalWidth,
fixedColumnsOnLeft,
fixedColumnsOnRight,
hasFixedColumns,
mainColumns,
normalColumns,
visibleColumns,
getColumn,
getColumnStyle,
updateColumnWidth,
onColumnSorted
};
}
//#endregion
//#region ../../packages/components/table-v2/src/composables/use-scrollbar.ts
const useScrollbar = (props, { mainTableRef, leftTableRef, rightTableRef, onMaybeEndReached }) => {
const scrollPos = (0, vue.ref)({
scrollLeft: 0,
scrollTop: 0
});
function doScroll(params) {
const { scrollTop } = params;
mainTableRef.value?.scrollTo(params);
leftTableRef.value?.scrollToTop(scrollTop);
rightTableRef.value?.scrollToTop(scrollTop);
}
function scrollTo(params) {
scrollPos.value = params;
doScroll(params);
}
function scrollToTop(scrollTop) {
scrollPos.value.scrollTop = scrollTop;
doScroll((0, vue.unref)(scrollPos));
}
function scrollToLeft(scrollLeft) {
scrollPos.value.scrollLeft = scrollLeft;
mainTableRef.value?.scrollTo?.((0, vue.unref)(scrollPos));
}
function onScroll(params) {
scrollTo(params);
props.onScroll?.(params);
}
function onVerticalScroll({ scrollTop }) {
const { scrollTop: currentScrollTop } = (0, vue.unref)(scrollPos);
if (scrollTop !== currentScrollTop) scrollToTop(scrollTop);
}
function scrollToRow(row, strategy = "auto") {
mainTableRef.value?.scrollToRow(row, strategy);
}
(0, vue.watch)(() => (0, vue.unref)(scrollPos).scrollTop, (cur, prev) => {
if (cur > prev) onMaybeEndReached();
});
return {
scrollPos,
scrollTo,
scrollToLeft,
scrollToTop,
scrollToRow,
onScroll,
onVerticalScroll
};
};
//#endregion
//#region ../../packages/components/table-v2/src/composables/use-row.ts
const useRow = (props, { mainTableRef, leftTableRef, rightTableRef, tableInstance, ns, isScrolling }) => {
const vm = (0, vue.getCurrentInstance)();
const { emit } = vm;
const isResetting = (0, vue.shallowRef)(false);
const expandedRowKeys = (0, vue.ref)(props.defaultExpandedRowKeys || []);
const lastRenderedRowIndex = (0, vue.ref)(-1);
const resetIndex = (0, vue.shallowRef)(null);
const rowHeights = (0, vue.ref)({});
const pendingRowHeights = (0, vue.ref)({});
const leftTableHeights = (0, vue.shallowRef)({});
const mainTableHeights = (0, vue.shallowRef)({});
const rightTableHeights = (0, vue.shallowRef)({});
const isDynamic = (0, vue.computed)(() => isNumber(props.estimatedRowHeight));
function onRowsRendered(params) {
props.onRowsRendered?.(params);
if (params.rowCacheEnd > (0, vue.unref)(lastRenderedRowIndex)) lastRenderedRowIndex.value = params.rowCacheEnd;
}
function onRowHovered({ hovered, rowKey }) {
if (isScrolling.value) return;
tableInstance.vnode.el.querySelectorAll(`[rowkey="${String(rowKey)}"]`).forEach((row) => {
if (hovered) row.classList.add(ns.is("hovered"));
else row.classList.remove(ns.is("hovered"));
});
}
function onRowExpanded({ expanded, rowData, rowIndex, rowKey }) {
const _expandedRowKeys = [...(0, vue.unref)(expandedRowKeys)];
const currentKeyIndex = _expandedRowKeys.indexOf(rowKey);
if (expanded) {
if (currentKeyIndex === -1) _expandedRowKeys.push(rowKey);
} else if (currentKeyIndex > -1) _expandedRowKeys.splice(currentKeyIndex, 1);
expandedRowKeys.value = _expandedRowKeys;
emit("update:expandedRowKeys", _expandedRowKeys);
props.onRowExpand?.({
expanded,
rowData,
rowIndex,
rowKey
});
props.onExpandedRowsChange?.(_expandedRowKeys);
if (tableInstance.vnode.el.querySelector(`.${ns.is("hovered")}[rowkey="${String(rowKey)}"]`)) (0, vue.nextTick)(() => onRowHovered({
hovered: true,
rowKey
}));
}
const flushingRowHeights = debounce(() => {
isResetting.value = true;
rowHeights.value = {
...(0, vue.unref)(rowHeights),
...(0, vue.unref)(pendingRowHeights)
};
resetAfterIndex((0, vue.unref)(resetIndex), false);
pendingRowHeights.value = {};
resetIndex.value = null;
mainTableRef.value?.forceUpdate();
leftTableRef.value?.forceUpdate();
rightTableRef.value?.forceUpdate();
vm.proxy?.$forceUpdate();
isResetting.value = false;
}, 0);
function resetAfterIndex(index, forceUpdate = false) {
if (!(0, vue.unref)(isDynamic)) return;
[
mainTableRef,
leftTableRef,
rightTableRef
].forEach((tableRef) => {
const table = (0, vue.unref)(tableRef);
if (table) table.resetAfterRowIndex(index, forceUpdate);
});
}
function resetHeights(rowKey, height, rowIdx) {
const resetIdx = (0, vue.unref)(resetIndex);
if (resetIdx === null) resetIndex.value = rowIdx;
else if (resetIdx > rowIdx) resetIndex.value = rowIdx;
pendingRowHeights.value[rowKey] = height;
}
function onRowHeightChange({ rowKey, height, rowIndex }, fixedDir) {
if (!fixedDir) mainTableHeights.value[rowKey] = height;
else if (fixedDir === FixedDir.RIGHT) rightTableHeights.value[rowKey] = height;
else leftTableHeights.value[rowKey] = height;
const maximumHeight = Math.max(...[
leftTableHeights,
rightTableHeights,
mainTableHeights
].map((records) => records.value[rowKey] || 0));
if ((0, vue.unref)(rowHeights)[rowKey] !== maximumHeight) {
resetHeights(rowKey, maximumHeight, rowIndex);
flushingRowHeights();
}
}
return {
expandedRowKeys,
lastRenderedRowIndex,
isDynamic,
isResetting,
rowHeights,
resetAfterIndex,
onRowExpanded,
onRowHovered,
onRowsRendered,
onRowHeightChange
};
};
//#endregion
//#region ../../packages/components/table-v2/src/composables/use-data.ts
const useData = (props, { expandedRowKeys, lastRenderedRowIndex, resetAfterIndex }) => {
const depthMap = (0, vue.ref)({});
const flattenedData = (0, vue.computed)(() => {
const depths = {};
const { data, rowKey } = props;
const _expandedRowKeys = (0, vue.unref)(expandedRowKeys);
if (!_expandedRowKeys || !_expandedRowKeys.length) return data;
const array = [];
const keysSet = /* @__PURE__ */ new Set();
_expandedRowKeys.forEach((x) => keysSet.add(x));
let copy = data.slice();
copy.forEach((x) => depths[x[rowKey]] = 0);
while (copy.length > 0) {
const item = copy.shift();
array.push(item);
if (keysSet.has(item[rowKey]) && isArray$1(item.children) && item.children.length > 0) {
copy = [...item.children, ...copy];
item.children.forEach((child) => depths[child[rowKey]] = depths[item[rowKey]] + 1);
}
}
depthMap.value = depths;
return array;
});
const data = (0, vue.computed)(() => {
const { data, expandColumnKey } = props;
return expandColumnKey ? (0, vue.unref)(flattenedData) : data;
});
(0, vue.watch)(data, (val, prev) => {
if (val !== prev) {
lastRenderedRowIndex.value = -1;
resetAfterIndex(0, true);
}
});
return {
data,
depthMap
};
};
//#endregion
//#region ../../packages/components/table-v2/src/utils.ts
const sumReducer = (sum, num) => sum + num;
const sum = (listLike) => {
return isArray$1(listLike) ? listLike.reduce(sumReducer, 0) : listLike;
};
const tryCall = (fLike, params, defaultRet = {}) => {
return isFunction$1(fLike) ? fLike(params) : fLike ?? defaultRet;
};
const enforceUnit = (style) => {
[
"width",
"maxWidth",
"minWidth",
"height"
].forEach((key) => {
style[key] = addUnit(style[key]);
});
return style;
};
const componentToSlot = (ComponentLike) => (0, vue.isVNode)(ComponentLike) ? (props) => (0, vue.h)(ComponentLike, props) : ComponentLike;
//#endregion
//#region ../../packages/components/table-v2/src/composables/use-styles.ts
const useStyles = (props, { columnsTotalWidth, rowsHeight, fixedColumnsOnLeft, fixedColumnsOnRight }) => {
const bodyWidth = (0, vue.computed)(() => {
const { fixed, width, vScrollbarSize } = props;
const ret = width - vScrollbarSize;
return fixed ? Math.max(Math.round((0, vue.unref)(columnsTotalWidth)), ret) : ret;
});
const mainTableHeight = (0, vue.computed)(() => {
const { height = 0, maxHeight = 0, footerHeight, hScrollbarSize } = props;
if (maxHeight > 0) {
const _fixedRowsHeight = (0, vue.unref)(fixedRowsHeight);
const _rowsHeight = (0, vue.unref)(rowsHeight);
const total = (0, vue.unref)(headerHeight) + _fixedRowsHeight + _rowsHeight + hScrollbarSize;
return Math.min(total, maxHeight - footerHeight);
}
return height - footerHeight;
});
const fixedTableHeight = (0, vue.computed)(() => {
const { maxHeight } = props;
const tableHeight = (0, vue.unref)(mainTableHeight);
if (isNumber(maxHeight) && maxHeight > 0) return tableHeight;
const totalHeight = (0, vue.unref)(rowsHeight) + (0, vue.unref)(headerHeight) + (0, vue.unref)(fixedRowsHeight);
return Math.min(tableHeight, totalHeight);
});
const mapColumn = (column) => column.width;
const leftTableWidth = (0, vue.computed)(() => sum((0, vue.unref)(fixedColumnsOnLeft).map(mapColumn)));
const rightTableWidth = (0, vue.computed)(() => sum((0, vue.unref)(fixedColumnsOnRight).map(mapColumn)));
const headerHeight = (0, vue.computed)(() => sum(props.headerHeight));
const fixedRowsHeight = (0, vue.computed)(() => {
return (props.fixedData?.length || 0) * props.rowHeight;
});
const windowHeight = (0, vue.computed)(() => {
return (0, vue.unref)(mainTableHeight) - (0, vue.unref)(headerHeight) - (0, vue.unref)(fixedRowsHeight);
});
const rootStyle = (0, vue.computed)(() => {
const { style = {}, height, width } = props;
return enforceUnit({
...style,
height,
width
});
});
return {
bodyWidth,
fixedTableHeight,
mainTableHeight,
leftTableWidth,
rightTableWidth,
windowHeight,
footerHeight: (0, vue.computed)(() => enforceUnit({ height: props.footerHeight })),
emptyStyle: (0, vue.computed)(() => ({
top: addUnit((0, vue.unref)(headerHeight)),
bottom: addUnit(props.footerHeight),
width: addUnit(props.width)
})),
rootStyle,
headerHeight
};
};
//#endregion
//#region ../../packages/components/table-v2/src/composables/use-auto-resize.ts
const useAutoResize = (props) => {
const sizer = (0, vue.ref)();
const width$ = (0, vue.ref)(0);
const height$ = (0, vue.ref)(0);
let resizerStopper;
(0, vue.onMounted)(() => {
resizerStopper = useResizeObserver(sizer, ([entry]) => {
const { width, height } = entry.contentRect;
const { paddingLeft, paddingRight, paddingTop, paddingBottom } = getComputedStyle(entry.target);
const left = Number.parseInt(paddingLeft) || 0;
const right = Number.parseInt(paddingRight) || 0;
const top = Number.parseInt(paddingTop) || 0;
const bottom = Number.parseInt(paddingBottom) || 0;
width$.value = width - left - right;
height$.value = height - top - bottom;
}).stop;
});
(0, vue.onBeforeUnmount)(() => {
resizerStopper?.();
});
(0, vue.watch)([width$, height$], ([width, height]) => {
props.onResize?.({
width,
height
});
});
return {
sizer,
width: width$,
height: height$
};
};
//#endregion
//#region ../../packages/components/table-v2/src/use-table.ts
function useTable(props) {
const mainTableRef = (0, vue.ref)();
const leftTableRef = (0, vue.ref)();
const rightTableRef = (0, vue.ref)();
const { columns, columnsStyles, columnsTotalWidth, fixedColumnsOnLeft, fixedColumnsOnRight, hasFixedColumns, mainColumns, onColumnSorted } = useColumns(props, (0, vue.toRef)(props, "columns"), (0, vue.toRef)(props, "fixed"));
const { scrollTo, scrollToLeft, scrollToTop, scrollToRow, onScroll, onVerticalScroll, scrollPos } = useScrollbar(props, {
mainTableRef,
leftTableRef,
rightTableRef,
onMaybeEndReached
});
const ns = useNamespace("table-v2");
const instance = (0, vue.getCurrentInstance)();
const isScrolling = (0, vue.shallowRef)(false);
const { expandedRowKeys, lastRenderedRowIndex, isDynamic, isResetting, rowHeights, resetAfterIndex, onRowExpanded, onRowHeightChange, onRowHovered, onRowsRendered } = useRow(props, {
mainTableRef,
leftTableRef,
rightTableRef,
tableInstance: instance,
ns,
isScrolling
});
const { data, depthMap } = useData(props, {
expandedRowKeys,
lastRenderedRowIndex,
resetAfterIndex
});
const rowsHeight = (0, vue.computed)(() => {
const { estimatedRowHeight, rowHeight } = props;
const _data = (0, vue.unref)(data);
if (isNumber(estimatedRowHeight)) return Object.values((0, vue.unref)(rowHeights)).reduce((acc, curr) => acc + curr, 0);
return _data.length * rowHeight;
});
const { bodyWidth, fixedTableHeight, mainTableHeight, leftTableWidth, rightTableWidth, windowHeight, footerHeight, emptyStyle, rootStyle, headerHeight } = useStyles(props, {
columnsTotalWidth,
fixedColumnsOnLeft,
fixedColumnsOnRight,
rowsHeight
});
const containerRef = (0, vue.ref)();
const showEmpty = (0, vue.computed)(() => {
const noData = (0, vue.unref)(data).length === 0;
return isArray$1(props.fixedData) ? props.fixedData.length === 0 && noData : noData;
});
function getRowHeight(rowIndex) {
const { estimatedRowHeight, rowHeight, rowKey } = props;
if (!estimatedRowHeight) return rowHeight;
return (0, vue.unref)(rowHeights)[(0, vue.unref)(data)[rowIndex][rowKey]] || estimatedRowHeight;
}
const isEndReached = (0, vue.ref)(false);
function onMaybeEndReached() {
const { onEndReached } = props;
if (!onEndReached) return;
const { scrollTop } = (0, vue.unref)(scrollPos);
const _totalHeight = (0, vue.unref)(rowsHeight);
const remainDistance = _totalHeight - (scrollTop + (0, vue.unref)(windowHeight)) + props.hScrollbarSize;
if (!isEndReached.value && (0, vue.unref)(lastRenderedRowIndex) >= 0 && _totalHeight <= scrollTop + (0, vue.unref)(mainTableHeight) - (0, vue.unref)(headerHeight)) {
isEndReached.value = true;
onEndReached(remainDistance);
} else isEndReached.value = false;
}
(0, vue.watch)(() => (0, vue.unref)(rowsHeight), () => isEndReached.value = false);
(0, vue.watch)(() => props.expandedRowKeys, (val) => expandedRowKeys.value = val, { deep: true });
return {
columns,
containerRef,
mainTableRef,
leftTableRef,
rightTableRef,
isDynamic,
isResetting,
isScrolling,
hasFixedColumns,
columnsStyles,
columnsTotalWidth,
data,
expandedRowKeys,
depthMap,
fixedColumnsOnLeft,
fixedColumnsOnRight,
mainColumns,
bodyWidth,
emptyStyle,
rootStyle,
footerHeight,
mainTableHeight,
fixedTableHeight,
leftTableWidth,
rightTableWidth,
showEmpty,
getRowHeight,
onColumnSorted,
onRowHovered,
onRowExpanded,
onRowsRendered,
onRowHeightChange,
scrollTo,
scrollToLeft,
scrollToTop,
scrollToRow,
onScroll,
onVerticalScroll
};
}
//#endregion
//#region ../../packages/components/table-v2/src/tokens.ts
const TableV2InjectionKey = Symbol("tableV2");
const TABLE_V2_GRID_INJECTION_KEY = "tableV2GridScrollLeft";
//#endregion
//#region ../../packages/components/table-v2/src/common.ts
/**
* @Note even though we can use `string[] | string` as the type but for
* convenience here we only use `string` as the acceptable value here.
*/
const classType = String;
const columns = {
type: definePropType(Array),
required: true
};
const column = { type: definePropType(Object) };
const fixedDataType = { type: definePropType(Array) };
const dataType = {
...fixedDataType,
required: true
};
const expandColumnKey = String;
const expandKeys = {
type: definePropType(Array),
default: () => mutable([])
};
const requiredNumber = {
type: Number,
required: true
};
const rowKey = {
type: definePropType([
String,
Number,
Symbol
]),
default: "id"
};
/**
* @note even though we can use `StyleValue` but that would be difficult for us to mapping them,
* so we only use `CSSProperties` as the acceptable value here.
*/
const styleType = { type: definePropType(Object) };
//#endregion
//#region ../../packages/components/table-v2/src/row.ts
const tableV2RowProps = buildProps({
class: String,
columns,
columnsStyles: {
type: definePropType(Object),
required: true
},
depth: Number,
expandColumnKey,
estimatedRowHeight: {
...virtualizedGridProps.estimatedRowHeight,
default: void 0
},
isScrolling: Boolean,
onRowExpand: { type: definePropType(Function) },
onRowHover: { type: definePropType(Function) },
onRowHeightChange: { type: definePropType(Function) },
rowData: {
type: definePropType(Object),
required: true
},
rowEventHandlers: { type: definePropType(Object) },
rowIndex: {
type: Number,
required: true
},
rowKey,
style: { type: definePropType(Object) }
});
//#endregion
//#region ../../packages/components/table-v2/src/header.ts
const requiredNumberType = {
type: Number,
required: true
};
const tableV2HeaderProps = buildProps({
class: String,
columns,
fixedHeaderData: { type: definePropType(Array) },
headerData: {
type: definePropType(Array),
required: true
},
headerHeight: {
type: definePropType([Number, Array]),
default: 50
},
rowWidth: requiredNumberType,
rowHeight: {
type: Number,
default: 50
},
height: requiredNumberType,
width: requiredNumberType
});
//#endregion
//#region ../../packages/components/table-v2/src/grid.ts
const tableV2GridProps = buildProps({
columns,
data: dataType,
fixedData: fixedDataType,
estimatedRowHeight: tableV2RowProps.estimatedRowHeight,
width: requiredNumber,
height: requiredNumber,
headerWidth: requiredNumber,
headerHeight: tableV2HeaderProps.headerHeight,
bodyWidth: requiredNumber,
rowHeight: requiredNumber,
cache: virtualizedListProps.cache,
useIsScrolling: Boolean,
scrollbarAlwaysOn: virtualizedGridProps.scrollbarAlwaysOn,
scrollbarStartGap: virtualizedGridProps.scrollbarStartGap,
scrollbarEndGap: virtualizedGridProps.scrollbarEndGap,
class: classType,
style: styleType,
containerStyle: styleType,
getRowHeight: {
type: definePropType(Function),
required: true
},
rowKey: tableV2RowProps.rowKey,
onRowsRendered: { type: definePropType(Function) },
onScroll: { type: definePropType(Function) }
});
//#endregion
//#region ../../packages/components/table-v2/src/table.ts
const tableV2Props = buildProps({
cache: tableV2GridProps.cache,
estimatedRowHeight: tableV2RowProps.estimatedRowHeight,
rowKey,
headerClass: { type: definePropType([String, Function]) },
headerProps: { type: definePropType([Object, Function]) },
headerCellProps: { type: definePropType([Object, Function]) },
headerHeight: tableV2HeaderProps.headerHeight,
footerHeight: {
type: Number,
default: 0
},
rowClass: { type: definePropType([String, Function]) },
rowProps: { type: definePropType([Object, Function]) },
rowHeight: {
type: Number,
default: 50
},
cellProps: { type: definePropType([Object, Function]) },
columns,
data: dataType,
dataGetter: { type: definePropType(Function) },
fixedData: fixedDataType,
expandColumnKey: tableV2RowProps.expandColumnKey,
expandedRowKeys: expandKeys,
defaultExpandedRowKeys: expandKeys,
class: classType,
fixed: Boolean,
style: { type: definePropType(Object) },
width: requiredNumber,
height: requiredNumber,
maxHeight: Number,
useIsScrolling: Boolean,
indentSize: {
type: Number,
default: 12
},
iconSize: {
type: Number,
default: 12
},
hScrollbarSize: virtualizedGridProps.hScrollbarSize,
vScrollbarSize: virtualizedGridProps.vScrollbarSize,
scrollbarAlwaysOn: virtualizedScrollbarProps.alwaysOn,
sortBy: {
type: definePropType(Object),
default: () => ({})
},
sortState: {
type: definePropType(Object),
default: void 0
},
onColumnSort: { type: definePropType(Function) },
onExpandedRowsChange: { type: definePropType(Function) },
onEndReached: { type: definePropType(Function) },
onRowExpand: tableV2RowProps.onRowExpand,
onScroll: tableV2GridProps.onScroll,
onRowsRendered: tableV2GridProps.onRowsRendered,
rowEventHandlers: tableV2RowProps.rowEventHandlers
});
//#endregion
//#region ../../packages/components/table-v2/src/components/cell.tsx
const TableV2Cell = (props, { slots }) => {
const { cellData, style } = props;
const displayText = cellData?.toString?.() || "";
const defaultSlot = (0, vue.renderSlot)(slots, "default", props, () => [displayText]);
return (0, vue.createVNode)("div", {
"class": props.class,
"title": displayText,
"style": style
}, [defaultSlot]);
};
TableV2Cell.displayName = "ElTableV2Cell";
TableV2Cell.inheritAttrs = false;
//#endregion
//#region ../../packages/components/table-v2/src/components/header-cell.tsx
const HeaderCell = (props, { slots }) => (0, vue.renderSlot)(slots, "default", props, () => [(0, vue.createVNode)("div", {
"class": props.class,
"title": props.column?.title
}, [props.column?.title])]);
HeaderCell.displayName = "ElTableV2HeaderCell";
HeaderCell.inheritAttrs = false;
//#endregion
//#region ../../packages/components/table-v2/src/header-row.ts
const tableV2HeaderRowProps = buildProps({
class: String,
columns,
columnsStyles: {
type: definePropType(Object),
required: true
},
headerIndex: Number,
style: { type: definePropType(Object) }
});
//#endregion
//#region ../../packages/components/table-v2/src/components/header-row.tsx
const TableV2HeaderRow = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTableV2HeaderRow",
props: tableV2HeaderRowProps,
setup(props, { slots }) {
return () => {
const { columns, columnsStyles, headerIndex, style } = props;
let Cells = columns.map((column, columnIndex) => {
return slots.cell({
columns,
column,
columnIndex,
headerIndex,
style: columnsStyles[column.key]
});
});
if (slots.header) Cells = slots.header({
cells: Cells.map((node) => {
if (isArray$1(node) && node.length === 1) return node[0];
return node;
}),
columns,
headerIndex
});
return (0, vue.createVNode)("div", {
"class": props.class,
"style": style,
"role": "row"
}, [Cells]);
};
}
});
//#endregion
//#region ../../packages/components/table-v2/src/components/header.tsx
const TableV2Header = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTableV2Header",
props: tableV2HeaderProps,
setup(props, { slots, expose }) {
const ns = useNamespace("table-v2");
const scrollLeftInfo = (0, vue.inject)(TABLE_V2_GRID_INJECTION_KEY);
const headerRef = (0, vue.ref)();
const headerStyle = (0, vue.computed)(() => enforceUnit({
width: props.width,
height: props.height
}));
const rowStyle = (0, vue.computed)(() => enforceUnit({
width: props.rowWidth,
height: props.height
}));
const headerHeights = (0, vue.computed)(() => castArray$1((0, vue.unref)(props.headerHeight)));
const scrollToLeft = (left) => {
const headerEl = (0, vue.unref)(headerRef);
(0, vue.nextTick)(() => {
headerEl?.scroll && headerEl.scroll({ left });
});
};
const renderFixedRows = () => {
const fixedRowClassName = ns.e("fixed-header-row");
const { columns, fixedHeaderData, rowHeight } = props;
return fixedHeaderData?.map((fixedRowData, fixedRowIndex) => {
const style = enforceUnit({
height: rowHeight,
width: "100%"
});
return slots.fixed?.({
class: fixedRowClassName,
columns,
rowData: fixedRowData,
rowIndex: -(fixedRowIndex + 1),
style
});
});
};
const renderDynamicRows = () => {
const dynamicRowClassName = ns.e("dynamic-header-row");
const { columns } = props;
return (0, vue.unref)(headerHeights).map((rowHeight, rowIndex) => {
const style = enforceUnit({
width: "100%",
height: rowHeight
});
return slots.dynamic?.({
class: dynamicRowClassName,
columns,
headerIndex: rowIndex,
style
});
});
};
(0, vue.onUpdated)(() => {
if (scrollLeftInfo?.value) scrollToLeft(scrollLeftInfo.value);
});
expose({ scrollToLeft });
return () => {
if (props.height <= 0) return;
return (0, vue.createVNode)("div", {
"ref": headerRef,
"class": props.class,
"style": (0, vue.unref)(headerStyle),
"role": "rowgroup"
}, [(0, vue.createVNode)("div", {
"style": (0, vue.unref)(rowStyle),
"class": ns.e("header")
}, [renderDynamicRows(), renderFixedRows()])]);
};
}
});
//#endregion
//#region ../../packages/components/table-v2/src/components/row.tsx
const useTableRow = (props) => {
const { isScrolling } = (0, vue.inject)(TableV2InjectionKey);
const measured = (0, vue.ref)(false);
const rowRef = (0, vue.ref)();
const measurable = (0, vue.computed)(() => {
return isNumber(props.estimatedRowHeight) && props.rowIndex >= 0;
});
const doMeasure = (isInit = false) => {
const $rowRef = (0, vue.unref)(rowRef);
if (!$rowRef) return;
const { columns, onRowHeightChange, rowKey, rowIndex, style } = props;
const { height } = $rowRef.getBoundingClientRect();
measured.value = true;
(0, vue.nextTick)(() => {
if (isInit || height !== Number.parseInt(style.height)) {
const firstColumn = columns[0];
const isPlaceholder = firstColumn?.placeholderSign === placeholderSign;
onRowHeightChange?.({
rowKey,
height,
rowIndex
}, firstColumn && !isPlaceholder && firstColumn.fixed);
}
});
};
const eventHandlers = (0, vue.computed)(() => {
const { rowData, rowIndex, rowKey, onRowHover } = props;
const handlers = props.rowEventHandlers || {};
const eventHandlers = {};
Object.entries(handlers).forEach(([eventName, handler]) => {
if (isFunction$1(handler)) eventHandlers[eventName] = (event) => {
handler({
event,
rowData,
rowIndex,
rowKey
});
};
});
if (onRowHover) [{
name: "onMouseleave",
hovered: false
}, {
name: "onMouseenter",
hovered: true
}].forEach(({ name, hovered }) => {
const existedHandler = eventHandlers[name];
eventHandlers[name] = (event) => {
onRowHover({
event,
hovered,
rowData,
rowIndex,
rowKey
});
existedHandler?.(event);
};
});
return eventHandlers;
});
const onExpand = (expanded) => {
const { onRowExpand, rowData, rowIndex, rowKey } = props;
onRowExpand?.({
expanded,
rowData,
rowIndex,
rowKey
});
};
(0, vue.onMounted)(() => {
if ((0, vue.unref)(measurable)) doMeasure(true);
});
return {
isScrolling,
measurable,
measured,
rowRef,
eventHandlers,
onExpand
};
};
const TableV2Row = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTableV2TableRow",
props: tableV2RowProps,
setup(props, { expose, slots, attrs }) {
const { eventHandlers, isScrolling, measurable, measured, rowRef, onExpand } = useTableRow(props);
expose({ onExpand });
return () => {
const { columns, columnsStyles, expandColumnKey, depth, rowData, rowIndex, style } = props;
let ColumnCells = columns.map((column, columnIndex) => {
const expandable = isArray$1(rowData.children) && rowData.children.length > 0 && column.key === expandColumnKey;
return slots.cell({
column,
columns,
columnIndex,
depth,
style: columnsStyles[column.key],
rowData,
rowIndex,
isScrolling: (0, vue.unref)(isScrolling),
expandIconProps: expandable ? {
rowData,
rowIndex,
onExpand
} : void 0
});
});
if (slots.row) ColumnCells = slots.row({
cells: ColumnCells.map((node) => {
if (isArray$1(node) && node.length === 1) return node[0];
return node;
}),
style,
columns,
depth,
rowData,
rowIndex,
isScrolling: (0, vue.unref)(isScrolling)
});
if ((0, vue.unref)(measurable)) {
const { height, ...exceptHeightStyle } = style || {};
const _measured = (0, vue.unref)(measured);
return (0, vue.createVNode)("div", (0, vue.mergeProps)({
"ref": rowRef,
"class": props.class,
"style": _measured ? style : exceptHeightStyle,
"role": "row"
}, attrs, (0, vue.unref)(eventHandlers)), [ColumnCells]);
}
return (0, vue.createVNode)("div", (0, vue.mergeProps)(attrs, {
"ref": rowRef,
"class": props.class,
"style": style,
"role": "row"
}, (0, vue.unref)(eventHandlers)), [ColumnCells]);
};
}
});
//#endregion
//#region ../../packages/components/table-v2/src/components/sort-icon.tsx
const SortIcon = (props) => {
const { sortOrder } = props;
return (0, vue.createVNode)("button", {
"type": "button",
"aria-label": props.ariaLabel,
"class": props.class
}, [(0, vue.createVNode)(ElIcon, { "size": 14 }, { default: () => [sortOrder === SortOrder.ASC ? (0, vue.createVNode)(sort_up_default, null, null) : (0, vue.createVNode)(sort_down_default, null, null)] })]);
};
//#endregion
//#region ../../packages/components/table-v2/src/components/expand-icon.tsx
const ExpandIcon = (props) => {
const { expanded, expandable, onExpand, style, size, ariaLabel } = props;
return (0, vue.createVNode)("button", (0, vue.mergeProps)({
onClick: expandable ? () => onExpand(!expanded) : void 0,
ariaLabel,
ariaExpanded: expanded,
class: props.class
}, { "type": "button" }), [(0, vue.createVNode)(ElIcon, {
"size": size,
"style": style
}, { default: () => [(0, vue.createVNode)(arrow_right_default, null, null)] })]);
};
ExpandIcon.inheritAttrs = false;
//#endregion
//#region ../../packages/components/table-v2/src/table-grid.tsx
const COMPONENT_NAME$5 = "ElTableV2Grid";
const useTableGrid = (props) => {
const headerRef = (0, vue.ref)();
const bodyRef = (0, vue.ref)();
const scrollLeft = (0, vue.ref)(0);
const totalHeight = (0, vue.computed)(() => {
const { data, rowHeight, estimatedRowHeight } = props;
if (estimatedRowHeight) return;
return data.length * rowHeight;
});
const fixedRowHeight = (0, vue.computed)(() => {
const { fixedData, rowHeight } = props;
return (fixedData?.length || 0) * rowHeight;
});
const headerHeight = (0, vue.computed)(() => sum(props.headerHeight));
const gridHeight = (0, vue.computed)(() => {
const { height } = props;
return Math.max(0, height - (0, vue.unref)(headerHeight) - (0, vue.unref)(fixedRowHeight));
});
const hasHeader = (0, vue.computed)(() => {
return (0, vue.unref)(headerHeight) + (0, vue.unref)(fixedRowHeight) > 0;
});
const itemKey = ({ data, rowIndex }) => data[rowIndex][props.rowKey];
function onItemRendered({ rowCacheStart, rowCacheEnd, rowVisibleStart, rowVisibleEnd }) {
props.onRowsRendered?.({
rowCacheStart,
rowCacheEnd,
rowVisibleStart,
rowVisibleEnd
});
}
function resetAfterRowIndex(index, forceUpdate) {
bodyRef.value?.resetAfterRowIndex(index, forceUpdate);
}
function scrollTo(leftOrOptions, top) {
const header$ = (0, vue.unref)(headerRef);
const body$ = (0, vue.unref)(bodyRef);
if (isObject$1(leftOrOptions)) {
header$?.scrollToLeft(leftOrOptions.scrollLeft);
scrollLeft.value = leftOrOptions.scrollLeft;
body$?.scrollTo(leftOrOptions);
} else {
header$?.scrollToLeft(leftOrOptions);
scrollLeft.value = leftOrOptions;
body$?.scrollTo({
scrollLeft: leftOrOptions,
scrollTop: top
});
}
}
function scrollToTop(scrollTop) {
(0, vue.unref)(bodyRef)?.scrollTo({ scrollTop });
}
function scrollToRow(row, strategy) {
const body = (0, vue.unref)(bodyRef);
if (!body) return;
const prevScrollLeft = scrollLeft.value;
body.scrollToItem(row, 0, strategy);
if (prevScrollLeft) scrollTo({ scrollLeft: prevScrollLeft });
}
function forceUpdate() {
(0, vue.unref)(bodyRef)?.$forceUpdate();
(0, vue.unref)(headerRef)?.$forceUpdate();
}
(0, vue.watch)(() => props.bodyWidth, () => {
if (isNumber(props.estimatedRowHeight)) bodyRef.value?.resetAfter({ columnIndex: 0 }, false);
});
return {
bodyRef,
forceUpdate,
fixedRowHeight,
gridHeight,
hasHeader,
headerHeight,
headerRef,
totalHeight,
itemKey,
onItemRendered,
resetAfterRowIndex,
scrollTo,
scrollToTop,
scrollToRow,
scrollLeft
};
};
const TableGrid = /* @__PURE__ */ (0, vue.defineComponent)({
name: COMPONENT_NAME$5,
props: tableV2GridProps,
setup(props, { slots, expose }) {
const { ns } = (0, vue.inject)(TableV2InjectionKey);
const { bodyRef, fixedRowHeight, gridHeight, hasHeader, headerRef, headerHeight, totalHeight, forceUpdate, itemKey, onItemRendered, resetAfterRowIndex, scrollTo, scrollToTop, scrollToRow, scrollLeft } = useTableGrid(props);
(0, vue.provide)(TABLE_V2_GRID_INJECTION_KEY, scrollLeft);
(0, vue.onActivated)(async () => {
await (0, vue.nextTick)();
const scrollTop = bodyRef.value?.states.scrollTop;
scrollTop && scrollToTop(Math.round(scrollTop) + 1);
});
expose({
forceUpdate,
totalHeight,
scrollTo,
scrollToTop,
scrollToRow,
resetAfterRowIndex
});
const getColumnWidth = () => props.bodyWidth;
return () => {
const { cache, columns, data, fixedData, useIsScrolling, scrollbarAlwaysOn, scrollbarEndGap, scrollbarStartGap, style, rowHeight, bodyWidth, estimatedRowHeight, headerWidth, height, width, getRowHeight, onScroll } = props;
const isDynamicRowEnabled = isNumber(estimatedRowHeight);
const Grid = isDynamicRowEnabled ? DynamicSizeGrid : FixedSizeGrid;
const _headerHeight = (0, vue.unref)(headerHeight);
return (0, vue.createVNode)("div", {
"role": "table",
"class": [ns.e("table"), props.class],
"style": style
}, [(0, vue.createVNode)(Grid, {
"ref": bodyRef,
"data": data,
"useIsScrolling": useIsScrolling,
"itemKey": itemKey,
"columnCache": 0,
"columnWidth": isDynamicRowEnabled ? getColumnWidth : bodyWidth,
"totalColumn": 1,
"totalRow": data.length,
"rowCache": cache,
"rowHeight": isDynamicRowEnabled ? getRowHeight : rowHeight,
"width": width,
"height": (0, vue.unref)(gridHeight),
"class": ns.e("body"),
"role": "rowgroup",
"scrollbarStartGap": scrollbarStartGap,
"scrollbarEndGap": scrollbarEndGap,
"scrollbarAlwaysOn": scrollbarAlwaysOn,
"onScroll": onScroll,
"onItemRendered": onItemRendered,
"perfMode": false
}, { default: (params) => {
const rowData = data[params.rowIndex];
return slots.row?.({
...params,
columns,
rowData
});
} }), (0, vue.unref)(hasHeader) && (0, vue.createVNode)(TableV2Header, {
"ref": headerRef,
"class": ns.e("header-wrapper"),
"columns": columns,
"headerData": data,
"headerHeight": props.headerHeight,
"fixedHeaderData": fixedData,
"rowWidth": headerWidth,
"rowHeight": rowHeight,
"width": width,
"height": Math.min(_headerHeight + (0, vue.unref)(fixedRowHeight), height)
}, {
dynamic: slots.header,
fixed: slots.row
})]);
};
}
});
//#endregion
//#region ../../packages/components/table-v2/src/renderers/main-table.tsx
function _isSlot$5(s) {
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !(0, vue.isVNode)(s);
}
const MainTable = (props, { slots }) => {
const { mainTableRef, ...rest } = props;
return (0, vue.createVNode)(TableGrid, (0, vue.mergeProps)({ "ref": mainTableRef }, rest), _isSlot$5(slots) ? slots : { default: () => [slots] });
};
//#endregion
//#region ../../packages/components/table-v2/src/renderers/left-table.tsx
function _isSlot$4(s) {
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !(0, vue.isVNode)(s);
}
const LeftTable = (props, { slots }) => {
if (!props.columns.length) return;
const { leftTableRef, ...rest } = props;
return (0, vue.createVNode)(TableGrid, (0, vue.mergeProps)({ "ref": leftTableRef }, rest), _isSlot$4(slots) ? slots : { default: () => [slots] });
};
//#endregion
//#region ../../packages/components/table-v2/src/renderers/right-table.tsx
function _isSlot$3(s) {
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !(0, vue.isVNode)(s);
}
const RightTable = (props, { slots }) => {
if (!props.columns.length) return;
const { rightTableRef, ...rest } = props;
return (0, vue.createVNode)(TableGrid, (0, vue.mergeProps)({ "ref": rightTableRef }, rest), _isSlot$3(slots) ? slots : { default: () => [slots] });
};
//#endregion
//#region ../../packages/components/table-v2/src/renderers/row.tsx
function _isSlot$2(s) {
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !(0, vue.isVNode)(s);
}
const RowRenderer = (props, { slots }) => {
const { columns, columnsStyles, depthMap, expandColumnKey, expandedRowKeys, estimatedRowHeight, hasFixedColumns, rowData, rowIndex, style, isScrolling, rowProps, rowClass, rowKey, rowEventHandlers, ns, onRowHovered, onRowExpanded } = props;
const rowKls = tryCall(rowClass, {
columns,
rowData,
rowIndex
}, "");
const additionalProps = tryCall(rowProps, {
columns,
rowData,
rowIndex
});
const _rowKey = rowData[rowKey];
const depth = depthMap[_rowKey] || 0;
const canExpand = Boolean(expandColumnKey);
const isFixedRow = rowIndex < 0;
const kls = [
ns.e("row"),
rowKls,
ns.is("expanded", canExpand && expandedRowKeys.includes(_rowKey)),
ns.is("fixed", !depth && isFixedRow),
ns.is("customized", Boolean(slots.row)),
{ [ns.e(`row-depth-${depth}`)]: canExpand && rowIndex >= 0 }
];
const onRowHover = hasFixedColumns ? onRowHovered : void 0;
const _rowProps = {
...additionalProps,
columns,
columnsStyles,
class: kls,
depth,
expandColumnKey,
estimatedRowHeight: isFixedRow ? void 0 : estimatedRowHeight,
isScrolling,
rowIndex,
rowData,
rowKey: _rowKey,
rowEventHandlers,
style
};
const handlerMouseEnter = (e) => {
onRowHover?.({
hovered: true,
rowKey: _rowKey,
event: e,
rowData,
rowIndex
});
};
const handlerMouseLeave = (e) => {
onRowHover?.({
hovered: false,
rowKey: _rowKey,
event: e,
rowData,
rowIndex
});
};
return (0, vue.createVNode)(TableV2Row, (0, vue.mergeProps)(_rowProps, {
"onRowExpand": onRowExpanded,
"onMouseenter": handlerMouseEnter,
"onMouseleave": handlerMouseLeave,
"rowkey": _rowKey
}), _isSlot$2(slots) ? slots : { default: () => [slots] });
};
//#endregion
//#region ../../packages/components/table-v2/src/renderers/cell.tsx
const CellRenderer = ({ columns, column, columnIndex, depth, expandIconProps, isScrolling, rowData, rowIndex, style, expandedRowKeys, ns, t, cellProps: _cellProps, expandColumnKey, indentSize, iconSize, rowKey }, { slots }) => {
const cellStyle = enforceUnit(style);
if (column.placeholderSign === placeholderSign) return (0, vue.createVNode)("div", {
"class": ns.em("row-cell", "placeholder"),
"style": cellStyle
}, null);
const { cellRenderer, dataKey, dataGetter } = column;
const cellData = isFunction$1(dataGetter) ? dataGetter({
columns,
column,
columnIndex,
rowData,
rowIndex
}) : get(rowData, dataKey ?? "");
const extraCellProps = tryCall(_cellProps, {
cellData,
columns,
column,
columnIndex,
rowIndex,
rowData
});
const cellProps = {
class: ns.e("cell-text"),
columns,
column,
columnIndex,
cellData,
isScrolling,
rowData,
rowIndex
};
const columnCellRenderer = componentToSlot(cellRenderer);
const Cell = columnCellRenderer ? columnCellRenderer(cellProps) : (0, vue.renderSlot)(slots, "default", cellProps, () => [(0, vue.createVNode)(TableV2Cell, cellProps, null)]);
const kls = [
ns.e("row-cell"),
column.class,
column.align === Alignment.CENTER && ns.is("align-center"),
column.align === Alignment.RIGHT && ns.is("align-right")
];
const expandable = rowIndex >= 0 && expandColumnKey && column.key === expandColumnKey;
const expanded = rowIndex >= 0 && expandedRowKeys.includes(rowData[rowKey]);
let IconOrPlaceholder;
const iconStyle = `margin-inline-start: ${depth * indentSize}px;`;
if (expandable) if (isObject$1(expandIconProps)) IconOrPlaceholder = (0, vue.createVNode)(ExpandIcon, (0, vue.mergeProps)(expandIconProps, {
"class": [ns.e("expand-icon"), ns.is("expanded", expanded)],
"size": iconSize,
"expanded": expanded,
"ariaLabel": t(expanded ? "el.table.collapseRowLabel" : "el.table.expandRowLabel"),
"style": iconStyle,
"expandable": true
}), null);
else IconOrPlaceholder = (0, vue.createVNode)("div", { "style": [iconStyle, `width: ${iconSize}px; height: ${iconSize}px;`].join(" ") }, null);
return (0, vue.createVNode)("div", (0, vue.mergeProps)({
"class": kls,
"style": cellStyle
}, extraCellProps, { "role": "cell" }), [IconOrPlaceholder, Cell]);
};
CellRenderer.inheritAttrs = false;
//#endregion
//#region ../../packages/components/table-v2/src/renderers/header.tsx
function _isSlot$1(s) {
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !(0, vue.isVNode)(s);
}
const HeaderRenderer = ({ columns, columnsStyles, headerIndex, style, headerClass, headerProps, ns }, { slots }) => {
const param = {
columns,
headerIndex
};
const kls = [
ns.e("header-row"),
tryCall(headerClass, param, ""),
ns.is("customized", Boolean(slots.header))
];
return (0, vue.createVNode)(TableV2HeaderRow, {
...tryCall(headerProps, param),
columnsStyles,
class: kls,
columns,
headerIndex,
style
}, _isSlot$1(slots) ? slots : { default: () => [slots] });
};
//#endregion
//#region ../../packages/components/table-v2/src/renderers/header-cell.tsx
const HeaderCellRenderer = (props, { slots }) => {
const { column, ns, t, style, onColumnSorted } = props;
const cellStyle = enforceUnit(style);
if (column.placeholderSign === placeholderSign) return (0, vue.createVNode)("div", {
"class": ns.em("header-row-cell", "placeholder"),
"style": cellStyle
}, null);
const { headerCellRenderer, headerClass, sortable } = column;
/**
* render Cell children
*/
const cellProps = {
...props,
class: ns.e("header-cell-text")
};
const columnCellRenderer = componentToSlot(headerCellRenderer);
const Cell = columnCellRenderer ? columnCellRenderer(cellProps) : (0, vue.renderSlot)(slots, "default", cellProps, () => [(0, vue.createVNode)(HeaderCell, cellProps, null)]);
/**
* Render cell container and sort indicator
*/
const { sortBy, sortState, headerCellProps } = props;
let sorting, sortOrder, ariaSort;
if (sortState) {
const order = sortState[column.key];
sorting = Boolean(oppositeOrderMap[order]);
sortOrder = sorting ? order : SortOrder.ASC;
} else {
sorting = column.key === sortBy.key;
sortOrder = sorting ? sortBy.order : SortOrder.ASC;
}
if (sortOrder === SortOrder.ASC) ariaSort = "ascending";
else if (sortOrder === SortOrder.DESC) ariaSort = "descending";
else ariaSort = void 0;
const cellKls = [
ns.e("header-cell"),
tryCall(headerClass, props, ""),
column.align === Alignment.CENTER && ns.is("align-center"),
column.align === Alignment.RIGHT && ns.is("align-right"),
sortable && ns.is("sortable")
];
return (0, vue.createVNode)("div", (0, vue.mergeProps)({
...tryCall(headerCellProps, props),
onClick: column.sortable ? onColumnSorted : void 0,
ariaSort: sortable ? ariaSort : void 0,
class: cellKls,
style: cellStyle,
["data-key"]: column.key
}, { "role": "columnheader" }), [Cell, sortable && (0, vue.createVNode)(SortIcon, {
"class": [ns.e("sort-icon"), sorting && ns.is("sorting")],
"sortOrder": sortOrder,
"ariaLabel": t("el.table.sortLabel", { column: column.title || "" })
}, null)]);
};
//#endregion
//#region ../../packages/components/table-v2/src/renderers/footer.tsx
const Footer$1 = (props, { slots }) => {
return (0, vue.createVNode)("div", {
"class": props.class,
"style": props.style
}, [slots.default?.()]);
};
Footer$1.displayName = "ElTableV2Footer";
//#endregion
//#region ../../packages/components/table-v2/src/renderers/empty.tsx
const Footer = (props, { slots }) => {
const defaultSlot = (0, vue.renderSlot)(slots, "default", {}, () => [(0, vue.createVNode)(ElEmpty, null, null)]);
return (0, vue.createVNode)("div", {
"class": props.class,
"style": props.style
}, [defaultSlot]);
};
Footer.displayName = "ElTableV2Empty";
//#endregion
//#region ../../packages/components/table-v2/src/renderers/overlay.tsx
const Overlay = (props, { slots }) => {
return (0, vue.createVNode)("div", {
"class": props.class,
"style": props.style
}, [slots.default?.()]);
};
Overlay.displayName = "ElTableV2Overlay";
//#endregion
//#region ../../packages/components/table-v2/src/table-v2.tsx
function _isSlot(s) {
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !(0, vue.isVNode)(s);
}
const TableV2 = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTableV2",
props: tableV2Props,
slots: Object,
setup(props, { slots, expose }) {
const ns = useNamespace("table-v2");
const { t } = useLocale();
const { columnsStyles, fixedColumnsOnLeft, fixedColumnsOnRight, mainColumns, mainTableHeight, fixedTableHeight, leftTableWidth, rightTableWidth, data, depthMap, expandedRowKeys, hasFixedColumns, mainTableRef, leftTableRef, rightTableRef, isDynamic, isResetting, isScrolling, bodyWidth, emptyStyle, rootStyle, footerHeight, showEmpty, scrollTo, scrollToLeft, scrollToTop, scrollToRow, getRowHeight, onColumnSorted, onRowHeightChange, onRowHovered, onRowExpanded, onRowsRendered, onScroll, onVerticalScroll } = useTable(props);
expose({
scrollTo,
scrollToLeft,
scrollToTop,
scrollToRow
});
(0, vue.provide)(TableV2InjectionKey, {
ns,
isResetting,
isScrolling
});
return () => {
const { cache, cellProps, estimatedRowHeight, expandColumnKey, fixedData, headerHeight, headerClass, headerProps, headerCellProps, sortBy, sortState, rowHeight, rowClass, rowEventHandlers, rowKey, rowProps, scrollbarAlwaysOn, indentSize, iconSize, useIsScrolling, vScrollbarSize, width } = props;
const _data = (0, vue.unref)(data);
const mainTableProps = {
cache,
class: ns.e("main"),
columns: (0, vue.unref)(mainColumns),
data: _data,
fixedData,
estimatedRowHeight,
bodyWidth: (0, vue.unref)(bodyWidth),
headerHeight,
headerWidth: (0, vue.unref)(bodyWidth),
height: (0, vue.unref)(mainTableHeight),
mainTableRef,
rowKey,
rowHeight,
scrollbarAlwaysOn,
scrollbarStartGap: 2,
scrollbarEndGap: vScrollbarSize,
useIsScrolling,
width,
getRowHeight,
onRowsRendered,
onScroll
};
const leftColumnsWidth = (0, vue.unref)(leftTableWidth);
const _fixedTableHeight = (0, vue.unref)(fixedTableHeight);
const leftTableProps = {
cache,
class: ns.e("left"),
columns: (0, vue.unref)(fixedColumnsOnLeft),
data: _data,
fixedData,
estimatedRowHeight,
leftTableRef,
rowHeight,
bodyWidth: leftColumnsWidth,
headerWidth: leftColumnsWidth,
headerHeight,
height: _fixedTableHeight,
rowKey,
scrollbarAlwaysOn,
scrollbarStartGap: 2,
scrollbarEndGap: vScrollbarSize,
useIsScrolling,
width: leftColumnsWidth,
getRowHeight,
onScroll: onVerticalScroll
};
const rightColumnsWidth = (0, vue.unref)(rightTableWidth);
const rightTableProps = {
cache,
class: ns.e("right"),
columns: (0, vue.unref)(fixedColumnsOnRight),
data: _data,
fixedData,
estimatedRowHeight,
rightTableRef,
rowHeight,
bodyWidth: rightColumnsWidth,
headerWidth: rightColumnsWidth,
headerHeight,
height: _fixedTableHeight,
rowKey,
scrollbarAlwaysOn,
scrollbarStartGap: 2,
scrollbarEndGap: vScrollbarSize,
width: rightColumnsWidth,
style: `${ns.cssVarName("table-scrollbar-size")}: ${vScrollbarSize}px`,
useIsScrolling,
getRowHeight,
onScroll: onVerticalScroll
};
const _columnsStyles = (0, vue.unref)(columnsStyles);
const tableRowProps = {
ns,
depthMap: (0, vue.unref)(depthMap),
columnsStyles: _columnsStyles,
expandColumnKey,
expandedRowKeys: (0, vue.unref)(expandedRowKeys),
estimatedRowHeight,
hasFixedColumns: (0, vue.unref)(hasFixedColumns),
rowProps,
rowClass,
rowKey,
rowEventHandlers,
onRowHovered,
onRowExpanded,
onRowHeightChange
};
const tableCellProps = {
cellProps,
expandColumnKey,
indentSize,
iconSize,
rowKey,
expandedRowKeys: (0, vue.unref)(expandedRowKeys),
ns,
t
};
const tableHeaderProps = {
ns,
headerClass,
headerProps,
columnsStyles: _columnsStyles
};
const tableHeaderCellProps = {
ns,
t,
sortBy,
sortState,
headerCellProps,
onColumnSorted
};
const tableSlots = {
row: (props) => (0, vue.createVNode)(RowRenderer, (0, vue.mergeProps)(props, tableRowProps), {
row: slots.row,
cell: (props) => {
let _slot;
return slots.cell ? (0, vue.createVNode)(CellRenderer, (0, vue.mergeProps)(props, tableCellProps, { "style": _columnsStyles[props.column.key] }), _isSlot(_slot = slots.cell(props)) ? _slot : { default: () => [_slot] }) : (0, vue.createVNode)(CellRenderer, (0, vue.mergeProps)(props, tableCellProps, { "style": _columnsStyles[props.column.key] }), null);
}
}),
header: (props) => (0, vue.createVNode)(HeaderRenderer, (0, vue.mergeProps)(props, tableHeaderProps), {
header: slots.header,
cell: (props) => {
let _slot2;
return slots["header-cell"] ? (0, vue.createVNode)(HeaderCellRenderer, (0, vue.mergeProps)(props, tableHeaderCellProps, { "style": _columnsStyles[props.column.key] }), _isSlot(_slot2 = slots["header-cell"](props)) ? _slot2 : { default: () => [_slot2] }) : (0, vue.createVNode)(HeaderCellRenderer, (0, vue.mergeProps)(props, tableHeaderCellProps, { "style": _columnsStyles[props.column.key] }), null);
}
})
};
const rootKls = [
props.class,
ns.b(),
ns.e("root"),
ns.is("dynamic", (0, vue.unref)(isDynamic))
];
const footerProps = {
class: ns.e("footer"),
style: (0, vue.unref)(footerHeight)
};
return (0, vue.createVNode)("div", {
"class": rootKls,
"style": (0, vue.unref)(rootStyle)
}, [
(0, vue.createVNode)(MainTable, mainTableProps, _isSlot(tableSlots) ? tableSlots : { default: () => [tableSlots] }),
(0, vue.createVNode)(LeftTable, leftTableProps, _isSlot(tableSlots) ? tableSlots : { default: () => [tableSlots] }),
(0, vue.createVNode)(RightTable, rightTableProps, _isSlot(tableSlots) ? tableSlots : { default: () => [tableSlots] }),
slots.footer && (0, vue.createVNode)(Footer$1, footerProps, { default: slots.footer }),
(0, vue.unref)(showEmpty) && (0, vue.createVNode)(Footer, {
"class": ns.e("empty"),
"style": (0, vue.unref)(emptyStyle)
}, { default: slots.empty }),
slots.overlay && (0, vue.createVNode)(Overlay, { "class": ns.e("overlay") }, { default: slots.overlay })
]);
};
}
});
//#endregion
//#region ../../packages/components/table-v2/src/auto-resizer.ts
const autoResizerProps = buildProps({
disableWidth: Boolean,
disableHeight: Boolean,
onResize: { type: definePropType(Function) }
});
//#endregion
//#region ../../packages/components/table-v2/src/components/auto-resizer.tsx
const AutoResizer = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElAutoResizer",
props: autoResizerProps,
setup(props, { slots }) {
const ns = useNamespace("auto-resizer");
const { height, width, sizer } = useAutoResize(props);
const style = {
width: "100%",
height: "100%"
};
return () => {
return (0, vue.createVNode)("div", {
"ref": sizer,
"class": ns.b(),
"style": style
}, [slots.default?.({
height: height.value,
width: width.value
})]);
};
}
});
//#endregion
//#region ../../packages/components/table-v2/index.ts
const ElTableV2 = withInstall(TableV2);
const ElAutoResizer = withInstall(AutoResizer);
//#endregion
//#region ../../packages/components/tabs/src/constants.ts
const tabsRootContextKey = Symbol("tabsRootContextKey");
//#endregion
//#region ../../packages/components/tabs/src/tab-bar.ts
/**
* @deprecated Removed after 3.0.0, Use `TabBarProps` instead.
*/
const tabBarProps = buildProps({
tabs: {
type: definePropType(Array),
default: () => mutable([])
},
tabRefs: {
type: definePropType(Object),
default: () => mutable({})
}
});
//#endregion
//#region ../../packages/components/tabs/src/tab-bar.vue?vue&type=script&setup=true&lang.ts
const COMPONENT_NAME$4 = "ElTabBar";
var tab_bar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: COMPONENT_NAME$4,
__name: "tab-bar",
props: tabBarProps,
setup(__props, { expose: __expose }) {
const props = __props;
const rootTabs = (0, vue.inject)(tabsRootContextKey);
if (!rootTabs) throwError(COMPONENT_NAME$4, "<el-tabs><el-tab-bar /></el-tabs>");
const ns = useNamespace("tabs");
const barRef = (0, vue.ref)();
const barStyle = (0, vue.ref)();
/**
* when defaultValue is not set, the bar is always shown.
*
* when defaultValue is set, the bar will be hidden until style is calculated
* to avoid the bar showing in the wrong position on initial render.
*/
const renderActiveBar = (0, vue.computed)(() => isUndefined(rootTabs.props.defaultValue) || Boolean(barStyle.value?.transform));
const getBarStyle = () => {
let offset = 0;
let tabSize = 0;
const sizeName = ["top", "bottom"].includes(rootTabs.props.tabPosition) ? "width" : "height";
const sizeDir = sizeName === "width" ? "x" : "y";
const position = sizeDir === "x" ? "left" : "top";
props.tabs.every((tab) => {
if (isUndefined(tab.paneName)) return false;
const $el = props.tabRefs[tab.paneName];
if (!$el) return false;
if (!tab.active) return true;
offset = $el[`offset${capitalize(position)}`];
tabSize = $el[`client${capitalize(sizeName)}`];
const tabStyles = window.getComputedStyle($el);
if (sizeName === "width") {
tabSize -= Number.parseFloat(tabStyles.paddingLeft) + Number.parseFloat(tabStyles.paddingRight);
offset += Number.parseFloat(tabStyles.paddingLeft);
}
return false;
});
return {
[sizeName]: `${tabSize}px`,
transform: `translate${capitalize(sizeDir)}(${offset}px)`
};
};
const update = () => barStyle.value = getBarStyle();
const tabObservers = [];
const observerTabs = () => {
tabObservers.forEach((observer) => observer.stop());
tabObservers.length = 0;
Object.values(props.tabRefs).forEach((tab) => {
tabObservers.push(useResizeObserver(tab, update));
});
};
(0, vue.watch)(() => props.tabs, async () => {
await (0, vue.nextTick)();
update();
observerTabs();
}, { immediate: true });
const barObserver = useResizeObserver(barRef, () => update());
(0, vue.onBeforeUnmount)(() => {
tabObservers.forEach((observer) => observer.stop());
tabObservers.length = 0;
barObserver.stop();
});
__expose({
ref: barRef,
update
});
return (_ctx, _cache) => {
return renderActiveBar.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
ref_key: "barRef",
ref: barRef,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("active-bar"), (0, vue.unref)(ns).is((0, vue.unref)(rootTabs).props.tabPosition)]),
style: (0, vue.normalizeStyle)(barStyle.value)
}, null, 6)) : (0, vue.createCommentVNode)("v-if", true);
};
}
});
//#endregion
//#region ../../packages/components/tabs/src/tab-bar.vue
var tab_bar_default = tab_bar_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/tabs/src/tab-nav.tsx
const tabNavProps = buildProps({
panes: {
type: definePropType(Array),
default: () => mutable([])
},
currentName: {
type: [String, Number],
default: ""
},
editable: Boolean,
type: {
type: String,
values: [
"card",
"border-card",
""
],
default: ""
},
stretch: Boolean,
tabindex: {
type: [String, Number],
default: void 0
}
});
const tabNavEmits = {
tabClick: (tab, tabName, ev) => ev instanceof Event,
tabRemove: (tab, ev) => ev instanceof Event
};
const COMPONENT_NAME$3 = "ElTabNav";
const TabNav = /* @__PURE__ */ (0, vue.defineComponent)({
name: COMPONENT_NAME$3,
props: tabNavProps,
emits: tabNavEmits,
setup(props, { expose, emit }) {
const rootTabs = (0, vue.inject)(tabsRootContextKey);
if (!rootTabs) throwError(COMPONENT_NAME$3, `<el-tabs><tab-nav /></el-tabs>`);
const ns = useNamespace("tabs");
const visibility = useDocumentVisibility();
const focused = useWindowFocus();
const navScroll$ = (0, vue.ref)();
const nav$ = (0, vue.ref)();
const el$ = (0, vue.ref)();
const tabRefsMap = (0, vue.ref)({});
const tabBarRef = (0, vue.ref)();
const scrollable = (0, vue.ref)(false);
const navOffset = (0, vue.ref)(0);
const isFocus = (0, vue.ref)(false);
const focusable = (0, vue.ref)(true);
const isWheelScrolling = (0, vue.ref)(false);
const tracker = (0, vue.shallowRef)();
const isHorizontal = (0, vue.computed)(() => ["top", "bottom"].includes(rootTabs.props.tabPosition));
const sizeName = (0, vue.computed)(() => isHorizontal.value ? "width" : "height");
const navStyle = (0, vue.computed)(() => {
const dir = sizeName.value === "width" ? "X" : "Y";
return {
transition: isWheelScrolling.value ? "none" : void 0,
transform: `translate${dir}(-${navOffset.value}px)`
};
});
const { width: navContainerWidth, height: navContainerHeight } = useElementSize(navScroll$);
const { width: navWidth, height: navHeight } = useElementSize(nav$, {
width: 0,
height: 0
}, { box: "border-box" });
const navContainerSize = (0, vue.computed)(() => isHorizontal.value ? navContainerWidth.value : navContainerHeight.value);
const navSize = (0, vue.computed)(() => isHorizontal.value ? navWidth.value : navHeight.value);
const { onWheel } = useWheel({
atStartEdge: (0, vue.computed)(() => navOffset.value <= 0),
atEndEdge: (0, vue.computed)(() => navSize.value - navOffset.value <= navContainerSize.value),
layout: (0, vue.computed)(() => isHorizontal.value ? "horizontal" : "vertical")
}, (offset) => {
navOffset.value = clamp$1(navOffset.value + offset, 0, navSize.value - navContainerSize.value);
});
const handleWheel = (event) => {
isWheelScrolling.value = true;
onWheel(event);
rAF(() => {
isWheelScrolling.value = false;
});
};
const scrollPrev = () => {
if (!navScroll$.value) return;
const containerSize = navScroll$.value.getBoundingClientRect()[sizeName.value];
const currentOffset = navOffset.value;
if (!currentOffset) return;
navOffset.value = currentOffset > containerSize ? currentOffset - containerSize : 0;
};
const scrollNext = () => {
if (!navScroll$.value || !nav$.value) return;
const navSize = nav$.value.getBoundingClientRect()[sizeName.value];
const containerSize = navScroll$.value.getBoundingClientRect()[sizeName.value];
const currentOffset = navOffset.value;
if (!isGreaterThan(navSize - currentOffset, containerSize)) return;
navOffset.value = navSize - currentOffset > containerSize * 2 ? currentOffset + containerSize : navSize - containerSize;
};
const scrollToActiveTab = async () => {
const nav = nav$.value;
if (!scrollable.value || !el$.value || !navScroll$.value || !nav) return;
await (0, vue.nextTick)();
const activeTab = tabRefsMap.value[props.currentName];
if (!activeTab) return;
const navScroll = navScroll$.value;
const activeTabBounding = activeTab.getBoundingClientRect();
const navScrollBounding = navScroll.getBoundingClientRect();
const navScrollLeft = navScrollBounding.left + 1;
const navScrollRight = navScrollBounding.right - 1;
const navBounding = nav.getBoundingClientRect();
const maxOffset = isHorizontal.value ? navBounding.width - navScrollBounding.width : navBounding.height - navScrollBounding.height;
const currentOffset = navOffset.value;
let newOffset = currentOffset;
if (isHorizontal.value) {
if (activeTabBounding.left < navScrollLeft) newOffset = currentOffset - (navScrollLeft - activeTabBounding.left);
if (activeTabBounding.right > navScrollRight) newOffset = currentOffset + activeTabBounding.right - navScrollRight;
} else {
if (activeTabBounding.top < navScrollBounding.top) newOffset = currentOffset - (navScrollBounding.top - activeTabBounding.top);
if (activeTabBounding.bottom > navScrollBounding.bottom) newOffset = currentOffset + (activeTabBounding.bottom - navScrollBounding.bottom);
}
newOffset = Math.max(newOffset, 0);
navOffset.value = Math.min(newOffset, maxOffset);
};
const update = () => {
if (!nav$.value || !navScroll$.value) return;
props.stretch && tabBarRef.value?.update();
const navSize = nav$.value.getBoundingClientRect()[sizeName.value];
const containerSize = navScroll$.value.getBoundingClientRect()[sizeName.value];
const currentOffset = navOffset.value;
if (containerSize < navSize) {
scrollable.value = scrollable.value || {};
scrollable.value.prev = currentOffset;
scrollable.value.next = isGreaterThan(navSize, currentOffset + containerSize);
if (isGreaterThan(containerSize, navSize - currentOffset)) navOffset.value = navSize - containerSize;
} else {
scrollable.value = false;
if (currentOffset > 0) navOffset.value = 0;
}
};
const changeTab = (event) => {
const code = getEventCode(event);
let step = 0;
switch (code) {
case EVENT_CODE.left:
case EVENT_CODE.up:
step = -1;
break;
case EVENT_CODE.right:
case EVENT_CODE.down:
step = 1;
break;
default: return;
}
const tabList = Array.from(event.currentTarget.querySelectorAll("[role=tab]:not(.is-disabled)"));
let nextIndex = tabList.indexOf(event.target) + step;
if (nextIndex < 0) nextIndex = tabList.length - 1;
else if (nextIndex >= tabList.length) nextIndex = 0;
tabList[nextIndex].focus({ preventScroll: true });
tabList[nextIndex].click();
setFocus();
};
const setFocus = () => {
if (focusable.value) isFocus.value = true;
};
const removeFocus = () => isFocus.value = false;
const setRefs = (el, key) => {
tabRefsMap.value[key] = el;
};
const focusActiveTab = async () => {
await (0, vue.nextTick)();
tabRefsMap.value[props.currentName]?.focus({ preventScroll: true });
};
(0, vue.watch)(visibility, (visibility) => {
if (visibility === "hidden") focusable.value = false;
else if (visibility === "visible") setTimeout(() => focusable.value = true, 50);
});
(0, vue.watch)(focused, (focused) => {
if (focused) setTimeout(() => focusable.value = true, 50);
else focusable.value = false;
});
useResizeObserver(el$, () => {
rAF(update);
});
(0, vue.onMounted)(() => setTimeout(() => scrollToActiveTab(), 0));
(0, vue.onUpdated)(() => update());
expose({
scrollToActiveTab,
removeFocus,
focusActiveTab,
tabListRef: nav$,
tabBarRef,
scheduleRender: () => (0, vue.triggerRef)(tracker)
});
return () => {
const scrollBtn = scrollable.value ? [(0, vue.createVNode)("span", {
"class": [ns.e("nav-prev"), ns.is("disabled", !scrollable.value.prev)],
"onClick": scrollPrev
}, [(0, vue.createVNode)(ElIcon, null, { default: () => [(0, vue.createVNode)(arrow_left_default, null, null)] })]), (0, vue.createVNode)("span", {
"class": [ns.e("nav-next"), ns.is("disabled", !scrollable.value.next)],
"onClick": scrollNext
}, [(0, vue.createVNode)(ElIcon, null, { default: () => [(0, vue.createVNode)(arrow_right_default, null, null)] })])] : null;
const tabs = props.panes.map((pane, index) => {
const uid = pane.uid;
const disabled = pane.props.disabled;
const tabName = pane.props.name ?? pane.index ?? `${index}`;
const closable = !disabled && (pane.isClosable || pane.props.closable !== false && props.editable);
pane.index = `${index}`;
const btnClose = closable ? (0, vue.createVNode)(ElIcon, {
"class": "is-icon-close",
"onClick": (ev) => emit("tabRemove", pane, ev)
}, { default: () => [(0, vue.createVNode)(close_default, null, null)] }) : null;
const tabLabelContent = pane.slots.label?.() || pane.props.label;
const tabindex = !disabled && pane.active ? props.tabindex ?? rootTabs.props.tabindex : -1;
return (0, vue.createVNode)("div", {
"ref": (el) => setRefs(el, tabName),
"class": [
ns.e("item"),
ns.is(rootTabs.props.tabPosition),
ns.is("active", pane.active),
ns.is("disabled", disabled),
ns.is("closable", closable),
ns.is("focus", isFocus.value)
],
"id": `tab-${tabName}`,
"key": `tab-${uid}`,
"aria-controls": `pane-${tabName}`,
"role": "tab",
"aria-selected": pane.active,
"tabindex": tabindex,
"onFocus": () => setFocus(),
"onBlur": () => removeFocus(),
"onClick": (ev) => {
removeFocus();
emit("tabClick", pane, tabName, ev);
},
"onKeydown": (ev) => {
const code = getEventCode(ev);
if (closable && (code === EVENT_CODE.delete || code === EVENT_CODE.backspace)) emit("tabRemove", pane, ev);
}
}, [...[tabLabelContent, btnClose]]);
});
tracker.value;
return (0, vue.createVNode)("div", {
"ref": el$,
"class": [
ns.e("nav-wrap"),
ns.is("scrollable", !!scrollable.value),
ns.is(rootTabs.props.tabPosition)
]
}, [scrollBtn, (0, vue.createVNode)("div", {
"class": ns.e("nav-scroll"),
"ref": navScroll$
}, [props.panes.length > 0 ? (0, vue.createVNode)("div", {
"class": [
ns.e("nav"),
ns.is(rootTabs.props.tabPosition),
ns.is("stretch", props.stretch && ["top", "bottom"].includes(rootTabs.props.tabPosition))
],
"ref": nav$,
"style": navStyle.value,
"role": "tablist",
"onKeydown": changeTab,
"onWheel": handleWheel
}, [...[!props.type ? (0, vue.createVNode)(tab_bar_default, {
"ref": tabBarRef,
"tabs": [...props.panes],
"tabRefs": tabRefsMap.value
}, null) : null, tabs]]) : null])]);
};
}
});
//#endregion
//#region ../../packages/components/tabs/src/tabs.tsx
const tabsProps = buildProps({
type: {
type: String,
values: [
"card",
"border-card",
""
],
default: ""
},
closable: Boolean,
addable: Boolean,
modelValue: { type: [String, Number] },
defaultValue: { type: [String, Number] },
editable: Boolean,
tabPosition: {
type: String,
values: [
"top",
"right",
"bottom",
"left"
],
default: "top"
},
beforeLeave: {
type: definePropType(Function),
default: () => true
},
stretch: Boolean,
tabindex: {
type: [String, Number],
default: 0
}
});
const isPaneName = (value) => isString(value) || isNumber(value);
const tabsEmits = {
[UPDATE_MODEL_EVENT]: (name) => isPaneName(name),
tabClick: (pane, ev) => ev instanceof Event,
tabChange: (name) => isPaneName(name),
edit: (paneName, action) => ["remove", "add"].includes(action),
tabRemove: (name) => isPaneName(name),
tabAdd: () => true
};
const Tabs = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTabs",
props: tabsProps,
emits: tabsEmits,
setup(props, { emit, slots, expose }) {
const ns = useNamespace("tabs");
const isVertical = (0, vue.computed)(() => ["left", "right"].includes(props.tabPosition));
const { children: panes, addChild: registerPane, removeChild: unregisterPane, ChildrenSorter: PanesSorter } = useOrderedChildren((0, vue.getCurrentInstance)(), "ElTabPane");
const nav$ = (0, vue.ref)();
const currentName = (0, vue.ref)((isUndefined(props.modelValue) ? props.defaultValue : props.modelValue) ?? "0");
const setCurrentName = async (value, trigger = false) => {
if (currentName.value === value || isUndefined(value)) return;
try {
let canLeave;
if (props.beforeLeave) {
const result = props.beforeLeave(value, currentName.value);
canLeave = result instanceof Promise ? await result : result;
} else canLeave = true;
if (canLeave !== false) {
const isFocusInsidePane = panes.value.find((item) => item.paneName === currentName.value)?.isFocusInsidePane();
currentName.value = value;
if (trigger) {
emit(UPDATE_MODEL_EVENT, value);
emit("tabChange", value);
}
nav$.value?.removeFocus?.();
if (isFocusInsidePane) nav$.value?.focusActiveTab();
}
} catch {}
};
const handleTabClick = (tab, tabName, event) => {
if (tab.props.disabled) return;
emit("tabClick", tab, event);
setCurrentName(tabName, true);
};
const handleTabRemove = (pane, ev) => {
if (pane.props.disabled || isUndefined(pane.props.name)) return;
ev.stopPropagation();
emit("edit", pane.props.name, "remove");
emit("tabRemove", pane.props.name);
};
const handleTabAdd = () => {
emit("edit", void 0, "add");
emit("tabAdd");
};
const handleKeydown = (event) => {
const code = getEventCode(event);
if ([EVENT_CODE.enter, EVENT_CODE.numpadEnter].includes(code)) handleTabAdd();
};
const swapChildren = (vnode) => {
const actualFirstChild = vnode.el.firstChild;
const firstChild = ["bottom", "right"].includes(props.tabPosition) ? vnode.children[0].el : vnode.children[1].el;
if (actualFirstChild !== firstChild) actualFirstChild.before(firstChild);
};
(0, vue.watch)(() => props.modelValue, (modelValue) => setCurrentName(modelValue));
(0, vue.watch)(currentName, async () => {
await (0, vue.nextTick)();
nav$.value?.scrollToActiveTab();
});
(0, vue.provide)(tabsRootContextKey, {
props,
currentName,
registerPane,
unregisterPane,
nav$
});
expose({
currentName,
get tabNavRef() {
return omit(nav$.value, ["scheduleRender"]);
}
});
return () => {
const addSlot = slots["add-icon"];
const newButton = props.editable || props.addable ? (0, vue.createVNode)("div", {
"class": [ns.e("new-tab"), isVertical.value && ns.e("new-tab-vertical")],
"tabindex": props.tabindex,
"onClick": handleTabAdd,
"onKeydown": handleKeydown
}, [addSlot ? (0, vue.renderSlot)(slots, "add-icon") : (0, vue.createVNode)(ElIcon, { "class": ns.is("icon-plus") }, { default: () => [(0, vue.createVNode)(plus_default, null, null)] })]) : null;
const tabNav = () => (0, vue.createVNode)(TabNav, {
"ref": nav$,
"currentName": currentName.value,
"editable": props.editable,
"type": props.type,
"panes": panes.value,
"stretch": props.stretch,
"onTabClick": handleTabClick,
"onTabRemove": handleTabRemove
}, null);
const header = (0, vue.createVNode)("div", { "class": [
ns.e("header"),
isVertical.value && ns.e("header-vertical"),
ns.is(props.tabPosition)
] }, [(0, vue.createVNode)(PanesSorter, null, {
default: tabNav,
$stable: true
}), newButton]);
const panels = (0, vue.createVNode)("div", { "class": ns.e("content") }, [(0, vue.renderSlot)(slots, "default")]);
return (0, vue.createVNode)("div", {
"class": [
ns.b(),
ns.m(props.tabPosition),
{
[ns.m("card")]: props.type === "card",
[ns.m("border-card")]: props.type === "border-card"
}
],
"onVnodeMounted": swapChildren,
"onVnodeUpdated": swapChildren
}, [panels, header]);
};
}
});
//#endregion
//#region ../../packages/components/tabs/src/tab-pane.ts
/**
* @deprecated Removed after 3.0.0, Use `TabPaneProps` instead.
*/
const tabPaneProps = buildProps({
label: {
type: String,
default: ""
},
name: { type: [String, Number] },
closable: {
type: Boolean,
default: void 0
},
disabled: Boolean,
lazy: Boolean
});
//#endregion
//#region ../../packages/components/tabs/src/tab-pane.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$14 = [
"id",
"aria-hidden",
"aria-labelledby"
];
const COMPONENT_NAME$2 = "ElTabPane";
var tab_pane_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: COMPONENT_NAME$2,
__name: "tab-pane",
props: tabPaneProps,
setup(__props) {
const props = __props;
const instance = (0, vue.getCurrentInstance)();
const slots = (0, vue.useSlots)();
const tabsRoot = (0, vue.inject)(tabsRootContextKey);
if (!tabsRoot) throwError(COMPONENT_NAME$2, "usage: <el-tabs><el-tab-pane /></el-tabs/>");
const ns = useNamespace("tab-pane");
const paneRef = (0, vue.ref)();
const index = (0, vue.ref)();
const isClosable = (0, vue.computed)(() => props.closable ?? tabsRoot.props.closable);
const active = (0, vue.computed)(() => tabsRoot.currentName.value === (props.name ?? index.value));
const loaded = (0, vue.ref)(active.value);
const paneName = (0, vue.computed)(() => props.name ?? index.value);
const shouldBeRender = (0, vue.computed)(() => !props.lazy || loaded.value || active.value);
const isFocusInsidePane = () => {
return paneRef.value?.contains(document.activeElement);
};
(0, vue.watch)(active, (val) => {
if (val) loaded.value = true;
});
const pane = (0, vue.reactive)({
uid: instance.uid,
getVnode: () => instance.vnode,
slots,
props,
paneName,
active,
index,
isClosable,
isFocusInsidePane
});
tabsRoot.registerPane(pane);
(0, vue.onBeforeUnmount)(() => {
tabsRoot.unregisterPane(pane);
});
(0, vue.onBeforeUpdate)(() => {
if (slots.label) tabsRoot.nav$.value?.scheduleRender();
});
return (_ctx, _cache) => {
return shouldBeRender.value ? (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
id: `pane-${paneName.value}`,
ref_key: "paneRef",
ref: paneRef,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()),
role: "tabpanel",
"aria-hidden": !active.value,
"aria-labelledby": `tab-${paneName.value}`
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 10, _hoisted_1$14)), [[vue.vShow, active.value]]) : (0, vue.createCommentVNode)("v-if", true);
};
}
});
//#endregion
//#region ../../packages/components/tabs/src/tab-pane.vue
var tab_pane_default = tab_pane_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/tabs/index.ts
const ElTabs = withInstall(Tabs, { TabPane: tab_pane_default });
const ElTabPane = withNoopInstall(tab_pane_default);
//#endregion
//#region ../../packages/components/text/src/text.ts
/**
* @deprecated Removed after 3.0.0, Use `TextProps` instead.
*/
const textProps = buildProps({
type: {
type: String,
values: [
"primary",
"success",
"info",
"warning",
"danger",
""
],
default: ""
},
size: {
type: String,
values: componentSizes,
default: ""
},
truncated: Boolean,
lineClamp: { type: [String, Number] },
tag: {
type: String,
default: "span"
}
});
//#endregion
//#region ../../packages/components/text/src/text.vue?vue&type=script&setup=true&lang.ts
var text_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElText",
__name: "text",
props: textProps,
setup(__props) {
const props = __props;
const textRef = (0, vue.ref)();
const textSize = useFormSize();
const ns = useNamespace("text");
const textKls = (0, vue.computed)(() => [
ns.b(),
ns.m(props.type),
ns.m(textSize.value),
ns.is("truncated", props.truncated),
ns.is("line-clamp", !isUndefined(props.lineClamp))
]);
const bindTitle = () => {
if ((0, vue.useAttrs)().title) return;
let shouldAddTitle = false;
const text = textRef.value?.textContent || "";
if (props.truncated) {
const width = textRef.value?.offsetWidth;
const scrollWidth = textRef.value?.scrollWidth;
if (width && scrollWidth && scrollWidth > width) shouldAddTitle = true;
} else if (!isUndefined(props.lineClamp)) {
const height = textRef.value?.offsetHeight;
const scrollHeight = textRef.value?.scrollHeight;
if (height && scrollHeight && scrollHeight > height) shouldAddTitle = true;
}
if (shouldAddTitle) textRef.value?.setAttribute("title", text);
else textRef.value?.removeAttribute("title");
};
(0, vue.onMounted)(bindTitle);
(0, vue.onUpdated)(bindTitle);
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.tag), {
ref_key: "textRef",
ref: textRef,
class: (0, vue.normalizeClass)(textKls.value),
style: (0, vue.normalizeStyle)({ "-webkit-line-clamp": __props.lineClamp })
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 8, ["class", "style"]);
};
}
});
//#endregion
//#region ../../packages/components/text/src/text.vue
var text_default = text_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/text/index.ts
const ElText = withInstall(text_default);
//#endregion
//#region ../../packages/components/time-select/src/time-select.ts
const DEFAULT_STEP = "00:30";
/**
* @deprecated Removed after 3.0.0, Use `TimeSelectProps` instead.
*/
const timeSelectProps = buildProps({
format: {
type: String,
default: "HH:mm"
},
modelValue: { type: definePropType(String) },
disabled: {
type: Boolean,
default: void 0
},
editable: {
type: Boolean,
default: true
},
effect: {
type: definePropType(String),
default: "light"
},
clearable: {
type: Boolean,
default: true
},
size: useSizeProp,
placeholder: String,
start: {
type: String,
default: "09:00"
},
end: {
type: String,
default: "18:00"
},
step: {
type: String,
default: DEFAULT_STEP
},
minTime: { type: definePropType(String) },
maxTime: { type: definePropType(String) },
includeEndTime: Boolean,
name: String,
prefixIcon: {
type: definePropType([String, Object]),
default: () => clock_default
},
clearIcon: {
type: definePropType([String, Object]),
default: () => circle_close_default
},
popperClass: {
type: String,
default: ""
},
popperStyle: { type: definePropType([String, Object]) },
...useEmptyValuesProps
});
//#endregion
//#region ../../packages/components/time-select/src/utils.ts
const parseTime = (time) => {
const values = (time || "").split(":");
if (values.length >= 2) {
let hours = Number.parseInt(values[0], 10);
const minutes = Number.parseInt(values[1], 10);
const timeUpper = time.toUpperCase();
if (timeUpper.includes("AM") && hours === 12) hours = 0;
else if (timeUpper.includes("PM") && hours !== 12) hours += 12;
return {
hours,
minutes
};
}
return null;
};
const compareTime = (time1, time2) => {
const value1 = parseTime(time1);
if (!value1) return -1;
const value2 = parseTime(time2);
if (!value2) return -1;
const minutes1 = value1.minutes + value1.hours * 60;
const minutes2 = value2.minutes + value2.hours * 60;
if (minutes1 === minutes2) return 0;
return minutes1 > minutes2 ? 1 : -1;
};
const padTime = (time) => {
return `${time}`.padStart(2, "0");
};
const formatTime = (time) => {
return `${padTime(time.hours)}:${padTime(time.minutes)}`;
};
const nextTime = (time, step) => {
const timeValue = parseTime(time);
if (!timeValue) return "";
const stepValue = parseTime(step);
if (!stepValue) return "";
const next = {
hours: timeValue.hours,
minutes: timeValue.minutes
};
next.minutes += stepValue.minutes;
next.hours += stepValue.hours;
next.hours += Math.floor(next.minutes / 60);
next.minutes = next.minutes % 60;
return formatTime(next);
};
//#endregion
//#region ../../packages/components/time-select/src/time-select.vue?vue&type=script&setup=true&lang.ts
var time_select_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTimeSelect",
__name: "time-select",
props: timeSelectProps,
emits: [
CHANGE_EVENT,
"blur",
"focus",
"clear",
UPDATE_MODEL_EVENT
],
setup(__props, { expose: __expose }) {
import_dayjs_min.default.extend(import_customParseFormat.default);
const { Option: ElOption } = ElSelect;
const props = __props;
const nsInput = useNamespace("input");
const select = (0, vue.ref)();
const _disabled = useFormDisabled();
const { lang } = useLocale();
const value = (0, vue.computed)(() => props.modelValue);
const start = (0, vue.computed)(() => {
const time = parseTime(props.start);
return time ? formatTime(time) : null;
});
const end = (0, vue.computed)(() => {
const time = parseTime(props.end);
return time ? formatTime(time) : null;
});
const minTime = (0, vue.computed)(() => {
const time = parseTime(props.minTime || "");
return time ? formatTime(time) : null;
});
const maxTime = (0, vue.computed)(() => {
const time = parseTime(props.maxTime || "");
return time ? formatTime(time) : null;
});
const step = (0, vue.computed)(() => {
const time = parseTime(props.step);
const isInvalidStep = !time || time.hours < 0 || time.minutes < 0 || Number.isNaN(time.hours) || Number.isNaN(time.minutes) || time.hours === 0 && time.minutes === 0;
if (isInvalidStep) /* @__PURE__ */ debugWarn("ElTimeSelect", `invalid step, fallback to default step (${DEFAULT_STEP}).`);
return !isInvalidStep ? formatTime(time) : DEFAULT_STEP;
});
const items = (0, vue.computed)(() => {
const result = [];
const push = (formattedValue, rawValue) => {
result.push({
value: formattedValue,
rawValue,
disabled: compareTime(rawValue, minTime.value || "-1:-1") <= 0 || compareTime(rawValue, maxTime.value || "100:100") >= 0
});
};
if (props.start && props.end && props.step) {
let current = start.value;
let currentTime;
while (current && end.value && compareTime(current, end.value) <= 0) {
currentTime = (0, import_dayjs_min.default)(current, "HH:mm").locale(lang.value).format(props.format);
push(currentTime, current);
current = nextTime(current, step.value);
}
if (props.includeEndTime && end.value && result[result.length - 1]?.rawValue !== end.value) push((0, import_dayjs_min.default)(end.value, "HH:mm").locale(lang.value).format(props.format), end.value);
}
return result;
});
const blur = () => {
select.value?.blur?.();
};
const focus = () => {
select.value?.focus?.();
};
__expose({
blur,
focus
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElSelect), {
ref_key: "select",
ref: select,
name: __props.name,
"model-value": value.value,
disabled: (0, vue.unref)(_disabled),
clearable: __props.clearable,
"clear-icon": __props.clearIcon,
size: __props.size,
effect: __props.effect,
placeholder: __props.placeholder,
"default-first-option": "",
filterable: __props.editable,
"empty-values": __props.emptyValues,
"value-on-clear": __props.valueOnClear,
"popper-class": __props.popperClass,
"popper-style": __props.popperStyle,
"onUpdate:modelValue": _cache[0] || (_cache[0] = (event) => _ctx.$emit((0, vue.unref)(UPDATE_MODEL_EVENT), event)),
onChange: _cache[1] || (_cache[1] = (event) => _ctx.$emit((0, vue.unref)(CHANGE_EVENT), event)),
onBlur: _cache[2] || (_cache[2] = (event) => _ctx.$emit("blur", event)),
onFocus: _cache[3] || (_cache[3] = (event) => _ctx.$emit("focus", event)),
onClear: _cache[4] || (_cache[4] = () => _ctx.$emit("clear"))
}, {
prefix: (0, vue.withCtx)(() => [__props.prefixIcon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(nsInput).e("prefix-icon"))
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.prefixIcon)))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true)]),
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(items.value, (item) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElOption), {
key: item.value,
label: item.value,
value: item.value,
disabled: item.disabled
}, null, 8, [
"label",
"value",
"disabled"
]);
}), 128))]),
_: 1
}, 8, [
"name",
"model-value",
"disabled",
"clearable",
"clear-icon",
"size",
"effect",
"placeholder",
"filterable",
"empty-values",
"value-on-clear",
"popper-class",
"popper-style"
]);
};
}
});
//#endregion
//#region ../../packages/components/time-select/src/time-select.vue
var time_select_default = time_select_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/time-select/index.ts
const ElTimeSelect = withInstall(time_select_default);
//#endregion
//#region ../../packages/components/timeline/src/tokens.ts
const TIMELINE_INJECTION_KEY = "timeline";
//#endregion
//#region ../../packages/components/timeline/src/timeline.ts
const timelineProps = buildProps({
mode: {
type: String,
values: [
"start",
"alternate",
"alternate-reverse",
"end"
],
default: "start"
},
reverse: Boolean
});
const Timeline = (0, vue.defineComponent)({
name: "ElTimeline",
props: timelineProps,
setup(props, { slots }) {
const ns = useNamespace("timeline");
(0, vue.provide)(TIMELINE_INJECTION_KEY, {
props,
slots
});
const timelineKls = (0, vue.computed)(() => [ns.b(), ns.is(props.mode)]);
return () => {
const children = flattedChildren(slots.default?.() ?? []);
return (0, vue.h)("ul", { class: timelineKls.value }, props.reverse ? children.reverse() : children);
};
}
});
//#endregion
//#region ../../packages/components/timeline/src/timeline-item.ts
/**
* @deprecated Removed after 3.0.0, Use `TimelineItemProps` instead.
*/
const timelineItemProps = buildProps({
timestamp: {
type: String,
default: ""
},
hideTimestamp: Boolean,
center: Boolean,
placement: {
type: String,
values: ["top", "bottom"],
default: "bottom"
},
type: {
type: String,
values: [
"primary",
"success",
"warning",
"danger",
"info"
],
default: ""
},
color: {
type: String,
default: ""
},
size: {
type: String,
values: ["normal", "large"],
default: "normal"
},
icon: { type: iconPropType },
hollow: Boolean
});
//#endregion
//#region ../../packages/components/timeline/src/timeline-item.vue?vue&type=script&setup=true&lang.ts
var timeline_item_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTimelineItem",
__name: "timeline-item",
props: timelineItemProps,
setup(__props) {
const props = __props;
const { props: timelineProps } = (0, vue.inject)(TIMELINE_INJECTION_KEY);
const ns = useNamespace("timeline-item");
const defaultNodeKls = (0, vue.computed)(() => [
ns.e("node"),
ns.em("node", props.size || ""),
ns.em("node", props.type || ""),
ns.is("hollow", props.hollow)
]);
const timelineItemKls = (0, vue.computed)(() => [
ns.b(),
{ [ns.e("center")]: props.center },
ns.is(timelineProps.mode)
]);
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("li", { class: (0, vue.normalizeClass)(timelineItemKls.value) }, [
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("tail")) }, null, 2),
!_ctx.$slots.dot ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)(defaultNodeKls.value),
style: (0, vue.normalizeStyle)({ backgroundColor: __props.color })
}, [__props.icon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("icon"))
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.icon)))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true)], 6)) : (0, vue.createCommentVNode)("v-if", true),
_ctx.$slots.dot ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("dot"))
}, [(0, vue.renderSlot)(_ctx.$slots, "dot")], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("wrapper")) }, [
!__props.hideTimestamp && __props.placement === "top" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("timestamp"), (0, vue.unref)(ns).is("top")])
}, (0, vue.toDisplayString)(__props.timestamp), 3)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("content")) }, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2),
!__props.hideTimestamp && __props.placement === "bottom" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("timestamp"), (0, vue.unref)(ns).is("bottom")])
}, (0, vue.toDisplayString)(__props.timestamp), 3)) : (0, vue.createCommentVNode)("v-if", true)
], 2)
], 2);
};
}
});
//#endregion
//#region ../../packages/components/timeline/src/timeline-item.vue
var timeline_item_default = timeline_item_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/timeline/index.ts
const ElTimeline = withInstall(Timeline, { TimelineItem: timeline_item_default });
const ElTimelineItem = withNoopInstall(timeline_item_default);
//#endregion
//#region ../../packages/components/transfer/src/transfer.ts
const LEFT_CHECK_CHANGE_EVENT = "left-check-change";
const RIGHT_CHECK_CHANGE_EVENT = "right-check-change";
/**
* @deprecated Removed after 3.0.0, Use `TransferProps` instead.
*/
const transferProps = buildProps({
data: {
type: definePropType(Array),
default: () => []
},
titles: {
type: definePropType(Array),
default: () => []
},
buttonTexts: {
type: definePropType(Array),
default: () => []
},
filterPlaceholder: String,
filterMethod: { type: definePropType(Function) },
leftDefaultChecked: {
type: definePropType(Array),
default: () => []
},
rightDefaultChecked: {
type: definePropType(Array),
default: () => []
},
renderContent: { type: definePropType(Function) },
modelValue: {
type: definePropType(Array),
default: () => []
},
format: {
type: definePropType(Object),
default: () => ({})
},
filterable: Boolean,
props: {
type: definePropType(Object),
default: () => mutable({
label: "label",
key: "key",
disabled: "disabled"
})
},
targetOrder: {
type: String,
values: [
"original",
"push",
"unshift"
],
default: "original"
},
validateEvent: {
type: Boolean,
default: true
}
});
const transferCheckedChangeFn = (value, movedKeys) => [value, movedKeys].every(isArray$1) || isArray$1(value) && isNil(movedKeys);
const transferEmits = {
[CHANGE_EVENT]: (value, direction, movedKeys) => [value, movedKeys].every(isArray$1) && ["left", "right"].includes(direction),
[UPDATE_MODEL_EVENT]: (value) => isArray$1(value),
[LEFT_CHECK_CHANGE_EVENT]: transferCheckedChangeFn,
[RIGHT_CHECK_CHANGE_EVENT]: transferCheckedChangeFn
};
//#endregion
//#region ../../packages/components/transfer/src/transfer-panel.ts
const CHECKED_CHANGE_EVENT = "checked-change";
/**
* @deprecated Removed after 3.0.0, Use `TransferPanelProps` instead.
*/
const transferPanelProps = buildProps({
data: transferProps.data,
optionRender: { type: definePropType(Function) },
placeholder: String,
title: String,
filterable: Boolean,
format: transferProps.format,
filterMethod: transferProps.filterMethod,
defaultChecked: transferProps.leftDefaultChecked,
props: transferProps.props
});
const transferPanelEmits = { [CHECKED_CHANGE_EVENT]: transferCheckedChangeFn };
//#endregion
//#region ../../packages/components/transfer/src/composables/use-props-alias.ts
const usePropsAlias = (props) => {
const initProps = {
label: "label",
key: "key",
disabled: "disabled"
};
return (0, vue.computed)(() => ({
...initProps,
...props.props
}));
};
//#endregion
//#region ../../packages/components/transfer/src/composables/use-check.ts
const useCheck$1 = (props, panelState, emit) => {
const propsAlias = usePropsAlias(props);
const filteredData = (0, vue.computed)(() => {
return props.data.filter((item) => {
if (isFunction$1(props.filterMethod)) return props.filterMethod(panelState.query, item);
else return String(item[propsAlias.value.label] || item[propsAlias.value.key]).toLowerCase().includes(panelState.query.toLowerCase());
});
});
const checkableData = (0, vue.computed)(() => filteredData.value.filter((item) => !item[propsAlias.value.disabled]));
const checkedSummary = (0, vue.computed)(() => {
const checkedLength = panelState.checked.length;
const dataLength = props.data.length;
const { noChecked, hasChecked } = props.format;
if (noChecked && hasChecked) return checkedLength > 0 ? hasChecked.replace(/\${checked}/g, checkedLength.toString()).replace(/\${total}/g, dataLength.toString()) : noChecked.replace(/\${total}/g, dataLength.toString());
else return `${checkedLength}/${dataLength}`;
});
const isIndeterminate = (0, vue.computed)(() => {
const checkedLength = panelState.checked.length;
return checkedLength > 0 && checkedLength < checkableData.value.length;
});
const updateAllChecked = () => {
const checkableDataKeys = checkableData.value.map((item) => item[propsAlias.value.key]);
panelState.allChecked = checkableDataKeys.length > 0 && checkableDataKeys.every((item) => panelState.checked.includes(item));
};
const handleAllCheckedChange = (value) => {
panelState.checked = value ? checkableData.value.map((item) => item[propsAlias.value.key]) : [];
};
(0, vue.watch)(() => panelState.checked, (val, oldVal) => {
updateAllChecked();
if (panelState.checkChangeByUser) emit(CHECKED_CHANGE_EVENT, val, val.concat(oldVal).filter((v) => !val.includes(v) || !oldVal.includes(v)));
else {
emit(CHECKED_CHANGE_EVENT, val);
panelState.checkChangeByUser = true;
}
});
(0, vue.watch)(checkableData, () => {
updateAllChecked();
});
(0, vue.watch)(() => props.data, () => {
const checked = [];
const filteredDataKeys = filteredData.value.map((item) => item[propsAlias.value.key]);
panelState.checked.forEach((item) => {
if (filteredDataKeys.includes(item)) checked.push(item);
});
panelState.checkChangeByUser = false;
panelState.checked = checked;
});
(0, vue.watch)(() => props.defaultChecked, (val, oldVal) => {
if (oldVal && val.length === oldVal.length && val.every((item) => oldVal.includes(item))) return;
const checked = [];
const checkableDataKeys = checkableData.value.map((item) => item[propsAlias.value.key]);
val.forEach((item) => {
if (checkableDataKeys.includes(item)) checked.push(item);
});
panelState.checkChangeByUser = false;
panelState.checked = checked;
}, { immediate: true });
return {
filteredData,
checkableData,
checkedSummary,
isIndeterminate,
updateAllChecked,
handleAllCheckedChange
};
};
//#endregion
//#region ../../packages/components/transfer/src/composables/use-checked-change.ts
const useCheckedChange = (checkedState, emit) => {
const onSourceCheckedChange = (val, movedKeys) => {
checkedState.leftChecked = val;
if (!movedKeys) return;
emit(LEFT_CHECK_CHANGE_EVENT, val, movedKeys);
};
const onTargetCheckedChange = (val, movedKeys) => {
checkedState.rightChecked = val;
if (!movedKeys) return;
emit(RIGHT_CHECK_CHANGE_EVENT, val, movedKeys);
};
return {
onSourceCheckedChange,
onTargetCheckedChange
};
};
//#endregion
//#region ../../packages/components/transfer/src/composables/use-computed-data.ts
const useComputedData = (props) => {
const propsAlias = usePropsAlias(props);
const dataObj = (0, vue.computed)(() => props.data.reduce((o, cur) => (o[cur[propsAlias.value.key]] = cur, o), {}));
return {
sourceData: (0, vue.computed)(() => props.data.filter((item) => !props.modelValue.includes(item[propsAlias.value.key]))),
targetData: (0, vue.computed)(() => {
if (props.targetOrder === "original") return props.data.filter((item) => props.modelValue.includes(item[propsAlias.value.key]));
else return props.modelValue.reduce((arr, cur) => {
const val = dataObj.value[cur];
if (val) arr.push(val);
return arr;
}, []);
})
};
};
//#endregion
//#region ../../packages/components/transfer/src/composables/use-move.ts
const useMove = (props, checkedState, emit) => {
const propsAlias = usePropsAlias(props);
const _emit = (value, direction, movedKeys) => {
emit(UPDATE_MODEL_EVENT, value);
emit(CHANGE_EVENT, value, direction, movedKeys);
};
const addToLeft = () => {
const currentValue = props.modelValue.slice();
checkedState.rightChecked.forEach((item) => {
const index = currentValue.indexOf(item);
if (index > -1) currentValue.splice(index, 1);
});
_emit(currentValue, "left", checkedState.rightChecked);
};
const addToRight = () => {
let currentValue = props.modelValue.slice();
const itemsToBeMoved = props.data.filter((item) => {
const itemKey = item[propsAlias.value.key];
return checkedState.leftChecked.includes(itemKey) && !props.modelValue.includes(itemKey);
}).map((item) => item[propsAlias.value.key]);
currentValue = props.targetOrder === "unshift" ? itemsToBeMoved.concat(currentValue) : currentValue.concat(itemsToBeMoved);
if (props.targetOrder === "original") currentValue = props.data.filter((item) => currentValue.includes(item[propsAlias.value.key])).map((item) => item[propsAlias.value.key]);
_emit(currentValue, "right", checkedState.leftChecked);
};
return {
addToLeft,
addToRight
};
};
//#endregion
//#region ../../packages/components/transfer/src/transfer-panel.vue?vue&type=script&setup=true&lang.ts
var transfer_panel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTransferPanel",
__name: "transfer-panel",
props: transferPanelProps,
emits: transferPanelEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const slots = (0, vue.useSlots)();
const OptionContent = ({ option }) => option;
const { t } = useLocale();
const ns = useNamespace("transfer");
const panelState = (0, vue.reactive)({
checked: [],
allChecked: false,
query: "",
checkChangeByUser: true
});
const propsAlias = usePropsAlias(props);
const { filteredData, checkedSummary, isIndeterminate, handleAllCheckedChange } = useCheck$1(props, panelState, emit);
const hasNoMatch = (0, vue.computed)(() => !isEmpty(panelState.query) && isEmpty(filteredData.value));
const hasFooter = (0, vue.computed)(() => !isEmpty(slots.default()[0].children));
const { checked, allChecked, query } = (0, vue.toRefs)(panelState);
__expose({ query });
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).b("panel")) }, [
(0, vue.createElementVNode)("p", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("panel", "header")) }, [(0, vue.createVNode)((0, vue.unref)(ElCheckbox), {
modelValue: (0, vue.unref)(allChecked),
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => (0, vue.isRef)(allChecked) ? allChecked.value = $event : null),
indeterminate: (0, vue.unref)(isIndeterminate),
"validate-event": false,
onChange: (0, vue.unref)(handleAllCheckedChange)
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("panel", "header-title")) }, (0, vue.toDisplayString)(__props.title), 3), (0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("panel", "header-count")) }, (0, vue.toDisplayString)((0, vue.unref)(checkedSummary)), 3)]),
_: 1
}, 8, [
"modelValue",
"indeterminate",
"onChange"
])], 2),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).be("panel", "body"), (0, vue.unref)(ns).is("with-footer", hasFooter.value)]) }, [
__props.filterable ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElInput), {
key: 0,
modelValue: (0, vue.unref)(query),
"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => (0, vue.isRef)(query) ? query.value = $event : null),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("panel", "filter")),
size: "default",
placeholder: __props.placeholder,
"prefix-icon": (0, vue.unref)(search_default),
clearable: "",
"validate-event": false
}, null, 8, [
"modelValue",
"class",
"placeholder",
"prefix-icon"
])) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.withDirectives)((0, vue.createVNode)((0, vue.unref)(ElCheckboxGroup), {
modelValue: (0, vue.unref)(checked),
"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => (0, vue.isRef)(checked) ? checked.value = $event : null),
"validate-event": false,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).is("filterable", __props.filterable), (0, vue.unref)(ns).be("panel", "list")])
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(filteredData), (item) => {
return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElCheckbox), {
key: item[(0, vue.unref)(propsAlias).key],
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("panel", "item")),
value: item[(0, vue.unref)(propsAlias).key],
disabled: item[(0, vue.unref)(propsAlias).disabled],
"validate-event": false
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)(OptionContent, { option: __props.optionRender?.(item) }, null, 8, ["option"])]),
_: 2
}, 1032, [
"class",
"value",
"disabled"
]);
}), 128))]),
_: 1
}, 8, ["modelValue", "class"]), [[vue.vShow, !hasNoMatch.value && !(0, vue.unref)(isEmpty)(__props.data)]]),
(0, vue.withDirectives)((0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("panel", "empty")) }, [(0, vue.renderSlot)(_ctx.$slots, "empty", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(hasNoMatch.value ? (0, vue.unref)(t)("el.transfer.noMatch") : (0, vue.unref)(t)("el.transfer.noData")), 1)])], 2), [[vue.vShow, hasNoMatch.value || (0, vue.unref)(isEmpty)(__props.data)]])
], 2),
hasFooter.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("p", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("panel", "footer"))
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2)) : (0, vue.createCommentVNode)("v-if", true)
], 2);
};
}
});
//#endregion
//#region ../../packages/components/transfer/src/transfer-panel.vue
var transfer_panel_default = transfer_panel_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/transfer/src/transfer.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$13 = { key: 0 };
const _hoisted_2$8 = { key: 0 };
var transfer_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTransfer",
__name: "transfer",
props: transferProps,
emits: transferEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const slots = (0, vue.useSlots)();
const { t } = useLocale();
const ns = useNamespace("transfer");
const { formItem } = useFormItem();
const checkedState = (0, vue.reactive)({
leftChecked: [],
rightChecked: []
});
const propsAlias = usePropsAlias(props);
const { sourceData, targetData } = useComputedData(props);
const { onSourceCheckedChange, onTargetCheckedChange } = useCheckedChange(checkedState, emit);
const { addToLeft, addToRight } = useMove(props, checkedState, emit);
const leftPanel = (0, vue.ref)();
const rightPanel = (0, vue.ref)();
const clearQuery = (which) => {
switch (which) {
case "left":
leftPanel.value.query = "";
break;
case "right":
rightPanel.value.query = "";
break;
}
};
const hasButtonTexts = (0, vue.computed)(() => props.buttonTexts.length === 2);
const leftPanelTitle = (0, vue.computed)(() => props.titles[0] || t("el.transfer.titles.0"));
const rightPanelTitle = (0, vue.computed)(() => props.titles[1] || t("el.transfer.titles.1"));
const panelFilterPlaceholder = (0, vue.computed)(() => props.filterPlaceholder || t("el.transfer.filterPlaceholder"));
(0, vue.watch)(() => props.modelValue, () => {
if (props.validateEvent) formItem?.validate?.("change").catch((err) => /* @__PURE__ */ debugWarn(err));
});
const optionRender = (0, vue.computed)(() => (option) => {
if (props.renderContent) return props.renderContent(vue.h, option);
const defaultSlotVNodes = (slots.default?.({ option }) || []).filter((node) => node.type !== vue.Comment);
if (defaultSlotVNodes.length) return defaultSlotVNodes;
return (0, vue.h)("span", option[propsAlias.value.label] || option[propsAlias.value.key]);
});
__expose({
clearQuery,
leftPanel,
rightPanel
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()) }, [
(0, vue.createVNode)(transfer_panel_default, {
ref_key: "leftPanel",
ref: leftPanel,
data: (0, vue.unref)(sourceData),
"option-render": optionRender.value,
placeholder: panelFilterPlaceholder.value,
title: leftPanelTitle.value,
filterable: __props.filterable,
format: __props.format,
"filter-method": __props.filterMethod,
"default-checked": __props.leftDefaultChecked,
props: props.props,
onCheckedChange: (0, vue.unref)(onSourceCheckedChange)
}, {
empty: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "left-empty")]),
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "left-footer")]),
_: 3
}, 8, [
"data",
"option-render",
"placeholder",
"title",
"filterable",
"format",
"filter-method",
"default-checked",
"props",
"onCheckedChange"
]),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("buttons")) }, [(0, vue.createVNode)((0, vue.unref)(ElButton), {
type: "primary",
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("button"), (0, vue.unref)(ns).is("with-texts", hasButtonTexts.value)]),
disabled: (0, vue.unref)(isEmpty)(checkedState.rightChecked),
onClick: (0, vue.unref)(addToLeft)
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(arrow_left_default))]),
_: 1
}), !(0, vue.unref)(isUndefined)(__props.buttonTexts[0]) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_1$13, (0, vue.toDisplayString)(__props.buttonTexts[0]), 1)) : (0, vue.createCommentVNode)("v-if", true)]),
_: 1
}, 8, [
"class",
"disabled",
"onClick"
]), (0, vue.createVNode)((0, vue.unref)(ElButton), {
type: "primary",
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("button"), (0, vue.unref)(ns).is("with-texts", hasButtonTexts.value)]),
disabled: (0, vue.unref)(isEmpty)(checkedState.leftChecked),
onClick: (0, vue.unref)(addToRight)
}, {
default: (0, vue.withCtx)(() => [!(0, vue.unref)(isUndefined)(__props.buttonTexts[1]) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_2$8, (0, vue.toDisplayString)(__props.buttonTexts[1]), 1)) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createVNode)((0, vue.unref)(ElIcon), null, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(arrow_right_default))]),
_: 1
})]),
_: 1
}, 8, [
"class",
"disabled",
"onClick"
])], 2),
(0, vue.createVNode)(transfer_panel_default, {
ref_key: "rightPanel",
ref: rightPanel,
data: (0, vue.unref)(targetData),
"option-render": optionRender.value,
placeholder: panelFilterPlaceholder.value,
filterable: __props.filterable,
format: __props.format,
"filter-method": __props.filterMethod,
title: rightPanelTitle.value,
"default-checked": __props.rightDefaultChecked,
props: props.props,
onCheckedChange: (0, vue.unref)(onTargetCheckedChange)
}, {
empty: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "right-empty")]),
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "right-footer")]),
_: 3
}, 8, [
"data",
"option-render",
"placeholder",
"filterable",
"format",
"filter-method",
"title",
"default-checked",
"props",
"onCheckedChange"
])
], 2);
};
}
});
//#endregion
//#region ../../packages/components/transfer/src/transfer.vue
var transfer_default = transfer_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/transfer/index.ts
const ElTransfer = withInstall(transfer_default);
//#endregion
//#region ../../packages/components/tree/src/model/util.ts
const NODE_KEY = "$treeNodeId";
const markNodeData = function(node, data) {
if (!data || data[NODE_KEY]) return;
Object.defineProperty(data, NODE_KEY, {
value: node.id,
enumerable: false,
configurable: false,
writable: false
});
};
const getNodeKey = (key, data) => data?.[key || NODE_KEY];
const handleCurrentChange = (store, emit, setCurrent) => {
const preCurrentNode = store.value.currentNode;
setCurrent();
const currentNode = store.value.currentNode;
if (preCurrentNode === currentNode) return;
emit("current-change", currentNode ? currentNode.data : null, currentNode);
};
//#endregion
//#region ../../packages/components/tree/src/model/node.ts
const getChildState = (node) => {
let all = true;
let none = true;
let allWithoutDisable = true;
let isEffectivelyChecked = true;
for (let i = 0, j = node.length; i < j; i++) {
const n = node[i];
if (n.checked !== true || n.indeterminate) {
all = false;
if (!n.disabled) allWithoutDisable = false;
}
if (n.checked !== false || n.indeterminate) none = false;
if (!n.isEffectivelyChecked) isEffectivelyChecked = false;
}
return {
all,
none,
allWithoutDisable,
half: !all && !none,
isEffectivelyChecked
};
};
const reInitChecked = function(node) {
if (node.childNodes.length === 0 || node.loading) {
node.isEffectivelyChecked = node.disabled || node.checked;
return;
}
const { all, none, half, isEffectivelyChecked } = getChildState(node.childNodes);
node.isEffectivelyChecked = isEffectivelyChecked;
if (all) {
node.checked = true;
node.indeterminate = false;
} else if (half) {
node.checked = false;
node.indeterminate = true;
} else if (none) {
node.checked = false;
node.indeterminate = false;
}
const parent = node.parent;
if (!parent || parent.level === 0) return;
if (!node.store.checkStrictly) reInitChecked(parent);
};
const getPropertyFromData = function(node, prop) {
const props = node.store.props;
const data = node.data || {};
const config = props[prop];
if (isFunction$1(config)) return config(data, node);
else if (isString(config)) return data[config];
else if (isUndefined(config)) {
const dataProp = data[prop];
return isUndefined(dataProp) ? "" : dataProp;
}
};
const setCanFocus = function(childNodes, focus) {
childNodes.forEach((item) => {
item.canFocus = focus;
setCanFocus(item.childNodes, focus);
});
};
let nodeIdSeed = 0;
var Node$1 = class Node$1 {
constructor(options) {
this.isLeafByUser = void 0;
this.isLeaf = void 0;
this.isEffectivelyChecked = false;
this.id = nodeIdSeed++;
this.text = null;
this.checked = false;
this.indeterminate = false;
this.data = null;
this.expanded = false;
this.parent = null;
this.visible = true;
this.isCurrent = false;
this.canFocus = false;
for (const name in options) if (hasOwn(options, name)) this[name] = options[name];
this.level = 0;
this.loaded = false;
this.childNodes = [];
this.loading = false;
if (this.parent) this.level = this.parent.level + 1;
}
initialize() {
const store = this.store;
if (!store) throw new Error("[Node]store is required!");
store.registerNode(this);
const props = store.props;
if (props && typeof props.isLeaf !== "undefined") {
const isLeaf = getPropertyFromData(this, "isLeaf");
if (isBoolean(isLeaf)) this.isLeafByUser = isLeaf;
}
if (store.lazy !== true && this.data) {
this.setData(this.data);
if (store.defaultExpandAll) {
this.expanded = true;
this.canFocus = true;
}
} else if (this.level > 0 && store.lazy && store.defaultExpandAll && !this.isLeafByUser) this.expand();
if (!isArray$1(this.data)) markNodeData(this, this.data);
if (!this.data) return;
const defaultExpandedKeys = store.defaultExpandedKeys;
const key = store.key;
if (key && !isNil(this.key) && defaultExpandedKeys && defaultExpandedKeys.includes(this.key)) this.expand(null, store.autoExpandParent);
if (key && store.currentNodeKey !== void 0 && this.key === store.currentNodeKey) {
store.currentNode && (store.currentNode.isCurrent = false);
store.currentNode = this;
store.currentNode.isCurrent = true;
}
if (store.lazy) store._initDefaultCheckedNode(this);
this.updateLeafState();
if (this.level === 1 || this.parent?.expanded === true) this.canFocus = true;
}
setData(data) {
if (!isArray$1(data)) markNodeData(this, data);
this.data = data;
this.childNodes = [];
let children;
if (this.level === 0 && isArray$1(this.data)) children = this.data;
else children = getPropertyFromData(this, "children") || [];
for (let i = 0, j = children.length; i < j; i++) this.insertChild({ data: children[i] });
}
get label() {
return getPropertyFromData(this, "label");
}
get key() {
const nodeKey = this.store.key;
if (this.data) return this.data[nodeKey];
return null;
}
get disabled() {
return getPropertyFromData(this, "disabled");
}
get nextSibling() {
const parent = this.parent;
if (parent) {
const index = parent.childNodes.indexOf(this);
if (index > -1) return parent.childNodes[index + 1];
}
return null;
}
get previousSibling() {
const parent = this.parent;
if (parent) {
const index = parent.childNodes.indexOf(this);
if (index > -1) return index > 0 ? parent.childNodes[index - 1] : null;
}
return null;
}
contains(target, deep = true) {
return (this.childNodes || []).some((child) => child === target || deep && child.contains(target));
}
remove() {
const parent = this.parent;
if (parent) parent.removeChild(this);
}
insertChild(child, index, batch) {
if (!child) throw new Error("InsertChild error: child is required.");
if (!(child instanceof Node$1)) {
if (!batch) {
const children = this.getChildren(true);
if (!children?.includes(child.data)) if (isUndefined(index) || index < 0) children?.push(child.data);
else children?.splice(index, 0, child.data);
}
Object.assign(child, {
parent: this,
store: this.store
});
child = (0, vue.reactive)(new Node$1(child));
if (child instanceof Node$1) child.initialize();
}
child.level = this.level + 1;
if (isUndefined(index) || index < 0) this.childNodes.push(child);
else this.childNodes.splice(index, 0, child);
this.updateLeafState();
}
insertBefore(child, ref) {
let index;
if (ref) index = this.childNodes.indexOf(ref);
this.insertChild(child, index);
}
insertAfter(child, ref) {
let index;
if (ref) {
index = this.childNodes.indexOf(ref);
if (index !== -1) index += 1;
}
this.insertChild(child, index);
}
removeChild(child) {
const children = this.getChildren() || [];
const dataIndex = children.indexOf(child.data);
if (dataIndex > -1) children.splice(dataIndex, 1);
const index = this.childNodes.indexOf(child);
if (index > -1) {
this.store && this.store.deregisterNode(child);
child.parent = null;
this.childNodes.splice(index, 1);
}
this.updateLeafState();
}
removeChildByData(data) {
const targetNode = this.childNodes.find((child) => child.data === data);
if (targetNode) this.removeChild(targetNode);
}
expand(callback, expandParent) {
const done = () => {
if (expandParent) {
let parent = this.parent;
while (parent && parent.level > 0) {
parent.expanded = true;
parent = parent.parent;
}
}
this.expanded = true;
if (callback) callback();
setCanFocus(this.childNodes, true);
};
if (this.shouldLoadData()) this.loadData((data) => {
if (isArray$1(data)) {
if (this.checked) this.setChecked(true, true);
else if (!this.store.checkStrictly) reInitChecked(this);
done();
}
});
else done();
}
doCreateChildren(array, defaultProps = {}) {
array.forEach((item) => {
this.insertChild(Object.assign({ data: item }, defaultProps), void 0, true);
});
}
collapse() {
this.expanded = false;
setCanFocus(this.childNodes, false);
}
shouldLoadData() {
return Boolean(this.store.lazy === true && this.store.load && !this.loaded);
}
updateLeafState() {
if (this.store.lazy === true && this.loaded !== true && typeof this.isLeafByUser !== "undefined") {
this.isLeaf = this.isLeafByUser;
this.isEffectivelyChecked = this.isLeaf && this.disabled;
return;
}
const childNodes = this.childNodes;
if (!this.store.lazy || this.store.lazy === true && this.loaded === true) {
this.isLeaf = !childNodes || childNodes.length === 0;
this.isEffectivelyChecked = this.isLeaf && this.disabled;
return;
}
this.isLeaf = false;
}
setChecked(value, deep, recursion, passValue) {
this.indeterminate = value === "half";
this.checked = value === true;
this.isEffectivelyChecked = !this.childNodes.length && (this.disabled || this.checked);
if (this.store.checkStrictly) return;
if (!(this.shouldLoadData() && !this.store.checkDescendants)) {
const handleDescendants = () => {
if (deep) {
const childNodes = this.childNodes;
for (let i = 0, j = childNodes.length; i < j; i++) {
const child = childNodes[i];
passValue = passValue || value !== false;
const isCheck = child.disabled && child.isLeaf ? child.checked : passValue;
child.setChecked(isCheck, deep, true, passValue);
}
const { half, all, isEffectivelyChecked } = getChildState(childNodes);
if (!all) {
this.checked = all;
this.indeterminate = half;
}
this.isEffectivelyChecked = !this.childNodes.length ? this.disabled || this.checked : isEffectivelyChecked;
}
};
if (this.shouldLoadData()) {
this.loadData(() => {
handleDescendants();
reInitChecked(this);
}, { checked: value !== false });
return;
} else handleDescendants();
}
const parent = this.parent;
if (!parent || parent.level === 0) return;
if (!recursion) reInitChecked(parent);
}
getChildren(forceInit = false) {
if (this.level === 0) return this.data;
const data = this.data;
if (!data) return null;
const props = this.store.props;
let children = "children";
if (props) children = props.children || "children";
if (isUndefined(data[children])) data[children] = null;
if (forceInit && !data[children]) data[children] = [];
return data[children];
}
updateChildren() {
const newData = this.getChildren() || [];
const oldData = this.childNodes.map((node) => node.data);
const newDataMap = {};
const newNodes = [];
newData.forEach((item, index) => {
const key = item[NODE_KEY];
if (!!key && oldData.some((data) => data?.[NODE_KEY] === key)) newDataMap[key] = {
index,
data: item
};
else newNodes.push({
index,
data: item
});
});
if (!this.store.lazy) oldData.forEach((item) => {
if (!newDataMap[item?.[NODE_KEY]]) this.removeChildByData(item);
});
newNodes.forEach(({ index, data }) => {
this.insertChild({ data }, index);
});
this.updateLeafState();
}
loadData(callback, defaultProps = {}) {
if (this.store.lazy === true && this.store.load && !this.loaded && (!this.loading || Object.keys(defaultProps).length)) {
this.loading = true;
const resolve = (children) => {
this.childNodes = [];
this.doCreateChildren(children, defaultProps);
this.loaded = true;
this.loading = false;
this.updateLeafState();
if (callback) callback.call(this, children);
};
const reject = () => {
this.loading = false;
};
this.store.load(this, resolve, reject);
} else if (callback) callback.call(this);
}
eachNode(callback) {
const arr = [this];
while (arr.length) {
const node = arr.shift();
arr.unshift(...node.childNodes);
callback(node);
}
}
reInitChecked() {
if (this.store.checkStrictly) return;
reInitChecked(this);
}
};
//#endregion
//#region ../../packages/components/tree/src/model/tree-store.ts
var TreeStore = class {
constructor(options) {
this.lazy = false;
this.checkStrictly = false;
this.autoExpandParent = false;
this.defaultExpandAll = false;
this.checkDescendants = false;
this.currentNode = null;
this.currentNodeKey = null;
for (const option in options) if (hasOwn(options, option)) this[option] = options[option];
this.nodesMap = {};
}
initialize() {
this.root = new Node$1({
data: this.data,
store: this
});
this.root.initialize();
if (this.lazy && this.load) {
const loadFn = this.load;
loadFn(this.root, (data) => {
this.root.doCreateChildren(data);
this._initDefaultCheckedNodes();
}, NOOP);
} else this._initDefaultCheckedNodes();
}
filter(value) {
const filterNodeMethod = this.filterNodeMethod;
const lazy = this.lazy;
const traverse = async function(node) {
const childNodes = node.root ? node.root.childNodes : node.childNodes;
for (const [index, child] of childNodes.entries()) {
child.visible = !!filterNodeMethod?.call(child, value, child.data, child);
if (index % 80 === 0 && index > 0) await (0, vue.nextTick)();
await traverse(child);
}
if (!node.visible && childNodes.length) {
let allHidden = true;
allHidden = !childNodes.some((child) => child.visible);
if (node.root) node.root.visible = allHidden === false;
else node.visible = allHidden === false;
}
if (!value) return;
if (node.visible && !node.isLeaf) {
if (!lazy || node.loaded) node.expand();
}
};
traverse(this);
}
setData(newVal) {
if (newVal !== this.root.data) {
this.nodesMap = {};
this.root.setData(newVal);
this._initDefaultCheckedNodes();
this.setCurrentNodeKey(this.currentNodeKey);
} else this.root.updateChildren();
}
getNode(data) {
if (data instanceof Node$1) return data;
const key = isObject$1(data) ? getNodeKey(this.key, data) : data;
return this.nodesMap[key] || null;
}
insertBefore(data, refData) {
const refNode = this.getNode(refData);
refNode.parent?.insertBefore({ data }, refNode);
}
insertAfter(data, refData) {
const refNode = this.getNode(refData);
refNode.parent?.insertAfter({ data }, refNode);
}
remove(data) {
const node = this.getNode(data);
if (node && node.parent) {
if (node === this.currentNode) this.currentNode = null;
node.parent.removeChild(node);
}
}
append(data, parentData) {
const parentNode = !isPropAbsent(parentData) ? this.getNode(parentData) : this.root;
if (parentNode) parentNode.insertChild({ data });
}
_initDefaultCheckedNodes() {
const defaultCheckedKeys = this.defaultCheckedKeys || [];
const nodesMap = this.nodesMap;
defaultCheckedKeys.forEach((checkedKey) => {
const node = nodesMap[checkedKey];
if (node) node.setChecked(true, !this.checkStrictly);
});
}
_initDefaultCheckedNode(node) {
const defaultCheckedKeys = this.defaultCheckedKeys || [];
if (!isNil(node.key) && defaultCheckedKeys.includes(node.key)) node.setChecked(true, !this.checkStrictly);
}
setDefaultCheckedKey(newVal) {
if (newVal !== this.defaultCheckedKeys) {
this.defaultCheckedKeys = newVal;
this._initDefaultCheckedNodes();
}
}
registerNode(node) {
const key = this.key;
if (!node || !node.data) return;
if (!key) this.nodesMap[node.id] = node;
else {
const nodeKey = node.key;
if (!isNil(nodeKey)) this.nodesMap[nodeKey] = node;
}
}
deregisterNode(node) {
if (!this.key || !node || !node.data) return;
node.childNodes.forEach((child) => {
this.deregisterNode(child);
});
delete this.nodesMap[node.key];
}
getCheckedNodes(leafOnly = false, includeHalfChecked = false) {
const checkedNodes = [];
const traverse = function(node) {
(node.root ? node.root.childNodes : node.childNodes).forEach((child) => {
if ((child.checked || includeHalfChecked && child.indeterminate) && (!leafOnly || leafOnly && child.isLeaf)) checkedNodes.push(child.data);
traverse(child);
});
};
traverse(this);
return checkedNodes;
}
getCheckedKeys(leafOnly = false) {
return this.getCheckedNodes(leafOnly).map((data) => (data || {})[this.key]);
}
getHalfCheckedNodes() {
const nodes = [];
const traverse = function(node) {
(node.root ? node.root.childNodes : node.childNodes).forEach((child) => {
if (child.indeterminate) nodes.push(child.data);
traverse(child);
});
};
traverse(this);
return nodes;
}
getHalfCheckedKeys() {
return this.getHalfCheckedNodes().map((data) => (data || {})[this.key]);
}
_getAllNodes() {
const allNodes = [];
const nodesMap = this.nodesMap;
for (const nodeKey in nodesMap) if (hasOwn(nodesMap, nodeKey)) allNodes.push(nodesMap[nodeKey]);
return allNodes;
}
updateChildren(key, data) {
const node = this.nodesMap[key];
if (!node) return;
const childNodes = node.childNodes;
for (let i = childNodes.length - 1; i >= 0; i--) {
const child = childNodes[i];
this.remove(child.data);
}
for (let i = 0, j = data.length; i < j; i++) {
const child = data[i];
this.append(child, node.data);
}
}
_setCheckedKeys(key, leafOnly = false, checkedKeys) {
const allNodes = this._getAllNodes().sort((a, b) => a.level - b.level);
const cache = Object.create(null);
const keys = Object.keys(checkedKeys);
allNodes.forEach((node) => node.setChecked(false, false));
const cacheCheckedChild = (node) => {
node.childNodes.forEach((child) => {
cache[child.data[key]] = true;
if (child.childNodes?.length) cacheCheckedChild(child);
});
};
for (let i = 0, j = allNodes.length; i < j; i++) {
const node = allNodes[i];
const nodeKey = node.data[key].toString();
if (!keys.includes(nodeKey)) {
if (node.checked && !cache[nodeKey]) node.setChecked(false, false);
continue;
}
if (node.childNodes.length) cacheCheckedChild(node);
if (node.isLeaf || this.checkStrictly) {
node.setChecked(true, false);
continue;
}
node.setChecked(true, true);
if (leafOnly) {
node.setChecked(false, false, true);
const traverse = function(node) {
node.childNodes.forEach((child) => {
if (!child.isLeaf) child.setChecked(false, false, true);
traverse(child);
});
node.reInitChecked();
};
traverse(node);
}
}
}
setCheckedNodes(array, leafOnly = false) {
const key = this.key;
const checkedKeys = {};
array.forEach((item) => {
checkedKeys[(item || {})[key]] = true;
});
this._setCheckedKeys(key, leafOnly, checkedKeys);
}
setCheckedKeys(keys, leafOnly = false) {
this.defaultCheckedKeys = keys;
const key = this.key;
const checkedKeys = {};
keys.forEach((key) => {
checkedKeys[key] = true;
});
this._setCheckedKeys(key, leafOnly, checkedKeys);
}
setDefaultExpandedKeys(keys) {
keys = keys || [];
this.defaultExpandedKeys = keys;
keys.forEach((key) => {
const node = this.getNode(key);
if (node) node.expand(null, this.autoExpandParent);
});
}
setChecked(data, checked, deep) {
const node = this.getNode(data);
if (node) node.setChecked(!!checked, deep);
}
getCurrentNode() {
return this.currentNode;
}
setCurrentNode(currentNode) {
const prevCurrentNode = this.currentNode;
if (prevCurrentNode) prevCurrentNode.isCurrent = false;
this.currentNode = currentNode;
this.currentNode.isCurrent = true;
}
setUserCurrentNode(node, shouldAutoExpandParent = true) {
const key = node[this.key];
const currNode = this.nodesMap[key];
this.setCurrentNode(currNode);
if (shouldAutoExpandParent && this.currentNode && this.currentNode.level > 1) this.currentNode.parent?.expand(null, true);
}
setCurrentNodeKey(key, shouldAutoExpandParent = true) {
this.currentNodeKey = key;
if (isPropAbsent(key)) {
this.currentNode && (this.currentNode.isCurrent = false);
this.currentNode = null;
return;
}
const node = this.getNode(key);
if (node) {
this.setCurrentNode(node);
if (shouldAutoExpandParent && this.currentNode && this.currentNode.level > 1) this.currentNode.parent?.expand(null, true);
}
}
};
//#endregion
//#region ../../packages/components/tree/src/tokens.ts
const ROOT_TREE_INJECTION_KEY = "RootTree";
const NODE_INSTANCE_INJECTION_KEY = "NodeInstance";
const TREE_NODE_MAP_INJECTION_KEY = "TreeNodeMap";
//#endregion
//#region ../../packages/components/tree/src/tree-node-content.vue?vue&type=script&lang.ts
var tree_node_content_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElTreeNodeContent",
props: {
node: {
type: Object,
required: true
},
renderContent: Function
},
setup(props) {
const ns = useNamespace("tree");
const nodeInstance = (0, vue.inject)(NODE_INSTANCE_INJECTION_KEY);
const tree = (0, vue.inject)(ROOT_TREE_INJECTION_KEY);
return () => {
const node = props.node;
const { data, store } = node;
return props.renderContent ? props.renderContent(vue.h, {
_self: nodeInstance,
node,
data,
store
}) : (0, vue.renderSlot)(tree.ctx.slots, "default", {
node,
data
}, () => [(0, vue.h)(ElText, {
tag: "span",
truncated: true,
class: ns.be("node", "label")
}, () => [node.label])]);
};
}
});
//#endregion
//#region ../../packages/components/tree/src/tree-node-content.vue
var tree_node_content_default$1 = tree_node_content_vue_vue_type_script_lang_default;
//#endregion
//#region ../../packages/components/tree/src/model/useNodeExpandEventBroadcast.ts
function useNodeExpandEventBroadcast(props) {
const parentNodeMap = (0, vue.inject)(TREE_NODE_MAP_INJECTION_KEY, null);
let currentNodeMap = {
treeNodeExpand: (node) => {
if (props.node !== node) props.node?.collapse();
},
children: /* @__PURE__ */ new Set()
};
if (parentNodeMap) parentNodeMap.children.add(currentNodeMap);
(0, vue.onBeforeUnmount)(() => {
if (parentNodeMap) parentNodeMap.children.delete(currentNodeMap);
currentNodeMap = null;
});
(0, vue.provide)(TREE_NODE_MAP_INJECTION_KEY, currentNodeMap);
return { broadcastExpanded: (node) => {
if (!props.accordion) return;
for (const childNode of currentNodeMap.children) childNode.treeNodeExpand(node);
} };
}
//#endregion
//#region ../../packages/components/tree/src/model/useDragNode.ts
const dragEventsKey = Symbol("dragEvents");
function useDragNodeHandler({ props, ctx, el$, dropIndicator$, store }) {
const ns = useNamespace("tree");
const dragState = (0, vue.ref)({
showDropIndicator: false,
draggingNode: null,
dropNode: null,
allowDrop: true,
dropType: null
});
const treeNodeDragStart = ({ event, treeNode }) => {
if (!event.dataTransfer) return;
if (isFunction$1(props.allowDrag) && !props.allowDrag(treeNode.node)) {
event.preventDefault();
return false;
}
event.dataTransfer.effectAllowed = "move";
try {
event.dataTransfer.setData("text/plain", "");
} catch {}
dragState.value.draggingNode = treeNode;
ctx.emit("node-drag-start", treeNode.node, event);
};
const treeNodeDragOver = ({ event, treeNode }) => {
if (!event.dataTransfer) return;
const dropNode = treeNode;
const oldDropNode = dragState.value.dropNode;
if (oldDropNode && oldDropNode.node.id !== dropNode.node.id) removeClass(oldDropNode.$el, ns.is("drop-inner"));
const draggingNode = dragState.value.draggingNode;
if (!draggingNode || !dropNode) return;
let dropPrev = true;
let dropInner = true;
let dropNext = true;
let userAllowDropInner = true;
if (isFunction$1(props.allowDrop)) {
dropPrev = props.allowDrop(draggingNode.node, dropNode.node, "prev");
userAllowDropInner = dropInner = props.allowDrop(draggingNode.node, dropNode.node, "inner");
dropNext = props.allowDrop(draggingNode.node, dropNode.node, "next");
}
event.dataTransfer.dropEffect = dropInner || dropPrev || dropNext ? "move" : "none";
if ((dropPrev || dropInner || dropNext) && oldDropNode?.node.id !== dropNode.node.id) {
if (oldDropNode) ctx.emit("node-drag-leave", draggingNode.node, oldDropNode.node, event);
ctx.emit("node-drag-enter", draggingNode.node, dropNode.node, event);
}
if (dropPrev || dropInner || dropNext) dragState.value.dropNode = dropNode;
else dragState.value.dropNode = null;
if (dropNode.node.nextSibling === draggingNode.node) dropNext = false;
if (dropNode.node.previousSibling === draggingNode.node) dropPrev = false;
if (dropNode.node.contains(draggingNode.node, false)) dropInner = false;
if (draggingNode.node === dropNode.node || draggingNode.node.contains(dropNode.node)) {
dropPrev = false;
dropInner = false;
dropNext = false;
}
const dropEl = dropNode.$el;
const targetPosition = dropEl.querySelector(`.${ns.be("node", "content")}`).getBoundingClientRect();
const treePosition = el$.value.getBoundingClientRect();
const treeScrollTop = el$.value.scrollTop;
let dropType;
const prevPercent = dropPrev ? dropInner ? .25 : dropNext ? .45 : 1 : Number.NEGATIVE_INFINITY;
const nextPercent = dropNext ? dropInner ? .75 : dropPrev ? .55 : 0 : Number.POSITIVE_INFINITY;
let indicatorTop = -9999;
const distance = event.clientY - targetPosition.top;
if (distance < targetPosition.height * prevPercent) dropType = "before";
else if (distance > targetPosition.height * nextPercent) dropType = "after";
else if (dropInner) dropType = "inner";
else dropType = "none";
const iconPosition = dropEl.querySelector(`.${ns.be("node", "expand-icon")}`).getBoundingClientRect();
const dropIndicator = dropIndicator$.value;
if (dropType === "before") indicatorTop = iconPosition.top - treePosition.top + treeScrollTop;
else if (dropType === "after") indicatorTop = iconPosition.bottom - treePosition.top + treeScrollTop;
dropIndicator.style.top = `${indicatorTop}px`;
dropIndicator.style.left = `${iconPosition.right - treePosition.left}px`;
if (dropType === "inner") addClass(dropEl, ns.is("drop-inner"));
else removeClass(dropEl, ns.is("drop-inner"));
dragState.value.showDropIndicator = dropType === "before" || dropType === "after";
dragState.value.allowDrop = dragState.value.showDropIndicator || userAllowDropInner;
dragState.value.dropType = dropType;
ctx.emit("node-drag-over", draggingNode.node, dropNode.node, event);
};
const treeNodeDragEnd = (event) => {
const { draggingNode, dropType, dropNode } = dragState.value;
event.preventDefault();
if (event.dataTransfer) event.dataTransfer.dropEffect = "move";
if (draggingNode?.node.data && dropNode) {
const draggingNodeCopy = { data: draggingNode.node.data };
if (dropType !== "none") draggingNode.node.remove();
if (dropType === "before") dropNode.node.parent?.insertBefore(draggingNodeCopy, dropNode.node);
else if (dropType === "after") dropNode.node.parent?.insertAfter(draggingNodeCopy, dropNode.node);
else if (dropType === "inner") dropNode.node.insertChild(draggingNodeCopy);
if (dropType !== "none") {
store.value.registerNode(draggingNodeCopy);
if (store.value.key) draggingNode.node.eachNode((node) => {
store.value.nodesMap[node.data[store.value.key]]?.setChecked(node.checked, !store.value.checkStrictly);
});
}
removeClass(dropNode.$el, ns.is("drop-inner"));
ctx.emit("node-drag-end", draggingNode.node, dropNode.node, dropType, event);
if (dropType !== "none") ctx.emit("node-drop", draggingNode.node, dropNode.node, dropType, event);
}
if (draggingNode && !dropNode) ctx.emit("node-drag-end", draggingNode.node, null, dropType, event);
dragState.value.showDropIndicator = false;
dragState.value.draggingNode = null;
dragState.value.dropNode = null;
dragState.value.allowDrop = true;
};
(0, vue.provide)(dragEventsKey, {
treeNodeDragStart,
treeNodeDragOver,
treeNodeDragEnd
});
return { dragState };
}
//#endregion
//#region ../../packages/components/tree/src/tree-node.vue?vue&type=script&lang.ts
var tree_node_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElTreeNode",
components: {
ElCollapseTransition,
ElCheckbox,
NodeContent: tree_node_content_default$1,
ElIcon,
Loading: loading_default
},
props: {
node: {
type: Node$1,
default: () => ({})
},
props: {
type: Object,
default: () => ({})
},
accordion: Boolean,
renderContent: Function,
renderAfterExpand: Boolean,
showCheckbox: Boolean
},
emits: ["node-expand"],
setup(props, ctx) {
const ns = useNamespace("tree");
const { broadcastExpanded } = useNodeExpandEventBroadcast(props);
const tree = (0, vue.inject)(ROOT_TREE_INJECTION_KEY);
const expanded = (0, vue.ref)(false);
const childNodeRendered = (0, vue.ref)(false);
const oldChecked = (0, vue.ref)();
const oldIndeterminate = (0, vue.ref)();
const node$ = (0, vue.ref)();
const dragEvents = (0, vue.inject)(dragEventsKey);
const instance = (0, vue.getCurrentInstance)();
(0, vue.provide)(NODE_INSTANCE_INJECTION_KEY, instance);
if (!tree) /* @__PURE__ */ debugWarn("Tree", "Can not find node's tree.");
if (props.node.expanded) {
expanded.value = true;
childNodeRendered.value = true;
}
const childrenKey = tree.props.props["children"] || "children";
(0, vue.watch)(() => {
const children = props.node.data?.[childrenKey];
return children && [...children];
}, () => {
props.node.updateChildren();
});
(0, vue.watch)(() => props.node.indeterminate, (val) => {
handleSelectChange(props.node.checked, val);
});
(0, vue.watch)(() => props.node.checked, (val) => {
handleSelectChange(val, props.node.indeterminate);
});
(0, vue.watch)(() => props.node.childNodes.length, () => props.node.reInitChecked());
(0, vue.watch)(() => props.node.expanded, (val) => {
(0, vue.nextTick)(() => expanded.value = val);
if (val) childNodeRendered.value = true;
});
const getNodeKey$2 = (node) => {
return tree.props.nodeKey ? getNodeKey(tree.props.nodeKey, node.data) : node.id;
};
const getNodeClass = (node) => {
const nodeClassFunc = props.props.class;
if (!nodeClassFunc) return {};
let className;
if (isFunction$1(nodeClassFunc)) {
const { data } = node;
className = nodeClassFunc(data, node);
} else className = nodeClassFunc;
if (isString(className)) return { [className]: true };
else return className;
};
const handleSelectChange = (checked, indeterminate) => {
if (oldChecked.value !== checked || oldIndeterminate.value !== indeterminate) tree.ctx.emit("check-change", props.node.data, checked, indeterminate);
oldChecked.value = checked;
oldIndeterminate.value = indeterminate;
};
const handleClick = (e) => {
handleCurrentChange(tree.store, tree.ctx.emit, () => {
if (tree?.props?.nodeKey) {
const curNodeKey = getNodeKey$2(props.node);
tree.store.value.setCurrentNodeKey(curNodeKey);
} else tree.store.value.setCurrentNode(props.node);
});
tree.currentNode.value = props.node;
if (tree.props.expandOnClickNode) handleExpandIconClick();
if ((tree.props.checkOnClickNode || props.node.isLeaf && tree.props.checkOnClickLeaf && props.showCheckbox) && !props.node.disabled) handleCheckChange(!props.node.checked);
tree.ctx.emit("node-click", props.node.data, props.node, instance, e);
};
const handleContextMenu = (event) => {
if (tree.instance.vnode.props?.["onNodeContextmenu"]) {
event.stopPropagation();
event.preventDefault();
}
tree.ctx.emit("node-contextmenu", event, props.node.data, props.node, instance);
};
const handleExpandIconClick = () => {
if (props.node.isLeaf) return;
if (expanded.value) {
tree.ctx.emit("node-collapse", props.node.data, props.node, instance);
props.node.collapse();
} else props.node.expand(() => {
ctx.emit("node-expand", props.node.data, props.node, instance);
});
};
const handleCheckChange = (value) => {
const checkStrictly = tree?.props.checkStrictly;
const childNodes = props.node.childNodes;
if (!checkStrictly && childNodes.length) value = childNodes.some((node) => !node.isEffectivelyChecked);
props.node.setChecked(value, !checkStrictly);
(0, vue.nextTick)(() => {
const store = tree.store.value;
tree.ctx.emit("check", props.node.data, {
checkedNodes: store.getCheckedNodes(),
checkedKeys: store.getCheckedKeys(),
halfCheckedNodes: store.getHalfCheckedNodes(),
halfCheckedKeys: store.getHalfCheckedKeys()
});
});
};
const handleChildNodeExpand = (nodeData, node, instance) => {
broadcastExpanded(node);
tree.ctx.emit("node-expand", nodeData, node, instance);
};
const handleDragStart = (event) => {
if (!tree.props.draggable) return;
dragEvents.treeNodeDragStart({
event,
treeNode: props
});
};
const handleDragOver = (event) => {
event.preventDefault();
if (!tree.props.draggable) return;
dragEvents.treeNodeDragOver({
event,
treeNode: {
$el: node$.value,
node: props.node
}
});
};
const handleDrop = (event) => {
event.preventDefault();
};
const handleDragEnd = (event) => {
if (!tree.props.draggable) return;
dragEvents.treeNodeDragEnd(event);
};
return {
ns,
node$,
tree,
expanded,
childNodeRendered,
oldChecked,
oldIndeterminate,
getNodeKey: getNodeKey$2,
getNodeClass,
handleSelectChange,
handleClick,
handleContextMenu,
handleExpandIconClick,
handleCheckChange,
handleChildNodeExpand,
handleDragStart,
handleDragOver,
handleDrop,
handleDragEnd,
CaretRight: caret_right_default
};
}
});
//#endregion
//#region ../../packages/components/tree/src/tree-node.vue
const _hoisted_1$12 = [
"aria-expanded",
"aria-disabled",
"aria-checked",
"draggable",
"data-key"
];
const _hoisted_2$7 = ["aria-expanded"];
function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
const _component_el_icon = (0, vue.resolveComponent)("el-icon");
const _component_el_checkbox = (0, vue.resolveComponent)("el-checkbox");
const _component_loading = (0, vue.resolveComponent)("loading");
const _component_node_content = (0, vue.resolveComponent)("node-content");
const _component_el_tree_node = (0, vue.resolveComponent)("el-tree-node");
const _component_el_collapse_transition = (0, vue.resolveComponent)("el-collapse-transition");
return (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref: "node$",
class: (0, vue.normalizeClass)([
_ctx.ns.b("node"),
_ctx.ns.is("expanded", _ctx.expanded),
_ctx.ns.is("current", _ctx.node.isCurrent),
_ctx.ns.is("hidden", !_ctx.node.visible),
_ctx.ns.is("focusable", !_ctx.node.disabled),
_ctx.ns.is("checked", !_ctx.node.disabled && _ctx.node.checked),
_ctx.getNodeClass(_ctx.node)
]),
role: "treeitem",
tabindex: "-1",
"aria-expanded": _ctx.expanded,
"aria-disabled": _ctx.node.disabled,
"aria-checked": _ctx.node.checked,
draggable: _ctx.tree.props.draggable,
"data-key": _ctx.getNodeKey(_ctx.node),
onClick: _cache[2] || (_cache[2] = (0, vue.withModifiers)((...args) => _ctx.handleClick && _ctx.handleClick(...args), ["stop"])),
onContextmenu: _cache[3] || (_cache[3] = (...args) => _ctx.handleContextMenu && _ctx.handleContextMenu(...args)),
onDragstart: _cache[4] || (_cache[4] = (0, vue.withModifiers)((...args) => _ctx.handleDragStart && _ctx.handleDragStart(...args), ["stop"])),
onDragover: _cache[5] || (_cache[5] = (0, vue.withModifiers)((...args) => _ctx.handleDragOver && _ctx.handleDragOver(...args), ["stop"])),
onDragend: _cache[6] || (_cache[6] = (0, vue.withModifiers)((...args) => _ctx.handleDragEnd && _ctx.handleDragEnd(...args), ["stop"])),
onDrop: _cache[7] || (_cache[7] = (0, vue.withModifiers)((...args) => _ctx.handleDrop && _ctx.handleDrop(...args), ["stop"]))
}, [(0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)(_ctx.ns.be("node", "content")),
style: (0, vue.normalizeStyle)({ paddingLeft: (_ctx.node.level - 1) * _ctx.tree.props.indent + "px" })
}, [
_ctx.tree.props.icon || _ctx.CaretRight ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_icon, {
key: 0,
class: (0, vue.normalizeClass)([
_ctx.ns.be("node", "expand-icon"),
_ctx.ns.is("leaf", _ctx.node.isLeaf),
{ expanded: !_ctx.node.isLeaf && _ctx.expanded }
]),
onClick: (0, vue.withModifiers)(_ctx.handleExpandIconClick, ["stop"])
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(_ctx.tree.props.icon || _ctx.CaretRight)))]),
_: 1
}, 8, ["class", "onClick"])) : (0, vue.createCommentVNode)("v-if", true),
_ctx.showCheckbox ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_checkbox, {
key: 1,
"model-value": _ctx.node.checked,
indeterminate: _ctx.node.indeterminate,
disabled: !!_ctx.node.disabled,
onClick: _cache[0] || (_cache[0] = (0, vue.withModifiers)(() => {}, ["stop"])),
onChange: _ctx.handleCheckChange
}, null, 8, [
"model-value",
"indeterminate",
"disabled",
"onChange"
])) : (0, vue.createCommentVNode)("v-if", true),
_ctx.node.loading ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_icon, {
key: 2,
class: (0, vue.normalizeClass)([_ctx.ns.be("node", "loading-icon"), _ctx.ns.is("loading")])
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)(_component_loading)]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createVNode)(_component_node_content, {
node: _ctx.node,
"render-content": _ctx.renderContent
}, null, 8, ["node", "render-content"])
], 6), (0, vue.createVNode)(_component_el_collapse_transition, null, {
default: (0, vue.withCtx)(() => [!_ctx.renderAfterExpand || _ctx.childNodeRendered ? (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)(_ctx.ns.be("node", "children")),
role: "group",
"aria-expanded": _ctx.expanded,
onClick: _cache[1] || (_cache[1] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(_ctx.node.childNodes, (child) => {
return (0, vue.openBlock)(), (0, vue.createBlock)(_component_el_tree_node, {
key: _ctx.getNodeKey(child),
"render-content": _ctx.renderContent,
"render-after-expand": _ctx.renderAfterExpand,
"show-checkbox": _ctx.showCheckbox,
node: child,
accordion: _ctx.accordion,
props: _ctx.props,
onNodeExpand: _ctx.handleChildNodeExpand
}, null, 8, [
"render-content",
"render-after-expand",
"show-checkbox",
"node",
"accordion",
"props",
"onNodeExpand"
]);
}), 128))], 10, _hoisted_2$7)), [[vue.vShow, _ctx.expanded]]) : (0, vue.createCommentVNode)("v-if", true)]),
_: 1
})], 42, _hoisted_1$12)), [[vue.vShow, _ctx.node.visible]]);
}
var tree_node_default$1 = /* @__PURE__ */ _plugin_vue_export_helper_default(tree_node_vue_vue_type_script_lang_default, [["render", _sfc_render$2]]);
//#endregion
//#region ../../packages/components/tree/src/model/useKeydown.ts
function useKeydown({ el$ }, store) {
const ns = useNamespace("tree");
(0, vue.onMounted)(() => {
initTabIndex();
});
(0, vue.onUpdated)(() => {
el$.value?.querySelectorAll("input[type=checkbox]").forEach((checkbox) => {
checkbox.setAttribute("tabindex", "-1");
});
});
function canNodeFocus(treeItems, nextIndex) {
const currentNode = store.value.getNode(treeItems[nextIndex].dataset.key);
return currentNode.canFocus && currentNode.visible && (currentNode.parent?.expanded || currentNode.parent?.level === 0);
}
const handleKeydown = (ev) => {
const currentItem = ev.target;
if (!currentItem.className.includes(ns.b("node"))) return;
const code = getEventCode(ev);
const treeItems = Array.from(el$.value.querySelectorAll(`.${ns.is("focusable")}[role=treeitem]`));
const currentIndex = treeItems.indexOf(currentItem);
let nextIndex;
if ([EVENT_CODE.up, EVENT_CODE.down].includes(code)) {
ev.preventDefault();
if (code === EVENT_CODE.up) {
nextIndex = currentIndex === -1 ? 0 : currentIndex !== 0 ? currentIndex - 1 : treeItems.length - 1;
const startIndex = nextIndex;
while (true) {
if (canNodeFocus(treeItems, nextIndex)) break;
nextIndex--;
if (nextIndex === startIndex) {
nextIndex = -1;
break;
}
if (nextIndex < 0) nextIndex = treeItems.length - 1;
}
} else {
nextIndex = currentIndex === -1 ? 0 : currentIndex < treeItems.length - 1 ? currentIndex + 1 : 0;
const startIndex = nextIndex;
while (true) {
if (canNodeFocus(treeItems, nextIndex)) break;
nextIndex++;
if (nextIndex === startIndex) {
nextIndex = -1;
break;
}
if (nextIndex >= treeItems.length) nextIndex = 0;
}
}
nextIndex !== -1 && treeItems[nextIndex].focus();
}
if ([EVENT_CODE.left, EVENT_CODE.right].includes(code)) {
ev.preventDefault();
currentItem.click();
}
const hasInput = currentItem.querySelector("[type=\"checkbox\"]");
if ([
EVENT_CODE.enter,
EVENT_CODE.numpadEnter,
EVENT_CODE.space
].includes(code) && hasInput) {
ev.preventDefault();
hasInput.click();
}
};
useEventListener(el$, "keydown", handleKeydown);
const initTabIndex = () => {
if (!el$.value) return;
const treeItems = Array.from(el$.value.querySelectorAll(`.${ns.is("focusable")}[role=treeitem]`));
Array.from(el$.value.querySelectorAll("input[type=checkbox]")).forEach((checkbox) => {
checkbox.setAttribute("tabindex", "-1");
});
const checkedItem = el$.value.querySelectorAll(`.${ns.is("checked")}[role=treeitem]`);
if (checkedItem.length) {
checkedItem[0].setAttribute("tabindex", "0");
return;
}
treeItems[0]?.setAttribute("tabindex", "0");
};
}
//#endregion
//#region ../../packages/components/tree/src/tree.ts
const treeProps = buildProps({
data: {
type: definePropType(Array),
default: () => []
},
emptyText: { type: String },
renderAfterExpand: {
type: Boolean,
default: true
},
nodeKey: String,
checkStrictly: Boolean,
defaultExpandAll: Boolean,
expandOnClickNode: {
type: Boolean,
default: true
},
checkOnClickNode: Boolean,
checkOnClickLeaf: {
type: Boolean,
default: true
},
checkDescendants: Boolean,
autoExpandParent: {
type: Boolean,
default: true
},
defaultCheckedKeys: { type: Array },
defaultExpandedKeys: { type: Array },
currentNodeKey: { type: [String, Number] },
renderContent: { type: definePropType(Function) },
showCheckbox: Boolean,
draggable: Boolean,
allowDrag: { type: definePropType(Function) },
allowDrop: { type: definePropType(Function) },
props: {
type: Object,
default: () => ({
children: "children",
label: "label",
disabled: "disabled"
})
},
lazy: Boolean,
highlightCurrent: Boolean,
load: { type: Function },
filterNodeMethod: { type: Function },
accordion: Boolean,
indent: {
type: Number,
default: 18
},
icon: { type: iconPropType }
});
const treeEmits = {
"check-change": (data, checked, indeterminate) => data && isBoolean(checked) && isBoolean(indeterminate),
"current-change": (data, node) => true,
"node-click": (data, node, nodeInstance, evt) => data && node && evt instanceof Event,
"node-contextmenu": (evt, data, node, nodeInstance) => evt instanceof Event && data && node,
"node-collapse": (data, node, nodeInstance) => data && node,
"node-expand": (data, node, nodeInstance) => data && node,
check: (data, checkedInfo) => data && checkedInfo,
"node-drag-start": (node, evt) => node && evt,
"node-drag-end": (draggingNode, dropNode, dropType, evt) => draggingNode && evt,
"node-drop": (draggingNode, dropNode, dropType, evt) => draggingNode && dropNode && evt,
"node-drag-leave": (draggingNode, oldDropNode, evt) => draggingNode && oldDropNode && evt,
"node-drag-enter": (draggingNode, dropNode, evt) => draggingNode && dropNode && evt,
"node-drag-over": (draggingNode, dropNode, evt) => draggingNode && dropNode && evt
};
//#endregion
//#region ../../packages/components/tree/src/tree.vue?vue&type=script&lang.ts
var tree_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElTree",
components: { ElTreeNode: tree_node_default$1 },
props: treeProps,
emits: treeEmits,
setup(props, ctx) {
const { t } = useLocale();
const ns = useNamespace("tree");
const store = (0, vue.ref)(new TreeStore({
key: props.nodeKey,
data: props.data,
lazy: props.lazy,
props: props.props,
load: props.load,
currentNodeKey: props.currentNodeKey,
checkStrictly: props.checkStrictly,
checkDescendants: props.checkDescendants,
defaultCheckedKeys: props.defaultCheckedKeys,
defaultExpandedKeys: props.defaultExpandedKeys,
autoExpandParent: props.autoExpandParent,
defaultExpandAll: props.defaultExpandAll,
filterNodeMethod: props.filterNodeMethod
}));
store.value.initialize();
const root = (0, vue.ref)(store.value.root);
const currentNode = (0, vue.ref)(null);
const el$ = (0, vue.ref)(null);
const dropIndicator$ = (0, vue.ref)(null);
const { broadcastExpanded } = useNodeExpandEventBroadcast(props);
const { dragState } = useDragNodeHandler({
props,
ctx,
el$,
dropIndicator$,
store
});
useKeydown({ el$ }, store);
const instance = (0, vue.getCurrentInstance)();
const isSelectTree = (0, vue.computed)(() => {
let parent = instance?.parent;
while (parent) {
if (parent.type.name === "ElTreeSelect") return true;
parent = parent.parent;
}
return false;
});
const isEmpty = (0, vue.computed)(() => {
const { childNodes } = root.value;
return (!childNodes || childNodes.length === 0 || childNodes.every(({ visible }) => !visible)) && !isSelectTree.value;
});
(0, vue.watch)(() => props.currentNodeKey, (newVal) => {
store.value.setCurrentNodeKey(newVal ?? null);
});
(0, vue.watch)(() => props.defaultCheckedKeys, (newVal, oldVal) => {
if (isEqual$1(newVal, oldVal)) return;
store.value.setDefaultCheckedKey(newVal ?? []);
});
(0, vue.watch)(() => props.defaultExpandedKeys, (newVal) => {
store.value.setDefaultExpandedKeys(newVal ?? []);
});
(0, vue.watch)(() => props.data, (newVal) => {
store.value.setData(newVal);
}, { deep: true });
(0, vue.watch)(() => props.checkStrictly, (newVal) => {
store.value.checkStrictly = newVal;
});
const filter = (value) => {
if (!props.filterNodeMethod) throw new Error("[Tree] filterNodeMethod is required when filter");
store.value.filter(value);
};
const getNodeKey$1 = (node) => {
return props.nodeKey ? getNodeKey(props.nodeKey, node.data) : node.id;
};
const requireNodeKey = (methodName) => {
if (!props.nodeKey) throw new Error(`[Tree] nodeKey is required in ${methodName}`);
};
const getNodePath = (data) => {
requireNodeKey("getNodePath");
const node = store.value.getNode(data);
if (!node) return [];
const path = [node.data];
let parent = node.parent;
while (parent && parent !== root.value) {
path.push(parent.data);
parent = parent.parent;
}
return path.reverse();
};
const getCheckedNodes = (leafOnly, includeHalfChecked) => {
return store.value.getCheckedNodes(leafOnly, includeHalfChecked);
};
const getCheckedKeys = (leafOnly) => {
return store.value.getCheckedKeys(leafOnly);
};
const getCurrentNode = () => {
const currentNode = store.value.getCurrentNode();
return currentNode ? currentNode.data : null;
};
const getCurrentKey = () => {
requireNodeKey("getCurrentKey");
const currentNode = getCurrentNode();
return currentNode ? currentNode[props.nodeKey] : null;
};
const setCheckedNodes = (nodes, leafOnly) => {
requireNodeKey("setCheckedNodes");
store.value.setCheckedNodes(nodes, leafOnly);
};
const setCheckedKeys = (keys, leafOnly) => {
requireNodeKey("setCheckedKeys");
store.value.setCheckedKeys(keys, leafOnly);
};
const setChecked = (data, checked, deep) => {
store.value.setChecked(data, checked, deep);
};
const getHalfCheckedNodes = () => {
return store.value.getHalfCheckedNodes();
};
const getHalfCheckedKeys = () => {
return store.value.getHalfCheckedKeys();
};
const setCurrentNode = (node, shouldAutoExpandParent = true) => {
requireNodeKey("setCurrentNode");
handleCurrentChange(store, ctx.emit, () => {
broadcastExpanded(node);
store.value.setUserCurrentNode(node, shouldAutoExpandParent);
});
};
const setCurrentKey = (key = null, shouldAutoExpandParent = true) => {
requireNodeKey("setCurrentKey");
handleCurrentChange(store, ctx.emit, () => {
broadcastExpanded();
store.value.setCurrentNodeKey(key, shouldAutoExpandParent);
});
};
const getNode = (data) => {
return store.value.getNode(data);
};
const remove = (data) => {
store.value.remove(data);
};
const append = (data, parentNode) => {
store.value.append(data, parentNode);
};
const insertBefore = (data, refNode) => {
store.value.insertBefore(data, refNode);
};
const insertAfter = (data, refNode) => {
store.value.insertAfter(data, refNode);
};
const handleNodeExpand = (nodeData, node, instance) => {
broadcastExpanded(node);
ctx.emit("node-expand", nodeData, node, instance);
};
const updateKeyChildren = (key, data) => {
requireNodeKey("updateKeyChildren");
store.value.updateChildren(key, data);
};
(0, vue.provide)(ROOT_TREE_INJECTION_KEY, {
ctx,
props,
store,
root,
currentNode,
instance
});
(0, vue.provide)(formItemContextKey, void 0);
return {
ns,
store,
root,
currentNode,
dragState,
el$,
dropIndicator$,
isEmpty,
filter,
getNodeKey: getNodeKey$1,
getNodePath,
getCheckedNodes,
getCheckedKeys,
getCurrentNode,
getCurrentKey,
setCheckedNodes,
setCheckedKeys,
setChecked,
getHalfCheckedNodes,
getHalfCheckedKeys,
setCurrentNode,
setCurrentKey,
t,
getNode,
remove,
append,
insertBefore,
insertAfter,
handleNodeExpand,
updateKeyChildren
};
}
});
//#endregion
//#region ../../packages/components/tree/src/tree.vue
function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
const _component_el_tree_node = (0, vue.resolveComponent)("el-tree-node");
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref: "el$",
class: (0, vue.normalizeClass)([
_ctx.ns.b(),
_ctx.ns.is("dragging", !!_ctx.dragState.draggingNode),
_ctx.ns.is("drop-not-allow", !_ctx.dragState.allowDrop),
_ctx.ns.is("drop-inner", _ctx.dragState.dropType === "inner"),
{ [_ctx.ns.m("highlight-current")]: _ctx.highlightCurrent }
]),
role: "tree"
}, [
((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(_ctx.root.childNodes, (child) => {
return (0, vue.openBlock)(), (0, vue.createBlock)(_component_el_tree_node, {
key: _ctx.getNodeKey(child),
node: child,
props: _ctx.props,
accordion: _ctx.accordion,
"render-after-expand": _ctx.renderAfterExpand,
"show-checkbox": _ctx.showCheckbox,
"render-content": _ctx.renderContent,
onNodeExpand: _ctx.handleNodeExpand
}, null, 8, [
"node",
"props",
"accordion",
"render-after-expand",
"show-checkbox",
"render-content",
"onNodeExpand"
]);
}), 128)),
_ctx.isEmpty ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)(_ctx.ns.e("empty-block"))
}, [(0, vue.renderSlot)(_ctx.$slots, "empty", {}, () => [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)(_ctx.ns.e("empty-text")) }, (0, vue.toDisplayString)(_ctx.emptyText ?? _ctx.t("el.tree.emptyText")), 3)])], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.withDirectives)((0, vue.createElementVNode)("div", {
ref: "dropIndicator$",
class: (0, vue.normalizeClass)(_ctx.ns.e("drop-indicator"))
}, null, 2), [[vue.vShow, _ctx.dragState.showDropIndicator]])
], 2);
}
var tree_default$1 = /* @__PURE__ */ _plugin_vue_export_helper_default(tree_vue_vue_type_script_lang_default, [["render", _sfc_render$1]]);
//#endregion
//#region ../../packages/components/tree/index.ts
const ElTree = withInstall(tree_default$1);
//#endregion
//#region ../../packages/components/tree-select/src/select.ts
const useSelect = (props, { attrs, emit }, { select, tree, key }) => {
const ns = useNamespace("tree-select");
(0, vue.watch)(() => props.data, () => {
if (props.filterable) (0, vue.nextTick)(() => {
tree.value?.filter(select.value?.states.inputValue);
});
}, { flush: "post" });
const focusLastNode = (listNode) => {
const lastNode = listNode.at(-1);
if (lastNode.expanded && lastNode.childNodes.at(-1)) focusLastNode([lastNode.childNodes.at(-1)]);
else {
(tree.value.el$?.querySelector(`[data-key="${listNode.at(-1).key}"]`))?.focus({ preventScroll: true });
return;
}
};
(0, vue.onMounted)(() => {
useEventListener(() => select.value?.$el, "keydown", async (evt) => {
const code = getEventCode(evt);
const { dropdownMenuVisible } = select.value;
if ([EVENT_CODE.down, EVENT_CODE.up].includes(code) && dropdownMenuVisible) {
await (0, vue.nextTick)();
setTimeout(() => {
if (EVENT_CODE.up === code) {
const listNode = tree.value.store.root.childNodes;
focusLastNode(listNode);
return;
}
select.value.optionsArray[select.value.states.hoveringIndex].$el?.parentNode?.parentNode?.focus({ preventScroll: true });
});
}
}, { capture: true });
});
return {
...pick((0, vue.toRefs)(props), Object.keys(ElSelect.props)),
...attrs,
class: (0, vue.computed)(() => attrs.class),
style: (0, vue.computed)(() => attrs.style),
"onUpdate:modelValue": (value) => emit(UPDATE_MODEL_EVENT, value),
valueKey: key,
popperClass: (0, vue.computed)(() => {
const classes = [ns.e("popper")];
if (props.popperClass) classes.push(props.popperClass);
return classes.join(" ");
}),
filterMethod: (keyword = "") => {
if (props.filterMethod) props.filterMethod(keyword);
else if (props.remoteMethod) props.remoteMethod(keyword);
else tree.value?.filter(keyword);
}
};
};
//#endregion
//#region ../../packages/components/tree-select/src/tree-select-option.ts
const component = (0, vue.defineComponent)({
extends: ElOption,
setup(props, ctx) {
const result = ElOption.setup(props, ctx);
delete result.selectOptionClick;
const vm = (0, vue.getCurrentInstance)().proxy;
(0, vue.nextTick)(() => {
if (!result.select.states.cachedOptions.get(vm.value)) result.select.onOptionCreate(vm);
});
(0, vue.watch)(() => ctx.attrs.visible, (val) => {
(0, vue.nextTick)(() => {
result.states.visible = val;
});
}, { immediate: true });
return result;
},
methods: { selectOptionClick() {
this.$el.parentElement.click();
} }
});
//#endregion
//#region ../../packages/components/tree-select/src/utils.ts
function isValidValue(val) {
return val || val === 0;
}
function isValidArray(val) {
return isArray$1(val) && val.length;
}
function toValidArray(val) {
return isArray$1(val) ? val : isValidValue(val) ? [val] : [];
}
function treeFind(treeData, findCallback, getChildren, resultCallback, parent) {
for (let i = 0; i < treeData.length; i++) {
const data = treeData[i];
if (findCallback(data, i, treeData, parent)) return resultCallback ? resultCallback(data, i, treeData, parent) : data;
else {
const children = getChildren(data);
if (isValidArray(children)) {
const find = treeFind(children, findCallback, getChildren, resultCallback, data);
if (find) return find;
}
}
}
}
function treeEach(treeData, callback, getChildren, parent) {
for (let i = 0; i < treeData.length; i++) {
const data = treeData[i];
callback(data, i, treeData, parent);
const children = getChildren(data);
if (isValidArray(children)) treeEach(children, callback, getChildren, data);
}
}
//#endregion
//#region ../../packages/components/tree-select/src/tree.ts
const useTree$1 = (props, { attrs, slots, emit }, { select, tree, key }) => {
(0, vue.watch)([() => props.modelValue, tree], () => {
if (props.showCheckbox) (0, vue.nextTick)(() => {
const treeInstance = tree.value;
if (treeInstance && !isEqual$1(treeInstance.getCheckedKeys(), toValidArray(props.modelValue))) treeInstance.setCheckedKeys(toValidArray(props.modelValue));
});
}, {
immediate: true,
deep: true
});
const propsMap = (0, vue.computed)(() => ({
value: key.value,
label: "label",
children: "children",
disabled: "disabled",
isLeaf: "isLeaf",
...props.props
}));
const getNodeValByProp = (prop, data) => {
const propVal = propsMap.value[prop];
if (isFunction$1(propVal)) return propVal(data, tree.value?.getNode(getNodeValByProp("value", data)));
else return data[propVal];
};
const defaultExpandedParentKeys = toValidArray(props.modelValue).map((value) => {
return treeFind(props.data || [], (data) => getNodeValByProp("value", data) === value, (data) => getNodeValByProp("children", data), (data, index, array, parent) => parent && getNodeValByProp("value", parent));
}).filter((item) => isValidValue(item));
const cacheOptions = (0, vue.computed)(() => {
if (!props.renderAfterExpand && !props.lazy) return [];
const options = [];
treeEach(props.data.concat(props.cacheData), (node) => {
const value = getNodeValByProp("value", node);
options.push({
value,
currentLabel: getNodeValByProp("label", node),
isDisabled: getNodeValByProp("disabled", node)
});
}, (data) => getNodeValByProp("children", data));
return options;
});
const getChildCheckedKeys = () => {
return tree.value?.getCheckedKeys().filter((checkedKey) => {
const node = tree.value?.getNode(checkedKey);
return !isNil(node) && isEmpty(node.childNodes);
});
};
const emitChange = (val) => {
if (!isEqual$1(props.modelValue, val)) emit(CHANGE_EVENT, val);
};
function update(val) {
emit(UPDATE_MODEL_EVENT, val);
emitChange(val);
}
return {
...pick((0, vue.toRefs)(props), Object.keys(ElTree.props)),
...attrs,
nodeKey: key,
expandOnClickNode: (0, vue.computed)(() => {
return !props.checkStrictly && props.expandOnClickNode;
}),
defaultExpandedKeys: (0, vue.computed)(() => {
return props.defaultExpandedKeys ? props.defaultExpandedKeys.concat(defaultExpandedParentKeys) : defaultExpandedParentKeys;
}),
renderContent: (h, { node, data, store }) => {
return h(component, {
value: getNodeValByProp("value", data),
label: getNodeValByProp("label", data),
disabled: getNodeValByProp("disabled", data),
visible: node.visible
}, props.renderContent ? () => props.renderContent(h, {
node,
data,
store
}) : slots.default ? () => slots.default({
node,
data,
store
}) : void 0);
},
filterNodeMethod: (value, data, node) => {
if (props.filterNodeMethod) return props.filterNodeMethod(value, data, node);
if (!value) return true;
return new RegExp(escapeStringRegexp(value), "i").test(getNodeValByProp("label", data) || "");
},
onNodeClick: (data, node, e) => {
attrs.onNodeClick?.(data, node, e);
if (props.showCheckbox && props.checkOnClickNode) return;
if (!props.showCheckbox && (props.checkStrictly || node.isLeaf)) {
if (!getNodeValByProp("disabled", data)) {
const option = select.value?.states.options.get(getNodeValByProp("value", data));
select.value?.handleOptionSelect(option);
}
} else if (props.expandOnClickNode) e.proxy.handleExpandIconClick();
},
onCheck: (data, params) => {
if (!props.showCheckbox) return;
const dataValue = getNodeValByProp("value", data);
const dataMap = {};
treeEach([tree.value.store.root], (node) => dataMap[node.key] = node, (node) => node.childNodes);
const uncachedCheckedKeys = params.checkedKeys;
const cachedKeys = props.multiple ? toValidArray(props.modelValue).filter((item) => !(item in dataMap) && !uncachedCheckedKeys.includes(item)) : [];
const checkedKeys = cachedKeys.concat(uncachedCheckedKeys);
if (props.checkStrictly) update(props.multiple ? checkedKeys : checkedKeys.includes(dataValue) ? dataValue : void 0);
else if (props.multiple) {
const childKeys = getChildCheckedKeys();
update(cachedKeys.concat(childKeys));
} else {
const firstLeaf = treeFind([data], (data) => !isValidArray(getNodeValByProp("children", data)) && !getNodeValByProp("disabled", data), (data) => getNodeValByProp("children", data));
const firstLeafKey = firstLeaf ? getNodeValByProp("value", firstLeaf) : void 0;
const hasCheckedChild = isValidValue(props.modelValue) && !!treeFind([data], (data) => getNodeValByProp("value", data) === props.modelValue, (data) => getNodeValByProp("children", data));
update(firstLeafKey === props.modelValue || hasCheckedChild ? void 0 : firstLeafKey);
}
(0, vue.nextTick)(() => {
const checkedKeys = toValidArray(props.modelValue);
tree.value.setCheckedKeys(checkedKeys);
attrs.onCheck?.(data, {
checkedKeys: tree.value.getCheckedKeys(),
checkedNodes: tree.value.getCheckedNodes(),
halfCheckedKeys: tree.value.getHalfCheckedKeys(),
halfCheckedNodes: tree.value.getHalfCheckedNodes()
});
});
select.value?.focus();
},
onNodeExpand: (data, node, e) => {
attrs.onNodeExpand?.(data, node, e);
(0, vue.nextTick)(() => {
if (!props.checkStrictly && props.lazy && props.multiple && node.checked) {
const dataMap = {};
const uncachedCheckedKeys = tree.value.getCheckedKeys();
treeEach([tree.value.store.root], (node) => dataMap[node.key] = node, (node) => node.childNodes);
const cachedKeys = toValidArray(props.modelValue).filter((item) => !(item in dataMap) && !uncachedCheckedKeys.includes(item));
const childKeys = getChildCheckedKeys();
update(cachedKeys.concat(childKeys));
}
});
},
cacheOptions
};
};
//#endregion
//#region ../../packages/components/tree-select/src/cache-options.ts
var cache_options_default = (0, vue.defineComponent)({
props: { data: {
type: Array,
default: () => []
} },
setup(props) {
const select = (0, vue.inject)(selectKey);
(0, vue.watch)(() => props.data, () => {
props.data.forEach((item) => {
if (!select.states.cachedOptions.has(item.value)) select.states.cachedOptions.set(item.value, item);
});
const inputs = select.selectRef?.querySelectorAll("input") || [];
if (isClient && !Array.from(inputs).includes(document.activeElement)) select.setSelected();
}, {
flush: "post",
immediate: true
});
return () => void 0;
}
});
//#endregion
//#region ../../packages/components/tree-select/src/tree-select.vue?vue&type=script&lang.ts
var tree_select_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElTreeSelect",
inheritAttrs: false,
props: {
...selectProps,
...treeProps,
cacheData: {
type: Array,
default: () => []
}
},
setup(props, context) {
const { slots, expose, emit, attrs } = context;
const childAttrs = {
...attrs,
onChange: void 0
};
const select = (0, vue.ref)();
const tree = (0, vue.ref)();
const key = (0, vue.computed)(() => props.nodeKey || props.valueKey || "value");
const selectProps = useSelect(props, {
attrs,
emit
}, {
select,
tree,
key
});
const { cacheOptions, ...treeProps } = useTree$1(props, {
attrs: childAttrs,
slots,
emit
}, {
select,
tree,
key
});
const methods = (0, vue.reactive)({});
expose(methods);
(0, vue.onMounted)(() => {
Object.assign(methods, {
...pick(tree.value, [
"filter",
"updateKeyChildren",
"getCheckedNodes",
"setCheckedNodes",
"getCheckedKeys",
"setCheckedKeys",
"setChecked",
"getHalfCheckedNodes",
"getHalfCheckedKeys",
"getCurrentKey",
"getCurrentNode",
"setCurrentKey",
"setCurrentNode",
"getNode",
"remove",
"append",
"insertBefore",
"insertAfter"
]),
...pick(select.value, [
"focus",
"blur",
"selectedLabel"
]),
treeRef: tree.value,
selectRef: select.value
});
});
return () => (0, vue.h)(
ElSelect,
/**
* 1. The `props` is processed into `Refs`, but `v-bind` and
* render function props cannot read `Refs`, so use `reactive`
* unwrap the `Refs` and keep reactive.
* 2. The keyword `ref` requires `Ref`, but `reactive` broke it,
* so use function.
*/
(0, vue.reactive)({
...selectProps,
ref: (ref) => select.value = ref
}),
{
...slots,
default: () => [(0, vue.h)(cache_options_default, { data: cacheOptions.value }), (0, vue.h)(ElTree, (0, vue.reactive)({
...treeProps,
ref: (ref) => tree.value = ref
}))]
}
);
}
});
//#endregion
//#region ../../packages/components/tree-select/src/tree-select.vue
var tree_select_default = tree_select_vue_vue_type_script_lang_default;
//#endregion
//#region ../../packages/components/tree-select/index.ts
const ElTreeSelect = withInstall(tree_select_default);
//#endregion
//#region ../../packages/components/tree-v2/src/virtual-tree.ts
const ROOT_TREE_INJECTION_KEY$1 = Symbol();
const EMPTY_NODE = {
key: -1,
level: -1,
data: {}
};
let TreeOptionsEnum = /* @__PURE__ */ function(TreeOptionsEnum) {
TreeOptionsEnum["KEY"] = "id";
TreeOptionsEnum["LABEL"] = "label";
TreeOptionsEnum["CHILDREN"] = "children";
TreeOptionsEnum["DISABLED"] = "disabled";
TreeOptionsEnum["CLASS"] = "";
return TreeOptionsEnum;
}({});
let SetOperationEnum = /* @__PURE__ */ function(SetOperationEnum) {
SetOperationEnum["ADD"] = "add";
SetOperationEnum["DELETE"] = "delete";
return SetOperationEnum;
}({});
const itemSize = {
type: Number,
default: 26
};
/**
* @deprecated Removed after 3.0.0, Use `TreeProps` instead.
*/
const treeProps$1 = buildProps({
data: {
type: definePropType(Array),
default: () => mutable([])
},
emptyText: { type: String },
height: {
type: Number,
default: 200
},
props: {
type: definePropType(Object),
default: () => mutable({
children: TreeOptionsEnum.CHILDREN,
label: TreeOptionsEnum.LABEL,
disabled: TreeOptionsEnum.DISABLED,
value: TreeOptionsEnum.KEY,
class: TreeOptionsEnum.CLASS
})
},
highlightCurrent: Boolean,
showCheckbox: Boolean,
defaultCheckedKeys: {
type: definePropType(Array),
default: () => mutable([])
},
checkStrictly: Boolean,
defaultExpandedKeys: {
type: definePropType(Array),
default: () => mutable([])
},
indent: {
type: Number,
default: 16
},
itemSize,
icon: { type: iconPropType },
expandOnClickNode: {
type: Boolean,
default: true
},
checkOnClickNode: Boolean,
checkOnClickLeaf: {
type: Boolean,
default: true
},
currentNodeKey: { type: definePropType([String, Number]) },
accordion: Boolean,
filterMethod: { type: definePropType(Function) },
perfMode: {
type: Boolean,
default: true
},
scrollbarAlwaysOn: Boolean
});
/**
* @deprecated Removed after 3.0.0, Use `TreeNodeProps` instead.
*/
const treeNodeProps = buildProps({
node: {
type: definePropType(Object),
default: () => mutable(EMPTY_NODE)
},
expanded: Boolean,
checked: Boolean,
indeterminate: Boolean,
showCheckbox: Boolean,
disabled: Boolean,
current: Boolean,
hiddenExpandIcon: Boolean,
itemSize
});
const treeNodeContentProps = buildProps({ node: {
type: definePropType(Object),
required: true
} });
const NODE_CLICK = "node-click";
const NODE_DROP = "node-drop";
const NODE_EXPAND = "node-expand";
const NODE_COLLAPSE = "node-collapse";
const CURRENT_CHANGE = "current-change";
const NODE_CHECK = "check";
const NODE_CHECK_CHANGE = "check-change";
const NODE_CONTEXTMENU = "node-contextmenu";
const treeEmits$1 = {
[NODE_CLICK]: (data, node, e) => data && node && e,
[NODE_DROP]: (data, node, e) => data && node && e,
[NODE_EXPAND]: (data, node) => data && node,
[NODE_COLLAPSE]: (data, node) => data && node,
[CURRENT_CHANGE]: (data, node) => data && node,
[NODE_CHECK]: (data, checkedInfo) => data && checkedInfo,
[NODE_CHECK_CHANGE]: (data, checked) => data && isBoolean(checked),
[NODE_CONTEXTMENU]: (evt, data, node) => evt && data && node
};
const treeNodeEmits = {
click: (node, e) => !!(node && e),
drop: (node, e) => !!(node && e),
toggle: (node) => !!node,
check: (node, checked) => node && isBoolean(checked)
};
//#endregion
//#region ../../packages/components/tree-v2/src/composables/useCheck.ts
function useCheck(props, tree) {
const checkedKeys = (0, vue.ref)(/* @__PURE__ */ new Set());
const indeterminateKeys = (0, vue.ref)(/* @__PURE__ */ new Set());
const { emit } = (0, vue.getCurrentInstance)();
(0, vue.watch)([() => tree.value, () => props.defaultCheckedKeys], () => {
return (0, vue.nextTick)(() => {
_setCheckedKeys(props.defaultCheckedKeys);
});
}, { immediate: true });
const updateCheckedKeys = () => {
if (!tree.value || !props.showCheckbox || props.checkStrictly) return;
const { levelTreeNodeMap, maxLevel } = tree.value;
const checkedKeySet = checkedKeys.value;
const indeterminateKeySet = /* @__PURE__ */ new Set();
for (let level = maxLevel; level >= 1; --level) {
const nodes = levelTreeNodeMap.get(level);
if (!nodes) continue;
nodes.forEach((node) => {
const children = node.children;
let isEffectivelyChecked = !node.isLeaf || node.disabled || checkedKeySet.has(node.key);
if (children) {
let allChecked = true;
let hasChecked = false;
for (const childNode of children) {
const key = childNode.key;
if (!childNode.isEffectivelyChecked) isEffectivelyChecked = false;
if (checkedKeySet.has(key)) hasChecked = true;
else if (indeterminateKeySet.has(key)) {
allChecked = false;
hasChecked = true;
break;
} else allChecked = false;
}
if (allChecked) checkedKeySet.add(node.key);
else if (hasChecked) {
indeterminateKeySet.add(node.key);
checkedKeySet.delete(node.key);
} else {
checkedKeySet.delete(node.key);
indeterminateKeySet.delete(node.key);
}
}
node.isEffectivelyChecked = isEffectivelyChecked;
});
}
indeterminateKeys.value = indeterminateKeySet;
};
const isChecked = (node) => checkedKeys.value.has(node.key);
const isIndeterminate = (node) => indeterminateKeys.value.has(node.key);
const toggleCheckbox = (node, isChecked, nodeClick = true, immediateUpdate = true) => {
const checkedKeySet = checkedKeys.value;
const children = node.children;
if (!props.checkStrictly && nodeClick && children?.length) isChecked = children.some((node) => !node.isEffectivelyChecked);
const toggle = (node, checked) => {
checkedKeySet[checked ? SetOperationEnum.ADD : SetOperationEnum.DELETE](node.key);
const children = node.children;
if (!props.checkStrictly && children) children.forEach((childNode) => {
if (!childNode.disabled || childNode.children) toggle(childNode, checked);
});
};
toggle(node, isChecked);
if (immediateUpdate) updateCheckedKeys();
if (nodeClick) afterNodeCheck(node, isChecked);
};
const afterNodeCheck = (node, checked) => {
const { checkedNodes, checkedKeys } = getChecked();
const { halfCheckedNodes, halfCheckedKeys } = getHalfChecked();
emit(NODE_CHECK, node.data, {
checkedKeys,
checkedNodes,
halfCheckedKeys,
halfCheckedNodes
});
emit(NODE_CHECK_CHANGE, node.data, checked);
};
function getCheckedKeys(leafOnly = false) {
return getChecked(leafOnly).checkedKeys;
}
function getCheckedNodes(leafOnly = false) {
return getChecked(leafOnly).checkedNodes;
}
function getHalfCheckedKeys() {
return getHalfChecked().halfCheckedKeys;
}
function getHalfCheckedNodes() {
return getHalfChecked().halfCheckedNodes;
}
function getChecked(leafOnly = false) {
const checkedNodes = [];
const keys = [];
if (tree?.value && props.showCheckbox) {
const { treeNodeMap } = tree.value;
checkedKeys.value.forEach((key) => {
const node = treeNodeMap.get(key);
if (node && (!leafOnly || leafOnly && node.isLeaf)) {
keys.push(key);
checkedNodes.push(node.data);
}
});
}
return {
checkedKeys: keys,
checkedNodes
};
}
function getHalfChecked() {
const halfCheckedNodes = [];
const halfCheckedKeys = [];
if (tree?.value && props.showCheckbox) {
const { treeNodeMap } = tree.value;
indeterminateKeys.value.forEach((key) => {
const node = treeNodeMap.get(key);
if (node) {
halfCheckedKeys.push(key);
halfCheckedNodes.push(node.data);
}
});
}
return {
halfCheckedNodes,
halfCheckedKeys
};
}
function setCheckedKeys(keys) {
checkedKeys.value.clear();
indeterminateKeys.value.clear();
(0, vue.nextTick)(() => {
_setCheckedKeys(keys);
});
}
function setChecked(key, isChecked) {
if (tree?.value && props.showCheckbox) {
const node = tree.value.treeNodeMap.get(key);
if (node) toggleCheckbox(node, isChecked, false);
}
}
function _setCheckedKeys(keys) {
if (tree?.value) {
const { treeNodeMap } = tree.value;
if (props.showCheckbox && treeNodeMap && keys?.length > 0) {
for (const key of keys) {
const node = treeNodeMap.get(key);
if (node && !isChecked(node)) toggleCheckbox(node, true, false, false);
}
updateCheckedKeys();
}
}
}
return {
updateCheckedKeys,
toggleCheckbox,
isChecked,
isIndeterminate,
getCheckedKeys,
getCheckedNodes,
getHalfCheckedKeys,
getHalfCheckedNodes,
setChecked,
setCheckedKeys
};
}
//#endregion
//#region ../../packages/components/tree-v2/src/composables/useFilter.ts
function useFilter(props, tree) {
const hiddenNodeKeySet = (0, vue.ref)(/* @__PURE__ */ new Set([]));
const hiddenExpandIconKeySet = (0, vue.ref)(/* @__PURE__ */ new Set([]));
const filterable = (0, vue.computed)(() => {
return isFunction$1(props.filterMethod);
});
function doFilter(query) {
if (!filterable.value) return;
const expandKeySet = /* @__PURE__ */ new Set();
const hiddenExpandIconKeys = hiddenExpandIconKeySet.value;
const hiddenKeys = hiddenNodeKeySet.value;
const family = [];
const nodes = tree.value?.treeNodes || [];
const filter = props.filterMethod;
hiddenKeys.clear();
function traverse(nodes) {
nodes.forEach((node) => {
family.push(node);
if (filter?.(query, node.data, node)) family.forEach((member) => {
expandKeySet.add(member.key);
member.expanded = true;
});
else {
node.expanded = false;
if (node.isLeaf) hiddenKeys.add(node.key);
}
const children = node.children;
if (children) traverse(children);
if (!node.isLeaf) {
if (!expandKeySet.has(node.key)) hiddenKeys.add(node.key);
else if (children) {
let allHidden = true;
for (const childNode of children) if (!hiddenKeys.has(childNode.key)) {
allHidden = false;
break;
}
if (allHidden) hiddenExpandIconKeys.add(node.key);
else hiddenExpandIconKeys.delete(node.key);
}
}
family.pop();
});
}
traverse(nodes);
return expandKeySet;
}
function isForceHiddenExpandIcon(node) {
return hiddenExpandIconKeySet.value.has(node.key);
}
return {
hiddenExpandIconKeySet,
hiddenNodeKeySet,
doFilter,
isForceHiddenExpandIcon
};
}
//#endregion
//#region ../../packages/components/tree-v2/src/composables/useTree.ts
function useTree(props, emit) {
const expandedKeySet = (0, vue.ref)(/* @__PURE__ */ new Set());
const currentKey = (0, vue.ref)();
const tree = (0, vue.shallowRef)();
const listRef = (0, vue.ref)();
const { isIndeterminate, isChecked, toggleCheckbox, getCheckedKeys, getCheckedNodes, getHalfCheckedKeys, getHalfCheckedNodes, setChecked, setCheckedKeys } = useCheck(props, tree);
const { doFilter, hiddenNodeKeySet, isForceHiddenExpandIcon } = useFilter(props, tree);
const valueKey = (0, vue.computed)(() => {
return props.props?.value || TreeOptionsEnum.KEY;
});
const childrenKey = (0, vue.computed)(() => {
return props.props?.children || TreeOptionsEnum.CHILDREN;
});
const disabledKey = (0, vue.computed)(() => {
return props.props?.disabled || TreeOptionsEnum.DISABLED;
});
const labelKey = (0, vue.computed)(() => {
return props.props?.label || TreeOptionsEnum.LABEL;
});
const flattenTree = (0, vue.computed)(() => {
const expandedKeys = expandedKeySet.value;
const hiddenKeys = hiddenNodeKeySet.value;
const flattenNodes = [];
const nodes = tree.value?.treeNodes || [];
const stack = [];
for (let i = nodes.length - 1; i >= 0; --i) stack.push(nodes[i]);
while (stack.length) {
const node = stack.pop();
if (hiddenKeys.has(node.key)) continue;
flattenNodes.push(node);
if (node.children && expandedKeys.has(node.key)) for (let i = node.children.length - 1; i >= 0; --i) stack.push(node.children[i]);
}
return flattenNodes;
});
const isNotEmpty = (0, vue.computed)(() => {
return flattenTree.value.length > 0;
});
function createTree(data) {
const treeNodeMap = /* @__PURE__ */ new Map();
const levelTreeNodeMap = /* @__PURE__ */ new Map();
let maxLevel = 1;
function traverse(nodes, level = 1, parent = void 0) {
const siblings = [];
for (const rawNode of nodes) {
const value = getKey(rawNode);
const node = {
level,
key: value,
data: rawNode
};
node.label = getLabel(rawNode);
node.parent = parent;
const children = getChildren(rawNode);
node.disabled = getDisabled(rawNode);
node.isLeaf = !children || children.length === 0;
node.expanded = expandedKeySet.value.has(value);
if (children && children.length) node.children = traverse(children, level + 1, node);
siblings.push(node);
treeNodeMap.set(value, node);
if (!levelTreeNodeMap.has(level)) levelTreeNodeMap.set(level, []);
levelTreeNodeMap.get(level)?.push(node);
}
if (level > maxLevel) maxLevel = level;
return siblings;
}
const treeNodes = traverse(data);
return {
treeNodeMap,
levelTreeNodeMap,
maxLevel,
treeNodes
};
}
function filter(query) {
const keys = doFilter(query);
if (keys) expandedKeySet.value = keys;
}
function getChildren(node) {
return node[childrenKey.value];
}
function getKey(node) {
if (!node) return "";
return node[valueKey.value];
}
function getDisabled(node) {
return node[disabledKey.value];
}
function getLabel(node) {
return node[labelKey.value];
}
function toggleExpand(node) {
if (expandedKeySet.value.has(node.key)) collapseNode(node);
else expandNode(node);
}
function setExpandedKeys(keys) {
const expandedKeys = /* @__PURE__ */ new Set();
const nodeMap = tree.value.treeNodeMap;
expandedKeySet.value.forEach((key) => {
const node = nodeMap.get(key);
if (node) node.expanded = false;
});
keys.forEach((k) => {
let node = nodeMap.get(k);
while (node && !expandedKeys.has(node.key)) {
expandedKeys.add(node.key);
node.expanded = true;
node = node.parent;
}
});
expandedKeySet.value = expandedKeys;
}
function handleNodeClick(node, e) {
emit(NODE_CLICK, node.data, node, e);
handleCurrentChange(node);
if (props.expandOnClickNode) toggleExpand(node);
if (props.showCheckbox && (props.checkOnClickNode || node.isLeaf && props.checkOnClickLeaf) && !node.disabled) toggleCheckbox(node, !isChecked(node), true);
}
function handleNodeDrop(node, e) {
emit(NODE_DROP, node.data, node, e);
}
function handleCurrentChange(node) {
if (!isCurrent(node)) {
currentKey.value = node.key;
emit(CURRENT_CHANGE, node.data, node);
}
}
function handleNodeCheck(node, checked) {
toggleCheckbox(node, checked);
}
function expandNode(node) {
const keySet = expandedKeySet.value;
if (tree.value && props.accordion) {
const { treeNodeMap } = tree.value;
keySet.forEach((key) => {
const treeNode = treeNodeMap.get(key);
if (node && node.level === treeNode?.level) {
keySet.delete(key);
treeNode.expanded = false;
}
});
}
keySet.add(node.key);
const _node = getNode(node.key);
if (_node) {
_node.expanded = true;
emit(NODE_EXPAND, _node.data, _node);
}
}
function collapseNode(node) {
expandedKeySet.value.delete(node.key);
const _node = getNode(node.key);
if (_node) {
_node.expanded = false;
emit(NODE_COLLAPSE, _node.data, _node);
}
}
function isDisabled(node) {
return !!node.disabled;
}
function isCurrent(node) {
const current = currentKey.value;
return current !== void 0 && current === node.key;
}
function getCurrentNode() {
if (!currentKey.value) return void 0;
return tree.value?.treeNodeMap.get(currentKey.value)?.data;
}
function getCurrentKey() {
return currentKey.value;
}
function setCurrentKey(key) {
currentKey.value = key;
}
function setData(data) {
tree.value = createTree(data);
}
function getNode(data) {
const key = isObject$1(data) ? getKey(data) : data;
return tree.value?.treeNodeMap.get(key);
}
function scrollToNode(key, strategy = "auto") {
const node = getNode(key);
if (node && listRef.value) listRef.value.scrollToItem(flattenTree.value.indexOf(node), strategy);
}
function scrollTo(offset) {
listRef.value?.scrollTo(offset);
}
(0, vue.watch)(() => props.currentNodeKey, (key) => {
currentKey.value = key;
}, { immediate: true });
(0, vue.watch)(() => props.defaultExpandedKeys, (keys) => {
setExpandedKeys(keys || []);
});
(0, vue.watch)(() => props.data, (data) => {
setData(data);
setExpandedKeys(props.defaultExpandedKeys || []);
}, { immediate: true });
return {
tree,
flattenTree,
isNotEmpty,
listRef,
getKey,
getChildren,
toggleExpand,
toggleCheckbox,
isChecked,
isIndeterminate,
isDisabled,
isCurrent,
isForceHiddenExpandIcon,
handleNodeClick,
handleNodeDrop,
handleNodeCheck,
getCurrentNode,
getCurrentKey,
setCurrentKey,
getCheckedKeys,
getCheckedNodes,
getHalfCheckedKeys,
getHalfCheckedNodes,
setChecked,
setCheckedKeys,
filter,
setData,
getNode,
expandNode,
collapseNode,
setExpandedKeys,
scrollToNode,
scrollTo
};
}
//#endregion
//#region ../../packages/components/tree-v2/src/tree-node-content.ts
var tree_node_content_default = (0, vue.defineComponent)({
name: "ElTreeNodeContent",
props: treeNodeContentProps,
setup(props) {
const tree = (0, vue.inject)(ROOT_TREE_INJECTION_KEY$1);
const ns = useNamespace("tree");
return () => {
const node = props.node;
const { data } = node;
return tree?.ctx.slots.default ? tree.ctx.slots.default({
node,
data
}) : (0, vue.h)(ElText, {
tag: "span",
truncated: true,
class: ns.be("node", "label")
}, () => [node?.label]);
};
}
});
//#endregion
//#region ../../packages/components/tree-v2/src/tree-node.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$11 = [
"aria-expanded",
"aria-disabled",
"aria-checked",
"data-key"
];
var tree_node_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTreeNode",
__name: "tree-node",
props: treeNodeProps,
emits: treeNodeEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const tree = (0, vue.inject)(ROOT_TREE_INJECTION_KEY$1);
const ns = useNamespace("tree");
const indent = (0, vue.computed)(() => tree?.props.indent ?? 16);
const icon = (0, vue.computed)(() => tree?.props.icon ?? caret_right_default);
const getNodeClass = (node) => {
const nodeClassFunc = tree?.props.props?.class;
if (!nodeClassFunc) return {};
let className;
if (isFunction$1(nodeClassFunc)) {
const { data } = node;
className = nodeClassFunc(data, node);
} else className = nodeClassFunc;
return isString(className) ? { [className]: true } : className;
};
const handleClick = (e) => {
emit("click", props.node, e);
};
const handleDrop = (e) => {
emit("drop", props.node, e);
};
const handleExpandIconClick = () => {
emit("toggle", props.node);
};
const handleCheckChange = (value) => {
emit("check", props.node, value);
};
const handleContextMenu = (event) => {
if (tree?.instance?.vnode?.props?.["onNodeContextmenu"]) {
event.stopPropagation();
event.preventDefault();
}
tree?.ctx.emit(NODE_CONTEXTMENU, event, props.node?.data, props.node);
};
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref: "node$",
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).b("node"),
(0, vue.unref)(ns).is("expanded", __props.expanded),
(0, vue.unref)(ns).is("current", __props.current),
(0, vue.unref)(ns).is("focusable", !__props.disabled),
(0, vue.unref)(ns).is("checked", !__props.disabled && __props.checked),
getNodeClass(__props.node)
]),
role: "treeitem",
tabindex: "-1",
"aria-expanded": __props.expanded,
"aria-disabled": __props.disabled,
"aria-checked": __props.checked,
"data-key": __props.node?.key,
onClick: (0, vue.withModifiers)(handleClick, ["stop"]),
onContextmenu: handleContextMenu,
onDragover: _cache[1] || (_cache[1] = (0, vue.withModifiers)(() => {}, ["prevent"])),
onDragenter: _cache[2] || (_cache[2] = (0, vue.withModifiers)(() => {}, ["prevent"])),
onDrop: (0, vue.withModifiers)(handleDrop, ["stop"])
}, [(0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("node", "content")),
style: (0, vue.normalizeStyle)({
paddingLeft: `${(__props.node.level - 1) * indent.value}px`,
height: __props.itemSize + "px"
})
}, [
icon.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).is("leaf", !!__props.node?.isLeaf),
(0, vue.unref)(ns).is("hidden", __props.hiddenExpandIcon),
{ expanded: !__props.node?.isLeaf && __props.expanded },
(0, vue.unref)(ns).be("node", "expand-icon")
]),
onClick: (0, vue.withModifiers)(handleExpandIconClick, ["stop"])
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(icon.value)))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true),
__props.showCheckbox ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElCheckbox), {
key: 1,
"model-value": __props.checked,
indeterminate: __props.indeterminate,
disabled: __props.disabled,
onChange: handleCheckChange,
onClick: _cache[0] || (_cache[0] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, null, 8, [
"model-value",
"indeterminate",
"disabled"
])) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createVNode)((0, vue.unref)(tree_node_content_default), { node: {
...__props.node,
expanded: __props.expanded
} }, null, 8, ["node"])
], 6)], 42, _hoisted_1$11);
};
}
});
//#endregion
//#region ../../packages/components/tree-v2/src/tree-node.vue
var tree_node_default = tree_node_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/tree-v2/src/tree.vue?vue&type=script&setup=true&lang.ts
var tree_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTreeV2",
__name: "tree",
props: treeProps$1,
emits: treeEmits$1,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const slots = (0, vue.useSlots)();
const treeNodeSize = (0, vue.computed)(() => props.itemSize);
(0, vue.provide)(ROOT_TREE_INJECTION_KEY$1, {
ctx: {
emit,
slots
},
props,
instance: (0, vue.getCurrentInstance)()
});
(0, vue.provide)(formItemContextKey, void 0);
const { t } = useLocale();
const ns = useNamespace("tree");
const { flattenTree, isNotEmpty, listRef, toggleExpand, isIndeterminate, isChecked, isDisabled, isCurrent, isForceHiddenExpandIcon, handleNodeClick, handleNodeDrop, handleNodeCheck, toggleCheckbox, getCurrentNode, getCurrentKey, setCurrentKey, getCheckedKeys, getCheckedNodes, getHalfCheckedKeys, getHalfCheckedNodes, setChecked, setCheckedKeys, filter, setData, getNode, expandNode, collapseNode, setExpandedKeys, scrollToNode, scrollTo } = useTree(props, emit);
__expose({
toggleCheckbox,
getCurrentNode,
getCurrentKey,
setCurrentKey,
getCheckedKeys,
getCheckedNodes,
getHalfCheckedKeys,
getHalfCheckedNodes,
setChecked,
setCheckedKeys,
filter,
setData,
getNode,
expandNode,
collapseNode,
setExpandedKeys,
scrollToNode,
scrollTo
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).b(), { [(0, vue.unref)(ns).m("highlight-current")]: __props.highlightCurrent }]),
role: "tree"
}, [(0, vue.unref)(isNotEmpty) ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(FixedSizeList), {
key: 0,
ref_key: "listRef",
ref: listRef,
"class-name": (0, vue.unref)(ns).b("virtual-list"),
data: (0, vue.unref)(flattenTree),
total: (0, vue.unref)(flattenTree).length,
height: __props.height,
"item-size": treeNodeSize.value,
"perf-mode": __props.perfMode,
"scrollbar-always-on": __props.scrollbarAlwaysOn
}, {
default: (0, vue.withCtx)(({ data, index, style }) => [((0, vue.openBlock)(), (0, vue.createBlock)(tree_node_default, {
key: data[index].key,
style: (0, vue.normalizeStyle)(style),
node: data[index],
expanded: data[index].expanded,
"show-checkbox": __props.showCheckbox,
checked: (0, vue.unref)(isChecked)(data[index]),
indeterminate: (0, vue.unref)(isIndeterminate)(data[index]),
"item-size": treeNodeSize.value,
disabled: (0, vue.unref)(isDisabled)(data[index]),
current: (0, vue.unref)(isCurrent)(data[index]),
"hidden-expand-icon": (0, vue.unref)(isForceHiddenExpandIcon)(data[index]),
onClick: (0, vue.unref)(handleNodeClick),
onToggle: (0, vue.unref)(toggleExpand),
onCheck: (0, vue.unref)(handleNodeCheck),
onDrop: (0, vue.unref)(handleNodeDrop)
}, null, 8, [
"style",
"node",
"expanded",
"show-checkbox",
"checked",
"indeterminate",
"item-size",
"disabled",
"current",
"hidden-expand-icon",
"onClick",
"onToggle",
"onCheck",
"onDrop"
]))]),
_: 1
}, 8, [
"class-name",
"data",
"total",
"height",
"item-size",
"perf-mode",
"scrollbar-always-on"
])) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("empty-block"))
}, [(0, vue.renderSlot)(_ctx.$slots, "empty", {}, () => [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("empty-text")) }, (0, vue.toDisplayString)(__props.emptyText ?? (0, vue.unref)(t)("el.tree.emptyText")), 3)])], 2))], 2);
};
}
});
//#endregion
//#region ../../packages/components/tree-v2/src/tree.vue
var tree_default = tree_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/tree-v2/index.ts
const ElTreeV2 = withInstall(tree_default);
//#endregion
//#region ../../packages/components/upload/src/ajax.ts
const SCOPE$3 = "ElUpload";
var UploadAjaxError = class extends Error {
constructor(message, status, method, url) {
super(message);
this.name = "UploadAjaxError";
this.status = status;
this.method = method;
this.url = url;
}
};
function getError(action, option, xhr) {
let msg;
if (xhr.response) msg = `${xhr.response.error || xhr.response}`;
else if (xhr.responseText) msg = `${xhr.responseText}`;
else msg = `fail to ${option.method} ${action} ${xhr.status}`;
return new UploadAjaxError(msg, xhr.status, option.method, action);
}
function getBody(xhr) {
const text = xhr.responseText || xhr.response;
if (!text) return text;
try {
return JSON.parse(text);
} catch {
return text;
}
}
const ajaxUpload = (option) => {
if (typeof XMLHttpRequest === "undefined") throwError(SCOPE$3, "XMLHttpRequest is undefined");
const xhr = new XMLHttpRequest();
const action = option.action;
if (xhr.upload) xhr.upload.addEventListener("progress", (evt) => {
const progressEvt = evt;
progressEvt.percent = evt.total > 0 ? evt.loaded / evt.total * 100 : 0;
option.onProgress(progressEvt);
});
const formData = new FormData();
if (option.data) for (const [key, value] of Object.entries(option.data)) if (isArray$1(value)) if (value.length === 2 && value[0] instanceof Blob && isString(value[1])) formData.append(key, value[0], value[1]);
else value.forEach((item) => {
formData.append(key, item);
});
else formData.append(key, value);
formData.append(option.filename, option.file, option.file.name);
xhr.addEventListener("error", () => {
option.onError(getError(action, option, xhr));
});
xhr.addEventListener("load", () => {
if (xhr.status < 200 || xhr.status >= 300) return option.onError(getError(action, option, xhr));
option.onSuccess(getBody(xhr));
});
xhr.open(option.method, action, true);
if (option.withCredentials && "withCredentials" in xhr) xhr.withCredentials = true;
const headers = option.headers || {};
if (headers instanceof Headers) headers.forEach((value, key) => xhr.setRequestHeader(key, value));
else for (const [key, value] of Object.entries(headers)) {
if (isNil(value)) continue;
xhr.setRequestHeader(key, String(value));
}
xhr.send(formData);
return xhr;
};
//#endregion
//#region ../../packages/components/upload/src/upload.ts
/**
* @deprecated Removed after 3.0.0, Use `UploadProps` instead.
*/
const uploadListTypes = [
"text",
"picture",
"picture-card"
];
let fileId = 1;
const genFileId = () => Date.now() + fileId++;
/**
* @deprecated Removed after 3.0.0, Use `UploadBaseProps` instead.
*/
const uploadBaseProps = buildProps({
action: {
type: String,
default: "#"
},
headers: { type: definePropType(Object) },
method: {
type: String,
default: "post"
},
data: {
type: definePropType([
Object,
Function,
Promise
]),
default: () => mutable({})
},
multiple: Boolean,
name: {
type: String,
default: "file"
},
drag: Boolean,
withCredentials: Boolean,
showFileList: {
type: Boolean,
default: true
},
accept: {
type: String,
default: ""
},
fileList: {
type: definePropType(Array),
default: () => mutable([])
},
autoUpload: {
type: Boolean,
default: true
},
listType: {
type: String,
values: uploadListTypes,
default: "text"
},
httpRequest: {
type: definePropType(Function),
default: ajaxUpload
},
disabled: {
type: Boolean,
default: void 0
},
limit: Number,
directory: Boolean
});
/**
* @deprecated Removed after 3.0.0, Use `UploadProps` instead.
*/
const uploadProps = buildProps({
...uploadBaseProps,
beforeUpload: {
type: definePropType(Function),
default: NOOP
},
beforeRemove: { type: definePropType(Function) },
onRemove: {
type: definePropType(Function),
default: NOOP
},
onChange: {
type: definePropType(Function),
default: NOOP
},
onPreview: {
type: definePropType(Function),
default: NOOP
},
onSuccess: {
type: definePropType(Function),
default: NOOP
},
onProgress: {
type: definePropType(Function),
default: NOOP
},
onError: {
type: definePropType(Function),
default: NOOP
},
onExceed: {
type: definePropType(Function),
default: NOOP
},
crossorigin: { type: definePropType(String) }
});
const uploadBasePropsDefaults = {
action: "#",
method: "post",
data: () => mutable({}),
name: "file",
showFileList: true,
accept: "",
fileList: () => mutable([]),
autoUpload: true,
listType: "text",
httpRequest: ajaxUpload,
disabled: void 0
};
const uploadPropsDefaults = {
...uploadBasePropsDefaults,
beforeUpload: NOOP,
onRemove: NOOP,
onChange: NOOP,
onPreview: NOOP,
onSuccess: NOOP,
onProgress: NOOP,
onError: NOOP,
onExceed: NOOP
};
//#endregion
//#region ../../packages/components/upload/src/constants.ts
const uploadContextKey = Symbol("uploadContextKey");
//#endregion
//#region ../../packages/components/upload/src/upload-list.ts
/**
* @deprecated Removed after 3.0.0, Use `UploadListProps` instead.
*/
const uploadListProps = buildProps({
files: {
type: definePropType(Array),
default: () => mutable([])
},
disabled: {
type: Boolean,
default: void 0
},
handlePreview: {
type: definePropType(Function),
default: NOOP
},
listType: {
type: String,
values: uploadListTypes,
default: "text"
},
crossorigin: { type: definePropType(String) }
});
const uploadListEmits = { remove: (file) => !!file };
//#endregion
//#region ../../packages/components/upload/src/upload-list.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$10 = [
"tabindex",
"aria-disabled",
"onKeydown"
];
const _hoisted_2$6 = ["src", "crossorigin"];
const _hoisted_3$2 = ["onClick"];
const _hoisted_4$1 = ["title"];
const _hoisted_5 = ["onClick"];
const _hoisted_6 = ["onClick"];
var upload_list_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElUploadList",
__name: "upload-list",
props: uploadListProps,
emits: uploadListEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const { t } = useLocale();
const nsUpload = useNamespace("upload");
const nsIcon = useNamespace("icon");
const nsList = useNamespace("list");
const disabled = useFormDisabled();
const focusing = (0, vue.ref)(false);
const containerKls = (0, vue.computed)(() => [
nsUpload.b("list"),
nsUpload.bm("list", props.listType),
nsUpload.is("disabled", disabled.value)
]);
const handleRemove = (file) => {
emit("remove", file);
};
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)(vue.TransitionGroup, {
tag: "ul",
class: (0, vue.normalizeClass)(containerKls.value),
name: (0, vue.unref)(nsList).b()
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.files, (file, index) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
key: file.uid || file.name,
class: (0, vue.normalizeClass)([
(0, vue.unref)(nsUpload).be("list", "item"),
(0, vue.unref)(nsUpload).is(file.status),
{ focusing: focusing.value }
]),
tabindex: (0, vue.unref)(disabled) ? void 0 : 0,
"aria-disabled": (0, vue.unref)(disabled),
role: "button",
onKeydown: (0, vue.withKeys)(($event) => !(0, vue.unref)(disabled) && handleRemove(file), ["delete"]),
onFocus: _cache[0] || (_cache[0] = ($event) => focusing.value = true),
onBlur: _cache[1] || (_cache[1] = ($event) => focusing.value = false),
onClick: _cache[2] || (_cache[2] = ($event) => focusing.value = false)
}, [(0, vue.renderSlot)(_ctx.$slots, "default", {
file,
index
}, () => [
__props.listType === "picture" || file.status !== "uploading" && __props.listType === "picture-card" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("img", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(nsUpload).be("list", "item-thumbnail")),
src: file.url,
crossorigin: __props.crossorigin,
alt: ""
}, null, 10, _hoisted_2$6)) : (0, vue.createCommentVNode)("v-if", true),
file.status === "uploading" || __props.listType !== "picture-card" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(nsUpload).be("list", "item-info"))
}, [(0, vue.createElementVNode)("a", {
class: (0, vue.normalizeClass)((0, vue.unref)(nsUpload).be("list", "item-name")),
onClick: (0, vue.withModifiers)(($event) => __props.handlePreview(file), ["prevent"])
}, [(0, vue.createVNode)((0, vue.unref)(ElIcon), { class: (0, vue.normalizeClass)((0, vue.unref)(nsIcon).m("document")) }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(document_default))]),
_: 1
}, 8, ["class"]), (0, vue.createElementVNode)("span", {
class: (0, vue.normalizeClass)((0, vue.unref)(nsUpload).be("list", "item-file-name")),
title: file.name
}, (0, vue.toDisplayString)(file.name), 11, _hoisted_4$1)], 10, _hoisted_3$2), file.status === "uploading" ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElProgress), {
key: 0,
type: __props.listType === "picture-card" ? "circle" : "line",
"stroke-width": __props.listType === "picture-card" ? 6 : 2,
percentage: Number(file.percentage),
style: (0, vue.normalizeStyle)(__props.listType === "picture-card" ? "" : "margin-top: 0.5rem")
}, null, 8, [
"type",
"stroke-width",
"percentage",
"style"
])) : (0, vue.createCommentVNode)("v-if", true)], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("label", { class: (0, vue.normalizeClass)((0, vue.unref)(nsUpload).be("list", "item-status-label")) }, [__props.listType === "text" ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)([(0, vue.unref)(nsIcon).m("upload-success"), (0, vue.unref)(nsIcon).m("circle-check")])
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(circle_check_default))]),
_: 1
}, 8, ["class"])) : ["picture-card", "picture"].includes(__props.listType) ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 1,
class: (0, vue.normalizeClass)([(0, vue.unref)(nsIcon).m("upload-success"), (0, vue.unref)(nsIcon).m("check")])
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(check_default))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true)], 2),
!(0, vue.unref)(disabled) ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 2,
class: (0, vue.normalizeClass)((0, vue.unref)(nsIcon).m("close")),
"aria-label": (0, vue.unref)(t)("el.upload.delete"),
role: "button",
tabindex: "0",
onClick: ($event) => handleRemove(file),
onKeydown: (0, vue.withKeys)((0, vue.withModifiers)(($event) => handleRemove(file), ["prevent"]), ["enter", "space"])
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(close_default))]),
_: 1
}, 8, [
"class",
"aria-label",
"onClick",
"onKeydown"
])) : (0, vue.createCommentVNode)("v-if", true),
!(0, vue.unref)(disabled) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("i", {
key: 3,
class: (0, vue.normalizeClass)((0, vue.unref)(nsIcon).m("close-tip"))
}, (0, vue.toDisplayString)((0, vue.unref)(t)("el.upload.deleteTip")), 3)) : (0, vue.createCommentVNode)("v-if", true),
__props.listType === "picture-card" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 4,
class: (0, vue.normalizeClass)((0, vue.unref)(nsUpload).be("list", "item-actions"))
}, [(0, vue.createElementVNode)("span", {
class: (0, vue.normalizeClass)((0, vue.unref)(nsUpload).be("list", "item-preview")),
onClick: ($event) => __props.handlePreview(file)
}, [(0, vue.createVNode)((0, vue.unref)(ElIcon), { class: (0, vue.normalizeClass)((0, vue.unref)(nsIcon).m("zoom-in")) }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(zoom_in_default))]),
_: 1
}, 8, ["class"])], 10, _hoisted_5), !(0, vue.unref)(disabled) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(nsUpload).be("list", "item-delete")),
onClick: ($event) => handleRemove(file)
}, [(0, vue.createVNode)((0, vue.unref)(ElIcon), { class: (0, vue.normalizeClass)((0, vue.unref)(nsIcon).m("delete")) }, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(delete_default))]),
_: 1
}, 8, ["class"])], 10, _hoisted_6)) : (0, vue.createCommentVNode)("v-if", true)], 2)) : (0, vue.createCommentVNode)("v-if", true)
])], 42, _hoisted_1$10);
}), 128)), (0, vue.renderSlot)(_ctx.$slots, "append")]),
_: 3
}, 8, ["class", "name"]);
};
}
});
//#endregion
//#region ../../packages/components/upload/src/upload-list.vue
var upload_list_default = upload_list_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/upload/src/upload-content.ts
/**
* @deprecated Removed after 3.0.0, Use `UploadContentProps` instead.
*/
const uploadContentProps = buildProps({
...uploadBaseProps,
beforeUpload: {
type: definePropType(Function),
default: NOOP
},
onRemove: {
type: definePropType(Function),
default: NOOP
},
onStart: {
type: definePropType(Function),
default: NOOP
},
onSuccess: {
type: definePropType(Function),
default: NOOP
},
onProgress: {
type: definePropType(Function),
default: NOOP
},
onError: {
type: definePropType(Function),
default: NOOP
},
onExceed: {
type: definePropType(Function),
default: NOOP
}
});
const uploadContentPropsDefaults = {
...uploadBasePropsDefaults,
beforeUpload: NOOP,
onRemove: NOOP,
onStart: NOOP,
onSuccess: NOOP,
onProgress: NOOP,
onError: NOOP,
onExceed: NOOP
};
//#endregion
//#region ../../packages/components/upload/src/upload-dragger.ts
/**
* @deprecated Removed after 3.0.0, Use `UploadDraggerProps` instead.
*/
const uploadDraggerProps = buildProps({
disabled: {
type: Boolean,
default: void 0
},
directory: Boolean
});
const uploadDraggerEmits = { file: (file) => isArray$1(file) };
//#endregion
//#region ../../packages/components/upload/src/upload-dragger.vue?vue&type=script&setup=true&lang.ts
const COMPONENT_NAME$1 = "ElUploadDrag";
var upload_dragger_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: COMPONENT_NAME$1,
__name: "upload-dragger",
props: uploadDraggerProps,
emits: uploadDraggerEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
if (!(0, vue.inject)(uploadContextKey)) throwError(COMPONENT_NAME$1, "usage: <el-upload><el-upload-dragger /></el-upload>");
const ns = useNamespace("upload");
const dragover = (0, vue.ref)(false);
const disabled = useFormDisabled();
const getFile = (entry) => {
return new Promise((resolve, reject) => entry.file(resolve, reject));
};
const getAllFiles = async (entry) => {
try {
if (entry.isFile) {
const file = await getFile(entry);
file.isDirectory = false;
return [file];
}
if (entry.isDirectory) {
const dirReader = entry.createReader();
const getEntries = () => {
return new Promise((resolve, reject) => dirReader.readEntries(resolve, reject));
};
const entries = [];
let readEntries = await getEntries();
/**
* In Chromium-based browsers, readEntries() will only return the first 100 FileSystemEntry instances.
* https://developer.mozilla.org/en-US/docs/Web/API/FileSystemDirectoryReader/readEntries#:~:text=In%20Chromium%2Dbased%20browsers%2C%20readEntries()%20will%20only%20return%20the%20first%20100%20FileSystemEntry%20instances.%20In%20order%20to%20obtain%20all%20of%20the%20instances%2C%20readEntries()%20must%20be%20called%20multiple%20times.
*/
while (readEntries.length > 0) {
entries.push(...readEntries);
readEntries = await getEntries();
}
const filePromises = entries.map((entry) => getAllFiles(entry).catch(() => []));
return flatten(await Promise.all(filePromises));
}
} catch {
return [];
}
return [];
};
const onDrop = async (e) => {
if (disabled.value) return;
dragover.value = false;
e.stopPropagation();
const files = Array.from(e.dataTransfer.files);
const items = e.dataTransfer.items || [];
if (props.directory) {
const entries = Array.from(items).map((item) => item?.webkitGetAsEntry?.()).filter((entry) => entry);
emit("file", flatten(await Promise.all(entries.map(getAllFiles))));
return;
}
files.forEach((file, index) => {
const entry = items[index]?.webkitGetAsEntry?.();
if (entry) file.isDirectory = entry.isDirectory;
});
emit("file", files);
};
const onDragover = () => {
if (!disabled.value) dragover.value = true;
};
const onDragleave = (e) => {
if (!e.currentTarget.contains(e.relatedTarget)) dragover.value = false;
};
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).b("dragger"), (0, vue.unref)(ns).is("dragover", dragover.value)]),
onDrop: (0, vue.withModifiers)(onDrop, ["prevent"]),
onDragover: (0, vue.withModifiers)(onDragover, ["prevent"]),
onDragleave: (0, vue.withModifiers)(onDragleave, ["prevent"])
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 34);
};
}
});
//#endregion
//#region ../../packages/components/upload/src/upload-dragger.vue
var upload_dragger_default = upload_dragger_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/upload/src/upload-content.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$9 = [
"tabindex",
"aria-disabled",
"onKeydown"
];
const _hoisted_2$5 = [
"name",
"disabled",
"multiple",
"accept",
"webkitdirectory"
];
var upload_content_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElUploadContent",
inheritAttrs: false,
__name: "upload-content",
props: uploadContentProps,
setup(__props, { expose: __expose }) {
const props = __props;
const ns = useNamespace("upload");
const disabled = useFormDisabled();
const requests = (0, vue.shallowRef)({});
const inputRef = (0, vue.shallowRef)();
const uploadFiles = (files) => {
if (files.length === 0) return;
const { autoUpload, limit, fileList, multiple, onStart, onExceed } = props;
if (limit && fileList.length + files.length > limit) {
onExceed(files, fileList);
return;
}
if (!multiple) files = files.slice(0, 1);
for (const file of files) {
const rawFile = file;
rawFile.uid = genFileId();
onStart(rawFile);
if (autoUpload) upload(rawFile);
}
};
const upload = async (rawFile) => {
inputRef.value.value = "";
if (!props.beforeUpload) return doUpload(rawFile);
let hookResult;
let beforeData = {};
try {
const originData = props.data;
const beforeUploadPromise = props.beforeUpload(rawFile);
beforeData = isPlainObject$1(props.data) ? cloneDeep(props.data) : props.data;
hookResult = await beforeUploadPromise;
if (isPlainObject$1(props.data) && isEqual$1(originData, beforeData)) beforeData = cloneDeep(props.data);
} catch {
hookResult = false;
}
if (hookResult === false) {
props.onRemove(rawFile);
return;
}
let file = rawFile;
if (hookResult instanceof Blob) if (hookResult instanceof File) file = hookResult;
else file = new File([hookResult], rawFile.name, { type: rawFile.type });
doUpload(Object.assign(file, { uid: rawFile.uid }), beforeData);
};
const resolveData = async (data, rawFile) => {
if (isFunction$1(data)) return data(rawFile);
return data;
};
const doUpload = async (rawFile, beforeData) => {
const { headers, data, method, withCredentials, name: filename, action, onProgress, onSuccess, onError, httpRequest } = props;
try {
beforeData = await resolveData(beforeData ?? data, rawFile);
} catch {
props.onRemove(rawFile);
return;
}
const { uid } = rawFile;
const options = {
headers: headers || {},
withCredentials,
file: rawFile,
data: beforeData,
method,
filename,
action,
onProgress: (evt) => {
onProgress(evt, rawFile);
},
onSuccess: (res) => {
onSuccess(res, rawFile);
delete requests.value[uid];
},
onError: (err) => {
onError(err, rawFile);
delete requests.value[uid];
}
};
const request = httpRequest(options);
requests.value[uid] = request;
if (request instanceof Promise) request.then(options.onSuccess, options.onError);
};
const handleChange = (e) => {
const files = e.target.files;
if (!files) return;
uploadFiles(Array.from(files));
};
const handleClick = () => {
if (!disabled.value) {
inputRef.value.value = "";
inputRef.value.click();
}
};
const handleKeydown = () => {
handleClick();
};
const abort = (file) => {
entriesOf(requests.value).filter(file ? ([uid]) => String(file.uid) === uid : () => true).forEach(([uid, req]) => {
if (req instanceof XMLHttpRequest) req.abort();
delete requests.value[uid];
});
};
__expose({
abort,
upload
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).b(),
(0, vue.unref)(ns).m(__props.listType),
(0, vue.unref)(ns).is("drag", __props.drag),
(0, vue.unref)(ns).is("disabled", (0, vue.unref)(disabled))
]),
tabindex: (0, vue.unref)(disabled) ? void 0 : 0,
"aria-disabled": (0, vue.unref)(disabled),
role: "button",
onClick: handleClick,
onKeydown: (0, vue.withKeys)((0, vue.withModifiers)(handleKeydown, ["self"]), ["enter", "space"])
}, [__props.drag ? ((0, vue.openBlock)(), (0, vue.createBlock)(upload_dragger_default, {
key: 0,
disabled: (0, vue.unref)(disabled),
directory: __props.directory,
onFile: uploadFiles
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 8, ["disabled", "directory"])) : (0, vue.renderSlot)(_ctx.$slots, "default", { key: 1 }), (0, vue.createElementVNode)("input", {
ref_key: "inputRef",
ref: inputRef,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("input")),
name: __props.name,
disabled: (0, vue.unref)(disabled),
multiple: __props.multiple,
accept: __props.accept,
webkitdirectory: __props.directory || void 0,
type: "file",
onChange: handleChange,
onClick: _cache[0] || (_cache[0] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, null, 42, _hoisted_2$5)], 42, _hoisted_1$9);
};
}
});
//#endregion
//#region ../../packages/components/upload/src/upload-content.vue
var upload_content_default = upload_content_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/upload/src/use-handlers.ts
const SCOPE$2 = "ElUpload";
const revokeFileObjectURL = (file) => {
if (file.url?.startsWith("blob:")) URL.revokeObjectURL(file.url);
};
const useHandlers = (props, uploadRef) => {
const uploadFiles = useVModel(props, "fileList", void 0, { passive: true });
const getFile = (rawFile) => uploadFiles.value.find((file) => file.uid === rawFile.uid);
function abort(file) {
uploadRef.value?.abort(file);
}
function clearFiles(states = [
"ready",
"uploading",
"success",
"fail"
]) {
uploadFiles.value = uploadFiles.value.filter((row) => !states.includes(row.status));
}
function removeFile(file) {
uploadFiles.value = uploadFiles.value.filter((uploadFile) => uploadFile.uid !== file.uid);
}
const emitChange = (file) => {
(0, vue.nextTick)(() => props.onChange(file, uploadFiles.value));
};
const handleError = (err, rawFile) => {
const file = getFile(rawFile);
if (!file) return;
console.error(err);
file.status = "fail";
removeFile(file);
props.onError(err, file, uploadFiles.value);
emitChange(file);
};
const handleProgress = (evt, rawFile) => {
const file = getFile(rawFile);
if (!file) return;
props.onProgress(evt, file, uploadFiles.value);
file.status = "uploading";
file.percentage = Math.round(evt.percent);
};
const handleSuccess = (response, rawFile) => {
const file = getFile(rawFile);
if (!file) return;
file.status = "success";
file.response = response;
props.onSuccess(response, file, uploadFiles.value);
emitChange(file);
};
const handleStart = (file) => {
if (isNil(file.uid)) file.uid = genFileId();
const uploadFile = {
name: file.name,
percentage: 0,
status: "ready",
size: file.size,
raw: file,
uid: file.uid
};
if (props.listType === "picture-card" || props.listType === "picture") try {
uploadFile.url = URL.createObjectURL(file);
} catch (err) {
/* @__PURE__ */ debugWarn(SCOPE$2, err.message);
props.onError(err, uploadFile, uploadFiles.value);
}
uploadFiles.value = [...uploadFiles.value, uploadFile];
emitChange(uploadFile);
};
const handleRemove = async (file) => {
const uploadFile = file instanceof File ? getFile(file) : file;
if (!uploadFile) throwError(SCOPE$2, "file to be removed not found");
const doRemove = (file) => {
abort(file);
removeFile(file);
props.onRemove(file, uploadFiles.value);
revokeFileObjectURL(file);
};
if (props.beforeRemove) {
if (await props.beforeRemove(uploadFile, uploadFiles.value) !== false) doRemove(uploadFile);
} else doRemove(uploadFile);
};
function submit() {
uploadFiles.value.filter(({ status }) => status === "ready").forEach(({ raw }) => raw && uploadRef.value?.upload(raw));
}
(0, vue.watch)(() => props.listType, (val) => {
if (val !== "picture-card" && val !== "picture") return;
uploadFiles.value = uploadFiles.value.map((file) => {
const { raw, url } = file;
if (!url && raw) try {
file.url = URL.createObjectURL(raw);
} catch (err) {
props.onError(err, file, uploadFiles.value);
}
return file;
});
});
(0, vue.watch)(uploadFiles, (files) => {
for (const file of files) {
file.uid ||= genFileId();
file.status ||= "success";
}
}, {
immediate: true,
deep: true
});
return {
uploadFiles,
abort,
clearFiles,
handleError,
handleProgress,
handleStart,
handleSuccess,
handleRemove,
submit,
revokeFileObjectURL
};
};
//#endregion
//#region ../../packages/components/upload/src/upload.vue?vue&type=script&setup=true&lang.ts
var upload_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElUpload",
__name: "upload",
props: uploadProps,
setup(__props, { expose: __expose }) {
const props = __props;
const disabled = useFormDisabled();
const uploadRef = (0, vue.shallowRef)();
const { abort, submit, clearFiles, uploadFiles, handleStart, handleError, handleRemove, handleSuccess, handleProgress, revokeFileObjectURL } = useHandlers(props, uploadRef);
const isPictureCard = (0, vue.computed)(() => props.listType === "picture-card");
const uploadContentProps = (0, vue.computed)(() => ({
...props,
fileList: uploadFiles.value,
onStart: handleStart,
onProgress: handleProgress,
onSuccess: handleSuccess,
onError: handleError,
onRemove: handleRemove
}));
(0, vue.onBeforeUnmount)(() => {
uploadFiles.value.forEach(revokeFileObjectURL);
});
(0, vue.provide)(uploadContextKey, { accept: (0, vue.toRef)(props, "accept") });
__expose({
abort,
submit,
clearFiles,
handleStart,
handleRemove
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", null, [
isPictureCard.value && __props.showFileList ? ((0, vue.openBlock)(), (0, vue.createBlock)(upload_list_default, {
key: 0,
disabled: (0, vue.unref)(disabled),
"list-type": __props.listType,
files: (0, vue.unref)(uploadFiles),
crossorigin: __props.crossorigin,
"handle-preview": __props.onPreview,
onRemove: (0, vue.unref)(handleRemove)
}, (0, vue.createSlots)({
append: (0, vue.withCtx)(() => [(0, vue.createVNode)(upload_content_default, (0, vue.mergeProps)({
ref_key: "uploadRef",
ref: uploadRef
}, uploadContentProps.value), {
default: (0, vue.withCtx)(() => [_ctx.$slots.trigger ? (0, vue.renderSlot)(_ctx.$slots, "trigger", { key: 0 }) : (0, vue.createCommentVNode)("v-if", true), !_ctx.$slots.trigger && _ctx.$slots.default ? (0, vue.renderSlot)(_ctx.$slots, "default", { key: 1 }) : (0, vue.createCommentVNode)("v-if", true)]),
_: 3
}, 16)]),
_: 2
}, [_ctx.$slots.file ? {
name: "default",
fn: (0, vue.withCtx)(({ file, index }) => [(0, vue.renderSlot)(_ctx.$slots, "file", {
file,
index
})]),
key: "0"
} : void 0]), 1032, [
"disabled",
"list-type",
"files",
"crossorigin",
"handle-preview",
"onRemove"
])) : (0, vue.createCommentVNode)("v-if", true),
!isPictureCard.value || isPictureCard.value && !__props.showFileList ? ((0, vue.openBlock)(), (0, vue.createBlock)(upload_content_default, (0, vue.mergeProps)({
key: 1,
ref_key: "uploadRef",
ref: uploadRef
}, uploadContentProps.value), {
default: (0, vue.withCtx)(() => [_ctx.$slots.trigger ? (0, vue.renderSlot)(_ctx.$slots, "trigger", { key: 0 }) : (0, vue.createCommentVNode)("v-if", true), !_ctx.$slots.trigger && _ctx.$slots.default ? (0, vue.renderSlot)(_ctx.$slots, "default", { key: 1 }) : (0, vue.createCommentVNode)("v-if", true)]),
_: 3
}, 16)) : (0, vue.createCommentVNode)("v-if", true),
_ctx.$slots.trigger ? (0, vue.renderSlot)(_ctx.$slots, "default", { key: 2 }) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.renderSlot)(_ctx.$slots, "tip"),
!isPictureCard.value && __props.showFileList ? ((0, vue.openBlock)(), (0, vue.createBlock)(upload_list_default, {
key: 3,
disabled: (0, vue.unref)(disabled),
"list-type": __props.listType,
files: (0, vue.unref)(uploadFiles),
crossorigin: __props.crossorigin,
"handle-preview": __props.onPreview,
onRemove: (0, vue.unref)(handleRemove)
}, (0, vue.createSlots)({ _: 2 }, [_ctx.$slots.file ? {
name: "default",
fn: (0, vue.withCtx)(({ file, index }) => [(0, vue.renderSlot)(_ctx.$slots, "file", {
file,
index
})]),
key: "0"
} : void 0]), 1032, [
"disabled",
"list-type",
"files",
"crossorigin",
"handle-preview",
"onRemove"
])) : (0, vue.createCommentVNode)("v-if", true)
]);
};
}
});
//#endregion
//#region ../../packages/components/upload/src/upload.vue
var upload_default = upload_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/upload/index.ts
const ElUpload = withInstall(upload_default);
//#endregion
//#region ../../packages/components/watermark/src/watermark.ts
/**
* @deprecated Removed after 3.0.0, Use `WatermarkProps` instead.
*/
const watermarkProps = buildProps({
zIndex: {
type: Number,
default: 9
},
rotate: {
type: Number,
default: -22
},
width: Number,
height: Number,
image: String,
content: {
type: definePropType([String, Array]),
default: "Element Plus"
},
font: { type: definePropType(Object) },
gap: {
type: definePropType(Array),
default: () => [100, 100]
},
offset: { type: definePropType(Array) }
});
//#endregion
//#region ../../packages/components/watermark/src/utils.ts
/** converting camel-cased strings to be lowercase and link it with Separator */
function toLowercaseSeparator(key) {
return key.replace(/([A-Z])/g, "-$1").toLowerCase();
}
function getStyleStr(style) {
return Object.keys(style).map((key) => `${toLowercaseSeparator(key)}: ${style[key]};`).join(" ");
}
/** Returns the ratio of the device's physical pixel resolution to the css pixel resolution */
function getPixelRatio() {
return window.devicePixelRatio || 1;
}
/** Whether to re-render the watermark */
const reRendering = (mutation, watermarkElement) => {
let flag = false;
if (mutation.removedNodes.length && watermarkElement) flag = Array.from(mutation.removedNodes).includes(watermarkElement);
if (mutation.type === "attributes" && mutation.target === watermarkElement) flag = true;
return flag;
};
//#endregion
//#region ../../packages/components/watermark/src/useClips.ts
const TEXT_ALIGN_RATIO_MAP = {
left: [0, .5],
start: [0, .5],
center: [.5, 0],
right: [1, -.5],
end: [1, -.5]
};
function prepareCanvas(width, height, ratio = 1) {
const canvas = document.createElement("canvas");
const ctx = canvas.getContext("2d");
const realWidth = width * ratio;
const realHeight = height * ratio;
canvas.setAttribute("width", `${realWidth}px`);
canvas.setAttribute("height", `${realHeight}px`);
ctx.save();
return [
ctx,
canvas,
realWidth,
realHeight
];
}
/**
* Get the clips of text content.
* This is a lazy hook function since SSR no need this
*/
function useClips() {
function getClips(content, rotate, ratio, width, height, font, gapX, gapY, space) {
const [ctx, canvas, contentWidth, contentHeight] = prepareCanvas(width, height, ratio);
let baselineOffset = 0;
if (content instanceof HTMLImageElement) ctx.drawImage(content, 0, 0, contentWidth, contentHeight);
else {
const { color, fontSize, fontStyle, fontWeight, fontFamily, textAlign, textBaseline } = font;
const mergedFontSize = Number(fontSize) * ratio;
ctx.font = `${fontStyle} normal ${fontWeight} ${mergedFontSize}px/${height}px ${fontFamily}`;
ctx.fillStyle = color;
ctx.textAlign = textAlign;
ctx.textBaseline = textBaseline;
const contents = isArray$1(content) ? content : [content];
if (textBaseline !== "top" && contents[0]) {
const argumentMetrics = ctx.measureText(contents[0]);
ctx.textBaseline = "top";
const topMetrics = ctx.measureText(contents[0]);
baselineOffset = argumentMetrics.actualBoundingBoxAscent - topMetrics.actualBoundingBoxAscent;
}
contents?.forEach((item, index) => {
const [alignRatio, spaceRatio] = TEXT_ALIGN_RATIO_MAP[textAlign];
ctx.fillText(item ?? "", contentWidth * alignRatio + space * spaceRatio, index * (mergedFontSize + font.fontGap * ratio));
});
}
const angle = Math.PI / 180 * Number(rotate);
const maxSize = Math.max(width, height);
const [rCtx, rCanvas, realMaxSize] = prepareCanvas(maxSize, maxSize, ratio);
rCtx.translate(realMaxSize / 2, realMaxSize / 2);
rCtx.rotate(angle);
if (contentWidth > 0 && contentHeight > 0) rCtx.drawImage(canvas, -contentWidth / 2, -contentHeight / 2);
function getRotatePos(x, y) {
return [x * Math.cos(angle) - y * Math.sin(angle), x * Math.sin(angle) + y * Math.cos(angle)];
}
let left = 0;
let right = 0;
let top = 0;
let bottom = 0;
const halfWidth = contentWidth / 2;
const halfHeight = contentHeight / 2;
[
[0 - halfWidth, 0 - halfHeight],
[0 + halfWidth, 0 - halfHeight],
[0 + halfWidth, 0 + halfHeight],
[0 - halfWidth, 0 + halfHeight]
].forEach(([x, y]) => {
const [targetX, targetY] = getRotatePos(x, y);
left = Math.min(left, targetX);
right = Math.max(right, targetX);
top = Math.min(top, targetY);
bottom = Math.max(bottom, targetY);
});
const cutLeft = left + realMaxSize / 2;
const cutTop = top + realMaxSize / 2;
const cutWidth = right - left;
const cutHeight = bottom - top;
const realGapX = gapX * ratio;
const realGapY = gapY * ratio;
const filledWidth = (cutWidth + realGapX) * 2;
const filledHeight = cutHeight + realGapY;
const [fCtx, fCanvas] = prepareCanvas(filledWidth, filledHeight);
function drawImg(targetX = 0, targetY = 0) {
fCtx.drawImage(rCanvas, cutLeft, cutTop, cutWidth, cutHeight, targetX, targetY + baselineOffset, cutWidth, cutHeight);
}
drawImg();
drawImg(cutWidth + realGapX, -cutHeight / 2 - realGapY / 2);
drawImg(cutWidth + realGapX, +cutHeight / 2 + realGapY / 2);
return [
fCanvas.toDataURL(),
filledWidth / ratio,
filledHeight / ratio
];
}
return getClips;
}
//#endregion
//#region ../../packages/components/watermark/src/watermark.vue?vue&type=script&setup=true&lang.ts
var watermark_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElWatermark",
__name: "watermark",
props: watermarkProps,
setup(__props) {
const style = { position: "relative" };
const props = __props;
const fontGap = (0, vue.computed)(() => props.font?.fontGap ?? 3);
const color = (0, vue.computed)(() => props.font?.color ?? "rgba(0,0,0,.15)");
const fontSize = (0, vue.computed)(() => props.font?.fontSize ?? 16);
const fontWeight = (0, vue.computed)(() => props.font?.fontWeight ?? "normal");
const fontStyle = (0, vue.computed)(() => props.font?.fontStyle ?? "normal");
const fontFamily = (0, vue.computed)(() => props.font?.fontFamily ?? "sans-serif");
const textAlign = (0, vue.computed)(() => props.font?.textAlign ?? "center");
const textBaseline = (0, vue.computed)(() => props.font?.textBaseline ?? "hanging");
const gapX = (0, vue.computed)(() => props.gap[0]);
const gapY = (0, vue.computed)(() => props.gap[1]);
const gapXCenter = (0, vue.computed)(() => gapX.value / 2);
const gapYCenter = (0, vue.computed)(() => gapY.value / 2);
const offsetLeft = (0, vue.computed)(() => props.offset?.[0] ?? gapXCenter.value);
const offsetTop = (0, vue.computed)(() => props.offset?.[1] ?? gapYCenter.value);
const getMarkStyle = () => {
const markStyle = {
zIndex: props.zIndex,
position: "absolute",
left: 0,
top: 0,
width: "100%",
height: "100%",
pointerEvents: "none",
backgroundRepeat: "repeat"
};
/** Calculate the style of the offset */
let positionLeft = offsetLeft.value - gapXCenter.value;
let positionTop = offsetTop.value - gapYCenter.value;
if (positionLeft > 0) {
markStyle.left = `${positionLeft}px`;
markStyle.width = `calc(100% - ${positionLeft}px)`;
positionLeft = 0;
}
if (positionTop > 0) {
markStyle.top = `${positionTop}px`;
markStyle.height = `calc(100% - ${positionTop}px)`;
positionTop = 0;
}
markStyle.backgroundPosition = `${positionLeft}px ${positionTop}px`;
return markStyle;
};
const containerRef = (0, vue.shallowRef)(null);
const watermarkRef = (0, vue.shallowRef)();
const stopObservation = (0, vue.ref)(false);
const destroyWatermark = () => {
if (watermarkRef.value) {
watermarkRef.value.remove();
watermarkRef.value = void 0;
}
};
const appendWatermark = (base64Url, markWidth) => {
if (containerRef.value && watermarkRef.value) {
stopObservation.value = true;
watermarkRef.value.setAttribute("style", getStyleStr({
...getMarkStyle(),
backgroundImage: `url('${base64Url}')`,
backgroundSize: `${Math.floor(markWidth)}px`
}));
containerRef.value?.append(watermarkRef.value);
setTimeout(() => {
stopObservation.value = false;
});
}
};
/**
* Get the width and height of the watermark. The default values are as follows
* Image: [120, 64]; Content: It's calculated by content;
*/
const getMarkSize = (ctx) => {
let defaultWidth = 120;
let defaultHeight = 64;
let space = 0;
const { image, content, width, height, rotate } = props;
if (!image && ctx.measureText) {
ctx.font = `${Number(fontSize.value)}px ${fontFamily.value}`;
const contents = isArray$1(content) ? content : [content];
let maxWidth = 0;
let maxHeight = 0;
contents.forEach((item) => {
const { width, fontBoundingBoxAscent, fontBoundingBoxDescent, actualBoundingBoxAscent, actualBoundingBoxDescent } = ctx.measureText(item);
const height = isUndefined(fontBoundingBoxAscent) ? actualBoundingBoxAscent + actualBoundingBoxDescent : fontBoundingBoxAscent + fontBoundingBoxDescent;
if (width > maxWidth) maxWidth = Math.ceil(width);
if (height > maxHeight) maxHeight = Math.ceil(height);
});
defaultWidth = maxWidth;
defaultHeight = maxHeight * contents.length + (contents.length - 1) * fontGap.value;
const angle = Math.PI / 180 * Number(rotate);
space = Math.ceil(Math.abs(Math.sin(angle) * defaultHeight) / 2);
defaultWidth += space;
}
return [
width ?? defaultWidth,
height ?? defaultHeight,
space
];
};
const getClips = useClips();
const renderWatermark = () => {
const ctx = document.createElement("canvas").getContext("2d");
const image = props.image;
const content = props.content;
const rotate = props.rotate;
if (ctx) {
if (!watermarkRef.value) watermarkRef.value = document.createElement("div");
const ratio = getPixelRatio();
const [markWidth, markHeight, space] = getMarkSize(ctx);
const drawCanvas = (drawContent) => {
const [textClips, clipWidth] = getClips(drawContent || "", rotate, ratio, markWidth, markHeight, {
color: color.value,
fontSize: fontSize.value,
fontStyle: fontStyle.value,
fontWeight: fontWeight.value,
fontFamily: fontFamily.value,
fontGap: fontGap.value,
textAlign: textAlign.value,
textBaseline: textBaseline.value
}, gapX.value, gapY.value, space);
appendWatermark(textClips, clipWidth);
};
if (image) {
const img = new Image();
img.onload = () => {
drawCanvas(img);
};
img.onerror = () => {
drawCanvas(content);
};
img.crossOrigin = "anonymous";
img.referrerPolicy = "no-referrer";
img.src = image;
} else drawCanvas(content);
}
};
(0, vue.onMounted)(() => {
renderWatermark();
});
(0, vue.watch)(() => props, () => {
renderWatermark();
}, {
deep: true,
flush: "post"
});
(0, vue.onBeforeUnmount)(() => {
destroyWatermark();
});
const onMutate = (mutations) => {
if (stopObservation.value) return;
mutations.forEach((mutation) => {
if (reRendering(mutation, watermarkRef.value)) {
destroyWatermark();
renderWatermark();
}
});
};
useMutationObserver(containerRef, onMutate, {
attributes: true,
subtree: true,
childList: true
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref_key: "containerRef",
ref: containerRef,
style: (0, vue.normalizeStyle)([style])
}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 4);
};
}
});
//#endregion
//#region ../../packages/components/watermark/src/watermark.vue
var watermark_default = watermark_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/watermark/index.ts
const ElWatermark = withInstall(watermark_default);
//#endregion
//#region ../../packages/components/tour/src/content.ts
const tourStrategies = ["absolute", "fixed"];
const tourPlacements = [
"top-start",
"top-end",
"top",
"bottom-start",
"bottom-end",
"bottom",
"left-start",
"left-end",
"left",
"right-start",
"right-end",
"right"
];
/**
* @deprecated Removed after 3.0.0, Use `TourContentProps` instead.
*/
const tourContentProps = buildProps({
placement: {
type: definePropType(String),
values: tourPlacements,
default: "bottom"
},
reference: {
type: definePropType(Object),
default: null
},
strategy: {
type: definePropType(String),
values: tourStrategies,
default: "absolute"
},
offset: {
type: Number,
default: 10
},
showArrow: Boolean,
zIndex: {
type: Number,
default: 2001
}
});
const tourContentEmits = { close: () => true };
//#endregion
//#region ../../packages/components/tour/src/tour.ts
/**
* @deprecated Removed after 3.0.0, Use `TourProps` instead.
*/
const tourProps = buildProps({
modelValue: Boolean,
current: {
type: Number,
default: 0
},
showArrow: {
type: Boolean,
default: true
},
showClose: {
type: Boolean,
default: true
},
closeIcon: { type: iconPropType },
placement: tourContentProps.placement,
contentStyle: { type: definePropType([Object]) },
mask: {
type: definePropType([Boolean, Object]),
default: true
},
gap: {
type: definePropType(Object),
default: () => ({
offset: 6,
radius: 2
})
},
zIndex: { type: Number },
scrollIntoViewOptions: {
type: definePropType([Boolean, Object]),
default: () => ({ block: "center" })
},
type: { type: definePropType(String) },
appendTo: {
type: teleportProps.to.type,
default: "body"
},
closeOnPressEscape: {
type: Boolean,
default: true
},
targetAreaClickable: {
type: Boolean,
default: true
}
});
const tourEmits = {
[UPDATE_MODEL_EVENT]: (value) => isBoolean(value),
["update:current"]: (current) => isNumber(current),
close: (current) => isNumber(current),
finish: () => true,
change: (current) => isNumber(current)
};
//#endregion
//#region ../../packages/components/tour/src/mask.ts
/**
* @deprecated Removed after 3.0.0, Use `MaskProps` instead.
*/
const maskProps = buildProps({
zIndex: {
type: Number,
default: 1001
},
visible: Boolean,
fill: {
type: String,
default: "rgba(0,0,0,0.5)"
},
pos: { type: definePropType(Object) },
targetAreaClickable: {
type: Boolean,
default: true
}
});
//#endregion
//#region ../../packages/components/tour/src/helper.ts
const useTarget = (target, open, gap, mergedMask, scrollIntoViewOptions) => {
const posInfo = (0, vue.ref)(null);
const getTargetEl = () => {
let targetEl;
if (isString(target.value)) targetEl = document.querySelector(target.value);
else if (isFunction$1(target.value)) targetEl = target.value();
else targetEl = target.value;
return targetEl;
};
const updatePosInfo = () => {
const targetEl = getTargetEl();
if (!targetEl || !open.value) {
posInfo.value = null;
return;
}
if (!isInViewPort(targetEl)) targetEl.scrollIntoView(scrollIntoViewOptions.value);
const { left, top, width, height } = targetEl.getBoundingClientRect();
posInfo.value = {
left,
top,
width,
height,
radius: 0
};
};
(0, vue.onMounted)(() => {
(0, vue.watch)([open, target], () => {
updatePosInfo();
}, { immediate: true });
window.addEventListener("resize", updatePosInfo);
});
(0, vue.onBeforeUnmount)(() => {
window.removeEventListener("resize", updatePosInfo);
});
const getGapOffset = (index) => (isArray$1(gap.value.offset) ? gap.value.offset[index] : gap.value.offset) ?? 6;
const mergedPosInfo = (0, vue.computed)(() => {
if (!posInfo.value) return posInfo.value;
const gapOffsetX = getGapOffset(0);
const gapOffsetY = getGapOffset(1);
const gapRadius = gap.value?.radius || 2;
return {
left: posInfo.value.left - gapOffsetX,
top: posInfo.value.top - gapOffsetY,
width: posInfo.value.width + gapOffsetX * 2,
height: posInfo.value.height + gapOffsetY * 2,
radius: gapRadius
};
});
return {
mergedPosInfo,
triggerTarget: (0, vue.computed)(() => {
const targetEl = getTargetEl();
if (!mergedMask.value || !targetEl || !window.DOMRect) return targetEl || void 0;
return { getBoundingClientRect() {
return window.DOMRect.fromRect({
width: mergedPosInfo.value?.width || 0,
height: mergedPosInfo.value?.height || 0,
x: mergedPosInfo.value?.left || 0,
y: mergedPosInfo.value?.top || 0
});
} };
})
};
};
const tourKey = Symbol("ElTour");
function isInViewPort(element) {
const viewWidth = window.innerWidth || document.documentElement.clientWidth;
const viewHeight = window.innerHeight || document.documentElement.clientHeight;
const { top, right, bottom, left } = element.getBoundingClientRect();
return top >= 0 && left >= 0 && right <= viewWidth && bottom <= viewHeight;
}
const useFloating$1 = (referenceRef, contentRef, arrowRef, placement, strategy, offset$2, zIndex, showArrow) => {
const x = (0, vue.ref)();
const y = (0, vue.ref)();
const middlewareData = (0, vue.ref)({});
const states = {
x,
y,
placement,
strategy,
middlewareData
};
const middleware = (0, vue.computed)(() => {
const _middleware = [
offset((0, vue.unref)(offset$2)),
flip(),
shift(),
overflowMiddleware()
];
if ((0, vue.unref)(showArrow) && (0, vue.unref)(arrowRef)) _middleware.push(arrow({ element: (0, vue.unref)(arrowRef) }));
return _middleware;
});
const update = async () => {
if (!isClient) return;
const referenceEl = (0, vue.unref)(referenceRef);
const contentEl = (0, vue.unref)(contentRef);
if (!referenceEl || !contentEl) return;
const data = await computePosition(referenceEl, contentEl, {
placement: (0, vue.unref)(placement),
strategy: (0, vue.unref)(strategy),
middleware: (0, vue.unref)(middleware)
});
keysOf(states).forEach((key) => {
states[key].value = data[key];
});
};
const contentStyle = (0, vue.computed)(() => {
if (!(0, vue.unref)(referenceRef)) return {
position: "fixed",
top: "50%",
left: "50%",
transform: "translate3d(-50%, -50%, 0)",
maxWidth: "100vw",
zIndex: (0, vue.unref)(zIndex)
};
const { overflow } = (0, vue.unref)(middlewareData);
return {
position: (0, vue.unref)(strategy),
zIndex: (0, vue.unref)(zIndex),
top: (0, vue.unref)(y) != null ? `${(0, vue.unref)(y)}px` : "",
left: (0, vue.unref)(x) != null ? `${(0, vue.unref)(x)}px` : "",
maxWidth: overflow?.maxWidth ? `${overflow?.maxWidth}px` : ""
};
});
const arrowStyle = (0, vue.computed)(() => {
if (!(0, vue.unref)(showArrow)) return {};
const { arrow } = (0, vue.unref)(middlewareData);
return {
left: arrow?.x != null ? `${arrow?.x}px` : "",
top: arrow?.y != null ? `${arrow?.y}px` : ""
};
});
let cleanup;
(0, vue.onMounted)(() => {
const referenceEl = (0, vue.unref)(referenceRef);
const contentEl = (0, vue.unref)(contentRef);
if (referenceEl && contentEl) cleanup = autoUpdate(referenceEl, contentEl, update);
(0, vue.watchEffect)(() => {
update();
});
});
(0, vue.onBeforeUnmount)(() => {
cleanup && cleanup();
});
return {
update,
contentStyle,
arrowStyle
};
};
const overflowMiddleware = () => {
return {
name: "overflow",
async fn(state) {
const overflow = await detectOverflow(state);
let overWidth = 0;
if (overflow.left > 0) overWidth = overflow.left;
if (overflow.right > 0) overWidth = overflow.right;
return { data: { maxWidth: state.rects.floating.width - overWidth } };
}
};
};
//#endregion
//#region ../../packages/components/tour/src/mask.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$8 = { style: {
width: "100%",
height: "100%"
} };
const _hoisted_2$4 = ["d"];
var mask_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTourMask",
inheritAttrs: false,
__name: "mask",
props: maskProps,
setup(__props) {
const props = __props;
const { ns } = (0, vue.inject)(tourKey);
const radius = (0, vue.computed)(() => props.pos?.radius ?? 2);
const roundInfo = (0, vue.computed)(() => {
const v = radius.value;
const baseInfo = `a${v},${v} 0 0 1`;
return {
topRight: `${baseInfo} ${v},${v}`,
bottomRight: `${baseInfo} ${-v},${v}`,
bottomLeft: `${baseInfo} ${-v},${-v}`,
topLeft: `${baseInfo} ${v},${-v}`
};
});
const { width: windowWidth, height: windowHeight } = useWindowSize();
const path = (0, vue.computed)(() => {
const width = windowWidth.value;
const height = windowHeight.value;
const info = roundInfo.value;
const _path = `M${width},0 L0,0 L0,${height} L${width},${height} L${width},0 Z`;
const _radius = radius.value;
return props.pos ? `${_path} M${props.pos.left + _radius},${props.pos.top} h${props.pos.width - _radius * 2} ${info.topRight} v${props.pos.height - _radius * 2} ${info.bottomRight} h${-props.pos.width + _radius * 2} ${info.bottomLeft} v${-props.pos.height + _radius * 2} ${info.topLeft} z` : _path;
});
const maskStyle = (0, vue.computed)(() => ({
position: "fixed",
left: 0,
right: 0,
top: 0,
bottom: 0,
zIndex: props.zIndex,
pointerEvents: props.pos && props.targetAreaClickable ? "none" : "auto"
}));
const pathStyle = (0, vue.computed)(() => ({
fill: props.fill,
pointerEvents: "auto",
cursor: "auto"
}));
useLockscreen((0, vue.toRef)(props, "visible"), { ns });
return (_ctx, _cache) => {
return __props.visible ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", (0, vue.mergeProps)({
key: 0,
class: (0, vue.unref)(ns).e("mask"),
style: maskStyle.value
}, _ctx.$attrs), [((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$8, [(0, vue.createElementVNode)("path", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("hollow")),
style: (0, vue.normalizeStyle)(pathStyle.value),
d: path.value
}, null, 14, _hoisted_2$4)]))], 16)) : (0, vue.createCommentVNode)("v-if", true);
};
}
});
//#endregion
//#region ../../packages/components/tour/src/mask.vue
var mask_default = mask_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/tour/src/content.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$7 = ["data-side"];
var content_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTourContent",
__name: "content",
props: tourContentProps,
emits: tourContentEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const placement = (0, vue.ref)(props.placement);
const strategy = (0, vue.ref)(props.strategy);
const contentRef = (0, vue.ref)(null);
const arrowRef = (0, vue.ref)(null);
(0, vue.watch)(() => props.placement, () => {
placement.value = props.placement;
});
const { contentStyle, arrowStyle } = useFloating$1((0, vue.toRef)(props, "reference"), contentRef, arrowRef, placement, strategy, (0, vue.toRef)(props, "offset"), (0, vue.toRef)(props, "zIndex"), (0, vue.toRef)(props, "showArrow"));
const side = (0, vue.computed)(() => {
return placement.value.split("-")[0];
});
const { ns } = (0, vue.inject)(tourKey);
const onCloseRequested = () => {
emit("close");
};
const onFocusoutPrevented = (event) => {
if (event.detail.focusReason === "pointer") event.preventDefault();
};
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref_key: "contentRef",
ref: contentRef,
style: (0, vue.normalizeStyle)((0, vue.unref)(contentStyle)),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("content")),
"data-side": side.value,
tabindex: "-1"
}, [(0, vue.createVNode)((0, vue.unref)(focus_trap_default), {
loop: "",
trapped: "",
"focus-start-el": "container",
"focus-trap-el": contentRef.value || void 0,
onReleaseRequested: onCloseRequested,
onFocusoutPrevented
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 8, ["focus-trap-el"]), __props.showArrow ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: 0,
ref_key: "arrowRef",
ref: arrowRef,
style: (0, vue.normalizeStyle)((0, vue.unref)(arrowStyle)),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("arrow"))
}, null, 6)) : (0, vue.createCommentVNode)("v-if", true)], 14, _hoisted_1$7);
};
}
});
//#endregion
//#region ../../packages/components/tour/src/content.vue
var content_default$1 = content_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/tour/src/steps.ts
var steps_default = (0, vue.defineComponent)({
name: "ElTourSteps",
props: { current: {
type: Number,
default: 0
} },
emits: ["update-total"],
setup(props, { slots, emit }) {
let cacheTotal = 0;
return () => {
const children = slots.default?.();
const result = [];
let total = 0;
function filterSteps(children) {
if (!isArray$1(children)) return;
children.forEach((item) => {
if ((item?.type || {})?.name === "ElTourStep") {
result.push(item);
total += 1;
}
});
}
if (children.length) filterSteps(flattedChildren(children[0]?.children));
if (cacheTotal !== total) {
cacheTotal = total;
emit("update-total", total);
}
if (result.length) return result[props.current];
return null;
};
}
});
//#endregion
//#region ../../packages/components/tour/src/tour.vue?vue&type=script&setup=true&lang.ts
var tour_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTour",
inheritAttrs: false,
__name: "tour",
props: tourProps,
emits: tourEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const ns = useNamespace("tour");
const total = (0, vue.ref)(0);
const currentStep = (0, vue.ref)();
const current = useVModel(props, "current", emit, { passive: true });
const currentTarget = (0, vue.computed)(() => currentStep.value?.target);
const kls = (0, vue.computed)(() => [ns.b(), mergedType.value === "primary" ? ns.m("primary") : ""]);
const mergedPlacement = (0, vue.computed)(() => currentStep.value?.placement || props.placement);
const mergedContentStyle = (0, vue.computed)(() => currentStep.value?.contentStyle ?? props.contentStyle);
const mergedMask = (0, vue.computed)(() => currentStep.value?.mask ?? props.mask);
const mergedShowMask = (0, vue.computed)(() => !!mergedMask.value && props.modelValue);
const mergedMaskStyle = (0, vue.computed)(() => isBoolean(mergedMask.value) ? void 0 : mergedMask.value);
const mergedShowArrow = (0, vue.computed)(() => !!currentTarget.value && (currentStep.value?.showArrow ?? props.showArrow));
const mergedScrollIntoViewOptions = (0, vue.computed)(() => currentStep.value?.scrollIntoViewOptions ?? props.scrollIntoViewOptions);
const mergedType = (0, vue.computed)(() => currentStep.value?.type ?? props.type);
const { nextZIndex } = useZIndex();
const nowZIndex = nextZIndex();
const mergedZIndex = (0, vue.computed)(() => props.zIndex ?? nowZIndex);
const { mergedPosInfo: pos, triggerTarget } = useTarget(currentTarget, (0, vue.toRef)(props, "modelValue"), (0, vue.toRef)(props, "gap"), mergedMask, mergedScrollIntoViewOptions);
(0, vue.watch)(() => props.modelValue, (val) => {
if (!val) current.value = 0;
});
const onEscClose = () => {
if (props.closeOnPressEscape) {
emit(UPDATE_MODEL_EVENT, false);
emit("close", current.value);
}
};
const onUpdateTotal = (val) => {
total.value = val;
};
const slots = (0, vue.useSlots)();
(0, vue.provide)(tourKey, {
currentStep,
current,
total,
showClose: (0, vue.toRef)(props, "showClose"),
closeIcon: (0, vue.toRef)(props, "closeIcon"),
mergedType,
ns,
slots,
updateModelValue(modelValue) {
emit(UPDATE_MODEL_EVENT, modelValue);
},
onClose() {
emit("close", current.value);
},
onFinish() {
emit("finish");
},
onChange() {
emit(CHANGE_EVENT, current.value);
}
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, [
(0, vue.createVNode)((0, vue.unref)(ElTeleport), { to: __props.appendTo }, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", (0, vue.mergeProps)({ class: kls.value }, _ctx.$attrs), [(0, vue.createVNode)(mask_default, {
visible: mergedShowMask.value,
fill: mergedMaskStyle.value?.color,
style: (0, vue.normalizeStyle)(mergedMaskStyle.value?.style),
pos: (0, vue.unref)(pos),
"z-index": mergedZIndex.value,
"target-area-clickable": __props.targetAreaClickable
}, null, 8, [
"visible",
"fill",
"style",
"pos",
"z-index",
"target-area-clickable"
]), __props.modelValue ? ((0, vue.openBlock)(), (0, vue.createBlock)(content_default$1, {
key: (0, vue.unref)(current),
reference: (0, vue.unref)(triggerTarget),
placement: mergedPlacement.value,
"show-arrow": mergedShowArrow.value,
"z-index": mergedZIndex.value,
style: (0, vue.normalizeStyle)(mergedContentStyle.value),
onClose: onEscClose
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(steps_default), {
current: (0, vue.unref)(current),
onUpdateTotal
}, {
default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),
_: 3
}, 8, ["current"])]),
_: 3
}, 8, [
"reference",
"placement",
"show-arrow",
"z-index",
"style"
])) : (0, vue.createCommentVNode)("v-if", true)], 16)]),
_: 3
}, 8, ["to"]),
(0, vue.createCommentVNode)(" just for IDE "),
(0, vue.createCommentVNode)("v-if", true)
], 64);
};
}
});
//#endregion
//#region ../../packages/components/tour/src/tour.vue
var tour_default = tour_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/tour/src/step.ts
/**
* @deprecated Removed after 3.0.0, Use `TourStepProps` instead.
*/
const tourStepProps = buildProps({
target: { type: definePropType([
String,
Object,
Function
]) },
title: String,
description: String,
showClose: {
type: Boolean,
default: void 0
},
closeIcon: { type: iconPropType },
showArrow: {
type: Boolean,
default: void 0
},
placement: tourContentProps.placement,
mask: {
type: definePropType([Boolean, Object]),
default: void 0
},
contentStyle: { type: definePropType([Object]) },
prevButtonProps: { type: definePropType(Object) },
nextButtonProps: { type: definePropType(Object) },
scrollIntoViewOptions: {
type: definePropType([Boolean, Object]),
default: void 0
},
type: { type: definePropType(String) }
});
const tourStepEmits = { close: () => true };
//#endregion
//#region ../../packages/components/tour/src/step.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$6 = ["aria-label"];
var step_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElTourStep",
__name: "step",
props: tourStepProps,
emits: tourStepEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const { Close } = CloseComponents;
const { t } = useLocale();
const { currentStep, current, total, showClose, closeIcon, mergedType, ns, slots: tourSlots, updateModelValue, onClose: tourOnClose, onFinish: tourOnFinish, onChange } = (0, vue.inject)(tourKey);
(0, vue.watch)(props, (val) => {
currentStep.value = val;
}, { immediate: true });
const mergedShowClose = (0, vue.computed)(() => props.showClose ?? showClose.value);
const mergedCloseIcon = (0, vue.computed)(() => props.closeIcon ?? closeIcon.value ?? Close);
const filterButtonProps = (btnProps) => {
if (!btnProps) return;
return omit(btnProps, ["children", "onClick"]);
};
const onPrev = () => {
current.value -= 1;
if (props.prevButtonProps?.onClick) props.prevButtonProps?.onClick();
onChange();
};
const onNext = () => {
if (current.value >= total.value - 1) onFinish();
else current.value += 1;
if (props.nextButtonProps?.onClick) props.nextButtonProps.onClick();
onChange();
};
const onFinish = () => {
onClose();
tourOnFinish();
};
const onClose = () => {
updateModelValue(false);
tourOnClose();
emit("close");
};
const handleKeydown = (e) => {
if (e.target?.isContentEditable) return;
switch (getEventCode(e)) {
case EVENT_CODE.left:
e.preventDefault();
current.value > 0 && onPrev();
break;
case EVENT_CODE.right:
e.preventDefault();
onNext();
break;
}
};
(0, vue.onMounted)(() => {
window.addEventListener("keydown", handleKeydown);
});
(0, vue.onBeforeUnmount)(() => {
window.removeEventListener("keydown", handleKeydown);
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, [
mergedShowClose.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key: 0,
"aria-label": (0, vue.unref)(t)("el.tour.close"),
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("closebtn")),
type: "button",
onClick: onClose
}, [(0, vue.createVNode)((0, vue.unref)(ElIcon), { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("close")) }, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(mergedCloseIcon.value)))]),
_: 1
}, 8, ["class"])], 10, _hoisted_1$6)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("header", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("header"), { "show-close": (0, vue.unref)(showClose) }]) }, [(0, vue.renderSlot)(_ctx.$slots, "header", {}, () => [(0, vue.createElementVNode)("span", {
role: "heading",
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("title"))
}, (0, vue.toDisplayString)(__props.title), 3)])], 2),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("body")) }, [(0, vue.renderSlot)(_ctx.$slots, "default", {}, () => [(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(__props.description), 1)])], 2),
(0, vue.createElementVNode)("footer", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("footer")) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).b("indicators")) }, [(0, vue.unref)(tourSlots).indicators ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tourSlots).indicators), {
key: 0,
current: (0, vue.unref)(current),
total: (0, vue.unref)(total)
}, null, 8, ["current", "total"])) : ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, (0, vue.renderList)((0, vue.unref)(total), (item, index) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
key: item,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).b("indicator"), (0, vue.unref)(ns).is("active", index === (0, vue.unref)(current))])
}, null, 2);
}), 128))], 2), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).b("buttons")) }, [(0, vue.unref)(current) > 0 ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElButton), (0, vue.mergeProps)({
key: 0,
size: "small",
type: (0, vue.unref)(mergedType)
}, filterButtonProps(__props.prevButtonProps), { onClick: onPrev }), {
default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.prevButtonProps?.children ?? (0, vue.unref)(t)("el.tour.previous")), 1)]),
_: 1
}, 16, ["type"])) : (0, vue.createCommentVNode)("v-if", true), (0, vue.unref)(current) <= (0, vue.unref)(total) - 1 ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElButton), (0, vue.mergeProps)({
key: 1,
size: "small",
type: (0, vue.unref)(mergedType) === "primary" ? "default" : "primary"
}, filterButtonProps(__props.nextButtonProps), { onClick: onNext }), {
default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.nextButtonProps?.children ?? ((0, vue.unref)(current) === (0, vue.unref)(total) - 1 ? (0, vue.unref)(t)("el.tour.finish") : (0, vue.unref)(t)("el.tour.next"))), 1)]),
_: 1
}, 16, ["type"])) : (0, vue.createCommentVNode)("v-if", true)], 2)], 2)
], 64);
};
}
});
//#endregion
//#region ../../packages/components/tour/src/step.vue
var step_default = step_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/tour/index.ts
const ElTour = withInstall(tour_default, { TourStep: step_default });
const ElTourStep = withNoopInstall(step_default);
//#endregion
//#region ../../packages/components/anchor/src/anchor.ts
/**
* @deprecated Removed after 3.0.0, Use `AnchorProps` instead.
*/
const anchorProps = buildProps({
container: { type: definePropType([String, Object]) },
offset: {
type: Number,
default: 0
},
bound: {
type: Number,
default: 15
},
duration: {
type: Number,
default: 300
},
marker: {
type: Boolean,
default: true
},
type: {
type: definePropType(String),
default: "default"
},
direction: {
type: definePropType(String),
default: "vertical"
},
selectScrollTop: Boolean
});
const anchorEmits = {
change: (href) => isString(href),
click: (e, href) => e instanceof MouseEvent && (isString(href) || isUndefined(href))
};
//#endregion
//#region ../../packages/components/anchor/src/constants.ts
const anchorKey = Symbol("anchor");
//#endregion
//#region ../../packages/components/anchor/src/anchor.vue?vue&type=script&setup=true&lang.ts
var anchor_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElAnchor",
__name: "anchor",
props: anchorProps,
emits: anchorEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const slots = (0, vue.useSlots)();
const currentAnchor = (0, vue.ref)("");
const markerStyle = (0, vue.ref)({});
const anchorRef = (0, vue.ref)(null);
const markerRef = (0, vue.ref)(null);
const containerEl = (0, vue.ref)();
const links = {};
let isScrolling = false;
let currentScrollTop = 0;
const ns = useNamespace("anchor");
const cls = (0, vue.computed)(() => [
ns.b(),
props.type === "underline" ? ns.m("underline") : "",
ns.m(props.direction)
]);
const addLink = (state) => {
links[state.href] = state.el;
};
const removeLink = (href) => {
delete links[href];
};
const setCurrentAnchor = (href) => {
if (currentAnchor.value !== href) {
currentAnchor.value = href;
emit(CHANGE_EVENT, href);
}
};
let clearAnimate = null;
let currentTargetHref = "";
const scrollToAnchor = (href) => {
if (!containerEl.value) return;
const target = getElement(href);
if (!target) return;
if (clearAnimate) {
if (currentTargetHref === href) return;
clearAnimate();
}
currentTargetHref = href;
isScrolling = true;
const scrollEle = getScrollElement(target, containerEl.value);
const distance = getOffsetTopDistance(target, scrollEle);
const max = scrollEle.scrollHeight - scrollEle.clientHeight;
const to = Math.min(distance - props.offset, max);
clearAnimate = animateScrollTo(containerEl.value, currentScrollTop, to, props.duration, () => {
setTimeout(() => {
isScrolling = false;
currentTargetHref = "";
}, 20);
});
};
const scrollTo = (href) => {
if (href) {
setCurrentAnchor(href);
scrollToAnchor(href);
}
};
const handleClick = (e, href) => {
emit("click", e, href);
scrollTo(href);
};
const handleScroll = throttleByRaf(() => {
if (containerEl.value) currentScrollTop = getScrollTop(containerEl.value);
const currentHref = getCurrentHref();
if (isScrolling || isUndefined(currentHref)) return;
setCurrentAnchor(currentHref);
});
const getCurrentHref = () => {
if (!containerEl.value) return;
const scrollTop = getScrollTop(containerEl.value);
const anchorTopList = [];
for (const href of Object.keys(links)) {
const target = getElement(href);
if (!target) continue;
const distance = getOffsetTopDistance(target, getScrollElement(target, containerEl.value));
anchorTopList.push({
top: distance - props.offset - props.bound,
href
});
}
anchorTopList.sort((prev, next) => prev.top - next.top);
for (let i = 0; i < anchorTopList.length; i++) {
const item = anchorTopList[i];
const next = anchorTopList[i + 1];
if (i === 0 && scrollTop === 0) return props.selectScrollTop ? item.href : "";
if (item.top <= scrollTop && (!next || next.top > scrollTop)) return item.href;
}
};
const getContainer = () => {
const el = getElement(props.container);
if (!el || isWindow(el)) containerEl.value = window;
else containerEl.value = el;
};
useEventListener(containerEl, "scroll", handleScroll);
const updateMarkerStyle = () => {
(0, vue.nextTick)(() => {
if (!anchorRef.value || !markerRef.value || !currentAnchor.value) {
markerStyle.value = {};
return;
}
const currentLinkEl = links[currentAnchor.value];
if (!currentLinkEl) {
markerStyle.value = {};
return;
}
const anchorRect = anchorRef.value.getBoundingClientRect();
const markerRect = markerRef.value.getBoundingClientRect();
const linkRect = currentLinkEl.getBoundingClientRect();
if (props.direction === "horizontal") markerStyle.value = {
left: `${linkRect.left - anchorRect.left}px`,
width: `${linkRect.width}px`,
opacity: 1
};
else markerStyle.value = {
top: `${linkRect.top - anchorRect.top + (linkRect.height - markerRect.height) / 2}px`,
opacity: 1
};
});
};
(0, vue.watch)(currentAnchor, updateMarkerStyle);
(0, vue.watch)(() => slots.default?.(), updateMarkerStyle);
(0, vue.onMounted)(() => {
getContainer();
const hash = decodeURIComponent(window.location.hash);
if (getElement(hash)) scrollTo(hash);
else handleScroll();
});
(0, vue.watch)(() => props.container, () => {
getContainer();
});
(0, vue.provide)(anchorKey, {
ns,
direction: props.direction,
currentAnchor,
addLink,
removeLink,
handleClick
});
__expose({ scrollTo });
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref_key: "anchorRef",
ref: anchorRef,
class: (0, vue.normalizeClass)(cls.value)
}, [__props.marker ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
ref_key: "markerRef",
ref: markerRef,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("marker")),
style: (0, vue.normalizeStyle)(markerStyle.value)
}, null, 6)) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("list")) }, [(0, vue.renderSlot)(_ctx.$slots, "default")], 2)], 2);
};
}
});
//#endregion
//#region ../../packages/components/anchor/src/anchor.vue
var anchor_default = anchor_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/anchor/src/anchor-link.ts
/**
* @deprecated Removed after 3.0.0, Use `AnchorLinkProps` instead.
*/
const anchorLinkProps = buildProps({
title: String,
href: String
});
//#endregion
//#region ../../packages/components/anchor/src/anchor-link.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$5 = ["href"];
var anchor_link_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElAnchorLink",
__name: "anchor-link",
props: anchorLinkProps,
setup(__props) {
const props = __props;
const linkRef = (0, vue.ref)(null);
const { ns, direction, currentAnchor, addLink, removeLink, handleClick: contextHandleClick } = (0, vue.inject)(anchorKey);
const cls = (0, vue.computed)(() => [ns.e("link"), ns.is("active", currentAnchor.value === props.href)]);
const handleClick = (e) => {
contextHandleClick(e, props.href);
};
(0, vue.watch)(() => props.href, (val, oldVal) => {
(0, vue.nextTick)(() => {
if (oldVal) removeLink(oldVal);
if (val) addLink({
href: val,
el: linkRef.value
});
});
});
(0, vue.onMounted)(() => {
const { href } = props;
if (href) addLink({
href,
el: linkRef.value
});
});
(0, vue.onBeforeUnmount)(() => {
const { href } = props;
if (href) removeLink(href);
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("item")) }, [(0, vue.createElementVNode)("a", {
ref_key: "linkRef",
ref: linkRef,
class: (0, vue.normalizeClass)(cls.value),
href: __props.href,
onClick: handleClick
}, [(0, vue.renderSlot)(_ctx.$slots, "default", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.title), 1)])], 10, _hoisted_1$5), _ctx.$slots["sub-link"] && (0, vue.unref)(direction) === "vertical" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("list"))
}, [(0, vue.renderSlot)(_ctx.$slots, "sub-link")], 2)) : (0, vue.createCommentVNode)("v-if", true)], 2);
};
}
});
//#endregion
//#region ../../packages/components/anchor/src/anchor-link.vue
var anchor_link_default = anchor_link_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/anchor/index.ts
const ElAnchor = withInstall(anchor_default, { AnchorLink: anchor_link_default });
const ElAnchorLink = withNoopInstall(anchor_link_default);
//#endregion
//#region ../../packages/components/segmented/src/segmented.ts
const defaultProps = {
label: "label",
value: "value",
disabled: "disabled"
};
/**
* @deprecated Removed after 3.0.0, Use `SegmentedProps` instead.
*/
const segmentedProps = buildProps({
direction: {
type: definePropType(String),
default: "horizontal"
},
options: {
type: definePropType(Array),
default: () => []
},
modelValue: {
type: [
String,
Number,
Boolean
],
default: void 0
},
props: {
type: definePropType(Object),
default: () => defaultProps
},
block: Boolean,
size: useSizeProp,
disabled: {
type: Boolean,
default: void 0
},
validateEvent: {
type: Boolean,
default: true
},
id: String,
name: String,
...useAriaProps(["ariaLabel"])
});
const segmentedEmits = {
[UPDATE_MODEL_EVENT]: (val) => isString(val) || isNumber(val) || isBoolean(val),
[CHANGE_EVENT]: (val) => isString(val) || isNumber(val) || isBoolean(val)
};
//#endregion
//#region ../../packages/components/segmented/src/segmented.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$4 = [
"id",
"aria-label",
"aria-labelledby"
];
const _hoisted_2$3 = [
"name",
"disabled",
"checked",
"onChange"
];
var segmented_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElSegmented",
__name: "segmented",
props: segmentedProps,
emits: segmentedEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const ns = useNamespace("segmented");
const segmentedId = useId();
const segmentedSize = useFormSize();
const _disabled = useFormDisabled();
const { formItem } = useFormItem();
const { inputId, isLabeledByFormItem } = useFormItemInputId(props, { formItemContext: formItem });
const segmentedRef = (0, vue.ref)(null);
const activeElement = useActiveElement();
const state = (0, vue.reactive)({
isInit: false,
width: 0,
height: 0,
translateX: 0,
translateY: 0,
focusVisible: false
});
const handleChange = (evt, item) => {
const value = getValue(item);
emit(UPDATE_MODEL_EVENT, value);
emit(CHANGE_EVENT, value);
evt.target.checked = value === props.modelValue;
};
const aliasProps = (0, vue.computed)(() => ({
...defaultProps,
...props.props
}));
const getValue = (item) => {
return isObject$1(item) ? item[aliasProps.value.value] : item;
};
const getLabel = (item) => {
return isObject$1(item) ? item[aliasProps.value.label] : item;
};
const getDisabled = (item) => {
return !!(_disabled.value || (isObject$1(item) ? item[aliasProps.value.disabled] : false));
};
const getSelected = (item) => {
return props.modelValue === getValue(item);
};
const getOption = (value) => {
return props.options.find((item) => getValue(item) === value);
};
const getItemCls = (item) => {
return [
ns.e("item"),
ns.is("selected", getSelected(item)),
ns.is("disabled", getDisabled(item))
];
};
const updateSelect = () => {
if (!segmentedRef.value) return;
const selectedItem = segmentedRef.value.querySelector(".is-selected");
const selectedItemInput = segmentedRef.value.querySelector(".is-selected input");
if (!selectedItem || !selectedItemInput) {
state.width = 0;
state.height = 0;
state.translateX = 0;
state.translateY = 0;
state.focusVisible = false;
return;
}
state.isInit = true;
if (props.direction === "vertical") {
state.height = selectedItem.offsetHeight;
state.translateY = selectedItem.offsetTop;
} else {
state.width = selectedItem.offsetWidth;
state.translateX = selectedItem.offsetLeft;
}
try {
state.focusVisible = selectedItemInput.matches(":focus-visible");
} catch {}
};
const segmentedCls = (0, vue.computed)(() => [
ns.b(),
ns.m(segmentedSize.value),
ns.is("block", props.block)
]);
const selectedStyle = (0, vue.computed)(() => ({
width: props.direction === "vertical" ? "100%" : `${state.width}px`,
height: props.direction === "vertical" ? `${state.height}px` : "100%",
transform: props.direction === "vertical" ? `translateY(${state.translateY}px)` : `translateX(${state.translateX}px)`,
display: state.isInit ? "block" : "none"
}));
const selectedCls = (0, vue.computed)(() => [
ns.e("item-selected"),
ns.is("disabled", getDisabled(getOption(props.modelValue))),
ns.is("focus-visible", state.focusVisible)
]);
const name = (0, vue.computed)(() => {
return props.name || segmentedId.value;
});
useResizeObserver(segmentedRef, updateSelect);
(0, vue.watch)(activeElement, updateSelect);
(0, vue.watch)(() => props.modelValue, () => {
updateSelect();
if (props.validateEvent) formItem?.validate?.("change").catch((err) => /* @__PURE__ */ debugWarn(err));
}, { flush: "post" });
return (_ctx, _cache) => {
return __props.options.length ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
id: (0, vue.unref)(inputId),
ref_key: "segmentedRef",
ref: segmentedRef,
class: (0, vue.normalizeClass)(segmentedCls.value),
role: "radiogroup",
"aria-label": !(0, vue.unref)(isLabeledByFormItem) ? __props.ariaLabel || "segmented" : void 0,
"aria-labelledby": (0, vue.unref)(isLabeledByFormItem) ? (0, vue.unref)(formItem).labelId : void 0
}, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("group"), (0, vue.unref)(ns).m(__props.direction)]) }, [(0, vue.createElementVNode)("div", {
style: (0, vue.normalizeStyle)(selectedStyle.value),
class: (0, vue.normalizeClass)(selectedCls.value)
}, null, 6), ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.options, (item, index) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("label", {
key: index,
class: (0, vue.normalizeClass)(getItemCls(item))
}, [(0, vue.createElementVNode)("input", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("item-input")),
type: "radio",
name: name.value,
disabled: getDisabled(item),
checked: getSelected(item),
onChange: ($event) => handleChange($event, item)
}, null, 42, _hoisted_2$3), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("item-label")) }, [(0, vue.renderSlot)(_ctx.$slots, "default", { item }, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(getLabel(item)), 1)])], 2)], 2);
}), 128))], 2)], 10, _hoisted_1$4)) : (0, vue.createCommentVNode)("v-if", true);
};
}
});
//#endregion
//#region ../../packages/components/segmented/src/segmented.vue
var segmented_default = segmented_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/segmented/index.ts
const ElSegmented = withInstall(segmented_default);
//#endregion
//#region ../../packages/components/mention/src/helper.ts
const filterOption = (pattern, option) => {
const lowerCase = pattern.toLowerCase();
return (option.label || option.value || "").toLowerCase().includes(lowerCase);
};
const getMentionCtx = (inputEl, prefix, split) => {
const { selectionEnd } = inputEl;
if (selectionEnd === null) return;
const inputValue = inputEl.value;
const prefixArray = castArray$1(prefix);
let splitIndex = -1;
let mentionCtx;
for (let i = selectionEnd - 1; i >= 0; --i) {
const char = inputValue[i];
if (splitIndex === -1 && (char === split || char === "\n" || char === "\r")) {
splitIndex = i;
continue;
}
if (prefixArray.includes(char)) {
const end = splitIndex === -1 ? selectionEnd : splitIndex;
mentionCtx = {
pattern: inputValue.slice(i + 1, end),
start: i + 1,
end,
prefix: char,
prefixIndex: i,
splitIndex,
selectionEnd
};
break;
}
}
return mentionCtx;
};
/**
* fork from textarea-caret-position
* https://github.com/component/textarea-caret-position
* The MIT License (MIT)
* Copyright (c) 2015 Jonathan Ong me@jongleberry.com
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
* The above copyright notice and this permission notice shall be included in all
* copies or substantial portions of the Software.
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
* SOFTWARE.
*/
const getCursorPosition = (element, options = {
debug: false,
useSelectionEnd: false
}) => {
const selectionStart = element.selectionStart !== null ? element.selectionStart : 0;
const selectionEnd = element.selectionEnd !== null ? element.selectionEnd : 0;
const position = options.useSelectionEnd ? selectionEnd : selectionStart;
const properties = [
"direction",
"boxSizing",
"width",
"height",
"overflowX",
"overflowY",
"borderTopWidth",
"borderRightWidth",
"borderBottomWidth",
"borderLeftWidth",
"borderStyle",
"paddingTop",
"paddingRight",
"paddingBottom",
"paddingLeft",
"fontStyle",
"fontVariant",
"fontWeight",
"fontStretch",
"fontSize",
"fontSizeAdjust",
"lineHeight",
"fontFamily",
"textAlign",
"textTransform",
"textIndent",
"textDecoration",
"letterSpacing",
"wordSpacing",
"tabSize",
"MozTabSize"
];
if (options.debug) {
const el = document.querySelector("#input-textarea-caret-position-mirror-div");
if (el?.parentNode) el.parentNode.removeChild(el);
}
const div = document.createElement("div");
div.id = "input-textarea-caret-position-mirror-div";
document.body.appendChild(div);
const style = div.style;
const computed = window.getComputedStyle(element);
const isInput = element.nodeName === "INPUT";
style.whiteSpace = isInput ? "nowrap" : "pre-wrap";
if (!isInput) style.wordWrap = "break-word";
style.position = "absolute";
if (!options.debug) style.visibility = "hidden";
properties.forEach((prop) => {
if (isInput && prop === "lineHeight") if (computed.boxSizing === "border-box") {
const height = Number.parseInt(computed.height);
const outerHeight = Number.parseInt(computed.paddingTop) + Number.parseInt(computed.paddingBottom) + Number.parseInt(computed.borderTopWidth) + Number.parseInt(computed.borderBottomWidth);
const targetHeight = outerHeight + Number.parseInt(computed.lineHeight);
if (height > targetHeight) style.lineHeight = `${height - outerHeight}px`;
else if (height === targetHeight) style.lineHeight = computed.lineHeight;
else style.lineHeight = "0";
} else style.lineHeight = computed.height;
else style[prop] = computed[prop];
});
if (isFirefox()) {
if (element.scrollHeight > Number.parseInt(computed.height)) style.overflowY = "scroll";
} else style.overflow = "hidden";
div.textContent = element.value.slice(0, Math.max(0, position));
if (isInput && div.textContent) div.textContent = div.textContent.replace(/\s/g, "\xA0");
const span = document.createElement("span");
span.textContent = element.value.slice(Math.max(0, position)) || ".";
span.style.position = "relative";
span.style.left = `${-element.scrollLeft}px`;
span.style.top = `${-element.scrollTop}px`;
div.appendChild(span);
const relativePosition = {
top: span.offsetTop + Number.parseInt(computed.borderTopWidth),
left: span.offsetLeft + Number.parseInt(computed.borderLeftWidth),
height: Number.parseInt(computed.fontSize) * 1.5
};
if (options.debug) span.style.backgroundColor = "#aaa";
else document.body.removeChild(div);
if (relativePosition.left >= element.clientWidth) relativePosition.left = element.clientWidth;
return relativePosition;
};
//#endregion
//#region ../../packages/components/mention/src/mention.ts
/**
* @deprecated Removed after 3.0.0, Use `MentionProps` instead.
*/
const mentionProps = buildProps({
...inputProps,
options: {
type: definePropType(Array),
default: () => []
},
prefix: {
type: definePropType([String, Array]),
default: "@",
validator: (val) => {
if (isString(val)) return val.length === 1;
return val.every((v) => isString(v) && v.length === 1);
}
},
split: {
type: String,
default: " ",
validator: (val) => val.length === 1
},
filterOption: {
type: definePropType([Boolean, Function]),
default: () => filterOption,
validator: (val) => {
if (val === false) return true;
return isFunction$1(val);
}
},
placement: {
type: definePropType(String),
default: "bottom"
},
showArrow: Boolean,
offset: {
type: Number,
default: 0
},
whole: Boolean,
checkIsWhole: { type: definePropType(Function) },
modelValue: String,
loading: Boolean,
popperClass: useTooltipContentProps.popperClass,
popperStyle: useTooltipContentProps.popperStyle,
popperOptions: {
type: definePropType(Object),
default: () => ({})
},
props: {
type: definePropType(Object),
default: () => mentionDefaultProps
}
});
const mentionEmits = {
[UPDATE_MODEL_EVENT]: (value) => isString(value),
"whole-remove": (pattern, prefix) => isString(pattern) && isString(prefix),
input: (value) => isString(value),
search: (pattern, prefix) => isString(pattern) && isString(prefix),
select: (option, prefix) => isObject$1(option) && isString(prefix),
focus: (evt) => evt instanceof FocusEvent,
blur: (evt) => evt instanceof FocusEvent
};
const mentionDefaultProps = {
value: "value",
label: "label",
disabled: "disabled"
};
//#endregion
//#region ../../packages/components/mention/src/mention-dropdown.ts
/**
* @deprecated Removed after 3.0.0, Use `MentionDropdownProps` instead.
*/
const mentionDropdownProps = buildProps({
options: {
type: definePropType(Array),
default: () => []
},
loading: Boolean,
disabled: Boolean,
contentId: String,
ariaLabel: String
});
const mentionDropdownEmits = { select: (option) => isString(option.value) };
//#endregion
//#region ../../packages/components/mention/src/mention-dropdown.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$3 = [
"id",
"aria-disabled",
"aria-selected",
"onMousemove",
"onClick"
];
var mention_dropdown_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElMentionDropdown",
__name: "mention-dropdown",
props: mentionDropdownProps,
emits: mentionDropdownEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const ns = useNamespace("mention");
const { t } = useLocale();
const hoveringIndex = (0, vue.ref)(-1);
const scrollbarRef = (0, vue.ref)();
const optionRefs = (0, vue.ref)();
const dropdownRef = (0, vue.ref)();
const optionkls = (item, index) => [
ns.be("dropdown", "item"),
ns.is("hovering", hoveringIndex.value === index),
ns.is("disabled", item.disabled || props.disabled)
];
const handleSelect = (item) => {
if (item.disabled || props.disabled) return;
emit("select", item);
};
const handleMouseEnter = (index) => {
hoveringIndex.value = index;
};
const filteredAllDisabled = (0, vue.computed)(() => props.disabled || props.options.every((item) => item.disabled));
const hoverOption = (0, vue.computed)(() => props.options[hoveringIndex.value]);
const selectHoverOption = () => {
if (!hoverOption.value || hoverOption.value.disabled || props.disabled) return;
emit("select", hoverOption.value);
};
const navigateOptions = (direction) => {
const { options } = props;
if (options.length === 0 || filteredAllDisabled.value) return;
if (direction === "next") {
hoveringIndex.value++;
if (hoveringIndex.value === options.length) hoveringIndex.value = 0;
} else if (direction === "prev") {
hoveringIndex.value--;
if (hoveringIndex.value < 0) hoveringIndex.value = options.length - 1;
}
const option = options[hoveringIndex.value];
if (option.disabled) {
navigateOptions(direction);
return;
}
(0, vue.nextTick)(() => scrollToOption(option));
};
const scrollToOption = (option) => {
const { options } = props;
const index = options.findIndex((item) => item.value === option.value);
const target = optionRefs.value?.[index];
if (target) {
const menu = dropdownRef.value?.querySelector?.(`.${ns.be("dropdown", "wrap")}`);
if (menu) scrollIntoView(menu, target);
}
scrollbarRef.value?.handleScroll();
};
const resetHoveringIndex = () => {
if (filteredAllDisabled.value || props.options.length === 0) hoveringIndex.value = -1;
else hoveringIndex.value = props.options.findIndex((item) => !item.disabled);
};
(0, vue.watch)(() => props.options, resetHoveringIndex, { immediate: true });
__expose({
hoveringIndex,
navigateOptions,
selectHoverOption,
hoverOption
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref_key: "dropdownRef",
ref: dropdownRef,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b("dropdown"))
}, [
_ctx.$slots.header ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("dropdown", "header"))
}, [(0, vue.renderSlot)(_ctx.$slots, "header")], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.withDirectives)((0, vue.createVNode)((0, vue.unref)(ElScrollbar), {
id: __props.contentId,
ref_key: "scrollbarRef",
ref: scrollbarRef,
tag: "ul",
"wrap-class": (0, vue.unref)(ns).be("dropdown", "wrap"),
"view-class": (0, vue.unref)(ns).be("dropdown", "list"),
role: "listbox",
"aria-label": __props.ariaLabel,
"aria-orientation": "vertical"
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.options, (item, index) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
id: `${__props.contentId}-${index}`,
ref_for: true,
ref_key: "optionRefs",
ref: optionRefs,
key: index,
class: (0, vue.normalizeClass)(optionkls(item, index)),
role: "option",
"aria-disabled": item.disabled || __props.disabled || void 0,
"aria-selected": hoveringIndex.value === index,
onMousemove: ($event) => handleMouseEnter(index),
onClick: (0, vue.withModifiers)(($event) => handleSelect(item), ["stop"])
}, [(0, vue.renderSlot)(_ctx.$slots, "label", {
item,
index
}, () => [(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(item.label ?? item.value), 1)])], 42, _hoisted_1$3);
}), 128))]),
_: 3
}, 8, [
"id",
"wrap-class",
"view-class",
"aria-label"
]), [[vue.vShow, __props.options.length > 0 && !__props.loading]]),
__props.loading ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("dropdown", "loading"))
}, [(0, vue.renderSlot)(_ctx.$slots, "loading", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(t)("el.mention.loading")), 1)])], 2)) : (0, vue.createCommentVNode)("v-if", true),
_ctx.$slots.footer ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 2,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).be("dropdown", "footer"))
}, [(0, vue.renderSlot)(_ctx.$slots, "footer")], 2)) : (0, vue.createCommentVNode)("v-if", true)
], 2);
};
}
});
//#endregion
//#region ../../packages/components/mention/src/mention-dropdown.vue
var mention_dropdown_default = mention_dropdown_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/mention/src/mention.vue?vue&type=script&setup=true&lang.ts
var mention_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElMention",
inheritAttrs: false,
__name: "mention",
props: mentionProps,
emits: mentionEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const passInputProps = (0, vue.computed)(() => {
const inputProps = ElInput.props ?? [];
return pick(props, isArray$1(inputProps) ? inputProps : Object.keys(inputProps));
});
const ns = useNamespace("mention");
const disabled = useFormDisabled();
const contentId = useId();
const elInputRef = (0, vue.ref)();
const tooltipRef = (0, vue.ref)();
const dropdownRef = (0, vue.ref)();
const visible = (0, vue.ref)(false);
const cursorStyle = (0, vue.ref)();
const mentionCtx = (0, vue.ref)();
const computedPlacement = (0, vue.computed)(() => props.showArrow ? props.placement : `${props.placement}-start`);
const computedFallbackPlacements = (0, vue.computed)(() => props.showArrow ? ["bottom", "top"] : ["bottom-start", "top-start"]);
const aliasProps = (0, vue.computed)(() => ({
...mentionDefaultProps,
...props.props
}));
const mapOption = (option) => {
const base = {
label: option[aliasProps.value.label],
value: option[aliasProps.value.value],
disabled: option[aliasProps.value.disabled]
};
return {
...option,
...base
};
};
const options = (0, vue.computed)(() => props.options.map(mapOption));
const filteredOptions = (0, vue.computed)(() => {
const { filterOption } = props;
if (!mentionCtx.value || !filterOption) return options.value;
return options.value.filter((option) => filterOption(mentionCtx.value.pattern, option));
});
const dropdownVisible = (0, vue.computed)(() => {
return visible.value && (!!filteredOptions.value.length || props.loading);
});
const hoveringId = (0, vue.computed)(() => {
return `${contentId.value}-${dropdownRef.value?.hoveringIndex}`;
});
const handleInputChange = (value) => {
emit(UPDATE_MODEL_EVENT, value);
emit(INPUT_EVENT, value);
syncAfterCursorMove();
};
const handleInputKeyDown = (event) => {
if (elInputRef.value?.isComposing) return;
const code = getEventCode(event);
switch (code) {
case EVENT_CODE.left:
case EVENT_CODE.right:
syncAfterCursorMove();
break;
case EVENT_CODE.up:
case EVENT_CODE.down:
if (!visible.value) return;
event.preventDefault();
dropdownRef.value?.navigateOptions(code === EVENT_CODE.up ? "prev" : "next");
break;
case EVENT_CODE.enter:
case EVENT_CODE.numpadEnter:
if (!visible.value) {
props.type !== "textarea" && syncAfterCursorMove();
return;
}
event.preventDefault();
if (dropdownRef.value?.hoverOption) dropdownRef.value?.selectHoverOption();
else visible.value = false;
break;
case EVENT_CODE.esc:
if (!visible.value) return;
event.preventDefault();
visible.value = false;
break;
case EVENT_CODE.backspace: if (props.whole && mentionCtx.value) {
const { splitIndex, selectionEnd, pattern, prefixIndex, prefix } = mentionCtx.value;
const inputEl = getInputEl();
if (!inputEl) return;
const inputValue = inputEl.value;
const matchOption = options.value.find((item) => item.value === pattern);
if ((isFunction$1(props.checkIsWhole) ? props.checkIsWhole(pattern, prefix) : matchOption) && splitIndex !== -1 && splitIndex + 1 === selectionEnd) {
event.preventDefault();
const newValue = inputValue.slice(0, prefixIndex) + inputValue.slice(splitIndex + 1);
emit(UPDATE_MODEL_EVENT, newValue);
emit(INPUT_EVENT, newValue);
emit("whole-remove", pattern, prefix);
const newSelectionEnd = prefixIndex;
(0, vue.nextTick)(() => {
inputEl.selectionStart = newSelectionEnd;
inputEl.selectionEnd = newSelectionEnd;
syncDropdownVisible();
});
}
}
}
};
const { wrapperRef } = useFocusController(elInputRef, {
disabled,
afterFocus() {
syncAfterCursorMove();
},
beforeBlur(event) {
return tooltipRef.value?.isFocusInsideContent(event);
},
afterBlur() {
visible.value = false;
}
});
const handleInputMouseDown = () => {
syncAfterCursorMove();
};
const getOriginalOption = (mentionOption) => {
return props.options.find((option) => {
return mentionOption.value === option[aliasProps.value.value];
});
};
const handleSelect = (item) => {
if (!mentionCtx.value) return;
const inputEl = getInputEl();
if (!inputEl) return;
const inputValue = inputEl.value;
const { split } = props;
const newEndPart = inputValue.slice(mentionCtx.value.end);
const alreadySeparated = newEndPart.startsWith(split);
const newMiddlePart = `${item.value}${alreadySeparated ? "" : split}`;
const newValue = inputValue.slice(0, mentionCtx.value.start) + newMiddlePart + newEndPart;
emit(UPDATE_MODEL_EVENT, newValue);
emit(INPUT_EVENT, newValue);
emit("select", getOriginalOption(item), mentionCtx.value.prefix);
const newSelectionEnd = mentionCtx.value.start + newMiddlePart.length + (alreadySeparated ? 1 : 0);
(0, vue.nextTick)(() => {
inputEl.selectionStart = newSelectionEnd;
inputEl.selectionEnd = newSelectionEnd;
inputEl.focus();
syncDropdownVisible();
});
};
const getInputEl = () => props.type === "textarea" ? elInputRef.value?.textarea : elInputRef.value?.input;
const syncAfterCursorMove = () => {
setTimeout(() => {
syncCursor();
syncDropdownVisible();
(0, vue.nextTick)(() => tooltipRef.value?.updatePopper());
}, 0);
};
const syncCursor = () => {
const inputEl = getInputEl();
if (!inputEl) return;
const caretPosition = getCursorPosition(inputEl);
const inputRect = inputEl.getBoundingClientRect();
const wrapperRect = wrapperRef.value.getBoundingClientRect();
cursorStyle.value = {
position: "absolute",
width: 0,
height: `${caretPosition.height}px`,
left: `${caretPosition.left + inputRect.left - wrapperRect.left}px`,
top: `${caretPosition.top + inputRect.top - wrapperRect.top}px`
};
};
const syncDropdownVisible = () => {
const inputEl = getInputEl();
if (document.activeElement !== inputEl) {
visible.value = false;
return;
}
const { prefix, split } = props;
mentionCtx.value = getMentionCtx(inputEl, prefix, split);
if (mentionCtx.value && mentionCtx.value.splitIndex === -1) {
visible.value = true;
emit("search", mentionCtx.value.pattern, mentionCtx.value.prefix);
return;
}
visible.value = false;
};
__expose({
input: elInputRef,
tooltip: tooltipRef,
dropdownVisible
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref_key: "wrapperRef",
ref: wrapperRef,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).b())
}, [(0, vue.createVNode)((0, vue.unref)(ElInput), (0, vue.mergeProps)((0, vue.mergeProps)(passInputProps.value, _ctx.$attrs), {
ref_key: "elInputRef",
ref: elInputRef,
"model-value": __props.modelValue,
disabled: (0, vue.unref)(disabled),
role: dropdownVisible.value ? "combobox" : void 0,
"aria-activedescendant": dropdownVisible.value ? hoveringId.value || "" : void 0,
"aria-controls": dropdownVisible.value ? (0, vue.unref)(contentId) : void 0,
"aria-expanded": dropdownVisible.value || void 0,
"aria-label": __props.ariaLabel,
"aria-autocomplete": dropdownVisible.value ? "none" : void 0,
"aria-haspopup": dropdownVisible.value ? "listbox" : void 0,
onInput: handleInputChange,
onKeydown: handleInputKeyDown,
onMousedown: handleInputMouseDown
}), (0, vue.createSlots)({ _: 2 }, [(0, vue.renderList)(_ctx.$slots, (_, name) => {
return {
name,
fn: (0, vue.withCtx)((slotProps) => [(0, vue.renderSlot)(_ctx.$slots, name, (0, vue.normalizeProps)((0, vue.guardReactiveProps)(slotProps)))])
};
})]), 1040, [
"model-value",
"disabled",
"role",
"aria-activedescendant",
"aria-controls",
"aria-expanded",
"aria-label",
"aria-autocomplete",
"aria-haspopup"
]), (0, vue.createVNode)((0, vue.unref)(ElTooltip), {
ref_key: "tooltipRef",
ref: tooltipRef,
visible: dropdownVisible.value,
"popper-class": [(0, vue.unref)(ns).e("popper"), __props.popperClass],
"popper-style": __props.popperStyle,
"popper-options": __props.popperOptions,
placement: computedPlacement.value,
"fallback-placements": computedFallbackPlacements.value,
effect: "light",
pure: "",
offset: __props.offset,
"show-arrow": __props.showArrow
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", { style: (0, vue.normalizeStyle)(cursorStyle.value) }, null, 4)]),
content: (0, vue.withCtx)(() => [(0, vue.createVNode)(mention_dropdown_default, {
ref_key: "dropdownRef",
ref: dropdownRef,
options: filteredOptions.value,
disabled: (0, vue.unref)(disabled),
loading: __props.loading,
"content-id": (0, vue.unref)(contentId),
"aria-label": __props.ariaLabel,
onSelect: handleSelect,
onClick: _cache[0] || (_cache[0] = (0, vue.withModifiers)(($event) => elInputRef.value?.focus(), ["stop"]))
}, (0, vue.createSlots)({ _: 2 }, [(0, vue.renderList)(_ctx.$slots, (_, name) => {
return {
name,
fn: (0, vue.withCtx)((slotProps) => [(0, vue.renderSlot)(_ctx.$slots, name, (0, vue.normalizeProps)((0, vue.guardReactiveProps)(slotProps)))])
};
})]), 1032, [
"options",
"disabled",
"loading",
"content-id",
"aria-label"
])]),
_: 3
}, 8, [
"visible",
"popper-class",
"popper-style",
"popper-options",
"placement",
"fallback-placements",
"offset",
"show-arrow"
])], 2);
};
}
});
//#endregion
//#region ../../packages/components/mention/src/mention.vue
var mention_default = mention_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/mention/index.ts
const ElMention = withInstall(mention_default);
//#endregion
//#region ../../packages/components/splitter/src/splitter.ts
/**
* @deprecated Removed after 3.0.0, Use `SplitterProps` instead.
*/
const splitterProps = buildProps({
layout: {
type: String,
default: "horizontal",
values: ["horizontal", "vertical"]
},
lazy: Boolean
});
const splitterEmits = {
resizeStart: (index, sizes) => true,
resize: (index, sizes) => true,
resizeEnd: (index, sizes) => true,
collapse: (index, type, sizes) => true
};
//#endregion
//#region ../../packages/components/splitter/src/hooks/useContainer.ts
function useContainer(layout) {
const containerEl = (0, vue.ref)();
const { width, height } = useElementSize(containerEl);
return {
containerEl,
containerSize: (0, vue.computed)(() => {
return layout.value === "horizontal" ? width.value : height.value;
})
};
}
//#endregion
//#region ../../packages/components/splitter/src/hooks/useSize.ts
function getPct(str) {
return Number(str.slice(0, -1)) / 100;
}
function getPx(str) {
return Number(str.slice(0, -2));
}
function isPct(itemSize) {
return isString(itemSize) && itemSize.endsWith("%");
}
function isPx(itemSize) {
return isString(itemSize) && itemSize.endsWith("px");
}
function useSize$1(panels, containerSize) {
const propSizes = (0, vue.computed)(() => panels.value.map((i) => i.size));
const panelCounts = (0, vue.computed)(() => panels.value.length);
const percentSizes = (0, vue.ref)([]);
(0, vue.watch)([
propSizes,
panelCounts,
containerSize
], () => {
let ptgList = [];
let emptyCount = 0;
for (let i = 0; i < panelCounts.value; i += 1) {
const itemSize = panels.value[i]?.size;
if (isPct(itemSize)) ptgList[i] = getPct(itemSize);
else if (isPx(itemSize)) ptgList[i] = getPx(itemSize) / containerSize.value;
else if (itemSize || itemSize === 0) {
const num = Number(itemSize);
if (!Number.isNaN(num)) ptgList[i] = num / containerSize.value;
} else {
emptyCount += 1;
ptgList[i] = void 0;
}
}
const totalPtg = ptgList.reduce((acc, ptg) => acc + (ptg || 0), 0);
if (totalPtg > 1 || !emptyCount) {
const scale = 1 / totalPtg;
ptgList = ptgList.map((ptg) => ptg === void 0 ? 0 : ptg * scale);
} else {
const avgRest = (1 - totalPtg) / emptyCount;
ptgList = ptgList.map((ptg) => ptg === void 0 ? avgRest : ptg);
}
percentSizes.value = ptgList;
});
const ptg2px = (ptg) => ptg * containerSize.value;
return {
percentSizes,
pxSizes: (0, vue.computed)(() => percentSizes.value.map(ptg2px))
};
}
//#endregion
//#region ../../packages/components/splitter/src/hooks/useResize.ts
function useResize(panels, containerSize, pxSizes, lazy) {
const ptg2px = (ptg) => ptg * containerSize.value || 0;
function getLimitSize(str, defaultLimit) {
if (isPct(str)) return ptg2px(getPct(str));
else if (isPx(str)) return getPx(str);
return str ?? defaultLimit;
}
const lazyOffset = (0, vue.ref)(0);
const movingIndex = (0, vue.ref)(null);
let cachePxSizes = [];
let updatePanelSizes = NOOP;
const limitSizes = (0, vue.computed)(() => panels.value.map((item) => [item.min, item.max]));
(0, vue.watch)(lazy, () => {
if (lazyOffset.value) {
const mouseup = new MouseEvent("mouseup", { bubbles: true });
window.dispatchEvent(mouseup);
}
});
const onMoveStart = (index) => {
lazyOffset.value = 0;
movingIndex.value = {
index,
confirmed: false
};
cachePxSizes = pxSizes.value;
};
const onMoving = (index, offset) => {
let confirmedIndex = null;
if ((!movingIndex.value || !movingIndex.value.confirmed) && offset !== 0) {
if (offset > 0) {
confirmedIndex = index;
movingIndex.value = {
index,
confirmed: true
};
} else for (let i = index; i >= 0; i -= 1) if (cachePxSizes[i] > 0) {
confirmedIndex = i;
movingIndex.value = {
index: i,
confirmed: true
};
break;
}
}
const mergedIndex = confirmedIndex ?? movingIndex.value?.index ?? index;
const numSizes = [...cachePxSizes];
const nextIndex = mergedIndex + 1;
const startMinSize = getLimitSize(limitSizes.value[mergedIndex][0], 0);
const endMinSize = getLimitSize(limitSizes.value[nextIndex][0], 0);
const startMaxSize = getLimitSize(limitSizes.value[mergedIndex][1], containerSize.value || 0);
const endMaxSize = getLimitSize(limitSizes.value[nextIndex][1], containerSize.value || 0);
let mergedOffset = offset;
if (numSizes[mergedIndex] + mergedOffset < startMinSize) mergedOffset = startMinSize - numSizes[mergedIndex];
if (numSizes[nextIndex] - mergedOffset < endMinSize) mergedOffset = numSizes[nextIndex] - endMinSize;
if (numSizes[mergedIndex] + mergedOffset > startMaxSize) mergedOffset = startMaxSize - numSizes[mergedIndex];
if (numSizes[nextIndex] - mergedOffset > endMaxSize) mergedOffset = numSizes[nextIndex] - endMaxSize;
numSizes[mergedIndex] += mergedOffset;
numSizes[nextIndex] -= mergedOffset;
lazyOffset.value = mergedOffset;
updatePanelSizes = () => {
panels.value.forEach((panel, index) => {
panel.size = numSizes[index];
});
updatePanelSizes = NOOP;
};
if (!lazy.value) updatePanelSizes();
};
const onMoveEnd = () => {
if (lazy.value) updatePanelSizes();
lazyOffset.value = 0;
movingIndex.value = null;
cachePxSizes = [];
};
const cacheCollapsedSize = [];
const onCollapse = (index, type) => {
if (!cacheCollapsedSize.length) cacheCollapsedSize.push(...pxSizes.value);
const currentSizes = pxSizes.value;
const currentIndex = type === "start" ? index : index + 1;
const targetIndex = type === "start" ? index + 1 : index;
const currentSize = currentSizes[currentIndex];
const targetSize = currentSizes[targetIndex];
if (currentSize !== 0 && targetSize !== 0) {
currentSizes[currentIndex] = 0;
currentSizes[targetIndex] += currentSize;
cacheCollapsedSize[index] = currentSize;
} else {
const totalSize = currentSize + targetSize;
const targetCacheCollapsedSize = cacheCollapsedSize[index];
const currentCacheCollapsedSize = totalSize - targetCacheCollapsedSize;
currentSizes[targetIndex] = targetCacheCollapsedSize;
currentSizes[currentIndex] = currentCacheCollapsedSize;
}
panels.value.forEach((panel, index) => {
panel.size = currentSizes[index];
});
};
return {
lazyOffset,
onMoveStart,
onMoving,
onMoveEnd,
movingIndex,
onCollapse
};
}
//#endregion
//#region ../../packages/components/splitter/src/type.ts
const splitterRootContextKey = Symbol("splitterRootContextKey");
//#endregion
//#region ../../packages/components/splitter/src/splitter.vue?vue&type=script&setup=true&lang.ts
var splitter_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElSplitter",
__name: "splitter",
props: splitterProps,
emits: splitterEmits,
setup(__props, { emit: __emit }) {
const ns = useNamespace("splitter");
const emits = __emit;
const props = __props;
const layout = (0, vue.toRef)(props, "layout");
const lazy = (0, vue.toRef)(props, "lazy");
const { containerEl, containerSize } = useContainer(layout);
const { removeChild: unregisterPanel, children: panels, addChild: registerPanel, ChildrenSorter: PanelsSorter } = useOrderedChildren((0, vue.getCurrentInstance)(), "ElSplitterPanel");
(0, vue.watch)(panels, () => {
movingIndex.value = null;
panels.value.forEach((instance, index) => {
instance.setIndex(index);
});
});
const { percentSizes, pxSizes } = useSize$1(panels, containerSize);
const { lazyOffset, movingIndex, onMoveStart, onMoving, onMoveEnd, onCollapse } = useResize(panels, containerSize, pxSizes, lazy);
const splitterStyles = (0, vue.computed)(() => {
return { [ns.cssVarBlockName("bar-offset")]: lazy.value ? `${lazyOffset.value}px` : void 0 };
});
const onResizeStart = (index) => {
onMoveStart(index);
emits("resizeStart", index, pxSizes.value);
};
const onResize = (index, offset) => {
onMoving(index, offset);
if (!lazy.value) emits("resize", index, pxSizes.value);
};
const onResizeEnd = async (index) => {
onMoveEnd();
await (0, vue.nextTick)();
emits("resizeEnd", index, pxSizes.value);
};
const onCollapsible = (index, type) => {
onCollapse(index, type);
emits("collapse", index, type, pxSizes.value);
};
(0, vue.provide)(splitterRootContextKey, (0, vue.reactive)({
panels,
percentSizes,
pxSizes,
layout,
lazy,
movingIndex,
containerSize,
onMoveStart: onResizeStart,
onMoving: onResize,
onMoveEnd: onResizeEnd,
onCollapse: onCollapsible,
registerPanel,
unregisterPanel
}));
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
ref_key: "containerEl",
ref: containerEl,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).b(), (0, vue.unref)(ns).e(layout.value)]),
style: (0, vue.normalizeStyle)(splitterStyles.value)
}, [
(0, vue.renderSlot)(_ctx.$slots, "default"),
(0, vue.createVNode)((0, vue.unref)(PanelsSorter)),
(0, vue.createCommentVNode)(" Prevent iframe touch events from breaking "),
(0, vue.unref)(movingIndex) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("mask"), (0, vue.unref)(ns).e(`mask-${layout.value}`)])
}, null, 2)) : (0, vue.createCommentVNode)("v-if", true)
], 6);
};
}
});
//#endregion
//#region ../../packages/components/splitter/src/splitter.vue
var splitter_default = splitter_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/splitter/src/split-panel.ts
/**
* @deprecated Removed after 3.0.0, Use `SplitterPanelProps` instead.
*/
const splitterPanelProps = buildProps({
min: { type: [String, Number] },
max: { type: [String, Number] },
size: { type: [String, Number] },
resizable: {
type: Boolean,
default: true
},
collapsible: Boolean
});
const splitterPanelEmits = { "update:size": (value) => typeof value === "number" || typeof value === "string" };
//#endregion
//#region ../../packages/components/splitter/src/hooks/usePanel.ts
function getCollapsible(collapsible) {
if (collapsible && isObject$1(collapsible)) return collapsible;
return {
start: !!collapsible,
end: !!collapsible
};
}
function isCollapsible(panel, size, nextPanel, nextSize) {
if (panel?.collapsible.end && size > 0) return true;
if (nextPanel?.collapsible.start && nextSize === 0 && size > 0) return true;
return false;
}
//#endregion
//#region ../../packages/components/splitter/src/split-bar.vue?vue&type=script&setup=true&lang.ts
var split_bar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElSplitterBar",
__name: "split-bar",
props: {
index: {
type: Number,
required: true
},
layout: {
type: String,
values: ["horizontal", "vertical"],
default: "horizontal"
},
resizable: {
type: Boolean,
default: true
},
lazy: Boolean,
startCollapsible: Boolean,
endCollapsible: Boolean
},
emits: [
"moveStart",
"moving",
"moveEnd",
"collapse"
],
setup(__props, { emit: __emit }) {
const ns = useNamespace("splitter-bar");
const props = __props;
const emit = __emit;
const isHorizontal = (0, vue.computed)(() => props.layout === "horizontal");
const barWrapStyles = (0, vue.computed)(() => {
if (isHorizontal.value) return { width: 0 };
return { height: 0 };
});
const draggerStyles = (0, vue.computed)(() => {
return {
width: isHorizontal.value ? "16px" : "100%",
height: isHorizontal.value ? "100%" : "16px",
cursor: !props.resizable ? "auto" : isHorizontal.value ? "ew-resize" : "ns-resize",
touchAction: "none"
};
});
const draggerPseudoClass = (0, vue.computed)(() => {
const prefix = ns.e("dragger");
return {
[`${prefix}-horizontal`]: isHorizontal.value,
[`${prefix}-vertical`]: !isHorizontal.value,
[`${prefix}-active`]: !!startPos.value
};
});
const startPos = (0, vue.ref)(null);
const onMousedown = (e) => {
if (!props.resizable) return;
startPos.value = [e.pageX, e.pageY];
emit("moveStart", props.index);
window.addEventListener("mouseup", onMouseUp);
window.addEventListener("mousemove", onMouseMove);
};
const onTouchStart = (e) => {
if (props.resizable && e.touches.length === 1) {
e.preventDefault();
const touch = e.touches[0];
startPos.value = [touch.pageX, touch.pageY];
emit("moveStart", props.index);
window.addEventListener("touchend", onTouchEnd);
window.addEventListener("touchmove", onTouchMove);
}
};
const onMouseMove = (e) => {
const { pageX, pageY } = e;
const offsetX = pageX - startPos.value[0];
const offsetY = pageY - startPos.value[1];
const offset = isHorizontal.value ? offsetX : offsetY;
emit("moving", props.index, offset);
};
const onTouchMove = (e) => {
if (e.touches.length === 1) {
e.preventDefault();
const touch = e.touches[0];
const offsetX = touch.pageX - startPos.value[0];
const offsetY = touch.pageY - startPos.value[1];
const offset = isHorizontal.value ? offsetX : offsetY;
emit("moving", props.index, offset);
}
};
const onMouseUp = () => {
startPos.value = null;
window.removeEventListener("mouseup", onMouseUp);
window.removeEventListener("mousemove", onMouseMove);
emit("moveEnd", props.index);
};
const onTouchEnd = () => {
startPos.value = null;
window.removeEventListener("touchend", onTouchEnd);
window.removeEventListener("touchmove", onTouchMove);
emit("moveEnd", props.index);
};
const StartIcon = (0, vue.computed)(() => isHorizontal.value ? arrow_left_default : arrow_up_default);
const EndIcon = (0, vue.computed)(() => isHorizontal.value ? arrow_right_default : arrow_down_default);
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).b()]),
style: (0, vue.normalizeStyle)(barWrapStyles.value)
}, [
__props.startCollapsible ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("collapse-icon"), (0, vue.unref)(ns).e(`${__props.layout}-collapse-icon-start`)]),
onClick: _cache[0] || (_cache[0] = ($event) => emit("collapse", __props.index, "start"))
}, [(0, vue.renderSlot)(_ctx.$slots, "start-collapsible", {}, () => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(StartIcon.value), { style: {
"width": "12px",
"height": "12px"
} }))])], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).e("dragger"),
draggerPseudoClass.value,
(0, vue.unref)(ns).is("disabled", !__props.resizable),
(0, vue.unref)(ns).is("lazy", __props.resizable && __props.lazy)
]),
style: (0, vue.normalizeStyle)(draggerStyles.value),
onMousedown,
onTouchstart: onTouchStart
}, null, 38),
__props.endCollapsible ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("collapse-icon"), (0, vue.unref)(ns).e(`${__props.layout}-collapse-icon-end`)]),
onClick: _cache[1] || (_cache[1] = ($event) => emit("collapse", __props.index, "end"))
}, [(0, vue.renderSlot)(_ctx.$slots, "end-collapsible", {}, () => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(EndIcon.value), { style: {
"width": "12px",
"height": "12px"
} }))])], 2)) : (0, vue.createCommentVNode)("v-if", true)
], 6);
};
}
});
//#endregion
//#region ../../packages/components/splitter/src/split-bar.vue
var split_bar_default = split_bar_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/splitter/src/split-panel.vue?vue&type=script&setup=true&lang.ts
const COMPONENT_NAME = "ElSplitterPanel";
var split_panel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: COMPONENT_NAME,
__name: "split-panel",
props: splitterPanelProps,
emits: splitterPanelEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const ns = useNamespace("splitter-panel");
const props = __props;
const emits = __emit;
const splitterContext = (0, vue.inject)(splitterRootContextKey);
if (!splitterContext) throwError(COMPONENT_NAME, "usage: <el-splitter><el-splitter-panel /></el-splitter/>");
const { panels, layout, lazy, containerSize, pxSizes } = (0, vue.toRefs)(splitterContext);
const { registerPanel, unregisterPanel, onCollapse, onMoveEnd, onMoveStart, onMoving } = splitterContext;
const panelEl = (0, vue.ref)();
const instance = (0, vue.getCurrentInstance)();
const uid = instance.uid;
const index = (0, vue.ref)(0);
const panel = (0, vue.computed)(() => panels.value[index.value]);
const setIndex = (val) => {
index.value = val;
};
const panelSize = (0, vue.computed)(() => {
if (!panel.value) return 0;
return pxSizes.value[index.value] ?? 0;
});
const nextSize = (0, vue.computed)(() => {
if (!panel.value) return 0;
return pxSizes.value[index.value + 1] ?? 0;
});
const nextPanel = (0, vue.computed)(() => {
if (panel.value) return panels.value[index.value + 1];
return null;
});
const isResizable = (0, vue.computed)(() => {
if (!nextPanel.value) return false;
return props.resizable && nextPanel.value?.resizable && (panelSize.value !== 0 || !props.min) && (nextSize.value !== 0 || !nextPanel.value.min);
});
const isShowBar = (0, vue.computed)(() => {
if (!panel.value) return false;
return index.value !== panels.value.length - 1;
});
const startCollapsible = (0, vue.computed)(() => isCollapsible(panel.value, panelSize.value, nextPanel.value, nextSize.value));
const endCollapsible = (0, vue.computed)(() => isCollapsible(nextPanel.value, nextSize.value, panel.value, panelSize.value));
function sizeToPx(str) {
if (isPct(str)) return getPct(str) * containerSize.value || 0;
else if (isPx(str)) return getPx(str);
return str ?? 0;
}
let isSizeUpdating = false;
(0, vue.watch)(() => props.size, () => {
if (!isSizeUpdating && panel.value) {
if (!containerSize.value) {
panel.value.size = props.size;
return;
}
const size = sizeToPx(props.size);
const maxSize = sizeToPx(props.max);
const minSize = sizeToPx(props.min);
const finalSize = Math.min(Math.max(size, minSize || 0), maxSize || size);
if (finalSize !== size) emits("update:size", finalSize);
panel.value.size = finalSize;
}
});
(0, vue.watch)(() => panel.value?.size, (val) => {
if (val !== props.size) {
isSizeUpdating = true;
emits("update:size", val);
(0, vue.nextTick)(() => isSizeUpdating = false);
}
});
(0, vue.watch)(() => props.resizable, (val) => {
if (panel.value) panel.value.resizable = val;
});
const _panel = (0, vue.reactive)({
uid,
getVnode: () => instance.vnode,
setIndex,
...props,
collapsible: (0, vue.computed)(() => getCollapsible(props.collapsible))
});
registerPanel(_panel);
(0, vue.onBeforeUnmount)(() => unregisterPanel(_panel));
__expose({ splitterPanelRef: panelEl });
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, [(0, vue.createElementVNode)("div", (0, vue.mergeProps)({
ref_key: "panelEl",
ref: panelEl,
class: [(0, vue.unref)(ns).b()],
style: { flexBasis: `${panelSize.value}px` }
}, _ctx.$attrs), [(0, vue.renderSlot)(_ctx.$slots, "default")], 16), isShowBar.value ? ((0, vue.openBlock)(), (0, vue.createBlock)(split_bar_default, {
key: 0,
index: index.value,
layout: (0, vue.unref)(layout),
lazy: (0, vue.unref)(lazy),
resizable: isResizable.value,
"start-collapsible": startCollapsible.value,
"end-collapsible": endCollapsible.value,
onMoveStart: (0, vue.unref)(onMoveStart),
onMoving: (0, vue.unref)(onMoving),
onMoveEnd: (0, vue.unref)(onMoveEnd),
onCollapse: (0, vue.unref)(onCollapse)
}, {
"start-collapsible": (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "start-collapsible")]),
"end-collapsible": (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "end-collapsible")]),
_: 3
}, 8, [
"index",
"layout",
"lazy",
"resizable",
"start-collapsible",
"end-collapsible",
"onMoveStart",
"onMoving",
"onMoveEnd",
"onCollapse"
])) : (0, vue.createCommentVNode)("v-if", true)], 64);
};
}
});
//#endregion
//#region ../../packages/components/splitter/src/split-panel.vue
var split_panel_default = split_panel_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/splitter/index.ts
const ElSplitter = withInstall(splitter_default, { SplitPanel: split_panel_default });
const ElSplitterPanel = withNoopInstall(split_panel_default);
//#endregion
//#region ../../packages/element-plus/component.ts
var component_default = [
ElAffix,
ElAlert,
ElAutocomplete,
ElAutoResizer,
ElAvatar,
ElAvatarGroup,
ElBacktop,
ElBadge,
ElBreadcrumb,
ElBreadcrumbItem,
ElButton,
ElButtonGroup,
ElCalendar,
ElCard,
ElCarousel,
ElCarouselItem,
ElCascader,
ElCascaderPanel,
ElCheckTag,
ElCheckbox,
ElCheckboxButton,
ElCheckboxGroup,
ElCol,
ElCollapse,
ElCollapseItem,
ElCollapseTransition,
ElColorPickerPanel,
ElColorPicker,
ElConfigProvider,
ElContainer,
ElAside,
ElFooter,
ElHeader,
ElMain,
ElDatePicker,
ElDatePickerPanel,
ElDescriptions,
ElDescriptionsItem,
ElDialog,
ElDivider,
ElDrawer,
ElDropdown,
ElDropdownItem,
ElDropdownMenu,
ElEmpty,
ElForm,
ElFormItem,
ElIcon,
ElImage,
ElImageViewer,
ElInput,
ElInputNumber,
ElInputTag,
ElLink,
ElMenu,
ElMenuItem,
ElMenuItemGroup,
ElSubMenu,
ElPageHeader,
ElPagination,
ElPopconfirm,
ElPopover,
ElPopper,
ElProgress,
ElRadio,
ElRadioButton,
ElRadioGroup,
ElRate,
ElResult,
ElRow,
ElScrollbar,
ElSelect,
ElOption,
ElOptionGroup,
ElSelectV2,
ElSkeleton,
ElSkeletonItem,
ElSlider,
ElSpace,
ElStatistic,
ElCountdown,
ElSteps,
ElStep,
ElSwitch,
ElTable,
ElTableColumn,
ElTableV2,
ElTabs,
ElTabPane,
ElTag,
ElText,
ElTimePicker,
ElTimeSelect,
ElTimeline,
ElTimelineItem,
ElTooltip,
ElTransfer,
ElTree,
ElTreeSelect,
ElTreeV2,
ElUpload,
ElWatermark,
ElTour,
ElTourStep,
ElAnchor,
ElAnchorLink,
ElSegmented,
ElMention,
ElSplitter,
ElSplitterPanel
];
//#endregion
//#region ../../packages/components/infinite-scroll/src/index.ts
const SCOPE$1 = "ElInfiniteScroll";
const CHECK_INTERVAL = 50;
const DEFAULT_DELAY = 200;
const DEFAULT_DISTANCE = 0;
const attributes = {
delay: {
type: Number,
default: DEFAULT_DELAY
},
distance: {
type: Number,
default: DEFAULT_DISTANCE
},
disabled: {
type: Boolean,
default: false
},
immediate: {
type: Boolean,
default: true
}
};
const getScrollOptions = (el, instance) => {
return Object.entries(attributes).reduce((acm, [name, option]) => {
const { type, default: defaultValue } = option;
const attrVal = el.getAttribute(`infinite-scroll-${name}`);
let value = instance[attrVal] ?? attrVal ?? defaultValue;
value = value === "false" ? false : value;
value = type(value);
acm[name] = Number.isNaN(value) ? defaultValue : value;
return acm;
}, {});
};
const destroyObserver = (el) => {
const { observer } = el[SCOPE$1];
if (observer) {
observer.disconnect();
delete el[SCOPE$1].observer;
}
};
const handleScroll = (el, cb) => {
const { container, containerEl, instance, observer, lastScrollTop } = el[SCOPE$1];
const { disabled, distance } = getScrollOptions(el, instance);
const { clientHeight, scrollHeight, scrollTop } = containerEl;
const delta = scrollTop - lastScrollTop;
el[SCOPE$1].lastScrollTop = scrollTop;
if (observer || disabled || delta < 0) return;
let shouldTrigger = false;
if (container === el) shouldTrigger = scrollHeight - (clientHeight + scrollTop) <= distance;
else {
const { clientTop, scrollHeight: height } = el;
const offsetTop = getOffsetTopDistance(el, containerEl);
shouldTrigger = scrollTop + clientHeight >= offsetTop + clientTop + height - distance;
}
if (shouldTrigger) cb.call(instance);
};
function checkFull(el, cb) {
const { containerEl, instance } = el[SCOPE$1];
const { disabled } = getScrollOptions(el, instance);
if (disabled || containerEl.clientHeight === 0) return;
if (containerEl.scrollHeight <= containerEl.clientHeight) cb.call(instance);
else destroyObserver(el);
}
const InfiniteScroll = {
async mounted(el, binding) {
const { instance, value: cb } = binding;
useDeprecated({
scope: SCOPE$1,
from: "the directive v-infinite-scroll",
replacement: "the el-scrollbar infinite scroll",
version: "3.0.0",
ref: "https://element-plus.org/en-US/component/scrollbar#infinite-scroll"
}, true);
if (!isFunction$1(cb)) throwError(SCOPE$1, "'v-infinite-scroll' binding value must be a function");
await (0, vue.nextTick)();
const { delay, immediate } = getScrollOptions(el, instance);
const container = getScrollContainer(el, true);
const containerEl = container === window ? document.documentElement : container;
const onScroll = throttle(handleScroll.bind(null, el, cb), delay);
if (!container) return;
el[SCOPE$1] = {
instance,
container,
containerEl,
delay,
cb,
onScroll,
lastScrollTop: containerEl.scrollTop
};
if (immediate) {
const observer = new MutationObserver(throttle(checkFull.bind(null, el, cb), CHECK_INTERVAL));
el[SCOPE$1].observer = observer;
observer.observe(el, {
childList: true,
subtree: true
});
checkFull(el, cb);
}
container.addEventListener("scroll", onScroll);
},
unmounted(el) {
if (!el[SCOPE$1]) return;
const { container, onScroll } = el[SCOPE$1];
container?.removeEventListener("scroll", onScroll);
destroyObserver(el);
},
async updated(el) {
if (!el[SCOPE$1]) await (0, vue.nextTick)();
else {
const { containerEl, cb, observer } = el[SCOPE$1];
if (containerEl.clientHeight && observer) checkFull(el, cb);
}
}
};
//#endregion
//#region ../../packages/components/infinite-scroll/index.ts
const _InfiniteScroll = InfiniteScroll;
_InfiniteScroll.install = (app) => {
app.directive("InfiniteScroll", _InfiniteScroll);
};
const ElInfiniteScroll = _InfiniteScroll;
//#endregion
//#region ../../packages/components/loading/src/loading.ts
function createLoadingComponent(options, appContext) {
let afterLeaveTimer;
const afterLeaveFlag = (0, vue.ref)(false);
const data = (0, vue.reactive)({
...options,
originalPosition: "",
originalOverflow: "",
visible: false
});
function setText(text) {
data.text = text;
}
function destroySelf() {
const target = data.parent;
const ns = vm.ns;
if (!target.vLoadingAddClassList) {
let loadingNumber = target.getAttribute("loading-number");
loadingNumber = Number.parseInt(loadingNumber) - 1;
if (!loadingNumber) {
removeClass(target, ns.bm("parent", "relative"));
target.removeAttribute("loading-number");
} else target.setAttribute("loading-number", loadingNumber.toString());
removeClass(target, ns.bm("parent", "hidden"));
}
removeElLoadingChild();
loadingInstance.unmount();
}
function removeElLoadingChild() {
vm.$el?.parentNode?.removeChild(vm.$el);
}
function close() {
if (options.beforeClose && !options.beforeClose()) return;
afterLeaveFlag.value = true;
clearTimeout(afterLeaveTimer);
afterLeaveTimer = setTimeout(handleAfterLeave, 400);
data.visible = false;
options.closed?.();
}
function handleAfterLeave() {
if (!afterLeaveFlag.value) return;
const target = data.parent;
afterLeaveFlag.value = false;
target.vLoadingAddClassList = void 0;
destroySelf();
}
const loadingInstance = (0, vue.createApp)((0, vue.defineComponent)({
name: "ElLoading",
setup(_, { expose }) {
const { ns, zIndex } = useGlobalComponentSettings("loading");
expose({
ns,
zIndex
});
return () => {
const svg = data.spinner || data.svg;
const spinner = (0, vue.h)("svg", {
class: "circular",
viewBox: data.svgViewBox ? data.svgViewBox : "0 0 50 50",
...svg ? { innerHTML: svg } : {}
}, [(0, vue.h)("circle", {
class: "path",
cx: "25",
cy: "25",
r: "20",
fill: "none"
})]);
const spinnerText = data.text ? (0, vue.h)("p", { class: ns.b("text") }, [data.text]) : void 0;
return (0, vue.h)(vue.Transition, {
name: ns.b("fade"),
onAfterLeave: handleAfterLeave
}, { default: (0, vue.withCtx)(() => [(0, vue.withDirectives)((0, vue.createVNode)("div", {
style: { backgroundColor: data.background || "" },
class: [
ns.b("mask"),
data.customClass,
ns.is("fullscreen", data.fullscreen)
]
}, [(0, vue.h)("div", { class: ns.b("spinner") }, [spinner, spinnerText])]), [[vue.vShow, data.visible]])]) });
};
}
}));
Object.assign(loadingInstance._context, appContext ?? {});
const vm = loadingInstance.mount(document.createElement("div"));
return {
...(0, vue.toRefs)(data),
setText,
removeElLoadingChild,
close,
handleAfterLeave,
vm,
get $el() {
return vm.$el;
}
};
}
//#endregion
//#region ../../packages/components/loading/src/service.ts
let fullscreenInstance = void 0;
const Loading = function(options = {}, context) {
if (!isClient) return void 0;
const resolved = resolveOptions(options);
if (resolved.fullscreen && fullscreenInstance) return fullscreenInstance;
const instance = createLoadingComponent({
...resolved,
closed: () => {
resolved.closed?.();
if (resolved.fullscreen) fullscreenInstance = void 0;
}
}, context ?? Loading._context);
addStyle(resolved, resolved.parent, instance);
addClassList(resolved, resolved.parent, instance);
resolved.parent.vLoadingAddClassList = () => addClassList(resolved, resolved.parent, instance);
/**
* add loading-number to parent.
* because if a fullscreen loading is triggered when somewhere
* a v-loading.body was triggered before and it's parent is
* document.body which with a margin , the fullscreen loading's
* destroySelf function will remove 'el-loading-parent--relative',
* and then the position of v-loading.body will be error.
*/
let loadingNumber = resolved.parent.getAttribute("loading-number");
if (!loadingNumber) loadingNumber = "1";
else loadingNumber = `${Number.parseInt(loadingNumber) + 1}`;
resolved.parent.setAttribute("loading-number", loadingNumber);
resolved.parent.appendChild(instance.$el);
(0, vue.nextTick)(() => instance.visible.value = resolved.visible);
if (resolved.fullscreen) fullscreenInstance = instance;
return instance;
};
const resolveOptions = (options) => {
let target;
if (isString(options.target)) target = document.querySelector(options.target) ?? document.body;
else target = options.target || document.body;
return {
parent: target === document.body || options.body ? document.body : target,
background: options.background || "",
svg: options.svg || "",
svgViewBox: options.svgViewBox || "",
spinner: options.spinner || false,
text: options.text || "",
fullscreen: target === document.body && (options.fullscreen ?? true),
lock: options.lock ?? false,
customClass: options.customClass || "",
visible: options.visible ?? true,
beforeClose: options.beforeClose,
closed: options.closed,
target
};
};
const addStyle = async (options, parent, instance) => {
const { nextZIndex } = instance.vm.zIndex || instance.vm._.exposed.zIndex;
const maskStyle = {};
if (options.fullscreen) {
instance.originalPosition.value = getStyle(document.body, "position");
instance.originalOverflow.value = getStyle(document.body, "overflow");
maskStyle.zIndex = nextZIndex();
} else if (options.parent === document.body) {
instance.originalPosition.value = getStyle(document.body, "position");
/**
* await dom render when visible is true in init,
* because some component's height maybe 0.
* e.g. el-table.
*/
await (0, vue.nextTick)();
for (const property of ["top", "left"]) {
const scroll = property === "top" ? "scrollTop" : "scrollLeft";
maskStyle[property] = `${options.target.getBoundingClientRect()[property] + document.body[scroll] + document.documentElement[scroll] - Number.parseInt(getStyle(document.body, `margin-${property}`), 10)}px`;
}
for (const property of ["height", "width"]) maskStyle[property] = `${options.target.getBoundingClientRect()[property]}px`;
} else instance.originalPosition.value = getStyle(parent, "position");
for (const [key, value] of Object.entries(maskStyle)) instance.$el.style[key] = value;
};
const addClassList = (options, parent, instance) => {
const ns = instance.vm.ns || instance.vm._.exposed.ns;
if (![
"absolute",
"fixed",
"sticky"
].includes(instance.originalPosition.value)) addClass(parent, ns.bm("parent", "relative"));
else removeClass(parent, ns.bm("parent", "relative"));
if (options.fullscreen && options.lock) addClass(parent, ns.bm("parent", "hidden"));
else removeClass(parent, ns.bm("parent", "hidden"));
};
Loading._context = null;
//#endregion
//#region ../../packages/components/loading/src/directive.ts
const INSTANCE_KEY = Symbol("ElLoading");
const getAttributeName = (name) => {
return `element-loading-${hyphenate(name)}`;
};
const createInstance = (el, binding) => {
const vm = binding.instance;
const getBindingProp = (key) => isObject$1(binding.value) ? binding.value[key] : void 0;
const resolveExpression = (key) => {
return (0, vue.ref)(isString(key) && vm?.[key] || key);
};
const getProp = (name) => resolveExpression(getBindingProp(name) || el.getAttribute(getAttributeName(name)));
const fullscreen = getBindingProp("fullscreen") ?? binding.modifiers.fullscreen;
const options = {
text: getProp("text"),
svg: getProp("svg"),
svgViewBox: getProp("svgViewBox"),
spinner: getProp("spinner"),
background: getProp("background"),
customClass: getProp("customClass"),
fullscreen,
target: getBindingProp("target") ?? (fullscreen ? void 0 : el),
body: getBindingProp("body") ?? binding.modifiers.body,
lock: getBindingProp("lock") ?? binding.modifiers.lock
};
const instance = Loading(options);
instance._context = vLoading._context;
el[INSTANCE_KEY] = {
options,
instance
};
};
const updateOptions = (originalOptions, newOptions) => {
for (const key of Object.keys(originalOptions)) if ((0, vue.isRef)(originalOptions[key])) originalOptions[key].value = newOptions[key];
};
const vLoading = {
mounted(el, binding) {
if (binding.value) createInstance(el, binding);
},
updated(el, binding) {
const instance = el[INSTANCE_KEY];
if (!binding.value) {
instance?.instance.close();
el[INSTANCE_KEY] = null;
return;
}
if (!instance) createInstance(el, binding);
else updateOptions(instance.options, isObject$1(binding.value) ? binding.value : {
text: el.getAttribute(getAttributeName("text")),
svg: el.getAttribute(getAttributeName("svg")),
svgViewBox: el.getAttribute(getAttributeName("svgViewBox")),
spinner: el.getAttribute(getAttributeName("spinner")),
background: el.getAttribute(getAttributeName("background")),
customClass: el.getAttribute(getAttributeName("customClass"))
});
},
unmounted(el) {
el[INSTANCE_KEY]?.instance.close();
el[INSTANCE_KEY] = null;
}
};
vLoading._context = null;
//#endregion
//#region ../../packages/components/loading/index.ts
const ElLoading = {
install(app) {
Loading._context = app._context;
vLoading._context = app._context;
app.directive("loading", vLoading);
app.config.globalProperties.$loading = Loading;
},
directive: vLoading,
service: Loading
};
//#endregion
//#region ../../packages/components/message/src/message.ts
const messageTypes = [
"primary",
"success",
"info",
"warning",
"error"
];
const messagePlacement = [
"top",
"top-left",
"top-right",
"bottom",
"bottom-left",
"bottom-right"
];
const MESSAGE_DEFAULT_PLACEMENT = "top";
const messageDefaults = mutable({
customClass: "",
dangerouslyUseHTMLString: false,
duration: 3e3,
icon: void 0,
id: "",
message: "",
onClose: void 0,
showClose: false,
type: "info",
plain: false,
offset: 16,
placement: void 0,
zIndex: 0,
grouping: false,
repeatNum: 1,
appendTo: isClient ? document.body : void 0
});
/**
* @deprecated Removed after 3.0.0, Use `MessageProps` instead.
*/
const messageProps = buildProps({
customClass: {
type: String,
default: messageDefaults.customClass
},
dangerouslyUseHTMLString: {
type: Boolean,
default: messageDefaults.dangerouslyUseHTMLString
},
duration: {
type: Number,
default: messageDefaults.duration
},
icon: {
type: iconPropType,
default: messageDefaults.icon
},
id: {
type: String,
default: messageDefaults.id
},
message: {
type: definePropType([
String,
Object,
Function
]),
default: messageDefaults.message
},
onClose: {
type: definePropType(Function),
default: messageDefaults.onClose
},
showClose: {
type: Boolean,
default: messageDefaults.showClose
},
type: {
type: String,
values: messageTypes,
default: messageDefaults.type
},
plain: {
type: Boolean,
default: messageDefaults.plain
},
offset: {
type: Number,
default: messageDefaults.offset
},
placement: {
type: String,
values: messagePlacement,
default: messageDefaults.placement
},
zIndex: {
type: Number,
default: messageDefaults.zIndex
},
grouping: {
type: Boolean,
default: messageDefaults.grouping
},
repeatNum: {
type: Number,
default: messageDefaults.repeatNum
}
});
const messageEmits = { destroy: () => true };
//#endregion
//#region ../../packages/components/message/src/instance.ts
const placementInstances = (0, vue.shallowReactive)({});
const getOrCreatePlacementInstances = (placement) => {
if (!placementInstances[placement]) placementInstances[placement] = (0, vue.shallowReactive)([]);
return placementInstances[placement];
};
const getInstance = (id, placement) => {
const instances = placementInstances[placement] || [];
const idx = instances.findIndex((instance) => instance.id === id);
const current = instances[idx];
let prev;
if (idx > 0) prev = instances[idx - 1];
return {
current,
prev
};
};
const getLastOffset = (id, placement) => {
const { prev } = getInstance(id, placement);
if (!prev) return 0;
return prev.vm.exposed.bottom.value;
};
const getOffsetOrSpace = (id, offset, placement) => {
return (placementInstances[placement] || []).findIndex((instance) => instance.id === id) > 0 ? 16 : offset;
};
//#endregion
//#region ../../packages/components/message/src/message.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1$2 = ["id"];
const _hoisted_2$2 = ["innerHTML"];
var message_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElMessage",
__name: "message",
props: messageProps,
emits: messageEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const { Close } = TypeComponents;
const props = __props;
const emit = __emit;
const isStartTransition = (0, vue.ref)(false);
const { ns, zIndex } = useGlobalComponentSettings("message");
const { currentZIndex, nextZIndex } = zIndex;
const messageRef = (0, vue.ref)();
const visible = (0, vue.ref)(false);
const height = (0, vue.ref)(0);
let stopTimer = void 0;
const badgeType = (0, vue.computed)(() => props.type ? props.type === "error" ? "danger" : props.type : "info");
const typeClass = (0, vue.computed)(() => {
const type = props.type;
return { [ns.bm("icon", type)]: type && TypeComponentsMap[type] };
});
const iconComponent = (0, vue.computed)(() => props.icon || TypeComponentsMap[props.type] || "");
const placement = (0, vue.computed)(() => props.placement || MESSAGE_DEFAULT_PLACEMENT);
const lastOffset = (0, vue.computed)(() => getLastOffset(props.id, placement.value));
const offset = (0, vue.computed)(() => {
return Math.max(getOffsetOrSpace(props.id, props.offset, placement.value) + lastOffset.value, props.offset);
});
const bottom = (0, vue.computed)(() => height.value + offset.value);
const horizontalClass = (0, vue.computed)(() => {
if (placement.value.includes("left")) return ns.is("left");
if (placement.value.includes("right")) return ns.is("right");
return ns.is("center");
});
const verticalProperty = (0, vue.computed)(() => placement.value.startsWith("top") ? "top" : "bottom");
const customStyle = (0, vue.computed)(() => ({
[verticalProperty.value]: `${offset.value}px`,
zIndex: currentZIndex.value
}));
function startTimer() {
if (props.duration === 0) return;
({stop: stopTimer} = useTimeoutFn(() => {
close();
}, props.duration));
}
function clearTimer() {
stopTimer?.();
}
function close() {
visible.value = false;
(0, vue.nextTick)(() => {
if (!isStartTransition.value) {
props.onClose?.();
emit("destroy");
}
});
}
function keydown(event) {
if (getEventCode(event) === EVENT_CODE.esc) close();
}
(0, vue.onMounted)(() => {
startTimer();
nextZIndex();
visible.value = true;
});
(0, vue.watch)(() => props.repeatNum, () => {
clearTimer();
startTimer();
});
useEventListener(document, "keydown", keydown);
useResizeObserver(messageRef, () => {
height.value = messageRef.value.getBoundingClientRect().height;
});
__expose({
visible,
bottom,
close
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)(vue.Transition, {
name: (0, vue.unref)(ns).b("fade"),
onBeforeEnter: _cache[0] || (_cache[0] = ($event) => isStartTransition.value = true),
onBeforeLeave: __props.onClose,
onAfterLeave: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("destroy")),
persisted: ""
}, {
default: (0, vue.withCtx)(() => [(0, vue.withDirectives)((0, vue.createElementVNode)("div", {
id: __props.id,
ref_key: "messageRef",
ref: messageRef,
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).b(),
{ [(0, vue.unref)(ns).m(__props.type)]: __props.type },
(0, vue.unref)(ns).is("closable", __props.showClose),
(0, vue.unref)(ns).is("plain", __props.plain),
(0, vue.unref)(ns).is("bottom", verticalProperty.value === "bottom"),
horizontalClass.value,
__props.customClass
]),
style: (0, vue.normalizeStyle)(customStyle.value),
role: "alert",
onMouseenter: clearTimer,
onMouseleave: startTimer
}, [
__props.repeatNum > 1 ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElBadge), {
key: 0,
value: __props.repeatNum,
type: badgeType.value,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("badge"))
}, null, 8, [
"value",
"type",
"class"
])) : (0, vue.createCommentVNode)("v-if", true),
iconComponent.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 1,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("icon"), typeClass.value])
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(iconComponent.value)))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.renderSlot)(_ctx.$slots, "default", {}, () => [!__props.dangerouslyUseHTMLString ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("p", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("content"))
}, (0, vue.toDisplayString)(__props.message), 3)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, [(0, vue.createCommentVNode)(" Caution here, message could've been compromised, never use user's input as message "), (0, vue.createElementVNode)("p", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("content")),
innerHTML: __props.message
}, null, 10, _hoisted_2$2)], 2112))]),
__props.showClose ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 2,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("closeBtn")),
onClick: (0, vue.withModifiers)(close, ["stop"])
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(Close))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true)
], 46, _hoisted_1$2), [[vue.vShow, visible.value]])]),
_: 3
}, 8, ["name", "onBeforeLeave"]);
};
}
});
//#endregion
//#region ../../packages/components/message/src/message.vue
var message_default = message_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/message/src/method.ts
let seed$1 = 1;
const normalizeAppendTo = (normalized) => {
if (!normalized.appendTo) normalized.appendTo = document.body;
else if (isString(normalized.appendTo)) {
let appendTo = document.querySelector(normalized.appendTo);
if (!isElement$1(appendTo)) {
/* @__PURE__ */ debugWarn("ElMessage", "the appendTo option is not an HTMLElement. Falling back to document.body.");
appendTo = document.body;
}
normalized.appendTo = appendTo;
}
};
const normalizePlacement = (normalized) => {
if (!normalized.placement && isString(messageConfig.placement) && messageConfig.placement) normalized.placement = messageConfig.placement;
if (!normalized.placement) normalized.placement = MESSAGE_DEFAULT_PLACEMENT;
if (!messagePlacement.includes(normalized.placement)) {
/* @__PURE__ */ debugWarn("ElMessage", `Invalid placement: ${normalized.placement}. Falling back to '${MESSAGE_DEFAULT_PLACEMENT}'.`);
normalized.placement = MESSAGE_DEFAULT_PLACEMENT;
}
};
const normalizeOptions = (params) => {
const options = !params || isString(params) || (0, vue.isVNode)(params) || isFunction$1(params) ? { message: params } : params;
const normalized = {
...messageDefaults,
...options
};
normalizeAppendTo(normalized);
normalizePlacement(normalized);
if (isBoolean(messageConfig.grouping) && !normalized.grouping) normalized.grouping = messageConfig.grouping;
if (isNumber(messageConfig.duration) && normalized.duration === 3e3) normalized.duration = messageConfig.duration;
if (isNumber(messageConfig.offset) && normalized.offset === 16) normalized.offset = messageConfig.offset;
if (isBoolean(messageConfig.showClose) && !normalized.showClose) normalized.showClose = messageConfig.showClose;
if (isBoolean(messageConfig.plain) && !normalized.plain) normalized.plain = messageConfig.plain;
return normalized;
};
const closeMessage = (instance) => {
const instances = placementInstances[instance.props.placement || MESSAGE_DEFAULT_PLACEMENT];
const idx = instances.indexOf(instance);
if (idx === -1) return;
instances.splice(idx, 1);
const { handler } = instance;
handler.close();
};
const createMessage = ({ appendTo, ...options }, context) => {
const id = `message_${seed$1++}`;
const userOnClose = options.onClose;
const container = document.createElement("div");
const props = {
...options,
id,
onClose: () => {
userOnClose?.();
closeMessage(instance);
},
onDestroy: () => {
(0, vue.render)(null, container);
}
};
const vnode = (0, vue.createVNode)(message_default, props, isFunction$1(props.message) || (0, vue.isVNode)(props.message) ? { default: isFunction$1(props.message) ? props.message : () => props.message } : null);
vnode.appContext = context || message._context;
(0, vue.render)(vnode, container);
appendTo.appendChild(container.firstElementChild);
const vm = vnode.component;
const instance = {
id,
vnode,
vm,
handler: { close: () => {
vm.exposed.close();
} },
props: vnode.component.props
};
return instance;
};
const message = (options = {}, context) => {
if (!isClient) return { close: () => void 0 };
const normalized = normalizeOptions(options);
const instances = getOrCreatePlacementInstances(normalized.placement || MESSAGE_DEFAULT_PLACEMENT);
if (normalized.grouping && instances.length) {
const instance = instances.find(({ vnode: vm }) => vm.props?.message === normalized.message);
if (instance) {
instance.props.repeatNum += 1;
instance.props.type = normalized.type;
return instance.handler;
}
}
if (isNumber(messageConfig.max) && instances.length >= messageConfig.max) return { close: () => void 0 };
const instance = createMessage(normalized, context);
instances.push(instance);
return instance.handler;
};
messageTypes.forEach((type) => {
message[type] = (options = {}, appContext) => {
return message({
...normalizeOptions(options),
type
}, appContext);
};
});
function closeAll$1(type) {
for (const placement in placementInstances) if (hasOwn(placementInstances, placement)) {
const instances = [...placementInstances[placement]];
for (const instance of instances) if (!type || type === instance.props.type) instance.handler.close();
}
}
function closeAllByPlacement(placement) {
if (!placementInstances[placement]) return;
[...placementInstances[placement]].forEach((instance) => instance.handler.close());
}
message.closeAll = closeAll$1;
message.closeAllByPlacement = closeAllByPlacement;
message._context = null;
//#endregion
//#region ../../packages/components/message/index.ts
const ElMessage = withInstallFunction(message, "$message");
//#endregion
//#region ../../packages/components/message-box/src/index.vue?vue&type=script&lang.ts
var index_vue_vue_type_script_lang_default = (0, vue.defineComponent)({
name: "ElMessageBox",
directives: { TrapFocus },
components: {
ElButton,
ElFocusTrap: focus_trap_default,
ElInput,
ElOverlay,
ElIcon,
...TypeComponents
},
inheritAttrs: false,
props: {
buttonSize: {
type: String,
validator: isValidComponentSize
},
modal: {
type: Boolean,
default: true
},
lockScroll: {
type: Boolean,
default: true
},
showClose: {
type: Boolean,
default: true
},
closeOnClickModal: {
type: Boolean,
default: true
},
closeOnPressEscape: {
type: Boolean,
default: true
},
closeOnHashChange: {
type: Boolean,
default: true
},
center: Boolean,
draggable: Boolean,
overflow: Boolean,
roundButton: Boolean,
container: {
type: String,
default: "body"
},
boxType: {
type: String,
default: ""
}
},
emits: ["vanish", "action"],
setup(props, { emit }) {
const { locale, zIndex, ns, size: btnSize } = useGlobalComponentSettings("message-box", (0, vue.computed)(() => props.buttonSize));
const { t } = locale;
const { nextZIndex } = zIndex;
const visible = (0, vue.ref)(false);
const state = (0, vue.reactive)({
autofocus: true,
beforeClose: null,
callback: null,
cancelButtonText: "",
cancelButtonClass: "",
confirmButtonText: "",
confirmButtonClass: "",
cancelButtonType: "",
confirmButtonType: "primary",
customClass: "",
customStyle: {},
dangerouslyUseHTMLString: false,
distinguishCancelAndClose: false,
icon: "",
closeIcon: "",
inputPattern: null,
inputPlaceholder: "",
inputType: "text",
inputValue: "",
inputValidator: void 0,
inputErrorMessage: "",
message: "",
modalFade: true,
modalClass: "",
showCancelButton: false,
showConfirmButton: true,
type: "",
title: void 0,
showInput: false,
action: "",
confirmButtonLoading: false,
cancelButtonLoading: false,
confirmButtonLoadingIcon: (0, vue.markRaw)(loading_default),
cancelButtonLoadingIcon: (0, vue.markRaw)(loading_default),
confirmButtonDisabled: false,
editorErrorMessage: "",
validateError: false,
zIndex: nextZIndex()
});
const typeClass = (0, vue.computed)(() => {
const type = state.type;
return { [ns.bm("icon", type)]: type && TypeComponentsMap[type] };
});
const contentId = useId();
const inputId = useId();
const iconComponent = (0, vue.computed)(() => {
const type = state.type;
return state.icon || type && TypeComponentsMap[type] || "";
});
const hasMessage = (0, vue.computed)(() => !!state.message);
const rootRef = (0, vue.ref)();
const headerRef = (0, vue.ref)();
const focusStartRef = (0, vue.ref)();
const inputRef = (0, vue.ref)();
const confirmRef = (0, vue.ref)();
const confirmButtonClasses = (0, vue.computed)(() => state.confirmButtonClass);
(0, vue.watch)(() => state.inputValue, async (val) => {
await (0, vue.nextTick)();
if (props.boxType === "prompt" && val) validate();
}, { immediate: true });
(0, vue.watch)(() => visible.value, (val) => {
if (val) {
if (props.boxType !== "prompt") if (state.autofocus) focusStartRef.value = confirmRef.value?.$el ?? rootRef.value;
else focusStartRef.value = rootRef.value;
state.zIndex = nextZIndex();
}
if (props.boxType !== "prompt") return;
if (val) (0, vue.nextTick)().then(() => {
if (inputRef.value && inputRef.value.$el) if (state.autofocus) focusStartRef.value = getInputElement() ?? rootRef.value;
else focusStartRef.value = rootRef.value;
});
else {
state.editorErrorMessage = "";
state.validateError = false;
}
});
const { isDragging } = useDraggable(rootRef, headerRef, (0, vue.computed)(() => props.draggable), (0, vue.computed)(() => props.overflow));
(0, vue.onMounted)(async () => {
await (0, vue.nextTick)();
if (props.closeOnHashChange) window.addEventListener("hashchange", doClose);
});
(0, vue.onBeforeUnmount)(() => {
if (props.closeOnHashChange) window.removeEventListener("hashchange", doClose);
});
function doClose() {
if (!visible.value) return;
visible.value = false;
(0, vue.nextTick)(() => {
if (state.action) emit("action", state.action);
});
}
const handleWrapperClick = () => {
if (props.closeOnClickModal) handleAction(state.distinguishCancelAndClose ? "close" : "cancel");
};
const overlayEvent = useSameTarget(handleWrapperClick);
const handleInputEnter = (e) => {
if (state.inputType !== "textarea" && !inputRef.value?.isComposing) {
e.preventDefault();
return handleAction("confirm");
}
};
const handleAction = (action) => {
if (props.boxType === "prompt" && action === "confirm" && !validate()) return;
state.action = action;
if (state.beforeClose) state.beforeClose?.(action, state, doClose);
else doClose();
};
const validate = () => {
if (props.boxType === "prompt") {
const inputPattern = state.inputPattern;
if (inputPattern && !inputPattern.test(state.inputValue || "")) {
state.editorErrorMessage = state.inputErrorMessage || t("el.messagebox.error");
state.validateError = true;
return false;
}
const inputValidator = state.inputValidator;
if (isFunction$1(inputValidator)) {
const validateResult = inputValidator(state.inputValue);
if (validateResult === false) {
state.editorErrorMessage = state.inputErrorMessage || t("el.messagebox.error");
state.validateError = true;
return false;
}
if (isString(validateResult)) {
state.editorErrorMessage = validateResult;
state.validateError = true;
return false;
}
}
}
state.editorErrorMessage = "";
state.validateError = false;
return true;
};
const getInputElement = () => {
const inputRefs = inputRef.value?.$refs;
return inputRefs?.input ?? inputRefs?.textarea;
};
const handleClose = () => {
handleAction("close");
};
const onCloseRequested = () => {
if (props.closeOnPressEscape) handleClose();
};
if (props.lockScroll) useLockscreen(visible, { ns });
return {
...(0, vue.toRefs)(state),
ns,
overlayEvent,
visible,
hasMessage,
typeClass,
contentId,
inputId,
btnSize,
iconComponent,
confirmButtonClasses,
rootRef,
focusStartRef,
headerRef,
inputRef,
isDragging,
confirmRef,
doClose,
handleClose,
onCloseRequested,
handleWrapperClick,
handleInputEnter,
handleAction,
t
};
}
});
//#endregion
//#region ../../packages/components/message-box/src/index.vue
const _hoisted_1$1 = ["aria-label", "aria-describedby"];
const _hoisted_2$1 = ["aria-label"];
const _hoisted_3$1 = ["id"];
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
const _component_el_icon = (0, vue.resolveComponent)("el-icon");
const _component_el_input = (0, vue.resolveComponent)("el-input");
const _component_el_button = (0, vue.resolveComponent)("el-button");
const _component_el_focus_trap = (0, vue.resolveComponent)("el-focus-trap");
const _component_el_overlay = (0, vue.resolveComponent)("el-overlay");
return (0, vue.openBlock)(), (0, vue.createBlock)(vue.Transition, {
name: "fade-in-linear",
onAfterLeave: _cache[11] || (_cache[11] = ($event) => _ctx.$emit("vanish")),
persisted: ""
}, {
default: (0, vue.withCtx)(() => [(0, vue.withDirectives)((0, vue.createVNode)(_component_el_overlay, {
"z-index": _ctx.zIndex,
"overlay-class": [_ctx.ns.is("message-box"), _ctx.modalClass],
mask: _ctx.modal
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", {
role: "dialog",
"aria-label": _ctx.title,
"aria-modal": "true",
"aria-describedby": !_ctx.showInput ? _ctx.contentId : void 0,
class: (0, vue.normalizeClass)(`${_ctx.ns.namespace.value}-overlay-message-box`),
onClick: _cache[8] || (_cache[8] = (...args) => _ctx.overlayEvent.onClick && _ctx.overlayEvent.onClick(...args)),
onMousedown: _cache[9] || (_cache[9] = (...args) => _ctx.overlayEvent.onMousedown && _ctx.overlayEvent.onMousedown(...args)),
onMouseup: _cache[10] || (_cache[10] = (...args) => _ctx.overlayEvent.onMouseup && _ctx.overlayEvent.onMouseup(...args))
}, [(0, vue.createVNode)(_component_el_focus_trap, {
loop: "",
trapped: _ctx.visible,
"focus-trap-el": _ctx.rootRef,
"focus-start-el": _ctx.focusStartRef,
onReleaseRequested: _ctx.onCloseRequested
}, {
default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", {
ref: "rootRef",
class: (0, vue.normalizeClass)([
_ctx.ns.b(),
_ctx.customClass,
_ctx.ns.is("draggable", _ctx.draggable),
_ctx.ns.is("dragging", _ctx.isDragging),
{ [_ctx.ns.m("center")]: _ctx.center }
]),
style: (0, vue.normalizeStyle)(_ctx.customStyle),
tabindex: "-1",
onClick: _cache[7] || (_cache[7] = (0, vue.withModifiers)(() => {}, ["stop"]))
}, [
_ctx.title !== null && _ctx.title !== void 0 ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
ref: "headerRef",
class: (0, vue.normalizeClass)([_ctx.ns.e("header"), { "show-close": _ctx.showClose }])
}, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)(_ctx.ns.e("title")) }, [_ctx.iconComponent && _ctx.center ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_icon, {
key: 0,
class: (0, vue.normalizeClass)([_ctx.ns.e("status"), _ctx.typeClass])
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(_ctx.iconComponent)))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(_ctx.title), 1)], 2), _ctx.showClose ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("button", {
key: 0,
type: "button",
class: (0, vue.normalizeClass)(_ctx.ns.e("headerbtn")),
"aria-label": _ctx.t("el.messagebox.close"),
onClick: _cache[0] || (_cache[0] = ($event) => _ctx.handleAction(_ctx.distinguishCancelAndClose ? "close" : "cancel")),
onKeydown: _cache[1] || (_cache[1] = (0, vue.withKeys)((0, vue.withModifiers)(($event) => _ctx.handleAction(_ctx.distinguishCancelAndClose ? "close" : "cancel"), ["prevent"]), ["enter"]))
}, [(0, vue.createVNode)(_component_el_icon, { class: (0, vue.normalizeClass)(_ctx.ns.e("close")) }, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(_ctx.closeIcon || "close")))]),
_: 1
}, 8, ["class"])], 42, _hoisted_2$1)) : (0, vue.createCommentVNode)("v-if", true)], 2)) : (0, vue.createCommentVNode)("v-if", true),
(0, vue.createElementVNode)("div", {
id: _ctx.contentId,
class: (0, vue.normalizeClass)(_ctx.ns.e("content"))
}, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)(_ctx.ns.e("container")) }, [_ctx.iconComponent && !_ctx.center && _ctx.hasMessage ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_icon, {
key: 0,
class: (0, vue.normalizeClass)([_ctx.ns.e("status"), _ctx.typeClass])
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(_ctx.iconComponent)))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true), _ctx.hasMessage ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)(_ctx.ns.e("message"))
}, [(0, vue.renderSlot)(_ctx.$slots, "default", {}, () => [!_ctx.dangerouslyUseHTMLString ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(_ctx.showInput ? "label" : "p"), {
key: 0,
for: _ctx.showInput ? _ctx.inputId : void 0,
textContent: (0, vue.toDisplayString)(_ctx.message)
}, null, 8, ["for", "textContent"])) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(_ctx.showInput ? "label" : "p"), {
key: 1,
for: _ctx.showInput ? _ctx.inputId : void 0,
innerHTML: _ctx.message
}, null, 8, ["for", "innerHTML"]))])], 2)) : (0, vue.createCommentVNode)("v-if", true)], 2), (0, vue.withDirectives)((0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)(_ctx.ns.e("input")) }, [(0, vue.createVNode)(_component_el_input, {
id: _ctx.inputId,
ref: "inputRef",
modelValue: _ctx.inputValue,
"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => _ctx.inputValue = $event),
type: _ctx.inputType,
placeholder: _ctx.inputPlaceholder,
"aria-invalid": _ctx.validateError,
class: (0, vue.normalizeClass)({ invalid: _ctx.validateError }),
onKeydown: (0, vue.withKeys)(_ctx.handleInputEnter, ["enter"])
}, null, 8, [
"id",
"modelValue",
"type",
"placeholder",
"aria-invalid",
"class",
"onKeydown"
]), (0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)(_ctx.ns.e("errormsg")),
style: (0, vue.normalizeStyle)({ visibility: !!_ctx.editorErrorMessage ? "visible" : "hidden" })
}, (0, vue.toDisplayString)(_ctx.editorErrorMessage), 7)], 2), [[vue.vShow, _ctx.showInput]])], 10, _hoisted_3$1),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)(_ctx.ns.e("btns")) }, [_ctx.showCancelButton ? ((0, vue.openBlock)(), (0, vue.createBlock)(_component_el_button, {
key: 0,
type: _ctx.cancelButtonType === "text" ? "" : _ctx.cancelButtonType,
text: _ctx.cancelButtonType === "text",
loading: _ctx.cancelButtonLoading,
"loading-icon": _ctx.cancelButtonLoadingIcon,
class: (0, vue.normalizeClass)([_ctx.cancelButtonClass]),
round: _ctx.roundButton,
size: _ctx.btnSize,
onClick: _cache[3] || (_cache[3] = ($event) => _ctx.handleAction("cancel")),
onKeydown: _cache[4] || (_cache[4] = (0, vue.withKeys)((0, vue.withModifiers)(($event) => _ctx.handleAction("cancel"), ["prevent"]), ["enter"]))
}, {
default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)(_ctx.cancelButtonText || _ctx.t("el.messagebox.cancel")), 1)]),
_: 1
}, 8, [
"type",
"text",
"loading",
"loading-icon",
"class",
"round",
"size"
])) : (0, vue.createCommentVNode)("v-if", true), (0, vue.withDirectives)((0, vue.createVNode)(_component_el_button, {
ref: "confirmRef",
type: _ctx.confirmButtonType === "text" ? "" : _ctx.confirmButtonType,
text: _ctx.confirmButtonType === "text",
loading: _ctx.confirmButtonLoading,
"loading-icon": _ctx.confirmButtonLoadingIcon,
class: (0, vue.normalizeClass)([_ctx.confirmButtonClasses]),
round: _ctx.roundButton,
disabled: _ctx.confirmButtonDisabled,
size: _ctx.btnSize,
onClick: _cache[5] || (_cache[5] = ($event) => _ctx.handleAction("confirm")),
onKeydown: _cache[6] || (_cache[6] = (0, vue.withKeys)((0, vue.withModifiers)(($event) => _ctx.handleAction("confirm"), ["prevent"]), ["enter"]))
}, {
default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)(_ctx.confirmButtonText || _ctx.t("el.messagebox.confirm")), 1)]),
_: 1
}, 8, [
"type",
"text",
"loading",
"loading-icon",
"class",
"round",
"disabled",
"size"
]), [[vue.vShow, _ctx.showConfirmButton]])], 2)
], 6)]),
_: 3
}, 8, [
"trapped",
"focus-trap-el",
"focus-start-el",
"onReleaseRequested"
])], 42, _hoisted_1$1)]),
_: 3
}, 8, [
"z-index",
"overlay-class",
"mask"
]), [[vue.vShow, _ctx.visible]])]),
_: 3
});
}
var src_default = /* @__PURE__ */ _plugin_vue_export_helper_default(index_vue_vue_type_script_lang_default, [["render", _sfc_render]]);
//#endregion
//#region ../../packages/components/message-box/src/messageBox.ts
const messageInstance = /* @__PURE__ */ new Map();
const getAppendToElement = (props) => {
let appendTo = document.body;
if (props.appendTo) {
if (isString(props.appendTo)) appendTo = document.querySelector(props.appendTo);
if (isElement$1(props.appendTo)) appendTo = props.appendTo;
if (!isElement$1(appendTo)) {
/* @__PURE__ */ debugWarn("ElMessageBox", "the appendTo option is not an HTMLElement. Falling back to document.body.");
appendTo = document.body;
}
}
return appendTo;
};
const initInstance = (props, container, appContext = null) => {
const vnode = (0, vue.createVNode)(src_default, props, isFunction$1(props.message) || (0, vue.isVNode)(props.message) ? { default: isFunction$1(props.message) ? props.message : () => props.message } : null);
vnode.appContext = appContext;
(0, vue.render)(vnode, container);
getAppendToElement(props).appendChild(container.firstElementChild);
return vnode.component;
};
const genContainer = () => {
return document.createElement("div");
};
const showMessage = (options, appContext) => {
const container = genContainer();
options.onVanish = () => {
(0, vue.render)(null, container);
messageInstance.delete(vm);
};
options.onAction = (action) => {
const currentMsg = messageInstance.get(vm);
let resolve;
if (options.showInput) resolve = {
value: vm.inputValue,
action
};
else resolve = action;
if (options.callback) options.callback(resolve, instance.proxy);
else if (action === "cancel" || action === "close") if (options.distinguishCancelAndClose && action !== "cancel") currentMsg.reject("close");
else currentMsg.reject("cancel");
else currentMsg.resolve(resolve);
};
const instance = initInstance(options, container, appContext);
const vm = instance.proxy;
for (const prop in options) if (hasOwn(options, prop) && !hasOwn(vm.$props, prop)) if (prop === "closeIcon" && isObject$1(options[prop])) vm[prop] = (0, vue.markRaw)(options[prop]);
else vm[prop] = options[prop];
vm.visible = true;
return vm;
};
function MessageBox(options, appContext = null) {
if (!isClient) return Promise.reject();
let callback;
if (isString(options) || (0, vue.isVNode)(options)) options = { message: options };
else callback = options.callback;
return new Promise((resolve, reject) => {
const vm = showMessage(options, appContext ?? MessageBox._context);
messageInstance.set(vm, {
options,
callback,
resolve,
reject
});
});
}
const MESSAGE_BOX_VARIANTS = [
"alert",
"confirm",
"prompt"
];
const MESSAGE_BOX_DEFAULT_OPTS = {
alert: {
closeOnPressEscape: false,
closeOnClickModal: false
},
confirm: { showCancelButton: true },
prompt: {
showCancelButton: true,
showInput: true
}
};
MESSAGE_BOX_VARIANTS.forEach((boxType) => {
MessageBox[boxType] = messageBoxFactory(boxType);
});
function messageBoxFactory(boxType) {
return (message, title, options, appContext) => {
let titleOrOpts = "";
if (isObject$1(title)) {
options = title;
titleOrOpts = "";
} else if (isUndefined(title)) titleOrOpts = "";
else titleOrOpts = title;
return MessageBox(Object.assign({
title: titleOrOpts,
message,
type: "",
...MESSAGE_BOX_DEFAULT_OPTS[boxType]
}, options, { boxType }), appContext);
};
}
MessageBox.close = () => {
messageInstance.forEach((_, vm) => {
vm.doClose();
});
messageInstance.clear();
};
MessageBox._context = null;
//#endregion
//#region ../../packages/components/message-box/index.ts
const _MessageBox = MessageBox;
_MessageBox.install = (app) => {
_MessageBox._context = app._context;
app.config.globalProperties.$msgbox = _MessageBox;
app.config.globalProperties.$messageBox = _MessageBox;
app.config.globalProperties.$alert = _MessageBox.alert;
app.config.globalProperties.$confirm = _MessageBox.confirm;
app.config.globalProperties.$prompt = _MessageBox.prompt;
};
const ElMessageBox = _MessageBox;
//#endregion
//#region ../../packages/components/notification/src/notification.ts
const notificationTypes = [
"primary",
"success",
"info",
"warning",
"error"
];
/**
* @deprecated Removed after 3.0.0, Use `NotificationProps` instead.
*/
const notificationProps = buildProps({
customClass: {
type: String,
default: ""
},
dangerouslyUseHTMLString: Boolean,
duration: {
type: Number,
default: 4500
},
icon: { type: iconPropType },
id: {
type: String,
default: ""
},
message: {
type: definePropType([
String,
Object,
Function
]),
default: ""
},
offset: {
type: Number,
default: 0
},
onClick: {
type: definePropType(Function),
default: () => void 0
},
onClose: {
type: definePropType(Function),
required: true
},
position: {
type: String,
values: [
"top-right",
"top-left",
"bottom-right",
"bottom-left"
],
default: "top-right"
},
showClose: {
type: Boolean,
default: true
},
title: {
type: String,
default: ""
},
type: {
type: String,
values: [...notificationTypes, ""],
default: ""
},
zIndex: Number,
closeIcon: {
type: iconPropType,
default: close_default
}
});
const notificationEmits = { destroy: () => true };
//#endregion
//#region ../../packages/components/notification/src/notification.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1 = ["id"];
const _hoisted_2 = ["textContent"];
const _hoisted_3 = { key: 0 };
const _hoisted_4 = ["innerHTML"];
var notification_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElNotification",
__name: "notification",
props: notificationProps,
emits: notificationEmits,
setup(__props, { expose: __expose }) {
const props = __props;
const { ns, zIndex } = useGlobalComponentSettings("notification");
const { nextZIndex, currentZIndex } = zIndex;
const visible = (0, vue.ref)(false);
let timer = void 0;
const typeClass = (0, vue.computed)(() => {
const type = props.type;
return type && TypeComponentsMap[props.type] ? ns.m(type) : "";
});
const iconComponent = (0, vue.computed)(() => {
if (!props.type) return props.icon;
return TypeComponentsMap[props.type] || props.icon;
});
const horizontalClass = (0, vue.computed)(() => props.position.endsWith("right") ? "right" : "left");
const verticalProperty = (0, vue.computed)(() => props.position.startsWith("top") ? "top" : "bottom");
const positionStyle = (0, vue.computed)(() => {
return {
[verticalProperty.value]: `${props.offset}px`,
zIndex: props.zIndex ?? currentZIndex.value
};
});
function startTimer() {
if (props.duration > 0) ({stop: timer} = useTimeoutFn(() => {
if (visible.value) close();
}, props.duration));
}
function clearTimer() {
timer?.();
}
function close() {
visible.value = false;
}
function onKeydown(event) {
switch (getEventCode(event)) {
case EVENT_CODE.delete:
case EVENT_CODE.backspace:
clearTimer();
break;
case EVENT_CODE.esc:
if (visible.value) close();
break;
default:
startTimer();
break;
}
}
(0, vue.onMounted)(() => {
startTimer();
nextZIndex();
visible.value = true;
});
useEventListener(document, "keydown", onKeydown);
__expose({
visible,
close
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createBlock)(vue.Transition, {
name: (0, vue.unref)(ns).b("fade"),
onBeforeLeave: __props.onClose,
onAfterLeave: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("destroy")),
persisted: ""
}, {
default: (0, vue.withCtx)(() => [(0, vue.withDirectives)((0, vue.createElementVNode)("div", {
id: __props.id,
class: (0, vue.normalizeClass)([
(0, vue.unref)(ns).b(),
__props.customClass,
horizontalClass.value
]),
style: (0, vue.normalizeStyle)(positionStyle.value),
role: "alert",
onMouseenter: clearTimer,
onMouseleave: startTimer,
onClick: _cache[0] || (_cache[0] = (...args) => __props.onClick && __props.onClick(...args))
}, [iconComponent.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("icon"), typeClass.value])
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(iconComponent.value)))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("group")) }, [
(0, vue.createElementVNode)("h2", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("title")),
textContent: (0, vue.toDisplayString)(__props.title)
}, null, 10, _hoisted_2),
(0, vue.withDirectives)((0, vue.createElementVNode)("div", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("content")),
style: (0, vue.normalizeStyle)(!!__props.title ? void 0 : { margin: 0 })
}, [(0, vue.renderSlot)(_ctx.$slots, "default", {}, () => [!__props.dangerouslyUseHTMLString ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("p", _hoisted_3, (0, vue.toDisplayString)(__props.message), 1)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, [(0, vue.createCommentVNode)(" Caution here, message could've been compromised, never use user's input as message "), (0, vue.createElementVNode)("p", { innerHTML: __props.message }, null, 8, _hoisted_4)], 2112))])], 6), [[vue.vShow, __props.message]]),
__props.showClose ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ElIcon), {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("closeBtn")),
onClick: (0, vue.withModifiers)(close, ["stop"])
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.closeIcon)))]),
_: 1
}, 8, ["class"])) : (0, vue.createCommentVNode)("v-if", true)
], 2)], 46, _hoisted_1), [[vue.vShow, visible.value]])]),
_: 3
}, 8, ["name", "onBeforeLeave"]);
};
}
});
//#endregion
//#region ../../packages/components/notification/src/notification.vue
var notification_default = notification_vue_vue_type_script_setup_true_lang_default;
//#endregion
//#region ../../packages/components/notification/src/notify.ts
const notifications = {
"top-left": [],
"top-right": [],
"bottom-left": [],
"bottom-right": []
};
const GAP_SIZE = 16;
let seed = 1;
const notify = function(options = {}, context) {
if (!isClient) return { close: () => void 0 };
if (isString(options) || (0, vue.isVNode)(options)) options = { message: options };
const position = options.position || "top-right";
let verticalOffset = options.offset || 0;
notifications[position].forEach(({ vm }) => {
verticalOffset += (vm.el?.offsetHeight || 0) + GAP_SIZE;
});
verticalOffset += GAP_SIZE;
const id = `notification_${seed++}`;
const userOnClose = options.onClose;
const props = {
...options,
offset: verticalOffset,
id,
onClose: () => {
close(id, position, userOnClose);
}
};
let appendTo = document.body;
if (isElement$1(options.appendTo)) appendTo = options.appendTo;
else if (isString(options.appendTo)) appendTo = document.querySelector(options.appendTo);
if (!isElement$1(appendTo)) {
/* @__PURE__ */ debugWarn("ElNotification", "the appendTo option is not an HTMLElement. Falling back to document.body.");
appendTo = document.body;
}
const container = document.createElement("div");
const vm = (0, vue.createVNode)(notification_default, props, isFunction$1(props.message) ? props.message : (0, vue.isVNode)(props.message) ? () => props.message : null);
vm.appContext = isUndefined(context) ? notify._context : context;
vm.props.onDestroy = () => {
(0, vue.render)(null, container);
};
(0, vue.render)(vm, container);
notifications[position].push({ vm });
appendTo.appendChild(container.firstElementChild);
return { close: () => {
vm.component.exposed.visible.value = false;
} };
};
notificationTypes.forEach((type) => {
notify[type] = (options = {}, appContext) => {
if (isString(options) || (0, vue.isVNode)(options)) options = { message: options };
return notify({
...options,
type
}, appContext);
};
});
/**
* This function gets called when user click `x` button or press `esc` or the time reached its limitation.
* Emitted by transition@before-leave event so that we can fetch the current notification.offsetHeight, if this was called
* by @after-leave the DOM element will be removed from the page thus we can no longer fetch the offsetHeight.
* @param {String} id notification id to be closed
* @param {Position} position the positioning strategy
* @param {Function} userOnClose the callback called when close passed by user
*/
function close(id, position, userOnClose) {
const orientedNotifications = notifications[position];
const idx = orientedNotifications.findIndex(({ vm }) => vm.component?.props.id === id);
if (idx === -1) return;
const { vm } = orientedNotifications[idx];
if (!vm) return;
userOnClose?.(vm);
const removedHeight = vm.el.offsetHeight;
const verticalPos = position.split("-")[0];
orientedNotifications.splice(idx, 1);
const len = orientedNotifications.length;
if (len < 1) return;
for (let i = idx; i < len; i++) {
const { el, component } = orientedNotifications[i].vm;
const pos = Number.parseInt(el.style[verticalPos], 10) - removedHeight - GAP_SIZE;
component.props.offset = pos;
}
}
function closeAll() {
for (const orientedNotifications of Object.values(notifications)) orientedNotifications.forEach(({ vm }) => {
vm.component.exposed.visible.value = false;
});
}
function updateOffsets(position = "top-right") {
let verticalOffset = notifications[position][0]?.vm.component?.props?.offset || 0;
for (const { vm } of notifications[position]) {
vm.component.props.offset = verticalOffset;
verticalOffset += (vm.el?.offsetHeight || 0) + GAP_SIZE;
}
}
notify.closeAll = closeAll;
notify.updateOffsets = updateOffsets;
notify._context = null;
//#endregion
//#region ../../packages/components/notification/index.ts
const ElNotification = withInstallFunction(notify, "$notify");
//#endregion
//#region ../../packages/element-plus/plugin.ts
var plugin_default = [
ElInfiniteScroll,
ElLoading,
ElMessage,
ElMessageBox,
ElNotification,
ElPopoverDirective
];
//#endregion
//#region ../../packages/element-plus/defaults.ts
var defaults_default = makeInstaller([...component_default, ...plugin_default]);
//#endregion
//#region ../../packages/element-plus/index.ts
const install = defaults_default.install;
const version = defaults_default.version;
var element_plus_default = defaults_default;
//#endregion
exports.BAR_MAP = BAR_MAP;
exports.BORDER_HORIZONTAL_WIDTH = BORDER_HORIZONTAL_WIDTH;
exports.CAROUSEL_ITEM_NAME = CAROUSEL_ITEM_NAME;
exports.CASCADER_PANEL_INJECTION_KEY = CASCADER_PANEL_INJECTION_KEY;
exports.CHANGE_EVENT = CHANGE_EVENT;
exports.ClickOutside = ClickOutside;
exports.CommonPicker = picker_default;
exports.CommonProps = CommonProps;
exports.DEFAULT_DIALOG_TRANSITION = DEFAULT_DIALOG_TRANSITION;
exports.DEFAULT_EMPTY_VALUES = DEFAULT_EMPTY_VALUES;
exports.DEFAULT_FORMATS_DATE = DEFAULT_FORMATS_DATE;
exports.DEFAULT_FORMATS_DATEPICKER = DEFAULT_FORMATS_DATEPICKER;
exports.DEFAULT_FORMATS_TIME = DEFAULT_FORMATS_TIME;
exports.DEFAULT_STEP = DEFAULT_STEP;
exports.DEFAULT_VALUE_ON_CLEAR = DEFAULT_VALUE_ON_CLEAR;
exports.DROPDOWN_INJECTION_KEY = DROPDOWN_INJECTION_KEY;
exports.DROPDOWN_INSTANCE_INJECTION_KEY = DROPDOWN_INSTANCE_INJECTION_KEY;
exports.DefaultProps = DefaultProps;
exports.DynamicSizeGrid = DynamicSizeGrid;
exports.DynamicSizeList = DynamicSizeList;
exports.EVENT_CODE = EVENT_CODE;
exports.Effect = Effect;
exports.ElAffix = ElAffix;
exports.ElAlert = ElAlert;
exports.ElAnchor = ElAnchor;
exports.ElAnchorLink = ElAnchorLink;
exports.ElAside = ElAside;
exports.ElAutoResizer = ElAutoResizer;
exports.ElAutocomplete = ElAutocomplete;
exports.ElAvatar = ElAvatar;
exports.ElAvatarGroup = ElAvatarGroup;
exports.ElBacktop = ElBacktop;
exports.ElBadge = ElBadge;
exports.ElBreadcrumb = ElBreadcrumb;
exports.ElBreadcrumbItem = ElBreadcrumbItem;
exports.ElButton = ElButton;
exports.ElButtonGroup = ElButtonGroup;
exports.ElCalendar = ElCalendar;
exports.ElCard = ElCard;
exports.ElCarousel = ElCarousel;
exports.ElCarouselItem = ElCarouselItem;
exports.ElCascader = ElCascader;
exports.ElCascaderPanel = ElCascaderPanel;
exports.ElCheckTag = ElCheckTag;
exports.ElCheckbox = ElCheckbox;
exports.ElCheckboxButton = ElCheckboxButton;
exports.ElCheckboxGroup = ElCheckboxGroup;
exports.ElCol = ElCol;
exports.ElCollapse = ElCollapse;
exports.ElCollapseItem = ElCollapseItem;
exports.ElCollapseTransition = ElCollapseTransition;
exports.ElColorPicker = ElColorPicker;
exports.ElColorPickerPanel = ElColorPickerPanel;
exports.ElConfigProvider = ElConfigProvider;
exports.ElContainer = ElContainer;
exports.ElCountdown = ElCountdown;
exports.ElDatePicker = ElDatePicker;
exports.ElDatePickerPanel = ElDatePickerPanel;
exports.ElDescriptions = ElDescriptions;
exports.ElDescriptionsItem = ElDescriptionsItem;
exports.ElDialog = ElDialog;
exports.ElDivider = ElDivider;
exports.ElDrawer = ElDrawer;
exports.ElDropdown = ElDropdown;
exports.ElDropdownItem = ElDropdownItem;
exports.ElDropdownMenu = ElDropdownMenu;
exports.ElEmpty = ElEmpty;
exports.ElFooter = ElFooter;
exports.ElForm = ElForm;
exports.ElFormItem = ElFormItem;
exports.ElHeader = ElHeader;
exports.ElIcon = ElIcon;
exports.ElImage = ElImage;
exports.ElImageViewer = ElImageViewer;
exports.ElInfiniteScroll = ElInfiniteScroll;
exports.ElInput = ElInput;
exports.ElInputNumber = ElInputNumber;
exports.ElInputTag = ElInputTag;
exports.ElLink = ElLink;
exports.ElLoading = ElLoading;
exports.ElLoadingDirective = vLoading;
exports.vLoading = vLoading;
exports.ElLoadingService = Loading;
exports.ElMain = ElMain;
exports.ElMention = ElMention;
exports.ElMenu = ElMenu;
exports.ElMenuItem = ElMenuItem;
exports.ElMenuItemGroup = ElMenuItemGroup;
exports.ElMessage = ElMessage;
exports.ElMessageBox = ElMessageBox;
exports.ElNotification = ElNotification;
exports.ElOption = ElOption;
exports.ElOptionGroup = ElOptionGroup;
exports.ElOverlay = ElOverlay;
exports.ElPageHeader = ElPageHeader;
exports.ElPagination = ElPagination;
exports.ElPopconfirm = ElPopconfirm;
exports.ElPopover = ElPopover;
exports.ElPopoverDirective = ElPopoverDirective;
exports.ElPopper = ElPopper;
exports.ElPopperArrow = arrow_default;
exports.ElPopperContent = content_default;
exports.ElPopperTrigger = trigger_default;
exports.ElProgress = ElProgress;
exports.ElRadio = ElRadio;
exports.ElRadioButton = ElRadioButton;
exports.ElRadioGroup = ElRadioGroup;
exports.ElRate = ElRate;
exports.ElResult = ElResult;
exports.ElRow = ElRow;
exports.ElScrollbar = ElScrollbar;
exports.ElSegmented = ElSegmented;
exports.ElSelect = ElSelect;
exports.ElSelectV2 = ElSelectV2;
exports.ElSkeleton = ElSkeleton;
exports.ElSkeletonItem = ElSkeletonItem;
exports.ElSlider = ElSlider;
exports.ElSpace = ElSpace;
exports.ElSplitter = ElSplitter;
exports.ElSplitterPanel = ElSplitterPanel;
exports.ElStatistic = ElStatistic;
exports.ElStep = ElStep;
exports.ElSteps = ElSteps;
exports.ElSubMenu = ElSubMenu;
exports.ElSwitch = ElSwitch;
exports.ElTabPane = ElTabPane;
exports.ElTable = ElTable;
exports.ElTableColumn = ElTableColumn;
exports.ElTableV2 = ElTableV2;
exports.ElTabs = ElTabs;
exports.ElTag = ElTag;
exports.ElText = ElText;
exports.ElTimePicker = ElTimePicker;
exports.ElTimeSelect = ElTimeSelect;
exports.ElTimeline = ElTimeline;
exports.ElTimelineItem = ElTimelineItem;
exports.ElTooltip = ElTooltip;
exports.ElTour = ElTour;
exports.ElTourStep = ElTourStep;
exports.ElTransfer = ElTransfer;
exports.ElTree = ElTree;
exports.ElTreeSelect = ElTreeSelect;
exports.ElTreeV2 = ElTreeV2;
exports.ElUpload = ElUpload;
exports.ElWatermark = ElWatermark;
exports.FIRST_KEYS = FIRST_KEYS;
exports.FIRST_LAST_KEYS = FIRST_LAST_KEYS;
exports.FORWARD_REF_INJECTION_KEY = FORWARD_REF_INJECTION_KEY;
exports.FixedSizeGrid = FixedSizeGrid;
exports.FixedSizeList = FixedSizeList;
exports.GAP = GAP;
exports.ID_INJECTION_KEY = ID_INJECTION_KEY;
exports.INPUT_EVENT = INPUT_EVENT;
exports.INSTALLED_KEY = INSTALLED_KEY;
exports.IconComponentMap = IconComponentMap;
exports.IconMap = IconMap;
exports.LAST_KEYS = LAST_KEYS;
exports.LEFT_CHECK_CHANGE_EVENT = LEFT_CHECK_CHANGE_EVENT;
exports.MENU_INJECTION_KEY = MENU_INJECTION_KEY;
exports.MESSAGE_DEFAULT_PLACEMENT = MESSAGE_DEFAULT_PLACEMENT;
exports.MINIMUM_INPUT_WIDTH = MINIMUM_INPUT_WIDTH;
exports.Mousewheel = Mousewheel;
exports.NODE_INSTANCE_INJECTION_KEY = NODE_INSTANCE_INJECTION_KEY;
exports.PICKER_BASE_INJECTION_KEY = PICKER_BASE_INJECTION_KEY;
exports.PICKER_POPPER_OPTIONS_INJECTION_KEY = PICKER_POPPER_OPTIONS_INJECTION_KEY;
exports.POPPER_CONTENT_INJECTION_KEY = POPPER_CONTENT_INJECTION_KEY;
exports.POPPER_INJECTION_KEY = POPPER_INJECTION_KEY;
exports.RIGHT_CHECK_CHANGE_EVENT = RIGHT_CHECK_CHANGE_EVENT;
exports.ROOT_COMMON_COLOR_INJECTION_KEY = ROOT_COMMON_COLOR_INJECTION_KEY;
exports.ROOT_COMMON_PICKER_INJECTION_KEY = ROOT_COMMON_PICKER_INJECTION_KEY;
exports.ROOT_PICKER_INJECTION_KEY = ROOT_PICKER_INJECTION_KEY;
exports.ROOT_PICKER_IS_DEFAULT_FORMAT_INJECTION_KEY = ROOT_PICKER_IS_DEFAULT_FORMAT_INJECTION_KEY;
exports.ROOT_TREE_INJECTION_KEY = ROOT_TREE_INJECTION_KEY;
exports.RowAlign = RowAlign;
exports.RowJustify = RowJustify;
exports.SCOPE = SCOPE;
exports.SIZE_INJECTION_KEY = SIZE_INJECTION_KEY;
exports.STEPS_INJECTION_KEY = STEPS_INJECTION_KEY;
exports.SUB_MENU_INJECTION_KEY = SUB_MENU_INJECTION_KEY;
exports.TIMELINE_INJECTION_KEY = TIMELINE_INJECTION_KEY;
exports.TOOLTIP_INJECTION_KEY = TOOLTIP_INJECTION_KEY;
exports.TREE_NODE_MAP_INJECTION_KEY = TREE_NODE_MAP_INJECTION_KEY;
exports.TableV2 = TableV2;
exports.TableV2Alignment = Alignment;
exports.TableV2FixedDir = FixedDir;
exports.TableV2Placeholder = placeholderSign;
exports.TableV2SortOrder = SortOrder;
exports.TimePickPanel = panel_time_pick_default;
exports.TrapFocus = TrapFocus;
exports.UPDATE_MODEL_EVENT = UPDATE_MODEL_EVENT;
exports.WEEK_DAYS = WEEK_DAYS;
exports.ZINDEX_INJECTION_KEY = ZINDEX_INJECTION_KEY;
exports.affixEmits = affixEmits;
exports.affixProps = affixProps;
exports.alertEffects = alertEffects;
exports.alertEmits = alertEmits;
exports.alertProps = alertProps;
exports.anchorEmits = anchorEmits;
exports.anchorProps = anchorProps;
exports.ariaProps = ariaProps;
exports.arrowMiddleware = arrowMiddleware;
exports.autoResizerProps = autoResizerProps;
exports.autocompleteEmits = autocompleteEmits;
exports.autocompleteProps = autocompleteProps;
exports.avatarEmits = avatarEmits;
exports.avatarGroupContextKey = avatarGroupContextKey;
exports.avatarGroupProps = avatarGroupProps;
exports.avatarProps = avatarProps;
exports.backtopEmits = backtopEmits;
exports.backtopProps = backtopProps;
exports.badgeProps = badgeProps;
exports.breadcrumbItemProps = breadcrumbItemProps;
exports.breadcrumbKey = breadcrumbKey;
exports.breadcrumbProps = breadcrumbProps;
exports.buildLocaleContext = buildLocaleContext;
exports.buildTimeList = buildTimeList;
exports.buildTranslator = buildTranslator;
exports.buttonEmits = buttonEmits;
exports.buttonGroupContextKey = buttonGroupContextKey;
exports.buttonNativeTypes = buttonNativeTypes;
exports.buttonProps = buttonProps;
exports.buttonTypes = buttonTypes;
exports.calendarEmits = calendarEmits;
exports.calendarProps = calendarProps;
exports.cardContextKey = cardContextKey;
exports.cardProps = cardProps;
exports.carouselContextKey = carouselContextKey;
exports.carouselEmits = carouselEmits;
exports.carouselItemProps = carouselItemProps;
exports.carouselProps = carouselProps;
exports.cascaderEmits = cascaderEmits;
exports.cascaderPanelEmits = cascaderPanelEmits;
exports.cascaderPanelProps = cascaderPanelProps;
exports.cascaderProps = cascaderProps;
exports.checkTagEmits = checkTagEmits;
exports.checkTagProps = checkTagProps;
exports.checkboxDefaultProps = checkboxDefaultProps;
exports.checkboxEmits = checkboxEmits;
exports.checkboxGroupContextKey = checkboxGroupContextKey;
exports.checkboxGroupEmits = checkboxGroupEmits;
exports.checkboxGroupProps = checkboxGroupProps;
exports.checkboxProps = checkboxProps;
exports.checkboxPropsDefaults = checkboxPropsDefaults;
exports.colProps = colProps;
exports.collapseContextKey = collapseContextKey;
exports.collapseEmits = collapseEmits;
exports.collapseItemProps = collapseItemProps;
exports.collapseProps = collapseProps;
exports.colorPickerEmits = colorPickerEmits;
exports.colorPickerPanelContextKey = colorPickerPanelContextKey;
exports.colorPickerPanelEmits = colorPickerPanelEmits;
exports.colorPickerPanelProps = colorPickerPanelProps;
exports.colorPickerProps = colorPickerProps;
exports.colorPickerPropsDefaults = colorPickerPropsDefaults;
exports.columnAlignment = columnAlignment;
exports.componentSizeMap = componentSizeMap;
exports.componentSizes = componentSizes;
exports.configProviderContextKey = configProviderContextKey;
exports.configProviderProps = configProviderProps;
exports.countdownEmits = countdownEmits;
exports.countdownProps = countdownProps;
exports.createModelToggleComposable = createModelToggleComposable;
exports.dateEquals = dateEquals;
exports.datePickTypes = datePickTypes;
exports.datePickerPanelProps = datePickerPanelProps;
exports.datePickerProps = datePickerProps;
exports.dayOrDaysToDate = dayOrDaysToDate;
Object.defineProperty(exports, 'dayjs', {
enumerable: true,
get: function () {
return import_dayjs_min.default;
}
});
exports.default = element_plus_default;
exports.defaultInitialZIndex = defaultInitialZIndex;
exports.defaultNamespace = defaultNamespace;
exports.defaultProps = defaultProps;
exports.descriptionItemProps = descriptionItemProps;
exports.descriptionProps = descriptionProps;
exports.dialogContextKey = dialogContextKey;
exports.dialogEmits = dialogEmits;
exports.dialogInjectionKey = dialogInjectionKey;
exports.dialogProps = dialogProps;
exports.dialogPropsDefaults = dialogPropsDefaults;
exports.dividerProps = dividerProps;
exports.drawerEmits = drawerEmits;
exports.drawerProps = drawerProps;
exports.dropdownItemProps = dropdownItemProps;
exports.dropdownMenuProps = dropdownMenuProps;
exports.dropdownProps = dropdownProps;
exports.elPaginationKey = elPaginationKey;
exports.emitChangeFn = emitChangeFn;
exports.emptyProps = emptyProps;
exports.emptyValuesContextKey = emptyValuesContextKey;
exports.extractDateFormat = extractDateFormat;
exports.extractTimeFormat = extractTimeFormat;
exports.formContextKey = formContextKey;
exports.formEmits = formEmits;
exports.formItemContextKey = formItemContextKey;
exports.formItemProps = formItemProps;
exports.formItemValidateStates = formItemValidateStates;
exports.formMetaProps = formMetaProps;
exports.formProps = formProps;
exports.formatter = formatter;
exports.genFileId = genFileId;
exports.getPositionDataWithUnit = getPositionDataWithUnit;
exports.iconProps = iconProps;
exports.imageEmits = imageEmits;
exports.imageProps = imageProps;
exports.imageViewerEmits = imageViewerEmits;
exports.imageViewerProps = imageViewerProps;
exports.inputEmits = inputEmits;
exports.inputNumberEmits = inputNumberEmits;
exports.inputNumberProps = inputNumberProps;
exports.inputProps = inputProps;
exports.inputPropsDefaults = inputPropsDefaults;
exports.inputTagEmits = inputTagEmits;
exports.inputTagProps = inputTagProps;
exports.install = install;
exports.linkEmits = linkEmits;
exports.linkProps = linkProps;
exports.localeContextKey = localeContextKey;
exports.makeInstaller = makeInstaller;
exports.makeList = makeList;
exports.mentionDefaultProps = mentionDefaultProps;
exports.mentionEmits = mentionEmits;
exports.mentionProps = mentionProps;
exports.menuEmits = menuEmits;
exports.menuItemEmits = menuItemEmits;
exports.menuItemGroupProps = menuItemGroupProps;
exports.menuItemProps = menuItemProps;
exports.menuProps = menuProps;
exports.messageConfig = messageConfig;
exports.messageDefaults = messageDefaults;
exports.messageEmits = messageEmits;
exports.messagePlacement = messagePlacement;
exports.messageProps = messageProps;
exports.messageTypes = messageTypes;
exports.namespaceContextKey = namespaceContextKey;
exports.notificationEmits = notificationEmits;
exports.notificationProps = notificationProps;
exports.notificationTypes = notificationTypes;
exports.overlayEmits = overlayEmits;
exports.overlayProps = overlayProps;
exports.pageHeaderEmits = pageHeaderEmits;
exports.pageHeaderProps = pageHeaderProps;
exports.paginationEmits = paginationEmits;
exports.paginationProps = paginationProps;
exports.parseDate = parseDate;
exports.popconfirmEmits = popconfirmEmits;
exports.popconfirmProps = popconfirmProps;
exports.popoverEmits = popoverEmits;
exports.popoverProps = popoverProps;
exports.popoverPropsDefaults = popoverPropsDefaults;
exports.popperArrowProps = popperArrowProps;
exports.popperArrowPropsDefaults = popperArrowPropsDefaults;
exports.popperContentEmits = popperContentEmits;
exports.popperContentProps = popperContentProps;
exports.popperContentPropsDefaults = popperContentPropsDefaults;
exports.popperCoreConfigProps = popperCoreConfigProps;
exports.popperCoreConfigPropsDefaults = popperCoreConfigPropsDefaults;
exports.popperProps = popperProps;
exports.popperTriggerProps = popperTriggerProps;
exports.progressProps = progressProps;
exports.provideGlobalConfig = provideGlobalConfig;
exports.radioButtonProps = radioButtonProps;
exports.radioButtonPropsDefaults = radioButtonPropsDefaults;
exports.radioDefaultProps = radioDefaultProps;
exports.radioEmits = radioEmits;
exports.radioGroupEmits = radioGroupEmits;
exports.radioGroupKey = radioGroupKey;
exports.radioGroupProps = radioGroupProps;
exports.radioGroupPropsDefaults = radioGroupPropsDefaults;
exports.radioProps = radioProps;
exports.radioPropsBase = radioPropsBase;
exports.radioPropsDefaults = radioPropsDefaults;
exports.rangeArr = rangeArr;
exports.rateEmits = rateEmits;
exports.rateProps = rateProps;
exports.renderThumbStyle = renderThumbStyle;
exports.resultProps = resultProps;
exports.roleTypes = roleTypes;
exports.rowContextKey = rowContextKey;
exports.rowProps = rowProps;
exports.scrollbarContextKey = scrollbarContextKey;
exports.scrollbarEmits = scrollbarEmits;
exports.scrollbarProps = scrollbarProps;
exports.segmentedEmits = segmentedEmits;
exports.segmentedProps = segmentedProps;
exports.selectEmits = selectEmits;
exports.selectGroupKey = selectGroupKey;
exports.selectKey = selectKey;
exports.selectProps = selectProps;
exports.selectV2InjectionKey = selectV2InjectionKey;
exports.skeletonItemProps = skeletonItemProps;
exports.skeletonProps = skeletonProps;
exports.sliderContextKey = sliderContextKey;
exports.sliderEmits = sliderEmits;
exports.sliderProps = sliderProps;
exports.spaceItemProps = spaceItemProps;
exports.spaceProps = spaceProps;
exports.splitterEmits = splitterEmits;
exports.splitterPanelEmits = splitterPanelEmits;
exports.splitterPanelProps = splitterPanelProps;
exports.splitterProps = splitterProps;
exports.statisticProps = statisticProps;
exports.stepProps = stepProps;
exports.stepsEmits = stepsEmits;
exports.stepsProps = stepsProps;
exports.subMenuProps = subMenuProps;
exports.switchEmits = switchEmits;
exports.switchProps = switchProps;
exports.tabBarProps = tabBarProps;
exports.tabNavEmits = tabNavEmits;
exports.tabNavProps = tabNavProps;
exports.tabPaneProps = tabPaneProps;
exports.tableV2Props = tableV2Props;
exports.tableV2RowProps = tableV2RowProps;
exports.tabsEmits = tabsEmits;
exports.tabsProps = tabsProps;
exports.tabsRootContextKey = tabsRootContextKey;
exports.tagEmits = tagEmits;
exports.tagProps = tagProps;
exports.textProps = textProps;
exports.thumbProps = thumbProps;
exports.timePickerDefaultProps = timePickerDefaultProps;
exports.timePickerRangeTriggerProps = timePickerRangeTriggerProps;
exports.timePickerRngeTriggerProps = timePickerRngeTriggerProps;
exports.timeSelectProps = timeSelectProps;
exports.timeUnits = timeUnits;
exports.timelineItemProps = timelineItemProps;
exports.timelineProps = timelineProps;
exports.tooltipEmits = tooltipEmits;
exports.tourContentEmits = tourContentEmits;
exports.tourContentProps = tourContentProps;
exports.tourEmits = tourEmits;
exports.tourPlacements = tourPlacements;
exports.tourProps = tourProps;
exports.tourStepEmits = tourStepEmits;
exports.tourStepProps = tourStepProps;
exports.tourStrategies = tourStrategies;
exports.transferCheckedChangeFn = transferCheckedChangeFn;
exports.transferEmits = transferEmits;
exports.transferProps = transferProps;
exports.translate = translate;
exports.treeEmits = treeEmits;
exports.treeProps = treeProps;
exports.uploadBaseProps = uploadBaseProps;
exports.uploadBasePropsDefaults = uploadBasePropsDefaults;
exports.uploadContentProps = uploadContentProps;
exports.uploadContentPropsDefaults = uploadContentPropsDefaults;
exports.uploadContextKey = uploadContextKey;
exports.uploadDraggerEmits = uploadDraggerEmits;
exports.uploadDraggerProps = uploadDraggerProps;
exports.uploadListEmits = uploadListEmits;
exports.uploadListProps = uploadListProps;
exports.uploadListTypes = uploadListTypes;
exports.uploadProps = uploadProps;
exports.uploadPropsDefaults = uploadPropsDefaults;
exports.useAriaProps = useAriaProps;
exports.useAttrs = useAttrs;
exports.useCalcInputWidth = useCalcInputWidth;
exports.useCascaderConfig = useCascaderConfig;
exports.useComposition = useComposition;
exports.useCursor = useCursor;
exports.useDelayedRender = useDelayedRender;
exports.useDelayedToggle = useDelayedToggle;
exports.useDelayedToggleProps = useDelayedToggleProps;
exports.useDelayedTogglePropsDefaults = useDelayedTogglePropsDefaults;
exports.useDeprecated = useDeprecated;
exports.useDialog = useDialog;
exports.useDisabled = useDisabled;
exports.useDraggable = useDraggable;
exports.useEmptyValues = useEmptyValues;
exports.useEmptyValuesProps = useEmptyValuesProps;
exports.useEscapeKeydown = useEscapeKeydown;
exports.useFloating = useFloating;
exports.useFloatingProps = useFloatingProps;
exports.useFocus = useFocus;
exports.useFocusController = useFocusController;
exports.useFormDisabled = useFormDisabled;
exports.useFormItem = useFormItem;
exports.useFormItemInputId = useFormItemInputId;
exports.useFormSize = useFormSize;
exports.useForwardRef = useForwardRef;
exports.useForwardRefDirective = useForwardRefDirective;
exports.useGetDerivedNamespace = useGetDerivedNamespace;
exports.useGlobalComponentSettings = useGlobalComponentSettings;
exports.useGlobalConfig = useGlobalConfig;
exports.useGlobalSize = useGlobalSize;
exports.useId = useId;
exports.useIdInjection = useIdInjection;
exports.useLocale = useLocale;
exports.useLockscreen = useLockscreen;
exports.useModal = useModal;
exports.useModelToggle = useModelToggle;
exports.useModelToggleEmits = useModelToggleEmits;
exports.useModelToggleProps = useModelToggleProps;
exports.useNamespace = useNamespace;
exports.useOrderedChildren = useOrderedChildren;
exports.usePopper = usePopper;
exports.usePopperArrowProps = usePopperArrowProps;
exports.usePopperContainer = usePopperContainer;
exports.usePopperContainerId = usePopperContainerId;
exports.usePopperContentEmits = usePopperContentEmits;
exports.usePopperContentProps = usePopperContentProps;
exports.usePopperCoreConfigProps = usePopperCoreConfigProps;
exports.usePopperProps = usePopperProps;
exports.usePopperTriggerProps = usePopperTriggerProps;
exports.usePreventGlobal = usePreventGlobal;
exports.useProp = useProp;
exports.useSameTarget = useSameTarget;
exports.useSize = useSize;
exports.useSizeProp = useSizeProp;
exports.useSizeProps = useSizeProps;
exports.useSpace = useSpace;
exports.useTeleport = useTeleport;
exports.useThrottleRender = useThrottleRender;
exports.useTimeout = useTimeout;
exports.useTooltipContentProps = useTooltipContentProps;
exports.useTooltipContentPropsDefaults = useTooltipContentPropsDefaults;
exports.useTooltipModelToggle = useTooltipModelToggle;
exports.useTooltipModelToggleEmits = useTooltipModelToggleEmits;
exports.useTooltipModelToggleProps = useTooltipModelToggleProps;
exports.useTooltipProps = useTooltipProps;
exports.useTooltipTriggerProps = useTooltipTriggerProps;
exports.useTooltipTriggerPropsDefaults = useTooltipTriggerPropsDefaults;
exports.useTransitionFallthrough = useTransitionFallthrough;
exports.useTransitionFallthroughEmits = useTransitionFallthroughEmits;
exports.useZIndex = useZIndex;
exports.vRepeatClick = vRepeatClick;
exports.valueEquals = valueEquals;
exports.version = version;
exports.virtualizedGridProps = virtualizedGridProps;
exports.virtualizedListProps = virtualizedListProps;
exports.virtualizedProps = virtualizedProps;
exports.virtualizedScrollbarProps = virtualizedScrollbarProps;
exports.watermarkProps = watermarkProps;
exports.zIndexContextKey = zIndexContextKey;
});
Reference in New Issue View Git Blame Copy Permalink