4141 lines
136 KiB
JavaScript
4141 lines
136 KiB
JavaScript
import { inject, getCurrentInstance, shallowRef, ref, watch, computed, unref, defineComponent, toRef, provide, readonly, createBlock, openBlock, withCtx, createVNode, renderSlot, createCommentVNode, createElementBlock, toDisplayString, reactive, normalizeClass, resolveDynamicComponent, mergeProps, Fragment, useSlots, Text, Transition, withDirectives, vShow, normalizeStyle, cloneVNode, Comment, useAttrs as useAttrs$1, nextTick, createElementVNode, withModifiers } from 'vue';
|
|
import { c as withInstall, _ as _export_sfc, b as buildProps, aj as useGlobalSize, ak as fromPairs, B as ElIcon, al as buildProp, d as definePropType, af as loading_default, i as iconPropType, N as useSizeProp, u as useDeprecated, y as useGlobalConfig, E as EVENT_CODE, v as ElTeleport, am as tryFocus, x as ElFocusTrap, z as isUndefined, ac as getNative, Y as isObjectLike, a3 as Symbol$1, D as mutable, an as ValidateComponentsMap, ao as view_default, ap as hide_default, aq as isNil, O as circle_close_default, ar as withNoopInstall, Z as baseGetTag, a1 as isArray, U as UPDATE_MODEL_EVENT, as as baseGet, at as castPath, aa as isObject, au as toKey, a4 as eq } from './config-provider-CA7emI64.mjs';
|
|
import { z as isString, A as noop, B as resolveUnref, C as tryOnScopeDispose, s as shared_cjs_prodExports, k as useId, i as isBoolean, e as useNamespace, G as useGetDerivedNamespace, H as useIdInjection, v as isNumber, F as isClient, g as useZIndex, D as tryOnMounted, q as debugWarn, E as identity$1 } from './server.mjs';
|
|
|
|
function unrefElement(elRef) {
|
|
var _a;
|
|
const plain = resolveUnref(elRef);
|
|
return (_a = plain == null ? void 0 : plain.$el) != null ? _a : plain;
|
|
}
|
|
const defaultWindow = void 0;
|
|
function useEventListener(...args) {
|
|
let target;
|
|
let events2;
|
|
let listeners;
|
|
let options;
|
|
if (isString(args[0]) || Array.isArray(args[0])) {
|
|
[events2, listeners, options] = args;
|
|
target = defaultWindow;
|
|
} else {
|
|
[target, events2, listeners, options] = args;
|
|
}
|
|
if (!target)
|
|
return noop;
|
|
if (!Array.isArray(events2))
|
|
events2 = [events2];
|
|
if (!Array.isArray(listeners))
|
|
listeners = [listeners];
|
|
const cleanups = [];
|
|
const cleanup = () => {
|
|
cleanups.forEach((fn2) => fn2());
|
|
cleanups.length = 0;
|
|
};
|
|
const register = (el, event, listener, options2) => {
|
|
el.addEventListener(event, listener, options2);
|
|
return () => el.removeEventListener(event, listener, options2);
|
|
};
|
|
const stopWatch = watch(() => [unrefElement(target), resolveUnref(options)], ([el, options2]) => {
|
|
cleanup();
|
|
if (!el)
|
|
return;
|
|
cleanups.push(...events2.flatMap((event) => {
|
|
return listeners.map((listener) => register(el, event, listener, options2));
|
|
}));
|
|
}, { immediate: true, flush: "post" });
|
|
const stop = () => {
|
|
stopWatch();
|
|
cleanup();
|
|
};
|
|
tryOnScopeDispose(stop);
|
|
return stop;
|
|
}
|
|
function onClickOutside(target, handler, options = {}) {
|
|
const { window: window2 = defaultWindow, ignore = [], capture = true, detectIframe = false } = options;
|
|
if (!window2)
|
|
return;
|
|
let shouldListen = true;
|
|
const shouldIgnore = (event) => {
|
|
return ignore.some((target2) => {
|
|
if (typeof target2 === "string") {
|
|
return Array.from(window2.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));
|
|
}
|
|
});
|
|
};
|
|
const listener = (event) => {
|
|
const el = unrefElement(target);
|
|
if (!el || el === event.target || event.composedPath().includes(el))
|
|
return;
|
|
if (event.detail === 0)
|
|
shouldListen = !shouldIgnore(event);
|
|
if (!shouldListen) {
|
|
shouldListen = true;
|
|
return;
|
|
}
|
|
handler(event);
|
|
};
|
|
const cleanup = [
|
|
useEventListener(window2, "click", listener, { passive: true, capture }),
|
|
useEventListener(window2, "pointerdown", (e) => {
|
|
const el = unrefElement(target);
|
|
if (el)
|
|
shouldListen = !e.composedPath().includes(el) && !shouldIgnore(e);
|
|
}, { passive: true }),
|
|
detectIframe && useEventListener(window2, "blur", (event) => {
|
|
var _a;
|
|
const el = unrefElement(target);
|
|
if (((_a = window2.document.activeElement) == null ? void 0 : _a.tagName) === "IFRAME" && !(el == null ? void 0 : el.contains(window2.document.activeElement)))
|
|
handler(event);
|
|
})
|
|
].filter(Boolean);
|
|
const stop = () => cleanup.forEach((fn2) => fn2());
|
|
return stop;
|
|
}
|
|
function useSupported(callback, sync = false) {
|
|
const isSupported = ref();
|
|
const update = () => isSupported.value = Boolean(callback());
|
|
update();
|
|
tryOnMounted(update, sync);
|
|
return isSupported;
|
|
}
|
|
const _global = typeof globalThis !== "undefined" ? globalThis : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
|
|
const globalKey = "__vueuse_ssr_handlers__";
|
|
_global[globalKey] = _global[globalKey] || {};
|
|
var __getOwnPropSymbols$g = Object.getOwnPropertySymbols;
|
|
var __hasOwnProp$g = Object.prototype.hasOwnProperty;
|
|
var __propIsEnum$g = Object.prototype.propertyIsEnumerable;
|
|
var __objRest$2 = (source, exclude) => {
|
|
var target = {};
|
|
for (var prop in source)
|
|
if (__hasOwnProp$g.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
target[prop] = source[prop];
|
|
if (source != null && __getOwnPropSymbols$g)
|
|
for (var prop of __getOwnPropSymbols$g(source)) {
|
|
if (exclude.indexOf(prop) < 0 && __propIsEnum$g.call(source, prop))
|
|
target[prop] = source[prop];
|
|
}
|
|
return target;
|
|
};
|
|
function useResizeObserver(target, callback, options = {}) {
|
|
const _a = options, { window: window2 = defaultWindow } = _a, observerOptions = __objRest$2(_a, ["window"]);
|
|
let observer;
|
|
const isSupported = useSupported(() => window2 && "ResizeObserver" in window2);
|
|
const cleanup = () => {
|
|
if (observer) {
|
|
observer.disconnect();
|
|
observer = void 0;
|
|
}
|
|
};
|
|
const stopWatch = watch(() => unrefElement(target), (el) => {
|
|
cleanup();
|
|
if (isSupported.value && window2 && el) {
|
|
observer = new ResizeObserver(callback);
|
|
observer.observe(el, observerOptions);
|
|
}
|
|
}, { immediate: true, flush: "post" });
|
|
const stop = () => {
|
|
cleanup();
|
|
stopWatch();
|
|
};
|
|
tryOnScopeDispose(stop);
|
|
return {
|
|
isSupported,
|
|
stop
|
|
};
|
|
}
|
|
var SwipeDirection;
|
|
(function(SwipeDirection2) {
|
|
SwipeDirection2["UP"] = "UP";
|
|
SwipeDirection2["RIGHT"] = "RIGHT";
|
|
SwipeDirection2["DOWN"] = "DOWN";
|
|
SwipeDirection2["LEFT"] = "LEFT";
|
|
SwipeDirection2["NONE"] = "NONE";
|
|
})(SwipeDirection || (SwipeDirection = {}));
|
|
var __defProp = Object.defineProperty;
|
|
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
var __spreadValues = (a, b) => {
|
|
for (var prop in b || (b = {}))
|
|
if (__hasOwnProp.call(b, prop))
|
|
__defNormalProp(a, prop, b[prop]);
|
|
if (__getOwnPropSymbols)
|
|
for (var prop of __getOwnPropSymbols(b)) {
|
|
if (__propIsEnum.call(b, prop))
|
|
__defNormalProp(a, prop, b[prop]);
|
|
}
|
|
return a;
|
|
};
|
|
const _TransitionPresets = {
|
|
easeInSine: [0.12, 0, 0.39, 0],
|
|
easeOutSine: [0.61, 1, 0.88, 1],
|
|
easeInOutSine: [0.37, 0, 0.63, 1],
|
|
easeInQuad: [0.11, 0, 0.5, 0],
|
|
easeOutQuad: [0.5, 1, 0.89, 1],
|
|
easeInOutQuad: [0.45, 0, 0.55, 1],
|
|
easeInCubic: [0.32, 0, 0.67, 0],
|
|
easeOutCubic: [0.33, 1, 0.68, 1],
|
|
easeInOutCubic: [0.65, 0, 0.35, 1],
|
|
easeInQuart: [0.5, 0, 0.75, 0],
|
|
easeOutQuart: [0.25, 1, 0.5, 1],
|
|
easeInOutQuart: [0.76, 0, 0.24, 1],
|
|
easeInQuint: [0.64, 0, 0.78, 0],
|
|
easeOutQuint: [0.22, 1, 0.36, 1],
|
|
easeInOutQuint: [0.83, 0, 0.17, 1],
|
|
easeInExpo: [0.7, 0, 0.84, 0],
|
|
easeOutExpo: [0.16, 1, 0.3, 1],
|
|
easeInOutExpo: [0.87, 0, 0.13, 1],
|
|
easeInCirc: [0.55, 0, 1, 0.45],
|
|
easeOutCirc: [0, 0.55, 0.45, 1],
|
|
easeInOutCirc: [0.85, 0, 0.15, 1],
|
|
easeInBack: [0.36, 0, 0.66, -0.56],
|
|
easeOutBack: [0.34, 1.56, 0.64, 1],
|
|
easeInOutBack: [0.68, -0.6, 0.32, 1.6]
|
|
};
|
|
__spreadValues({
|
|
linear: identity$1
|
|
}, _TransitionPresets);
|
|
function identity(value) {
|
|
return value;
|
|
}
|
|
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);
|
|
}
|
|
var HOT_COUNT = 800, HOT_SPAN = 16;
|
|
var nativeNow = Date.now;
|
|
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);
|
|
};
|
|
}
|
|
function constant(value) {
|
|
return function() {
|
|
return value;
|
|
};
|
|
}
|
|
var defineProperty = function() {
|
|
try {
|
|
var func = getNative(Object, "defineProperty");
|
|
func({}, "", {});
|
|
return func;
|
|
} catch (e) {
|
|
}
|
|
}();
|
|
var baseSetToString = !defineProperty ? identity : function(func, string) {
|
|
return defineProperty(func, "toString", {
|
|
"configurable": true,
|
|
"enumerable": false,
|
|
"value": constant(string),
|
|
"writable": true
|
|
});
|
|
};
|
|
var setToString = shortOut(baseSetToString);
|
|
var MAX_SAFE_INTEGER$1 = 9007199254740991;
|
|
var reIsUint = /^(?:0|[1-9]\d*)$/;
|
|
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);
|
|
}
|
|
function baseAssignValue(object, key, value) {
|
|
if (key == "__proto__" && defineProperty) {
|
|
defineProperty(object, key, {
|
|
"configurable": true,
|
|
"enumerable": true,
|
|
"value": value,
|
|
"writable": true
|
|
});
|
|
} else {
|
|
object[key] = value;
|
|
}
|
|
}
|
|
var objectProto$1 = Object.prototype;
|
|
var hasOwnProperty$1 = objectProto$1.hasOwnProperty;
|
|
function assignValue(object, key, value) {
|
|
var objValue = object[key];
|
|
if (!(hasOwnProperty$1.call(object, key) && eq(objValue, value)) || value === void 0 && !(key in object)) {
|
|
baseAssignValue(object, key, value);
|
|
}
|
|
}
|
|
var nativeMax = Math.max;
|
|
function overRest(func, start, transform) {
|
|
start = nativeMax(start === void 0 ? func.length - 1 : start, 0);
|
|
return function() {
|
|
var args = arguments, index = -1, length = nativeMax(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);
|
|
};
|
|
}
|
|
var MAX_SAFE_INTEGER = 9007199254740991;
|
|
function isLength(value) {
|
|
return typeof value == "number" && value > -1 && value % 1 == 0 && value <= MAX_SAFE_INTEGER;
|
|
}
|
|
var argsTag = "[object Arguments]";
|
|
function baseIsArguments(value) {
|
|
return isObjectLike(value) && baseGetTag(value) == argsTag;
|
|
}
|
|
var objectProto = Object.prototype;
|
|
var hasOwnProperty = objectProto.hasOwnProperty;
|
|
var propertyIsEnumerable = objectProto.propertyIsEnumerable;
|
|
var isArguments = baseIsArguments(/* @__PURE__ */ function() {
|
|
return arguments;
|
|
}()) ? baseIsArguments : function(value) {
|
|
return isObjectLike(value) && hasOwnProperty.call(value, "callee") && !propertyIsEnumerable.call(value, "callee");
|
|
};
|
|
function arrayPush(array, values) {
|
|
var index = -1, length = values.length, offset = array.length;
|
|
while (++index < length) {
|
|
array[offset + index] = values[index];
|
|
}
|
|
return array;
|
|
}
|
|
var spreadableSymbol = Symbol$1 ? Symbol$1.isConcatSpreadable : void 0;
|
|
function isFlattenable(value) {
|
|
return isArray(value) || isArguments(value) || !!(spreadableSymbol && value && value[spreadableSymbol]);
|
|
}
|
|
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 (predicate(value)) {
|
|
{
|
|
arrayPush(result, value);
|
|
}
|
|
} else {
|
|
result[result.length] = value;
|
|
}
|
|
}
|
|
return result;
|
|
}
|
|
function flatten(array) {
|
|
var length = array == null ? 0 : array.length;
|
|
return length ? baseFlatten(array) : [];
|
|
}
|
|
function flatRest(func) {
|
|
return setToString(overRest(func, void 0, flatten), func + "");
|
|
}
|
|
function baseHasIn(object, key) {
|
|
return object != null && key in Object(object);
|
|
}
|
|
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));
|
|
}
|
|
function hasIn(object, path) {
|
|
return object != null && hasPath(object, path, baseHasIn);
|
|
}
|
|
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 = void 0;
|
|
if (newValue === void 0) {
|
|
newValue = isObject(objValue) ? objValue : isIndex(path[index + 1]) ? [] : {};
|
|
}
|
|
}
|
|
assignValue(nested, key, newValue);
|
|
nested = nested[key];
|
|
}
|
|
return 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;
|
|
}
|
|
function basePick(object, paths) {
|
|
return basePickBy(object, paths, function(value, path) {
|
|
return hasIn(object, path);
|
|
});
|
|
}
|
|
var pick = flatRest(function(object, paths) {
|
|
return object == null ? {} : basePick(object, paths);
|
|
});
|
|
const POPPER_INJECTION_KEY = Symbol("popper");
|
|
const POPPER_CONTENT_INJECTION_KEY = Symbol("popperContent");
|
|
const roleTypes = [
|
|
"dialog",
|
|
"grid",
|
|
"group",
|
|
"listbox",
|
|
"menu",
|
|
"navigation",
|
|
"tooltip",
|
|
"tree"
|
|
];
|
|
const popperProps = buildProps({
|
|
role: {
|
|
type: String,
|
|
values: roleTypes,
|
|
default: "tooltip"
|
|
}
|
|
});
|
|
const __default__$9 = defineComponent({
|
|
name: "ElPopper",
|
|
inheritAttrs: false
|
|
});
|
|
const _sfc_main$9 = /* @__PURE__ */ defineComponent({
|
|
...__default__$9,
|
|
props: popperProps,
|
|
setup(__props, { expose }) {
|
|
const props = __props;
|
|
const triggerRef = ref();
|
|
const popperInstanceRef = ref();
|
|
const contentRef = ref();
|
|
const referenceRef = ref();
|
|
const role = computed(() => props.role);
|
|
const popperProvides = {
|
|
triggerRef,
|
|
popperInstanceRef,
|
|
contentRef,
|
|
referenceRef,
|
|
role
|
|
};
|
|
expose(popperProvides);
|
|
provide(POPPER_INJECTION_KEY, popperProvides);
|
|
return (_ctx, _cache) => {
|
|
return renderSlot(_ctx.$slots, "default");
|
|
};
|
|
}
|
|
});
|
|
var Popper = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__file", "popper.vue"]]);
|
|
const popperArrowProps = buildProps({
|
|
arrowOffset: {
|
|
type: Number,
|
|
default: 5
|
|
}
|
|
});
|
|
const __default__$8 = defineComponent({
|
|
name: "ElPopperArrow",
|
|
inheritAttrs: false
|
|
});
|
|
const _sfc_main$8 = /* @__PURE__ */ defineComponent({
|
|
...__default__$8,
|
|
props: popperArrowProps,
|
|
setup(__props, { expose }) {
|
|
const props = __props;
|
|
const ns = useNamespace("popper");
|
|
const { arrowOffset, arrowRef, arrowStyle } = inject(POPPER_CONTENT_INJECTION_KEY, void 0);
|
|
watch(() => props.arrowOffset, (val) => {
|
|
arrowOffset.value = val;
|
|
});
|
|
expose({
|
|
arrowRef
|
|
});
|
|
return (_ctx, _cache) => {
|
|
return openBlock(), createElementBlock("span", {
|
|
ref_key: "arrowRef",
|
|
ref: arrowRef,
|
|
class: normalizeClass(unref(ns).e("arrow")),
|
|
style: normalizeStyle(unref(arrowStyle)),
|
|
"data-popper-arrow": ""
|
|
}, null, 6);
|
|
};
|
|
}
|
|
});
|
|
var ElPopperArrow = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__file", "arrow.vue"]]);
|
|
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
|
|
});
|
|
const FORWARD_REF_INJECTION_KEY = Symbol("elForwardRef");
|
|
const useForwardRef = (forwardRef) => {
|
|
const setForwardRef = (el) => {
|
|
forwardRef.value = el;
|
|
};
|
|
provide(FORWARD_REF_INJECTION_KEY, {
|
|
setForwardRef
|
|
});
|
|
};
|
|
const useForwardRefDirective = (setForwardRef) => {
|
|
return {
|
|
mounted(el) {
|
|
setForwardRef(el);
|
|
},
|
|
updated(el) {
|
|
setForwardRef(el);
|
|
},
|
|
unmounted() {
|
|
setForwardRef(null);
|
|
}
|
|
};
|
|
};
|
|
const NAME = "ElOnlyChild";
|
|
const OnlyChild = defineComponent({
|
|
name: NAME,
|
|
setup(_, {
|
|
slots,
|
|
attrs
|
|
}) {
|
|
var _a;
|
|
const forwardRefInjection = inject(FORWARD_REF_INJECTION_KEY);
|
|
const forwardRefDirective = useForwardRefDirective((_a = forwardRefInjection == null ? void 0 : forwardRefInjection.setForwardRef) != null ? _a : shared_cjs_prodExports.NOOP);
|
|
return () => {
|
|
var _a2;
|
|
const defaultSlot = (_a2 = slots.default) == null ? void 0 : _a2.call(slots, attrs);
|
|
if (!defaultSlot)
|
|
return null;
|
|
if (defaultSlot.length > 1) {
|
|
return null;
|
|
}
|
|
const firstLegitNode = findFirstLegitChild(defaultSlot);
|
|
if (!firstLegitNode) {
|
|
return null;
|
|
}
|
|
return withDirectives(cloneVNode(firstLegitNode, attrs), [[forwardRefDirective]]);
|
|
};
|
|
}
|
|
});
|
|
function findFirstLegitChild(node) {
|
|
if (!node)
|
|
return null;
|
|
const children = node;
|
|
for (const child of children) {
|
|
if (shared_cjs_prodExports.isObject(child)) {
|
|
switch (child.type) {
|
|
case Comment:
|
|
continue;
|
|
case Text:
|
|
case "svg":
|
|
return wrapTextContent(child);
|
|
case Fragment:
|
|
return findFirstLegitChild(child.children);
|
|
default:
|
|
return child;
|
|
}
|
|
}
|
|
return wrapTextContent(child);
|
|
}
|
|
return null;
|
|
}
|
|
function wrapTextContent(s) {
|
|
const ns = useNamespace("only-child");
|
|
return createVNode("span", {
|
|
"class": ns.e("content")
|
|
}, [s]);
|
|
}
|
|
const __default__$7 = defineComponent({
|
|
name: "ElPopperTrigger",
|
|
inheritAttrs: false
|
|
});
|
|
const _sfc_main$7 = /* @__PURE__ */ defineComponent({
|
|
...__default__$7,
|
|
props: popperTriggerProps,
|
|
setup(__props, { expose }) {
|
|
const props = __props;
|
|
const { role, triggerRef } = inject(POPPER_INJECTION_KEY, void 0);
|
|
useForwardRef(triggerRef);
|
|
const ariaControls = computed(() => {
|
|
return ariaHaspopup.value ? props.id : void 0;
|
|
});
|
|
const ariaDescribedby = computed(() => {
|
|
if (role && role.value === "tooltip") {
|
|
return props.open && props.id ? props.id : void 0;
|
|
}
|
|
return void 0;
|
|
});
|
|
const ariaHaspopup = computed(() => {
|
|
if (role && role.value !== "tooltip") {
|
|
return role.value;
|
|
}
|
|
return void 0;
|
|
});
|
|
const ariaExpanded = computed(() => {
|
|
return ariaHaspopup.value ? `${props.open}` : void 0;
|
|
});
|
|
expose({
|
|
triggerRef
|
|
});
|
|
return (_ctx, _cache) => {
|
|
return !_ctx.virtualTriggering ? (openBlock(), createBlock(unref(OnlyChild), mergeProps({ key: 0 }, _ctx.$attrs, {
|
|
"aria-controls": unref(ariaControls),
|
|
"aria-describedby": unref(ariaDescribedby),
|
|
"aria-expanded": unref(ariaExpanded),
|
|
"aria-haspopup": unref(ariaHaspopup)
|
|
}), {
|
|
default: withCtx(() => [
|
|
renderSlot(_ctx.$slots, "default")
|
|
]),
|
|
_: 3
|
|
}, 16, ["aria-controls", "aria-describedby", "aria-expanded", "aria-haspopup"])) : createCommentVNode("v-if", true);
|
|
};
|
|
}
|
|
});
|
|
var ElPopperTrigger = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__file", "trigger.vue"]]);
|
|
var E = "top", R = "bottom", W = "right", P = "left", me = "auto", G = [E, R, W, P], U = "start", J = "end", Xe = "clippingParents", je = "viewport", K = "popper", Ye = "reference", De = G.reduce(function(t, e) {
|
|
return t.concat([e + "-" + U, e + "-" + J]);
|
|
}, []), Ee = [].concat(G, [me]).reduce(function(t, e) {
|
|
return t.concat([e, e + "-" + U, e + "-" + J]);
|
|
}, []), Ge = "beforeRead", Je = "read", Ke = "afterRead", Qe = "beforeMain", Ze = "main", et = "afterMain", tt = "beforeWrite", nt = "write", rt = "afterWrite", ot = [Ge, Je, Ke, Qe, Ze, et, tt, nt, rt];
|
|
function C(t) {
|
|
return t ? (t.nodeName || "").toLowerCase() : null;
|
|
}
|
|
function H(t) {
|
|
if (t == null) return void 0;
|
|
if (t.toString() !== "[object Window]") {
|
|
var e = t.ownerDocument;
|
|
return e && e.defaultView || void 0;
|
|
}
|
|
return t;
|
|
}
|
|
function Q(t) {
|
|
var e = H(t).Element;
|
|
return t instanceof e || t instanceof Element;
|
|
}
|
|
function B(t) {
|
|
var e = H(t).HTMLElement;
|
|
return t instanceof e || t instanceof HTMLElement;
|
|
}
|
|
function Pe(t) {
|
|
if (typeof ShadowRoot == "undefined") return false;
|
|
var e = H(t).ShadowRoot;
|
|
return t instanceof e || t instanceof ShadowRoot;
|
|
}
|
|
function Mt(t) {
|
|
var e = t.state;
|
|
Object.keys(e.elements).forEach(function(n) {
|
|
var r = e.styles[n] || {}, o = e.attributes[n] || {}, i = e.elements[n];
|
|
!B(i) || !C(i) || (Object.assign(i.style, r), Object.keys(o).forEach(function(a) {
|
|
var s = o[a];
|
|
s === false ? i.removeAttribute(a) : i.setAttribute(a, s === true ? "" : s);
|
|
}));
|
|
});
|
|
}
|
|
function Rt(t) {
|
|
var e = t.state, n = { popper: { position: e.options.strategy, left: "0", top: "0", margin: "0" }, arrow: { position: "absolute" }, reference: {} };
|
|
return Object.assign(e.elements.popper.style, n.popper), e.styles = n, e.elements.arrow && Object.assign(e.elements.arrow.style, n.arrow), function() {
|
|
Object.keys(e.elements).forEach(function(r) {
|
|
var o = e.elements[r], i = e.attributes[r] || {}, a = Object.keys(e.styles.hasOwnProperty(r) ? e.styles[r] : n[r]), s = a.reduce(function(f, c) {
|
|
return f[c] = "", f;
|
|
}, {});
|
|
!B(o) || !C(o) || (Object.assign(o.style, s), Object.keys(i).forEach(function(f) {
|
|
o.removeAttribute(f);
|
|
}));
|
|
});
|
|
};
|
|
}
|
|
var Ae = { name: "applyStyles", enabled: true, phase: "write", fn: Mt, effect: Rt, requires: ["computeStyles"] };
|
|
function q(t) {
|
|
return t.split("-")[0];
|
|
}
|
|
var X = Math.max, ve = Math.min, Z = Math.round;
|
|
function ee(t, e) {
|
|
e === void 0 && (e = false);
|
|
var n = t.getBoundingClientRect(), r = 1, o = 1;
|
|
if (B(t) && e) {
|
|
var i = t.offsetHeight, a = t.offsetWidth;
|
|
a > 0 && (r = Z(n.width) / a || 1), i > 0 && (o = Z(n.height) / i || 1);
|
|
}
|
|
return { width: n.width / r, height: n.height / o, top: n.top / o, right: n.right / r, bottom: n.bottom / o, left: n.left / r, x: n.left / r, y: n.top / o };
|
|
}
|
|
function ke(t) {
|
|
var e = ee(t), n = t.offsetWidth, r = t.offsetHeight;
|
|
return Math.abs(e.width - n) <= 1 && (n = e.width), Math.abs(e.height - r) <= 1 && (r = e.height), { x: t.offsetLeft, y: t.offsetTop, width: n, height: r };
|
|
}
|
|
function it(t, e) {
|
|
var n = e.getRootNode && e.getRootNode();
|
|
if (t.contains(e)) return true;
|
|
if (n && Pe(n)) {
|
|
var r = e;
|
|
do {
|
|
if (r && t.isSameNode(r)) return true;
|
|
r = r.parentNode || r.host;
|
|
} while (r);
|
|
}
|
|
return false;
|
|
}
|
|
function N(t) {
|
|
return H(t).getComputedStyle(t);
|
|
}
|
|
function Wt(t) {
|
|
return ["table", "td", "th"].indexOf(C(t)) >= 0;
|
|
}
|
|
function I(t) {
|
|
return ((Q(t) ? t.ownerDocument : t.document) || (void 0).document).documentElement;
|
|
}
|
|
function ge(t) {
|
|
return C(t) === "html" ? t : t.assignedSlot || t.parentNode || (Pe(t) ? t.host : null) || I(t);
|
|
}
|
|
function at(t) {
|
|
return !B(t) || N(t).position === "fixed" ? null : t.offsetParent;
|
|
}
|
|
function Bt(t) {
|
|
var e = (void 0).userAgent.toLowerCase().indexOf("firefox") !== -1, n = (void 0).userAgent.indexOf("Trident") !== -1;
|
|
if (n && B(t)) {
|
|
var r = N(t);
|
|
if (r.position === "fixed") return null;
|
|
}
|
|
var o = ge(t);
|
|
for (Pe(o) && (o = o.host); B(o) && ["html", "body"].indexOf(C(o)) < 0; ) {
|
|
var i = N(o);
|
|
if (i.transform !== "none" || i.perspective !== "none" || i.contain === "paint" || ["transform", "perspective"].indexOf(i.willChange) !== -1 || e && i.willChange === "filter" || e && i.filter && i.filter !== "none") return o;
|
|
o = o.parentNode;
|
|
}
|
|
return null;
|
|
}
|
|
function se(t) {
|
|
for (var e = H(t), n = at(t); n && Wt(n) && N(n).position === "static"; ) n = at(n);
|
|
return n && (C(n) === "html" || C(n) === "body" && N(n).position === "static") ? e : n || Bt(t) || e;
|
|
}
|
|
function Le(t) {
|
|
return ["top", "bottom"].indexOf(t) >= 0 ? "x" : "y";
|
|
}
|
|
function fe(t, e, n) {
|
|
return X(t, ve(e, n));
|
|
}
|
|
function St(t, e, n) {
|
|
var r = fe(t, e, n);
|
|
return r > n ? n : r;
|
|
}
|
|
function st() {
|
|
return { top: 0, right: 0, bottom: 0, left: 0 };
|
|
}
|
|
function ft(t) {
|
|
return Object.assign({}, st(), t);
|
|
}
|
|
function ct(t, e) {
|
|
return e.reduce(function(n, r) {
|
|
return n[r] = t, n;
|
|
}, {});
|
|
}
|
|
var Tt = function(t, e) {
|
|
return t = typeof t == "function" ? t(Object.assign({}, e.rects, { placement: e.placement })) : t, ft(typeof t != "number" ? t : ct(t, G));
|
|
};
|
|
function Ht(t) {
|
|
var e, n = t.state, r = t.name, o = t.options, i = n.elements.arrow, a = n.modifiersData.popperOffsets, s = q(n.placement), f = Le(s), c = [P, W].indexOf(s) >= 0, u = c ? "height" : "width";
|
|
if (!(!i || !a)) {
|
|
var m = Tt(o.padding, n), v = ke(i), l = f === "y" ? E : P, h = f === "y" ? R : W, p = n.rects.reference[u] + n.rects.reference[f] - a[f] - n.rects.popper[u], g = a[f] - n.rects.reference[f], x = se(i), y = x ? f === "y" ? x.clientHeight || 0 : x.clientWidth || 0 : 0, $ = p / 2 - g / 2, d = m[l], b = y - v[u] - m[h], w = y / 2 - v[u] / 2 + $, O = fe(d, w, b), j = f;
|
|
n.modifiersData[r] = (e = {}, e[j] = O, e.centerOffset = O - w, e);
|
|
}
|
|
}
|
|
function Ct(t) {
|
|
var e = t.state, n = t.options, r = n.element, o = r === void 0 ? "[data-popper-arrow]" : r;
|
|
o != null && (typeof o == "string" && (o = e.elements.popper.querySelector(o), !o) || !it(e.elements.popper, o) || (e.elements.arrow = o));
|
|
}
|
|
var pt = { name: "arrow", enabled: true, phase: "main", fn: Ht, effect: Ct, requires: ["popperOffsets"], requiresIfExists: ["preventOverflow"] };
|
|
function te(t) {
|
|
return t.split("-")[1];
|
|
}
|
|
var qt = { top: "auto", right: "auto", bottom: "auto", left: "auto" };
|
|
function Vt(t) {
|
|
var e = t.x, n = t.y, r = void 0, o = r.devicePixelRatio || 1;
|
|
return { x: Z(e * o) / o || 0, y: Z(n * o) / o || 0 };
|
|
}
|
|
function ut(t) {
|
|
var e, n = t.popper, r = t.popperRect, o = t.placement, i = t.variation, a = t.offsets, s = t.position, f = t.gpuAcceleration, c = t.adaptive, u = t.roundOffsets, m = t.isFixed, v = a.x, l = v === void 0 ? 0 : v, h = a.y, p = h === void 0 ? 0 : h, g = typeof u == "function" ? u({ x: l, y: p }) : { x: l, y: p };
|
|
l = g.x, p = g.y;
|
|
var x = a.hasOwnProperty("x"), y = a.hasOwnProperty("y"), $ = P, d = E, b = void 0;
|
|
if (c) {
|
|
var w = se(n), O = "clientHeight", j = "clientWidth";
|
|
if (w === H(n) && (w = I(n), N(w).position !== "static" && s === "absolute" && (O = "scrollHeight", j = "scrollWidth")), w = w, o === E || (o === P || o === W) && i === J) {
|
|
d = R;
|
|
var A = m && w === b && b.visualViewport ? b.visualViewport.height : w[O];
|
|
p -= A - r.height, p *= f ? 1 : -1;
|
|
}
|
|
if (o === P || (o === E || o === R) && i === J) {
|
|
$ = W;
|
|
var k = m && w === b && b.visualViewport ? b.visualViewport.width : w[j];
|
|
l -= k - r.width, l *= f ? 1 : -1;
|
|
}
|
|
}
|
|
var D = Object.assign({ position: s }, c && qt), S = u === true ? Vt({ x: l, y: p }) : { x: l, y: p };
|
|
if (l = S.x, p = S.y, f) {
|
|
var L;
|
|
return Object.assign({}, D, (L = {}, L[d] = y ? "0" : "", L[$] = x ? "0" : "", L.transform = (b.devicePixelRatio || 1) <= 1 ? "translate(" + l + "px, " + p + "px)" : "translate3d(" + l + "px, " + p + "px, 0)", L));
|
|
}
|
|
return Object.assign({}, D, (e = {}, e[d] = y ? p + "px" : "", e[$] = x ? l + "px" : "", e.transform = "", e));
|
|
}
|
|
function Nt(t) {
|
|
var e = t.state, n = t.options, r = n.gpuAcceleration, o = r === void 0 ? true : r, i = n.adaptive, a = i === void 0 ? true : i, s = n.roundOffsets, f = s === void 0 ? true : s, c = { placement: q(e.placement), variation: te(e.placement), popper: e.elements.popper, popperRect: e.rects.popper, gpuAcceleration: o, isFixed: e.options.strategy === "fixed" };
|
|
e.modifiersData.popperOffsets != null && (e.styles.popper = Object.assign({}, e.styles.popper, ut(Object.assign({}, c, { offsets: e.modifiersData.popperOffsets, position: e.options.strategy, adaptive: a, roundOffsets: f })))), e.modifiersData.arrow != null && (e.styles.arrow = Object.assign({}, e.styles.arrow, ut(Object.assign({}, c, { offsets: e.modifiersData.arrow, position: "absolute", adaptive: false, roundOffsets: f })))), e.attributes.popper = Object.assign({}, e.attributes.popper, { "data-popper-placement": e.placement });
|
|
}
|
|
var Me = { name: "computeStyles", enabled: true, phase: "beforeWrite", fn: Nt, data: {} }, ye = { passive: true };
|
|
function It(t) {
|
|
var e = t.state, n = t.instance, r = t.options, o = r.scroll, i = o === void 0 ? true : o, a = r.resize, s = a === void 0 ? true : a, f = H(e.elements.popper), c = [].concat(e.scrollParents.reference, e.scrollParents.popper);
|
|
return i && c.forEach(function(u) {
|
|
u.addEventListener("scroll", n.update, ye);
|
|
}), s && f.addEventListener("resize", n.update, ye), function() {
|
|
i && c.forEach(function(u) {
|
|
u.removeEventListener("scroll", n.update, ye);
|
|
}), s && f.removeEventListener("resize", n.update, ye);
|
|
};
|
|
}
|
|
var Re = { name: "eventListeners", enabled: true, phase: "write", fn: function() {
|
|
}, effect: It, data: {} }, _t = { left: "right", right: "left", bottom: "top", top: "bottom" };
|
|
function be(t) {
|
|
return t.replace(/left|right|bottom|top/g, function(e) {
|
|
return _t[e];
|
|
});
|
|
}
|
|
var zt = { start: "end", end: "start" };
|
|
function lt(t) {
|
|
return t.replace(/start|end/g, function(e) {
|
|
return zt[e];
|
|
});
|
|
}
|
|
function We(t) {
|
|
var e = H(t), n = e.pageXOffset, r = e.pageYOffset;
|
|
return { scrollLeft: n, scrollTop: r };
|
|
}
|
|
function Be(t) {
|
|
return ee(I(t)).left + We(t).scrollLeft;
|
|
}
|
|
function Ft(t) {
|
|
var e = H(t), n = I(t), r = e.visualViewport, o = n.clientWidth, i = n.clientHeight, a = 0, s = 0;
|
|
return r && (o = r.width, i = r.height, /^((?!chrome|android).)*safari/i.test((void 0).userAgent) || (a = r.offsetLeft, s = r.offsetTop)), { width: o, height: i, x: a + Be(t), y: s };
|
|
}
|
|
function Ut(t) {
|
|
var e, n = I(t), r = We(t), o = (e = t.ownerDocument) == null ? void 0 : e.body, i = X(n.scrollWidth, n.clientWidth, o ? o.scrollWidth : 0, o ? o.clientWidth : 0), a = X(n.scrollHeight, n.clientHeight, o ? o.scrollHeight : 0, o ? o.clientHeight : 0), s = -r.scrollLeft + Be(t), f = -r.scrollTop;
|
|
return N(o || n).direction === "rtl" && (s += X(n.clientWidth, o ? o.clientWidth : 0) - i), { width: i, height: a, x: s, y: f };
|
|
}
|
|
function Se(t) {
|
|
var e = N(t), n = e.overflow, r = e.overflowX, o = e.overflowY;
|
|
return /auto|scroll|overlay|hidden/.test(n + o + r);
|
|
}
|
|
function dt(t) {
|
|
return ["html", "body", "#document"].indexOf(C(t)) >= 0 ? t.ownerDocument.body : B(t) && Se(t) ? t : dt(ge(t));
|
|
}
|
|
function ce(t, e) {
|
|
var n;
|
|
e === void 0 && (e = []);
|
|
var r = dt(t), o = r === ((n = t.ownerDocument) == null ? void 0 : n.body), i = H(r), a = o ? [i].concat(i.visualViewport || [], Se(r) ? r : []) : r, s = e.concat(a);
|
|
return o ? s : s.concat(ce(ge(a)));
|
|
}
|
|
function Te(t) {
|
|
return Object.assign({}, t, { left: t.x, top: t.y, right: t.x + t.width, bottom: t.y + t.height });
|
|
}
|
|
function Xt(t) {
|
|
var e = ee(t);
|
|
return e.top = e.top + t.clientTop, e.left = e.left + t.clientLeft, e.bottom = e.top + t.clientHeight, e.right = e.left + t.clientWidth, e.width = t.clientWidth, e.height = t.clientHeight, e.x = e.left, e.y = e.top, e;
|
|
}
|
|
function ht(t, e) {
|
|
return e === je ? Te(Ft(t)) : Q(e) ? Xt(e) : Te(Ut(I(t)));
|
|
}
|
|
function Yt(t) {
|
|
var e = ce(ge(t)), n = ["absolute", "fixed"].indexOf(N(t).position) >= 0, r = n && B(t) ? se(t) : t;
|
|
return Q(r) ? e.filter(function(o) {
|
|
return Q(o) && it(o, r) && C(o) !== "body";
|
|
}) : [];
|
|
}
|
|
function Gt(t, e, n) {
|
|
var r = e === "clippingParents" ? Yt(t) : [].concat(e), o = [].concat(r, [n]), i = o[0], a = o.reduce(function(s, f) {
|
|
var c = ht(t, f);
|
|
return s.top = X(c.top, s.top), s.right = ve(c.right, s.right), s.bottom = ve(c.bottom, s.bottom), s.left = X(c.left, s.left), s;
|
|
}, ht(t, i));
|
|
return a.width = a.right - a.left, a.height = a.bottom - a.top, a.x = a.left, a.y = a.top, a;
|
|
}
|
|
function mt(t) {
|
|
var e = t.reference, n = t.element, r = t.placement, o = r ? q(r) : null, i = r ? te(r) : null, a = e.x + e.width / 2 - n.width / 2, s = e.y + e.height / 2 - n.height / 2, f;
|
|
switch (o) {
|
|
case E:
|
|
f = { x: a, y: e.y - n.height };
|
|
break;
|
|
case R:
|
|
f = { x: a, y: e.y + e.height };
|
|
break;
|
|
case W:
|
|
f = { x: e.x + e.width, y: s };
|
|
break;
|
|
case P:
|
|
f = { x: e.x - n.width, y: s };
|
|
break;
|
|
default:
|
|
f = { x: e.x, y: e.y };
|
|
}
|
|
var c = o ? Le(o) : null;
|
|
if (c != null) {
|
|
var u = c === "y" ? "height" : "width";
|
|
switch (i) {
|
|
case U:
|
|
f[c] = f[c] - (e[u] / 2 - n[u] / 2);
|
|
break;
|
|
case J:
|
|
f[c] = f[c] + (e[u] / 2 - n[u] / 2);
|
|
break;
|
|
}
|
|
}
|
|
return f;
|
|
}
|
|
function ne(t, e) {
|
|
e === void 0 && (e = {});
|
|
var n = e, r = n.placement, o = r === void 0 ? t.placement : r, i = n.boundary, a = i === void 0 ? Xe : i, s = n.rootBoundary, f = s === void 0 ? je : s, c = n.elementContext, u = c === void 0 ? K : c, m = n.altBoundary, v = m === void 0 ? false : m, l = n.padding, h = l === void 0 ? 0 : l, p = ft(typeof h != "number" ? h : ct(h, G)), g = u === K ? Ye : K, x = t.rects.popper, y = t.elements[v ? g : u], $ = Gt(Q(y) ? y : y.contextElement || I(t.elements.popper), a, f), d = ee(t.elements.reference), b = mt({ reference: d, element: x, placement: o }), w = Te(Object.assign({}, x, b)), O = u === K ? w : d, j = { top: $.top - O.top + p.top, bottom: O.bottom - $.bottom + p.bottom, left: $.left - O.left + p.left, right: O.right - $.right + p.right }, A = t.modifiersData.offset;
|
|
if (u === K && A) {
|
|
var k = A[o];
|
|
Object.keys(j).forEach(function(D) {
|
|
var S = [W, R].indexOf(D) >= 0 ? 1 : -1, L = [E, R].indexOf(D) >= 0 ? "y" : "x";
|
|
j[D] += k[L] * S;
|
|
});
|
|
}
|
|
return j;
|
|
}
|
|
function Jt(t, e) {
|
|
e === void 0 && (e = {});
|
|
var n = e, r = n.placement, o = n.boundary, i = n.rootBoundary, a = n.padding, s = n.flipVariations, f = n.allowedAutoPlacements, c = f === void 0 ? Ee : f, u = te(r), m = u ? s ? De : De.filter(function(h) {
|
|
return te(h) === u;
|
|
}) : G, v = m.filter(function(h) {
|
|
return c.indexOf(h) >= 0;
|
|
});
|
|
v.length === 0 && (v = m);
|
|
var l = v.reduce(function(h, p) {
|
|
return h[p] = ne(t, { placement: p, boundary: o, rootBoundary: i, padding: a })[q(p)], h;
|
|
}, {});
|
|
return Object.keys(l).sort(function(h, p) {
|
|
return l[h] - l[p];
|
|
});
|
|
}
|
|
function Kt(t) {
|
|
if (q(t) === me) return [];
|
|
var e = be(t);
|
|
return [lt(t), e, lt(e)];
|
|
}
|
|
function Qt(t) {
|
|
var e = t.state, n = t.options, r = t.name;
|
|
if (!e.modifiersData[r]._skip) {
|
|
for (var o = n.mainAxis, i = o === void 0 ? true : o, a = n.altAxis, s = a === void 0 ? true : a, f = n.fallbackPlacements, c = n.padding, u = n.boundary, m = n.rootBoundary, v = n.altBoundary, l = n.flipVariations, h = l === void 0 ? true : l, p = n.allowedAutoPlacements, g = e.options.placement, x = q(g), y = x === g, $ = f || (y || !h ? [be(g)] : Kt(g)), d = [g].concat($).reduce(function(z, V) {
|
|
return z.concat(q(V) === me ? Jt(e, { placement: V, boundary: u, rootBoundary: m, padding: c, flipVariations: h, allowedAutoPlacements: p }) : V);
|
|
}, []), b = e.rects.reference, w = e.rects.popper, O = /* @__PURE__ */ new Map(), j = true, A = d[0], k = 0; k < d.length; k++) {
|
|
var D = d[k], S = q(D), L = te(D) === U, re = [E, R].indexOf(S) >= 0, oe = re ? "width" : "height", M = ne(e, { placement: D, boundary: u, rootBoundary: m, altBoundary: v, padding: c }), T = re ? L ? W : P : L ? R : E;
|
|
b[oe] > w[oe] && (T = be(T));
|
|
var pe = be(T), _ = [];
|
|
if (i && _.push(M[S] <= 0), s && _.push(M[T] <= 0, M[pe] <= 0), _.every(function(z) {
|
|
return z;
|
|
})) {
|
|
A = D, j = false;
|
|
break;
|
|
}
|
|
O.set(D, _);
|
|
}
|
|
if (j) for (var ue = h ? 3 : 1, xe = function(z) {
|
|
var V = d.find(function(de) {
|
|
var ae = O.get(de);
|
|
if (ae) return ae.slice(0, z).every(function(Y) {
|
|
return Y;
|
|
});
|
|
});
|
|
if (V) return A = V, "break";
|
|
}, ie = ue; ie > 0; ie--) {
|
|
var le = xe(ie);
|
|
if (le === "break") break;
|
|
}
|
|
e.placement !== A && (e.modifiersData[r]._skip = true, e.placement = A, e.reset = true);
|
|
}
|
|
}
|
|
var vt = { name: "flip", enabled: true, phase: "main", fn: Qt, requiresIfExists: ["offset"], data: { _skip: false } };
|
|
function gt(t, e, n) {
|
|
return n === void 0 && (n = { x: 0, y: 0 }), { top: t.top - e.height - n.y, right: t.right - e.width + n.x, bottom: t.bottom - e.height + n.y, left: t.left - e.width - n.x };
|
|
}
|
|
function yt(t) {
|
|
return [E, W, R, P].some(function(e) {
|
|
return t[e] >= 0;
|
|
});
|
|
}
|
|
function Zt(t) {
|
|
var e = t.state, n = t.name, r = e.rects.reference, o = e.rects.popper, i = e.modifiersData.preventOverflow, a = ne(e, { elementContext: "reference" }), s = ne(e, { altBoundary: true }), f = gt(a, r), c = gt(s, o, i), u = yt(f), m = yt(c);
|
|
e.modifiersData[n] = { referenceClippingOffsets: f, popperEscapeOffsets: c, isReferenceHidden: u, hasPopperEscaped: m }, e.attributes.popper = Object.assign({}, e.attributes.popper, { "data-popper-reference-hidden": u, "data-popper-escaped": m });
|
|
}
|
|
var bt = { name: "hide", enabled: true, phase: "main", requiresIfExists: ["preventOverflow"], fn: Zt };
|
|
function en(t, e, n) {
|
|
var r = q(t), o = [P, E].indexOf(r) >= 0 ? -1 : 1, i = typeof n == "function" ? n(Object.assign({}, e, { placement: t })) : n, a = i[0], s = i[1];
|
|
return a = a || 0, s = (s || 0) * o, [P, W].indexOf(r) >= 0 ? { x: s, y: a } : { x: a, y: s };
|
|
}
|
|
function tn(t) {
|
|
var e = t.state, n = t.options, r = t.name, o = n.offset, i = o === void 0 ? [0, 0] : o, a = Ee.reduce(function(u, m) {
|
|
return u[m] = en(m, e.rects, i), u;
|
|
}, {}), s = a[e.placement], f = s.x, c = s.y;
|
|
e.modifiersData.popperOffsets != null && (e.modifiersData.popperOffsets.x += f, e.modifiersData.popperOffsets.y += c), e.modifiersData[r] = a;
|
|
}
|
|
var wt = { name: "offset", enabled: true, phase: "main", requires: ["popperOffsets"], fn: tn };
|
|
function nn(t) {
|
|
var e = t.state, n = t.name;
|
|
e.modifiersData[n] = mt({ reference: e.rects.reference, element: e.rects.popper, placement: e.placement });
|
|
}
|
|
var He = { name: "popperOffsets", enabled: true, phase: "read", fn: nn, data: {} };
|
|
function rn(t) {
|
|
return t === "x" ? "y" : "x";
|
|
}
|
|
function on(t) {
|
|
var e = t.state, n = t.options, r = t.name, o = n.mainAxis, i = o === void 0 ? true : o, a = n.altAxis, s = a === void 0 ? false : a, f = n.boundary, c = n.rootBoundary, u = n.altBoundary, m = n.padding, v = n.tether, l = v === void 0 ? true : v, h = n.tetherOffset, p = h === void 0 ? 0 : h, g = ne(e, { boundary: f, rootBoundary: c, padding: m, altBoundary: u }), x = q(e.placement), y = te(e.placement), $ = !y, d = Le(x), b = rn(d), w = e.modifiersData.popperOffsets, O = e.rects.reference, j = e.rects.popper, A = typeof p == "function" ? p(Object.assign({}, e.rects, { placement: e.placement })) : p, k = typeof A == "number" ? { mainAxis: A, altAxis: A } : Object.assign({ mainAxis: 0, altAxis: 0 }, A), D = e.modifiersData.offset ? e.modifiersData.offset[e.placement] : null, S = { x: 0, y: 0 };
|
|
if (w) {
|
|
if (i) {
|
|
var L, re = d === "y" ? E : P, oe = d === "y" ? R : W, M = d === "y" ? "height" : "width", T = w[d], pe = T + g[re], _ = T - g[oe], ue = l ? -j[M] / 2 : 0, xe = y === U ? O[M] : j[M], ie = y === U ? -j[M] : -O[M], le = e.elements.arrow, z = l && le ? ke(le) : { width: 0, height: 0 }, V = e.modifiersData["arrow#persistent"] ? e.modifiersData["arrow#persistent"].padding : st(), de = V[re], ae = V[oe], Y = fe(0, O[M], z[M]), jt = $ ? O[M] / 2 - ue - Y - de - k.mainAxis : xe - Y - de - k.mainAxis, Dt = $ ? -O[M] / 2 + ue + Y + ae + k.mainAxis : ie + Y + ae + k.mainAxis, Oe = e.elements.arrow && se(e.elements.arrow), Et = Oe ? d === "y" ? Oe.clientTop || 0 : Oe.clientLeft || 0 : 0, Ce = (L = D == null ? void 0 : D[d]) != null ? L : 0, Pt = T + jt - Ce - Et, At = T + Dt - Ce, qe = fe(l ? ve(pe, Pt) : pe, T, l ? X(_, At) : _);
|
|
w[d] = qe, S[d] = qe - T;
|
|
}
|
|
if (s) {
|
|
var Ve, kt = d === "x" ? E : P, Lt = d === "x" ? R : W, F = w[b], he = b === "y" ? "height" : "width", Ne = F + g[kt], Ie = F - g[Lt], $e = [E, P].indexOf(x) !== -1, _e = (Ve = D == null ? void 0 : D[b]) != null ? Ve : 0, ze = $e ? Ne : F - O[he] - j[he] - _e + k.altAxis, Fe = $e ? F + O[he] + j[he] - _e - k.altAxis : Ie, Ue = l && $e ? St(ze, F, Fe) : fe(l ? ze : Ne, F, l ? Fe : Ie);
|
|
w[b] = Ue, S[b] = Ue - F;
|
|
}
|
|
e.modifiersData[r] = S;
|
|
}
|
|
}
|
|
var xt = { name: "preventOverflow", enabled: true, phase: "main", fn: on, requiresIfExists: ["offset"] };
|
|
function an(t) {
|
|
return { scrollLeft: t.scrollLeft, scrollTop: t.scrollTop };
|
|
}
|
|
function sn(t) {
|
|
return t === H(t) || !B(t) ? We(t) : an(t);
|
|
}
|
|
function fn(t) {
|
|
var e = t.getBoundingClientRect(), n = Z(e.width) / t.offsetWidth || 1, r = Z(e.height) / t.offsetHeight || 1;
|
|
return n !== 1 || r !== 1;
|
|
}
|
|
function cn(t, e, n) {
|
|
n === void 0 && (n = false);
|
|
var r = B(e), o = B(e) && fn(e), i = I(e), a = ee(t, o), s = { scrollLeft: 0, scrollTop: 0 }, f = { x: 0, y: 0 };
|
|
return (r || !r && !n) && ((C(e) !== "body" || Se(i)) && (s = sn(e)), B(e) ? (f = ee(e, true), f.x += e.clientLeft, f.y += e.clientTop) : i && (f.x = Be(i))), { x: a.left + s.scrollLeft - f.x, y: a.top + s.scrollTop - f.y, width: a.width, height: a.height };
|
|
}
|
|
function pn(t) {
|
|
var e = /* @__PURE__ */ new Map(), n = /* @__PURE__ */ new Set(), r = [];
|
|
t.forEach(function(i) {
|
|
e.set(i.name, i);
|
|
});
|
|
function o(i) {
|
|
n.add(i.name);
|
|
var a = [].concat(i.requires || [], i.requiresIfExists || []);
|
|
a.forEach(function(s) {
|
|
if (!n.has(s)) {
|
|
var f = e.get(s);
|
|
f && o(f);
|
|
}
|
|
}), r.push(i);
|
|
}
|
|
return t.forEach(function(i) {
|
|
n.has(i.name) || o(i);
|
|
}), r;
|
|
}
|
|
function un(t) {
|
|
var e = pn(t);
|
|
return ot.reduce(function(n, r) {
|
|
return n.concat(e.filter(function(o) {
|
|
return o.phase === r;
|
|
}));
|
|
}, []);
|
|
}
|
|
function ln(t) {
|
|
var e;
|
|
return function() {
|
|
return e || (e = new Promise(function(n) {
|
|
Promise.resolve().then(function() {
|
|
e = void 0, n(t());
|
|
});
|
|
})), e;
|
|
};
|
|
}
|
|
function dn(t) {
|
|
var e = t.reduce(function(n, r) {
|
|
var o = n[r.name];
|
|
return n[r.name] = o ? Object.assign({}, o, r, { options: Object.assign({}, o.options, r.options), data: Object.assign({}, o.data, r.data) }) : r, n;
|
|
}, {});
|
|
return Object.keys(e).map(function(n) {
|
|
return e[n];
|
|
});
|
|
}
|
|
var Ot = { placement: "bottom", modifiers: [], strategy: "absolute" };
|
|
function $t() {
|
|
for (var t = arguments.length, e = new Array(t), n = 0; n < t; n++) e[n] = arguments[n];
|
|
return !e.some(function(r) {
|
|
return !(r && typeof r.getBoundingClientRect == "function");
|
|
});
|
|
}
|
|
function we(t) {
|
|
t === void 0 && (t = {});
|
|
var e = t, n = e.defaultModifiers, r = n === void 0 ? [] : n, o = e.defaultOptions, i = o === void 0 ? Ot : o;
|
|
return function(a, s, f) {
|
|
f === void 0 && (f = i);
|
|
var c = { placement: "bottom", orderedModifiers: [], options: Object.assign({}, Ot, i), modifiersData: {}, elements: { reference: a, popper: s }, attributes: {}, styles: {} }, u = [], m = false, v = { state: c, setOptions: function(p) {
|
|
var g = typeof p == "function" ? p(c.options) : p;
|
|
h(), c.options = Object.assign({}, i, c.options, g), c.scrollParents = { reference: Q(a) ? ce(a) : a.contextElement ? ce(a.contextElement) : [], popper: ce(s) };
|
|
var x = un(dn([].concat(r, c.options.modifiers)));
|
|
return c.orderedModifiers = x.filter(function(y) {
|
|
return y.enabled;
|
|
}), l(), v.update();
|
|
}, forceUpdate: function() {
|
|
if (!m) {
|
|
var p = c.elements, g = p.reference, x = p.popper;
|
|
if ($t(g, x)) {
|
|
c.rects = { reference: cn(g, se(x), c.options.strategy === "fixed"), popper: ke(x) }, c.reset = false, c.placement = c.options.placement, c.orderedModifiers.forEach(function(j) {
|
|
return c.modifiersData[j.name] = Object.assign({}, j.data);
|
|
});
|
|
for (var y = 0; y < c.orderedModifiers.length; y++) {
|
|
if (c.reset === true) {
|
|
c.reset = false, y = -1;
|
|
continue;
|
|
}
|
|
var $ = c.orderedModifiers[y], d = $.fn, b = $.options, w = b === void 0 ? {} : b, O = $.name;
|
|
typeof d == "function" && (c = d({ state: c, options: w, name: O, instance: v }) || c);
|
|
}
|
|
}
|
|
}
|
|
}, update: ln(function() {
|
|
return new Promise(function(p) {
|
|
v.forceUpdate(), p(c);
|
|
});
|
|
}), destroy: function() {
|
|
h(), m = true;
|
|
} };
|
|
if (!$t(a, s)) return v;
|
|
v.setOptions(f).then(function(p) {
|
|
!m && f.onFirstUpdate && f.onFirstUpdate(p);
|
|
});
|
|
function l() {
|
|
c.orderedModifiers.forEach(function(p) {
|
|
var g = p.name, x = p.options, y = x === void 0 ? {} : x, $ = p.effect;
|
|
if (typeof $ == "function") {
|
|
var d = $({ state: c, name: g, instance: v, options: y }), b = function() {
|
|
};
|
|
u.push(d || b);
|
|
}
|
|
});
|
|
}
|
|
function h() {
|
|
u.forEach(function(p) {
|
|
return p();
|
|
}), u = [];
|
|
}
|
|
return v;
|
|
};
|
|
}
|
|
we();
|
|
var mn = [Re, He, Me, Ae];
|
|
we({ defaultModifiers: mn });
|
|
var gn = [Re, He, Me, Ae, wt, vt, xt, pt, bt], yn = we({ defaultModifiers: gn });
|
|
const ariaProps = buildProps({
|
|
ariaLabel: String,
|
|
ariaOrientation: {
|
|
type: String,
|
|
values: ["horizontal", "vertical", "undefined"]
|
|
},
|
|
ariaControls: String
|
|
});
|
|
const useAriaProps = (arias) => {
|
|
return pick(ariaProps, arias);
|
|
};
|
|
const POSITIONING_STRATEGIES = ["fixed", "absolute"];
|
|
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"
|
|
}
|
|
});
|
|
const popperContentProps = buildProps({
|
|
...popperCoreConfigProps,
|
|
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: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
trapping: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
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"])
|
|
});
|
|
const popperContentEmits = {
|
|
mouseenter: (evt) => evt instanceof MouseEvent,
|
|
mouseleave: (evt) => evt instanceof MouseEvent,
|
|
focus: () => true,
|
|
blur: () => true,
|
|
close: () => true
|
|
};
|
|
const usePopperContentFocusTrap = (props, emit) => {
|
|
const trapped = ref(false);
|
|
const focusStartRef = ref();
|
|
const onFocusAfterTrapped = () => {
|
|
emit("focus");
|
|
};
|
|
const onFocusAfterReleased = (event) => {
|
|
var _a;
|
|
if (((_a = event.detail) == null ? void 0 : _a.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");
|
|
};
|
|
return {
|
|
focusStartRef,
|
|
trapped,
|
|
onFocusAfterReleased,
|
|
onFocusAfterTrapped,
|
|
onFocusInTrap,
|
|
onFocusoutPrevented,
|
|
onReleaseRequested
|
|
};
|
|
};
|
|
const buildPopperOptions = (props, modifiers = []) => {
|
|
const { placement, strategy, popperOptions } = props;
|
|
const options = {
|
|
placement,
|
|
strategy,
|
|
...popperOptions,
|
|
modifiers: [...genModifiers(props), ...modifiers]
|
|
};
|
|
deriveExtraModifiers(options, popperOptions == null ? void 0 : popperOptions.modifiers);
|
|
return options;
|
|
};
|
|
const unwrapMeasurableEl = ($el) => {
|
|
return;
|
|
};
|
|
function genModifiers(options) {
|
|
const { offset, gpuAcceleration, fallbackPlacements } = options;
|
|
return [
|
|
{
|
|
name: "offset",
|
|
options: {
|
|
offset: [0, offset != null ? offset : 12]
|
|
}
|
|
},
|
|
{
|
|
name: "preventOverflow",
|
|
options: {
|
|
padding: {
|
|
top: 2,
|
|
bottom: 2,
|
|
left: 5,
|
|
right: 5
|
|
}
|
|
}
|
|
},
|
|
{
|
|
name: "flip",
|
|
options: {
|
|
padding: 5,
|
|
fallbackPlacements
|
|
}
|
|
},
|
|
{
|
|
name: "computeStyles",
|
|
options: {
|
|
gpuAcceleration
|
|
}
|
|
}
|
|
];
|
|
}
|
|
function deriveExtraModifiers(options, modifiers) {
|
|
if (modifiers) {
|
|
options.modifiers = [...options.modifiers, ...modifiers != null ? modifiers : []];
|
|
}
|
|
}
|
|
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 = computed(() => {
|
|
const { onFirstUpdate, placement, strategy, modifiers } = unref(opts);
|
|
return {
|
|
onFirstUpdate,
|
|
placement: placement || "bottom",
|
|
strategy: strategy || "absolute",
|
|
modifiers: [
|
|
...modifiers || [],
|
|
stateUpdater,
|
|
{ name: "applyStyles", enabled: false }
|
|
]
|
|
};
|
|
});
|
|
const instanceRef = shallowRef();
|
|
const states = ref({
|
|
styles: {
|
|
popper: {
|
|
position: unref(options).strategy,
|
|
left: "0",
|
|
top: "0"
|
|
},
|
|
arrow: {
|
|
position: "absolute"
|
|
}
|
|
},
|
|
attributes: {}
|
|
});
|
|
const destroy = () => {
|
|
if (!instanceRef.value)
|
|
return;
|
|
instanceRef.value.destroy();
|
|
instanceRef.value = void 0;
|
|
};
|
|
watch(options, (newOptions) => {
|
|
const instance = unref(instanceRef);
|
|
if (instance) {
|
|
instance.setOptions(newOptions);
|
|
}
|
|
}, {
|
|
deep: true
|
|
});
|
|
watch([referenceElementRef, popperElementRef], ([referenceElement, popperElement]) => {
|
|
destroy();
|
|
if (!referenceElement || !popperElement)
|
|
return;
|
|
instanceRef.value = yn(referenceElement, popperElement, unref(options));
|
|
});
|
|
return {
|
|
state: computed(() => {
|
|
var _a;
|
|
return { ...((_a = unref(instanceRef)) == null ? void 0 : _a.state) || {} };
|
|
}),
|
|
styles: computed(() => unref(states).styles),
|
|
attributes: computed(() => unref(states).attributes),
|
|
update: () => {
|
|
var _a;
|
|
return (_a = unref(instanceRef)) == null ? void 0 : _a.update();
|
|
},
|
|
forceUpdate: () => {
|
|
var _a;
|
|
return (_a = unref(instanceRef)) == null ? void 0 : _a.forceUpdate();
|
|
},
|
|
instanceRef: computed(() => unref(instanceRef))
|
|
};
|
|
};
|
|
function deriveState(state) {
|
|
const elements = Object.keys(state.elements);
|
|
const styles = fromPairs(elements.map((element) => [element, state.styles[element] || {}]));
|
|
const attributes = fromPairs(elements.map((element) => [element, state.attributes[element]]));
|
|
return {
|
|
styles,
|
|
attributes
|
|
};
|
|
}
|
|
const DEFAULT_ARROW_OFFSET = 0;
|
|
const usePopperContent = (props) => {
|
|
const { popperInstanceRef, contentRef, triggerRef, role } = inject(POPPER_INJECTION_KEY, void 0);
|
|
const arrowRef = ref();
|
|
const arrowOffset = ref();
|
|
const eventListenerModifier = computed(() => {
|
|
return {
|
|
name: "eventListeners",
|
|
enabled: !!props.visible
|
|
};
|
|
});
|
|
const arrowModifier = computed(() => {
|
|
var _a;
|
|
const arrowEl = unref(arrowRef);
|
|
const offset = (_a = unref(arrowOffset)) != null ? _a : DEFAULT_ARROW_OFFSET;
|
|
return {
|
|
name: "arrow",
|
|
enabled: !isUndefined(arrowEl),
|
|
options: {
|
|
element: arrowEl,
|
|
padding: offset
|
|
}
|
|
};
|
|
});
|
|
const options = computed(() => {
|
|
return {
|
|
onFirstUpdate: () => {
|
|
update();
|
|
},
|
|
...buildPopperOptions(props, [
|
|
unref(arrowModifier),
|
|
unref(eventListenerModifier)
|
|
])
|
|
};
|
|
});
|
|
const computedReference = computed(() => unwrapMeasurableEl(props.referenceEl) || unref(triggerRef));
|
|
const { attributes, state, styles, update, forceUpdate, instanceRef } = usePopper(computedReference, contentRef, options);
|
|
watch(instanceRef, (instance) => popperInstanceRef.value = instance);
|
|
return {
|
|
attributes,
|
|
arrowRef,
|
|
contentRef,
|
|
instanceRef,
|
|
state,
|
|
styles,
|
|
role,
|
|
forceUpdate,
|
|
update
|
|
};
|
|
};
|
|
const usePopperContentDOM = (props, {
|
|
attributes,
|
|
styles,
|
|
role
|
|
}) => {
|
|
const { nextZIndex } = useZIndex();
|
|
const ns = useNamespace("popper");
|
|
const contentAttrs = computed(() => unref(attributes).popper);
|
|
const contentZIndex = ref(isNumber(props.zIndex) ? props.zIndex : nextZIndex());
|
|
const contentClass = computed(() => [
|
|
ns.b(),
|
|
ns.is("pure", props.pure),
|
|
ns.is(props.effect),
|
|
props.popperClass
|
|
]);
|
|
const contentStyle = computed(() => {
|
|
return [
|
|
{ zIndex: unref(contentZIndex) },
|
|
unref(styles).popper,
|
|
props.popperStyle || {}
|
|
];
|
|
});
|
|
const ariaModal = computed(() => role.value === "dialog" ? "false" : void 0);
|
|
const arrowStyle = computed(() => unref(styles).arrow || {});
|
|
const updateZIndex = () => {
|
|
contentZIndex.value = isNumber(props.zIndex) ? props.zIndex : nextZIndex();
|
|
};
|
|
return {
|
|
ariaModal,
|
|
arrowStyle,
|
|
contentAttrs,
|
|
contentClass,
|
|
contentStyle,
|
|
contentZIndex,
|
|
updateZIndex
|
|
};
|
|
};
|
|
const formContextKey = Symbol("formContextKey");
|
|
const formItemContextKey = Symbol("formItemContextKey");
|
|
const __default__$6 = defineComponent({
|
|
name: "ElPopperContent"
|
|
});
|
|
const _sfc_main$6 = /* @__PURE__ */ defineComponent({
|
|
...__default__$6,
|
|
props: popperContentProps,
|
|
emits: popperContentEmits,
|
|
setup(__props, { expose, 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 {
|
|
arrowStyle,
|
|
contentAttrs,
|
|
contentClass,
|
|
contentStyle,
|
|
updateZIndex
|
|
} = usePopperContentDOM(props, {
|
|
styles,
|
|
attributes,
|
|
role
|
|
});
|
|
const formItemContext = inject(formItemContextKey, void 0);
|
|
const arrowOffset = ref();
|
|
provide(POPPER_CONTENT_INJECTION_KEY, {
|
|
arrowStyle,
|
|
arrowRef,
|
|
arrowOffset
|
|
});
|
|
if (formItemContext) {
|
|
provide(formItemContextKey, {
|
|
...formItemContext,
|
|
addInputId: shared_cjs_prodExports.NOOP,
|
|
removeInputId: shared_cjs_prodExports.NOOP
|
|
});
|
|
}
|
|
const updatePopper = (shouldUpdateZIndex = true) => {
|
|
update();
|
|
shouldUpdateZIndex && updateZIndex();
|
|
};
|
|
expose({
|
|
popperContentRef: contentRef,
|
|
popperInstanceRef: instanceRef,
|
|
updatePopper,
|
|
contentStyle
|
|
});
|
|
return (_ctx, _cache) => {
|
|
return openBlock(), createElementBlock("div", mergeProps({
|
|
ref_key: "contentRef",
|
|
ref: contentRef
|
|
}, unref(contentAttrs), {
|
|
style: unref(contentStyle),
|
|
class: unref(contentClass),
|
|
tabindex: "-1",
|
|
onMouseenter: (e) => _ctx.$emit("mouseenter", e),
|
|
onMouseleave: (e) => _ctx.$emit("mouseleave", e)
|
|
}), [
|
|
createVNode(unref(ElFocusTrap), {
|
|
trapped: unref(trapped),
|
|
"trap-on-focus-in": true,
|
|
"focus-trap-el": unref(contentRef),
|
|
"focus-start-el": unref(focusStartRef),
|
|
onFocusAfterTrapped: unref(onFocusAfterTrapped),
|
|
onFocusAfterReleased: unref(onFocusAfterReleased),
|
|
onFocusin: unref(onFocusInTrap),
|
|
onFocusoutPrevented: unref(onFocusoutPrevented),
|
|
onReleaseRequested: unref(onReleaseRequested)
|
|
}, {
|
|
default: withCtx(() => [
|
|
renderSlot(_ctx.$slots, "default")
|
|
]),
|
|
_: 3
|
|
}, 8, ["trapped", "focus-trap-el", "focus-start-el", "onFocusAfterTrapped", "onFocusAfterReleased", "onFocusin", "onFocusoutPrevented", "onReleaseRequested"])
|
|
], 16, ["onMouseenter", "onMouseleave"]);
|
|
};
|
|
}
|
|
});
|
|
var ElPopperContent = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__file", "content.vue"]]);
|
|
const ElPopper = withInstall(Popper);
|
|
const TOOLTIP_INJECTION_KEY = Symbol("elTooltip");
|
|
function useTimeout() {
|
|
let timeoutHandle;
|
|
const registerTimeout = (fn2, delay) => {
|
|
cancelTimeout();
|
|
timeoutHandle = (void 0).setTimeout(fn2, delay);
|
|
};
|
|
const cancelTimeout = () => (void 0).clearTimeout(timeoutHandle);
|
|
tryOnScopeDispose(() => cancelTimeout());
|
|
return {
|
|
registerTimeout,
|
|
cancelTimeout
|
|
};
|
|
}
|
|
const useDelayedToggleProps = buildProps({
|
|
showAfter: {
|
|
type: Number,
|
|
default: 0
|
|
},
|
|
hideAfter: {
|
|
type: Number,
|
|
default: 200
|
|
},
|
|
autoClose: {
|
|
type: Number,
|
|
default: 0
|
|
}
|
|
});
|
|
const useDelayedToggle = ({
|
|
showAfter,
|
|
hideAfter,
|
|
autoClose,
|
|
open,
|
|
close
|
|
}) => {
|
|
const { registerTimeout } = useTimeout();
|
|
const {
|
|
registerTimeout: registerTimeoutForAutoClose,
|
|
cancelTimeout: cancelTimeoutForAutoClose
|
|
} = useTimeout();
|
|
const onOpen = (event) => {
|
|
registerTimeout(() => {
|
|
open(event);
|
|
const _autoClose = unref(autoClose);
|
|
if (isNumber(_autoClose) && _autoClose > 0) {
|
|
registerTimeoutForAutoClose(() => {
|
|
close(event);
|
|
}, _autoClose);
|
|
}
|
|
}, unref(showAfter));
|
|
};
|
|
const onClose = (event) => {
|
|
cancelTimeoutForAutoClose();
|
|
registerTimeout(() => {
|
|
close(event);
|
|
}, unref(hideAfter));
|
|
};
|
|
return {
|
|
onOpen,
|
|
onClose
|
|
};
|
|
};
|
|
const useTooltipContentProps = buildProps({
|
|
...useDelayedToggleProps,
|
|
...popperContentProps,
|
|
appendTo: {
|
|
type: definePropType([String, Object])
|
|
},
|
|
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"])
|
|
});
|
|
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]
|
|
}
|
|
});
|
|
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 useModelToggleEmits2 = [updateEventKey];
|
|
const useModelToggleProps2 = {
|
|
[name]: _prop,
|
|
[updateEventKeyRaw]: _event
|
|
};
|
|
const useModelToggle2 = ({
|
|
indicator,
|
|
toggleReason,
|
|
shouldHideWhenRouteChanges,
|
|
shouldProceed,
|
|
onShow,
|
|
onHide
|
|
}) => {
|
|
const instance = getCurrentInstance();
|
|
const { emit } = instance;
|
|
const props = instance.props;
|
|
const hasUpdateHandler = computed(() => shared_cjs_prodExports.isFunction(props[updateEventKeyRaw]));
|
|
const isModelBindingAbsent = computed(() => props[name] === null);
|
|
const doShow = (event) => {
|
|
if (indicator.value === true) {
|
|
return;
|
|
}
|
|
indicator.value = true;
|
|
if (toggleReason) {
|
|
toggleReason.value = event;
|
|
}
|
|
if (shared_cjs_prodExports.isFunction(onShow)) {
|
|
onShow(event);
|
|
}
|
|
};
|
|
const doHide = (event) => {
|
|
if (indicator.value === false) {
|
|
return;
|
|
}
|
|
indicator.value = false;
|
|
if (toggleReason) {
|
|
toggleReason.value = event;
|
|
}
|
|
if (shared_cjs_prodExports.isFunction(onHide)) {
|
|
onHide(event);
|
|
}
|
|
};
|
|
const show = (event) => {
|
|
if (props.disabled === true || shared_cjs_prodExports.isFunction(shouldProceed) && !shouldProceed())
|
|
return;
|
|
hasUpdateHandler.value && isClient;
|
|
if (isModelBindingAbsent.value || true) {
|
|
doShow(event);
|
|
}
|
|
};
|
|
const hide = (event) => {
|
|
if (props.disabled === true || true)
|
|
return;
|
|
};
|
|
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();
|
|
}
|
|
};
|
|
watch(() => props[name], onChange);
|
|
if (shouldHideWhenRouteChanges && instance.appContext.config.globalProperties.$route !== void 0) {
|
|
watch(() => ({
|
|
...instance.proxy.$route
|
|
}), () => {
|
|
if (shouldHideWhenRouteChanges.value && indicator.value) {
|
|
hide();
|
|
}
|
|
});
|
|
}
|
|
return {
|
|
hide,
|
|
show,
|
|
toggle,
|
|
hasUpdateHandler
|
|
};
|
|
};
|
|
return {
|
|
useModelToggle: useModelToggle2,
|
|
useModelToggleProps: useModelToggleProps2,
|
|
useModelToggleEmits: useModelToggleEmits2
|
|
};
|
|
};
|
|
const {
|
|
useModelToggleProps: useTooltipModelToggleProps,
|
|
useModelToggleEmits: useTooltipModelToggleEmits,
|
|
useModelToggle: useTooltipModelToggle
|
|
} = createModelToggleComposable("visible");
|
|
const useTooltipProps = buildProps({
|
|
...popperProps,
|
|
...useTooltipModelToggleProps,
|
|
...useTooltipContentProps,
|
|
...useTooltipTriggerProps,
|
|
...popperArrowProps,
|
|
showArrow: {
|
|
type: Boolean,
|
|
default: true
|
|
}
|
|
});
|
|
const tooltipEmits = [
|
|
...useTooltipModelToggleEmits,
|
|
"before-show",
|
|
"before-hide",
|
|
"show",
|
|
"hide",
|
|
"open",
|
|
"close"
|
|
];
|
|
const isTriggerType = (trigger, type) => {
|
|
if (shared_cjs_prodExports.isArray(trigger)) {
|
|
return trigger.includes(type);
|
|
}
|
|
return trigger === type;
|
|
};
|
|
const whenTrigger = (trigger, type, handler) => {
|
|
return (e) => {
|
|
isTriggerType(unref(trigger), type) && handler(e);
|
|
};
|
|
};
|
|
const composeEventHandlers = (theirsHandler, oursHandler, { checkForDefaultPrevented = true } = {}) => {
|
|
const handleEvent = (event) => {
|
|
const shouldPrevent = theirsHandler == null ? void 0 : theirsHandler(event);
|
|
if (checkForDefaultPrevented === false || !shouldPrevent) {
|
|
return oursHandler == null ? void 0 : oursHandler(event);
|
|
}
|
|
};
|
|
return handleEvent;
|
|
};
|
|
const __default__$5 = defineComponent({
|
|
name: "ElTooltipTrigger"
|
|
});
|
|
const _sfc_main$5 = /* @__PURE__ */ defineComponent({
|
|
...__default__$5,
|
|
props: useTooltipTriggerProps,
|
|
setup(__props, { expose }) {
|
|
const props = __props;
|
|
const ns = useNamespace("tooltip");
|
|
const { controlled, id, open, onOpen, onClose, onToggle } = inject(TOOLTIP_INJECTION_KEY, void 0);
|
|
const triggerRef = ref(null);
|
|
const stopWhenControlledOrDisabled = () => {
|
|
if (unref(controlled) || props.disabled) {
|
|
return true;
|
|
}
|
|
};
|
|
const trigger = toRef(props, "trigger");
|
|
const onMouseenter = composeEventHandlers(stopWhenControlledOrDisabled, whenTrigger(trigger, "hover", onOpen));
|
|
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 } = e;
|
|
if (props.triggerKeys.includes(code)) {
|
|
e.preventDefault();
|
|
onToggle(e);
|
|
}
|
|
});
|
|
expose({
|
|
triggerRef
|
|
});
|
|
return (_ctx, _cache) => {
|
|
return openBlock(), createBlock(unref(ElPopperTrigger), {
|
|
id: unref(id),
|
|
"virtual-ref": _ctx.virtualRef,
|
|
open: unref(open),
|
|
"virtual-triggering": _ctx.virtualTriggering,
|
|
class: normalizeClass(unref(ns).e("trigger")),
|
|
onBlur: unref(onBlur),
|
|
onClick: unref(onClick),
|
|
onContextmenu: unref(onContextMenu),
|
|
onFocus: unref(onFocus),
|
|
onMouseenter: unref(onMouseenter),
|
|
onMouseleave: unref(onMouseleave),
|
|
onKeydown: unref(onKeydown)
|
|
}, {
|
|
default: withCtx(() => [
|
|
renderSlot(_ctx.$slots, "default")
|
|
]),
|
|
_: 3
|
|
}, 8, ["id", "virtual-ref", "open", "virtual-triggering", "class", "onBlur", "onClick", "onContextmenu", "onFocus", "onMouseenter", "onMouseleave", "onKeydown"]);
|
|
};
|
|
}
|
|
});
|
|
var ElTooltipTrigger = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__file", "trigger.vue"]]);
|
|
const usePopperContainerId = () => {
|
|
const namespace = useGetDerivedNamespace();
|
|
const idInjection = useIdInjection();
|
|
const id = computed(() => {
|
|
return `${namespace.value}-popper-container-${idInjection.prefix}`;
|
|
});
|
|
const selector = computed(() => `#${id.value}`);
|
|
return {
|
|
id,
|
|
selector
|
|
};
|
|
};
|
|
const usePopperContainer = () => {
|
|
const { id, selector } = usePopperContainerId();
|
|
return {
|
|
id,
|
|
selector
|
|
};
|
|
};
|
|
const __default__$4 = defineComponent({
|
|
name: "ElTooltipContent",
|
|
inheritAttrs: false
|
|
});
|
|
const _sfc_main$4 = /* @__PURE__ */ defineComponent({
|
|
...__default__$4,
|
|
props: useTooltipContentProps,
|
|
setup(__props, { expose }) {
|
|
const props = __props;
|
|
const { selector } = usePopperContainerId();
|
|
const ns = useNamespace("tooltip");
|
|
const contentRef = ref();
|
|
let stopHandle;
|
|
const {
|
|
controlled,
|
|
id,
|
|
open,
|
|
trigger,
|
|
onClose,
|
|
onOpen,
|
|
onShow,
|
|
onHide,
|
|
onBeforeShow,
|
|
onBeforeHide
|
|
} = inject(TOOLTIP_INJECTION_KEY, void 0);
|
|
const transitionClass = computed(() => {
|
|
return props.transition || `${ns.namespace.value}-fade-in-linear`;
|
|
});
|
|
const persistentRef = computed(() => {
|
|
return props.persistent;
|
|
});
|
|
const shouldRender = computed(() => {
|
|
return unref(persistentRef) ? true : unref(open);
|
|
});
|
|
const shouldShow = computed(() => {
|
|
return props.disabled ? false : unref(open);
|
|
});
|
|
const appendTo = computed(() => {
|
|
return props.appendTo || selector.value;
|
|
});
|
|
const contentStyle = computed(() => {
|
|
var _a;
|
|
return (_a = props.style) != null ? _a : {};
|
|
});
|
|
const ariaHidden = ref(true);
|
|
const onTransitionLeave = () => {
|
|
onHide();
|
|
isFocusInsideContent() && tryFocus((void 0).body);
|
|
ariaHidden.value = true;
|
|
};
|
|
const stopWhenControlled = () => {
|
|
if (unref(controlled))
|
|
return true;
|
|
};
|
|
const onContentEnter = composeEventHandlers(stopWhenControlled, () => {
|
|
if (props.enterable && unref(trigger) === "hover") {
|
|
onOpen();
|
|
}
|
|
});
|
|
const onContentLeave = composeEventHandlers(stopWhenControlled, () => {
|
|
if (unref(trigger) === "hover") {
|
|
onClose();
|
|
}
|
|
});
|
|
const onBeforeEnter = () => {
|
|
var _a, _b;
|
|
(_b = (_a = contentRef.value) == null ? void 0 : _a.updatePopper) == null ? void 0 : _b.call(_a);
|
|
onBeforeShow == null ? void 0 : onBeforeShow();
|
|
};
|
|
const onBeforeLeave = () => {
|
|
onBeforeHide == null ? void 0 : onBeforeHide();
|
|
};
|
|
const onAfterShow = () => {
|
|
onShow();
|
|
stopHandle = onClickOutside(computed(() => {
|
|
var _a;
|
|
return (_a = contentRef.value) == null ? void 0 : _a.popperContentRef;
|
|
}), () => {
|
|
if (unref(controlled))
|
|
return;
|
|
const $trigger = unref(trigger);
|
|
if ($trigger !== "hover") {
|
|
onClose();
|
|
}
|
|
});
|
|
};
|
|
const onBlur = () => {
|
|
if (!props.virtualTriggering) {
|
|
onClose();
|
|
}
|
|
};
|
|
const isFocusInsideContent = (event) => {
|
|
var _a;
|
|
const popperContent = (_a = contentRef.value) == null ? void 0 : _a.popperContentRef;
|
|
const activeElement = (event == null ? void 0 : event.relatedTarget) || (void 0).activeElement;
|
|
return popperContent == null ? void 0 : popperContent.contains(activeElement);
|
|
};
|
|
watch(() => unref(open), (val) => {
|
|
if (!val) {
|
|
stopHandle == null ? void 0 : stopHandle();
|
|
} else {
|
|
ariaHidden.value = false;
|
|
}
|
|
}, {
|
|
flush: "post"
|
|
});
|
|
watch(() => props.content, () => {
|
|
var _a, _b;
|
|
(_b = (_a = contentRef.value) == null ? void 0 : _a.updatePopper) == null ? void 0 : _b.call(_a);
|
|
});
|
|
expose({
|
|
contentRef,
|
|
isFocusInsideContent
|
|
});
|
|
return (_ctx, _cache) => {
|
|
return openBlock(), createBlock(unref(ElTeleport), {
|
|
disabled: !_ctx.teleported,
|
|
to: unref(appendTo)
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(Transition, {
|
|
name: unref(transitionClass),
|
|
onAfterLeave: onTransitionLeave,
|
|
onBeforeEnter,
|
|
onAfterEnter: onAfterShow,
|
|
onBeforeLeave
|
|
}, {
|
|
default: withCtx(() => [
|
|
unref(shouldRender) ? withDirectives((openBlock(), createBlock(unref(ElPopperContent), mergeProps({
|
|
key: 0,
|
|
id: unref(id),
|
|
ref_key: "contentRef",
|
|
ref: contentRef
|
|
}, _ctx.$attrs, {
|
|
"aria-label": _ctx.ariaLabel,
|
|
"aria-hidden": ariaHidden.value,
|
|
"boundaries-padding": _ctx.boundariesPadding,
|
|
"fallback-placements": _ctx.fallbackPlacements,
|
|
"gpu-acceleration": _ctx.gpuAcceleration,
|
|
offset: _ctx.offset,
|
|
placement: _ctx.placement,
|
|
"popper-options": _ctx.popperOptions,
|
|
strategy: _ctx.strategy,
|
|
effect: _ctx.effect,
|
|
enterable: _ctx.enterable,
|
|
pure: _ctx.pure,
|
|
"popper-class": _ctx.popperClass,
|
|
"popper-style": [_ctx.popperStyle, unref(contentStyle)],
|
|
"reference-el": _ctx.referenceEl,
|
|
"trigger-target-el": _ctx.triggerTargetEl,
|
|
visible: unref(shouldShow),
|
|
"z-index": _ctx.zIndex,
|
|
onMouseenter: unref(onContentEnter),
|
|
onMouseleave: unref(onContentLeave),
|
|
onBlur,
|
|
onClose: unref(onClose)
|
|
}), {
|
|
default: withCtx(() => [
|
|
renderSlot(_ctx.$slots, "default")
|
|
]),
|
|
_: 3
|
|
}, 16, ["id", "aria-label", "aria-hidden", "boundaries-padding", "fallback-placements", "gpu-acceleration", "offset", "placement", "popper-options", "strategy", "effect", "enterable", "pure", "popper-class", "popper-style", "reference-el", "trigger-target-el", "visible", "z-index", "onMouseenter", "onMouseleave", "onClose"])), [
|
|
[vShow, unref(shouldShow)]
|
|
]) : createCommentVNode("v-if", true)
|
|
]),
|
|
_: 3
|
|
}, 8, ["name"])
|
|
]),
|
|
_: 3
|
|
}, 8, ["disabled", "to"]);
|
|
};
|
|
}
|
|
});
|
|
var ElTooltipContent = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__file", "content.vue"]]);
|
|
const __default__$3 = defineComponent({
|
|
name: "ElTooltip"
|
|
});
|
|
const _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
...__default__$3,
|
|
props: useTooltipProps,
|
|
emits: tooltipEmits,
|
|
setup(__props, { expose, emit }) {
|
|
const props = __props;
|
|
usePopperContainer();
|
|
const id = useId();
|
|
const popperRef = ref();
|
|
const contentRef = ref();
|
|
const updatePopper = () => {
|
|
var _a;
|
|
const popperComponent = unref(popperRef);
|
|
if (popperComponent) {
|
|
(_a = popperComponent.popperInstanceRef) == null ? void 0 : _a.update();
|
|
}
|
|
};
|
|
const open = ref(false);
|
|
const toggleReason = ref();
|
|
const { show, hide, hasUpdateHandler } = useTooltipModelToggle({
|
|
indicator: open,
|
|
toggleReason
|
|
});
|
|
const { onOpen, onClose } = useDelayedToggle({
|
|
showAfter: toRef(props, "showAfter"),
|
|
hideAfter: toRef(props, "hideAfter"),
|
|
autoClose: toRef(props, "autoClose"),
|
|
open: show,
|
|
close: hide
|
|
});
|
|
const controlled = computed(() => isBoolean(props.visible) && !hasUpdateHandler.value);
|
|
provide(TOOLTIP_INJECTION_KEY, {
|
|
controlled,
|
|
id,
|
|
open: readonly(open),
|
|
trigger: toRef(props, "trigger"),
|
|
onOpen: (event) => {
|
|
onOpen(event);
|
|
},
|
|
onClose: (event) => {
|
|
onClose(event);
|
|
},
|
|
onToggle: (event) => {
|
|
if (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
|
|
});
|
|
watch(() => props.disabled, (disabled) => {
|
|
if (disabled && open.value) {
|
|
open.value = false;
|
|
}
|
|
});
|
|
const isFocusInsideContent = (event) => {
|
|
var _a;
|
|
return (_a = contentRef.value) == null ? void 0 : _a.isFocusInsideContent(event);
|
|
};
|
|
expose({
|
|
popperRef,
|
|
contentRef,
|
|
isFocusInsideContent,
|
|
updatePopper,
|
|
onOpen,
|
|
onClose,
|
|
hide
|
|
});
|
|
return (_ctx, _cache) => {
|
|
return openBlock(), createBlock(unref(ElPopper), {
|
|
ref_key: "popperRef",
|
|
ref: popperRef,
|
|
role: _ctx.role
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(ElTooltipTrigger, {
|
|
disabled: _ctx.disabled,
|
|
trigger: _ctx.trigger,
|
|
"trigger-keys": _ctx.triggerKeys,
|
|
"virtual-ref": _ctx.virtualRef,
|
|
"virtual-triggering": _ctx.virtualTriggering
|
|
}, {
|
|
default: withCtx(() => [
|
|
_ctx.$slots.default ? renderSlot(_ctx.$slots, "default", { key: 0 }) : createCommentVNode("v-if", true)
|
|
]),
|
|
_: 3
|
|
}, 8, ["disabled", "trigger", "trigger-keys", "virtual-ref", "virtual-triggering"]),
|
|
createVNode(ElTooltipContent, {
|
|
ref_key: "contentRef",
|
|
ref: contentRef,
|
|
"aria-label": _ctx.ariaLabel,
|
|
"boundaries-padding": _ctx.boundariesPadding,
|
|
content: _ctx.content,
|
|
disabled: _ctx.disabled,
|
|
effect: _ctx.effect,
|
|
enterable: _ctx.enterable,
|
|
"fallback-placements": _ctx.fallbackPlacements,
|
|
"hide-after": _ctx.hideAfter,
|
|
"gpu-acceleration": _ctx.gpuAcceleration,
|
|
offset: _ctx.offset,
|
|
persistent: _ctx.persistent,
|
|
"popper-class": _ctx.popperClass,
|
|
"popper-style": _ctx.popperStyle,
|
|
placement: _ctx.placement,
|
|
"popper-options": _ctx.popperOptions,
|
|
pure: _ctx.pure,
|
|
"raw-content": _ctx.rawContent,
|
|
"reference-el": _ctx.referenceEl,
|
|
"trigger-target-el": _ctx.triggerTargetEl,
|
|
"show-after": _ctx.showAfter,
|
|
strategy: _ctx.strategy,
|
|
teleported: _ctx.teleported,
|
|
transition: _ctx.transition,
|
|
"virtual-triggering": _ctx.virtualTriggering,
|
|
"z-index": _ctx.zIndex,
|
|
"append-to": _ctx.appendTo
|
|
}, {
|
|
default: withCtx(() => [
|
|
renderSlot(_ctx.$slots, "content", {}, () => [
|
|
_ctx.rawContent ? (openBlock(), createElementBlock("span", {
|
|
key: 0,
|
|
innerHTML: _ctx.content
|
|
}, null, 8, ["innerHTML"])) : (openBlock(), createElementBlock("span", { key: 1 }, toDisplayString(_ctx.content), 1))
|
|
]),
|
|
_ctx.showArrow ? (openBlock(), createBlock(unref(ElPopperArrow), {
|
|
key: 0,
|
|
"arrow-offset": _ctx.arrowOffset
|
|
}, null, 8, ["arrow-offset"])) : 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", "pure", "raw-content", "reference-el", "trigger-target-el", "show-after", "strategy", "teleported", "transition", "virtual-triggering", "z-index", "append-to"])
|
|
]),
|
|
_: 3
|
|
}, 8, ["role"]);
|
|
};
|
|
}
|
|
});
|
|
var Tooltip = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__file", "tooltip.vue"]]);
|
|
const ElTooltip = withInstall(Tooltip);
|
|
const inputProps = buildProps({
|
|
id: {
|
|
type: String,
|
|
default: void 0
|
|
},
|
|
size: useSizeProp,
|
|
disabled: Boolean,
|
|
modelValue: {
|
|
type: definePropType([
|
|
String,
|
|
Number,
|
|
Object
|
|
]),
|
|
default: ""
|
|
},
|
|
maxlength: {
|
|
type: [String, Number]
|
|
},
|
|
minlength: {
|
|
type: [String, Number]
|
|
},
|
|
type: {
|
|
type: String,
|
|
default: "text"
|
|
},
|
|
resize: {
|
|
type: String,
|
|
values: ["none", "both", "horizontal", "vertical"]
|
|
},
|
|
autosize: {
|
|
type: definePropType([Boolean, Object]),
|
|
default: false
|
|
},
|
|
autocomplete: {
|
|
type: String,
|
|
default: "off"
|
|
},
|
|
formatter: {
|
|
type: Function
|
|
},
|
|
parser: {
|
|
type: Function
|
|
},
|
|
placeholder: {
|
|
type: String
|
|
},
|
|
form: {
|
|
type: String
|
|
},
|
|
readonly: Boolean,
|
|
clearable: Boolean,
|
|
showPassword: Boolean,
|
|
showWordLimit: Boolean,
|
|
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({})
|
|
},
|
|
autofocus: Boolean,
|
|
rows: {
|
|
type: Number,
|
|
default: 2
|
|
},
|
|
...useAriaProps(["ariaLabel"])
|
|
});
|
|
const inputEmits = {
|
|
[UPDATE_MODEL_EVENT]: (value) => shared_cjs_prodExports.isString(value),
|
|
input: (value) => shared_cjs_prodExports.isString(value),
|
|
change: (value) => shared_cjs_prodExports.isString(value),
|
|
focus: (evt) => evt instanceof FocusEvent,
|
|
blur: (evt) => evt instanceof FocusEvent,
|
|
clear: () => true,
|
|
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
|
|
};
|
|
const DEFAULT_EXCLUDE_KEYS = ["class", "style"];
|
|
const LISTENER_PREFIX = /^on[A-Z]/;
|
|
const useAttrs = (params = {}) => {
|
|
const { excludeListeners = false, excludeKeys } = params;
|
|
const allExcludeKeys = computed(() => {
|
|
return ((excludeKeys == null ? void 0 : excludeKeys.value) || []).concat(DEFAULT_EXCLUDE_KEYS);
|
|
});
|
|
const instance = getCurrentInstance();
|
|
if (!instance) {
|
|
return computed(() => ({}));
|
|
}
|
|
return computed(() => {
|
|
var _a;
|
|
return fromPairs(Object.entries((_a = instance.proxy) == null ? void 0 : _a.$attrs).filter(([key]) => !allExcludeKeys.value.includes(key) && !(excludeListeners && LISTENER_PREFIX.test(key))));
|
|
});
|
|
};
|
|
const useFormItem = () => {
|
|
const form = inject(formContextKey, void 0);
|
|
const formItem = inject(formItemContextKey, void 0);
|
|
return {
|
|
form,
|
|
formItem
|
|
};
|
|
};
|
|
const useFormItemInputId = (props, {
|
|
formItemContext,
|
|
disableIdGeneration,
|
|
disableIdManagement
|
|
}) => {
|
|
if (!disableIdGeneration) {
|
|
disableIdGeneration = ref(false);
|
|
}
|
|
if (!disableIdManagement) {
|
|
disableIdManagement = ref(false);
|
|
}
|
|
const inputId = ref();
|
|
const isLabeledByFormItem = computed(() => {
|
|
var _a;
|
|
return !!(!(props.label || props.ariaLabel) && formItemContext && formItemContext.inputIds && ((_a = formItemContext.inputIds) == null ? void 0 : _a.length) <= 1);
|
|
});
|
|
return {
|
|
isLabeledByFormItem,
|
|
inputId
|
|
};
|
|
};
|
|
const useProp = (name) => {
|
|
const vm = getCurrentInstance();
|
|
return computed(() => {
|
|
var _a, _b;
|
|
return (_b = (_a = vm == null ? void 0 : vm.proxy) == null ? void 0 : _a.$props) == null ? void 0 : _b[name];
|
|
});
|
|
};
|
|
const useFormSize = (fallback, ignore = {}) => {
|
|
const emptyRef = ref(void 0);
|
|
const size = ignore.prop ? emptyRef : useProp("size");
|
|
const globalConfig = ignore.global ? emptyRef : useGlobalSize();
|
|
const form = ignore.form ? { size: void 0 } : inject(formContextKey, void 0);
|
|
const formItem = ignore.formItem ? { size: void 0 } : inject(formItemContextKey, void 0);
|
|
return computed(() => size.value || unref(fallback) || (formItem == null ? void 0 : formItem.size) || (form == null ? void 0 : form.size) || globalConfig.value || "");
|
|
};
|
|
const useFormDisabled = (fallback) => {
|
|
const disabled = useProp("disabled");
|
|
const form = inject(formContextKey, void 0);
|
|
return computed(() => disabled.value || unref(fallback) || (form == null ? void 0 : form.disabled) || false);
|
|
};
|
|
function useFocusController(target, {
|
|
beforeFocus,
|
|
afterFocus,
|
|
beforeBlur,
|
|
afterBlur
|
|
} = {}) {
|
|
const instance = getCurrentInstance();
|
|
const { emit } = instance;
|
|
const wrapperRef = shallowRef();
|
|
const isFocused = ref(false);
|
|
const handleFocus = (event) => {
|
|
const cancelFocus = shared_cjs_prodExports.isFunction(beforeFocus) ? beforeFocus(event) : false;
|
|
if (cancelFocus || isFocused.value)
|
|
return;
|
|
isFocused.value = true;
|
|
emit("focus", event);
|
|
afterFocus == null ? void 0 : afterFocus();
|
|
};
|
|
const handleBlur = (event) => {
|
|
var _a;
|
|
const cancelBlur = shared_cjs_prodExports.isFunction(beforeBlur) ? beforeBlur(event) : false;
|
|
if (cancelBlur || event.relatedTarget && ((_a = wrapperRef.value) == null ? void 0 : _a.contains(event.relatedTarget)))
|
|
return;
|
|
isFocused.value = false;
|
|
emit("blur", event);
|
|
afterBlur == null ? void 0 : afterBlur();
|
|
};
|
|
const handleClick = () => {
|
|
var _a, _b;
|
|
if (((_a = wrapperRef.value) == null ? void 0 : _a.contains((void 0).activeElement)) && wrapperRef.value !== (void 0).activeElement)
|
|
return;
|
|
(_b = target.value) == null ? void 0 : _b.focus();
|
|
};
|
|
watch(wrapperRef, (el) => {
|
|
if (el) {
|
|
el.setAttribute("tabindex", "-1");
|
|
}
|
|
});
|
|
useEventListener(wrapperRef, "focus", handleFocus, true);
|
|
useEventListener(wrapperRef, "blur", handleBlur, true);
|
|
useEventListener(wrapperRef, "click", handleClick, true);
|
|
return {
|
|
isFocused,
|
|
wrapperRef,
|
|
handleFocus,
|
|
handleBlur
|
|
};
|
|
}
|
|
const isKorean = (text) => /([\uAC00-\uD7AF\u3130-\u318F])+/gi.test(text);
|
|
function useComposition({
|
|
afterComposition,
|
|
emit
|
|
}) {
|
|
const isComposing = ref(false);
|
|
const handleCompositionStart = (event) => {
|
|
emit == null ? void 0 : emit("compositionstart", event);
|
|
isComposing.value = true;
|
|
};
|
|
const handleCompositionUpdate = (event) => {
|
|
var _a;
|
|
emit == null ? void 0 : emit("compositionupdate", event);
|
|
const text = (_a = event.target) == null ? void 0 : _a.value;
|
|
const lastCharacter = text[text.length - 1] || "";
|
|
isComposing.value = !isKorean(lastCharacter);
|
|
};
|
|
const handleCompositionEnd = (event) => {
|
|
emit == null ? void 0 : emit("compositionend", event);
|
|
if (isComposing.value) {
|
|
isComposing.value = false;
|
|
nextTick(() => afterComposition(event));
|
|
}
|
|
};
|
|
const handleComposition = (event) => {
|
|
event.type === "compositionend" ? handleCompositionEnd(event) : handleCompositionUpdate(event);
|
|
};
|
|
return {
|
|
isComposing,
|
|
handleComposition,
|
|
handleCompositionStart,
|
|
handleCompositionUpdate,
|
|
handleCompositionEnd
|
|
};
|
|
}
|
|
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;
|
|
const beforeTxt = value.slice(0, Math.max(0, selectionStart));
|
|
const afterTxt = value.slice(Math.max(0, selectionEnd));
|
|
selectionInfo = {
|
|
selectionStart,
|
|
selectionEnd,
|
|
value,
|
|
beforeTxt,
|
|
afterTxt
|
|
};
|
|
}
|
|
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];
|
|
}
|
|
const __default__$2 = defineComponent({
|
|
name: "ElInput",
|
|
inheritAttrs: false
|
|
});
|
|
const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
...__default__$2,
|
|
props: inputProps,
|
|
emits: inputEmits,
|
|
setup(__props, { expose, emit }) {
|
|
const props = __props;
|
|
const rawAttrs = useAttrs$1();
|
|
const attrs = useAttrs();
|
|
const slots = useSlots();
|
|
const containerKls = 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 = computed(() => [
|
|
nsInput.e("wrapper"),
|
|
nsInput.is("focus", isFocused.value)
|
|
]);
|
|
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 = shallowRef();
|
|
const textarea = shallowRef();
|
|
const hovering = ref(false);
|
|
const passwordVisible = ref(false);
|
|
const countStyle = ref();
|
|
const textareaCalcStyle = shallowRef(props.inputStyle);
|
|
const _ref = computed(() => input.value || textarea.value);
|
|
const { wrapperRef, isFocused, handleFocus, handleBlur } = useFocusController(_ref, {
|
|
beforeFocus() {
|
|
return inputDisabled.value;
|
|
},
|
|
afterBlur() {
|
|
var _a;
|
|
if (props.validateEvent) {
|
|
(_a = elFormItem == null ? void 0 : elFormItem.validate) == null ? void 0 : _a.call(elFormItem, "blur").catch((err) => debugWarn());
|
|
}
|
|
}
|
|
});
|
|
const needStatusIcon = computed(() => {
|
|
var _a;
|
|
return (_a = elForm == null ? void 0 : elForm.statusIcon) != null ? _a : false;
|
|
});
|
|
const validateState = computed(() => (elFormItem == null ? void 0 : elFormItem.validateState) || "");
|
|
const validateIcon = computed(() => validateState.value && ValidateComponentsMap[validateState.value]);
|
|
const passwordIcon = computed(() => passwordVisible.value ? view_default : hide_default);
|
|
const containerStyle = computed(() => [
|
|
rawAttrs.style
|
|
]);
|
|
const textareaStyle = computed(() => [
|
|
props.inputStyle,
|
|
textareaCalcStyle.value,
|
|
{ resize: props.resize }
|
|
]);
|
|
const nativeInputValue = computed(() => isNil(props.modelValue) ? "" : String(props.modelValue));
|
|
const showClear = computed(() => props.clearable && !inputDisabled.value && !props.readonly && !!nativeInputValue.value && (isFocused.value || hovering.value));
|
|
const showPwdVisible = computed(() => props.showPassword && !inputDisabled.value && !!nativeInputValue.value && (!!nativeInputValue.value || isFocused.value));
|
|
const isWordLimitVisible = computed(() => props.showWordLimit && !!props.maxlength && (props.type === "text" || props.type === "textarea") && !inputDisabled.value && !props.readonly && !props.showPassword);
|
|
const textLength = computed(() => nativeInputValue.value.length);
|
|
const inputExceed = computed(() => !!isWordLimitVisible.value && textLength.value > Number(props.maxlength));
|
|
const suffixVisible = computed(() => !!slots.suffix || !!props.suffixIcon || showClear.value || props.showPassword || isWordLimitVisible.value || !!validateState.value && needStatusIcon.value);
|
|
const [recordCursor, setCursor] = useCursor(input);
|
|
useResizeObserver(textarea, (entries) => {
|
|
onceInitSizeTextarea();
|
|
if (!isWordLimitVisible.value || props.resize !== "both")
|
|
return;
|
|
const entry = entries[0];
|
|
const { width } = entry.contentRect;
|
|
countStyle.value = {
|
|
right: `calc(100% - ${width + 15 + 6}px)`
|
|
};
|
|
});
|
|
const resizeTextarea = () => {
|
|
const { type, autosize } = props;
|
|
return;
|
|
};
|
|
const createOnceInitResize = (resizeTextarea2) => {
|
|
let isInit = false;
|
|
return () => {
|
|
var _a;
|
|
if (isInit || !props.autosize)
|
|
return;
|
|
const isElHidden = ((_a = textarea.value) == null ? void 0 : _a.offsetParent) === null;
|
|
if (!isElHidden) {
|
|
resizeTextarea2();
|
|
isInit = true;
|
|
}
|
|
};
|
|
};
|
|
const onceInitSizeTextarea = createOnceInitResize(resizeTextarea);
|
|
const setNativeInputValue = () => {
|
|
const input2 = _ref.value;
|
|
const formatterValue = props.formatter ? props.formatter(nativeInputValue.value) : nativeInputValue.value;
|
|
if (!input2 || input2.value === formatterValue)
|
|
return;
|
|
input2.value = formatterValue;
|
|
};
|
|
const handleInput = async (event) => {
|
|
recordCursor();
|
|
let { value } = event.target;
|
|
if (props.formatter) {
|
|
value = props.parser ? props.parser(value) : value;
|
|
}
|
|
if (isComposing.value)
|
|
return;
|
|
if (value === nativeInputValue.value) {
|
|
setNativeInputValue();
|
|
return;
|
|
}
|
|
emit(UPDATE_MODEL_EVENT, value);
|
|
emit("input", value);
|
|
await nextTick();
|
|
setNativeInputValue();
|
|
setCursor();
|
|
};
|
|
const handleChange = (event) => {
|
|
emit("change", event.target.value);
|
|
};
|
|
const {
|
|
isComposing,
|
|
handleCompositionStart,
|
|
handleCompositionUpdate,
|
|
handleCompositionEnd
|
|
} = useComposition({ emit, afterComposition: handleInput });
|
|
const handlePasswordVisible = () => {
|
|
recordCursor();
|
|
passwordVisible.value = !passwordVisible.value;
|
|
setTimeout(setCursor);
|
|
};
|
|
const focus = () => {
|
|
var _a;
|
|
return (_a = _ref.value) == null ? void 0 : _a.focus();
|
|
};
|
|
const blur = () => {
|
|
var _a;
|
|
return (_a = _ref.value) == null ? void 0 : _a.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 = () => {
|
|
var _a;
|
|
(_a = _ref.value) == null ? void 0 : _a.select();
|
|
};
|
|
const clear = () => {
|
|
emit(UPDATE_MODEL_EVENT, "");
|
|
emit("change", "");
|
|
emit("clear");
|
|
emit("input", "");
|
|
};
|
|
watch(() => props.modelValue, () => {
|
|
var _a;
|
|
nextTick(() => resizeTextarea());
|
|
if (props.validateEvent) {
|
|
(_a = elFormItem == null ? void 0 : elFormItem.validate) == null ? void 0 : _a.call(elFormItem, "change").catch((err) => debugWarn());
|
|
}
|
|
});
|
|
watch(nativeInputValue, () => setNativeInputValue());
|
|
watch(() => props.type, async () => {
|
|
await nextTick();
|
|
setNativeInputValue();
|
|
resizeTextarea();
|
|
});
|
|
expose({
|
|
input,
|
|
textarea,
|
|
ref: _ref,
|
|
textareaStyle,
|
|
autosize: toRef(props, "autosize"),
|
|
isComposing,
|
|
focus,
|
|
blur,
|
|
select,
|
|
clear,
|
|
resizeTextarea
|
|
});
|
|
return (_ctx, _cache) => {
|
|
return openBlock(), createElementBlock("div", {
|
|
class: normalizeClass([
|
|
unref(containerKls),
|
|
{
|
|
[unref(nsInput).bm("group", "append")]: _ctx.$slots.append,
|
|
[unref(nsInput).bm("group", "prepend")]: _ctx.$slots.prepend
|
|
}
|
|
]),
|
|
style: normalizeStyle(unref(containerStyle)),
|
|
onMouseenter: handleMouseEnter,
|
|
onMouseleave: handleMouseLeave
|
|
}, [
|
|
createCommentVNode(" input "),
|
|
_ctx.type !== "textarea" ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
|
|
createCommentVNode(" prepend slot "),
|
|
_ctx.$slots.prepend ? (openBlock(), createElementBlock("div", {
|
|
key: 0,
|
|
class: normalizeClass(unref(nsInput).be("group", "prepend"))
|
|
}, [
|
|
renderSlot(_ctx.$slots, "prepend")
|
|
], 2)) : createCommentVNode("v-if", true),
|
|
createElementVNode("div", {
|
|
ref_key: "wrapperRef",
|
|
ref: wrapperRef,
|
|
class: normalizeClass(unref(wrapperKls))
|
|
}, [
|
|
createCommentVNode(" prefix slot "),
|
|
_ctx.$slots.prefix || _ctx.prefixIcon ? (openBlock(), createElementBlock("span", {
|
|
key: 0,
|
|
class: normalizeClass(unref(nsInput).e("prefix"))
|
|
}, [
|
|
createElementVNode("span", {
|
|
class: normalizeClass(unref(nsInput).e("prefix-inner"))
|
|
}, [
|
|
renderSlot(_ctx.$slots, "prefix"),
|
|
_ctx.prefixIcon ? (openBlock(), createBlock(unref(ElIcon), {
|
|
key: 0,
|
|
class: normalizeClass(unref(nsInput).e("icon"))
|
|
}, {
|
|
default: withCtx(() => [
|
|
(openBlock(), createBlock(resolveDynamicComponent(_ctx.prefixIcon)))
|
|
]),
|
|
_: 1
|
|
}, 8, ["class"])) : createCommentVNode("v-if", true)
|
|
], 2)
|
|
], 2)) : createCommentVNode("v-if", true),
|
|
createElementVNode("input", mergeProps({
|
|
id: unref(inputId),
|
|
ref_key: "input",
|
|
ref: input,
|
|
class: unref(nsInput).e("inner")
|
|
}, unref(attrs), {
|
|
minlength: _ctx.minlength,
|
|
maxlength: _ctx.maxlength,
|
|
type: _ctx.showPassword ? passwordVisible.value ? "text" : "password" : _ctx.type,
|
|
disabled: unref(inputDisabled),
|
|
readonly: _ctx.readonly,
|
|
autocomplete: _ctx.autocomplete,
|
|
tabindex: _ctx.tabindex,
|
|
"aria-label": _ctx.ariaLabel,
|
|
placeholder: _ctx.placeholder,
|
|
style: _ctx.inputStyle,
|
|
form: _ctx.form,
|
|
autofocus: _ctx.autofocus,
|
|
role: _ctx.containerRole,
|
|
onCompositionstart: unref(handleCompositionStart),
|
|
onCompositionupdate: unref(handleCompositionUpdate),
|
|
onCompositionend: unref(handleCompositionEnd),
|
|
onInput: handleInput,
|
|
onChange: handleChange,
|
|
onKeydown: handleKeydown
|
|
}), null, 16, ["id", "minlength", "maxlength", "type", "disabled", "readonly", "autocomplete", "tabindex", "aria-label", "placeholder", "form", "autofocus", "role", "onCompositionstart", "onCompositionupdate", "onCompositionend"]),
|
|
createCommentVNode(" suffix slot "),
|
|
unref(suffixVisible) ? (openBlock(), createElementBlock("span", {
|
|
key: 1,
|
|
class: normalizeClass(unref(nsInput).e("suffix"))
|
|
}, [
|
|
createElementVNode("span", {
|
|
class: normalizeClass(unref(nsInput).e("suffix-inner"))
|
|
}, [
|
|
!unref(showClear) || !unref(showPwdVisible) || !unref(isWordLimitVisible) ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
|
|
renderSlot(_ctx.$slots, "suffix"),
|
|
_ctx.suffixIcon ? (openBlock(), createBlock(unref(ElIcon), {
|
|
key: 0,
|
|
class: normalizeClass(unref(nsInput).e("icon"))
|
|
}, {
|
|
default: withCtx(() => [
|
|
(openBlock(), createBlock(resolveDynamicComponent(_ctx.suffixIcon)))
|
|
]),
|
|
_: 1
|
|
}, 8, ["class"])) : createCommentVNode("v-if", true)
|
|
], 64)) : createCommentVNode("v-if", true),
|
|
unref(showClear) ? (openBlock(), createBlock(unref(ElIcon), {
|
|
key: 1,
|
|
class: normalizeClass([unref(nsInput).e("icon"), unref(nsInput).e("clear")]),
|
|
onMousedown: withModifiers(unref(shared_cjs_prodExports.NOOP), ["prevent"]),
|
|
onClick: clear
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(unref(circle_close_default))
|
|
]),
|
|
_: 1
|
|
}, 8, ["class", "onMousedown"])) : createCommentVNode("v-if", true),
|
|
unref(showPwdVisible) ? (openBlock(), createBlock(unref(ElIcon), {
|
|
key: 2,
|
|
class: normalizeClass([unref(nsInput).e("icon"), unref(nsInput).e("password")]),
|
|
onClick: handlePasswordVisible
|
|
}, {
|
|
default: withCtx(() => [
|
|
(openBlock(), createBlock(resolveDynamicComponent(unref(passwordIcon))))
|
|
]),
|
|
_: 1
|
|
}, 8, ["class"])) : createCommentVNode("v-if", true),
|
|
unref(isWordLimitVisible) ? (openBlock(), createElementBlock("span", {
|
|
key: 3,
|
|
class: normalizeClass(unref(nsInput).e("count"))
|
|
}, [
|
|
createElementVNode("span", {
|
|
class: normalizeClass(unref(nsInput).e("count-inner"))
|
|
}, toDisplayString(unref(textLength)) + " / " + toDisplayString(_ctx.maxlength), 3)
|
|
], 2)) : createCommentVNode("v-if", true),
|
|
unref(validateState) && unref(validateIcon) && unref(needStatusIcon) ? (openBlock(), createBlock(unref(ElIcon), {
|
|
key: 4,
|
|
class: normalizeClass([
|
|
unref(nsInput).e("icon"),
|
|
unref(nsInput).e("validateIcon"),
|
|
unref(nsInput).is("loading", unref(validateState) === "validating")
|
|
])
|
|
}, {
|
|
default: withCtx(() => [
|
|
(openBlock(), createBlock(resolveDynamicComponent(unref(validateIcon))))
|
|
]),
|
|
_: 1
|
|
}, 8, ["class"])) : createCommentVNode("v-if", true)
|
|
], 2)
|
|
], 2)) : createCommentVNode("v-if", true)
|
|
], 2),
|
|
createCommentVNode(" append slot "),
|
|
_ctx.$slots.append ? (openBlock(), createElementBlock("div", {
|
|
key: 1,
|
|
class: normalizeClass(unref(nsInput).be("group", "append"))
|
|
}, [
|
|
renderSlot(_ctx.$slots, "append")
|
|
], 2)) : createCommentVNode("v-if", true)
|
|
], 64)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
|
|
createCommentVNode(" textarea "),
|
|
createElementVNode("textarea", mergeProps({
|
|
id: unref(inputId),
|
|
ref_key: "textarea",
|
|
ref: textarea,
|
|
class: [unref(nsTextarea).e("inner"), unref(nsInput).is("focus", unref(isFocused))]
|
|
}, unref(attrs), {
|
|
minlength: _ctx.minlength,
|
|
maxlength: _ctx.maxlength,
|
|
tabindex: _ctx.tabindex,
|
|
disabled: unref(inputDisabled),
|
|
readonly: _ctx.readonly,
|
|
autocomplete: _ctx.autocomplete,
|
|
style: unref(textareaStyle),
|
|
"aria-label": _ctx.ariaLabel,
|
|
placeholder: _ctx.placeholder,
|
|
form: _ctx.form,
|
|
autofocus: _ctx.autofocus,
|
|
rows: _ctx.rows,
|
|
role: _ctx.containerRole,
|
|
onCompositionstart: unref(handleCompositionStart),
|
|
onCompositionupdate: unref(handleCompositionUpdate),
|
|
onCompositionend: unref(handleCompositionEnd),
|
|
onInput: handleInput,
|
|
onFocus: unref(handleFocus),
|
|
onBlur: unref(handleBlur),
|
|
onChange: handleChange,
|
|
onKeydown: handleKeydown
|
|
}), null, 16, ["id", "minlength", "maxlength", "tabindex", "disabled", "readonly", "autocomplete", "aria-label", "placeholder", "form", "autofocus", "rows", "role", "onCompositionstart", "onCompositionupdate", "onCompositionend", "onFocus", "onBlur"]),
|
|
unref(isWordLimitVisible) ? (openBlock(), createElementBlock("span", {
|
|
key: 0,
|
|
style: normalizeStyle(countStyle.value),
|
|
class: normalizeClass(unref(nsInput).e("count"))
|
|
}, toDisplayString(unref(textLength)) + " / " + toDisplayString(_ctx.maxlength), 7)) : createCommentVNode("v-if", true)
|
|
], 64))
|
|
], 38);
|
|
};
|
|
}
|
|
});
|
|
var Input = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__file", "input.vue"]]);
|
|
const ElInput = withInstall(Input);
|
|
const buttonGroupContextKey = Symbol("buttonGroupContextKey");
|
|
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"
|
|
}, computed(() => props.type === "text"));
|
|
const buttonGroupContext = inject(buttonGroupContextKey, void 0);
|
|
const globalConfig = useGlobalConfig("button");
|
|
const { form } = useFormItem();
|
|
const _size = useFormSize(computed(() => buttonGroupContext == null ? void 0 : buttonGroupContext.size));
|
|
const _disabled = useFormDisabled();
|
|
const _ref = ref();
|
|
const slots = useSlots();
|
|
const _type = computed(() => props.type || (buttonGroupContext == null ? void 0 : buttonGroupContext.type) || "");
|
|
const autoInsertSpace = computed(() => {
|
|
var _a, _b, _c;
|
|
return (_c = (_b = props.autoInsertSpace) != null ? _b : (_a = globalConfig.value) == null ? void 0 : _a.autoInsertSpace) != null ? _c : false;
|
|
});
|
|
const _props = 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 = computed(() => {
|
|
var _a;
|
|
const defaultSlot = (_a = slots.default) == null ? void 0 : _a.call(slots);
|
|
if (autoInsertSpace.value && (defaultSlot == null ? void 0 : defaultSlot.length) === 1) {
|
|
const slot = defaultSlot[0];
|
|
if ((slot == null ? void 0 : slot.type) === Text) {
|
|
const text = slot.children;
|
|
return new RegExp("^\\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 == null ? void 0 : form.resetFields();
|
|
}
|
|
emit("click", evt);
|
|
};
|
|
return {
|
|
_disabled,
|
|
_size,
|
|
_type,
|
|
_ref,
|
|
_props,
|
|
shouldAddSpace,
|
|
handleClick
|
|
};
|
|
};
|
|
const buttonTypes = [
|
|
"default",
|
|
"primary",
|
|
"success",
|
|
"warning",
|
|
"info",
|
|
"danger",
|
|
"text",
|
|
""
|
|
];
|
|
const buttonNativeTypes = ["button", "submit", "reset"];
|
|
const buttonProps = buildProps({
|
|
size: useSizeProp,
|
|
disabled: Boolean,
|
|
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: Boolean,
|
|
text: Boolean,
|
|
link: Boolean,
|
|
bg: Boolean,
|
|
autofocus: Boolean,
|
|
round: Boolean,
|
|
circle: Boolean,
|
|
color: String,
|
|
dark: Boolean,
|
|
autoInsertSpace: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
tag: {
|
|
type: definePropType([String, Object]),
|
|
default: "button"
|
|
}
|
|
});
|
|
const buttonEmits = {
|
|
click: (evt) => evt instanceof MouseEvent
|
|
};
|
|
function bound01(n, max) {
|
|
if (isOnePointZero(n)) {
|
|
n = "100%";
|
|
}
|
|
var 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;
|
|
}
|
|
function clamp01(val) {
|
|
return Math.min(1, Math.max(0, val));
|
|
}
|
|
function isOnePointZero(n) {
|
|
return typeof n === "string" && n.indexOf(".") !== -1 && parseFloat(n) === 1;
|
|
}
|
|
function isPercentage(n) {
|
|
return typeof n === "string" && n.indexOf("%") !== -1;
|
|
}
|
|
function boundAlpha(a) {
|
|
a = parseFloat(a);
|
|
if (isNaN(a) || a < 0 || a > 1) {
|
|
a = 1;
|
|
}
|
|
return a;
|
|
}
|
|
function convertToPercentage(n) {
|
|
if (n <= 1) {
|
|
return "".concat(Number(n) * 100, "%");
|
|
}
|
|
return n;
|
|
}
|
|
function pad2(c) {
|
|
return c.length === 1 ? "0" + c : String(c);
|
|
}
|
|
function rgbToRgb(r, g, b) {
|
|
return {
|
|
r: bound01(r, 255) * 255,
|
|
g: bound01(g, 255) * 255,
|
|
b: bound01(b, 255) * 255
|
|
};
|
|
}
|
|
function rgbToHsl(r, g, b) {
|
|
r = bound01(r, 255);
|
|
g = bound01(g, 255);
|
|
b = bound01(b, 255);
|
|
var max = Math.max(r, g, b);
|
|
var min = Math.min(r, g, b);
|
|
var h = 0;
|
|
var s = 0;
|
|
var l = (max + min) / 2;
|
|
if (max === min) {
|
|
s = 0;
|
|
h = 0;
|
|
} else {
|
|
var d = max - min;
|
|
s = l > 0.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;
|
|
}
|
|
h /= 6;
|
|
}
|
|
return { h, s, l };
|
|
}
|
|
function hue2rgb(p, q2, t) {
|
|
if (t < 0) {
|
|
t += 1;
|
|
}
|
|
if (t > 1) {
|
|
t -= 1;
|
|
}
|
|
if (t < 1 / 6) {
|
|
return p + (q2 - p) * (6 * t);
|
|
}
|
|
if (t < 1 / 2) {
|
|
return q2;
|
|
}
|
|
if (t < 2 / 3) {
|
|
return p + (q2 - p) * (2 / 3 - t) * 6;
|
|
}
|
|
return p;
|
|
}
|
|
function hslToRgb(h, s, l) {
|
|
var r;
|
|
var g;
|
|
var b;
|
|
h = bound01(h, 360);
|
|
s = bound01(s, 100);
|
|
l = bound01(l, 100);
|
|
if (s === 0) {
|
|
g = l;
|
|
b = l;
|
|
r = l;
|
|
} else {
|
|
var q2 = l < 0.5 ? l * (1 + s) : l + s - l * s;
|
|
var p = 2 * l - q2;
|
|
r = hue2rgb(p, q2, h + 1 / 3);
|
|
g = hue2rgb(p, q2, h);
|
|
b = hue2rgb(p, q2, h - 1 / 3);
|
|
}
|
|
return { r: r * 255, g: g * 255, b: b * 255 };
|
|
}
|
|
function rgbToHsv(r, g, b) {
|
|
r = bound01(r, 255);
|
|
g = bound01(g, 255);
|
|
b = bound01(b, 255);
|
|
var max = Math.max(r, g, b);
|
|
var min = Math.min(r, g, b);
|
|
var h = 0;
|
|
var v = max;
|
|
var d = max - min;
|
|
var 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;
|
|
}
|
|
h /= 6;
|
|
}
|
|
return { h, s, v };
|
|
}
|
|
function hsvToRgb(h, s, v) {
|
|
h = bound01(h, 360) * 6;
|
|
s = bound01(s, 100);
|
|
v = bound01(v, 100);
|
|
var i = Math.floor(h);
|
|
var f = h - i;
|
|
var p = v * (1 - s);
|
|
var q2 = v * (1 - f * s);
|
|
var t = v * (1 - (1 - f) * s);
|
|
var mod = i % 6;
|
|
var r = [v, q2, p, p, t, v][mod];
|
|
var g = [t, v, v, q2, p, p][mod];
|
|
var b = [p, p, t, v, v, q2][mod];
|
|
return { r: r * 255, g: g * 255, b: b * 255 };
|
|
}
|
|
function rgbToHex(r, g, b, allow3Char) {
|
|
var 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("");
|
|
}
|
|
function rgbaToHex(r, g, b, a, allow4Char) {
|
|
var 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("");
|
|
}
|
|
function convertDecimalToHex(d) {
|
|
return Math.round(parseFloat(d) * 255).toString(16);
|
|
}
|
|
function convertHexToDecimal(h) {
|
|
return parseIntFromHex(h) / 255;
|
|
}
|
|
function parseIntFromHex(val) {
|
|
return parseInt(val, 16);
|
|
}
|
|
function numberInputToObject(color) {
|
|
return {
|
|
r: color >> 16,
|
|
g: (color & 65280) >> 8,
|
|
b: color & 255
|
|
};
|
|
}
|
|
var 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"
|
|
};
|
|
function inputToRGB(color) {
|
|
var rgb = { r: 0, g: 0, b: 0 };
|
|
var a = 1;
|
|
var s = null;
|
|
var v = null;
|
|
var l = null;
|
|
var ok = false;
|
|
var 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";
|
|
}
|
|
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
|
|
};
|
|
}
|
|
var CSS_INTEGER = "[-\\+]?\\d+%?";
|
|
var CSS_NUMBER = "[-\\+]?\\d*\\.\\d+%?";
|
|
var CSS_UNIT = "(?:".concat(CSS_NUMBER, ")|(?:").concat(CSS_INTEGER, ")");
|
|
var PERMISSIVE_MATCH3 = "[\\s|\\(]+(".concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")\\s*\\)?");
|
|
var PERMISSIVE_MATCH4 = "[\\s|\\(]+(".concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")\\s*\\)?");
|
|
var 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),
|
|
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})$/
|
|
};
|
|
function stringInputToObject(color) {
|
|
color = color.trim().toLowerCase();
|
|
if (color.length === 0) {
|
|
return false;
|
|
}
|
|
var 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" };
|
|
}
|
|
var 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.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;
|
|
}
|
|
function isValidCSSUnit(color) {
|
|
return Boolean(matchers.CSS_UNIT.exec(String(color)));
|
|
}
|
|
var TinyColor = (
|
|
/** @class */
|
|
function() {
|
|
function TinyColor2(color, opts) {
|
|
if (color === void 0) {
|
|
color = "";
|
|
}
|
|
if (opts === void 0) {
|
|
opts = {};
|
|
}
|
|
var _a;
|
|
if (color instanceof TinyColor2) {
|
|
return color;
|
|
}
|
|
if (typeof color === "number") {
|
|
color = numberInputToObject(color);
|
|
}
|
|
this.originalInput = color;
|
|
var 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 = (_a = opts.format) !== null && _a !== void 0 ? _a : 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;
|
|
}
|
|
TinyColor2.prototype.isDark = function() {
|
|
return this.getBrightness() < 128;
|
|
};
|
|
TinyColor2.prototype.isLight = function() {
|
|
return !this.isDark();
|
|
};
|
|
TinyColor2.prototype.getBrightness = function() {
|
|
var rgb = this.toRgb();
|
|
return (rgb.r * 299 + rgb.g * 587 + rgb.b * 114) / 1e3;
|
|
};
|
|
TinyColor2.prototype.getLuminance = function() {
|
|
var rgb = this.toRgb();
|
|
var R2;
|
|
var G2;
|
|
var B2;
|
|
var RsRGB = rgb.r / 255;
|
|
var GsRGB = rgb.g / 255;
|
|
var BsRGB = rgb.b / 255;
|
|
if (RsRGB <= 0.03928) {
|
|
R2 = RsRGB / 12.92;
|
|
} else {
|
|
R2 = Math.pow((RsRGB + 0.055) / 1.055, 2.4);
|
|
}
|
|
if (GsRGB <= 0.03928) {
|
|
G2 = GsRGB / 12.92;
|
|
} else {
|
|
G2 = Math.pow((GsRGB + 0.055) / 1.055, 2.4);
|
|
}
|
|
if (BsRGB <= 0.03928) {
|
|
B2 = BsRGB / 12.92;
|
|
} else {
|
|
B2 = Math.pow((BsRGB + 0.055) / 1.055, 2.4);
|
|
}
|
|
return 0.2126 * R2 + 0.7152 * G2 + 0.0722 * B2;
|
|
};
|
|
TinyColor2.prototype.getAlpha = function() {
|
|
return this.a;
|
|
};
|
|
TinyColor2.prototype.setAlpha = function(alpha) {
|
|
this.a = boundAlpha(alpha);
|
|
this.roundA = Math.round(100 * this.a) / 100;
|
|
return this;
|
|
};
|
|
TinyColor2.prototype.isMonochrome = function() {
|
|
var s = this.toHsl().s;
|
|
return s === 0;
|
|
};
|
|
TinyColor2.prototype.toHsv = function() {
|
|
var hsv = rgbToHsv(this.r, this.g, this.b);
|
|
return { h: hsv.h * 360, s: hsv.s, v: hsv.v, a: this.a };
|
|
};
|
|
TinyColor2.prototype.toHsvString = function() {
|
|
var hsv = rgbToHsv(this.r, this.g, this.b);
|
|
var h = Math.round(hsv.h * 360);
|
|
var s = Math.round(hsv.s * 100);
|
|
var v = Math.round(hsv.v * 100);
|
|
return this.a === 1 ? "hsv(".concat(h, ", ").concat(s, "%, ").concat(v, "%)") : "hsva(".concat(h, ", ").concat(s, "%, ").concat(v, "%, ").concat(this.roundA, ")");
|
|
};
|
|
TinyColor2.prototype.toHsl = function() {
|
|
var hsl = rgbToHsl(this.r, this.g, this.b);
|
|
return { h: hsl.h * 360, s: hsl.s, l: hsl.l, a: this.a };
|
|
};
|
|
TinyColor2.prototype.toHslString = function() {
|
|
var hsl = rgbToHsl(this.r, this.g, this.b);
|
|
var h = Math.round(hsl.h * 360);
|
|
var s = Math.round(hsl.s * 100);
|
|
var l = Math.round(hsl.l * 100);
|
|
return this.a === 1 ? "hsl(".concat(h, ", ").concat(s, "%, ").concat(l, "%)") : "hsla(".concat(h, ", ").concat(s, "%, ").concat(l, "%, ").concat(this.roundA, ")");
|
|
};
|
|
TinyColor2.prototype.toHex = function(allow3Char) {
|
|
if (allow3Char === void 0) {
|
|
allow3Char = false;
|
|
}
|
|
return rgbToHex(this.r, this.g, this.b, allow3Char);
|
|
};
|
|
TinyColor2.prototype.toHexString = function(allow3Char) {
|
|
if (allow3Char === void 0) {
|
|
allow3Char = false;
|
|
}
|
|
return "#" + this.toHex(allow3Char);
|
|
};
|
|
TinyColor2.prototype.toHex8 = function(allow4Char) {
|
|
if (allow4Char === void 0) {
|
|
allow4Char = false;
|
|
}
|
|
return rgbaToHex(this.r, this.g, this.b, this.a, allow4Char);
|
|
};
|
|
TinyColor2.prototype.toHex8String = function(allow4Char) {
|
|
if (allow4Char === void 0) {
|
|
allow4Char = false;
|
|
}
|
|
return "#" + this.toHex8(allow4Char);
|
|
};
|
|
TinyColor2.prototype.toHexShortString = function(allowShortChar) {
|
|
if (allowShortChar === void 0) {
|
|
allowShortChar = false;
|
|
}
|
|
return this.a === 1 ? this.toHexString(allowShortChar) : this.toHex8String(allowShortChar);
|
|
};
|
|
TinyColor2.prototype.toRgb = function() {
|
|
return {
|
|
r: Math.round(this.r),
|
|
g: Math.round(this.g),
|
|
b: Math.round(this.b),
|
|
a: this.a
|
|
};
|
|
};
|
|
TinyColor2.prototype.toRgbString = function() {
|
|
var r = Math.round(this.r);
|
|
var g = Math.round(this.g);
|
|
var b = Math.round(this.b);
|
|
return this.a === 1 ? "rgb(".concat(r, ", ").concat(g, ", ").concat(b, ")") : "rgba(".concat(r, ", ").concat(g, ", ").concat(b, ", ").concat(this.roundA, ")");
|
|
};
|
|
TinyColor2.prototype.toPercentageRgb = function() {
|
|
var fmt = function(x) {
|
|
return "".concat(Math.round(bound01(x, 255) * 100), "%");
|
|
};
|
|
return {
|
|
r: fmt(this.r),
|
|
g: fmt(this.g),
|
|
b: fmt(this.b),
|
|
a: this.a
|
|
};
|
|
};
|
|
TinyColor2.prototype.toPercentageRgbString = function() {
|
|
var rnd = function(x) {
|
|
return Math.round(bound01(x, 255) * 100);
|
|
};
|
|
return this.a === 1 ? "rgb(".concat(rnd(this.r), "%, ").concat(rnd(this.g), "%, ").concat(rnd(this.b), "%)") : "rgba(".concat(rnd(this.r), "%, ").concat(rnd(this.g), "%, ").concat(rnd(this.b), "%, ").concat(this.roundA, ")");
|
|
};
|
|
TinyColor2.prototype.toName = function() {
|
|
if (this.a === 0) {
|
|
return "transparent";
|
|
}
|
|
if (this.a < 1) {
|
|
return false;
|
|
}
|
|
var hex = "#" + rgbToHex(this.r, this.g, this.b, false);
|
|
for (var _i = 0, _a = Object.entries(names); _i < _a.length; _i++) {
|
|
var _b = _a[_i], key = _b[0], value = _b[1];
|
|
if (hex === value) {
|
|
return key;
|
|
}
|
|
}
|
|
return false;
|
|
};
|
|
TinyColor2.prototype.toString = function(format) {
|
|
var formatSet = Boolean(format);
|
|
format = format !== null && format !== void 0 ? format : this.format;
|
|
var formattedString = false;
|
|
var hasAlpha = this.a < 1 && this.a >= 0;
|
|
var needsAlphaFormat = !formatSet && hasAlpha && (format.startsWith("hex") || format === "name");
|
|
if (needsAlphaFormat) {
|
|
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();
|
|
}
|
|
return formattedString || this.toHexString();
|
|
};
|
|
TinyColor2.prototype.toNumber = function() {
|
|
return (Math.round(this.r) << 16) + (Math.round(this.g) << 8) + Math.round(this.b);
|
|
};
|
|
TinyColor2.prototype.clone = function() {
|
|
return new TinyColor2(this.toString());
|
|
};
|
|
TinyColor2.prototype.lighten = function(amount) {
|
|
if (amount === void 0) {
|
|
amount = 10;
|
|
}
|
|
var hsl = this.toHsl();
|
|
hsl.l += amount / 100;
|
|
hsl.l = clamp01(hsl.l);
|
|
return new TinyColor2(hsl);
|
|
};
|
|
TinyColor2.prototype.brighten = function(amount) {
|
|
if (amount === void 0) {
|
|
amount = 10;
|
|
}
|
|
var 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 TinyColor2(rgb);
|
|
};
|
|
TinyColor2.prototype.darken = function(amount) {
|
|
if (amount === void 0) {
|
|
amount = 10;
|
|
}
|
|
var hsl = this.toHsl();
|
|
hsl.l -= amount / 100;
|
|
hsl.l = clamp01(hsl.l);
|
|
return new TinyColor2(hsl);
|
|
};
|
|
TinyColor2.prototype.tint = function(amount) {
|
|
if (amount === void 0) {
|
|
amount = 10;
|
|
}
|
|
return this.mix("white", amount);
|
|
};
|
|
TinyColor2.prototype.shade = function(amount) {
|
|
if (amount === void 0) {
|
|
amount = 10;
|
|
}
|
|
return this.mix("black", amount);
|
|
};
|
|
TinyColor2.prototype.desaturate = function(amount) {
|
|
if (amount === void 0) {
|
|
amount = 10;
|
|
}
|
|
var hsl = this.toHsl();
|
|
hsl.s -= amount / 100;
|
|
hsl.s = clamp01(hsl.s);
|
|
return new TinyColor2(hsl);
|
|
};
|
|
TinyColor2.prototype.saturate = function(amount) {
|
|
if (amount === void 0) {
|
|
amount = 10;
|
|
}
|
|
var hsl = this.toHsl();
|
|
hsl.s += amount / 100;
|
|
hsl.s = clamp01(hsl.s);
|
|
return new TinyColor2(hsl);
|
|
};
|
|
TinyColor2.prototype.greyscale = function() {
|
|
return this.desaturate(100);
|
|
};
|
|
TinyColor2.prototype.spin = function(amount) {
|
|
var hsl = this.toHsl();
|
|
var hue = (hsl.h + amount) % 360;
|
|
hsl.h = hue < 0 ? 360 + hue : hue;
|
|
return new TinyColor2(hsl);
|
|
};
|
|
TinyColor2.prototype.mix = function(color, amount) {
|
|
if (amount === void 0) {
|
|
amount = 50;
|
|
}
|
|
var rgb1 = this.toRgb();
|
|
var rgb2 = new TinyColor2(color).toRgb();
|
|
var p = amount / 100;
|
|
var rgba = {
|
|
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
|
|
};
|
|
return new TinyColor2(rgba);
|
|
};
|
|
TinyColor2.prototype.analogous = function(results, slices) {
|
|
if (results === void 0) {
|
|
results = 6;
|
|
}
|
|
if (slices === void 0) {
|
|
slices = 30;
|
|
}
|
|
var hsl = this.toHsl();
|
|
var part = 360 / slices;
|
|
var ret = [this];
|
|
for (hsl.h = (hsl.h - (part * results >> 1) + 720) % 360; --results; ) {
|
|
hsl.h = (hsl.h + part) % 360;
|
|
ret.push(new TinyColor2(hsl));
|
|
}
|
|
return ret;
|
|
};
|
|
TinyColor2.prototype.complement = function() {
|
|
var hsl = this.toHsl();
|
|
hsl.h = (hsl.h + 180) % 360;
|
|
return new TinyColor2(hsl);
|
|
};
|
|
TinyColor2.prototype.monochromatic = function(results) {
|
|
if (results === void 0) {
|
|
results = 6;
|
|
}
|
|
var hsv = this.toHsv();
|
|
var h = hsv.h;
|
|
var s = hsv.s;
|
|
var v = hsv.v;
|
|
var res = [];
|
|
var modification = 1 / results;
|
|
while (results--) {
|
|
res.push(new TinyColor2({ h, s, v }));
|
|
v = (v + modification) % 1;
|
|
}
|
|
return res;
|
|
};
|
|
TinyColor2.prototype.splitcomplement = function() {
|
|
var hsl = this.toHsl();
|
|
var h = hsl.h;
|
|
return [
|
|
this,
|
|
new TinyColor2({ h: (h + 72) % 360, s: hsl.s, l: hsl.l }),
|
|
new TinyColor2({ h: (h + 216) % 360, s: hsl.s, l: hsl.l })
|
|
];
|
|
};
|
|
TinyColor2.prototype.onBackground = function(background) {
|
|
var fg = this.toRgb();
|
|
var bg = new TinyColor2(background).toRgb();
|
|
var alpha = fg.a + bg.a * (1 - fg.a);
|
|
return new TinyColor2({
|
|
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
|
|
});
|
|
};
|
|
TinyColor2.prototype.triad = function() {
|
|
return this.polyad(3);
|
|
};
|
|
TinyColor2.prototype.tetrad = function() {
|
|
return this.polyad(4);
|
|
};
|
|
TinyColor2.prototype.polyad = function(n) {
|
|
var hsl = this.toHsl();
|
|
var h = hsl.h;
|
|
var result = [this];
|
|
var increment = 360 / n;
|
|
for (var i = 1; i < n; i++) {
|
|
result.push(new TinyColor2({ h: (h + i * increment) % 360, s: hsl.s, l: hsl.l }));
|
|
}
|
|
return result;
|
|
};
|
|
TinyColor2.prototype.equals = function(color) {
|
|
return this.toRgbString() === new TinyColor2(color).toRgbString();
|
|
};
|
|
return TinyColor2;
|
|
}()
|
|
);
|
|
function darken(color, amount = 20) {
|
|
return color.mix("#141414", amount).toString();
|
|
}
|
|
function useButtonCustomStyle(props) {
|
|
const _disabled = useFormDisabled();
|
|
const ns = useNamespace("button");
|
|
return computed(() => {
|
|
let styles = {};
|
|
let buttonColor = props.color;
|
|
if (buttonColor) {
|
|
const match = buttonColor.match(/var\((.*?)\)/);
|
|
if (match) {
|
|
buttonColor = (void 0).getComputedStyle((void 0).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 {
|
|
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;
|
|
});
|
|
}
|
|
const __default__$1 = defineComponent({
|
|
name: "ElButton"
|
|
});
|
|
const _sfc_main$1 = /* @__PURE__ */ defineComponent({
|
|
...__default__$1,
|
|
props: buttonProps,
|
|
emits: buttonEmits,
|
|
setup(__props, { expose, emit }) {
|
|
const props = __props;
|
|
const buttonStyle = useButtonCustomStyle(props);
|
|
const ns = useNamespace("button");
|
|
const { _ref, _size, _type, _disabled, _props, shouldAddSpace, handleClick } = useButton(props, emit);
|
|
const buttonKls = computed(() => [
|
|
ns.b(),
|
|
ns.m(_type.value),
|
|
ns.m(_size.value),
|
|
ns.is("disabled", _disabled.value),
|
|
ns.is("loading", props.loading),
|
|
ns.is("plain", props.plain),
|
|
ns.is("round", props.round),
|
|
ns.is("circle", props.circle),
|
|
ns.is("text", props.text),
|
|
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 openBlock(), createBlock(resolveDynamicComponent(_ctx.tag), mergeProps({
|
|
ref_key: "_ref",
|
|
ref: _ref
|
|
}, unref(_props), {
|
|
class: unref(buttonKls),
|
|
style: unref(buttonStyle),
|
|
onClick: unref(handleClick)
|
|
}), {
|
|
default: withCtx(() => [
|
|
_ctx.loading ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
|
|
_ctx.$slots.loading ? renderSlot(_ctx.$slots, "loading", { key: 0 }) : (openBlock(), createBlock(unref(ElIcon), {
|
|
key: 1,
|
|
class: normalizeClass(unref(ns).is("loading"))
|
|
}, {
|
|
default: withCtx(() => [
|
|
(openBlock(), createBlock(resolveDynamicComponent(_ctx.loadingIcon)))
|
|
]),
|
|
_: 1
|
|
}, 8, ["class"]))
|
|
], 64)) : _ctx.icon || _ctx.$slots.icon ? (openBlock(), createBlock(unref(ElIcon), { key: 1 }, {
|
|
default: withCtx(() => [
|
|
_ctx.icon ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.icon), { key: 0 })) : renderSlot(_ctx.$slots, "icon", { key: 1 })
|
|
]),
|
|
_: 3
|
|
})) : createCommentVNode("v-if", true),
|
|
_ctx.$slots.default ? (openBlock(), createElementBlock("span", {
|
|
key: 2,
|
|
class: normalizeClass({ [unref(ns).em("text", "expand")]: unref(shouldAddSpace) })
|
|
}, [
|
|
renderSlot(_ctx.$slots, "default")
|
|
], 2)) : createCommentVNode("v-if", true)
|
|
]),
|
|
_: 3
|
|
}, 16, ["class", "style", "onClick"]);
|
|
};
|
|
}
|
|
});
|
|
var Button = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__file", "button.vue"]]);
|
|
const buttonGroupProps = {
|
|
size: buttonProps.size,
|
|
type: buttonProps.type
|
|
};
|
|
const __default__ = defineComponent({
|
|
name: "ElButtonGroup"
|
|
});
|
|
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
...__default__,
|
|
props: buttonGroupProps,
|
|
setup(__props) {
|
|
const props = __props;
|
|
provide(buttonGroupContextKey, reactive({
|
|
size: toRef(props, "size"),
|
|
type: toRef(props, "type")
|
|
}));
|
|
const ns = useNamespace("button");
|
|
return (_ctx, _cache) => {
|
|
return openBlock(), createElementBlock("div", {
|
|
class: normalizeClass(unref(ns).b("group"))
|
|
}, [
|
|
renderSlot(_ctx.$slots, "default")
|
|
], 2);
|
|
};
|
|
}
|
|
});
|
|
var ButtonGroup = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "button-group.vue"]]);
|
|
const ElButton = withInstall(Button, {
|
|
ButtonGroup
|
|
});
|
|
withNoopInstall(ButtonGroup);
|
|
|
|
export { ElTooltip as E, TOOLTIP_INJECTION_KEY as T, useTooltipTriggerProps as a, ElInput as b, ElButton as c, useAriaProps as d, Ee as e, useFormItem as f, useFocusController as g, useFormSize as h, useAttrs as i, flatten as j, isLength as k, arrayPush as l, useResizeObserver as m, useEventListener as n, onClickOutside as o, useFormDisabled as p, unrefElement as q, isArguments as r, isIndex as s, useTooltipContentProps as u };
|
|
//# sourceMappingURL=el-button-D4-ax6pg.mjs.map
|