@das-fed/ui 1.1.4 → 6.3.0-beta.1

package/packages/components/calendar/index.js

@@ -1,3146 +1,7 @@
-import { withInstall as withInstall$1 } from '@das-fed/utils';
-import { defineComponent, openBlock, createElementBlock, createElementVNode, warn, watch, unref, inject, ref, computed, isRef, getCurrentInstance, provide, renderSlot, mergeProps, useSlots, Text, createBlock, resolveDynamicComponent, withCtx, Fragment, normalizeClass, createCommentVNode, reactive, toRef, renderList, toDisplayString, createVNode, createTextVNode, createSlots, normalizeProps, useCssVars, useAttrs, nextTick, onMounted, normalizeStyle, withDirectives, guardReactiveProps, pushScopeId, popScopeId } from 'vue';
-import { vScrollbar } from '@das-fed/ui';
-import { useModelValue } from '@das-fed/utils/vue';
-import { setThemeRule } from '@das-fed/web';
-
-/**
-* @vue/shared v3.4.21
-* (c) 2018-present Yuxi (Evan) You and Vue contributors
-* @license MIT
-**/
-
-!!(process.env.NODE_ENV !== "production") ? Object.freeze({}) : {};
-!!(process.env.NODE_ENV !== "production") ? Object.freeze([]) : [];
-const NOOP = () => {
-};
-const hasOwnProperty$4 = Object.prototype.hasOwnProperty;
-const hasOwn = (val, key) => hasOwnProperty$4.call(val, key);
-const isArray$1 = Array.isArray;
-const isDate = (val) => toTypeString(val) === "[object Date]";
-const isString = (val) => typeof val === "string";
-const isObject$1 = (val) => val !== null && typeof val === "object";
-const objectToString$1 = Object.prototype.toString;
-const toTypeString = (value) => objectToString$1.call(value);
-
-/** Detect free variable `global` from Node.js. */
-var freeGlobal = typeof global == 'object' && global && global.Object === Object && global;
-
-/** Detect free variable `self`. */
-var freeSelf = typeof self == 'object' && self && self.Object === Object && self;
-
-/** Used as a reference to the global object. */
-var root = freeGlobal || freeSelf || Function('return this')();
-
-/** Built-in value references. */
-var Symbol$1 = root.Symbol;
-
-/** Used for built-in method references. */
-var objectProto$4 = Object.prototype;
-
-/** Used to check objects for own properties. */
-var hasOwnProperty$3 = objectProto$4.hasOwnProperty;
-
-/**
- * Used to resolve the
- * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
- * of values.
- */
-var nativeObjectToString$1 = objectProto$4.toString;
-
-/** Built-in value references. */
-var symToStringTag$1 = Symbol$1 ? Symbol$1.toStringTag : undefined;
-
-/**
- * A specialized version of `baseGetTag` which ignores `Symbol.toStringTag` values.
- *
- * @private
- * @param {*} value The value to query.
- * @returns {string} Returns the raw `toStringTag`.
- */
-function getRawTag(value) {
-  var isOwn = hasOwnProperty$3.call(value, symToStringTag$1),
-      tag = value[symToStringTag$1];
-
-  try {
-    value[symToStringTag$1] = undefined;
-    var unmasked = true;
-  } catch (e) {}
-
-  var result = nativeObjectToString$1.call(value);
-  if (unmasked) {
-    if (isOwn) {
-      value[symToStringTag$1] = tag;
-    } else {
-      delete value[symToStringTag$1];
-    }
-  }
-  return result;
-}
-
-/** Used for built-in method references. */
-var objectProto$3 = Object.prototype;
-
-/**
- * Used to resolve the
- * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
- * of values.
- */
-var nativeObjectToString = objectProto$3.toString;
-
-/**
- * Converts `value` to a string using `Object.prototype.toString`.
- *
- * @private
- * @param {*} value The value to convert.
- * @returns {string} Returns the converted string.
- */
-function objectToString(value) {
-  return nativeObjectToString.call(value);
-}
-
-/** `Object#toString` result references. */
-var nullTag = '[object Null]',
-    undefinedTag = '[object Undefined]';
-
-/** Built-in value references. */
-var symToStringTag = Symbol$1 ? Symbol$1.toStringTag : undefined;
-
-/**
- * The base implementation of `getTag` without fallbacks for buggy environments.
- *
- * @private
- * @param {*} value The value to query.
- * @returns {string} Returns the `toStringTag`.
- */
-function baseGetTag(value) {
-  if (value == null) {
-    return value === undefined ? undefinedTag : nullTag;
-  }
-  return (symToStringTag && symToStringTag in Object(value))
-    ? getRawTag(value)
-    : objectToString(value);
-}
-
-/**
- * Checks if `value` is object-like. A value is object-like if it's not `null`
- * and has a `typeof` result of "object".
- *
- * @static
- * @memberOf _
- * @since 4.0.0
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is object-like, else `false`.
- * @example
- *
- * _.isObjectLike({});
- * // => true
- *
- * _.isObjectLike([1, 2, 3]);
- * // => true
- *
- * _.isObjectLike(_.noop);
- * // => false
- *
- * _.isObjectLike(null);
- * // => false
- */
-function isObjectLike(value) {
-  return value != null && typeof value == 'object';
-}
-
-/** `Object#toString` result references. */
-var symbolTag = '[object Symbol]';
-
-/**
- * Checks if `value` is classified as a `Symbol` primitive or object.
- *
- * @static
- * @memberOf _
- * @since 4.0.0
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is a symbol, else `false`.
- * @example
- *
- * _.isSymbol(Symbol.iterator);
- * // => true
- *
- * _.isSymbol('abc');
- * // => false
- */
-function isSymbol(value) {
-  return typeof value == 'symbol' ||
-    (isObjectLike(value) && baseGetTag(value) == symbolTag);
-}
-
-/**
- * A specialized version of `_.map` for arrays without support for iteratee
- * shorthands.
- *
- * @private
- * @param {Array} [array] The array to iterate over.
- * @param {Function} iteratee The function invoked per iteration.
- * @returns {Array} Returns the new mapped array.
- */
-function arrayMap(array, iteratee) {
-  var index = -1,
-      length = array == null ? 0 : array.length,
-      result = Array(length);
-
-  while (++index < length) {
-    result[index] = iteratee(array[index], index, array);
-  }
-  return result;
-}
-
-/**
- * Checks if `value` is classified as an `Array` object.
- *
- * @static
- * @memberOf _
- * @since 0.1.0
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is an array, else `false`.
- * @example
- *
- * _.isArray([1, 2, 3]);
- * // => true
- *
- * _.isArray(document.body.children);
- * // => false
- *
- * _.isArray('abc');
- * // => false
- *
- * _.isArray(_.noop);
- * // => false
- */
-var isArray = Array.isArray;
-
-/** Used as references for various `Number` constants. */
-var INFINITY$1 = 1 / 0;
-
-/** Used to convert symbols to primitives and strings. */
-var symbolProto = Symbol$1 ? Symbol$1.prototype : undefined,
-    symbolToString = symbolProto ? symbolProto.toString : undefined;
-
-/**
- * The base implementation of `_.toString` which doesn't convert nullish
- * values to empty strings.
- *
- * @private
- * @param {*} value The value to process.
- * @returns {string} Returns the string.
- */
-function baseToString(value) {
-  // Exit early for strings to avoid a performance hit in some environments.
-  if (typeof value == 'string') {
-    return value;
-  }
-  if (isArray(value)) {
-    // Recursively convert values (susceptible to call stack limits).
-    return arrayMap(value, baseToString) + '';
-  }
-  if (isSymbol(value)) {
-    return symbolToString ? symbolToString.call(value) : '';
-  }
-  var result = (value + '');
-  return (result == '0' && (1 / value) == -INFINITY$1) ? '-0' : result;
-}
-
-/**
- * Checks if `value` is the
- * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)
- * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)
- *
- * @static
- * @memberOf _
- * @since 0.1.0
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is an object, else `false`.
- * @example
- *
- * _.isObject({});
- * // => true
- *
- * _.isObject([1, 2, 3]);
- * // => true
- *
- * _.isObject(_.noop);
- * // => true
- *
- * _.isObject(null);
- * // => false
- */
-function isObject(value) {
-  var type = typeof value;
-  return value != null && (type == 'object' || type == 'function');
-}
-
-/** `Object#toString` result references. */
-var asyncTag = '[object AsyncFunction]',
-    funcTag = '[object Function]',
-    genTag = '[object GeneratorFunction]',
-    proxyTag = '[object Proxy]';
-
-/**
- * Checks if `value` is classified as a `Function` object.
- *
- * @static
- * @memberOf _
- * @since 0.1.0
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is a function, else `false`.
- * @example
- *
- * _.isFunction(_);
- * // => true
- *
- * _.isFunction(/abc/);
- * // => false
- */
-function isFunction(value) {
-  if (!isObject(value)) {
-    return false;
-  }
-  // The use of `Object#toString` avoids issues with the `typeof` operator
-  // in Safari 9 which returns 'object' for typed arrays and other constructors.
-  var tag = baseGetTag(value);
-  return tag == funcTag || tag == genTag || tag == asyncTag || tag == proxyTag;
-}
-
-/** Used to detect overreaching core-js shims. */
-var coreJsData = root['__core-js_shared__'];
-
-/** Used to detect methods masquerading as native. */
-var maskSrcKey = (function() {
-  var uid = /[^.]+$/.exec(coreJsData && coreJsData.keys && coreJsData.keys.IE_PROTO || '');
-  return uid ? ('Symbol(src)_1.' + uid) : '';
-}());
-
-/**
- * Checks if `func` has its source masked.
- *
- * @private
- * @param {Function} func The function to check.
- * @returns {boolean} Returns `true` if `func` is masked, else `false`.
- */
-function isMasked(func) {
-  return !!maskSrcKey && (maskSrcKey in func);
-}
-
-/** Used for built-in method references. */
-var funcProto$1 = Function.prototype;
-
-/** Used to resolve the decompiled source of functions. */
-var funcToString$1 = funcProto$1.toString;
-
-/**
- * Converts `func` to its source code.
- *
- * @private
- * @param {Function} func The function to convert.
- * @returns {string} Returns the source code.
- */
-function toSource(func) {
-  if (func != null) {
-    try {
-      return funcToString$1.call(func);
-    } catch (e) {}
-    try {
-      return (func + '');
-    } catch (e) {}
-  }
-  return '';
-}
-
-/**
- * Used to match `RegExp`
- * [syntax characters](http://ecma-international.org/ecma-262/7.0/#sec-patterns).
- */
-var reRegExpChar = /[\\^$.*+?()[\]{}|]/g;
-
-/** Used to detect host constructors (Safari). */
-var reIsHostCtor = /^\[object .+?Constructor\]$/;
-
-/** Used for built-in method references. */
-var funcProto = Function.prototype,
-    objectProto$2 = Object.prototype;
-
-/** Used to resolve the decompiled source of functions. */
-var funcToString = funcProto.toString;
-
-/** Used to check objects for own properties. */
-var hasOwnProperty$2 = objectProto$2.hasOwnProperty;
-
-/** Used to detect if a method is native. */
-var reIsNative = RegExp('^' +
-  funcToString.call(hasOwnProperty$2).replace(reRegExpChar, '\\$&')
-  .replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, '$1.*?') + '$'
-);
-
-/**
- * The base implementation of `_.isNative` without bad shim checks.
- *
- * @private
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is a native function,
- *  else `false`.
- */
-function baseIsNative(value) {
-  if (!isObject(value) || isMasked(value)) {
-    return false;
-  }
-  var pattern = isFunction(value) ? reIsNative : reIsHostCtor;
-  return pattern.test(toSource(value));
-}
-
-/**
- * Gets the value at `key` of `object`.
- *
- * @private
- * @param {Object} [object] The object to query.
- * @param {string} key The key of the property to get.
- * @returns {*} Returns the property value.
- */
-function getValue(object, key) {
-  return object == null ? undefined : object[key];
-}
-
-/**
- * Gets the native function at `key` of `object`.
- *
- * @private
- * @param {Object} object The object to query.
- * @param {string} key The key of the method to get.
- * @returns {*} Returns the function if it's native, else `undefined`.
- */
-function getNative(object, key) {
-  var value = getValue(object, key);
-  return baseIsNative(value) ? value : undefined;
-}
-
-/**
- * Performs a
- * [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
- * comparison between two values to determine if they are equivalent.
- *
- * @static
- * @memberOf _
- * @since 4.0.0
- * @category Lang
- * @param {*} value The value to compare.
- * @param {*} other The other value to compare.
- * @returns {boolean} Returns `true` if the values are equivalent, else `false`.
- * @example
- *
- * var object = { 'a': 1 };
- * var other = { 'a': 1 };
- *
- * _.eq(object, object);
- * // => true
- *
- * _.eq(object, other);
- * // => false
- *
- * _.eq('a', 'a');
- * // => true
- *
- * _.eq('a', Object('a'));
- * // => false
- *
- * _.eq(NaN, NaN);
- * // => true
- */
-function eq(value, other) {
-  return value === other || (value !== value && other !== other);
-}
-
-/** Used to match property names within property paths. */
-var reIsDeepProp = /\.|\[(?:[^[\]]*|(["'])(?:(?!\1)[^\\]|\\.)*?\1)\]/,
-    reIsPlainProp = /^\w*$/;
-
-/**
- * Checks if `value` is a property name and not a property path.
- *
- * @private
- * @param {*} value The value to check.
- * @param {Object} [object] The object to query keys on.
- * @returns {boolean} Returns `true` if `value` is a property name, else `false`.
- */
-function isKey(value, object) {
-  if (isArray(value)) {
-    return false;
-  }
-  var type = typeof value;
-  if (type == 'number' || type == 'symbol' || type == 'boolean' ||
-      value == null || isSymbol(value)) {
-    return true;
-  }
-  return reIsPlainProp.test(value) || !reIsDeepProp.test(value) ||
-    (object != null && value in Object(object));
-}
-
-/* Built-in method references that are verified to be native. */
-var nativeCreate = getNative(Object, 'create');
-
-/**
- * Removes all key-value entries from the hash.
- *
- * @private
- * @name clear
- * @memberOf Hash
- */
-function hashClear() {
-  this.__data__ = nativeCreate ? nativeCreate(null) : {};
-  this.size = 0;
-}
-
-/**
- * Removes `key` and its value from the hash.
- *
- * @private
- * @name delete
- * @memberOf Hash
- * @param {Object} hash The hash to modify.
- * @param {string} key The key of the value to remove.
- * @returns {boolean} Returns `true` if the entry was removed, else `false`.
- */
-function hashDelete(key) {
-  var result = this.has(key) && delete this.__data__[key];
-  this.size -= result ? 1 : 0;
-  return result;
-}
-
-/** Used to stand-in for `undefined` hash values. */
-var HASH_UNDEFINED$1 = '__lodash_hash_undefined__';
-
-/** Used for built-in method references. */
-var objectProto$1 = Object.prototype;
-
-/** Used to check objects for own properties. */
-var hasOwnProperty$1 = objectProto$1.hasOwnProperty;
-
-/**
- * Gets the hash value for `key`.
- *
- * @private
- * @name get
- * @memberOf Hash
- * @param {string} key The key of the value to get.
- * @returns {*} Returns the entry value.
- */
-function hashGet(key) {
-  var data = this.__data__;
-  if (nativeCreate) {
-    var result = data[key];
-    return result === HASH_UNDEFINED$1 ? undefined : result;
-  }
-  return hasOwnProperty$1.call(data, key) ? data[key] : undefined;
-}
-
-/** Used for built-in method references. */
-var objectProto = Object.prototype;
-
-/** Used to check objects for own properties. */
-var hasOwnProperty = objectProto.hasOwnProperty;
-
-/**
- * Checks if a hash value for `key` exists.
- *
- * @private
- * @name has
- * @memberOf Hash
- * @param {string} key The key of the entry to check.
- * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
- */
-function hashHas(key) {
-  var data = this.__data__;
-  return nativeCreate ? (data[key] !== undefined) : hasOwnProperty.call(data, key);
-}
-
-/** Used to stand-in for `undefined` hash values. */
-var HASH_UNDEFINED = '__lodash_hash_undefined__';
-
-/**
- * Sets the hash `key` to `value`.
- *
- * @private
- * @name set
- * @memberOf Hash
- * @param {string} key The key of the value to set.
- * @param {*} value The value to set.
- * @returns {Object} Returns the hash instance.
- */
-function hashSet(key, value) {
-  var data = this.__data__;
-  this.size += this.has(key) ? 0 : 1;
-  data[key] = (nativeCreate && value === undefined) ? HASH_UNDEFINED : value;
-  return this;
-}
-
-/**
- * Creates a hash object.
- *
- * @private
- * @constructor
- * @param {Array} [entries] The key-value pairs to cache.
- */
-function Hash(entries) {
-  var index = -1,
-      length = entries == null ? 0 : entries.length;
-
-  this.clear();
-  while (++index < length) {
-    var entry = entries[index];
-    this.set(entry[0], entry[1]);
-  }
-}
-
-// Add methods to `Hash`.
-Hash.prototype.clear = hashClear;
-Hash.prototype['delete'] = hashDelete;
-Hash.prototype.get = hashGet;
-Hash.prototype.has = hashHas;
-Hash.prototype.set = hashSet;
-
-/**
- * Removes all key-value entries from the list cache.
- *
- * @private
- * @name clear
- * @memberOf ListCache
- */
-function listCacheClear() {
-  this.__data__ = [];
-  this.size = 0;
-}
-
-/**
- * Gets the index at which the `key` is found in `array` of key-value pairs.
- *
- * @private
- * @param {Array} array The array to inspect.
- * @param {*} key The key to search for.
- * @returns {number} Returns the index of the matched value, else `-1`.
- */
-function assocIndexOf(array, key) {
-  var length = array.length;
-  while (length--) {
-    if (eq(array[length][0], key)) {
-      return length;
-    }
-  }
-  return -1;
-}
-
-/** Used for built-in method references. */
-var arrayProto = Array.prototype;
-
-/** Built-in value references. */
-var splice = arrayProto.splice;
-
-/**
- * Removes `key` and its value from the list cache.
- *
- * @private
- * @name delete
- * @memberOf ListCache
- * @param {string} key The key of the value to remove.
- * @returns {boolean} Returns `true` if the entry was removed, else `false`.
- */
-function listCacheDelete(key) {
-  var data = this.__data__,
-      index = assocIndexOf(data, key);
-
-  if (index < 0) {
-    return false;
-  }
-  var lastIndex = data.length - 1;
-  if (index == lastIndex) {
-    data.pop();
-  } else {
-    splice.call(data, index, 1);
-  }
-  --this.size;
-  return true;
-}
-
-/**
- * Gets the list cache value for `key`.
- *
- * @private
- * @name get
- * @memberOf ListCache
- * @param {string} key The key of the value to get.
- * @returns {*} Returns the entry value.
- */
-function listCacheGet(key) {
-  var data = this.__data__,
-      index = assocIndexOf(data, key);
-
-  return index < 0 ? undefined : data[index][1];
-}
-
-/**
- * Checks if a list cache value for `key` exists.
- *
- * @private
- * @name has
- * @memberOf ListCache
- * @param {string} key The key of the entry to check.
- * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
- */
-function listCacheHas(key) {
-  return assocIndexOf(this.__data__, key) > -1;
-}
-
-/**
- * Sets the list cache `key` to `value`.
- *
- * @private
- * @name set
- * @memberOf ListCache
- * @param {string} key The key of the value to set.
- * @param {*} value The value to set.
- * @returns {Object} Returns the list cache instance.
- */
-function listCacheSet(key, value) {
-  var data = this.__data__,
-      index = assocIndexOf(data, key);
-
-  if (index < 0) {
-    ++this.size;
-    data.push([key, value]);
-  } else {
-    data[index][1] = value;
-  }
-  return this;
-}
-
-/**
- * Creates an list cache object.
- *
- * @private
- * @constructor
- * @param {Array} [entries] The key-value pairs to cache.
- */
-function ListCache(entries) {
-  var index = -1,
-      length = entries == null ? 0 : entries.length;
-
-  this.clear();
-  while (++index < length) {
-    var entry = entries[index];
-    this.set(entry[0], entry[1]);
-  }
-}
-
-// Add methods to `ListCache`.
-ListCache.prototype.clear = listCacheClear;
-ListCache.prototype['delete'] = listCacheDelete;
-ListCache.prototype.get = listCacheGet;
-ListCache.prototype.has = listCacheHas;
-ListCache.prototype.set = listCacheSet;
-
-/* Built-in method references that are verified to be native. */
-var Map = getNative(root, 'Map');
-
-/**
- * Removes all key-value entries from the map.
- *
- * @private
- * @name clear
- * @memberOf MapCache
- */
-function mapCacheClear() {
-  this.size = 0;
-  this.__data__ = {
-    'hash': new Hash,
-    'map': new (Map || ListCache),
-    'string': new Hash
-  };
-}
-
-/**
- * Checks if `value` is suitable for use as unique object key.
- *
- * @private
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is suitable, else `false`.
- */
-function isKeyable(value) {
-  var type = typeof value;
-  return (type == 'string' || type == 'number' || type == 'symbol' || type == 'boolean')
-    ? (value !== '__proto__')
-    : (value === null);
-}
-
-/**
- * Gets the data for `map`.
- *
- * @private
- * @param {Object} map The map to query.
- * @param {string} key The reference key.
- * @returns {*} Returns the map data.
- */
-function getMapData(map, key) {
-  var data = map.__data__;
-  return isKeyable(key)
-    ? data[typeof key == 'string' ? 'string' : 'hash']
-    : data.map;
-}
-
-/**
- * Removes `key` and its value from the map.
- *
- * @private
- * @name delete
- * @memberOf MapCache
- * @param {string} key The key of the value to remove.
- * @returns {boolean} Returns `true` if the entry was removed, else `false`.
- */
-function mapCacheDelete(key) {
-  var result = getMapData(this, key)['delete'](key);
-  this.size -= result ? 1 : 0;
-  return result;
-}
-
-/**
- * Gets the map value for `key`.
- *
- * @private
- * @name get
- * @memberOf MapCache
- * @param {string} key The key of the value to get.
- * @returns {*} Returns the entry value.
- */
-function mapCacheGet(key) {
-  return getMapData(this, key).get(key);
-}
-
-/**
- * Checks if a map value for `key` exists.
- *
- * @private
- * @name has
- * @memberOf MapCache
- * @param {string} key The key of the entry to check.
- * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
- */
-function mapCacheHas(key) {
-  return getMapData(this, key).has(key);
-}
-
-/**
- * Sets the map `key` to `value`.
- *
- * @private
- * @name set
- * @memberOf MapCache
- * @param {string} key The key of the value to set.
- * @param {*} value The value to set.
- * @returns {Object} Returns the map cache instance.
- */
-function mapCacheSet(key, value) {
-  var data = getMapData(this, key),
-      size = data.size;
-
-  data.set(key, value);
-  this.size += data.size == size ? 0 : 1;
-  return this;
-}
-
-/**
- * Creates a map cache object to store key-value pairs.
- *
- * @private
- * @constructor
- * @param {Array} [entries] The key-value pairs to cache.
- */
-function MapCache(entries) {
-  var index = -1,
-      length = entries == null ? 0 : entries.length;
-
-  this.clear();
-  while (++index < length) {
-    var entry = entries[index];
-    this.set(entry[0], entry[1]);
-  }
-}
-
-// Add methods to `MapCache`.
-MapCache.prototype.clear = mapCacheClear;
-MapCache.prototype['delete'] = mapCacheDelete;
-MapCache.prototype.get = mapCacheGet;
-MapCache.prototype.has = mapCacheHas;
-MapCache.prototype.set = mapCacheSet;
-
-/** Error message constants. */
-var FUNC_ERROR_TEXT = 'Expected a function';
-
-/**
- * Creates a function that memoizes the result of `func`. If `resolver` is
- * provided, it determines the cache key for storing the result based on the
- * arguments provided to the memoized function. By default, the first argument
- * provided to the memoized function is used as the map cache key. The `func`
- * is invoked with the `this` binding of the memoized function.
- *
- * **Note:** The cache is exposed as the `cache` property on the memoized
- * function. Its creation may be customized by replacing the `_.memoize.Cache`
- * constructor with one whose instances implement the
- * [`Map`](http://ecma-international.org/ecma-262/7.0/#sec-properties-of-the-map-prototype-object)
- * method interface of `clear`, `delete`, `get`, `has`, and `set`.
- *
- * @static
- * @memberOf _
- * @since 0.1.0
- * @category Function
- * @param {Function} func The function to have its output memoized.
- * @param {Function} [resolver] The function to resolve the cache key.
- * @returns {Function} Returns the new memoized function.
- * @example
- *
- * var object = { 'a': 1, 'b': 2 };
- * var other = { 'c': 3, 'd': 4 };
- *
- * var values = _.memoize(_.values);
- * values(object);
- * // => [1, 2]
- *
- * values(other);
- * // => [3, 4]
- *
- * object.a = 2;
- * values(object);
- * // => [1, 2]
- *
- * // Modify the result cache.
- * values.cache.set(object, ['a', 'b']);
- * values(object);
- * // => ['a', 'b']
- *
- * // Replace `_.memoize.Cache`.
- * _.memoize.Cache = WeakMap;
- */
-function memoize(func, resolver) {
-  if (typeof func != 'function' || (resolver != null && typeof resolver != 'function')) {
-    throw new TypeError(FUNC_ERROR_TEXT);
-  }
-  var memoized = function() {
-    var args = arguments,
-        key = resolver ? resolver.apply(this, args) : args[0],
-        cache = memoized.cache;
-
-    if (cache.has(key)) {
-      return cache.get(key);
-    }
-    var result = func.apply(this, args);
-    memoized.cache = cache.set(key, result) || cache;
-    return result;
-  };
-  memoized.cache = new (memoize.Cache || MapCache);
-  return memoized;
-}
-
-// Expose `MapCache`.
-memoize.Cache = MapCache;
-
-/** Used as the maximum memoize cache size. */
-var MAX_MEMOIZE_SIZE = 500;
-
-/**
- * A specialized version of `_.memoize` which clears the memoized function's
- * cache when it exceeds `MAX_MEMOIZE_SIZE`.
- *
- * @private
- * @param {Function} func The function to have its output memoized.
- * @returns {Function} Returns the new memoized function.
- */
-function memoizeCapped(func) {
-  var result = memoize(func, function(key) {
-    if (cache.size === MAX_MEMOIZE_SIZE) {
-      cache.clear();
-    }
-    return key;
-  });
-
-  var cache = result.cache;
-  return result;
-}
-
-/** Used to match property names within property paths. */
-var rePropName = /[^.[\]]+|\[(?:(-?\d+(?:\.\d+)?)|(["'])((?:(?!\2)[^\\]|\\.)*?)\2)\]|(?=(?:\.|\[\])(?:\.|\[\]|$))/g;
-
-/** Used to match backslashes in property paths. */
-var reEscapeChar = /\\(\\)?/g;
-
-/**
- * Converts `string` to a property path array.
- *
- * @private
- * @param {string} string The string to convert.
- * @returns {Array} Returns the property path array.
- */
-var stringToPath = memoizeCapped(function(string) {
-  var result = [];
-  if (string.charCodeAt(0) === 46 /* . */) {
-    result.push('');
-  }
-  string.replace(rePropName, function(match, number, quote, subString) {
-    result.push(quote ? subString.replace(reEscapeChar, '$1') : (number || match));
-  });
-  return result;
-});
-
-/**
- * Converts `value` to a string. An empty string is returned for `null`
- * and `undefined` values. The sign of `-0` is preserved.
- *
- * @static
- * @memberOf _
- * @since 4.0.0
- * @category Lang
- * @param {*} value The value to convert.
- * @returns {string} Returns the converted string.
- * @example
- *
- * _.toString(null);
- * // => ''
- *
- * _.toString(-0);
- * // => '-0'
- *
- * _.toString([1, 2, 3]);
- * // => '1,2,3'
- */
-function toString(value) {
-  return value == null ? '' : baseToString(value);
-}
-
-/**
- * Casts `value` to a path array if it's not one.
- *
- * @private
- * @param {*} value The value to inspect.
- * @param {Object} [object] The object to query keys on.
- * @returns {Array} Returns the cast property path array.
- */
-function castPath(value, object) {
-  if (isArray(value)) {
-    return value;
-  }
-  return isKey(value, object) ? [value] : stringToPath(toString(value));
-}
-
-/** Used as references for various `Number` constants. */
-var INFINITY = 1 / 0;
-
-/**
- * Converts `value` to a string key if it's not a string or symbol.
- *
- * @private
- * @param {*} value The value to inspect.
- * @returns {string|symbol} Returns the key.
- */
-function toKey(value) {
-  if (typeof value == 'string' || isSymbol(value)) {
-    return value;
-  }
-  var result = (value + '');
-  return (result == '0' && (1 / value) == -INFINITY) ? '-0' : result;
-}
-
-/**
- * The base implementation of `_.get` without support for default values.
- *
- * @private
- * @param {Object} object The object to query.
- * @param {Array|string} path The path of the property to get.
- * @returns {*} Returns the resolved value.
- */
-function baseGet(object, path) {
-  path = castPath(path, object);
-
-  var index = 0,
-      length = path.length;
-
-  while (object != null && index < length) {
-    object = object[toKey(path[index++])];
-  }
-  return (index && index == length) ? object : undefined;
-}
-
-/**
- * Gets the value at `path` of `object`. If the resolved value is
- * `undefined`, the `defaultValue` is returned in its place.
- *
- * @static
- * @memberOf _
- * @since 3.7.0
- * @category Object
- * @param {Object} object The object to query.
- * @param {Array|string} path The path of the property to get.
- * @param {*} [defaultValue] The value returned for `undefined` resolved values.
- * @returns {*} Returns the resolved value.
- * @example
- *
- * var object = { 'a': [{ 'b': { 'c': 3 } }] };
- *
- * _.get(object, 'a[0].b.c');
- * // => 3
- *
- * _.get(object, ['a', '0', 'b', 'c']);
- * // => 3
- *
- * _.get(object, 'a.b.c', 'default');
- * // => 'default'
- */
-function get(object, path, defaultValue) {
-  var result = object == null ? undefined : baseGet(object, path);
-  return result === undefined ? defaultValue : result;
-}
-
-/**
- * The inverse of `_.toPairs`; this method returns an object composed
- * from key-value `pairs`.
- *
- * @static
- * @memberOf _
- * @since 4.0.0
- * @category Array
- * @param {Array} pairs The key-value pairs.
- * @returns {Object} Returns the new object.
- * @example
- *
- * _.fromPairs([['a', 1], ['b', 2]]);
- * // => { 'a': 1, 'b': 2 }
- */
-function fromPairs(pairs) {
-  var index = -1,
-      length = pairs == null ? 0 : pairs.length,
-      result = {};
-
-  while (++index < length) {
-    var pair = pairs[index];
-    result[pair[0]] = pair[1];
-  }
-  return result;
-}
-
-const isUndefined = (val) => val === void 0;
-const isNumber = (val) => typeof val === "number";
-const isStringNumber = (val) => {
-  if (!isString(val)) {
-    return false;
-  }
-  return !Number.isNaN(Number(val));
-};
-
-const keysOf = (arr) => Object.keys(arr);
-
-class ElementPlusError extends Error {
-  constructor(m) {
-    super(m);
-    this.name = "ElementPlusError";
-  }
-}
-function debugWarn(scope, message) {
-  if (process.env.NODE_ENV !== "production") {
-    const error = isString(scope) ? new ElementPlusError(`[${scope}] ${message}`) : scope;
-    console.warn(error);
-  }
-}
-
-const SCOPE = "utils/dom/style";
-function addUnit(value, defaultUnit = "px") {
-  if (!value)
-    return "";
-  if (isNumber(value) || isStringNumber(value)) {
-    return `${value}${defaultUnit}`;
-  } else if (isString(value)) {
-    return value;
-  }
-  debugWarn(SCOPE, "binding value must be a string or number");
-}
-
-/*! Element Plus Icons Vue v2.3.1 */
-
-var loading_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
-  name: "Loading",
-  __name: "loading",
-  setup(__props) {
-    return (_ctx, _cache) => (openBlock(), createElementBlock("svg", {
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 1024 1024"
-    }, [
-      createElementVNode("path", {
-        fill: "currentColor",
-        d: "M512 64a32 32 0 0 1 32 32v192a32 32 0 0 1-64 0V96a32 32 0 0 1 32-32m0 640a32 32 0 0 1 32 32v192a32 32 0 1 1-64 0V736a32 32 0 0 1 32-32m448-192a32 32 0 0 1-32 32H736a32 32 0 1 1 0-64h192a32 32 0 0 1 32 32m-640 0a32 32 0 0 1-32 32H96a32 32 0 0 1 0-64h192a32 32 0 0 1 32 32M195.2 195.2a32 32 0 0 1 45.248 0L376.32 331.008a32 32 0 0 1-45.248 45.248L195.2 240.448a32 32 0 0 1 0-45.248zm452.544 452.544a32 32 0 0 1 45.248 0L828.8 783.552a32 32 0 0 1-45.248 45.248L647.744 692.992a32 32 0 0 1 0-45.248zM828.8 195.264a32 32 0 0 1 0 45.184L692.992 376.32a32 32 0 0 1-45.248-45.248l135.808-135.808a32 32 0 0 1 45.248 0m-452.544 452.48a32 32 0 0 1 0 45.248L240.448 828.8a32 32 0 0 1-45.248-45.248l135.808-135.808a32 32 0 0 1 45.248 0z"
-      })
-    ]));
-  }
-});
-
-// src/components/loading.vue
-var loading_default = loading_vue_vue_type_script_setup_true_lang_default;
-
-const epPropKey = "__epPropKey";
-const definePropType = (val) => val;
-const isEpProp = (val) => isObject$1(val) && !!val[epPropKey];
-const buildProp = (prop, key) => {
-  if (!isObject$1(prop) || isEpProp(prop))
-    return prop;
-  const { values, required, default: defaultValue, type, validator } = prop;
-  const _validator = values || validator ? (val) => {
-    let valid = false;
-    let allowedValues = [];
-    if (values) {
-      allowedValues = Array.from(values);
-      if (hasOwn(prop, "default")) {
-        allowedValues.push(defaultValue);
-      }
-      valid || (valid = allowedValues.includes(val));
-    }
-    if (validator)
-      valid || (valid = validator(val));
-    if (!valid && allowedValues.length > 0) {
-      const allowValuesText = [...new Set(allowedValues)].map((value) => JSON.stringify(value)).join(", ");
-      warn(`Invalid prop: validation failed${key ? ` for prop "${key}"` : ""}. Expected one of [${allowValuesText}], got value ${JSON.stringify(val)}.`);
-    }
-    return valid;
-  } : void 0;
-  const epProp = {
-    type,
-    required: !!required,
-    validator: _validator,
-    [epPropKey]: true
-  };
-  if (hasOwn(prop, "default"))
-    epProp.default = defaultValue;
-  return epProp;
-};
-const buildProps = (props) => fromPairs(Object.entries(props).map(([key, option]) => [
-  key,
-  buildProp(option, key)
-]));
-
-const iconPropType = definePropType([
-  String,
-  Object,
-  Function
-]);
-
-const withInstall = (main, extra) => {
-  main.install = (app) => {
-    for (const comp of [main, ...Object.values(extra != null ? extra : {})]) {
-      app.component(comp.name, comp);
-    }
-  };
-  if (extra) {
-    for (const [key, comp] of Object.entries(extra)) {
-      main[key] = comp;
-    }
-  }
-  return main;
-};
-const withNoopInstall = (component) => {
-  component.install = NOOP;
-  return component;
-};
-
-const WEEK_DAYS = [
-  "sun",
-  "mon",
-  "tue",
-  "wed",
-  "thu",
-  "fri",
-  "sat"
-];
-
-const UPDATE_MODEL_EVENT = "update:modelValue";
-const INPUT_EVENT = "input";
-
-const componentSizes = ["", "default", "small", "large"];
-
-const useDeprecated = ({ from, replacement, scope, version, ref, type = "API" }, condition) => {
-  watch(() => unref(condition), (val) => {
-    if (val) {
-      debugWarn(scope, `[${type}] ${from} is about to be deprecated in version ${version}, please use ${replacement} instead.
-For more detail, please visit: ${ref}
-`);
-    }
-  }, {
-    immediate: true
-  });
-};
-
-var English = {
-  name: "en",
-  el: {
-    colorpicker: {
-      confirm: "OK",
-      clear: "Clear",
-      defaultLabel: "color picker",
-      description: "current color is {color}. press enter to select a new color."
-    },
-    datepicker: {
-      now: "Now",
-      today: "Today",
-      cancel: "Cancel",
-      clear: "Clear",
-      confirm: "OK",
-      dateTablePrompt: "Use the arrow keys and enter to select the day of the month",
-      monthTablePrompt: "Use the arrow keys and enter to select the month",
-      yearTablePrompt: "Use the arrow keys and enter to select the year",
-      selectedDate: "Selected date",
-      selectDate: "Select date",
-      selectTime: "Select time",
-      startDate: "Start Date",
-      startTime: "Start Time",
-      endDate: "End Date",
-      endTime: "End Time",
-      prevYear: "Previous Year",
-      nextYear: "Next Year",
-      prevMonth: "Previous Month",
-      nextMonth: "Next Month",
-      year: "",
-      month1: "January",
-      month2: "February",
-      month3: "March",
-      month4: "April",
-      month5: "May",
-      month6: "June",
-      month7: "July",
-      month8: "August",
-      month9: "September",
-      month10: "October",
-      month11: "November",
-      month12: "December",
-      week: "week",
-      weeks: {
-        sun: "Sun",
-        mon: "Mon",
-        tue: "Tue",
-        wed: "Wed",
-        thu: "Thu",
-        fri: "Fri",
-        sat: "Sat"
-      },
-      weeksFull: {
-        sun: "Sunday",
-        mon: "Monday",
-        tue: "Tuesday",
-        wed: "Wednesday",
-        thu: "Thursday",
-        fri: "Friday",
-        sat: "Saturday"
-      },
-      months: {
-        jan: "Jan",
-        feb: "Feb",
-        mar: "Mar",
-        apr: "Apr",
-        may: "May",
-        jun: "Jun",
-        jul: "Jul",
-        aug: "Aug",
-        sep: "Sep",
-        oct: "Oct",
-        nov: "Nov",
-        dec: "Dec"
-      }
-    },
-    inputNumber: {
-      decrease: "decrease number",
-      increase: "increase number"
-    },
-    select: {
-      loading: "Loading",
-      noMatch: "No matching data",
-      noData: "No data",
-      placeholder: "Select"
-    },
-    dropdown: {
-      toggleDropdown: "Toggle Dropdown"
-    },
-    cascader: {
-      noMatch: "No matching data",
-      loading: "Loading",
-      placeholder: "Select",
-      noData: "No data"
-    },
-    pagination: {
-      goto: "Go to",
-      pagesize: "/page",
-      total: "Total {total}",
-      pageClassifier: "",
-      page: "Page",
-      prev: "Go to previous page",
-      next: "Go to next page",
-      currentPage: "page {pager}",
-      prevPages: "Previous {pager} pages",
-      nextPages: "Next {pager} pages",
-      deprecationWarning: "Deprecated usages detected, please refer to the el-pagination documentation for more details"
-    },
-    dialog: {
-      close: "Close this dialog"
-    },
-    drawer: {
-      close: "Close this dialog"
-    },
-    messagebox: {
-      title: "Message",
-      confirm: "OK",
-      cancel: "Cancel",
-      error: "Illegal input",
-      close: "Close this dialog"
-    },
-    upload: {
-      deleteTip: "press delete to remove",
-      delete: "Delete",
-      preview: "Preview",
-      continue: "Continue"
-    },
-    slider: {
-      defaultLabel: "slider between {min} and {max}",
-      defaultRangeStartLabel: "pick start value",
-      defaultRangeEndLabel: "pick end value"
-    },
-    table: {
-      emptyText: "No Data",
-      confirmFilter: "Confirm",
-      resetFilter: "Reset",
-      clearFilter: "All",
-      sumText: "Sum"
-    },
-    tree: {
-      emptyText: "No Data"
-    },
-    transfer: {
-      noMatch: "No matching data",
-      noData: "No data",
-      titles: ["List 1", "List 2"],
-      filterPlaceholder: "Enter keyword",
-      noCheckedFormat: "{total} items",
-      hasCheckedFormat: "{checked}/{total} checked"
-    },
-    image: {
-      error: "FAILED"
-    },
-    pageHeader: {
-      title: "Back"
-    },
-    popconfirm: {
-      confirmButtonText: "Yes",
-      cancelButtonText: "No"
-    }
-  }
-};
-
-const buildTranslator = (locale) => (path, option) => translate(path, option, unref(locale));
-const translate = (path, option, locale) => get(locale, path, path).replace(/\{(\w+)\}/g, (_, key) => {
-  var _a;
-  return `${(_a = option == null ? void 0 : option[key]) != null ? _a : `{${key}}`}`;
-});
-const buildLocaleContext = (locale) => {
-  const lang = computed(() => unref(locale).name);
-  const localeRef = isRef(locale) ? locale : ref(locale);
-  return {
-    lang,
-    locale: localeRef,
-    t: buildTranslator(locale)
-  };
-};
-const localeContextKey = Symbol("localeContextKey");
-const useLocale = (localeOverrides) => {
-  const locale = localeOverrides || inject(localeContextKey, ref());
-  return buildLocaleContext(computed(() => locale.value || English));
-};
-
-const defaultNamespace = "el";
-const statePrefix = "is-";
-const _bem = (namespace, block, blockSuffix, element, modifier) => {
-  let cls = `${namespace}-${block}`;
-  if (blockSuffix) {
-    cls += `-${blockSuffix}`;
-  }
-  if (element) {
-    cls += `__${element}`;
-  }
-  if (modifier) {
-    cls += `--${modifier}`;
-  }
-  return cls;
-};
-const namespaceContextKey = Symbol("namespaceContextKey");
-const useGetDerivedNamespace = (namespaceOverrides) => {
-  const derivedNamespace = namespaceOverrides || (getCurrentInstance() ? inject(namespaceContextKey, ref(defaultNamespace)) : ref(defaultNamespace));
-  const namespace = computed(() => {
-    return unref(derivedNamespace) || defaultNamespace;
-  });
-  return namespace;
-};
-const useNamespace = (block, namespaceOverrides) => {
-  const namespace = useGetDerivedNamespace(namespaceOverrides);
-  const b = (blockSuffix = "") => _bem(namespace.value, block, blockSuffix, "", "");
-  const e = (element) => element ? _bem(namespace.value, block, "", element, "") : "";
-  const m = (modifier) => modifier ? _bem(namespace.value, block, "", "", modifier) : "";
-  const be = (blockSuffix, element) => blockSuffix && element ? _bem(namespace.value, block, blockSuffix, element, "") : "";
-  const em = (element, modifier) => element && modifier ? _bem(namespace.value, block, "", element, modifier) : "";
-  const bm = (blockSuffix, modifier) => blockSuffix && modifier ? _bem(namespace.value, block, blockSuffix, "", modifier) : "";
-  const bem = (blockSuffix, element, modifier) => blockSuffix && element && modifier ? _bem(namespace.value, block, blockSuffix, element, modifier) : "";
-  const is = (name, ...args) => {
-    const state = args.length >= 1 ? args[0] : true;
-    return name && state ? `${statePrefix}${name}` : "";
-  };
-  const cssVar = (object) => {
-    const styles = {};
-    for (const key in object) {
-      if (object[key]) {
-        styles[`--${namespace.value}-${key}`] = object[key];
-      }
-    }
-    return styles;
-  };
-  const cssVarBlock = (object) => {
-    const styles = {};
-    for (const key in object) {
-      if (object[key]) {
-        styles[`--${namespace.value}-${block}-${key}`] = object[key];
-      }
-    }
-    return styles;
-  };
-  const cssVarName = (name) => `--${namespace.value}-${name}`;
-  const cssVarBlockName = (name) => `--${namespace.value}-${block}-${name}`;
-  return {
-    namespace,
-    b,
-    e,
-    m,
-    be,
-    em,
-    bm,
-    bem,
-    is,
-    cssVar,
-    cssVarName,
-    cssVarBlock,
-    cssVarBlockName
-  };
-};
-
-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];
-  });
-};
-
-ref(0);
-const zIndexContextKey = Symbol("zIndexContextKey");
-
-const useSizeProp = buildProp({
-  type: String,
-  values: componentSizes,
-  required: false
-});
-const SIZE_INJECTION_KEY = Symbol("size");
-const useGlobalSize = () => {
-  const injectedSize = inject(SIZE_INJECTION_KEY, {});
-  return computed(() => {
-    return unref(injectedSize.size) || "";
-  });
-};
-
-const configProviderContextKey = Symbol();
-
-const globalConfig = ref();
-function useGlobalConfig(key, defaultValue = void 0) {
-  const config = getCurrentInstance() ? inject(configProviderContextKey, globalConfig) : globalConfig;
-  if (key) {
-    return computed(() => {
-      var _a, _b;
-      return (_b = (_a = config.value) == null ? void 0 : _a[key]) != null ? _b : defaultValue;
-    });
-  } else {
-    return config;
-  }
-}
-const provideGlobalConfig = (config, app, global = false) => {
-  var _a;
-  const inSetup = !!getCurrentInstance();
-  const oldConfig = inSetup ? useGlobalConfig() : void 0;
-  const provideFn = (_a = app == null ? void 0 : app.provide) != null ? _a : inSetup ? provide : void 0;
-  if (!provideFn) {
-    debugWarn("provideGlobalConfig", "provideGlobalConfig() can only be used inside setup().");
-    return;
-  }
-  const context = computed(() => {
-    const cfg = unref(config);
-    if (!(oldConfig == null ? void 0 : oldConfig.value))
-      return cfg;
-    return mergeConfig(oldConfig.value, cfg);
-  });
-  provideFn(configProviderContextKey, context);
-  provideFn(localeContextKey, computed(() => context.value.locale));
-  provideFn(namespaceContextKey, computed(() => context.value.namespace));
-  provideFn(zIndexContextKey, computed(() => context.value.zIndex));
-  provideFn(SIZE_INJECTION_KEY, {
-    size: computed(() => context.value.size || "")
-  });
-  if (global || !globalConfig.value) {
-    globalConfig.value = context.value;
-  }
-  return context;
-};
-const mergeConfig = (a, b) => {
-  var _a;
-  const keys = [.../* @__PURE__ */ new Set([...keysOf(a), ...keysOf(b)])];
-  const obj = {};
-  for (const key of keys) {
-    obj[key] = (_a = b[key]) != null ? _a : a[key];
-  }
-  return obj;
-};
-
-const configProviderProps = buildProps({
-  a11y: {
-    type: Boolean,
-    default: true
-  },
-  locale: {
-    type: definePropType(Object)
-  },
-  size: useSizeProp,
-  button: {
-    type: definePropType(Object)
-  },
-  experimentalFeatures: {
-    type: definePropType(Object)
-  },
-  keyboardNavigation: {
-    type: Boolean,
-    default: true
-  },
-  message: {
-    type: definePropType(Object)
-  },
-  zIndex: Number,
-  namespace: {
-    type: String,
-    default: "el"
-  }
-});
-
-const messageConfig = {};
-const ConfigProvider = defineComponent({
-  name: "ElConfigProvider",
-  props: configProviderProps,
-  setup(props, { slots }) {
-    watch(() => props.message, (val) => {
-      Object.assign(messageConfig, val != null ? val : {});
-    }, { immediate: true, deep: true });
-    const config = provideGlobalConfig(props);
-    return () => renderSlot(slots, "default", { config: config == null ? void 0 : config.value });
-  }
-});
-
-const ElConfigProvider = withInstall(ConfigProvider);
-
-var _export_sfc$1 = (sfc, props) => {
-  const target = sfc.__vccOpts || sfc;
-  for (const [key, val] of props) {
-    target[key] = val;
-  }
-  return target;
-};
-
-const iconProps = buildProps({
-  size: {
-    type: definePropType([Number, String])
-  },
-  color: {
-    type: String
-  }
-});
-
-const __default__$5 = defineComponent({
-  name: "ElIcon",
-  inheritAttrs: false
-});
-const _sfc_main$5 = /* @__PURE__ */ defineComponent({
-  ...__default__$5,
-  props: iconProps,
-  setup(__props) {
-    const props = __props;
-    const ns = useNamespace("icon");
-    const style = computed(() => {
-      const { size, color } = props;
-      if (!size && !color)
-        return {};
-      return {
-        fontSize: isUndefined(size) ? void 0 : addUnit(size),
-        "--color": color
-      };
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("i", mergeProps({
-        class: unref(ns).b(),
-        style: unref(style)
-      }, _ctx.$attrs), [
-        renderSlot(_ctx.$slots, "default")
-      ], 16);
-    };
-  }
-});
-var Icon = /* @__PURE__ */ _export_sfc$1(_sfc_main$5, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/icon/src/icon.vue"]]);
-
-const ElIcon = withInstall(Icon);
-
-const formContextKey = Symbol("formContextKey");
-const formItemContextKey = Symbol("formItemContextKey");
-
-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);
-};
-
-const useFormItem = () => {
-  const form = inject(formContextKey, void 0);
-  const formItem = inject(formItemContextKey, void 0);
-  return {
-    form,
-    formItem
-  };
-};
-
-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 /^\p{Unified_Ideograph}{2}$/u.test(text.trim());
-      }
-    }
-    return false;
-  });
-  const handleClick = (evt) => {
-    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
-};
-
-/**
- * Take input from [0, n] and return it as [0, 1]
- * @hidden
- */
-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)));
-    // Automatically convert percentage into number
-    if (isPercent) {
-        n = parseInt(String(n * max), 10) / 100;
-    }
-    // Handle floating point rounding errors
-    if (Math.abs(n - max) < 0.000001) {
-        return 1;
-    }
-    // Convert into [0, 1] range if it isn't already
-    if (max === 360) {
-        // If n is a hue given in degrees,
-        // wrap around out-of-range values into [0, 360] range
-        // then convert into [0, 1].
-        n = (n < 0 ? (n % max) + max : n % max) / parseFloat(String(max));
-    }
-    else {
-        // If n not a hue given in degrees
-        // Convert into [0, 1] range if it isn't already.
-        n = (n % max) / parseFloat(String(max));
-    }
-    return n;
-}
-/**
- * Force a number between 0 and 1
- * @hidden
- */
-function clamp01(val) {
-    return Math.min(1, Math.max(0, val));
-}
-/**
- * Need to handle 1.0 as 100%, since once it is a number, there is no difference between it and 1
- * <http://stackoverflow.com/questions/7422072/javascript-how-to-detect-number-as-a-decimal-including-1-0>
- * @hidden
- */
-function isOnePointZero(n) {
-    return typeof n === 'string' && n.indexOf('.') !== -1 && parseFloat(n) === 1;
-}
-/**
- * Check to see if string passed in is a percentage
- * @hidden
- */
-function isPercentage(n) {
-    return typeof n === 'string' && n.indexOf('%') !== -1;
-}
-/**
- * Return a valid alpha value [0,1] with all invalid values being set to 1
- * @hidden
- */
-function boundAlpha(a) {
-    a = parseFloat(a);
-    if (isNaN(a) || a < 0 || a > 1) {
-        a = 1;
-    }
-    return a;
-}
-/**
- * Replace a decimal with it's percentage value
- * @hidden
- */
-function convertToPercentage(n) {
-    if (n <= 1) {
-        return "".concat(Number(n) * 100, "%");
-    }
-    return n;
-}
-/**
- * Force a hex value to have 2 characters
- * @hidden
- */
-function pad2(c) {
-    return c.length === 1 ? '0' + c : String(c);
-}
-
-// `rgbToHsl`, `rgbToHsv`, `hslToRgb`, `hsvToRgb` modified from:
-// <http://mjijackson.com/2008/02/rgb-to-hsl-and-rgb-to-hsv-color-model-conversion-algorithms-in-javascript>
-/**
- * Handle bounds / percentage checking to conform to CSS color spec
- * <http://www.w3.org/TR/css3-color/>
- * *Assumes:* r, g, b in [0, 255] or [0, 1]
- * *Returns:* { r, g, b } in [0, 255]
- */
-function rgbToRgb(r, g, b) {
-    return {
-        r: bound01(r, 255) * 255,
-        g: bound01(g, 255) * 255,
-        b: bound01(b, 255) * 255,
-    };
-}
-/**
- * Converts an RGB color value to HSL.
- * *Assumes:* r, g, and b are contained in [0, 255] or [0, 1]
- * *Returns:* { h, s, l } in [0,1]
- */
-function rgbToHsl(r, g, b) {
-    r = bound01(r, 255);
-    g = bound01(g, 255);
-    b = bound01(b, 255);
-    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; // achromatic
-    }
-    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: h, s: s, l: l };
-}
-function hue2rgb(p, q, t) {
-    if (t < 0) {
-        t += 1;
-    }
-    if (t > 1) {
-        t -= 1;
-    }
-    if (t < 1 / 6) {
-        return p + (q - p) * (6 * t);
-    }
-    if (t < 1 / 2) {
-        return q;
-    }
-    if (t < 2 / 3) {
-        return p + (q - p) * (2 / 3 - t) * 6;
-    }
-    return p;
-}
-/**
- * Converts an HSL color value to RGB.
- *
- * *Assumes:* h is contained in [0, 1] or [0, 360] and s and l are contained [0, 1] or [0, 100]
- * *Returns:* { r, g, b } in the set [0, 255]
- */
-function hslToRgb(h, s, l) {
-    var r;
-    var g;
-    var b;
-    h = bound01(h, 360);
-    s = bound01(s, 100);
-    l = bound01(l, 100);
-    if (s === 0) {
-        // achromatic
-        g = l;
-        b = l;
-        r = l;
-    }
-    else {
-        var q = l < 0.5 ? l * (1 + s) : l + s - l * s;
-        var p = 2 * l - q;
-        r = hue2rgb(p, q, h + 1 / 3);
-        g = hue2rgb(p, q, h);
-        b = hue2rgb(p, q, h - 1 / 3);
-    }
-    return { r: r * 255, g: g * 255, b: b * 255 };
-}
-/**
- * Converts an RGB color value to HSV
- *
- * *Assumes:* r, g, and b are contained in the set [0, 255] or [0, 1]
- * *Returns:* { h, s, v } in [0,1]
- */
-function rgbToHsv(r, g, b) {
-    r = bound01(r, 255);
-    g = bound01(g, 255);
-    b = bound01(b, 255);
-    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; // achromatic
-    }
-    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: h, s: s, v: v };
-}
-/**
- * Converts an HSV color value to RGB.
- *
- * *Assumes:* h is contained in [0, 1] or [0, 360] and s and v are contained in [0, 1] or [0, 100]
- * *Returns:* { r, g, b } in the set [0, 255]
- */
-function hsvToRgb(h, s, v) {
-    h = bound01(h, 360) * 6;
-    s = bound01(s, 100);
-    v = bound01(v, 100);
-    var i = Math.floor(h);
-    var f = h - i;
-    var p = v * (1 - s);
-    var q = v * (1 - f * s);
-    var t = v * (1 - (1 - f) * s);
-    var mod = i % 6;
-    var r = [v, q, p, p, t, v][mod];
-    var g = [t, v, v, q, p, p][mod];
-    var b = [p, p, t, v, v, q][mod];
-    return { r: r * 255, g: g * 255, b: b * 255 };
-}
-/**
- * Converts an RGB color to hex
- *
- * Assumes r, g, and b are contained in the set [0, 255]
- * Returns a 3 or 6 character hex
- */
-function rgbToHex(r, g, b, allow3Char) {
-    var hex = [
-        pad2(Math.round(r).toString(16)),
-        pad2(Math.round(g).toString(16)),
-        pad2(Math.round(b).toString(16)),
-    ];
-    // Return a 3 character hex if possible
-    if (allow3Char &&
-        hex[0].startsWith(hex[0].charAt(1)) &&
-        hex[1].startsWith(hex[1].charAt(1)) &&
-        hex[2].startsWith(hex[2].charAt(1))) {
-        return hex[0].charAt(0) + hex[1].charAt(0) + hex[2].charAt(0);
-    }
-    return hex.join('');
-}
-/**
- * Converts an RGBA color plus alpha transparency to hex
- *
- * Assumes r, g, b are contained in the set [0, 255] and
- * a in [0, 1]. Returns a 4 or 8 character rgba hex
- */
-// eslint-disable-next-line max-params
-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)),
-    ];
-    // Return a 4 character hex if possible
-    if (allow4Char &&
-        hex[0].startsWith(hex[0].charAt(1)) &&
-        hex[1].startsWith(hex[1].charAt(1)) &&
-        hex[2].startsWith(hex[2].charAt(1)) &&
-        hex[3].startsWith(hex[3].charAt(1))) {
-        return hex[0].charAt(0) + hex[1].charAt(0) + hex[2].charAt(0) + hex[3].charAt(0);
-    }
-    return hex.join('');
-}
-/** Converts a decimal to a hex value */
-function convertDecimalToHex(d) {
-    return Math.round(parseFloat(d) * 255).toString(16);
-}
-/** Converts a hex value to a decimal */
-function convertHexToDecimal(h) {
-    return parseIntFromHex(h) / 255;
-}
-/** Parse a base-16 hex value into a base-10 integer */
-function parseIntFromHex(val) {
-    return parseInt(val, 16);
-}
-function numberInputToObject(color) {
-    return {
-        r: color >> 16,
-        g: (color & 0xff00) >> 8,
-        b: color & 0xff,
-    };
-}
-
-// https://github.com/bahamas10/css-color-names/blob/master/css-color-names.json
-/**
- * @hidden
- */
-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',
-};
-
-/* eslint-disable @typescript-eslint/no-redundant-type-constituents */
-/**
- * Given a string or object, convert that input to RGB
- *
- * Possible string inputs:
- * ```
- * "red"
- * "#f00" or "f00"
- * "#ff0000" or "ff0000"
- * "#ff000000" or "ff000000"
- * "rgb 255 0 0" or "rgb (255, 0, 0)"
- * "rgb 1.0 0 0" or "rgb (1, 0, 0)"
- * "rgba (255, 0, 0, 1)" or "rgba 255, 0, 0, 1"
- * "rgba (1.0, 0, 0, 1)" or "rgba 1.0, 0, 0, 1"
- * "hsl(0, 100%, 50%)" or "hsl 0 100% 50%"
- * "hsla(0, 100%, 50%, 1)" or "hsla 0 100% 50%, 1"
- * "hsv(0, 100%, 100%)" or "hsv 0 100% 100%"
- * ```
- */
-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: 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: a,
-    };
-}
-// <http://www.w3.org/TR/css3-values/#integers>
-var CSS_INTEGER = '[-\\+]?\\d+%?';
-// <http://www.w3.org/TR/css3-values/#number-value>
-var CSS_NUMBER = '[-\\+]?\\d*\\.\\d+%?';
-// Allow positive/negative integer/number.  Don't capture the either/or, just the entire outcome.
-var CSS_UNIT = "(?:".concat(CSS_NUMBER, ")|(?:").concat(CSS_INTEGER, ")");
-// Actual matching.
-// Parentheses and commas are optional, but not required.
-// Whitespace can take the place of commas or opening paren
-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})$/,
-};
-/**
- * Permissive string parsing.  Take in a number of formats, and output an object
- * based on detected format.  Returns `{ r, g, b }` or `{ h, s, l }` or `{ h, s, v}`
- */
-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' };
-    }
-    // Try to match string input using regular expressions.
-    // Keep most of the number bounding out of this function - don't worry about [0,1] or [0,100] or [0,360]
-    // Just return an object and let the conversion functions handle that.
-    // This way the result will be the same whether the tinycolor is initialized with string or object.
-    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;
-}
-/**
- * Check to see if it looks like a CSS unit
- * (see `matchers` above for definition).
- */
-function isValidCSSUnit(color) {
-    return Boolean(matchers.CSS_UNIT.exec(String(color)));
-}
-
-var TinyColor = /** @class */ (function () {
-    function TinyColor(color, opts) {
-        if (color === void 0) { color = ''; }
-        if (opts === void 0) { opts = {}; }
-        var _a;
-        // If input is already a tinycolor, return itself
-        if (color instanceof TinyColor) {
-            // eslint-disable-next-line no-constructor-return
-            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;
-        // Don't let the range of [0,255] come back in [0,1].
-        // Potentially lose a little bit of precision here, but will fix issues where
-        // .5 gets interpreted as half of the total, instead of half of 1
-        // If it was supposed to be 128, this was already taken care of by `inputToRgb`
-        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;
-    }
-    TinyColor.prototype.isDark = function () {
-        return this.getBrightness() < 128;
-    };
-    TinyColor.prototype.isLight = function () {
-        return !this.isDark();
-    };
-    /**
-     * Returns the perceived brightness of the color, from 0-255.
-     */
-    TinyColor.prototype.getBrightness = function () {
-        // http://www.w3.org/TR/AERT#color-contrast
-        var rgb = this.toRgb();
-        return (rgb.r * 299 + rgb.g * 587 + rgb.b * 114) / 1000;
-    };
-    /**
-     * Returns the perceived luminance of a color, from 0-1.
-     */
-    TinyColor.prototype.getLuminance = function () {
-        // http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef
-        var rgb = this.toRgb();
-        var R;
-        var G;
-        var B;
-        var RsRGB = rgb.r / 255;
-        var GsRGB = rgb.g / 255;
-        var BsRGB = rgb.b / 255;
-        if (RsRGB <= 0.03928) {
-            R = RsRGB / 12.92;
-        }
-        else {
-            // eslint-disable-next-line prefer-exponentiation-operator
-            R = Math.pow((RsRGB + 0.055) / 1.055, 2.4);
-        }
-        if (GsRGB <= 0.03928) {
-            G = GsRGB / 12.92;
-        }
-        else {
-            // eslint-disable-next-line prefer-exponentiation-operator
-            G = Math.pow((GsRGB + 0.055) / 1.055, 2.4);
-        }
-        if (BsRGB <= 0.03928) {
-            B = BsRGB / 12.92;
-        }
-        else {
-            // eslint-disable-next-line prefer-exponentiation-operator
-            B = Math.pow((BsRGB + 0.055) / 1.055, 2.4);
-        }
-        return 0.2126 * R + 0.7152 * G + 0.0722 * B;
-    };
-    /**
-     * Returns the alpha value of a color, from 0-1.
-     */
-    TinyColor.prototype.getAlpha = function () {
-        return this.a;
-    };
-    /**
-     * Sets the alpha value on the current color.
-     *
-     * @param alpha - The new alpha value. The accepted range is 0-1.
-     */
-    TinyColor.prototype.setAlpha = function (alpha) {
-        this.a = boundAlpha(alpha);
-        this.roundA = Math.round(100 * this.a) / 100;
-        return this;
-    };
-    /**
-     * Returns whether the color is monochrome.
-     */
-    TinyColor.prototype.isMonochrome = function () {
-        var s = this.toHsl().s;
-        return s === 0;
-    };
-    /**
-     * Returns the object as a HSVA object.
-     */
-    TinyColor.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 };
-    };
-    /**
-     * Returns the hsva values interpolated into a string with the following format:
-     * "hsva(xxx, xxx, xxx, xx)".
-     */
-    TinyColor.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, ")");
-    };
-    /**
-     * Returns the object as a HSLA object.
-     */
-    TinyColor.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 };
-    };
-    /**
-     * Returns the hsla values interpolated into a string with the following format:
-     * "hsla(xxx, xxx, xxx, xx)".
-     */
-    TinyColor.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, ")");
-    };
-    /**
-     * Returns the hex value of the color.
-     * @param allow3Char will shorten hex value to 3 char if possible
-     */
-    TinyColor.prototype.toHex = function (allow3Char) {
-        if (allow3Char === void 0) { allow3Char = false; }
-        return rgbToHex(this.r, this.g, this.b, allow3Char);
-    };
-    /**
-     * Returns the hex value of the color -with a # prefixed.
-     * @param allow3Char will shorten hex value to 3 char if possible
-     */
-    TinyColor.prototype.toHexString = function (allow3Char) {
-        if (allow3Char === void 0) { allow3Char = false; }
-        return '#' + this.toHex(allow3Char);
-    };
-    /**
-     * Returns the hex 8 value of the color.
-     * @param allow4Char will shorten hex value to 4 char if possible
-     */
-    TinyColor.prototype.toHex8 = function (allow4Char) {
-        if (allow4Char === void 0) { allow4Char = false; }
-        return rgbaToHex(this.r, this.g, this.b, this.a, allow4Char);
-    };
-    /**
-     * Returns the hex 8 value of the color -with a # prefixed.
-     * @param allow4Char will shorten hex value to 4 char if possible
-     */
-    TinyColor.prototype.toHex8String = function (allow4Char) {
-        if (allow4Char === void 0) { allow4Char = false; }
-        return '#' + this.toHex8(allow4Char);
-    };
-    /**
-     * Returns the shorter hex value of the color depends on its alpha -with a # prefixed.
-     * @param allowShortChar will shorten hex value to 3 or 4 char if possible
-     */
-    TinyColor.prototype.toHexShortString = function (allowShortChar) {
-        if (allowShortChar === void 0) { allowShortChar = false; }
-        return this.a === 1 ? this.toHexString(allowShortChar) : this.toHex8String(allowShortChar);
-    };
-    /**
-     * Returns the object as a RGBA object.
-     */
-    TinyColor.prototype.toRgb = function () {
-        return {
-            r: Math.round(this.r),
-            g: Math.round(this.g),
-            b: Math.round(this.b),
-            a: this.a,
-        };
-    };
-    /**
-     * Returns the RGBA values interpolated into a string with the following format:
-     * "RGBA(xxx, xxx, xxx, xx)".
-     */
-    TinyColor.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, ")");
-    };
-    /**
-     * Returns the object as a RGBA object.
-     */
-    TinyColor.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,
-        };
-    };
-    /**
-     * Returns the RGBA relative values interpolated into a string
-     */
-    TinyColor.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, ")");
-    };
-    /**
-     * The 'real' name of the color -if there is one.
-     */
-    TinyColor.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;
-    };
-    TinyColor.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) {
-            // Special case for "transparent", all other non-alpha formats
-            // will return rgba when there is transparency.
-            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();
-    };
-    TinyColor.prototype.toNumber = function () {
-        return (Math.round(this.r) << 16) + (Math.round(this.g) << 8) + Math.round(this.b);
-    };
-    TinyColor.prototype.clone = function () {
-        return new TinyColor(this.toString());
-    };
-    /**
-     * Lighten the color a given amount. Providing 100 will always return white.
-     * @param amount - valid between 1-100
-     */
-    TinyColor.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 TinyColor(hsl);
-    };
-    /**
-     * Brighten the color a given amount, from 0 to 100.
-     * @param amount - valid between 1-100
-     */
-    TinyColor.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 TinyColor(rgb);
-    };
-    /**
-     * Darken the color a given amount, from 0 to 100.
-     * Providing 100 will always return black.
-     * @param amount - valid between 1-100
-     */
-    TinyColor.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 TinyColor(hsl);
-    };
-    /**
-     * Mix the color with pure white, from 0 to 100.
-     * Providing 0 will do nothing, providing 100 will always return white.
-     * @param amount - valid between 1-100
-     */
-    TinyColor.prototype.tint = function (amount) {
-        if (amount === void 0) { amount = 10; }
-        return this.mix('white', amount);
-    };
-    /**
-     * Mix the color with pure black, from 0 to 100.
-     * Providing 0 will do nothing, providing 100 will always return black.
-     * @param amount - valid between 1-100
-     */
-    TinyColor.prototype.shade = function (amount) {
-        if (amount === void 0) { amount = 10; }
-        return this.mix('black', amount);
-    };
-    /**
-     * Desaturate the color a given amount, from 0 to 100.
-     * Providing 100 will is the same as calling greyscale
-     * @param amount - valid between 1-100
-     */
-    TinyColor.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 TinyColor(hsl);
-    };
-    /**
-     * Saturate the color a given amount, from 0 to 100.
-     * @param amount - valid between 1-100
-     */
-    TinyColor.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 TinyColor(hsl);
-    };
-    /**
-     * Completely desaturates a color into greyscale.
-     * Same as calling `desaturate(100)`
-     */
-    TinyColor.prototype.greyscale = function () {
-        return this.desaturate(100);
-    };
-    /**
-     * Spin takes a positive or negative amount within [-360, 360] indicating the change of hue.
-     * Values outside of this range will be wrapped into this range.
-     */
-    TinyColor.prototype.spin = function (amount) {
-        var hsl = this.toHsl();
-        var hue = (hsl.h + amount) % 360;
-        hsl.h = hue < 0 ? 360 + hue : hue;
-        return new TinyColor(hsl);
-    };
-    /**
-     * Mix the current color a given amount with another color, from 0 to 100.
-     * 0 means no mixing (return current color).
-     */
-    TinyColor.prototype.mix = function (color, amount) {
-        if (amount === void 0) { amount = 50; }
-        var rgb1 = this.toRgb();
-        var rgb2 = new TinyColor(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 TinyColor(rgba);
-    };
-    TinyColor.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 TinyColor(hsl));
-        }
-        return ret;
-    };
-    /**
-     * taken from https://github.com/infusion/jQuery-xcolor/blob/master/jquery.xcolor.js
-     */
-    TinyColor.prototype.complement = function () {
-        var hsl = this.toHsl();
-        hsl.h = (hsl.h + 180) % 360;
-        return new TinyColor(hsl);
-    };
-    TinyColor.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 TinyColor({ h: h, s: s, v: v }));
-            v = (v + modification) % 1;
-        }
-        return res;
-    };
-    TinyColor.prototype.splitcomplement = function () {
-        var hsl = this.toHsl();
-        var h = hsl.h;
-        return [
-            this,
-            new TinyColor({ h: (h + 72) % 360, s: hsl.s, l: hsl.l }),
-            new TinyColor({ h: (h + 216) % 360, s: hsl.s, l: hsl.l }),
-        ];
-    };
-    /**
-     * Compute how the color would appear on a background
-     */
-    TinyColor.prototype.onBackground = function (background) {
-        var fg = this.toRgb();
-        var bg = new TinyColor(background).toRgb();
-        var alpha = fg.a + bg.a * (1 - fg.a);
-        return new TinyColor({
-            r: (fg.r * fg.a + bg.r * bg.a * (1 - fg.a)) / alpha,
-            g: (fg.g * fg.a + bg.g * bg.a * (1 - fg.a)) / alpha,
-            b: (fg.b * fg.a + bg.b * bg.a * (1 - fg.a)) / alpha,
-            a: alpha,
-        });
-    };
-    /**
-     * Alias for `polyad(3)`
-     */
-    TinyColor.prototype.triad = function () {
-        return this.polyad(3);
-    };
-    /**
-     * Alias for `polyad(4)`
-     */
-    TinyColor.prototype.tetrad = function () {
-        return this.polyad(4);
-    };
-    /**
-     * Get polyad colors, like (for 1, 2, 3, 4, 5, 6, 7, 8, etc...)
-     * monad, dyad, triad, tetrad, pentad, hexad, heptad, octad, etc...
-     */
-    TinyColor.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 TinyColor({ h: (h + i * increment) % 360, s: hsl.s, l: hsl.l }));
-        }
-        return result;
-    };
-    /**
-     * compare color vs current color
-     */
-    TinyColor.prototype.equals = function (color) {
-        return this.toRgbString() === new TinyColor(color).toRgbString();
-    };
-    return TinyColor;
-}());
-
-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 = {};
-    const buttonColor = props.color;
-    if (buttonColor) {
-      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__$4 = defineComponent({
-  name: "ElButton"
-});
-const _sfc_main$4 = /* @__PURE__ */ defineComponent({
-  ...__default__$4,
-  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);
-    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(ns).b(),
-          unref(ns).m(unref(_type)),
-          unref(ns).m(unref(_size)),
-          unref(ns).is("disabled", unref(_disabled)),
-          unref(ns).is("loading", _ctx.loading),
-          unref(ns).is("plain", _ctx.plain),
-          unref(ns).is("round", _ctx.round),
-          unref(ns).is("circle", _ctx.circle),
-          unref(ns).is("text", _ctx.text),
-          unref(ns).is("link", _ctx.link),
-          unref(ns).is("has-bg", _ctx.bg)
-        ],
-        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$1(_sfc_main$4, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/button/src/button.vue"]]);
-
-const buttonGroupProps = {
-  size: buttonProps.size,
-  type: buttonProps.type
-};
-
-const __default__$3 = defineComponent({
-  name: "ElButtonGroup"
-});
-const _sfc_main$3 = /* @__PURE__ */ defineComponent({
-  ...__default__$3,
-  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$1(_sfc_main$3, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/button/src/button-group.vue"]]);
-
-const ElButton = withInstall(Button, {
-  ButtonGroup
-});
-const ElButtonGroup = withNoopInstall(ButtonGroup);
+import { withInstall } from '@das-fed/utils';
+import { defineComponent, ref, computed, watch, nextTick, openBlock, createElementBlock, normalizeClass, Fragment, renderList, createElementVNode, toDisplayString, renderSlot, createCommentVNode, normalizeStyle, onMounted, onBeforeUnmount, createVNode, createSlots, withCtx, normalizeProps, mergeProps, guardReactiveProps, createBlock } from 'vue';
+import { t, setI18nRule, setThemeRule } from '@das-fed/web';
+import { SizeWatcher } from '@das-fed/utils/size-watcher';
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 
@@ -3157,8 +18,49 @@ var dayjs_min = {exports: {}};
 var dayjs_minExports = dayjs_min.exports;
 var dayjs = /*@__PURE__*/getDefaultExportFromCjs(dayjs_minExports);
 
+const adjacentMonth = (start, end) => {
+  const firstMonthLastDay = start.endOf("month");
+  const lastMonthFirstDay = end.startOf("month");
+  const isSameWeek = firstMonthLastDay.isSame(lastMonthFirstDay, "week");
+  const lastMonthStartDay = isSameWeek ? lastMonthFirstDay.add(1, "week") : lastMonthFirstDay;
+  return [
+    [start, firstMonthLastDay],
+    [lastMonthStartDay.startOf("week"), end]
+  ];
+};
+const threeConsecutiveMonth = (start, end) => {
+  const firstMonthLastDay = start.endOf("month");
+  const secondMonthFirstDay = start.add(1, "month").startOf("month");
+  const secondMonthStartDay = firstMonthLastDay.isSame(
+    secondMonthFirstDay,
+    "week"
+  ) ? secondMonthFirstDay.add(1, "week") : secondMonthFirstDay;
+  const secondMonthLastDay = secondMonthStartDay.endOf("month");
+  const lastMonthFirstDay = end.startOf("month");
+  const lastMonthStartDay = secondMonthLastDay.isSame(lastMonthFirstDay, "week") ? lastMonthFirstDay.add(1, "week") : lastMonthFirstDay;
+  return [
+    [start, firstMonthLastDay],
+    [secondMonthStartDay.startOf("week"), secondMonthLastDay],
+    [lastMonthStartDay.startOf("week"), end]
+  ];
+};
+const calculateValidatedDateRange = (startDayjs, endDayjs) => {
+  const firstDay = startDayjs.startOf("week");
+  const lastDay = endDayjs.endOf("week");
+  const firstMonth = firstDay.get("month");
+  const lastMonth = lastDay.get("month");
+  if (firstMonth === lastMonth) {
+    return [[firstDay, lastDay]];
+  } else if ((firstMonth + 1) % 12 === lastMonth) {
+    return adjacentMonth(firstDay, lastDay);
+  } else if (firstMonth + 2 === lastMonth || (firstMonth + 1) % 11 === lastMonth) {
+    return threeConsecutiveMonth(firstDay, lastDay);
+  } else {
+    console.warn("start time and end time interval must not exceed two months");
+    return [];
+  }
+};
 const rangeArr = (n) => Array.from(Array.from({ length: n }).keys());
-
 const getPrevMonthLastDays = (date, count) => {
   const lastDay = date.subtract(1, "month").endOf("month").date();
   return rangeArr(count).map((_, index) => lastDay - (count - index - 1));
@@ -3171,24 +73,6 @@ const toNestedArr = (days) => rangeArr(days.length / 7).map((index) => {
   const start = index * 7;
   return days.slice(start, start + 7);
 });
-const dateTableProps = buildProps({
-  selectedDay: {
-    type: definePropType(Object)
-  },
-  range: {
-    type: definePropType(Array)
-  },
-  date: {
-    type: definePropType(Object),
-    required: true
-  },
-  hideHeader: {
-    type: Boolean
-  }
-});
-const dateTableEmits = {
-  pick: (value) => isObject$1(value)
-};
 
 var localeData$1 = {exports: {}};
 
@@ -3199,769 +83,611 @@ var localeData$1 = {exports: {}};
 var localeDataExports = localeData$1.exports;
 var localeData = /*@__PURE__*/getDefaultExportFromCjs(localeDataExports);
 
-const useDateTable = (props, emit) => {
-  dayjs.extend(localeData);
-  const firstDayOfWeek = dayjs.localeData().firstDayOfWeek();
-  const { t, lang } = useLocale();
-  const now = dayjs().locale(lang.value);
-  const isInRange = computed(() => !!props.range && !!props.range.length);
-  const rows = computed(() => {
-    let days = [];
-    if (isInRange.value) {
-      const [start, end] = props.range;
-      const currentMonthRange = rangeArr(end.date() - start.date() + 1).map((index) => ({
-        text: start.date() + index,
-        type: "current"
-      }));
-      let remaining = currentMonthRange.length % 7;
-      remaining = remaining === 0 ? 0 : 7 - remaining;
-      const nextMonthRange = rangeArr(remaining).map((_, index) => ({
-        text: index + 1,
-        type: "next"
-      }));
-      days = currentMonthRange.concat(nextMonthRange);
-    } else {
-      const firstDay = props.date.startOf("month").day();
-      const prevMonthDays = getPrevMonthLastDays(props.date, (firstDay - firstDayOfWeek + 7) % 7).map((day) => ({
-        text: day,
-        type: "prev"
-      }));
-      const currentMonthDays = getMonthDays(props.date).map((day) => ({
-        text: day,
-        type: "current"
-      }));
-      days = [...prevMonthDays, ...currentMonthDays];
-      const remaining = 7 - (days.length % 7 || 7);
-      const nextMonthDays = rangeArr(remaining).map((_, index) => ({
-        text: index + 1,
-        type: "next"
-      }));
-      days = days.concat(nextMonthDays);
-    }
-    return toNestedArr(days);
-  });
-  const weekDays = computed(() => {
-    const start = firstDayOfWeek;
-    if (start === 0) {
-      return WEEK_DAYS.map((_) => t(`el.datepicker.weeks.${_}`));
-    } else {
-      return WEEK_DAYS.slice(start).concat(WEEK_DAYS.slice(0, start)).map((_) => t(`el.datepicker.weeks.${_}`));
-    }
-  });
-  const getFormattedDate = (day, type) => {
-    switch (type) {
-      case "prev":
-        return props.date.startOf("month").subtract(1, "month").date(day);
-      case "next":
-        return props.date.startOf("month").add(1, "month").date(day);
-      case "current":
-        return props.date.date(day);
-    }
-  };
-  const handlePickDay = ({ text, type }) => {
-    const date = getFormattedDate(text, type);
-    emit("pick", date);
-  };
-  const getSlotData = ({ text, type }) => {
-    const day = getFormattedDate(text, type);
-    return {
-      isSelected: day.isSame(props.selectedDay),
-      type: `${type}-month`,
-      day: day.format("YYYY-MM-DD"),
-      date: day.toDate()
-    };
-  };
-  return {
-    now,
-    isInRange,
-    rows,
-    weekDays,
-    getFormattedDate,
-    handlePickDay,
-    getSlotData
-  };
+const __default__$1 = {
+  name: "calendar-table"
 };
-
-const _hoisted_1$1 = { key: 0 };
-const _hoisted_2$1 = ["onClick"];
-const __default__$2 = defineComponent({
-  name: "DateTable"
-});
-const _sfc_main$2 = /* @__PURE__ */ defineComponent({
-  ...__default__$2,
-  props: dateTableProps,
-  emits: dateTableEmits,
-  setup(__props, { expose, emit }) {
+var _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  ...__default__$1,
+  props: {
+    selectedDay: { type: null, required: false },
+    date: { type: null, required: true },
+    firstDayOfWeek: { type: Number, required: true },
+    range: { type: Array, required: false },
+    hideHeader: { type: Boolean, required: false },
+    parent: { type: null, required: true },
+    calendartType: { type: String, required: false },
+    highlightWeek: { type: Boolean, required: false },
+    highlightDay: { type: Boolean, required: false },
+    showZhou: { type: Boolean, required: false },
+    cellHeight: { type: Number, required: false }
+  },
+  emits: ["pick"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const emit = __emit;
+    const now = dayjs();
     const props = __props;
-    const {
-      isInRange,
-      now,
-      rows,
-      weekDays,
-      getFormattedDate,
-      handlePickDay,
-      getSlotData
-    } = useDateTable(props, emit);
-    const nsTable = useNamespace("calendar-table");
-    const nsDay = useNamespace("calendar-day");
+    const trHeight = ref("128px");
+    const tableRef = ref();
+    const tHeadHeight = 60;
+    const WEEK_DAYS = ["sun", "mon", "tue", "wed", "thu", "fri", "sat"];
+    const isInRange = computed(() => !!props.range && !!props.range.length);
+    const weekDays = computed(() => {
+      const start = props.firstDayOfWeek;
+      const str = props.showZhou ? `das-calendar-weeks-zhou-` : `das-calendar-weeks-`;
+      if (start === 0) {
+        return WEEK_DAYS.map((_) => t(`${str}${_}`));
+      } else {
+        return WEEK_DAYS.slice(start).concat(WEEK_DAYS.slice(0, start)).map((_) => t(`${str}${_}`));
+      }
+    });
+    const rows = computed(() => {
+      let days = [];
+      if (isInRange.value) {
+        const [start, end] = props.range;
+        let currentMonthRange = [];
+        if (start.isSame(end, "month")) {
+          currentMonthRange = rangeArr(end.date() - start.date() + 1).map((index) => ({
+            text: start.date() + index,
+            type: "current"
+          }));
+        } else {
+          currentMonthRange = rangeArr(start.endOf("month").date() - start.date() + 1).map((index) => ({
+            text: start.date() + index,
+            type: "current"
+          }));
+        }
+        let remaining = currentMonthRange.length % 7;
+        remaining = remaining === 0 ? 0 : 7 - remaining;
+        const nextMonthRange = rangeArr(remaining).map((_, index) => ({
+          text: index + 1,
+          type: "next"
+        }));
+        days = currentMonthRange.concat(nextMonthRange);
+      } else {
+        const firstDay = props.date.startOf("month").day();
+        const prevMonthDays = getPrevMonthLastDays(
+          props.date,
+          (firstDay - props.firstDayOfWeek + 7) % 7
+        ).map((day) => ({
+          text: day,
+          type: "prev"
+        }));
+        const currentMonthDays = getMonthDays(props.date).map((day) => ({
+          text: day,
+          type: "current"
+        }));
+        days = [...prevMonthDays, ...currentMonthDays];
+        const remaining = 7 - (days.length % 7 || 7);
+        const nextMonthDays = rangeArr(remaining).map((_, index) => ({
+          text: index + 1,
+          type: "next"
+        }));
+        days = days.concat(nextMonthDays);
+        if (props.calendartType == "simple" && days.length / 7 < 6) {
+          const num = nextMonthDays.length ? nextMonthDays[nextMonthDays.length - 1].text : 0;
+          const nextMonthWeekDays = rangeArr(7).map((_, index) => ({
+            text: num + index + 1,
+            type: "next"
+          }));
+          days = days.concat(nextMonthWeekDays);
+        }
+      }
+      return toNestedArr(days);
+    });
+    watch(
+      () => rows.value,
+      (val) => {
+        if (props.cellHeight) {
+          trHeight.value = `${props.cellHeight}px`;
+          return;
+        }
+        if (val && val.length) {
+          nextTick(() => {
+            const tableHeight = props.parent?.offsetHeight;
+            let height = Number(tableHeight) - tHeadHeight - 1;
+            trHeight.value = height / val.length - 1 + "px";
+            console.log("trHeight1", trHeight.value, height, val.length);
+          });
+        } else {
+          trHeight.value = "128px";
+        }
+        console.log("trHeight2", trHeight.value);
+      },
+      { immediate: true }
+    );
+    const getHeight = () => {
+      console.log("getHeight", rows.value, props.cellHeight);
+      if (props.cellHeight) {
+        trHeight.value = `${props.cellHeight}px`;
+        return;
+      }
+      nextTick(() => {
+        const tableHeight = props.parent?.offsetHeight;
+        let height = Number(tableHeight) - tHeadHeight;
+        console.log("height", tableHeight, height);
+        trHeight.value = height / rows.value.length - 1 * rows.value.length + "px";
+      });
+    };
+    const getFormattedDate = (day, type) => {
+      switch (type) {
+        case "prev":
+          return props.date.startOf("month").subtract(1, "month").date(day);
+        case "next":
+          return props.date.startOf("month").add(1, "month").date(day);
+        case "current":
+          return props.date.date(day);
+      }
+    };
     const getCellClass = ({ text, type }) => {
       const classes = [type];
-      if (type === "current") {
-        const date = getFormattedDate(text, type);
-        if (date.isSame(props.selectedDay, "day")) {
-          classes.push(nsDay.is("selected"));
+      const date = getFormattedDate(text, type);
+      if (date.isSame(props.selectedDay, "day")) {
+        classes.push("is-selected");
+      }
+      if (date.isSame(now, "day")) {
+        classes.push("is-today");
+      }
+      return classes;
+    };
+    const handlePickDay = ({ text, type }) => {
+      const date = getFormattedDate(text, type);
+      emit("pick", date);
+    };
+    const getWeekDay = (index) => {
+      const row = rows.value[0];
+      if (row) {
+        const currentDay = row[index];
+        if (currentDay) {
+          const { text, type } = currentDay;
+          const day = getFormattedDate(text, type);
+          return day.format("MM/DD");
         }
-        if (date.isSame(now, "day")) {
-          classes.push(nsDay.is("today"));
+      }
+      return "";
+    };
+    const getWeekSlotData = (index) => {
+      const row = rows.value[0];
+      if (row) {
+        const currentDay = row[index];
+        if (currentDay) {
+          const { text, type } = currentDay;
+          const day = getFormattedDate(text, type);
+          return {
+            isSelected: day.isSame(props.selectedDay),
+            type: `${type}-month`,
+            day: day.format("YYYY-MM-DD"),
+            date: day.toDate()
+          };
         }
       }
-      return classes;
+      return {
+        isSelected: null,
+        type: null,
+        day: null,
+        date: null
+      };
     };
-    expose({
-      getFormattedDate
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("table", {
-        class: normalizeClass([unref(nsTable).b(), unref(nsTable).is("range", unref(isInRange))]),
-        cellspacing: "0",
-        cellpadding: "0"
-      }, [
-        !_ctx.hideHeader ? (openBlock(), createElementBlock("thead", _hoisted_1$1, [
-          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(weekDays), (day) => {
-            return openBlock(), createElementBlock("th", { key: day }, toDisplayString(day), 1);
-          }), 128))
-        ])) : createCommentVNode("v-if", true),
-        createElementVNode("tbody", null, [
-          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(rows), (row, index) => {
-            return openBlock(), createElementBlock("tr", {
-              key: index,
-              class: normalizeClass({
-                [unref(nsTable).e("row")]: true,
-                [unref(nsTable).em("row", "hide-border")]: index === 0 && _ctx.hideHeader
-              })
-            }, [
-              (openBlock(true), createElementBlock(Fragment, null, renderList(row, (cell, key) => {
-                return openBlock(), createElementBlock("td", {
-                  key,
-                  class: normalizeClass(getCellClass(cell)),
-                  onClick: ($event) => unref(handlePickDay)(cell)
-                }, [
-                  createElementVNode("div", {
-                    class: normalizeClass(unref(nsDay).b())
-                  }, [
-                    renderSlot(_ctx.$slots, "date-cell", {
-                      data: unref(getSlotData)(cell)
-                    }, () => [
-                      createElementVNode("span", null, toDisplayString(cell.text), 1)
-                    ])
-                  ], 2)
-                ], 10, _hoisted_2$1);
-              }), 128))
-            ], 2);
-          }), 128))
-        ])
-      ], 2);
+    const getSlotData = ({ text, type }) => {
+      const day = getFormattedDate(text, type);
+      return {
+        isSelected: day.isSame(props.selectedDay),
+        type: `${type}-month`,
+        day: day.format("YYYY-MM-DD"),
+        date: day.toDate()
+      };
     };
+    __expose({
+      getHeight
+    });
+    const __returned__ = { emit, now, props, trHeight, tableRef, tHeadHeight, WEEK_DAYS, isInRange, weekDays, rows, getHeight, getFormattedDate, getCellClass, handlePickDay, getWeekDay, getWeekSlotData, getSlotData };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
   }
 });
-var DateTable = /* @__PURE__ */ _export_sfc$1(_sfc_main$2, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/calendar/src/date-table.vue"]]);
-
-const adjacentMonth = (start, end) => {
-  const firstMonthLastDay = start.endOf("month");
-  const lastMonthFirstDay = end.startOf("month");
-  const isSameWeek = firstMonthLastDay.isSame(lastMonthFirstDay, "week");
-  const lastMonthStartDay = isSameWeek ? lastMonthFirstDay.add(1, "week") : lastMonthFirstDay;
-  return [
-    [start, firstMonthLastDay],
-    [lastMonthStartDay.startOf("week"), end]
-  ];
-};
-const threeConsecutiveMonth = (start, end) => {
-  const firstMonthLastDay = start.endOf("month");
-  const secondMonthFirstDay = start.add(1, "month").startOf("month");
-  const secondMonthStartDay = firstMonthLastDay.isSame(secondMonthFirstDay, "week") ? secondMonthFirstDay.add(1, "week") : secondMonthFirstDay;
-  const secondMonthLastDay = secondMonthStartDay.endOf("month");
-  const lastMonthFirstDay = end.startOf("month");
-  const lastMonthStartDay = secondMonthLastDay.isSame(lastMonthFirstDay, "week") ? lastMonthFirstDay.add(1, "week") : lastMonthFirstDay;
-  return [
-    [start, firstMonthLastDay],
-    [secondMonthStartDay.startOf("week"), secondMonthLastDay],
-    [lastMonthStartDay.startOf("week"), end]
-  ];
-};
-const useCalendar = (props, emit, componentName) => {
-  const slots = useSlots();
-  const { lang } = useLocale();
-  const selectedDay = ref();
-  const now = dayjs().locale(lang.value);
-  const realSelectedDay = computed({
-    get() {
-      if (!props.modelValue)
-        return selectedDay.value;
-      return date.value;
-    },
-    set(val) {
-      if (!val)
-        return;
-      selectedDay.value = val;
-      const result = val.toDate();
-      emit(INPUT_EVENT, result);
-      emit(UPDATE_MODEL_EVENT, result);
-    }
-  });
-  const validatedRange = computed(() => {
-    if (!props.range)
-      return [];
-    const rangeArrDayjs = props.range.map((_) => dayjs(_).locale(lang.value));
-    const [startDayjs, endDayjs] = rangeArrDayjs;
-    if (startDayjs.isAfter(endDayjs)) {
-      debugWarn(componentName, "end time should be greater than start time");
-      return [];
-    }
-    if (startDayjs.isSame(endDayjs, "month")) {
-      return calculateValidatedDateRange(startDayjs, endDayjs);
-    } else {
-      if (startDayjs.add(1, "month").month() !== endDayjs.month()) {
-        debugWarn(componentName, "start time and end time interval must not exceed two months");
-        return [];
-      }
-      return calculateValidatedDateRange(startDayjs, endDayjs);
-    }
-  });
-  const date = computed(() => {
-    if (!props.modelValue) {
-      return realSelectedDay.value || (validatedRange.value.length ? validatedRange.value[0][0] : now);
-    } else {
-      return dayjs(props.modelValue).locale(lang.value);
-    }
-  });
-  const prevMonthDayjs = computed(() => date.value.subtract(1, "month").date(1));
-  const nextMonthDayjs = computed(() => date.value.add(1, "month").date(1));
-  const prevYearDayjs = computed(() => date.value.subtract(1, "year").date(1));
-  const nextYearDayjs = computed(() => date.value.add(1, "year").date(1));
-  const calculateValidatedDateRange = (startDayjs, endDayjs) => {
-    const firstDay = startDayjs.startOf("week");
-    const lastDay = endDayjs.endOf("week");
-    const firstMonth = firstDay.get("month");
-    const lastMonth = lastDay.get("month");
-    if (firstMonth === lastMonth) {
-      return [[firstDay, lastDay]];
-    } else if ((firstMonth + 1) % 12 === lastMonth) {
-      return adjacentMonth(firstDay, lastDay);
-    } else if (firstMonth + 2 === lastMonth || (firstMonth + 1) % 11 === lastMonth) {
-      return threeConsecutiveMonth(firstDay, lastDay);
-    } else {
-      debugWarn(componentName, "start time and end time interval must not exceed two months");
-      return [];
-    }
-  };
-  const pickDay = (day) => {
-    realSelectedDay.value = day;
-  };
-  const selectDate = (type) => {
-    const dateMap = {
-      "prev-month": prevMonthDayjs.value,
-      "next-month": nextMonthDayjs.value,
-      "prev-year": prevYearDayjs.value,
-      "next-year": nextYearDayjs.value,
-      today: now
-    };
-    const day = dateMap[type];
-    if (!day.isSame(date.value, "day")) {
-      pickDay(day);
-    }
-  };
-  useDeprecated({
-    from: '"dateCell"',
-    replacement: '"date-cell"',
-    scope: "ElCalendar",
-    version: "2.3.0",
-    ref: "https://element-plus.org/en-US/component/calendar.html#slots",
-    type: "Slot"
-  }, computed(() => !!slots.dateCell));
-  return {
-    calculateValidatedDateRange,
-    date,
-    realSelectedDay,
-    pickDay,
-    selectDate,
-    validatedRange
-  };
-};
 
-const isValidRange = (range) => isArray$1(range) && range.length === 2 && range.every((item) => isDate(item));
-const calendarProps = buildProps({
-  modelValue: {
-    type: Date
-  },
-  range: {
-    type: definePropType(Array),
-    validator: isValidRange
+var _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
   }
-});
-const calendarEmits = {
-  [UPDATE_MODEL_EVENT]: (value) => isDate(value),
-  [INPUT_EVENT]: (value) => isDate(value)
+  return target;
 };
 
-const COMPONENT_NAME = "ElCalendar";
-const __default__$1 = defineComponent({
-  name: COMPONENT_NAME
-});
-const _sfc_main$1 = /* @__PURE__ */ defineComponent({
-  ...__default__$1,
-  props: calendarProps,
-  emits: calendarEmits,
-  setup(__props, { expose, emit }) {
-    const props = __props;
-    const ns = useNamespace("calendar");
-    const {
-      calculateValidatedDateRange,
-      date,
-      pickDay,
-      realSelectedDay,
-      selectDate,
-      validatedRange
-    } = useCalendar(props, emit, COMPONENT_NAME);
-    const { t } = useLocale();
-    const i18nDate = computed(() => {
-      const pickedMonth = `el.datepicker.month${date.value.format("M")}`;
-      return `${date.value.year()} ${t("el.datepicker.year")} ${t(pickedMonth)}`;
-    });
-    expose({
-      selectedDay: realSelectedDay,
-      pickDay,
-      selectDate,
-      calculateValidatedDateRange
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        class: normalizeClass(unref(ns).b())
-      }, [
-        createElementVNode("div", {
-          class: normalizeClass(unref(ns).e("header"))
-        }, [
-          renderSlot(_ctx.$slots, "header", { date: unref(i18nDate) }, () => [
-            createElementVNode("div", {
-              class: normalizeClass(unref(ns).e("title"))
-            }, toDisplayString(unref(i18nDate)), 3),
-            unref(validatedRange).length === 0 ? (openBlock(), createElementBlock("div", {
-              key: 0,
-              class: normalizeClass(unref(ns).e("button-group"))
+const _hoisted_1$1 = { key: 0 };
+const _hoisted_2$1 = { class: "das-calendar-header-box" };
+const _hoisted_3$1 = { class: "das-calendar-header-week-line" };
+const _hoisted_4$1 = ["onClick"];
+function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
+  return $setup.rows.length ? (openBlock(), createElementBlock(
+    "table",
+    {
+      key: 0,
+      class: normalizeClass(["das-calendar-table", { "is-range": $setup.isInRange, "is-week": $props.calendartType == "week", simple: $props.calendartType == "simple" }]),
+      cellspacing: "0",
+      cellpadding: "0",
+      ref: "tableRef"
+    },
+    [
+      !$props.hideHeader ? (openBlock(), createElementBlock("thead", _hoisted_1$1, [
+        (openBlock(true), createElementBlock(
+          Fragment,
+          null,
+          renderList($setup.weekDays, (day, index) => {
+            return openBlock(), createElementBlock("th", {
+              class: "das-calendar-table-header",
+              key: day
             }, [
-              createVNode(unref(ElButtonGroup), null, {
-                default: withCtx(() => [
-                  createVNode(unref(ElButton), {
-                    size: "small",
-                    onClick: _cache[0] || (_cache[0] = ($event) => unref(selectDate)("prev-month"))
-                  }, {
-                    default: withCtx(() => [
-                      createTextVNode(toDisplayString(unref(t)("el.datepicker.prevMonth")), 1)
-                    ]),
-                    _: 1
-                  }),
-                  createVNode(unref(ElButton), {
-                    size: "small",
-                    onClick: _cache[1] || (_cache[1] = ($event) => unref(selectDate)("today"))
-                  }, {
-                    default: withCtx(() => [
-                      createTextVNode(toDisplayString(unref(t)("el.datepicker.today")), 1)
-                    ]),
-                    _: 1
-                  }),
-                  createVNode(unref(ElButton), {
-                    size: "small",
-                    onClick: _cache[2] || (_cache[2] = ($event) => unref(selectDate)("next-month"))
-                  }, {
-                    default: withCtx(() => [
-                      createTextVNode(toDisplayString(unref(t)("el.datepicker.nextMonth")), 1)
-                    ]),
-                    _: 1
-                  })
+              createElementVNode("div", _hoisted_2$1, [
+                createElementVNode("div", _hoisted_3$1, [
+                  createElementVNode(
+                    "div",
+                    {
+                      class: normalizeClass(["das-calendar-header-week", { highlight: $props.highlightWeek }])
+                    },
+                    toDisplayString(day),
+                    3
+                    /* TEXT, CLASS */
+                  ),
+                  $props.calendartType == "week" ? renderSlot(_ctx.$slots, "week-type", {
+                    key: 0,
+                    data: $setup.getWeekSlotData(index)
+                  }) : createCommentVNode("v-if", true)
                 ]),
-                _: 1
-              })
-            ], 2)) : createCommentVNode("v-if", true)
-          ])
-        ], 2),
-        unref(validatedRange).length === 0 ? (openBlock(), createElementBlock("div", {
-          key: 0,
-          class: normalizeClass(unref(ns).e("body"))
-        }, [
-          createVNode(DateTable, {
-            date: unref(date),
-            "selected-day": unref(realSelectedDay),
-            onPick: unref(pickDay)
-          }, createSlots({ _: 2 }, [
-            _ctx.$slots["date-cell"] || _ctx.$slots.dateCell ? {
-              name: "date-cell",
-              fn: withCtx((data) => [
-                _ctx.$slots["date-cell"] ? renderSlot(_ctx.$slots, "date-cell", normalizeProps(mergeProps({ key: 0 }, data))) : renderSlot(_ctx.$slots, "dateCell", normalizeProps(mergeProps({ key: 1 }, data)))
+                $props.calendartType == "week" ? (openBlock(), createElementBlock(
+                  "div",
+                  {
+                    key: 0,
+                    class: normalizeClass(["das-calendar-header-day", { highlight: $props.highlightDay }])
+                  },
+                  toDisplayString($setup.getWeekDay(index)),
+                  3
+                  /* TEXT, CLASS */
+                )) : createCommentVNode("v-if", true)
               ])
-            } : void 0
-          ]), 1032, ["date", "selected-day", "onPick"])
-        ], 2)) : (openBlock(), createElementBlock("div", {
-          key: 1,
-          class: normalizeClass(unref(ns).e("body"))
-        }, [
-          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(validatedRange), (range_, index) => {
-            return openBlock(), createBlock(DateTable, {
-              key: index,
-              date: range_[0],
-              "selected-day": unref(realSelectedDay),
-              range: range_,
-              "hide-header": index !== 0,
-              onPick: unref(pickDay)
-            }, createSlots({ _: 2 }, [
-              _ctx.$slots["date-cell"] || _ctx.$slots.dateCell ? {
-                name: "date-cell",
-                fn: withCtx((data) => [
-                  _ctx.$slots["date-cell"] ? renderSlot(_ctx.$slots, "date-cell", normalizeProps(mergeProps({ key: 0 }, data))) : renderSlot(_ctx.$slots, "dateCell", normalizeProps(mergeProps({ key: 1 }, data)))
-                ])
-              } : void 0
-            ]), 1032, ["date", "selected-day", "range", "hide-header", "onPick"]);
-          }), 128))
-        ], 2))
-      ], 2);
-    };
-  }
-});
-var Calendar = /* @__PURE__ */ _export_sfc$1(_sfc_main$1, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/calendar/src/calendar.vue"]]);
-
-const ElCalendar = withInstall(Calendar);
-
-/*! Element Plus v2.4.2 */
-
-var zhCn$1 = {
-  name: "zh-cn",
-  el: {
-    colorpicker: {
-      confirm: "\u786E\u5B9A",
-      clear: "\u6E05\u7A7A"
-    },
-    datepicker: {
-      now: "\u6B64\u523B",
-      today: "\u4ECA\u5929",
-      cancel: "\u53D6\u6D88",
-      clear: "\u6E05\u7A7A",
-      confirm: "\u786E\u5B9A",
-      selectDate: "\u9009\u62E9\u65E5\u671F",
-      selectTime: "\u9009\u62E9\u65F6\u95F4",
-      startDate: "\u5F00\u59CB\u65E5\u671F",
-      startTime: "\u5F00\u59CB\u65F6\u95F4",
-      endDate: "\u7ED3\u675F\u65E5\u671F",
-      endTime: "\u7ED3\u675F\u65F6\u95F4",
-      prevYear: "\u524D\u4E00\u5E74",
-      nextYear: "\u540E\u4E00\u5E74",
-      prevMonth: "\u4E0A\u4E2A\u6708",
-      nextMonth: "\u4E0B\u4E2A\u6708",
-      year: "\u5E74",
-      month1: "1 \u6708",
-      month2: "2 \u6708",
-      month3: "3 \u6708",
-      month4: "4 \u6708",
-      month5: "5 \u6708",
-      month6: "6 \u6708",
-      month7: "7 \u6708",
-      month8: "8 \u6708",
-      month9: "9 \u6708",
-      month10: "10 \u6708",
-      month11: "11 \u6708",
-      month12: "12 \u6708",
-      weeks: {
-        sun: "\u65E5",
-        mon: "\u4E00",
-        tue: "\u4E8C",
-        wed: "\u4E09",
-        thu: "\u56DB",
-        fri: "\u4E94",
-        sat: "\u516D"
-      },
-      months: {
-        jan: "\u4E00\u6708",
-        feb: "\u4E8C\u6708",
-        mar: "\u4E09\u6708",
-        apr: "\u56DB\u6708",
-        may: "\u4E94\u6708",
-        jun: "\u516D\u6708",
-        jul: "\u4E03\u6708",
-        aug: "\u516B\u6708",
-        sep: "\u4E5D\u6708",
-        oct: "\u5341\u6708",
-        nov: "\u5341\u4E00\u6708",
-        dec: "\u5341\u4E8C\u6708"
-      }
-    },
-    select: {
-      loading: "\u52A0\u8F7D\u4E2D",
-      noMatch: "\u65E0\u5339\u914D\u6570\u636E",
-      noData: "\u65E0\u6570\u636E",
-      placeholder: "\u8BF7\u9009\u62E9"
-    },
-    cascader: {
-      noMatch: "\u65E0\u5339\u914D\u6570\u636E",
-      loading: "\u52A0\u8F7D\u4E2D",
-      placeholder: "\u8BF7\u9009\u62E9",
-      noData: "\u6682\u65E0\u6570\u636E"
-    },
-    pagination: {
-      goto: "\u524D\u5F80",
-      pagesize: "\u6761/\u9875",
-      total: "\u5171 {total} \u6761",
-      pageClassifier: "\u9875",
-      page: "\u9875",
-      prev: "\u4E0A\u4E00\u9875",
-      next: "\u4E0B\u4E00\u9875",
-      currentPage: "\u7B2C {pager} \u9875",
-      prevPages: "\u5411\u524D {pager} \u9875",
-      nextPages: "\u5411\u540E {pager} \u9875",
-      deprecationWarning: "\u4F60\u4F7F\u7528\u4E86\u4E00\u4E9B\u5DF2\u88AB\u5E9F\u5F03\u7684\u7528\u6CD5\uFF0C\u8BF7\u53C2\u8003 el-pagination \u7684\u5B98\u65B9\u6587\u6863"
-    },
-    messagebox: {
-      title: "\u63D0\u793A",
-      confirm: "\u786E\u5B9A",
-      cancel: "\u53D6\u6D88",
-      error: "\u8F93\u5165\u7684\u6570\u636E\u4E0D\u5408\u6CD5!"
-    },
-    upload: {
-      deleteTip: "\u6309 delete \u952E\u53EF\u5220\u9664",
-      delete: "\u5220\u9664",
-      preview: "\u67E5\u770B\u56FE\u7247",
-      continue: "\u7EE7\u7EED\u4E0A\u4F20"
-    },
-    table: {
-      emptyText: "\u6682\u65E0\u6570\u636E",
-      confirmFilter: "\u7B5B\u9009",
-      resetFilter: "\u91CD\u7F6E",
-      clearFilter: "\u5168\u90E8",
-      sumText: "\u5408\u8BA1"
-    },
-    tree: {
-      emptyText: "\u6682\u65E0\u6570\u636E"
-    },
-    transfer: {
-      noMatch: "\u65E0\u5339\u914D\u6570\u636E",
-      noData: "\u65E0\u6570\u636E",
-      titles: ["\u5217\u8868 1", "\u5217\u8868 2"],
-      filterPlaceholder: "\u8BF7\u8F93\u5165\u641C\u7D22\u5185\u5BB9",
-      noCheckedFormat: "\u5171 {total} \u9879",
-      hasCheckedFormat: "\u5DF2\u9009 {checked}/{total} \u9879"
-    },
-    image: {
-      error: "\u52A0\u8F7D\u5931\u8D25"
-    },
-    pageHeader: {
-      title: "\u8FD4\u56DE"
-    },
-    popconfirm: {
-      confirmButtonText: "\u786E\u5B9A",
-      cancelButtonText: "\u53D6\u6D88"
-    }
-  }
-};
-
-var zhCn = {exports: {}};
-
-(function (module, exports) {
-	!function(e,_){module.exports=_(dayjs_minExports);}(commonjsGlobal,(function(e){function _(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var t=_(e),d={name:"zh-cn",weekdays:"星期日_星期一_星期二_星期三_星期四_星期五_星期六".split("_"),weekdaysShort:"周日_周一_周二_周三_周四_周五_周六".split("_"),weekdaysMin:"日_一_二_三_四_五_六".split("_"),months:"一月_二月_三月_四月_五月_六月_七月_八月_九月_十月_十一月_十二月".split("_"),monthsShort:"1月_2月_3月_4月_5月_6月_7月_8月_9月_10月_11月_12月".split("_"),ordinal:function(e,_){return "W"===_?e+"周":e+"日"},weekStart:1,yearStart:4,formats:{LT:"HH:mm",LTS:"HH:mm:ss",L:"YYYY/MM/DD",LL:"YYYY年M月D日",LLL:"YYYY年M月D日Ah点mm分",LLLL:"YYYY年M月D日ddddAh点mm分",l:"YYYY/M/D",ll:"YYYY年M月D日",lll:"YYYY年M月D日 HH:mm",llll:"YYYY年M月D日dddd HH:mm"},relativeTime:{future:"%s内",past:"%s前",s:"几秒",m:"1 分钟",mm:"%d 分钟",h:"1 小时",hh:"%d 小时",d:"1 天",dd:"%d 天",M:"1 个月",MM:"%d 个月",y:"1 年",yy:"%d 年"},meridiem:function(e,_){var t=100*e+_;return t<600?"凌晨":t<900?"早上":t<1100?"上午":t<1300?"中午":t<1800?"下午":"晚上"}};return t.default.locale(d,null,!0),d})); 
-} (zhCn));
+            ]);
+          }),
+          128
+          /* KEYED_FRAGMENT */
+        ))
+      ])) : createCommentVNode("v-if", true),
+      createElementVNode("tbody", null, [
+        (openBlock(true), createElementBlock(
+          Fragment,
+          null,
+          renderList($setup.rows, (row, index) => {
+            return openBlock(), createElementBlock(
+              "tr",
+              {
+                key: index,
+                class: normalizeClass({
+                  "das-calendar-table-row": true,
+                  "hide-border": index === 0 && $props.hideHeader
+                })
+              },
+              [
+                (openBlock(true), createElementBlock(
+                  Fragment,
+                  null,
+                  renderList(row, (cell, key) => {
+                    return openBlock(), createElementBlock("td", {
+                      key,
+                      class: normalizeClass($setup.getCellClass(cell)),
+                      onClick: ($event) => $setup.handlePickDay(cell)
+                    }, [
+                      createCommentVNode(" v-scrollbar "),
+                      createCommentVNode(' :style="{ height: trHeight }" '),
+                      createElementVNode(
+                        "div",
+                        {
+                          class: "das-calendar-day",
+                          style: normalizeStyle({ height: $setup.trHeight })
+                        },
+                        [
+                          renderSlot(_ctx.$slots, "date-cell", {
+                            data: $setup.getSlotData(cell)
+                          })
+                        ],
+                        4
+                        /* STYLE */
+                      )
+                    ], 10, _hoisted_4$1);
+                  }),
+                  128
+                  /* KEYED_FRAGMENT */
+                ))
+              ],
+              2
+              /* CLASS */
+            );
+          }),
+          128
+          /* KEYED_FRAGMENT */
+        ))
+      ])
+    ],
+    2
+    /* CLASS */
+  )) : createCommentVNode("v-if", true);
+}
+var calendarTable = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1], ["__file", "/Users/xiecp/das/das-fe/framework/packages/das-ui/packages/components/calendar/src/calendar-table.vue"]]);
 
-const _withScopeId = (n) => (pushScopeId("data-v-1746aeeb"), n = n(), popScopeId(), n);
-const _hoisted_1 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode(
-  "p",
-  null,
-  null,
-  -1
-  /* HOISTED */
-));
-const _hoisted_2 = ["onClick"];
-const _hoisted_3 = { class: "das-calendar-cell-cont" };
 const __default__ = {
-  name: "DasCalendar"
+  name: "test"
 };
 var _sfc_main = /* @__PURE__ */ defineComponent({
   ...__default__,
   props: {
     modelValue: { type: Date, required: true },
-    type: { type: String, required: false, default: "month" }
+    range: { type: Array, required: false },
+    type: { type: String, required: false, default: "month" },
+    isSwitchSelection: { type: Boolean, required: false, default: true },
+    isSwitchMonth: { type: Boolean, required: false, default: false },
+    highlightWeek: { type: Boolean, required: false, default: false },
+    highlightDay: { type: Boolean, required: false, default: true },
+    showZhou: { type: Boolean, required: false, default: true },
+    firstDayOfWeek: { type: Number, required: false, default: dayjs.localeData().firstDayOfWeek() },
+    cellHeight: { type: Number, required: false, default: 0 }
   },
   emits: ["update:model-value", "itemClick"],
   setup(__props, { expose: __expose, emit: __emit }) {
-    useCssVars((_ctx) => ({
-      "1746aeeb-trHeight": trHeight.value
-    }));
+    dayjs.extend(localeData);
     const props = __props;
-    const currValue = useModelValue(props, "modelValue");
-    const activeValue = ref();
-    const currRange = ref();
-    const $emit = __emit;
-    const attrs = useAttrs();
+    const emit = __emit;
     const $calendar = ref();
-    const locale = ref(zhCn$1);
-    const isShow = ref(false);
-    const tHeadHeight = 60;
-    const trHeight = ref("128px");
-    const tHeadDateFmt = computed(() => {
-      if (props.type === "week" && currRange.value) {
-        let basic = dayjs(currRange.value[0]);
-        let arr = [];
-        for (let i = 0; i < 7; i++) {
-          if (!i) {
-            arr.push(`--tHeadDateFmt${i + 1}: '${basic.format("MM-DD")}'`);
-          } else {
-            arr.push(`--tHeadDateFmt${i + 1}: '${basic.add(i, "day").format("MM-DD")}'`);
-          }
-        }
-        return arr.join(";");
-      } else {
-        let arr = [];
-        for (let i = 0; i < 7; i++) {
-          arr.push(`--tHeadDateFmt${i + 1}: ''`);
-        }
-        return arr.join(";");
+    const $calendarTable = ref();
+    const calendarSizeWatcher = ref();
+    const selectedDay = ref();
+    const now = dayjs();
+    const realSelectedDay = computed({
+      get() {
+        if (!props.modelValue) return selectedDay.value;
+        selectedDay.value = date.value;
+        return date.value;
+      },
+      set(val) {
+        if (!val) return;
+        selectedDay.value = val;
+        const result = val.toDate();
+        if (props.isSwitchMonth) emit("update:model-value", result);
       }
     });
-    const isActive = computed(() => (obj) => {
-      console.log(dayjs(obj.date).isSame(dayjs(activeValue.value), "day"));
-      return dayjs(obj.date).isSame(dayjs(activeValue.value), "day");
+    const currRange = computed(() => {
+      if (props.type == "week") {
+        if (props.range) return props.range;
+        const firstDay = dayjs(props.modelValue).day();
+        const preWeekDay = (firstDay - props.firstDayOfWeek + 7) % 7;
+        const nextWeekday = 7 - (preWeekDay + 1);
+        const arr = [];
+        arr.push(dayjs(props.modelValue).subtract(preWeekDay, "day").toDate());
+        arr.push(dayjs(props.modelValue).add(nextWeekday, "day").toDate());
+        return arr;
+      } else {
+        return props.range ? props.range : void 0;
+      }
     });
-    const cellClick = (obj) => {
-      console.log(obj);
-      setActive(obj.date);
-    };
-    const setActive = (val) => {
-      activeValue.value = val;
-      $emit("itemClick", activeValue.value);
-    };
-    watch(
-      () => currValue.value,
-      (newVal, oldVal) => {
-        console.log("watch-----", oldVal);
-        $emit("update:model-value", currValue.value);
-        init();
+    const validatedRange = computed(() => {
+      if (!currRange.value) return [];
+      const rangeArrDayjs = currRange.value.map((item) => dayjs(item));
+      const [startDayjs, endDayjs] = rangeArrDayjs;
+      if (props.type == "week") return [[startDayjs, endDayjs]];
+      if (startDayjs.isAfter(endDayjs)) {
+        console.warn("end time should be greater than start time");
+        return [];
       }
-    );
-    watch(
-      () => props.type,
-      (newVal, oldVal) => {
-        init();
+      if (startDayjs.isSame(endDayjs, "month")) {
+        return calculateValidatedDateRange(startDayjs, endDayjs);
+      } else {
+        if (startDayjs.add(1, "month").month() !== endDayjs.month()) {
+          console.warn("start time and end time interval must not exceed two months");
+          return [];
+        }
+        return calculateValidatedDateRange(startDayjs, endDayjs);
       }
-    );
-    const init = () => {
-      console.log("--------------------init------------------");
-      currValue.value = props.modelValue;
-      if (props.type == "week") {
-        currRange.value = [dayjs(currValue.value).startOf("week").toDate(), dayjs(currValue.value).endOf("week").toDate()];
+    });
+    const date = computed(() => {
+      if (!props.modelValue) {
+        return realSelectedDay.value || (validatedRange.value.length ? validatedRange.value[0][0] : now);
       } else {
-        currRange.value = void 0;
+        return dayjs(props.modelValue);
       }
-      nextTick(() => {
-        const Dom = $calendar.value?.$el;
-        const trDomLength = Dom.querySelectorAll(".el-calendar__body .el-calendar-table .el-calendar-table__row")?.length;
-        console.log(Number(Dom.offsetHeight));
-        console.log(trDomLength);
-        if (Dom && trDomLength) {
-          let height = Number(Dom.offsetHeight) - tHeadHeight - 1;
-          trHeight.value = height / trDomLength - 1 + "px";
+    });
+    const prevMonthDayjs = computed(() => date.value.subtract(1, "month").date(1));
+    const nextMonthDayjs = computed(() => date.value.add(1, "month").date(1));
+    const prevYearDayjs = computed(() => date.value.subtract(1, "year").date(1));
+    const nextYearDayjs = computed(() => date.value.add(1, "year").date(1));
+    const i18nDate = computed(() => {
+      const pickedMonth = `das-calendar-month${date.value.format("M")}`;
+      return `${date.value.year()} ${t("das-calendar-year")} ${t(pickedMonth)}`;
+    });
+    onMounted(() => {
+      calendarSizeWatcher.value = SizeWatcher(() => {
+        if (Array.isArray($calendarTable.value)) {
+          $calendarTable.value[0]?.getHeight();
         } else {
-          trHeight.value = "128px";
+          $calendarTable.value?.getHeight();
         }
-        const dayDom = Dom.querySelectorAll(".el-calendar-day");
-        console.log(dayDom);
-        for (let i = 0; i < dayDom.length; i++) {
-          dayDom[i].style.height = trHeight.value;
-        }
-      });
+      }, $calendar.value);
+    });
+    onBeforeUnmount(() => {
+      calendarSizeWatcher.value.disconnect();
+    });
+    const pickDay = (day) => {
+      if (props.isSwitchSelection) realSelectedDay.value = day;
+      emit("itemClick", day.toDate());
+    };
+    const selectDate = (type) => {
+      const dateMap = {
+        "prev-month": prevMonthDayjs.value,
+        "next-month": nextMonthDayjs.value,
+        "prev-year": prevYearDayjs.value,
+        "next-year": nextYearDayjs.value,
+        today: now
+      };
+      const day = dateMap[type];
+      if (!day.isSame(date.value, "day")) {
+        pickDay(day);
+      }
     };
-    const initDay = () => {
-      isShow.value = true;
+    const setActive = (val) => {
+      realSelectedDay.value = dayjs(val);
+      emit("itemClick", val);
     };
-    onMounted(() => {
-      initDay();
-      nextTick(() => {
-        activeValue.value = currValue.value;
-        init();
-      });
-    });
     __expose({
       $calendar,
       setActive
     });
-    return (_ctx, _cache) => {
-      return isShow.value ? (openBlock(), createElementBlock(
-        "div",
-        {
-          key: 0,
-          class: normalizeClass(["das-ui-calendar", props.type == "week" ? "week" : ""]),
-          style: normalizeStyle(tHeadDateFmt.value)
-        },
-        [
-          createVNode(unref(ElConfigProvider), { locale: locale.value }, {
-            default: withCtx(() => [
-              createVNode(unref(ElCalendar), mergeProps(unref(attrs), {
-                ref_key: "$calendar",
-                ref: $calendar,
-                "model-value": unref(currValue),
-                range: currRange.value
-              }), {
-                header: withCtx(({}) => [
-                  renderSlot(_ctx.$slots, "header", {}, () => [
-                    _hoisted_1
-                  ], true)
-                ]),
-                "date-cell": withCtx((dataObj) => [
-                  createElementVNode("div", {
-                    class: "das-calendar-cell",
-                    onClick: () => cellClick(dataObj.data)
-                  }, [
-                    createElementVNode(
-                      "p",
-                      {
-                        class: normalizeClass(["das-calendar-cell-date", isActive.value(dataObj.data) ? "is-active" : ""])
-                      },
-                      [
-                        createElementVNode(
-                          "span",
-                          null,
-                          toDisplayString(Number(dataObj.data.day.split("-").slice(2)).toString()),
-                          1
-                          /* TEXT */
-                        )
-                      ],
-                      2
-                      /* CLASS */
-                    ),
-                    withDirectives((openBlock(), createElementBlock("div", _hoisted_3, [
-                      renderSlot(_ctx.$slots, "date-cell", normalizeProps(guardReactiveProps(dataObj)), void 0, true)
-                    ])), [
-                      [unref(vScrollbar)]
-                    ])
-                  ], 8, _hoisted_2)
-                ]),
-                _: 3
-                /* FORWARDED */
-              }, 16, ["model-value", "range"])
-            ]),
-            _: 3
-            /* FORWARDED */
-          }, 8, ["locale"])
-        ],
-        6
-        /* CLASS, STYLE */
-      )) : createCommentVNode("v-if", true);
-    };
+    const __returned__ = { props, emit, $calendar, $calendarTable, calendarSizeWatcher, selectedDay, now, realSelectedDay, currRange, validatedRange, date, prevMonthDayjs, nextMonthDayjs, prevYearDayjs, nextYearDayjs, i18nDate, pickDay, selectDate, setActive, calendarTable };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
   }
 });
 
-var _export_sfc = (sfc, props) => {
-  const target = sfc.__vccOpts || sfc;
-  for (const [key, val] of props) {
-    target[key] = val;
-  }
-  return target;
-};
-
-var calendar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-1746aeeb"], ["__file", "E:\\company-code\\v6r3\\framework-3\\packages\\das-ui\\packages\\components\\calendar\\src\\Index.vue"]]);
+const _hoisted_1 = {
+  ref: "$calendar",
+  class: "das-ui-calendar"
+};
+const _hoisted_2 = {
+  key: 0,
+  class: "das-calendar-body 1"
+};
+const _hoisted_3 = {
+  key: 1,
+  class: "das-calendar-cell-date"
+};
+const _hoisted_4 = {
+  key: 2,
+  class: "das-calendar-cell-cont"
+};
+const _hoisted_5 = {
+  key: 1,
+  class: "das-calendar-body 2"
+};
+const _hoisted_6 = {
+  key: 1,
+  class: "das-calendar-cell-date"
+};
+const _hoisted_7 = {
+  key: 2,
+  class: "das-calendar-cell-cont"
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock(
+    "div",
+    _hoisted_1,
+    [
+      createCommentVNode(` <div class="das-calendar-header" >
+      <slot name="header" :date="i18nDate">
+        <div class="das-calendar-title" >{{ i18nDate }}</div>
+        <div class="das-calendar-button-group" v-if="validatedRange.length === 0" >
+          <das-button @click="selectDate('prev-month')" >  {{ t('das-calendar-prevMonth') }}</das-button>
+          <das-button @click="selectDate('today')" >  {{ t('das-calendar-today') }}</das-button>
+          <das-button @click="selectDate('next-month')" >  {{ t('das-calendar-nextMonth') }}</das-button>
+        </div>
+      </slot>
+    </div> `),
+      $setup.validatedRange.length === 0 ? (openBlock(), createElementBlock("div", _hoisted_2, [
+        createVNode($setup["calendarTable"], {
+          ref: "$calendarTable",
+          date: $setup.date,
+          firstDayOfWeek: $props.firstDayOfWeek,
+          parent: $setup.$calendar,
+          calendartType: $props.type,
+          highlightWeek: $props.highlightWeek,
+          highlightDay: $props.highlightDay,
+          showZhou: $props.showZhou,
+          cellHeight: $props.cellHeight,
+          "selected-day": $setup.selectedDay,
+          onPick: $setup.pickDay
+        }, createSlots({
+          "date-cell": withCtx((data) => [
+            _ctx.$slots.custom ? renderSlot(_ctx.$slots, "custom", normalizeProps(mergeProps({ key: 0 }, data))) : createCommentVNode("v-if", true),
+            $props.type != "week" && !_ctx.$slots.custom ? (openBlock(), createElementBlock("p", _hoisted_3, [
+              createElementVNode(
+                "span",
+                null,
+                toDisplayString(Number(data.data.day.split("-").slice(2)).toString()),
+                1
+                /* TEXT */
+              ),
+              renderSlot(_ctx.$slots, "date-type", normalizeProps(guardReactiveProps(data)))
+            ])) : createCommentVNode("v-if", true),
+            !_ctx.$slots.custom ? (openBlock(), createElementBlock("div", _hoisted_4, [
+              renderSlot(_ctx.$slots, "date-cell", normalizeProps(guardReactiveProps(data)))
+            ])) : createCommentVNode("v-if", true)
+          ]),
+          _: 2
+          /* DYNAMIC */
+        }, [
+          _ctx.$slots["week-type"] && $props.type == "week" ? {
+            name: "week-type",
+            fn: withCtx((data) => [
+              renderSlot(_ctx.$slots, "week-type", normalizeProps(guardReactiveProps(data)))
+            ]),
+            key: "0"
+          } : void 0
+        ]), 1032, ["date", "firstDayOfWeek", "parent", "calendartType", "highlightWeek", "highlightDay", "showZhou", "cellHeight", "selected-day"])
+      ])) : (openBlock(), createElementBlock("div", _hoisted_5, [
+        (openBlock(true), createElementBlock(
+          Fragment,
+          null,
+          renderList($setup.validatedRange, (range_, index) => {
+            return openBlock(), createBlock($setup["calendarTable"], {
+              ref_for: true,
+              ref: "$calendarTable",
+              key: index,
+              firstDayOfWeek: $props.firstDayOfWeek,
+              date: range_[0],
+              calendartType: $props.type,
+              highlightWeek: $props.highlightWeek,
+              highlightDay: $props.highlightDay,
+              showZhou: $props.showZhou,
+              cellHeight: $props.cellHeight,
+              "selected-day": $setup.selectedDay,
+              range: range_,
+              parent: $setup.$calendar,
+              "hide-header": index !== 0,
+              onPick: $setup.pickDay
+            }, createSlots({
+              "date-cell": withCtx((data) => [
+                _ctx.$slots.custom ? renderSlot(_ctx.$slots, "custom", mergeProps({
+                  key: 0,
+                  ref_for: true
+                }, data)) : createCommentVNode("v-if", true),
+                $props.type != "week" && !_ctx.$slots.custom ? (openBlock(), createElementBlock("p", _hoisted_6, [
+                  createElementVNode(
+                    "span",
+                    null,
+                    toDisplayString(Number(data.data.day.split("-").slice(2)).toString()),
+                    1
+                    /* TEXT */
+                  )
+                ])) : createCommentVNode("v-if", true),
+                !_ctx.$slots.custom ? (openBlock(), createElementBlock("div", _hoisted_7, [
+                  renderSlot(_ctx.$slots, "date-cell", mergeProps({ ref_for: true }, data))
+                ])) : createCommentVNode("v-if", true)
+              ]),
+              _: 2
+              /* DYNAMIC */
+            }, [
+              _ctx.$slots["week-type"] && $props.type == "week" ? {
+                name: "week-type",
+                fn: withCtx((data) => [
+                  renderSlot(_ctx.$slots, "week-type", mergeProps({ ref_for: true }, data))
+                ]),
+                key: "0"
+              } : void 0
+            ]), 1032, ["firstDayOfWeek", "date", "calendartType", "highlightWeek", "highlightDay", "showZhou", "cellHeight", "selected-day", "range", "parent", "hide-header"]);
+          }),
+          128
+          /* KEYED_FRAGMENT */
+        ))
+      ]))
+    ],
+    512
+    /* NEED_PATCH */
+  );
+}
+var calendar = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/xiecp/das/das-fe/framework/packages/das-ui/packages/components/calendar/src/Index.vue"]]);
 
 var theme = {
   "--das-ui-calendar-color-primary": "#5582F3",
@@ -3976,14 +702,64 @@ var theme = {
   // 表格头部提示文字颜色
   "--das-ui-calendar-size-head-tip": "12px",
   // 表格头部提示文字大小
-  "--das-ui-calendar-span-size": "24px"
+  "--das-ui-calendar-span-size": "28px",
   // 日期高亮区域的宽高size
+  "--das-ui-calendar-color-pre-next": "#B2B2B2"
+  // 上/下一个月文字颜色
   // '--das-ui-calendar-head-height': '60px', // 日历表头高度
   // '--das-ui-calendar-cell-height': '128px', // 单元格高度
 };
 
+var i18n = {
+  "das-calendar-prevMonth": { "zh-CN": "\u4E0A\u4E2A\u6708", en: "Previous Month" },
+  "das-calendar-nextMonth": { "zh-CN": "\u4E0B\u4E2A\u6708", en: "Next Month" },
+  "das-calendar-prevYear": { "zh-CN": "\u524D\u4E00\u5E74", en: "Previous Year" },
+  "das-calendar-nextYear": { "zh-CN": "\u540E\u4E00\u5E74", en: "Next Year" },
+  "das-calendar-year": { "zh-CN": "\u5E74", en: "" },
+  "das-calendar-today": { "zh-CN": "\u4ECA\u5929", en: "Today" },
+  "das-calendar-month1": { "zh-CN": "1 \u6708", en: "January" },
+  "das-calendar-month2": { "zh-CN": "2 \u6708", en: "February" },
+  "das-calendar-month3": { "zh-CN": "3 \u6708", en: "March" },
+  "das-calendar-month4": { "zh-CN": "4 \u6708", en: "April" },
+  "das-calendar-month5": { "zh-CN": "5 \u6708", en: "May" },
+  "das-calendar-month6": { "zh-CN": "6 \u6708", en: "June" },
+  "das-calendar-month7": { "zh-CN": "7 \u6708", en: "July" },
+  "das-calendar-month8": { "zh-CN": "8 \u6708", en: "August" },
+  "das-calendar-month9": { "zh-CN": "9 \u6708", en: "September" },
+  "das-calendar-month10": { "zh-CN": "10 \u6708", en: "October" },
+  "das-calendar-month11": { "zh-CN": "11 \u6708", en: "November" },
+  "das-calendar-month12": { "zh-CN": "12 \u6708", en: "December" },
+  "das-calendar-weeks-sun": { "zh-CN": "\u65E5", en: "Sun" },
+  "das-calendar-weeks-mon": { "zh-CN": "\u4E00", en: "Mon" },
+  "das-calendar-weeks-tue": { "zh-CN": "\u4E8C", en: "Tue" },
+  "das-calendar-weeks-wed": { "zh-CN": "\u4E09", en: "Wed" },
+  "das-calendar-weeks-thu": { "zh-CN": "\u56DB", en: "Thu" },
+  "das-calendar-weeks-fri": { "zh-CN": "\u4E94", en: "Fri" },
+  "das-calendar-weeks-sat": { "zh-CN": "\u516D", en: "Sat" },
+  "das-calendar-weeks-zhou-sun": { "zh-CN": "\u5468\u65E5", en: "Sun" },
+  "das-calendar-weeks-zhou-mon": { "zh-CN": "\u5468\u4E00", en: "Mon" },
+  "das-calendar-weeks-zhou-tue": { "zh-CN": "\u5468\u4E8C", en: "Tue" },
+  "das-calendar-weeks-zhou-wed": { "zh-CN": "\u5468\u4E09", en: "Wed" },
+  "das-calendar-weeks-zhou-thu": { "zh-CN": "\u5468\u56DB", en: "Thu" },
+  "das-calendar-weeks-zhou-fri": { "zh-CN": "\u5468\u4E94", en: "Fri" },
+  "das-calendar-weeks-zhou-sat": { "zh-CN": "\u5468\u516D", en: "Sat" },
+  "das-calendar-months-jan": { "zh-CN": "\u4E00\u6708", en: "Jan" },
+  "das-calendar-months-feb": { "zh-CN": "\u4E8C\u6708", en: "Feb" },
+  "das-calendar-months-mar": { "zh-CN": "\u4E09\u6708", en: "Mar" },
+  "das-calendar-months-apr": { "zh-CN": "\u56DB\u6708", en: "Apr" },
+  "das-calendar-months-may": { "zh-CN": "\u4E94\u6708", en: "May" },
+  "das-calendar-months-jun": { "zh-CN": "\u516D\u6708", en: "Jun" },
+  "das-calendar-months-jul": { "zh-CN": "\u4E03\u6708", en: "Jul" },
+  "das-calendar-months-aug": { "zh-CN": "\u516B\u6708", en: "Aug" },
+  "das-calendar-months-sep": { "zh-CN": "\u4E5D\u6708", en: "Sep" },
+  "das-calendar-months-oct": { "zh-CN": "\u5341\u6708", en: "Oct" },
+  "das-calendar-months-nov": { "zh-CN": "\u5341\u4E00\u6708", en: "Nov" },
+  "das-calendar-months-dec": { "zh-CN": "\u5341\u4E8C\u6708", en: "Dec" }
+};
+
+setI18nRule(i18n);
 setThemeRule(theme);
-const DasCalendar = withInstall$1(calendar);
+const DasCalendar = withInstall(calendar);
 var index = { name: "calendar \u65E5\u5386" };
 
 export { DasCalendar, index as default };