element-plus 1.2.0-beta.5 → 1.2.0-beta.6

package/dist/index.full.mjs

@@ -1,6 +1,6 @@
-/*! Element Plus v1.2.0-beta.5 */
+/*! Element Plus v1.2.0-beta.6 */
 
-import { getCurrentInstance, computed, warn, inject, unref, provide, ref, isRef, watch, onScopeDispose, readonly, getCurrentScope, shallowRef, watchSyncEffect, onMounted, nextTick, openBlock, createBlock, createCommentVNode, isVNode, Fragment, Comment, camelize as camelize$1, onUnmounted, h as h$1, Teleport, toRef, Transition, renderSlot, toDisplayString, cloneVNode, withDirectives, defineComponent, reactive, createElementBlock, normalizeStyle, createElementVNode, normalizeClass, mergeProps, createVNode, resolveComponent, withCtx, resolveDynamicComponent, createTextVNode, vShow, onUpdated, withModifiers, onBeforeUnmount, onActivated, onDeactivated, resolveDirective, withKeys, createSlots, renderList, Text, normalizeProps, guardReactiveProps, toRefs, vModelCheckbox, vModelRadio, onBeforeUpdate, vModelText, toHandlers, watchEffect, effectScope, markRaw, toRaw, triggerRef, onBeforeMount, TransitionGroup, render as render$2s } from 'vue';
+import { getCurrentInstance, computed, warn, unref, ref, inject, toRef, provide, isRef, watch, onScopeDispose, readonly, getCurrentScope, shallowRef, watchSyncEffect, onMounted, nextTick, openBlock, createBlock, createCommentVNode, isVNode, Fragment, Comment, camelize as camelize$1, onUnmounted, h as h$1, Teleport, Transition, renderSlot, toDisplayString, cloneVNode, withDirectives, defineComponent, reactive, createElementBlock, normalizeStyle, createElementVNode, normalizeClass, mergeProps, resolveComponent, withCtx, resolveDynamicComponent, createTextVNode, createVNode, vShow, onUpdated, withModifiers, onBeforeUnmount, onActivated, onDeactivated, resolveDirective, withKeys, createSlots, renderList, Text, normalizeProps, guardReactiveProps, toRefs, vModelCheckbox, vModelRadio, onBeforeUpdate, vModelText, toHandlers, watchEffect, effectScope, markRaw, toRaw, triggerRef, onBeforeMount, TransitionGroup, createApp, render as render$1S } from 'vue';
 
 let $ELEMENT = {};
 const setConfig = (option) => {
@@ -69,32 +69,6 @@ const useAttrs = (params = {}) => {
   });
 };
 
-const useFocus = (el) => {
-  return {
-    focus: () => {
-      var _a, _b;
-      (_b = (_a = el.value) == null ? void 0 : _a.focus) == null ? void 0 : _b.call(_a);
-    }
-  };
-};
-
-const elFormKey = Symbol("elForm");
-const elFormItemKey = Symbol("elFormItem");
-
-const buttonGroupContextKey = Symbol("buttonGroupContextKey");
-
-const elBreadcrumbKey = Symbol("elBreadcrumbKey");
-
-const elPaginationKey = Symbol("elPaginationKey");
-
-const configProviderContextKey = Symbol();
-
-const radioGroupKey = Symbol("radioGroupKey");
-
-const tabsRootContextKey = Symbol("tabsRootContextKey");
-
-const scrollbarContextKey = Symbol("scrollbarContextKey");
-
 /**
  * Make a map and return a function for checking if a key
  * is in that map.
@@ -132,49 +106,16 @@ const camelizeRE = /-(\w)/g;
 const camelize = cacheStringFunction((str) => {
     return str.replace(camelizeRE, (_, c) => (c ? c.toUpperCase() : ''));
 });
+const hyphenateRE = /\B([A-Z])/g;
+/**
+ * @private
+ */
+const hyphenate = cacheStringFunction((str) => str.replace(hyphenateRE, '-$1').toLowerCase());
 /**
  * @private
  */
 const capitalize = cacheStringFunction((str) => str.charAt(0).toUpperCase() + str.slice(1));
 
-const wrapperKey = Symbol();
-const propKey = Symbol();
-function buildProp(option, key) {
-  if (!isObject$a(option) || !!option[propKey])
-    return option;
-  const { values, required, default: defaultValue, type, validator } = option;
-  const _validator = values || validator ? (val) => {
-    let valid = false;
-    let allowedValues = [];
-    if (values) {
-      allowedValues = [...values, 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;
-  return {
-    type: typeof type === "object" && Object.getOwnPropertySymbols(type).includes(wrapperKey) ? type[wrapperKey] : type,
-    required: !!required,
-    default: defaultValue,
-    validator: _validator,
-    [propKey]: true
-  };
-}
-const buildProps = (props) => fromPairs_1(Object.entries(props).map(([key, option]) => [
-  key,
-  buildProp(option, key)
-]));
-const definePropType = (val) => ({ [wrapperKey]: val });
-const keyOf = (arr) => Object.keys(arr);
-const mutable = (val) => val;
-const componentSize = ["large", "medium", "small", "mini"];
-
 /**
  * Removes all key-value entries from the list cache.
  *
@@ -2684,40 +2625,107 @@ const refAttacher = (ref) => {
   };
 };
 
-const sizes = ["", ...componentSize];
-const useFormItemProps = buildProps({
-  size: {
-    type: String,
-    values: sizes,
-    default: ""
-  },
-  disabled: Boolean
-});
-const useFormItem = ({ size, disabled } = {}) => {
-  var _a;
-  const vm = getCurrentInstance();
-  const $ELEMENT = useGlobalConfig$1();
-  const props = (_a = vm.proxy) == null ? void 0 : _a.$props;
+const elFormKey = Symbol("elForm");
+const elFormItemKey = Symbol("elFormItem");
+
+const buttonGroupContextKey = Symbol("buttonGroupContextKey");
+
+const elBreadcrumbKey = Symbol("elBreadcrumbKey");
+
+const elPaginationKey = Symbol("elPaginationKey");
+
+const configProviderContextKey = Symbol();
+
+const radioGroupKey = Symbol("radioGroupKey");
+
+const tabsRootContextKey = Symbol("tabsRootContextKey");
+
+const scrollbarContextKey = Symbol("scrollbarContextKey");
+
+const wrapperKey = Symbol();
+const propKey = Symbol();
+function buildProp(option, key) {
+  if (!isObject$a(option) || !!option[propKey])
+    return option;
+  const { values, required, default: defaultValue, type, validator } = option;
+  const _validator = values || validator ? (val) => {
+    let valid = false;
+    let allowedValues = [];
+    if (values) {
+      allowedValues = [...values, 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;
+  return {
+    type: typeof type === "object" && Object.getOwnPropertySymbols(type).includes(wrapperKey) ? type[wrapperKey] : type,
+    required: !!required,
+    default: defaultValue,
+    validator: _validator,
+    [propKey]: true
+  };
+}
+const buildProps = (props) => fromPairs_1(Object.entries(props).map(([key, option]) => [
+  key,
+  buildProp(option, key)
+]));
+const definePropType = (val) => ({ [wrapperKey]: val });
+const keyOf = (arr) => Object.keys(arr);
+const mutable = (val) => val;
+const componentSize = ["large", "medium", "small", "mini"];
+
+const useSizeProp = buildProp({
+  type: String,
+  values: ["", ...componentSize],
+  default: ""
+});
+const useSize = (fallback, ignore = {}) => {
+  const emptyRef = ref(void 0);
+  const size = ignore.prop ? emptyRef : useProp("size");
+  const globalConfig = ignore.global ? emptyRef : useGlobalConfig("size");
+  const globalConfigLegacy = ignore.global ? { size: void 0 } : useGlobalConfig$1();
+  const form = ignore.form ? { size: void 0 } : inject(elFormKey, void 0);
+  const formItem = ignore.formItem ? { size: void 0 } : inject(elFormItemKey, void 0);
+  return computed(() => size.value || unref(fallback) || (formItem == null ? void 0 : formItem.size) || (form == null ? void 0 : form.size) || globalConfig.value || globalConfigLegacy.size || "");
+};
+const useDisabled$1 = (fallback) => {
+  const disabled = useProp("disabled");
+  const form = inject(elFormKey, void 0);
+  return computed(() => disabled.value || unref(fallback) || (form == null ? void 0 : form.disabled) || false);
+};
+
+const useFocus = (el) => {
+  return {
+    focus: () => {
+      var _a, _b;
+      (_b = (_a = el.value) == null ? void 0 : _a.focus) == null ? void 0 : _b.call(_a);
+    }
+  };
+};
+
+const useFormItem = () => {
   const form = inject(elFormKey, void 0);
   const formItem = inject(elFormItemKey, void 0);
   return {
-    size: computed(() => {
-      return props.size || unref(size) || (formItem == null ? void 0 : formItem.size) || (form == null ? void 0 : form.size) || $ELEMENT.size || "";
-    }),
-    disabled: computed(() => {
-      return props.disabled === true || unref(disabled) || (form == null ? void 0 : form.disabled) || false;
-    }),
     form,
     formItem
   };
 };
 
-const defaultConfig = {
-  button: {
-    autoInsertSpace: false
+function useGlobalConfig(key) {
+  const config = inject(configProviderContextKey, {});
+  if (key) {
+    return toRef(config, key);
+  } else {
+    return config;
   }
-};
-const useGlobalConfig = () => inject(configProviderContextKey, defaultConfig);
+}
 
 var baseGetTag = _baseGetTag,
     isObjectLike$3 = isObjectLike_1;
@@ -3230,7 +3238,7 @@ const useLocaleProps = buildProps({
   }
 });
 const localeContextKey = Symbol("localeContextKey");
-let localeContextCache;
+let cache$1;
 const provideLocale = () => {
   const vm = getCurrentInstance();
   const props = vm.props;
@@ -3242,11 +3250,14 @@ const provideLocale = () => {
     lang,
     t
   };
-  localeContextCache = provides;
+  cache$1 = provides;
   provide(localeContextKey, provides);
 };
-const buildTranslator = (locale) => (path) => translate(path, unref(locale));
-const translate = (path, locale) => get_1(locale, path, "");
+const buildTranslator = (locale) => (path, option) => translate(path, option, unref(locale));
+const translate = (path, option, locale) => get_1(locale, path, path).replace(/\{(\w+)\}/g, (_, key) => {
+  var _a;
+  return `${(_a = option == null ? void 0 : option[key]) != null ? _a : `{${key}}`}`;
+});
 const localeProviderMaker = (locale = English) => {
   const lang = ref(locale.name);
   const localeRef = ref(locale);
@@ -3257,7 +3268,7 @@ const localeProviderMaker = (locale = English) => {
   };
 };
 const useLocale = () => {
-  return inject(localeContextKey, localeContextCache || localeProviderMaker(English));
+  return inject(localeContextKey, cache$1 || localeProviderMaker(English));
 };
 
 let scrollBarWidth;
@@ -3442,6 +3453,9 @@ const useLockscreen = (trigger) => {
   if (!isRef(trigger)) {
     throwError("[useLockscreen]", "You need to pass a ref param to this function");
   }
+  if (isServer || hasClass(document.body, "el-popup-parent--hidden")) {
+    return;
+  }
   let scrollBarWidth = 0;
   let withoutHiddenClass = false;
   let bodyPaddingRight = "0";
@@ -3725,7 +3739,8 @@ const EVENT_CODE = {
   down: "ArrowDown",
   esc: "Escape",
   delete: "Delete",
-  backspace: "Backspace"
+  backspace: "Backspace",
+  numpadEnter: "NumpadEnter"
 };
 const FOCUSABLE_ELEMENT_SELECTORS = `a[href],button:not([disabled]),button:not([hidden]),:not([tabindex="-1"]),input:not([disabled]),input:not([type="hidden"]),select:not([disabled]),textarea:not([disabled])`;
 const isVisible = (element) => {
@@ -6563,6 +6578,14 @@ const usePreventGlobal = (indicator, evt, cb) => {
   }, { immediate: true });
 };
 
+const useProp = (name) => {
+  const vm = getCurrentInstance();
+  return computed(() => {
+    var _a, _b;
+    return (_b = (_a = vm.proxy) == null ? void 0 : _a.$props[name]) != null ? _b : void 0;
+  });
+};
+
 const useRestoreActive = (toggle, initialFocus) => {
   let previousActive;
   watch(() => toggle.value, (val) => {
@@ -6625,7 +6648,7 @@ const useThrottleRender = (loading, throttle = 0) => {
   return throttled;
 };
 
-const version$1 = "1.2.0-beta.5";
+const version$1 = "1.2.0-beta.6";
 
 const makeInstaller = (components = []) => {
   const apps = [];
@@ -6638,9 +6661,7 @@ const makeInstaller = (components = []) => {
     if (apps.includes(app))
       return;
     apps.push(app);
-    components.forEach((c) => {
-      app.use(c);
-    });
+    components.forEach((c) => app.use(c));
     if (option.locale) {
       const localeProvides = localeProviderMaker(opts.locale);
       app.provide(localeContextKey, localeProvides);
@@ -6653,7 +6674,6 @@ const makeInstaller = (components = []) => {
     install
   };
 };
-var makeInstaller$1 = makeInstaller;
 
 const withInstall = (main, extra) => {
   main.install = (app) => {
@@ -6703,7 +6723,7 @@ const affixEmits = {
   change: (fixed) => typeof fixed === "boolean"
 };
 
-var script$2y = defineComponent({
+var script$1Y = defineComponent({
   name: "ElAffix",
   props: affixProps,
   emits: affixEmits,
@@ -6801,7 +6821,7 @@ var script$2y = defineComponent({
   }
 });
 
-function render$2r(_ctx, _cache, $props, $setup, $data, $options) {
+function render$1R(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("div", {
     ref: "root",
     class: "el-affix",
@@ -6816,10 +6836,10 @@ function render$2r(_ctx, _cache, $props, $setup, $data, $options) {
   ], 4);
 }
 
-script$2y.render = render$2r;
-script$2y.__file = "packages/components/affix/src/affix.vue";
+script$1Y.render = render$1R;
+script$1Y.__file = "packages/components/affix/src/affix.vue";
 
-const ElAffix = withInstall(script$2y);
+const ElAffix = withInstall(script$1Y);
 
 const iconProps = buildProps({
   size: {
@@ -6830,7 +6850,7 @@ const iconProps = buildProps({
   }
 });
 
-var script$2x = defineComponent({
+var script$1X = defineComponent({
   name: "ElIcon",
   inheritAttrs: false,
   props: iconProps,
@@ -6853,7 +6873,7 @@ var script$2x = defineComponent({
   }
 });
 
-function render$2q(_ctx, _cache, $props, $setup, $data, $options) {
+function render$1Q(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("i", mergeProps({
     class: "el-icon",
     style: _ctx.style
@@ -6862,931 +6882,901 @@ function render$2q(_ctx, _cache, $props, $setup, $data, $options) {
   ], 16);
 }
 
-script$2x.render = render$2q;
-script$2x.__file = "packages/components/icon/src/icon.vue";
+script$1X.render = render$1Q;
+script$1X.__file = "packages/components/icon/src/icon.vue";
 
-const ElIcon = withInstall(script$2x);
+const ElIcon = withInstall(script$1X);
 var ElIcon$1 = ElIcon;
 
-var script$2w = defineComponent({
+var _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
+};
+
+const _sfc_main$B = defineComponent({
   name: "ArrowDown"
 });
-
 const _hoisted_1$1Y = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1z = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1z = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M831.872 340.864 512 652.672 192.128 340.864a30.592 30.592 0 0 0-42.752 0 29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728 30.592 30.592 0 0 0-42.752 0z"
+  d: "M831.872 340.864L512 652.672 192.128 340.864a30.592 30.592 0 00-42.752 0 29.12 29.12 0 000 41.6L489.664 714.24a32 32 0 0044.672 0l340.288-331.712a29.12 29.12 0 000-41.728 30.592 30.592 0 00-42.752 0z"
 }, null, -1);
-function render$2p(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1Y, [
-    _hoisted_2$1z
-  ]);
+const _hoisted_3$1m = [
+  _hoisted_2$1z
+];
+function _sfc_render$B(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1Y, _hoisted_3$1m);
 }
+var arrowDown = /* @__PURE__ */ _export_sfc(_sfc_main$B, [["render", _sfc_render$B]]);
 
-script$2w.render = render$2p;
-script$2w.__file = "packages/components/ArrowDown.vue";
-
-var ArrowDown = script$2w;
-
-var script$2v = defineComponent({
+const _sfc_main$A = defineComponent({
   name: "ArrowLeft"
 });
-
 const _hoisted_1$1X = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1y = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1y = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"
+  d: "M609.408 149.376L277.76 489.6a32 32 0 000 44.672l331.648 340.352a29.12 29.12 0 0041.728 0 30.592 30.592 0 000-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 000-42.688 29.12 29.12 0 00-41.728 0z"
 }, null, -1);
-function render$2o(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1X, [
-    _hoisted_2$1y
-  ]);
+const _hoisted_3$1l = [
+  _hoisted_2$1y
+];
+function _sfc_render$A(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1X, _hoisted_3$1l);
 }
+var arrowLeft = /* @__PURE__ */ _export_sfc(_sfc_main$A, [["render", _sfc_render$A]]);
 
-script$2v.render = render$2o;
-script$2v.__file = "packages/components/ArrowLeft.vue";
-
-var ArrowLeft = script$2v;
-
-var script$2u = defineComponent({
-  name: "ArrowUp"
+const _sfc_main$z = defineComponent({
+  name: "ArrowRight"
 });
-
 const _hoisted_1$1W = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1x = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1x = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "m488.832 344.32-339.84 356.672a32 32 0 0 0 0 44.16l.384.384a29.44 29.44 0 0 0 42.688 0l320-335.872 319.872 335.872a29.44 29.44 0 0 0 42.688 0l.384-.384a32 32 0 0 0 0-44.16L535.168 344.32a32 32 0 0 0-46.336 0z"
+  d: "M340.864 149.312a30.592 30.592 0 000 42.752L652.736 512 340.864 831.872a30.592 30.592 0 000 42.752 29.12 29.12 0 0041.728 0L714.24 534.336a32 32 0 000-44.672L382.592 149.376a29.12 29.12 0 00-41.728 0z"
 }, null, -1);
-function render$2n(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1W, [
-    _hoisted_2$1x
-  ]);
+const _hoisted_3$1k = [
+  _hoisted_2$1x
+];
+function _sfc_render$z(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1W, _hoisted_3$1k);
 }
+var arrowRight = /* @__PURE__ */ _export_sfc(_sfc_main$z, [["render", _sfc_render$z]]);
 
-script$2u.render = render$2n;
-script$2u.__file = "packages/components/ArrowUp.vue";
-
-var ArrowUp = script$2u;
+const _sfc_main$y = defineComponent({
+  name: "ArrowUp"
+});
+const _hoisted_1$1V = {
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+const _hoisted_2$1w = /* @__PURE__ */ createElementVNode("path", {
+  fill: "currentColor",
+  d: "M488.832 344.32l-339.84 356.672a32 32 0 000 44.16l.384.384a29.44 29.44 0 0042.688 0l320-335.872 319.872 335.872a29.44 29.44 0 0042.688 0l.384-.384a32 32 0 000-44.16L535.168 344.32a32 32 0 00-46.336 0z"
+}, null, -1);
+const _hoisted_3$1j = [
+  _hoisted_2$1w
+];
+function _sfc_render$y(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1V, _hoisted_3$1j);
+}
+var arrowUp = /* @__PURE__ */ _export_sfc(_sfc_main$y, [["render", _sfc_render$y]]);
 
-var script$2t = defineComponent({
+const _sfc_main$x = defineComponent({
   name: "Back"
 });
-
-const _hoisted_1$1V = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+const _hoisted_1$1U = {
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1w = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1v = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M224 480h640a32 32 0 1 1 0 64H224a32 32 0 0 1 0-64z"
+  d: "M224 480h640a32 32 0 110 64H224a32 32 0 010-64z"
 }, null, -1);
-const _hoisted_3$Q = /* @__PURE__ */ createVNode("path", {
+const _hoisted_3$1i = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "m237.248 512 265.408 265.344a32 32 0 0 1-45.312 45.312l-288-288a32 32 0 0 1 0-45.312l288-288a32 32 0 1 1 45.312 45.312L237.248 512z"
+  d: "M237.248 512l265.408 265.344a32 32 0 01-45.312 45.312l-288-288a32 32 0 010-45.312l288-288a32 32 0 1145.312 45.312L237.248 512z"
 }, null, -1);
-function render$2m(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1V, [
-    _hoisted_2$1w,
-    _hoisted_3$Q
-  ]);
+const _hoisted_4$A = [
+  _hoisted_2$1v,
+  _hoisted_3$1i
+];
+function _sfc_render$x(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1U, _hoisted_4$A);
 }
+var back = /* @__PURE__ */ _export_sfc(_sfc_main$x, [["render", _sfc_render$x]]);
 
-script$2t.render = render$2m;
-script$2t.__file = "packages/components/Back.vue";
-
-var Back = script$2t;
-
-var script$2s = defineComponent({
+const _sfc_main$w = defineComponent({
   name: "Calendar"
 });
-
-const _hoisted_1$1U = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+const _hoisted_1$1T = {
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1v = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1u = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64H128zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0v32zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64zm0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64zm192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64zm0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64zm192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64zm0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64z"
+  d: "M128 384v512h768V192H768v32a32 32 0 11-64 0v-32H320v32a32 32 0 01-64 0v-32H128v128h768v64H128zm192-256h384V96a32 32 0 1164 0v32h160a32 32 0 0132 32v768a32 32 0 01-32 32H96a32 32 0 01-32-32V160a32 32 0 0132-32h160V96a32 32 0 0164 0v32zm-32 384h64a32 32 0 010 64h-64a32 32 0 010-64zm0 192h64a32 32 0 110 64h-64a32 32 0 110-64zm192-192h64a32 32 0 010 64h-64a32 32 0 010-64zm0 192h64a32 32 0 110 64h-64a32 32 0 110-64zm192-192h64a32 32 0 110 64h-64a32 32 0 110-64zm0 192h64a32 32 0 110 64h-64a32 32 0 110-64z"
 }, null, -1);
-function render$2l(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1U, [
-    _hoisted_2$1v
-  ]);
+const _hoisted_3$1h = [
+  _hoisted_2$1u
+];
+function _sfc_render$w(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1T, _hoisted_3$1h);
 }
+var calendar = /* @__PURE__ */ _export_sfc(_sfc_main$w, [["render", _sfc_render$w]]);
 
-script$2s.render = render$2l;
-script$2s.__file = "packages/components/Calendar.vue";
-
-var Calendar = script$2s;
-
-var script$2r = defineComponent({
+const _sfc_main$v = defineComponent({
   name: "CaretRight"
 });
-
-const _hoisted_1$1T = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+const _hoisted_1$1S = {
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1u = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1t = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M384 192v640l384-320.064z"
 }, null, -1);
-function render$2k(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1T, [
-    _hoisted_2$1u
-  ]);
+const _hoisted_3$1g = [
+  _hoisted_2$1t
+];
+function _sfc_render$v(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1S, _hoisted_3$1g);
 }
+var caretRight = /* @__PURE__ */ _export_sfc(_sfc_main$v, [["render", _sfc_render$v]]);
 
-script$2r.render = render$2k;
-script$2r.__file = "packages/components/CaretRight.vue";
-
-var CaretRight = script$2r;
-
-var script$2q = defineComponent({
+const _sfc_main$u = defineComponent({
   name: "CaretTop"
 });
-
-const _hoisted_1$1S = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+const _hoisted_1$1R = {
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1t = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1s = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M512 320 192 704h639.936z"
+  d: "M512 320L192 704h639.936z"
 }, null, -1);
-function render$2j(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1S, [
-    _hoisted_2$1t
-  ]);
+const _hoisted_3$1f = [
+  _hoisted_2$1s
+];
+function _sfc_render$u(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1R, _hoisted_3$1f);
 }
+var caretTop = /* @__PURE__ */ _export_sfc(_sfc_main$u, [["render", _sfc_render$u]]);
 
-script$2q.render = render$2j;
-script$2q.__file = "packages/components/CaretTop.vue";
-
-var CaretTop = script$2q;
-
-var script$2p = defineComponent({
+const _sfc_main$t = defineComponent({
   name: "Check"
 });
-
-const _hoisted_1$1R = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+const _hoisted_1$1Q = {
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1s = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1r = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M406.656 706.944 195.84 496.256a32 32 0 1 0-45.248 45.248l256 256 512-512a32 32 0 0 0-45.248-45.248L406.592 706.944z"
+  d: "M406.656 706.944L195.84 496.256a32 32 0 10-45.248 45.248l256 256 512-512a32 32 0 00-45.248-45.248L406.592 706.944z"
 }, null, -1);
-function render$2i(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1R, [
-    _hoisted_2$1s
-  ]);
+const _hoisted_3$1e = [
+  _hoisted_2$1r
+];
+function _sfc_render$t(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1Q, _hoisted_3$1e);
 }
+var check = /* @__PURE__ */ _export_sfc(_sfc_main$t, [["render", _sfc_render$t]]);
 
-script$2p.render = render$2i;
-script$2p.__file = "packages/components/Check.vue";
-
-var Check = script$2p;
-
-var script$2o = defineComponent({
+const _sfc_main$s = defineComponent({
   name: "CircleCheckFilled"
 });
-
-const _hoisted_1$1Q = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+const _hoisted_1$1P = {
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1r = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1q = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm-55.808 536.384-99.52-99.584a38.4 38.4 0 1 0-54.336 54.336l126.72 126.72a38.272 38.272 0 0 0 54.336 0l262.4-262.464a38.4 38.4 0 1 0-54.272-54.336L456.192 600.384z"
+  d: "M512 64a448 448 0 110 896 448 448 0 010-896zm-55.808 536.384l-99.52-99.584a38.4 38.4 0 10-54.336 54.336l126.72 126.72a38.272 38.272 0 0054.336 0l262.4-262.464a38.4 38.4 0 10-54.272-54.336L456.192 600.384z"
 }, null, -1);
-function render$2h(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1Q, [
-    _hoisted_2$1r
-  ]);
+const _hoisted_3$1d = [
+  _hoisted_2$1q
+];
+function _sfc_render$s(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1P, _hoisted_3$1d);
 }
+var circleCheckFilled = /* @__PURE__ */ _export_sfc(_sfc_main$s, [["render", _sfc_render$s]]);
 
-script$2o.render = render$2h;
-script$2o.__file = "packages/components/CircleCheckFilled.vue";
-
-var CircleCheckFilled = script$2o;
-
-var script$2n = defineComponent({
+const _sfc_main$r = defineComponent({
   name: "CircleCheck"
 });
-
-const _hoisted_1$1P = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+const _hoisted_1$1O = {
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1q = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1p = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768zm0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896z"
+  d: "M512 896a384 384 0 100-768 384 384 0 000 768zm0 64a448 448 0 110-896 448 448 0 010 896z"
 }, null, -1);
-const _hoisted_3$P = /* @__PURE__ */ createVNode("path", {
+const _hoisted_3$1c = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M745.344 361.344a32 32 0 0 1 45.312 45.312l-288 288a32 32 0 0 1-45.312 0l-160-160a32 32 0 1 1 45.312-45.312L480 626.752l265.344-265.408z"
+  d: "M745.344 361.344a32 32 0 0145.312 45.312l-288 288a32 32 0 01-45.312 0l-160-160a32 32 0 1145.312-45.312L480 626.752l265.344-265.408z"
 }, null, -1);
-function render$2g(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1P, [
-    _hoisted_2$1q,
-    _hoisted_3$P
-  ]);
+const _hoisted_4$z = [
+  _hoisted_2$1p,
+  _hoisted_3$1c
+];
+function _sfc_render$r(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1O, _hoisted_4$z);
 }
+var circleCheck = /* @__PURE__ */ _export_sfc(_sfc_main$r, [["render", _sfc_render$r]]);
 
-script$2n.render = render$2g;
-script$2n.__file = "packages/components/CircleCheck.vue";
-
-var CircleCheck = script$2n;
-
-var script$2m = defineComponent({
+const _sfc_main$q = defineComponent({
   name: "CircleCloseFilled"
 });
-
-const _hoisted_1$1O = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+const _hoisted_1$1N = {
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1p = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1o = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm0 393.664L407.936 353.6a38.4 38.4 0 1 0-54.336 54.336L457.664 512 353.6 616.064a38.4 38.4 0 1 0 54.336 54.336L512 566.336 616.064 670.4a38.4 38.4 0 1 0 54.336-54.336L566.336 512 670.4 407.936a38.4 38.4 0 1 0-54.336-54.336L512 457.664z"
+  d: "M512 64a448 448 0 110 896 448 448 0 010-896zm0 393.664L407.936 353.6a38.4 38.4 0 10-54.336 54.336L457.664 512 353.6 616.064a38.4 38.4 0 1054.336 54.336L512 566.336 616.064 670.4a38.4 38.4 0 1054.336-54.336L566.336 512 670.4 407.936a38.4 38.4 0 10-54.336-54.336L512 457.664z"
 }, null, -1);
-function render$2f(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1O, [
-    _hoisted_2$1p
-  ]);
+const _hoisted_3$1b = [
+  _hoisted_2$1o
+];
+function _sfc_render$q(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1N, _hoisted_3$1b);
 }
+var circleCloseFilled = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["render", _sfc_render$q]]);
 
-script$2m.render = render$2f;
-script$2m.__file = "packages/components/CircleCloseFilled.vue";
-
-var CircleCloseFilled = script$2m;
-
-var script$2l = defineComponent({
+const _sfc_main$p = defineComponent({
   name: "CircleClose"
 });
-
-const _hoisted_1$1N = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+const _hoisted_1$1M = {
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1o = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1n = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "m466.752 512-90.496-90.496a32 32 0 0 1 45.248-45.248L512 466.752l90.496-90.496a32 32 0 1 1 45.248 45.248L557.248 512l90.496 90.496a32 32 0 1 1-45.248 45.248L512 557.248l-90.496 90.496a32 32 0 0 1-45.248-45.248L466.752 512z"
+  d: "M466.752 512l-90.496-90.496a32 32 0 0145.248-45.248L512 466.752l90.496-90.496a32 32 0 1145.248 45.248L557.248 512l90.496 90.496a32 32 0 11-45.248 45.248L512 557.248l-90.496 90.496a32 32 0 01-45.248-45.248L466.752 512z"
 }, null, -1);
-const _hoisted_3$O = /* @__PURE__ */ createVNode("path", {
+const _hoisted_3$1a = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768zm0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896z"
+  d: "M512 896a384 384 0 100-768 384 384 0 000 768zm0 64a448 448 0 110-896 448 448 0 010 896z"
 }, null, -1);
-function render$2e(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1N, [
-    _hoisted_2$1o,
-    _hoisted_3$O
-  ]);
-}
-
-script$2l.render = render$2e;
-script$2l.__file = "packages/components/CircleClose.vue";
-
-var CircleClose = script$2l;
-
-var script$2k = defineComponent({
-  name: "ArrowRight"
-});
-
-const _hoisted_1$1M = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
-};
-const _hoisted_2$1n = /* @__PURE__ */ createVNode("path", {
-  fill: "currentColor",
-  d: "M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"
-}, null, -1);
-function render$2d(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1M, [
-    _hoisted_2$1n
-  ]);
+const _hoisted_4$y = [
+  _hoisted_2$1n,
+  _hoisted_3$1a
+];
+function _sfc_render$p(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1M, _hoisted_4$y);
 }
+var circleClose = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["render", _sfc_render$p]]);
 
-script$2k.render = render$2d;
-script$2k.__file = "packages/components/ArrowRight.vue";
-
-var ArrowRight = script$2k;
-
-var script$2j = defineComponent({
+const _sfc_main$o = defineComponent({
   name: "Clock"
 });
-
 const _hoisted_1$1L = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1m = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1m = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768zm0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896z"
+  d: "M512 896a384 384 0 100-768 384 384 0 000 768zm0 64a448 448 0 110-896 448 448 0 010 896z"
 }, null, -1);
-const _hoisted_3$N = /* @__PURE__ */ createVNode("path", {
+const _hoisted_3$19 = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M480 256a32 32 0 0 1 32 32v256a32 32 0 0 1-64 0V288a32 32 0 0 1 32-32z"
+  d: "M480 256a32 32 0 0132 32v256a32 32 0 01-64 0V288a32 32 0 0132-32z"
 }, null, -1);
-const _hoisted_4$x = /* @__PURE__ */ createVNode("path", {
+const _hoisted_4$x = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M480 512h256q32 0 32 32t-32 32H480q-32 0-32-32t32-32z"
 }, null, -1);
-function render$2c(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1L, [
-    _hoisted_2$1m,
-    _hoisted_3$N,
-    _hoisted_4$x
-  ]);
+const _hoisted_5$p = [
+  _hoisted_2$1m,
+  _hoisted_3$19,
+  _hoisted_4$x
+];
+function _sfc_render$o(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1L, _hoisted_5$p);
 }
+var clock = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["render", _sfc_render$o]]);
 
-script$2j.render = render$2c;
-script$2j.__file = "packages/components/Clock.vue";
-
-var Clock = script$2j;
-
-var script$2i = defineComponent({
+const _sfc_main$n = defineComponent({
   name: "Close"
 });
-
 const _hoisted_1$1K = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1l = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1l = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M764.288 214.592 512 466.88 259.712 214.592a31.936 31.936 0 0 0-45.12 45.12L466.752 512 214.528 764.224a31.936 31.936 0 1 0 45.12 45.184L512 557.184l252.288 252.288a31.936 31.936 0 0 0 45.12-45.12L557.12 512.064l252.288-252.352a31.936 31.936 0 1 0-45.12-45.184z"
+  d: "M764.288 214.592L512 466.88 259.712 214.592a31.936 31.936 0 00-45.12 45.12L466.752 512 214.528 764.224a31.936 31.936 0 1045.12 45.184L512 557.184l252.288 252.288a31.936 31.936 0 0045.12-45.12L557.12 512.064l252.288-252.352a31.936 31.936 0 10-45.12-45.184z"
 }, null, -1);
-function render$2b(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1K, [
-    _hoisted_2$1l
-  ]);
+const _hoisted_3$18 = [
+  _hoisted_2$1l
+];
+function _sfc_render$n(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1K, _hoisted_3$18);
 }
+var close$2 = /* @__PURE__ */ _export_sfc(_sfc_main$n, [["render", _sfc_render$n]]);
 
-script$2i.render = render$2b;
-script$2i.__file = "packages/components/Close.vue";
-
-var Close = script$2i;
-
-var script$2h = defineComponent({
+const _sfc_main$m = defineComponent({
   name: "DArrowLeft"
 });
-
 const _hoisted_1$1J = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1k = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1k = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"
+  d: "M529.408 149.376a29.12 29.12 0 0141.728 0 30.592 30.592 0 010 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 01-.512 43.264 29.12 29.12 0 01-41.216-.512L197.76 534.272a32 32 0 010-44.672l331.648-340.224zm256 0a29.12 29.12 0 0141.728 0 30.592 30.592 0 010 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 01-.512 43.264 29.12 29.12 0 01-41.216-.512L453.76 534.272a32 32 0 010-44.672l331.648-340.224z"
 }, null, -1);
-function render$2a(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1J, [
-    _hoisted_2$1k
-  ]);
+const _hoisted_3$17 = [
+  _hoisted_2$1k
+];
+function _sfc_render$m(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1J, _hoisted_3$17);
 }
+var dArrowLeft = /* @__PURE__ */ _export_sfc(_sfc_main$m, [["render", _sfc_render$m]]);
 
-script$2h.render = render$2a;
-script$2h.__file = "packages/components/DArrowLeft.vue";
-
-var DArrowLeft = script$2h;
-
-var script$2g = defineComponent({
+const _sfc_main$l = defineComponent({
   name: "DArrowRight"
 });
-
 const _hoisted_1$1I = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1j = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1j = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688zm-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"
+  d: "M452.864 149.312a29.12 29.12 0 0141.728.064L826.24 489.664a32 32 0 010 44.672L494.592 874.624a29.12 29.12 0 01-41.728 0 30.592 30.592 0 010-42.752L764.736 512 452.864 192a30.592 30.592 0 010-42.688zm-256 0a29.12 29.12 0 0141.728.064L570.24 489.664a32 32 0 010 44.672L238.592 874.624a29.12 29.12 0 01-41.728 0 30.592 30.592 0 010-42.752L508.736 512 196.864 192a30.592 30.592 0 010-42.688z"
 }, null, -1);
-function render$29(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1I, [
-    _hoisted_2$1j
-  ]);
+const _hoisted_3$16 = [
+  _hoisted_2$1j
+];
+function _sfc_render$l(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1I, _hoisted_3$16);
 }
+var dArrowRight = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["render", _sfc_render$l]]);
 
-script$2g.render = render$29;
-script$2g.__file = "packages/components/DArrowRight.vue";
-
-var DArrowRight = script$2g;
-
-var script$2f = defineComponent({
+const _sfc_main$k = defineComponent({
   name: "Delete"
 });
-
 const _hoisted_1$1H = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1i = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1i = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M160 256H96a32 32 0 0 1 0-64h256V95.936a32 32 0 0 1 32-32h256a32 32 0 0 1 32 32V192h256a32 32 0 1 1 0 64h-64v672a32 32 0 0 1-32 32H192a32 32 0 0 1-32-32V256zm448-64v-64H416v64h192zM224 896h576V256H224v640zm192-128a32 32 0 0 1-32-32V416a32 32 0 0 1 64 0v320a32 32 0 0 1-32 32zm192 0a32 32 0 0 1-32-32V416a32 32 0 0 1 64 0v320a32 32 0 0 1-32 32z"
+  d: "M160 256H96a32 32 0 010-64h256V95.936a32 32 0 0132-32h256a32 32 0 0132 32V192h256a32 32 0 110 64h-64v672a32 32 0 01-32 32H192a32 32 0 01-32-32V256zm448-64v-64H416v64h192zM224 896h576V256H224v640zm192-128a32 32 0 01-32-32V416a32 32 0 0164 0v320a32 32 0 01-32 32zm192 0a32 32 0 01-32-32V416a32 32 0 0164 0v320a32 32 0 01-32 32z"
 }, null, -1);
-function render$28(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1H, [
-    _hoisted_2$1i
-  ]);
+const _hoisted_3$15 = [
+  _hoisted_2$1i
+];
+function _sfc_render$k(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1H, _hoisted_3$15);
 }
+var _delete = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["render", _sfc_render$k]]);
 
-script$2f.render = render$28;
-script$2f.__file = "packages/components/Delete.vue";
-
-var Delete = script$2f;
-
-var script$2e = defineComponent({
+const _sfc_main$j = defineComponent({
   name: "Document"
 });
-
 const _hoisted_1$1G = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1h = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1h = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M832 384H576V128H192v768h640V384zm-26.496-64L640 154.496V320h165.504zM160 64h480l256 256v608a32 32 0 0 1-32 32H160a32 32 0 0 1-32-32V96a32 32 0 0 1 32-32zm160 448h384v64H320v-64zm0-192h160v64H320v-64zm0 384h384v64H320v-64z"
+  d: "M832 384H576V128H192v768h640V384zm-26.496-64L640 154.496V320h165.504zM160 64h480l256 256v608a32 32 0 01-32 32H160a32 32 0 01-32-32V96a32 32 0 0132-32zm160 448h384v64H320v-64zm0-192h160v64H320v-64zm0 384h384v64H320v-64z"
 }, null, -1);
-function render$27(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1G, [
-    _hoisted_2$1h
-  ]);
+const _hoisted_3$14 = [
+  _hoisted_2$1h
+];
+function _sfc_render$j(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1G, _hoisted_3$14);
 }
+var document$1 = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["render", _sfc_render$j]]);
 
-script$2e.render = render$27;
-script$2e.__file = "packages/components/Document.vue";
-
-var Document = script$2e;
-
-var script$2d = defineComponent({
+const _sfc_main$i = defineComponent({
   name: "FullScreen"
 });
-
 const _hoisted_1$1F = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1g = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1g = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "m160 96.064 192 .192a32 32 0 0 1 0 64l-192-.192V352a32 32 0 0 1-64 0V96h64v.064zm0 831.872V928H96V672a32 32 0 1 1 64 0v191.936l192-.192a32 32 0 1 1 0 64l-192 .192zM864 96.064V96h64v256a32 32 0 1 1-64 0V160.064l-192 .192a32 32 0 1 1 0-64l192-.192zm0 831.872-192-.192a32 32 0 0 1 0-64l192 .192V672a32 32 0 1 1 64 0v256h-64v-.064z"
+  d: "M160 96.064l192 .192a32 32 0 010 64l-192-.192V352a32 32 0 01-64 0V96h64v.064zm0 831.872V928H96V672a32 32 0 1164 0v191.936l192-.192a32 32 0 110 64l-192 .192zM864 96.064V96h64v256a32 32 0 11-64 0V160.064l-192 .192a32 32 0 110-64l192-.192zm0 831.872l-192-.192a32 32 0 010-64l192 .192V672a32 32 0 1164 0v256h-64v-.064z"
 }, null, -1);
-function render$26(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1F, [
-    _hoisted_2$1g
-  ]);
+const _hoisted_3$13 = [
+  _hoisted_2$1g
+];
+function _sfc_render$i(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1F, _hoisted_3$13);
 }
+var fullScreen = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["render", _sfc_render$i]]);
 
-script$2d.render = render$26;
-script$2d.__file = "packages/components/FullScreen.vue";
-
-var FullScreen = script$2d;
-
-var script$2c = defineComponent({
+const _sfc_main$h = defineComponent({
   name: "InfoFilled"
 });
-
 const _hoisted_1$1E = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1f = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1f = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M512 64a448 448 0 1 1 0 896.064A448 448 0 0 1 512 64zm67.2 275.072c33.28 0 60.288-23.104 60.288-57.344s-27.072-57.344-60.288-57.344c-33.28 0-60.16 23.104-60.16 57.344s26.88 57.344 60.16 57.344zM590.912 699.2c0-6.848 2.368-24.64 1.024-34.752l-52.608 60.544c-10.88 11.456-24.512 19.392-30.912 17.28a12.992 12.992 0 0 1-8.256-14.72l87.68-276.992c7.168-35.136-12.544-67.2-54.336-71.296-44.096 0-108.992 44.736-148.48 101.504 0 6.784-1.28 23.68.064 33.792l52.544-60.608c10.88-11.328 23.552-19.328 29.952-17.152a12.8 12.8 0 0 1 7.808 16.128L388.48 728.576c-10.048 32.256 8.96 63.872 55.04 71.04 67.84 0 107.904-43.648 147.456-100.416z"
+  d: "M512 64a448 448 0 110 896.064A448 448 0 01512 64zm67.2 275.072c33.28 0 60.288-23.104 60.288-57.344s-27.072-57.344-60.288-57.344c-33.28 0-60.16 23.104-60.16 57.344s26.88 57.344 60.16 57.344zM590.912 699.2c0-6.848 2.368-24.64 1.024-34.752l-52.608 60.544c-10.88 11.456-24.512 19.392-30.912 17.28a12.992 12.992 0 01-8.256-14.72l87.68-276.992c7.168-35.136-12.544-67.2-54.336-71.296-44.096 0-108.992 44.736-148.48 101.504 0 6.784-1.28 23.68.064 33.792l52.544-60.608c10.88-11.328 23.552-19.328 29.952-17.152a12.8 12.8 0 017.808 16.128L388.48 728.576c-10.048 32.256 8.96 63.872 55.04 71.04 67.84 0 107.904-43.648 147.456-100.416z"
 }, null, -1);
-function render$25(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1E, [
-    _hoisted_2$1f
-  ]);
+const _hoisted_3$12 = [
+  _hoisted_2$1f
+];
+function _sfc_render$h(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1E, _hoisted_3$12);
 }
+var infoFilled = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["render", _sfc_render$h]]);
 
-script$2c.render = render$25;
-script$2c.__file = "packages/components/InfoFilled.vue";
-
-var InfoFilled = script$2c;
-
-var script$2b = defineComponent({
+const _sfc_main$g = defineComponent({
   name: "Loading"
 });
-
 const _hoisted_1$1D = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1e = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1e = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M512 64a32 32 0 0 1 32 32v192a32 32 0 0 1-64 0V96a32 32 0 0 1 32-32zm0 640a32 32 0 0 1 32 32v192a32 32 0 1 1-64 0V736a32 32 0 0 1 32-32zm448-192a32 32 0 0 1-32 32H736a32 32 0 1 1 0-64h192a32 32 0 0 1 32 32zm-640 0a32 32 0 0 1-32 32H96a32 32 0 0 1 0-64h192a32 32 0 0 1 32 32zM195.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 0zm-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"
+  d: "M512 64a32 32 0 0132 32v192a32 32 0 01-64 0V96a32 32 0 0132-32zm0 640a32 32 0 0132 32v192a32 32 0 11-64 0V736a32 32 0 0132-32zm448-192a32 32 0 01-32 32H736a32 32 0 110-64h192a32 32 0 0132 32zm-640 0a32 32 0 01-32 32H96a32 32 0 010-64h192a32 32 0 0132 32zM195.2 195.2a32 32 0 0145.248 0L376.32 331.008a32 32 0 01-45.248 45.248L195.2 240.448a32 32 0 010-45.248zm452.544 452.544a32 32 0 0145.248 0L828.8 783.552a32 32 0 01-45.248 45.248L647.744 692.992a32 32 0 010-45.248zM828.8 195.264a32 32 0 010 45.184L692.992 376.32a32 32 0 01-45.248-45.248l135.808-135.808a32 32 0 0145.248 0zm-452.544 452.48a32 32 0 010 45.248L240.448 828.8a32 32 0 01-45.248-45.248l135.808-135.808a32 32 0 0145.248 0z"
 }, null, -1);
-function render$24(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1D, [
-    _hoisted_2$1e
-  ]);
+const _hoisted_3$11 = [
+  _hoisted_2$1e
+];
+function _sfc_render$g(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1D, _hoisted_3$11);
 }
+var loading = /* @__PURE__ */ _export_sfc(_sfc_main$g, [["render", _sfc_render$g]]);
 
-script$2b.render = render$24;
-script$2b.__file = "packages/components/Loading.vue";
-
-var Loading$2 = script$2b;
-
-var script$2a = defineComponent({
+const _sfc_main$f = defineComponent({
   name: "Minus"
 });
-
 const _hoisted_1$1C = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1d = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1d = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M128 544h768a32 32 0 1 0 0-64H128a32 32 0 0 0 0 64z"
+  d: "M128 544h768a32 32 0 100-64H128a32 32 0 000 64z"
 }, null, -1);
-function render$23(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1C, [
-    _hoisted_2$1d
-  ]);
+const _hoisted_3$10 = [
+  _hoisted_2$1d
+];
+function _sfc_render$f(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1C, _hoisted_3$10);
 }
+var minus = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["render", _sfc_render$f]]);
 
-script$2a.render = render$23;
-script$2a.__file = "packages/components/Minus.vue";
-
-var Minus = script$2a;
-
-var script$29 = defineComponent({
-  name: "More"
+const _sfc_main$e = defineComponent({
+  name: "MoreFilled"
 });
-
 const _hoisted_1$1B = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1c = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1c = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M176 416a112 112 0 1 0 0 224 112 112 0 0 0 0-224m0 64a48 48 0 1 1 0 96 48 48 0 0 1 0-96zm336-64a112 112 0 1 1 0 224 112 112 0 0 1 0-224zm0 64a48 48 0 1 0 0 96 48 48 0 0 0 0-96zm336-64a112 112 0 1 1 0 224 112 112 0 0 1 0-224zm0 64a48 48 0 1 0 0 96 48 48 0 0 0 0-96z"
+  d: "M176 416a112 112 0 110 224 112 112 0 010-224zm336 0a112 112 0 110 224 112 112 0 010-224zm336 0a112 112 0 110 224 112 112 0 010-224z"
 }, null, -1);
-function render$22(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1B, [
-    _hoisted_2$1c
-  ]);
+const _hoisted_3$$ = [
+  _hoisted_2$1c
+];
+function _sfc_render$e(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1B, _hoisted_3$$);
 }
+var moreFilled = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["render", _sfc_render$e]]);
 
-script$29.render = render$22;
-script$29.__file = "packages/components/More.vue";
-
-var More = script$29;
-
-var script$28 = defineComponent({
-  name: "MoreFilled"
+const _sfc_main$d = defineComponent({
+  name: "More"
 });
-
 const _hoisted_1$1A = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1b = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1b = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M176 416a112 112 0 1 1 0 224 112 112 0 0 1 0-224zm336 0a112 112 0 1 1 0 224 112 112 0 0 1 0-224zm336 0a112 112 0 1 1 0 224 112 112 0 0 1 0-224z"
+  d: "M176 416a112 112 0 100 224 112 112 0 000-224m0 64a48 48 0 110 96 48 48 0 010-96zm336-64a112 112 0 110 224 112 112 0 010-224zm0 64a48 48 0 100 96 48 48 0 000-96zm336-64a112 112 0 110 224 112 112 0 010-224zm0 64a48 48 0 100 96 48 48 0 000-96z"
 }, null, -1);
-function render$21(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1A, [
-    _hoisted_2$1b
-  ]);
+const _hoisted_3$_ = [
+  _hoisted_2$1b
+];
+function _sfc_render$d(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1A, _hoisted_3$_);
 }
+var more = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["render", _sfc_render$d]]);
 
-script$28.render = render$21;
-script$28.__file = "packages/components/MoreFilled.vue";
-
-var MoreFilled = script$28;
-
-var script$27 = defineComponent({
+const _sfc_main$c = defineComponent({
   name: "Plus"
 });
-
 const _hoisted_1$1z = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$1a = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$1a = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M480 480V128a32 32 0 0 1 64 0v352h352a32 32 0 1 1 0 64H544v352a32 32 0 1 1-64 0V544H128a32 32 0 0 1 0-64h352z"
+  d: "M480 480V128a32 32 0 0164 0v352h352a32 32 0 110 64H544v352a32 32 0 11-64 0V544H128a32 32 0 010-64h352z"
 }, null, -1);
-function render$20(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1z, [
-    _hoisted_2$1a
-  ]);
+const _hoisted_3$Z = [
+  _hoisted_2$1a
+];
+function _sfc_render$c(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1z, _hoisted_3$Z);
 }
+var plus = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["render", _sfc_render$c]]);
 
-script$27.render = render$20;
-script$27.__file = "packages/components/Plus.vue";
-
-var Plus = script$27;
-
-var script$26 = defineComponent({
+const _sfc_main$b = defineComponent({
   name: "QuestionFilled"
 });
-
 const _hoisted_1$1y = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$19 = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$19 = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm23.744 191.488c-52.096 0-92.928 14.784-123.2 44.352-30.976 29.568-45.76 70.4-45.76 122.496h80.256c0-29.568 5.632-52.8 17.6-68.992 13.376-19.712 35.2-28.864 66.176-28.864 23.936 0 42.944 6.336 56.32 19.712 12.672 13.376 19.712 31.68 19.712 54.912 0 17.6-6.336 34.496-19.008 49.984l-8.448 9.856c-45.76 40.832-73.216 70.4-82.368 89.408-9.856 19.008-14.08 42.24-14.08 68.992v9.856h80.96v-9.856c0-16.896 3.52-31.68 10.56-45.76 6.336-12.672 15.488-24.64 28.16-35.2 33.792-29.568 54.208-48.576 60.544-55.616 16.896-22.528 26.048-51.392 26.048-86.592 0-42.944-14.08-76.736-42.24-101.376-28.16-25.344-65.472-37.312-111.232-37.312zm-12.672 406.208a54.272 54.272 0 0 0-38.72 14.784 49.408 49.408 0 0 0-15.488 38.016c0 15.488 4.928 28.16 15.488 38.016A54.848 54.848 0 0 0 523.072 768c15.488 0 28.16-4.928 38.72-14.784a51.52 51.52 0 0 0 16.192-38.72 51.968 51.968 0 0 0-15.488-38.016 55.936 55.936 0 0 0-39.424-14.784z"
+  d: "M512 64a448 448 0 110 896 448 448 0 010-896zm23.744 191.488c-52.096 0-92.928 14.784-123.2 44.352-30.976 29.568-45.76 70.4-45.76 122.496h80.256c0-29.568 5.632-52.8 17.6-68.992 13.376-19.712 35.2-28.864 66.176-28.864 23.936 0 42.944 6.336 56.32 19.712 12.672 13.376 19.712 31.68 19.712 54.912 0 17.6-6.336 34.496-19.008 49.984l-8.448 9.856c-45.76 40.832-73.216 70.4-82.368 89.408-9.856 19.008-14.08 42.24-14.08 68.992v9.856h80.96v-9.856c0-16.896 3.52-31.68 10.56-45.76 6.336-12.672 15.488-24.64 28.16-35.2 33.792-29.568 54.208-48.576 60.544-55.616 16.896-22.528 26.048-51.392 26.048-86.592 0-42.944-14.08-76.736-42.24-101.376-28.16-25.344-65.472-37.312-111.232-37.312zm-12.672 406.208a54.272 54.272 0 00-38.72 14.784 49.408 49.408 0 00-15.488 38.016c0 15.488 4.928 28.16 15.488 38.016A54.848 54.848 0 00523.072 768c15.488 0 28.16-4.928 38.72-14.784a51.52 51.52 0 0016.192-38.72 51.968 51.968 0 00-15.488-38.016 55.936 55.936 0 00-39.424-14.784z"
 }, null, -1);
-function render$1$(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1y, [
-    _hoisted_2$19
-  ]);
+const _hoisted_3$Y = [
+  _hoisted_2$19
+];
+function _sfc_render$b(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1y, _hoisted_3$Y);
 }
+var questionFilled = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["render", _sfc_render$b]]);
 
-script$26.render = render$1$;
-script$26.__file = "packages/components/QuestionFilled.vue";
-
-var QuestionFilled = script$26;
-
-var script$25 = defineComponent({
-  name: "RefreshRight"
+const _sfc_main$a = defineComponent({
+  name: "RefreshLeft"
 });
-
 const _hoisted_1$1x = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$18 = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$18 = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M784.512 230.272v-50.56a32 32 0 1 1 64 0v149.056a32 32 0 0 1-32 32H667.52a32 32 0 1 1 0-64h92.992A320 320 0 1 0 524.8 833.152a320 320 0 0 0 320-320h64a384 384 0 0 1-384 384 384 384 0 0 1-384-384 384 384 0 0 1 643.712-282.88z"
+  d: "M289.088 296.704h92.992a32 32 0 010 64H232.96a32 32 0 01-32-32V179.712a32 32 0 0164 0v50.56a384 384 0 01643.84 282.88 384 384 0 01-383.936 384 384 384 0 01-384-384h64a320 320 0 10640 0 320 320 0 00-555.712-216.448z"
 }, null, -1);
-function render$1_(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1x, [
-    _hoisted_2$18
-  ]);
+const _hoisted_3$X = [
+  _hoisted_2$18
+];
+function _sfc_render$a(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1x, _hoisted_3$X);
 }
+var refreshLeft = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["render", _sfc_render$a]]);
 
-script$25.render = render$1_;
-script$25.__file = "packages/components/RefreshRight.vue";
-
-var RefreshRight = script$25;
-
-var script$24 = defineComponent({
-  name: "RefreshLeft"
+const _sfc_main$9 = defineComponent({
+  name: "RefreshRight"
 });
-
 const _hoisted_1$1w = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$17 = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$17 = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M289.088 296.704h92.992a32 32 0 0 1 0 64H232.96a32 32 0 0 1-32-32V179.712a32 32 0 0 1 64 0v50.56a384 384 0 0 1 643.84 282.88 384 384 0 0 1-383.936 384 384 384 0 0 1-384-384h64a320 320 0 1 0 640 0 320 320 0 0 0-555.712-216.448z"
+  d: "M784.512 230.272v-50.56a32 32 0 1164 0v149.056a32 32 0 01-32 32H667.52a32 32 0 110-64h92.992A320 320 0 10524.8 833.152a320 320 0 00320-320h64a384 384 0 01-384 384 384 384 0 01-384-384 384 384 0 01643.712-282.88z"
 }, null, -1);
-function render$1Z(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1w, [
-    _hoisted_2$17
-  ]);
+const _hoisted_3$W = [
+  _hoisted_2$17
+];
+function _sfc_render$9(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1w, _hoisted_3$W);
 }
+var refreshRight = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["render", _sfc_render$9]]);
 
-script$24.render = render$1Z;
-script$24.__file = "packages/components/RefreshLeft.vue";
-
-var RefreshLeft = script$24;
-
-var script$23 = defineComponent({
+const _sfc_main$8 = defineComponent({
   name: "ScaleToOriginal"
 });
-
 const _hoisted_1$1v = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$16 = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$16 = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M813.176 180.706a60.235 60.235 0 0 1 60.236 60.235v481.883a60.235 60.235 0 0 1-60.236 60.235H210.824a60.235 60.235 0 0 1-60.236-60.235V240.94a60.235 60.235 0 0 1 60.236-60.235h602.352zm0-60.235H210.824A120.47 120.47 0 0 0 90.353 240.94v481.883a120.47 120.47 0 0 0 120.47 120.47h602.353a120.47 120.47 0 0 0 120.471-120.47V240.94a120.47 120.47 0 0 0-120.47-120.47zm-120.47 180.705a30.118 30.118 0 0 0-30.118 30.118v301.177a30.118 30.118 0 0 0 60.236 0V331.294a30.118 30.118 0 0 0-30.118-30.118zm-361.412 0a30.118 30.118 0 0 0-30.118 30.118v301.177a30.118 30.118 0 1 0 60.236 0V331.294a30.118 30.118 0 0 0-30.118-30.118zM512 361.412a30.118 30.118 0 0 0-30.118 30.117v30.118a30.118 30.118 0 0 0 60.236 0V391.53A30.118 30.118 0 0 0 512 361.412zM512 512a30.118 30.118 0 0 0-30.118 30.118v30.117a30.118 30.118 0 0 0 60.236 0v-30.117A30.118 30.118 0 0 0 512 512z"
+  d: "M813.176 180.706a60.235 60.235 0 0160.236 60.235v481.883a60.235 60.235 0 01-60.236 60.235H210.824a60.235 60.235 0 01-60.236-60.235V240.94a60.235 60.235 0 0160.236-60.235h602.352zm0-60.235H210.824A120.47 120.47 0 0090.353 240.94v481.883a120.47 120.47 0 00120.47 120.47h602.353a120.47 120.47 0 00120.471-120.47V240.94a120.47 120.47 0 00-120.47-120.47zm-120.47 180.705a30.118 30.118 0 00-30.118 30.118v301.177a30.118 30.118 0 0060.236 0V331.294a30.118 30.118 0 00-30.118-30.118zm-361.412 0a30.118 30.118 0 00-30.118 30.118v301.177a30.118 30.118 0 1060.236 0V331.294a30.118 30.118 0 00-30.118-30.118zM512 361.412a30.118 30.118 0 00-30.118 30.117v30.118a30.118 30.118 0 0060.236 0V391.53A30.118 30.118 0 00512 361.412zM512 512a30.118 30.118 0 00-30.118 30.118v30.117a30.118 30.118 0 0060.236 0v-30.117A30.118 30.118 0 00512 512z"
 }, null, -1);
-function render$1Y(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1v, [
-    _hoisted_2$16
-  ]);
+const _hoisted_3$V = [
+  _hoisted_2$16
+];
+function _sfc_render$8(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1v, _hoisted_3$V);
 }
+var scaleToOriginal = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["render", _sfc_render$8]]);
 
-script$23.render = render$1Y;
-script$23.__file = "packages/components/ScaleToOriginal.vue";
-
-var ScaleToOriginal = script$23;
-
-var script$22 = defineComponent({
+const _sfc_main$7 = defineComponent({
   name: "Search"
 });
-
 const _hoisted_1$1u = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$15 = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$15 = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "m795.904 750.72 124.992 124.928a32 32 0 0 1-45.248 45.248L750.656 795.904a416 416 0 1 1 45.248-45.248zM480 832a352 352 0 1 0 0-704 352 352 0 0 0 0 704z"
+  d: "M795.904 750.72l124.992 124.928a32 32 0 01-45.248 45.248L750.656 795.904a416 416 0 1145.248-45.248zM480 832a352 352 0 100-704 352 352 0 000 704z"
 }, null, -1);
-function render$1X(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1u, [
-    _hoisted_2$15
-  ]);
+const _hoisted_3$U = [
+  _hoisted_2$15
+];
+function _sfc_render$7(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1u, _hoisted_3$U);
 }
+var search = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["render", _sfc_render$7]]);
 
-script$22.render = render$1X;
-script$22.__file = "packages/components/Search.vue";
-
-var Search = script$22;
-
-var script$21 = defineComponent({
-  name: "Star"
+const _sfc_main$6 = defineComponent({
+  name: "StarFilled"
 });
-
 const _hoisted_1$1t = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$14 = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$14 = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "m512 747.84 228.16 119.936a6.4 6.4 0 0 0 9.28-6.72l-43.52-254.08 184.512-179.904a6.4 6.4 0 0 0-3.52-10.88l-255.104-37.12L517.76 147.904a6.4 6.4 0 0 0-11.52 0L392.192 379.072l-255.104 37.12a6.4 6.4 0 0 0-3.52 10.88L318.08 606.976l-43.584 254.08a6.4 6.4 0 0 0 9.28 6.72L512 747.84zM313.6 924.48a70.4 70.4 0 0 1-102.144-74.24l37.888-220.928L88.96 472.96A70.4 70.4 0 0 1 128 352.896l221.76-32.256 99.2-200.96a70.4 70.4 0 0 1 126.208 0l99.2 200.96 221.824 32.256a70.4 70.4 0 0 1 39.04 120.064L774.72 629.376l37.888 220.928a70.4 70.4 0 0 1-102.144 74.24L512 820.096l-198.4 104.32z"
+  d: "M283.84 867.84L512 747.776l228.16 119.936a6.4 6.4 0 009.28-6.72l-43.52-254.08 184.512-179.904a6.4 6.4 0 00-3.52-10.88l-255.104-37.12L517.76 147.904a6.4 6.4 0 00-11.52 0L392.192 379.072l-255.104 37.12a6.4 6.4 0 00-3.52 10.88L318.08 606.976l-43.584 254.08a6.4 6.4 0 009.28 6.72z"
 }, null, -1);
-function render$1W(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1t, [
-    _hoisted_2$14
-  ]);
+const _hoisted_3$T = [
+  _hoisted_2$14
+];
+function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1t, _hoisted_3$T);
 }
+var starFilled = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["render", _sfc_render$6]]);
 
-script$21.render = render$1W;
-script$21.__file = "packages/components/Star.vue";
-
-var Star = script$21;
-
-var script$20 = defineComponent({
-  name: "StarFilled"
+const _sfc_main$5 = defineComponent({
+  name: "Star"
 });
-
 const _hoisted_1$1s = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$13 = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$13 = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M283.84 867.84 512 747.776l228.16 119.936a6.4 6.4 0 0 0 9.28-6.72l-43.52-254.08 184.512-179.904a6.4 6.4 0 0 0-3.52-10.88l-255.104-37.12L517.76 147.904a6.4 6.4 0 0 0-11.52 0L392.192 379.072l-255.104 37.12a6.4 6.4 0 0 0-3.52 10.88L318.08 606.976l-43.584 254.08a6.4 6.4 0 0 0 9.28 6.72z"
+  d: "M512 747.84l228.16 119.936a6.4 6.4 0 009.28-6.72l-43.52-254.08 184.512-179.904a6.4 6.4 0 00-3.52-10.88l-255.104-37.12L517.76 147.904a6.4 6.4 0 00-11.52 0L392.192 379.072l-255.104 37.12a6.4 6.4 0 00-3.52 10.88L318.08 606.976l-43.584 254.08a6.4 6.4 0 009.28 6.72L512 747.84zM313.6 924.48a70.4 70.4 0 01-102.144-74.24l37.888-220.928L88.96 472.96A70.4 70.4 0 01128 352.896l221.76-32.256 99.2-200.96a70.4 70.4 0 01126.208 0l99.2 200.96 221.824 32.256a70.4 70.4 0 0139.04 120.064L774.72 629.376l37.888 220.928a70.4 70.4 0 01-102.144 74.24L512 820.096l-198.4 104.32z"
 }, null, -1);
-function render$1V(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1s, [
-    _hoisted_2$13
-  ]);
+const _hoisted_3$S = [
+  _hoisted_2$13
+];
+function _sfc_render$5(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1s, _hoisted_3$S);
 }
+var star = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["render", _sfc_render$5]]);
 
-script$20.render = render$1V;
-script$20.__file = "packages/components/StarFilled.vue";
-
-var StarFilled = script$20;
-
-var script$1$ = defineComponent({
+const _sfc_main$4 = defineComponent({
   name: "SuccessFilled"
 });
-
 const _hoisted_1$1r = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$12 = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$12 = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm-55.808 536.384-99.52-99.584a38.4 38.4 0 1 0-54.336 54.336l126.72 126.72a38.272 38.272 0 0 0 54.336 0l262.4-262.464a38.4 38.4 0 1 0-54.272-54.336L456.192 600.384z"
+  d: "M512 64a448 448 0 110 896 448 448 0 010-896zm-55.808 536.384l-99.52-99.584a38.4 38.4 0 10-54.336 54.336l126.72 126.72a38.272 38.272 0 0054.336 0l262.4-262.464a38.4 38.4 0 10-54.272-54.336L456.192 600.384z"
 }, null, -1);
-function render$1U(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1r, [
-    _hoisted_2$12
-  ]);
+const _hoisted_3$R = [
+  _hoisted_2$12
+];
+function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1r, _hoisted_3$R);
 }
+var successFilled = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["render", _sfc_render$4]]);
 
-script$1$.render = render$1U;
-script$1$.__file = "packages/components/SuccessFilled.vue";
-
-var SuccessFilled = script$1$;
-
-var script$1_ = defineComponent({
+const _sfc_main$3 = defineComponent({
   name: "View"
 });
-
 const _hoisted_1$1q = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$11 = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$11 = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M512 160c320 0 512 352 512 352S832 864 512 864 0 512 0 512s192-352 512-352zm0 64c-225.28 0-384.128 208.064-436.8 288 52.608 79.872 211.456 288 436.8 288 225.28 0 384.128-208.064 436.8-288-52.608-79.872-211.456-288-436.8-288zm0 64a224 224 0 1 1 0 448 224 224 0 0 1 0-448zm0 64a160.192 160.192 0 0 0-160 160c0 88.192 71.744 160 160 160s160-71.808 160-160-71.744-160-160-160z"
+  d: "M512 160c320 0 512 352 512 352S832 864 512 864 0 512 0 512s192-352 512-352zm0 64c-225.28 0-384.128 208.064-436.8 288 52.608 79.872 211.456 288 436.8 288 225.28 0 384.128-208.064 436.8-288-52.608-79.872-211.456-288-436.8-288zm0 64a224 224 0 110 448 224 224 0 010-448zm0 64a160.192 160.192 0 00-160 160c0 88.192 71.744 160 160 160s160-71.808 160-160-71.744-160-160-160z"
 }, null, -1);
-function render$1T(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1q, [
-    _hoisted_2$11
-  ]);
+const _hoisted_3$Q = [
+  _hoisted_2$11
+];
+function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1q, _hoisted_3$Q);
 }
+var view = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render$3]]);
 
-script$1_.render = render$1T;
-script$1_.__file = "packages/components/View.vue";
-
-var IconView = script$1_;
-
-var script$1Z = defineComponent({
+const _sfc_main$2 = defineComponent({
   name: "WarningFilled"
 });
-
 const _hoisted_1$1p = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$10 = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$10 = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm0 192a58.432 58.432 0 0 0-58.24 63.744l23.36 256.384a35.072 35.072 0 0 0 69.76 0l23.296-256.384A58.432 58.432 0 0 0 512 256zm0 512a51.2 51.2 0 1 0 0-102.4 51.2 51.2 0 0 0 0 102.4z"
+  d: "M512 64a448 448 0 110 896 448 448 0 010-896zm0 192a58.432 58.432 0 00-58.24 63.744l23.36 256.384a35.072 35.072 0 0069.76 0l23.296-256.384A58.432 58.432 0 00512 256zm0 512a51.2 51.2 0 100-102.4 51.2 51.2 0 000 102.4z"
 }, null, -1);
-function render$1S(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1p, [
-    _hoisted_2$10
-  ]);
+const _hoisted_3$P = [
+  _hoisted_2$10
+];
+function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1p, _hoisted_3$P);
 }
+var warningFilled = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _sfc_render$2]]);
 
-script$1Z.render = render$1S;
-script$1Z.__file = "packages/components/WarningFilled.vue";
-
-var WarningFilled = script$1Z;
-
-var script$1Y = defineComponent({
+const _sfc_main$1 = defineComponent({
   name: "ZoomIn"
 });
-
 const _hoisted_1$1o = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$$ = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$$ = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "m795.904 750.72 124.992 124.928a32 32 0 0 1-45.248 45.248L750.656 795.904a416 416 0 1 1 45.248-45.248zM480 832a352 352 0 1 0 0-704 352 352 0 0 0 0 704zm-32-384v-96a32 32 0 0 1 64 0v96h96a32 32 0 0 1 0 64h-96v96a32 32 0 0 1-64 0v-96h-96a32 32 0 0 1 0-64h96z"
+  d: "M795.904 750.72l124.992 124.928a32 32 0 01-45.248 45.248L750.656 795.904a416 416 0 1145.248-45.248zM480 832a352 352 0 100-704 352 352 0 000 704zm-32-384v-96a32 32 0 0164 0v96h96a32 32 0 010 64h-96v96a32 32 0 01-64 0v-96h-96a32 32 0 010-64h96z"
 }, null, -1);
-function render$1R(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1o, [
-    _hoisted_2$$
-  ]);
+const _hoisted_3$O = [
+  _hoisted_2$$
+];
+function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1o, _hoisted_3$O);
 }
+var zoomIn = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
 
-script$1Y.render = render$1R;
-script$1Y.__file = "packages/components/ZoomIn.vue";
-
-var ZoomIn = script$1Y;
-
-var script$1X = defineComponent({
+const _sfc_main = defineComponent({
   name: "ZoomOut"
 });
-
 const _hoisted_1$1n = {
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 1024 1024"
+  class: "icon",
+  width: "200",
+  height: "200",
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_2$_ = /* @__PURE__ */ createVNode("path", {
+const _hoisted_2$_ = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
-  d: "m795.904 750.72 124.992 124.928a32 32 0 0 1-45.248 45.248L750.656 795.904a416 416 0 1 1 45.248-45.248zM480 832a352 352 0 1 0 0-704 352 352 0 0 0 0 704zM352 448h256a32 32 0 0 1 0 64H352a32 32 0 0 1 0-64z"
+  d: "M795.904 750.72l124.992 124.928a32 32 0 01-45.248 45.248L750.656 795.904a416 416 0 1145.248-45.248zM480 832a352 352 0 100-704 352 352 0 000 704zM352 448h256a32 32 0 010 64H352a32 32 0 010-64z"
 }, null, -1);
-function render$1Q(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createBlock("svg", _hoisted_1$1n, [
-    _hoisted_2$_
-  ]);
+const _hoisted_3$N = [
+  _hoisted_2$_
+];
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("svg", _hoisted_1$1n, _hoisted_3$N);
 }
-
-script$1X.render = render$1Q;
-script$1X.__file = "packages/components/ZoomOut.vue";
-
-var ZoomOut = script$1X;
+var zoomOut = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 
 const CloseComponents = {
-  Close
+  Close: close$2
 };
 const TypeComponents = {
-  Close,
-  SuccessFilled,
-  InfoFilled,
-  WarningFilled,
-  CircleCloseFilled
+  Close: close$2,
+  SuccessFilled: successFilled,
+  InfoFilled: infoFilled,
+  WarningFilled: warningFilled,
+  CircleCloseFilled: circleCloseFilled
 };
 const TypeComponentsMap = {
-  success: SuccessFilled,
-  warning: WarningFilled,
-  error: CircleCloseFilled,
-  info: InfoFilled
+  success: successFilled,
+  warning: warningFilled,
+  error: circleCloseFilled,
+  info: infoFilled
 };
 const ValidateComponentsMap = {
-  validating: Loading$2,
-  success: CircleCheck,
-  error: CircleClose
+  validating: loading,
+  success: circleCheck,
+  error: circleClose
 };
 
 const alertProps = buildProps({
@@ -8323,7 +8313,8 @@ function calcTextareaHeight(targetElement, minRows = 1, maxRows) {
 }
 
 const inputProps = buildProps({
-  ...useFormItemProps,
+  size: useSizeProp,
+  disabled: Boolean,
   modelValue: {
     type: definePropType(void 0),
     default: ""
@@ -8411,16 +8402,16 @@ const PENDANT_MAP = {
 };
 var script$1V = defineComponent({
   name: "ElInput",
-  components: { ElIcon, CircleClose, IconView },
+  components: { ElIcon, CircleClose: circleClose, IconView: view },
   inheritAttrs: false,
   props: inputProps,
   emits: inputEmits,
   setup(props, { slots, emit, attrs: rawAttrs }) {
     const instance = getCurrentInstance();
     const attrs = useAttrs();
-    const elForm = inject(elFormKey, void 0);
-    const elFormItem = inject(elFormItemKey, void 0);
-    const { size: inputSize, disabled: inputDisabled } = useFormItem({});
+    const { form, formItem } = useFormItem();
+    const inputSize = useSize();
+    const inputDisabled = useDisabled$1();
     const input = ref();
     const textarea = ref();
     const focused = ref(false);
@@ -8431,9 +8422,9 @@ var script$1V = defineComponent({
     const inputOrTextarea = computed(() => input.value || textarea.value);
     const needStatusIcon = computed(() => {
       var _a;
-      return (_a = elForm == null ? void 0 : elForm.statusIcon) != null ? _a : false;
+      return (_a = form == null ? void 0 : form.statusIcon) != null ? _a : false;
     });
-    const validateState = computed(() => (elFormItem == null ? void 0 : elFormItem.validateState) || "");
+    const validateState = computed(() => (formItem == null ? void 0 : formItem.validateState) || "");
     const validateIcon = computed(() => ValidateComponentsMap[validateState.value]);
     const containerStyle = computed(() => rawAttrs.style);
     const computedTextareaStyle = computed(() => [
@@ -8520,7 +8511,7 @@ var script$1V = defineComponent({
       focused.value = false;
       emit("blur", event);
       if (props.validateEvent) {
-        (_a = elFormItem == null ? void 0 : elFormItem.validate) == null ? void 0 : _a.call(elFormItem, "blur");
+        (_a = formItem == null ? void 0 : formItem.validate) == null ? void 0 : _a.call(formItem, "blur");
       }
     };
     const select = () => {
@@ -8560,7 +8551,7 @@ var script$1V = defineComponent({
       var _a;
       nextTick(resizeTextarea);
       if (props.validateEvent) {
-        (_a = elFormItem == null ? void 0 : elFormItem.validate) == null ? void 0 : _a.call(elFormItem, "change");
+        (_a = formItem == null ? void 0 : formItem.validate) == null ? void 0 : _a.call(formItem, "change");
       }
     });
     watch(nativeInputValue, () => setNativeInputValue());
@@ -8852,14 +8843,14 @@ const barProps = buildProps({
   always: Boolean
 });
 
-const COMPONENT_NAME$8 = "Bar";
+const COMPONENT_NAME$9 = "Bar";
 var script$1U = defineComponent({
-  name: COMPONENT_NAME$8,
+  name: COMPONENT_NAME$9,
   props: barProps,
   setup(props) {
     const scrollbar = inject(scrollbarContextKey);
     if (!scrollbar)
-      throwError(COMPONENT_NAME$8, "can not inject scrollbar context");
+      throwError(COMPONENT_NAME$9, "can not inject scrollbar context");
     const instance = ref();
     const thumb = ref();
     const barStore = ref({});
@@ -9741,7 +9732,7 @@ var script$1R = defineComponent({
     ElInput: ElInput$1,
     ElScrollbar: ElScrollbar$1,
     ElIcon: ElIcon$1,
-    Loading: Loading$2
+    Loading: loading
   },
   directives: {
     clickoutside: ClickOutside
@@ -10240,12 +10231,12 @@ const backtopEmits = {
   click: (evt) => evt instanceof MouseEvent
 };
 
-const COMPONENT_NAME$7 = "ElBacktop";
+const COMPONENT_NAME$8 = "ElBacktop";
 var script$1P = defineComponent({
-  name: COMPONENT_NAME$7,
+  name: COMPONENT_NAME$8,
   components: {
     ElIcon,
-    CaretTop
+    CaretTop: caretTop
   },
   props: backtopProps,
   emits: backtopEmits,
@@ -10287,7 +10278,7 @@ var script$1P = defineComponent({
       if (props.target) {
         el.value = (_a = document.querySelector(props.target)) != null ? _a : void 0;
         if (!el.value) {
-          throwError(COMPONENT_NAME$7, `target is not existed: ${props.target}`);
+          throwError(COMPONENT_NAME$8, `target is not existed: ${props.target}`);
         }
         container.value = el.value;
       }
@@ -10456,9 +10447,9 @@ const breadcrumbItemProps = buildProps({
   }
 });
 
-const COMPONENT_NAME$6 = "ElBreadcrumbItem";
+const COMPONENT_NAME$7 = "ElBreadcrumbItem";
 var script$1M = defineComponent({
-  name: COMPONENT_NAME$6,
+  name: COMPONENT_NAME$7,
   components: {
     ElIcon: ElIcon$1
   },
@@ -10572,7 +10563,8 @@ const buttonType = [
 const buttonSize = ["", "large", "medium", "small", "mini"];
 const buttonNativeType = ["button", "submit", "reset"];
 const buttonProps = buildProps({
-  ...useFormItemProps,
+  size: useSizeProp,
+  disabled: Boolean,
   type: {
     type: String,
     values: buttonType,
@@ -10594,7 +10586,8 @@ const buttonProps = buildProps({
   circle: Boolean,
   color: String,
   autoInsertSpace: {
-    type: Boolean
+    type: Boolean,
+    default: void 0
   }
 });
 const buttonEmits = {
@@ -10605,17 +10598,17 @@ var script$1L = defineComponent({
   name: "ElButton",
   components: {
     ElIcon,
-    Loading: Loading$2
+    Loading: loading
   },
   props: buttonProps,
   emits: buttonEmits,
   setup(props, { emit, slots }) {
     const buttonRef = ref();
     const buttonGroupContext = inject(buttonGroupContextKey, void 0);
-    const globalConfig = useGlobalConfig();
+    const globalConfig = useGlobalConfig("button");
     const autoInsertSpace = computed(() => {
-      var _a;
-      return (_a = props.autoInsertSpace) != null ? _a : globalConfig == null ? void 0 : globalConfig.button.autoInsertSpace;
+      var _a, _b, _c;
+      return (_c = (_b = props.autoInsertSpace) != null ? _b : (_a = globalConfig.value) == null ? void 0 : _a.autoInsertSpace) != null ? _c : false;
     });
     const shouldAddSpace = computed(() => {
       var _a;
@@ -10629,15 +10622,11 @@ var script$1L = defineComponent({
       }
       return false;
     });
-    const {
-      form,
-      size: buttonSize,
-      disabled: buttonDisabled
-    } = useFormItem({
-      size: computed(() => buttonGroupContext == null ? void 0 : buttonGroupContext.size)
-    });
+    const { form } = useFormItem();
+    const buttonSize = useSize(computed(() => buttonGroupContext == null ? void 0 : buttonGroupContext.size));
+    const buttonDisabled = useDisabled$1();
     const buttonType = computed(() => props.type || (buttonGroupContext == null ? void 0 : buttonGroupContext.type) || "default");
-    const typeColor = useCssVar(`--el-color-${props.type}`);
+    const typeColor = computed(() => useCssVar(`--el-color-${props.type}`).value);
     const buttonStyle = computed(() => {
       let styles = {};
       const buttonColor = props.color || typeColor.value;
@@ -10770,7 +10759,7 @@ script$1K.__file = "packages/components/button/src/button-group.vue";
 const ElButton = withInstall(script$1L, {
   ButtonGroup: script$1K
 });
-const ElButtonGroup$2 = withNoopInstall(script$1K);
+const ElButtonGroup$1 = withNoopInstall(script$1K);
 
 var dayjs_min = {exports: {}};
 
@@ -10892,7 +10881,7 @@ const timePickerDefaultProps = {
   },
   clearIcon: {
     type: [String, Object],
-    default: CircleClose
+    default: circleClose
   },
   editable: {
     type: Boolean,
@@ -11015,7 +11004,6 @@ var script$1J = defineComponent({
   props: timePickerDefaultProps,
   emits: ["update:modelValue", "change", "focus", "blur", "calendar-change"],
   setup(props, ctx) {
-    const ELEMENT = useGlobalConfig$1();
     const { lang } = useLocale();
     const elForm = inject(elFormKey, {});
     const elFormItem = inject(elFormItemKey, {});
@@ -11148,7 +11136,7 @@ var script$1J = defineComponent({
     const isTimeLikePicker = computed(() => props.type.includes("time"));
     const isTimePicker = computed(() => props.type.startsWith("time"));
     const isDatesPicker = computed(() => props.type === "dates");
-    const triggerIcon = computed(() => props.prefixIcon || (isTimeLikePicker.value ? Clock : Calendar));
+    const triggerIcon = computed(() => props.prefixIcon || (isTimeLikePicker.value ? clock : calendar));
     const showClose = ref(false);
     const onClearIconClick = (event) => {
       if (props.readonly || pickerDisabled.value)
@@ -11178,9 +11166,7 @@ var script$1J = defineComponent({
     const isRangeInput = computed(() => {
       return props.type.indexOf("range") > -1;
     });
-    const pickerSize = computed(() => {
-      return props.size || elFormItem.size || ELEMENT.size;
-    });
+    const pickerSize = useSize();
     const popperPaneRef = computed(() => {
       var _a;
       return (_a = refPopper.value) == null ? void 0 : _a.popperRef;
@@ -11245,8 +11231,8 @@ var script$1J = defineComponent({
         }
         return;
       }
-      if (code === EVENT_CODE.enter) {
-        if (userInput.value === "" || isValidValue(parseUserInputToDayjs(displayValue.value))) {
+      if (code === EVENT_CODE.enter || code === EVENT_CODE.numpadEnter) {
+        if (userInput.value === null || userInput.value === "" || isValidValue(parseUserInputToDayjs(displayValue.value))) {
           handleChange();
           pickerVisible.value = false;
         }
@@ -11569,8 +11555,8 @@ var script$1I = defineComponent({
   components: {
     ElScrollbar: ElScrollbar$1,
     ElIcon: ElIcon$1,
-    ArrowUp,
-    ArrowDown
+    ArrowUp: arrowUp,
+    ArrowDown: arrowDown
   },
   props: {
     role: {
@@ -13067,9 +13053,7 @@ var TimePicker = defineComponent({
   }
 });
 
-const rangeArr = (n) => {
-  return Array.from(Array(n).keys());
-};
+const rangeArr = (n) => Array.from(Array(n).keys());
 const extractDateFormat = (format) => {
   return format.replace(/\W?m{1,2}|\W?ZZ/g, "").replace(/\W?h{1,2}|\W?s{1,3}|\W?a/gi, "").trim();
 };
@@ -13083,87 +13067,52 @@ _TimePicker.install = (app) => {
 };
 const ElTimePicker = _TimePicker;
 
+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$a(value)
+};
+
 dayjs.extend(localeData);
-const getPrevMonthLastDays = (date, amount) => {
+const WEEK_DAYS = ["sun", "mon", "tue", "wed", "thu", "fri", "sat"];
+const getPrevMonthLastDays = (date, count) => {
   const lastDay = date.subtract(1, "month").endOf("month").date();
-  return rangeArr(amount).map((_, index) => lastDay - (amount - index - 1));
+  return rangeArr(count).map((_, index) => lastDay - (count - index - 1));
 };
 const getMonthDays = (date) => {
   const days = date.daysInMonth();
   return rangeArr(days).map((_, index) => index + 1);
 };
+const toNestedArr = (days) => rangeArr(days.length / 7).map((index) => {
+  const start = index * 7;
+  return days.slice(start, start + 7);
+});
 var script$1F = defineComponent({
-  props: {
-    selectedDay: {
-      type: Object
-    },
-    range: {
-      type: Array
-    },
-    date: {
-      type: Object
-    },
-    hideHeader: {
-      type: Boolean
-    }
-  },
-  emits: ["pick"],
-  setup(props, ctx) {
-    const { lang } = useLocale();
-    const WEEK_DAYS = ref(dayjs().locale(lang.value).localeData().weekdaysShort());
+  props: dateTableProps,
+  emits: dateTableEmits,
+  setup(props, { emit }) {
+    const { t, lang } = useLocale();
     const now = dayjs().locale(lang.value);
     const firstDayOfWeek = now.$locale().weekStart || 0;
-    const toNestedArr = (days) => {
-      return rangeArr(days.length / 7).map((_, index) => {
-        const start = index * 7;
-        return days.slice(start, start + 7);
-      });
-    };
-    const getFormattedDate = (day, type) => {
-      let result;
-      if (type === "prev") {
-        result = props.date.startOf("month").subtract(1, "month").date(day);
-      } else if (type === "next") {
-        result = props.date.startOf("month").add(1, "month").date(day);
-      } else {
-        result = props.date.date(day);
-      }
-      return result;
-    };
-    const getCellClass = ({ text, type }) => {
-      const classes = [type];
-      if (type === "current") {
-        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 pickDay = ({ text, type }) => {
-      const date = getFormattedDate(text, type);
-      ctx.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()
-      };
-    };
-    const isInRange = computed(() => {
-      return props.range && props.range.length;
-    });
+    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) => ({
+        const currentMonthRange = rangeArr(end.date() - start.date() + 1).map((index) => ({
           text: start.date() + index,
           type: "current"
         }));
@@ -13196,17 +13145,53 @@ var script$1F = defineComponent({
     const weekDays = computed(() => {
       const start = firstDayOfWeek;
       if (start === 0) {
-        return WEEK_DAYS.value;
+        return WEEK_DAYS.map((_) => t(`el.datepicker.weeks.${_}`));
       } else {
-        return WEEK_DAYS.value.slice(start).concat(WEEK_DAYS.value.slice(0, start));
+        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 getCellClass = ({ text, type }) => {
+      const classes = [type];
+      if (type === "current") {
+        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 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 {
       isInRange,
       weekDays,
       rows,
       getCellClass,
-      pickDay,
+      handlePickDay,
       getSlotData
     };
   }
@@ -13242,7 +13227,7 @@ function render$1z(_ctx, _cache, $props, $setup, $data, $options) {
             return openBlock(), createElementBlock("td", {
               key,
               class: normalizeClass(_ctx.getCellClass(cell)),
-              onClick: ($event) => _ctx.pickDay(cell)
+              onClick: ($event) => _ctx.handlePickDay(cell)
             }, [
               createElementVNode("div", _hoisted_3$H, [
                 renderSlot(_ctx.$slots, "dateCell", {
@@ -13262,7 +13247,20 @@ function render$1z(_ctx, _cache, $props, $setup, $data, $options) {
 script$1F.render = render$1z;
 script$1F.__file = "packages/components/calendar/src/date-table.vue";
 
-const { ButtonGroup: ElButtonGroup$1 } = ElButton;
+const calendarProps = buildProps({
+  modelValue: {
+    type: Date
+  },
+  range: {
+    type: definePropType(Array),
+    validator: (range) => Array.isArray(range) && range.length === 2 && range.every((item) => item instanceof Date)
+  }
+});
+const calendarEmits = {
+  [UPDATE_MODEL_EVENT]: (value) => value instanceof Date,
+  input: (value) => value instanceof Date
+};
+
 var script$1E = defineComponent({
   name: "ElCalendar",
   components: {
@@ -13270,24 +13268,11 @@ var script$1E = defineComponent({
     ElButton,
     ElButtonGroup: ElButtonGroup$1
   },
-  props: {
-    modelValue: {
-      type: Date
-    },
-    range: {
-      type: Array,
-      validator: (range) => {
-        if (Array.isArray(range)) {
-          return range.length === 2 && range.every((item) => item instanceof Date);
-        }
-        return false;
-      }
-    }
-  },
-  emits: ["input", "update:modelValue"],
-  setup(props, ctx) {
+  props: calendarProps,
+  emits: calendarEmits,
+  setup(props, { emit }) {
     const { t, lang } = useLocale();
-    const selectedDay = ref(null);
+    const selectedDay = ref();
     const now = dayjs().locale(lang.value);
     const prevMonthDayjs = computed(() => {
       return date.value.subtract(1, "month");
@@ -13315,10 +13300,12 @@ var script$1E = defineComponent({
         return date.value;
       },
       set(val) {
+        if (!val)
+          return;
         selectedDay.value = val;
         const result = val.toDate();
-        ctx.emit("input", result);
-        ctx.emit("update:modelValue", result);
+        emit("input", result);
+        emit("update:modelValue", result);
       }
     });
     const date = computed(() => {
@@ -13511,13 +13498,9 @@ function render$1y(_ctx, _cache, $props, $setup, $data, $options) {
 }
 
 script$1E.render = render$1y;
-script$1E.__file = "packages/components/calendar/src/index.vue";
+script$1E.__file = "packages/components/calendar/src/calendar.vue";
 
-script$1E.install = (app) => {
-  app.component(script$1E.name, script$1E);
-};
-const _Calendar = script$1E;
-const ElCalendar = _Calendar;
+const ElCalendar = withInstall(script$1E);
 
 const cardProps = buildProps({
   header: {
@@ -13642,8 +13625,8 @@ var script$1C = defineComponent({
   name: "ElCarousel",
   components: {
     ElIcon,
-    ArrowLeft,
-    ArrowRight
+    ArrowLeft: arrowLeft,
+    ArrowRight: arrowRight
   },
   props: {
     initialIndex: {
@@ -14193,7 +14176,6 @@ const useCheckboxProps = {
   size: String
 };
 const useCheckboxGroup = () => {
-  const ELEMENT = useGlobalConfig$1();
   const elForm = inject(elFormKey, {});
   const elFormItem = inject(elFormItemKey, {});
   const checkboxGroup = inject("CheckboxGroup", {});
@@ -14205,7 +14187,6 @@ const useCheckboxGroup = () => {
     isGroup,
     checkboxGroup,
     elForm,
-    ELEMENT,
     elFormItemSize,
     elFormItem
   };
@@ -14215,14 +14196,10 @@ const useModel = (props) => {
   const { emit } = getCurrentInstance();
   const { isGroup, checkboxGroup } = useCheckboxGroup();
   const isLimitExceeded = ref(false);
-  const store = computed(() => {
-    var _a;
-    return checkboxGroup ? (_a = checkboxGroup.modelValue) == null ? void 0 : _a.value : props.modelValue;
-  });
   const model = computed({
     get() {
-      var _a;
-      return isGroup.value ? store.value : (_a = props.modelValue) != null ? _a : selfModel.value;
+      var _a, _b;
+      return isGroup.value ? (_a = checkboxGroup.modelValue) == null ? void 0 : _a.value : (_b = props.modelValue) != null ? _b : selfModel.value;
     },
     set(val) {
       var _a;
@@ -14241,12 +14218,9 @@ const useModel = (props) => {
   };
 };
 const useCheckboxStatus = (props, { model }) => {
-  const { isGroup, checkboxGroup, elFormItemSize, ELEMENT } = useCheckboxGroup();
+  const { isGroup, checkboxGroup } = useCheckboxGroup();
   const focus = ref(false);
-  const size = computed(() => {
-    var _a;
-    return ((_a = checkboxGroup == null ? void 0 : checkboxGroup.checkboxGroupSize) == null ? void 0 : _a.value) || elFormItemSize.value || ELEMENT.size;
-  });
+  const size = useSize(checkboxGroup == null ? void 0 : checkboxGroup.checkboxGroupSize, { prop: true });
   const isChecked = computed(() => {
     const value = model.value;
     if (toTypeString(value) === "[object Boolean]") {
@@ -14259,11 +14233,10 @@ const useCheckboxStatus = (props, { model }) => {
       return !!value;
     }
   });
-  const checkboxSize = computed(() => {
+  const checkboxSize = useSize(computed(() => {
     var _a;
-    const temCheckboxSize = props.size || elFormItemSize.value || ELEMENT.size;
-    return isGroup.value ? ((_a = checkboxGroup == null ? void 0 : checkboxGroup.checkboxGroupSize) == null ? void 0 : _a.value) || temCheckboxSize : temCheckboxSize;
-  });
+    return isGroup.value ? (_a = checkboxGroup == null ? void 0 : checkboxGroup.checkboxGroupSize) == null ? void 0 : _a.value : void 0;
+  }));
   return {
     isChecked,
     focus,
@@ -14583,8 +14556,8 @@ var script$1y = defineComponent({
   },
   emits: [UPDATE_MODEL_EVENT, "change"],
   setup(props, ctx) {
-    const { elFormItem, elFormItemSize, ELEMENT } = useCheckboxGroup();
-    const checkboxGroupSize = computed(() => props.size || elFormItemSize.value || ELEMENT.size);
+    const { elFormItem } = useCheckboxGroup();
+    const checkboxGroupSize = useSize();
     const changeEvent = (value) => {
       ctx.emit(UPDATE_MODEL_EVENT, value);
       nextTick(() => {
@@ -14635,7 +14608,8 @@ const ElCheckboxButton = withNoopInstall(script$1z);
 const ElCheckboxGroup$1 = withNoopInstall(script$1y);
 
 const radioPropsBase = buildProps({
-  ...useFormItemProps,
+  size: useSizeProp,
+  disabled: Boolean,
   label: {
     type: [String, Number, Boolean],
     default: ""
@@ -14674,10 +14648,8 @@ const useRadio = (props, emit) => {
       radioRef.value.checked = props.modelValue === props.label;
     }
   });
-  const { size, disabled } = useFormItem({
-    size: computed(() => radioGroup == null ? void 0 : radioGroup.size),
-    disabled: computed(() => radioGroup == null ? void 0 : radioGroup.disabled)
-  });
+  const size = useSize(computed(() => radioGroup == null ? void 0 : radioGroup.size));
+  const disabled = useDisabled$1(computed(() => radioGroup == null ? void 0 : radioGroup.disabled));
   const focus = ref(false);
   const tabIndex = computed(() => {
     return disabled.value || isGroup.value && modelValue.value !== props.label ? -1 : 0;
@@ -14865,7 +14837,8 @@ script$1w.render = render$1q;
 script$1w.__file = "packages/components/radio/src/radio-button.vue";
 
 const radioGroupProps = buildProps({
-  ...useFormItemProps,
+  size: useSizeProp,
+  disabled: Boolean,
   modelValue: {
     type: [String, Number, Boolean],
     default: ""
@@ -14887,7 +14860,7 @@ var script$1v = defineComponent({
   emits: radioGroupEmits,
   setup(props, ctx) {
     const radioGroupRef = ref();
-    const { size, disabled, formItem } = useFormItem({});
+    const { formItem } = useFormItem();
     const changeEvent = (value) => {
       ctx.emit(UPDATE_MODEL_EVENT, value);
       nextTick(() => ctx.emit("change", value));
@@ -14934,8 +14907,6 @@ var script$1v = defineComponent({
     }));
     watch(() => props.modelValue, () => formItem == null ? void 0 : formItem.validate("change"));
     return {
-      size,
-      disabled,
       radioGroupRef,
       handleKeydown
     };
@@ -14987,9 +14958,9 @@ var script$1u = defineComponent({
     ElRadio,
     NodeContent,
     ElIcon: ElIcon$1,
-    Check,
-    Loading: Loading$2,
-    ArrowRight
+    Check: check,
+    Loading: loading,
+    ArrowRight: arrowRight
   },
   props: {
     node: {
@@ -15816,12 +15787,11 @@ const tagEmits = {
 
 var script$1r = defineComponent({
   name: "ElTag",
-  components: { ElIcon: ElIcon$1, Close },
+  components: { ElIcon: ElIcon$1, Close: close$2 },
   props: tagProps,
   emits: tagEmits,
   setup(props, { emit }) {
-    const ELEMENT = useGlobalConfig$1();
-    const tagSize = computed(() => props.size || ELEMENT.size);
+    const tagSize = useSize();
     const classes = computed(() => {
       const { type, hit, effect } = props;
       return [
@@ -15930,9 +15900,9 @@ var script$1q = defineComponent({
     ElScrollbar: ElScrollbar$1,
     ElTag,
     ElIcon: ElIcon$1,
-    CircleClose,
-    Check,
-    ArrowDown
+    CircleClose: circleClose,
+    Check: check,
+    ArrowDown: arrowDown
   },
   directives: {
     Clickoutside: ClickOutside
@@ -15992,7 +15962,6 @@ var script$1q = defineComponent({
     let inputInitialHeight = 0;
     let pressDeleteCount = 0;
     const { t } = useLocale();
-    const $ELEMENT = useGlobalConfig$1();
     const elForm = inject(elFormKey, {});
     const elFormItem = inject(elFormItemKey, {});
     const popper = ref(null);
@@ -16010,7 +15979,7 @@ var script$1q = defineComponent({
     const isOnComposition = ref(false);
     const isDisabled = computed(() => props.disabled || elForm.disabled);
     const inputPlaceholder = computed(() => props.placeholder || t("el.cascader.placeholder"));
-    const realSize = computed(() => props.size || elFormItem.size || $ELEMENT.size);
+    const realSize = useSize();
     const tagSize = computed(() => ["small", "mini"].includes(realSize.value) ? "mini" : "small");
     const multiple = computed(() => !!props.props.multiple);
     const readonly = computed(() => !props.filterable || multiple.value);
@@ -16796,7 +16765,7 @@ const ElCollapseTransition = _CollapseTransition;
 
 var script$1m = defineComponent({
   name: "ElCollapseItem",
-  components: { ElCollapseTransition: _CollapseTransition, ElIcon: ElIcon$1, ArrowRight },
+  components: { ElCollapseTransition: _CollapseTransition, ElIcon: ElIcon$1, ArrowRight: arrowRight },
   props: {
     title: {
       type: String,
@@ -17650,8 +17619,8 @@ var script$1h = defineComponent({
     ElPopper,
     ElInput: ElInput$1,
     ElIcon: ElIcon$1,
-    Close,
-    ArrowDown,
+    Close: close$2,
+    ArrowDown: arrowDown,
     SvPanel: script$1i,
     HueSlider: script$1k,
     AlphaSlider: script$1l,
@@ -17674,7 +17643,6 @@ var script$1h = defineComponent({
   },
   emits: ["change", "active-change", UPDATE_MODEL_EVENT],
   setup(props, { emit }) {
-    const ELEMENT = useGlobalConfig$1();
     const { t } = useLocale();
     const elForm = inject(elFormKey, {});
     const elFormItem = inject(elFormItemKey, {});
@@ -17695,9 +17663,7 @@ var script$1h = defineComponent({
       }
       return displayedRgb(color, props.showAlpha);
     });
-    const colorSize = computed(() => {
-      return props.size || elFormItem.size || ELEMENT.size;
-    });
+    const colorSize = useSize();
     const colorDisabled = computed(() => {
       return props.disabled || elForm.disabled;
     });
@@ -17973,17 +17939,16 @@ script$1h.install = (app) => {
 const _ColorPicker = script$1h;
 const ElColorPicker = _ColorPicker;
 
-const configProviderProps = {
+const configProviderProps = buildProps({
   ...useLocaleProps,
-  button: buildProp({
-    type: definePropType(Object),
-    default: () => {
-      return mutable({
-        autoInsertSpace: true
-      });
-    }
-  })
-};
+  size: {
+    type: String,
+    values: ["large", "medium", "small", "mini"]
+  },
+  button: {
+    type: definePropType(Object)
+  }
+});
 
 const ConfigProvider = defineComponent({
   name: "ElConfigProvider",
@@ -18895,10 +18860,10 @@ var script$18 = defineComponent({
     TimePickPanel: script$1H,
     MonthTable: script$1a,
     YearTable: script$19,
-    DArrowLeft,
-    ArrowLeft,
-    DArrowRight,
-    ArrowRight
+    DArrowLeft: dArrowLeft,
+    ArrowLeft: arrowLeft,
+    DArrowRight: dArrowRight,
+    ArrowRight: arrowRight
   },
   directives: { clickoutside: ClickOutside },
   props: {
@@ -19507,10 +19472,10 @@ var script$17 = defineComponent({
     ElInput: ElInput$1,
     ElButton,
     ElIcon: ElIcon$1,
-    DArrowLeft,
-    ArrowLeft,
-    DArrowRight,
-    ArrowRight
+    DArrowLeft: dArrowLeft,
+    ArrowLeft: arrowLeft,
+    DArrowRight: dArrowRight,
+    ArrowRight: arrowRight
   },
   props: {
     unlinkPanels: Boolean,
@@ -20231,7 +20196,7 @@ script$17.render = render$11;
 script$17.__file = "packages/components/date-picker/src/date-picker-com/panel-date-range.vue";
 
 var script$16 = defineComponent({
-  components: { MonthTable: script$1a, ElIcon: ElIcon$1, DArrowLeft, DArrowRight },
+  components: { MonthTable: script$1a, ElIcon: ElIcon$1, DArrowLeft: dArrowLeft, DArrowRight: dArrowRight },
   props: {
     unlinkPanels: Boolean,
     parsedValue: {
@@ -20766,10 +20731,7 @@ var script$14 = defineComponent({
   },
   setup(props, { slots }) {
     provide(elDescriptionsKey, props);
-    const $ELEMENT = useGlobalConfig$1();
-    const descriptionsSize = computed(() => {
-      return props.size || $ELEMENT.size;
-    });
+    const descriptionsSize = useSize();
     const flattedChildren = (children) => {
       const temp = Array.isArray(children) ? children : [children];
       const res = [];
@@ -21003,6 +20965,10 @@ const dialogProps = buildProps({
     type: String,
     default: ""
   },
+  closeIcon: {
+    type: definePropType([String, Object]),
+    default: ""
+  },
   closeOnClickModal: {
     type: Boolean,
     default: true
@@ -21182,6 +21148,8 @@ const useDialog = (props, { emit }, targetRef) => {
     beforeLeave,
     handleClose,
     onModalClick,
+    close,
+    doClose,
     closed,
     style,
     rendered,
@@ -21226,7 +21194,6 @@ const _hoisted_5$f = {
   class: "el-dialog__footer"
 };
 function render$Z(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_close = resolveComponent("close");
   const _component_el_icon = resolveComponent("el-icon");
   const _component_el_overlay = resolveComponent("el-overlay");
   const _directive_trap_focus = resolveDirective("trap-focus");
@@ -21284,7 +21251,7 @@ function render$Z(_ctx, _cache, $props, $setup, $data, $options) {
                   }, [
                     createVNode(_component_el_icon, { class: "el-dialog__close" }, {
                       default: withCtx(() => [
-                        createVNode(_component_close)
+                        (openBlock(), createBlock(resolveDynamicComponent(_ctx.closeIcon || "close")))
                       ]),
                       _: 1
                     })
@@ -21326,6 +21293,10 @@ const dividerProps = buildProps({
     type: String,
     values: ["left", "center", "right"],
     default: "center"
+  },
+  borderStyle: {
+    type: definePropType(String),
+    default: "solid"
   }
 });
 
@@ -21336,7 +21307,8 @@ var script$12 = defineComponent({
 
 function render$Y(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("div", {
-    class: normalizeClass(["el-divider", `el-divider--${_ctx.direction}`])
+    class: normalizeClass(["el-divider", `el-divider--${_ctx.direction}`]),
+    style: normalizeStyle({ "--el-border-style": _ctx.borderStyle })
   }, [
     _ctx.$slots.default && _ctx.direction !== "vertical" ? (openBlock(), createElementBlock("div", {
       key: 0,
@@ -21344,7 +21316,7 @@ function render$Y(_ctx, _cache, $props, $setup, $data, $options) {
     }, [
       renderSlot(_ctx.$slots, "default")
     ], 2)) : createCommentVNode("v-if", true)
-  ], 2);
+  ], 6);
 }
 
 script$12.render = render$Y;
@@ -21352,46 +21324,49 @@ script$12.__file = "packages/components/divider/src/divider.vue";
 
 const ElDivider = withInstall(script$12);
 
+const drawerProps = buildProps({
+  ...dialogProps,
+  direction: {
+    type: String,
+    default: "rtl",
+    values: ["ltr", "rtl", "ttb", "btt"]
+  },
+  size: {
+    type: [String, Number],
+    default: "30%"
+  },
+  withHeader: {
+    type: Boolean,
+    default: true
+  },
+  modalFade: {
+    type: Boolean,
+    default: true
+  }
+});
+const drawerEmits = dialogEmits;
+
 var script$11 = defineComponent({
   name: "ElDrawer",
   components: {
     ElOverlay,
     ElIcon: ElIcon$1,
-    Close
+    Close: close$2
   },
   directives: {
     TrapFocus
   },
-  props: {
-    ...dialogProps,
-    direction: {
-      type: String,
-      default: "rtl",
-      validator: (val) => {
-        return ["ltr", "rtl", "ttb", "btt"].indexOf(val) !== -1;
-      }
-    },
-    size: {
-      type: [String, Number],
-      default: "30%"
-    },
-    withHeader: {
-      type: Boolean,
-      default: true
-    },
-    modalFade: {
-      type: Boolean,
-      default: true
-    }
-  },
-  emits: dialogEmits,
+  props: drawerProps,
+  emits: drawerEmits,
   setup(props, ctx) {
-    const drawerRef = ref(null);
+    const drawerRef = ref();
+    const isHorizontal = computed(() => props.direction === "rtl" || props.direction === "ltr");
+    const drawerSize = computed(() => typeof props.size === "number" ? `${props.size}px` : props.size);
     return {
       ...useDialog(props, ctx, drawerRef),
       drawerRef,
-      isHorizontal: computed(() => props.direction === "rtl" || props.direction === "ltr"),
-      drawerSize: computed(() => typeof props.size === "number" ? `${props.size}px` : props.size)
+      isHorizontal,
+      drawerSize
     };
   }
 });
@@ -21482,108 +21457,9 @@ function render$X(_ctx, _cache, $props, $setup, $data, $options) {
 }
 
 script$11.render = render$X;
-script$11.__file = "packages/components/drawer/src/index.vue";
+script$11.__file = "packages/components/drawer/src/drawer.vue";
 
-script$11.install = (app) => {
-  app.component(script$11.name, script$11);
-};
-const _Drawer = script$11;
-const ElDrawer = _Drawer;
-
-const useDropdown = () => {
-  const ELEMENT = useGlobalConfig$1();
-  const elDropdown = inject("elDropdown", {});
-  const _elDropdownSize = computed(() => elDropdown == null ? void 0 : elDropdown.dropdownSize);
-  return {
-    ELEMENT,
-    elDropdown,
-    _elDropdownSize
-  };
-};
-const initDropdownDomEvent = (dropdownChildren, triggerElm, _instance) => {
-  const menuItems = ref(null);
-  const menuItemsArray = ref(null);
-  const dropdownElm = ref(null);
-  const listId = ref(`dropdown-menu-${generateId()}`);
-  dropdownElm.value = dropdownChildren == null ? void 0 : dropdownChildren.subTree.el;
-  function removeTabindex() {
-    var _a;
-    triggerElm.setAttribute("tabindex", "-1");
-    (_a = menuItemsArray.value) == null ? void 0 : _a.forEach((item) => {
-      item.setAttribute("tabindex", "-1");
-    });
-  }
-  function resetTabindex(ele) {
-    removeTabindex();
-    ele == null ? void 0 : ele.setAttribute("tabindex", "0");
-  }
-  function handleTriggerKeyDown(ev) {
-    const code = ev.code;
-    if ([EVENT_CODE.up, EVENT_CODE.down].includes(code)) {
-      removeTabindex();
-      resetTabindex(menuItems.value[0]);
-      menuItems.value[0].focus();
-      ev.preventDefault();
-      ev.stopPropagation();
-    } else if (code === EVENT_CODE.enter) {
-      _instance.handleClick();
-    } else if ([EVENT_CODE.tab, EVENT_CODE.esc].includes(code)) {
-      _instance.hide();
-    }
-  }
-  function handleItemKeyDown(ev) {
-    const code = ev.code;
-    const target = ev.target;
-    const currentIndex = menuItemsArray.value.indexOf(target);
-    const max = menuItemsArray.value.length - 1;
-    let nextIndex;
-    if ([EVENT_CODE.up, EVENT_CODE.down].includes(code)) {
-      if (code === EVENT_CODE.up) {
-        nextIndex = currentIndex !== 0 ? currentIndex - 1 : 0;
-      } else {
-        nextIndex = currentIndex < max ? currentIndex + 1 : max;
-      }
-      removeTabindex();
-      resetTabindex(menuItems.value[nextIndex]);
-      menuItems.value[nextIndex].focus();
-      ev.preventDefault();
-      ev.stopPropagation();
-    } else if (code === EVENT_CODE.enter) {
-      triggerElmFocus();
-      target.click();
-      if (_instance.props.hideOnClick) {
-        _instance.hide();
-      }
-    } else if ([EVENT_CODE.tab, EVENT_CODE.esc].includes(code)) {
-      _instance.hide();
-      triggerElmFocus();
-    }
-  }
-  function initAria() {
-    dropdownElm.value.setAttribute("id", listId.value);
-    triggerElm.setAttribute("aria-haspopup", "list");
-    triggerElm.setAttribute("aria-controls", listId.value);
-    if (!_instance.props.splitButton) {
-      triggerElm.setAttribute("role", "button");
-      triggerElm.setAttribute("tabindex", _instance.props.tabindex);
-      addClass(triggerElm, "el-dropdown-selfdefine");
-    }
-  }
-  function initEvent() {
-    on(triggerElm, "keydown", handleTriggerKeyDown);
-    on(dropdownElm.value, "keydown", handleItemKeyDown, true);
-  }
-  function initDomOperation() {
-    menuItems.value = dropdownElm.value.querySelectorAll("[tabindex='-1']");
-    menuItemsArray.value = [].slice.call(menuItems.value);
-    initEvent();
-    initAria();
-  }
-  function triggerElmFocus() {
-    triggerElm.focus();
-  }
-  initDomOperation();
-};
+const ElDrawer = withInstall(script$11);
 
 const { ButtonGroup: ElButtonGroup } = ElButton;
 var script$10 = defineComponent({
@@ -21594,7 +21470,7 @@ var script$10 = defineComponent({
     ElScrollbar: ElScrollbar$1,
     ElPopper,
     ElIcon: ElIcon$1,
-    ArrowDown
+    ArrowDown: arrowDown
   },
   props: {
     trigger: {
@@ -21639,7 +21515,6 @@ var script$10 = defineComponent({
   emits: ["visible-change", "click", "command"],
   setup(props, { emit }) {
     const _instance = getCurrentInstance();
-    const { ELEMENT } = useDropdown();
     const timeout = ref(null);
     const visible = ref(false);
     const scrollbar = ref(null);
@@ -21718,7 +21593,7 @@ var script$10 = defineComponent({
       var _a, _b;
       (_b = (_a = triggerElm.value) == null ? void 0 : _a.blur) == null ? void 0 : _b.call(_a);
     }
-    const dropdownSize = computed(() => props.size || ELEMENT.size);
+    const dropdownSize = useSize();
     function commandHandler(...args) {
       emit("command", ...args);
     }
@@ -21860,6 +21735,99 @@ function render$W(_ctx, _cache, $props, $setup, $data, $options) {
 script$10.render = render$W;
 script$10.__file = "packages/components/dropdown/src/dropdown.vue";
 
+const useDropdown = () => {
+  const elDropdown = inject("elDropdown", {});
+  const _elDropdownSize = computed(() => elDropdown == null ? void 0 : elDropdown.dropdownSize);
+  return {
+    elDropdown,
+    _elDropdownSize
+  };
+};
+const initDropdownDomEvent = (dropdownChildren, triggerElm, _instance) => {
+  const menuItems = ref(null);
+  const menuItemsArray = ref(null);
+  const dropdownElm = ref(null);
+  const listId = ref(`dropdown-menu-${generateId()}`);
+  dropdownElm.value = dropdownChildren == null ? void 0 : dropdownChildren.subTree.el;
+  function removeTabindex() {
+    var _a;
+    triggerElm.setAttribute("tabindex", "-1");
+    (_a = menuItemsArray.value) == null ? void 0 : _a.forEach((item) => {
+      item.setAttribute("tabindex", "-1");
+    });
+  }
+  function resetTabindex(ele) {
+    removeTabindex();
+    ele == null ? void 0 : ele.setAttribute("tabindex", "0");
+  }
+  function handleTriggerKeyDown(ev) {
+    const code = ev.code;
+    if ([EVENT_CODE.up, EVENT_CODE.down].includes(code)) {
+      removeTabindex();
+      resetTabindex(menuItems.value[0]);
+      menuItems.value[0].focus();
+      ev.preventDefault();
+      ev.stopPropagation();
+    } else if (code === EVENT_CODE.enter) {
+      _instance.handleClick();
+    } else if ([EVENT_CODE.tab, EVENT_CODE.esc].includes(code)) {
+      _instance.hide();
+    }
+  }
+  function handleItemKeyDown(ev) {
+    const code = ev.code;
+    const target = ev.target;
+    const currentIndex = menuItemsArray.value.indexOf(target);
+    const max = menuItemsArray.value.length - 1;
+    let nextIndex;
+    if ([EVENT_CODE.up, EVENT_CODE.down].includes(code)) {
+      if (code === EVENT_CODE.up) {
+        nextIndex = currentIndex !== 0 ? currentIndex - 1 : 0;
+      } else {
+        nextIndex = currentIndex < max ? currentIndex + 1 : max;
+      }
+      removeTabindex();
+      resetTabindex(menuItems.value[nextIndex]);
+      menuItems.value[nextIndex].focus();
+      ev.preventDefault();
+      ev.stopPropagation();
+    } else if (code === EVENT_CODE.enter) {
+      triggerElmFocus();
+      target.click();
+      if (_instance.props.hideOnClick) {
+        _instance.hide();
+      }
+    } else if ([EVENT_CODE.tab, EVENT_CODE.esc].includes(code)) {
+      _instance.hide();
+      triggerElmFocus();
+    }
+  }
+  function initAria() {
+    dropdownElm.value.setAttribute("id", listId.value);
+    triggerElm.setAttribute("aria-haspopup", "list");
+    triggerElm.setAttribute("aria-controls", listId.value);
+    if (!_instance.props.splitButton) {
+      triggerElm.setAttribute("role", "button");
+      triggerElm.setAttribute("tabindex", _instance.props.tabindex);
+      addClass(triggerElm, "el-dropdown-selfdefine");
+    }
+  }
+  function initEvent() {
+    on(triggerElm, "keydown", handleTriggerKeyDown);
+    on(dropdownElm.value, "keydown", handleItemKeyDown, true);
+  }
+  function initDomOperation() {
+    menuItems.value = dropdownElm.value.querySelectorAll("[tabindex='-1']");
+    menuItemsArray.value = [].slice.call(menuItems.value);
+    initEvent();
+    initAria();
+  }
+  function triggerElmFocus() {
+    triggerElm.focus();
+  }
+  initDomOperation();
+};
+
 var script$$ = defineComponent({
   name: "ElDropdownItem",
   components: { ElIcon: ElIcon$1 },
@@ -23805,7 +23773,6 @@ var script$W = defineComponent({
     }
   },
   setup(props, { slots }) {
-    const $ELEMENT = useGlobalConfig$1();
     const elForm = inject(elFormKey, {});
     const validateState = ref("");
     const validateMessage = ref("");
@@ -23883,10 +23850,7 @@ var script$W = defineComponent({
       }
       return required;
     });
-    const elFormItemSize = computed(() => props.size || elForm.size);
-    const sizeClass = computed(() => {
-      return elFormItemSize.value || $ELEMENT.size;
-    });
+    const sizeClass = useSize(void 0, { formItem: false });
     const validate = (trigger, callback = NOOP) => {
       if (!isValidationEnabled.value) {
         callback();
@@ -24105,11 +24069,11 @@ const imageViewerEmits = {
 const Mode = {
   CONTAIN: {
     name: "contain",
-    icon: markRaw(FullScreen)
+    icon: markRaw(fullScreen)
   },
   ORIGINAL: {
     name: "original",
-    icon: markRaw(ScaleToOriginal)
+    icon: markRaw(scaleToOriginal)
   }
 };
 const mousewheelEventName = isFirefox() ? "DOMMouseScroll" : "mousewheel";
@@ -24117,13 +24081,13 @@ var script$V = defineComponent({
   name: "ElImageViewer",
   components: {
     ElIcon: ElIcon$1,
-    Close,
-    ArrowLeft,
-    ArrowRight,
-    ZoomOut,
-    ZoomIn,
-    RefreshLeft,
-    RefreshRight
+    Close: close$2,
+    ArrowLeft: arrowLeft,
+    ArrowRight: arrowRight,
+    ZoomOut: zoomOut,
+    ZoomIn: zoomIn,
+    RefreshLeft: refreshLeft,
+    RefreshRight: refreshRight
   },
   props: imageViewerProps,
   emits: imageViewerEmits,
@@ -24813,10 +24777,10 @@ var script$T = defineComponent({
   components: {
     ElInput: ElInput$1,
     ElIcon,
-    ArrowUp,
-    ArrowDown,
-    Plus,
-    Minus
+    ArrowUp: arrowUp,
+    ArrowDown: arrowDown,
+    Plus: plus,
+    Minus: minus
   },
   directives: {
     RepeatClick
@@ -24843,7 +24807,8 @@ var script$T = defineComponent({
     const controlsAtRight = computed(() => {
       return props.controls && props.controlsPosition === "right";
     });
-    const { size: inputNumberSize, disabled: inputNumberDisabled } = useFormItem({});
+    const inputNumberSize = useSize();
+    const inputNumberDisabled = useDisabled$1();
     const displayValue = computed(() => {
       if (data.userInput !== null) {
         return data.userInput;
@@ -24954,11 +24919,11 @@ var script$T = defineComponent({
           newVal = toPrecision(newVal, props.precision);
         }
       }
-      if (newVal !== void 0 && newVal >= props.max) {
+      if (newVal !== void 0 && newVal > props.max) {
         newVal = props.max;
         emit("update:modelValue", newVal);
       }
-      if (newVal !== void 0 && newVal <= props.min) {
+      if (newVal !== void 0 && newVal < props.min) {
         newVal = props.min;
         emit("update:modelValue", newVal);
       }
@@ -25052,6 +25017,7 @@ function render$N(_ctx, _cache, $props, $setup, $data, $options) {
     createVNode(_component_el_input, {
       ref: "input",
       type: "number",
+      step: _ctx.step,
       "model-value": _ctx.displayValue,
       placeholder: _ctx.placeholder,
       disabled: _ctx.inputNumberDisabled,
@@ -25068,7 +25034,7 @@ function render$N(_ctx, _cache, $props, $setup, $data, $options) {
       onFocus: _cache[3] || (_cache[3] = (event) => _ctx.$emit("focus", event)),
       onInput: _ctx.handleInput,
       onChange: _ctx.handleInputChange
-    }, null, 8, ["model-value", "placeholder", "disabled", "size", "max", "min", "name", "label", "onKeydown", "onInput", "onChange"])
+    }, null, 8, ["step", "model-value", "placeholder", "disabled", "size", "max", "min", "name", "label", "onKeydown", "onInput", "onChange"])
   ], 34);
 }
 
@@ -25416,19 +25382,19 @@ const subMenuProps = buildProps({
     default: void 0
   }
 });
-const COMPONENT_NAME$5 = "ElSubMenu";
+const COMPONENT_NAME$6 = "ElSubMenu";
 var SubMenu = defineComponent({
-  name: COMPONENT_NAME$5,
+  name: COMPONENT_NAME$6,
   props: subMenuProps,
   setup(props, { slots, expose }) {
     const instance = getCurrentInstance();
     const { paddingStyle, indexPath, parentMenu } = useMenu(instance, computed(() => props.index));
     const rootMenu = inject("rootMenu");
     if (!rootMenu)
-      throwError(COMPONENT_NAME$5, "can not inject root menu");
+      throwError(COMPONENT_NAME$6, "can not inject root menu");
     const subMenu = inject(`subMenu:${parentMenu.value.uid}`);
     if (!subMenu)
-      throwError(COMPONENT_NAME$5, "can not inject sub menu");
+      throwError(COMPONENT_NAME$6, "can not inject sub menu");
     const items = ref({});
     const subMenus = ref({});
     let timeout;
@@ -25437,7 +25403,7 @@ var SubMenu = defineComponent({
     const verticalTitleRef = ref();
     const vPopper = ref();
     const subMenuTitleIcon = computed(() => {
-      return mode.value === "horizontal" && isFirstLevel.value || mode.value === "vertical" && !rootMenu.props.collapse ? ArrowDown : ArrowRight;
+      return mode.value === "horizontal" && isFirstLevel.value || mode.value === "vertical" && !rootMenu.props.collapse ? arrowDown : arrowRight;
     });
     const isFirstLevel = computed(() => {
       let isFirstLevel2 = true;
@@ -25913,7 +25879,7 @@ var Menu = defineComponent({
           }, {
             title: () => h$1(ElIcon$1, {
               class: ["el-sub-menu__icon-more"]
-            }, { default: () => h$1(More) }),
+            }, { default: () => h$1(more) }),
             default: () => slotMore
           }));
         }
@@ -25998,7 +25964,8 @@ var Tooltip = defineComponent({
       showAfter,
       visibleArrow,
       modelValue,
-      tabindex
+      tabindex,
+      fallbackPlacements
     } = this;
     const throwErrorTip = () => {
       throwError("[ElTooltip]", "you need to provide a valid default slot.");
@@ -26012,7 +25979,8 @@ var Tooltip = defineComponent({
       showAfter: openDelay || showAfter,
       showArrow: visibleArrow,
       visible: modelValue,
-      "onUpdate:visible": onUpdateVisible
+      "onUpdate:visible": onUpdateVisible,
+      fallbackPlacements: fallbackPlacements.length ? fallbackPlacements : ["bottom-start", "top-start", "right", "left"]
     }, {
       default: () => $slots.content ? $slots.content() : content,
       trigger: () => {
@@ -26049,9 +26017,9 @@ const menuItemEmits = {
   click: (item) => isString$1(item.index) && Array.isArray(item.indexPath)
 };
 
-const COMPONENT_NAME$4 = "ElMenuItem";
+const COMPONENT_NAME$5 = "ElMenuItem";
 var script$Q = defineComponent({
-  name: COMPONENT_NAME$4,
+  name: COMPONENT_NAME$5,
   components: {
     ElTooltip: _Tooltip
   },
@@ -26061,11 +26029,11 @@ var script$Q = defineComponent({
     const instance = getCurrentInstance();
     const rootMenu = inject("rootMenu");
     if (!rootMenu)
-      throwError(COMPONENT_NAME$4, "can not inject root menu");
+      throwError(COMPONENT_NAME$5, "can not inject root menu");
     const { parentMenu, paddingStyle, indexPath } = useMenu(instance, toRef(props, "index"));
     const subMenu = inject(`subMenu:${parentMenu.value.uid}`);
     if (!subMenu)
-      throwError(COMPONENT_NAME$4, "can not inject sub menu");
+      throwError(COMPONENT_NAME$5, "can not inject sub menu");
     const active = computed(() => props.index === rootMenu.activeIndex);
     const item = reactive({
       index: props.index,
@@ -26151,15 +26119,15 @@ const menuItemGroupProps = {
   title: String
 };
 
-const COMPONENT_NAME$3 = "ElMenuItemGroup";
+const COMPONENT_NAME$4 = "ElMenuItemGroup";
 var script$P = defineComponent({
-  name: COMPONENT_NAME$3,
+  name: COMPONENT_NAME$4,
   props: menuItemGroupProps,
   setup() {
     const instance = getCurrentInstance();
     const menu = inject("rootMenu");
     if (!menu)
-      throwError(COMPONENT_NAME$3, "can not inject root menu");
+      throwError(COMPONENT_NAME$4, "can not inject root menu");
     const levelPadding = computed(() => {
       if (menu.props.collapse)
         return 20;
@@ -26211,7 +26179,7 @@ const ElSubMenu = withNoopInstall(SubMenu);
 const pageHeaderProps = {
   icon: {
     type: [String, Object],
-    default: Back
+    default: back
   },
   title: String,
   content: {
@@ -26300,7 +26268,7 @@ var script$N = defineComponent({
   name: "ElPaginationPrev",
   components: {
     ElIcon,
-    ArrowLeft
+    ArrowLeft: arrowLeft
   },
   props: paginationPrevProps,
   emits: ["click"],
@@ -26355,7 +26323,7 @@ var script$M = defineComponent({
   name: "ElPaginationNext",
   components: {
     ElIcon,
-    ArrowRight
+    ArrowRight: arrowRight
   },
   props: paginationNextProps,
   emits: ["click"],
@@ -26633,7 +26601,6 @@ function useSelectStates(props) {
   });
 }
 const useSelect$2 = (props, states, ctx) => {
-  const ELEMENT = useGlobalConfig$1();
   const { t } = useLocale();
   const reference = ref(null);
   const input = ref(null);
@@ -26681,7 +26648,7 @@ const useSelect$2 = (props, states, ctx) => {
     });
     return props.filterable && props.allowCreate && states.query !== "" && !hasExistingOption;
   });
-  const selectSize = computed(() => props.size || elFormItem.size || ELEMENT.size);
+  const selectSize = useSize();
   const collapseTagSize = computed(() => ["small", "mini"].indexOf(selectSize.value) > -1 ? "mini" : "small");
   const dropMenuVisible = computed(() => states.visible && emptyText.value !== false);
   watch(() => selectDisabled.value, () => {
@@ -27317,7 +27284,7 @@ var script$J = defineComponent({
     },
     clearIcon: {
       type: [String, Object],
-      default: CircleClose
+      default: circleClose
     },
     fitInputWidth: {
       type: Boolean,
@@ -27325,7 +27292,11 @@ var script$J = defineComponent({
     },
     suffixIcon: {
       type: [String, Object],
-      default: ArrowUp
+      default: arrowUp
+    },
+    tagType: {
+      type: String,
+      default: "info"
     }
   },
   emits: [
@@ -27590,7 +27561,7 @@ function render$D(_ctx, _cache, $props, $setup, $data, $options) {
                 closable: !_ctx.selectDisabled && !_ctx.selected[0].isDisabled,
                 size: _ctx.collapseTagSize,
                 hit: _ctx.selected[0].hitState,
-                type: "info",
+                type: _ctx.tagType,
                 "disable-transitions": "",
                 onClose: _cache[0] || (_cache[0] = ($event) => _ctx.deleteTag($event, _ctx.selected[0]))
               }, {
@@ -27601,19 +27572,19 @@ function render$D(_ctx, _cache, $props, $setup, $data, $options) {
                   }, toDisplayString(_ctx.selected[0].currentLabel), 5)
                 ]),
                 _: 1
-              }, 8, ["closable", "size", "hit"]),
+              }, 8, ["closable", "size", "hit", "type"]),
               _ctx.selected.length > 1 ? (openBlock(), createBlock(_component_el_tag, {
                 key: 0,
                 closable: false,
                 size: _ctx.collapseTagSize,
-                type: "info",
+                type: _ctx.tagType,
                 "disable-transitions": ""
               }, {
                 default: withCtx(() => [
                   createElementVNode("span", _hoisted_3$k, "+ " + toDisplayString(_ctx.selected.length - 1), 1)
                 ]),
                 _: 1
-              }, 8, ["size"])) : createCommentVNode("v-if", true)
+              }, 8, ["size", "type"])) : createCommentVNode("v-if", true)
             ])) : createCommentVNode("v-if", true),
             createCommentVNode(" <div> "),
             !_ctx.collapseTags ? (openBlock(), createBlock(Transition, {
@@ -27632,7 +27603,7 @@ function render$D(_ctx, _cache, $props, $setup, $data, $options) {
                       closable: !_ctx.selectDisabled && !item.isDisabled,
                       size: _ctx.collapseTagSize,
                       hit: item.hitState,
-                      type: "info",
+                      type: _ctx.tagType,
                       "disable-transitions": "",
                       onClose: ($event) => _ctx.deleteTag($event, item)
                     }, {
@@ -27643,7 +27614,7 @@ function render$D(_ctx, _cache, $props, $setup, $data, $options) {
                         }, toDisplayString(item.currentLabel), 5)
                       ]),
                       _: 2
-                    }, 1032, ["closable", "size", "hit", "onClose"]);
+                    }, 1032, ["closable", "size", "hit", "type", "onClose"]);
                   }), 128))
                 ], 4)
               ]),
@@ -28049,9 +28020,9 @@ const paginationPagerProps = {
 var script$E = defineComponent({
   name: "ElPaginationPager",
   components: {
-    DArrowLeft,
-    DArrowRight,
-    MoreFilled
+    DArrowLeft: dArrowLeft,
+    DArrowRight: dArrowRight,
+    MoreFilled: moreFilled
   },
   props: paginationPagerProps,
   emits: ["change"],
@@ -28477,7 +28448,7 @@ const popconfirmProps = buildProps({
   },
   icon: {
     type: definePropType([String, Object]),
-    default: QuestionFilled
+    default: questionFilled
   },
   iconColor: {
     type: String,
@@ -28760,80 +28731,82 @@ const _Popover = script$C;
 const ElPopover = _Popover;
 const ElPopoverDirective = _PopoverDirective;
 
+const progressProps = buildProps({
+  type: {
+    type: String,
+    default: "line",
+    values: ["line", "circle", "dashboard"]
+  },
+  percentage: {
+    type: Number,
+    default: 0,
+    validator: (val) => val >= 0 && val <= 100
+  },
+  status: {
+    type: String,
+    default: "",
+    values: ["", "success", "exception", "warning"]
+  },
+  indeterminate: {
+    type: Boolean,
+    default: false
+  },
+  duration: {
+    type: Number,
+    default: 3
+  },
+  strokeWidth: {
+    type: Number,
+    default: 6
+  },
+  strokeLinecap: {
+    type: definePropType(String),
+    default: "round"
+  },
+  textInside: {
+    type: Boolean,
+    default: false
+  },
+  width: {
+    type: Number,
+    default: 126
+  },
+  showText: {
+    type: Boolean,
+    default: true
+  },
+  color: {
+    type: definePropType([
+      String,
+      Array,
+      Function
+    ]),
+    default: ""
+  },
+  format: {
+    type: definePropType(Function),
+    default: (percentage) => `${percentage}%`
+  }
+});
+
 var script$B = defineComponent({
   name: "ElProgress",
   components: {
     ElIcon,
-    CircleCheck,
-    CircleClose,
-    Check,
-    Close,
-    WarningFilled
-  },
-  props: {
-    type: {
-      type: String,
-      default: "line",
-      validator: (val) => ["line", "circle", "dashboard"].indexOf(val) > -1
-    },
-    percentage: {
-      type: Number,
-      default: 0,
-      validator: (val) => val >= 0 && val <= 100
-    },
-    status: {
-      type: String,
-      default: "",
-      validator: (val) => ["", "success", "exception", "warning"].indexOf(val) > -1
-    },
-    indeterminate: {
-      type: Boolean,
-      default: false
-    },
-    duration: {
-      type: Number,
-      default: 3
-    },
-    strokeWidth: {
-      type: Number,
-      default: 6
-    },
-    strokeLinecap: {
-      type: String,
-      default: "round"
-    },
-    textInside: {
-      type: Boolean,
-      default: false
-    },
-    width: {
-      type: Number,
-      default: 126
-    },
-    showText: {
-      type: Boolean,
-      default: true
-    },
-    color: {
-      type: [String, Array, Function],
-      default: ""
-    },
-    format: {
-      type: Function,
-      default: (percentage) => `${percentage}%`
-    }
+    CircleCheck: circleCheck,
+    CircleClose: circleClose,
+    Check: check,
+    Close: close$2,
+    WarningFilled: warningFilled
   },
+  props: progressProps,
   setup(props) {
-    const barStyle = computed(() => {
-      return {
-        width: `${props.percentage}%`,
-        animationDuration: `${props.duration}s`,
-        backgroundColor: getCurrentColor(props.percentage)
-      };
-    });
-    const relativeStrokeWidth = computed(() => {
-      return (props.strokeWidth / props.width * 100).toFixed(1);
-    });
+    const barStyle = computed(() => ({
+      width: `${props.percentage}%`,
+      animationDuration: `${props.duration}s`,
+      backgroundColor: getCurrentColor(props.percentage)
+    }));
+    const relativeStrokeWidth = computed(() => (props.strokeWidth / props.width * 100).toFixed(1));
     const radius = computed(() => {
       if (props.type === "circle" || props.type === "dashboard") {
         return parseInt(`${50 - parseFloat(relativeStrokeWidth.value) / 2}`, 10);
@@ -28851,29 +28824,21 @@ var script$B = defineComponent({
           a ${r} ${r} 0 1 1 0 ${isDashboard ? "" : "-"}${r * 2}
           `;
     });
-    const perimeter = computed(() => {
-      return 2 * Math.PI * radius.value;
-    });
-    const rate = computed(() => {
-      return props.type === "dashboard" ? 0.75 : 1;
-    });
+    const perimeter = computed(() => 2 * Math.PI * radius.value);
+    const rate = computed(() => props.type === "dashboard" ? 0.75 : 1);
     const strokeDashoffset = computed(() => {
       const offset = -1 * perimeter.value * (1 - rate.value) / 2;
       return `${offset}px`;
     });
-    const trailPathStyle = computed(() => {
-      return {
-        strokeDasharray: `${perimeter.value * rate.value}px, ${perimeter.value}px`,
-        strokeDashoffset: strokeDashoffset.value
-      };
-    });
-    const circlePathStyle = computed(() => {
-      return {
-        strokeDasharray: `${perimeter.value * rate.value * (props.percentage / 100)}px, ${perimeter.value}px`,
-        strokeDashoffset: strokeDashoffset.value,
-        transition: "stroke-dasharray 0.6s ease 0s, stroke 0.6s ease"
-      };
-    });
+    const trailPathStyle = computed(() => ({
+      strokeDasharray: `${perimeter.value * rate.value}px, ${perimeter.value}px`,
+      strokeDashoffset: strokeDashoffset.value
+    }));
+    const circlePathStyle = computed(() => ({
+      strokeDasharray: `${perimeter.value * rate.value * (props.percentage / 100)}px, ${perimeter.value}px`,
+      strokeDashoffset: strokeDashoffset.value,
+      transition: "stroke-dasharray 0.6s ease 0s, stroke 0.6s ease"
+    }));
     const stroke = computed(() => {
       let ret;
       if (props.color) {
@@ -28897,20 +28862,18 @@ var script$B = defineComponent({
     });
     const statusIcon = computed(() => {
       if (props.status === "warning") {
-        return WarningFilled;
+        return warningFilled;
       }
       if (props.type === "line") {
-        return props.status === "success" ? CircleCheck : CircleClose;
+        return props.status === "success" ? circleCheck : circleClose;
       } else {
-        return props.status === "success" ? Check : Close;
+        return props.status === "success" ? check : close$2;
       }
     });
     const progressTextSize = computed(() => {
       return props.type === "line" ? 12 + props.strokeWidth * 0.4 : props.width * 0.111111 + 2;
     });
-    const content = computed(() => {
-      return props.format(props.percentage);
-    });
+    const content = computed(() => props.format(props.percentage));
     const getCurrentColor = (percentage) => {
       var _a;
       const { color } = props;
@@ -28929,13 +28892,12 @@ var script$B = defineComponent({
           }
           return seriesColor;
         });
-        const colorArray = seriesColors.sort((a, b) => a.percentage - b.percentage);
-        for (let i = 0; i < colorArray.length; i++) {
-          if (colorArray[i].percentage > percentage) {
-            return colorArray[i].color;
-          }
+        const colors = seriesColors.sort((a, b) => a.percentage - b.percentage);
+        for (const color2 of colors) {
+          if (color2.percentage > percentage)
+            return color2.color;
         }
-        return (_a = colorArray[colorArray.length - 1]) == null ? void 0 : _a.color;
+        return (_a = colors[colors.length - 1]) == null ? void 0 : _a.color;
       }
     };
     const slotData = computed(() => {
@@ -28957,7 +28919,6 @@ var script$B = defineComponent({
       statusIcon,
       progressTextSize,
       content,
-      getCurrentColor,
       slotData
     };
   }
@@ -29054,13 +29015,9 @@ function render$w(_ctx, _cache, $props, $setup, $data, $options) {
 }
 
 script$B.render = render$w;
-script$B.__file = "packages/components/progress/src/index.vue";
+script$B.__file = "packages/components/progress/src/progress.vue";
 
-script$B.install = (app) => {
-  app.component(script$B.name, script$B);
-};
-const _Progress = script$B;
-const ElProgress = _Progress;
+const ElProgress = withInstall(script$B);
 
 const rateProps = buildProps({
   modelValue: {
@@ -29093,15 +29050,15 @@ const rateProps = buildProps({
   },
   icons: {
     type: definePropType([Array, Object]),
-    default: () => [StarFilled, StarFilled, StarFilled]
+    default: () => [starFilled, starFilled, starFilled]
   },
   voidIcon: {
     type: definePropType([String, Object]),
-    default: () => Star
+    default: () => star
   },
   disabledvoidIcon: {
     type: definePropType([String, Object]),
-    default: () => StarFilled
+    default: () => starFilled
   },
   disabled: {
     type: Boolean,
@@ -29157,8 +29114,8 @@ var script$A = defineComponent({
   name: "ElRate",
   components: {
     ElIcon,
-    StarFilled,
-    Star
+    StarFilled: starFilled,
+    Star: star
   },
   props: rateProps,
   emits: rateEmits,
@@ -29388,10 +29345,10 @@ const IconMap = {
   info: "icon-info"
 };
 const IconComponentMap = {
-  [IconMap.success]: CircleCheckFilled,
-  [IconMap.warning]: WarningFilled,
-  [IconMap.error]: CircleCloseFilled,
-  [IconMap.info]: InfoFilled
+  [IconMap.success]: circleCheckFilled,
+  [IconMap.warning]: warningFilled,
+  [IconMap.error]: circleCloseFilled,
+  [IconMap.info]: infoFilled
 };
 const resultProps = buildProps({
   title: {
@@ -31293,7 +31250,7 @@ const SelectProps = {
   clearable: Boolean,
   clearIcon: {
     type: [String, Object],
-    default: CircleClose
+    default: circleClose
   },
   collapseTags: Boolean,
   defaultFirstOption: Boolean,
@@ -31706,8 +31663,6 @@ const TAG_BASE_WIDTH = {
 const useSelect = (props, emit) => {
   const { t } = useLocale();
   const elForm = inject(elFormKey, {});
-  const elFormItem = inject(elFormItemKey, {});
-  const $ELEMENT = useGlobalConfig$1();
   const states = reactive({
     inputValue: DEFAULT_INPUT_PLACEHOLDER,
     displayInputValue: DEFAULT_INPUT_PLACEHOLDER,
@@ -31756,7 +31711,7 @@ const useSelect = (props, emit) => {
     const criteria = props.clearable && !selectDisabled.value && states.comboBoxHovering && hasValue;
     return criteria;
   });
-  const iconComponent = computed(() => props.remote && props.filterable ? "" : ArrowUp);
+  const iconComponent = computed(() => props.remote && props.filterable ? "" : arrowUp);
   const iconReverse = computed(() => iconComponent.value && expanded.value ? "is-reverse" : "");
   const debounce = computed(() => props.remote ? 300 : 0);
   const emptyText = computed(() => {
@@ -31802,7 +31757,7 @@ const useSelect = (props, emit) => {
     }).filter((v) => v !== null));
   });
   const optionsAllDisabled = computed(() => filteredOptions.value.every((option) => option.disabled));
-  const selectSize = computed(() => props.size || elFormItem.size || $ELEMENT.size);
+  const selectSize = useSize();
   const collapseTagSize = computed(() => ["small", "mini"].indexOf(selectSize.value) > -1 ? "mini" : "small");
   const tagMaxWidth = computed(() => {
     const select = selectionRef.value;
@@ -33845,8 +33800,8 @@ var script$m = defineComponent({
   name: "ElStep",
   components: {
     ElIcon,
-    Close,
-    Check
+    Close: close$2,
+    Check: check
   },
   props: {
     title: {
@@ -34063,89 +34018,98 @@ const ElSteps = withInstall(script$n, {
 });
 const ElStep = withNoopInstall(script$m);
 
-var script$l = defineComponent({
-  name: "ElSwitch",
-  components: { ElIcon: ElIcon$1, Loading: Loading$2 },
-  props: {
-    modelValue: {
-      type: [Boolean, String, Number],
-      default: false
-    },
-    value: {
-      type: [Boolean, String, Number],
-      default: false
-    },
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-    width: {
-      type: Number,
-      default: 40
-    },
-    inlinePrompt: {
-      type: Boolean,
-      default: false
-    },
-    activeIcon: {
-      type: [String, Object],
-      default: ""
-    },
-    inactiveIcon: {
-      type: [String, Object],
-      default: ""
-    },
-    activeText: {
-      type: String,
-      default: ""
-    },
-    inactiveText: {
-      type: String,
-      default: ""
-    },
-    activeColor: {
-      type: String,
-      default: ""
-    },
-    inactiveColor: {
-      type: String,
-      default: ""
-    },
-    borderColor: {
-      type: String,
-      default: ""
-    },
-    activeValue: {
-      type: [Boolean, String, Number],
-      default: true
-    },
-    inactiveValue: {
-      type: [Boolean, String, Number],
-      default: false
-    },
-    name: {
-      type: String,
-      default: ""
-    },
-    validateEvent: {
-      type: Boolean,
-      default: true
-    },
-    id: String,
-    loading: {
-      type: Boolean,
-      default: false
-    },
-    beforeChange: Function
+const switchProps = buildProps({
+  modelValue: {
+    type: [Boolean, String, Number],
+    default: false
   },
-  emits: ["update:modelValue", "change", "input"],
-  setup(props, ctx) {
-    const elForm = inject(elFormKey, {});
-    const elFormItem = inject(elFormItemKey, {});
+  value: {
+    type: [Boolean, String, Number],
+    default: false
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  width: {
+    type: Number,
+    default: 40
+  },
+  inlinePrompt: {
+    type: Boolean,
+    default: false
+  },
+  activeIcon: {
+    type: definePropType([String, Object]),
+    default: ""
+  },
+  inactiveIcon: {
+    type: definePropType([String, Object]),
+    default: ""
+  },
+  activeText: {
+    type: String,
+    default: ""
+  },
+  inactiveText: {
+    type: String,
+    default: ""
+  },
+  activeColor: {
+    type: String,
+    default: ""
+  },
+  inactiveColor: {
+    type: String,
+    default: ""
+  },
+  borderColor: {
+    type: String,
+    default: ""
+  },
+  activeValue: {
+    type: [Boolean, String, Number],
+    default: true
+  },
+  inactiveValue: {
+    type: [Boolean, String, Number],
+    default: false
+  },
+  name: {
+    type: String,
+    default: ""
+  },
+  validateEvent: {
+    type: Boolean,
+    default: true
+  },
+  id: String,
+  loading: {
+    type: Boolean,
+    default: false
+  },
+  beforeChange: {
+    type: definePropType(Function)
+  }
+});
+const switchEmits = {
+  [UPDATE_MODEL_EVENT]: (val) => isBool(val) || isString$1(val) || isNumber(val),
+  [CHANGE_EVENT]: (val) => isBool(val) || isString$1(val) || isNumber(val),
+  [INPUT_EVENT]: (val) => isBool(val) || isString$1(val) || isNumber(val)
+};
+
+const COMPONENT_NAME$3 = "ElSwitch";
+var script$l = defineComponent({
+  name: COMPONENT_NAME$3,
+  components: { ElIcon: ElIcon$1, Loading: loading },
+  props: switchProps,
+  emits: switchEmits,
+  setup(props, { emit }) {
+    const { formItem } = useFormItem();
+    const switchDisabled = useDisabled$1(computed(() => props.loading));
     const isModelValue = ref(props.modelValue !== false);
-    const input = ref(null);
-    const core = ref(null);
-    const scope = "ElSwitch";
+    const input = ref();
+    const core = ref();
     watch(() => props.modelValue, () => {
       isModelValue.value = true;
     });
@@ -34155,13 +34119,11 @@ var script$l = defineComponent({
     const actualValue = computed(() => {
       return isModelValue.value ? props.modelValue : props.value;
     });
-    const checked = computed(() => {
-      return actualValue.value === props.activeValue;
-    });
-    if (!~[props.activeValue, props.inactiveValue].indexOf(actualValue.value)) {
-      ctx.emit("update:modelValue", props.inactiveValue);
-      ctx.emit("change", props.inactiveValue);
-      ctx.emit("input", props.inactiveValue);
+    const checked = computed(() => actualValue.value === props.activeValue);
+    if (![props.activeValue, props.inactiveValue].includes(actualValue.value)) {
+      emit(UPDATE_MODEL_EVENT, props.inactiveValue);
+      emit(CHANGE_EVENT, props.inactiveValue);
+      emit(INPUT_EVENT, props.inactiveValue);
     }
     watch(checked, () => {
       var _a;
@@ -34170,17 +34132,14 @@ var script$l = defineComponent({
         setBackgroundColor();
       }
       if (props.validateEvent) {
-        (_a = elFormItem.validate) == null ? void 0 : _a.call(elFormItem, "change");
+        (_a = formItem == null ? void 0 : formItem.validate) == null ? void 0 : _a.call(formItem, "change");
       }
     });
-    const switchDisabled = computed(() => {
-      return props.disabled || props.loading || (elForm || {}).disabled;
-    });
     const handleChange = () => {
       const val = checked.value ? props.inactiveValue : props.activeValue;
-      ctx.emit("update:modelValue", val);
-      ctx.emit("change", val);
-      ctx.emit("input", val);
+      emit(UPDATE_MODEL_EVENT, val);
+      emit(CHANGE_EVENT, val);
+      emit(INPUT_EVENT, val);
       nextTick(() => {
         input.value.checked = checked.value;
       });
@@ -34196,7 +34155,7 @@ var script$l = defineComponent({
       const shouldChange = beforeChange();
       const isExpectType = [isPromise(shouldChange), isBool(shouldChange)].some((i) => i);
       if (!isExpectType) {
-        throwError(scope, "beforeChange must return type `Promise<boolean>` or `boolean`");
+        throwError(COMPONENT_NAME$3, "beforeChange must return type `Promise<boolean>` or `boolean`");
       }
       if (isPromise(shouldChange)) {
         shouldChange.then((result) => {
@@ -34366,13 +34325,9 @@ function render$i(_ctx, _cache, $props, $setup, $data, $options) {
 }
 
 script$l.render = render$i;
-script$l.__file = "packages/components/switch/src/index.vue";
+script$l.__file = "packages/components/switch/src/switch.vue";
 
-script$l.install = (app) => {
-  app.component(script$l.name, script$l);
-};
-const _Switch = script$l;
-const ElSwitch = _Switch;
+const ElSwitch = withInstall(script$l);
 
 const getCell = function(event) {
   let cell = event.target;
@@ -34617,7 +34572,6 @@ function createTablePopper(trigger, popperContent, popperOptions, tooltipEffect)
   function renderArrow() {
     const arrow2 = document.createElement("div");
     arrow2.className = "el-popper__arrow";
-    arrow2.style.bottom = "-4px";
     return arrow2;
   }
   function showPopper() {
@@ -35856,8 +35810,8 @@ var script$k = defineComponent({
     ElScrollbar: ElScrollbar$1,
     ElPopper,
     ElIcon,
-    ArrowDown,
-    ArrowUp
+    ArrowDown: arrowDown,
+    ArrowUp: arrowUp
   },
   directives: { ClickOutside },
   props: {
@@ -37345,7 +37299,6 @@ function useUtils(store) {
 }
 
 function useStyle(props, layout, store, table) {
-  const $ELEMENT = useGlobalConfig$1();
   const isHidden = ref(false);
   const renderExpanded = ref(null);
   const resizeProxyVisible = ref(false);
@@ -37505,9 +37458,7 @@ function useStyle(props, layout, store, table) {
       doLayout();
     }
   };
-  const tableSize = computed(() => {
-    return props.size || $ELEMENT.size;
-  });
+  const tableSize = useSize();
   const bodyWidth = computed(() => {
     const { bodyWidth: bodyWidth_, scrollY, gutterWidth } = layout;
     return bodyWidth_.value ? `${bodyWidth_.value - (scrollY.value ? gutterWidth : 0)}px` : "";
@@ -38188,7 +38139,7 @@ const cellForced = {
           return [
             h$1(ElIcon, null, {
               default: () => {
-                return [h$1(ArrowRight)];
+                return [h$1(arrowRight)];
               }
             })
           ];
@@ -38236,9 +38187,9 @@ function treeCellPrefix({
       "el-table__expand-icon",
       treeNode.expanded ? "el-table__expand-icon--expanded" : ""
     ];
-    let icon = ArrowRight;
+    let icon = arrowRight;
     if (treeNode.loading) {
-      icon = Loading$2;
+      icon = loading;
     }
     ele.push(h$1("div", {
       class: expandClasses,
@@ -38897,14 +38848,14 @@ var TabNav = defineComponent({
             scrollable.value.prev ? "" : "is-disabled"
           ],
           onClick: scrollPrev
-        }, [h$1(ElIcon, {}, { default: () => h$1(ArrowLeft) })]),
+        }, [h$1(ElIcon, {}, { default: () => h$1(arrowLeft) })]),
         h$1("span", {
           class: [
             "el-tabs__nav-next",
             scrollable.value.next ? "" : "is-disabled"
           ],
           onClick: scrollNext
-        }, [h$1(ElIcon, {}, { default: () => h$1(ArrowRight) })])
+        }, [h$1(ElIcon, {}, { default: () => h$1(arrowRight) })])
       ] : null;
       const tabs = props.panes.map((pane, index) => {
         var _a, _b;
@@ -38914,7 +38865,7 @@ var TabNav = defineComponent({
         const btnClose = closable ? h$1(ElIcon, {
           class: "is-icon-close",
           onClick: (ev) => props.onTabRemove(pane, ev)
-        }, { default: () => h$1(Close) }) : null;
+        }, { default: () => h$1(close$2) }) : null;
         const tabLabelContent = ((_b = (_a = pane.instance.slots).label) == null ? void 0 : _b.call(_a)) || pane.props.label;
         const tabindex = pane.active ? 0 : -1;
         return h$1("div", {
@@ -39120,7 +39071,7 @@ var Tabs = defineComponent({
           if (ev.code === EVENT_CODE.enter)
             handleTabAdd();
         }
-      }, [h$1(ElIcon$1, { class: "is-icon-plus" }, { default: () => h$1(Plus) })]) : null;
+      }, [h$1(ElIcon$1, { class: "is-icon-plus" }, { default: () => h$1(plus) })]) : null;
       const header = h$1("div", { class: ["el-tabs__header", `is-${props.tabPosition}`] }, [
         newButton,
         h$1(TabNav, {
@@ -39318,11 +39269,11 @@ var script$g = defineComponent({
     },
     prefixIcon: {
       type: [String, Object],
-      default: Clock
+      default: clock
     },
     clearIcon: {
       type: [String, Object],
-      default: CircleClose
+      default: circleClose
     }
   },
   emits: ["change", "blur", "focus", "update:modelValue"],
@@ -39681,11 +39632,11 @@ var script$d = defineComponent({
       return panelState.query.length > 0 && filteredData.value.length === 0;
     });
     const inputIcon = computed(() => {
-      return panelState.query.length > 0 && panelState.inputHover ? CircleClose : Search;
+      return panelState.query.length > 0 && panelState.inputHover ? circleClose : search;
     });
     const hasFooter = computed(() => !!slots.default()[0].children.length);
     const clearQuery = () => {
-      if (inputIcon.value === CircleClose) {
+      if (inputIcon.value === circleClose) {
         panelState.query = "";
       }
     };
@@ -39893,8 +39844,8 @@ var script$c = defineComponent({
     TransferPanel: script$d,
     ElButton,
     ElIcon: ElIcon$1,
-    ArrowLeft,
-    ArrowRight
+    ArrowLeft: arrowLeft,
+    ArrowRight: arrowRight
   },
   props: {
     data: {
@@ -41036,7 +40987,7 @@ var script$a = defineComponent({
     ElCheckbox,
     NodeContent: script$b,
     ElIcon,
-    Loading: Loading$2
+    Loading: loading
   },
   props: {
     node: {
@@ -41208,7 +41159,7 @@ var script$a = defineComponent({
       handleDragOver,
       handleDrop,
       handleDragEnd,
-      CaretRight
+      CaretRight: caretRight
     };
   }
 });
@@ -42373,7 +42324,7 @@ var script$8 = defineComponent({
   name: "ElTreeNode",
   components: {
     ElIcon: ElIcon$1,
-    CaretRight,
+    CaretRight: caretRight,
     ElCheckbox,
     ElNodeContent
   },
@@ -42681,14 +42632,14 @@ function upload(option) {
 var script$6 = defineComponent({
   name: "ElUploadList",
   components: {
-    ElProgress: _Progress,
+    ElProgress,
     ElIcon,
-    Document,
-    Delete,
-    Close,
-    ZoomIn,
-    Check,
-    CircleCheck
+    Document: document$1,
+    Delete: _delete,
+    Close: close$2,
+    ZoomIn: zoomIn,
+    Check: check,
+    CircleCheck: circleCheck
   },
   props: {
     files: {
@@ -44497,7 +44448,7 @@ var Components = [
   ElBreadcrumb,
   ElBreadcrumbItem,
   ElButton,
-  ElButtonGroup$2,
+  ElButtonGroup$1,
   ElCalendar,
   ElCard,
   ElCarousel,
@@ -44696,12 +44647,8 @@ _InfiniteScroll.install = (app) => {
 };
 const ElInfiniteScroll = _InfiniteScroll;
 
-function createLoadingComponent({
-  options,
-  globalLoadingOption
-}) {
-  let vm = null;
-  let afterLeaveTimer = null;
+function createLoadingComponent(options) {
+  let afterLeaveTimer;
   const afterLeaveFlag = ref(false);
   const data = reactive({
     ...options,
@@ -44713,6 +44660,7 @@ function createLoadingComponent({
     data.text = text;
   }
   function destroySelf() {
+    var _a, _b;
     const target = data.parent;
     if (!target.vLoadingAddClassList) {
       let loadingNumber = target.getAttribute("loading-number");
@@ -44725,16 +44673,14 @@ function createLoadingComponent({
       }
       removeClass(target, "el-loading-parent--hidden");
     }
-    if (vm.el && vm.el.parentNode) {
-      vm.el.parentNode.removeChild(vm.el);
-    }
+    (_b = (_a = vm.$el) == null ? void 0 : _a.parentNode) == null ? void 0 : _b.removeChild(vm.$el);
   }
   function close() {
+    var _a;
+    if (options.beforeClose && !options.beforeClose())
+      return;
     const target = data.parent;
-    target.vLoadingAddClassList = null;
-    if (data.fullscreen) {
-      globalLoadingOption.fullscreenLoading = void 0;
-    }
+    target.vLoadingAddClassList = void 0;
     afterLeaveFlag.value = true;
     clearTimeout(afterLeaveTimer);
     afterLeaveTimer = window.setTimeout(() => {
@@ -44744,6 +44690,7 @@ function createLoadingComponent({
       }
     }, 400);
     data.visible = false;
+    (_a = options.closed) == null ? void 0 : _a.call(options);
   }
   function handleAfterLeave() {
     if (!afterLeaveFlag.value)
@@ -44751,81 +44698,117 @@ function createLoadingComponent({
     afterLeaveFlag.value = false;
     destroySelf();
   }
-  const componentSetupConfig = {
-    ...toRefs(data),
-    setText,
-    close,
-    handleAfterLeave
-  };
   const elLoadingComponent = {
     name: "ElLoading",
     setup() {
-      return componentSetupConfig;
-    },
-    render() {
-      const svg = this.spinner || this.svg;
-      const spinner = h$1("svg", {
-        class: "circular",
-        viewBox: this.svgViewBox ? this.svgViewBox : "25 25 50 50",
-        ...svg ? { innerHTML: svg } : {}
-      }, [
-        h$1("circle", {
-          class: "path",
-          cx: "50",
-          cy: "50",
-          r: "20",
-          fill: "none"
-        })
-      ]);
-      const spinnerText = h$1("p", { class: "el-loading-text" }, [this.text]);
-      return h$1(Transition, {
-        name: "el-loading-fade",
-        onAfterLeave: this.handleAfterLeave
-      }, {
-        default: withCtx(() => [
-          withDirectives(createVNode("div", {
-            style: {
-              backgroundColor: this.background || ""
-            },
-            class: [
-              "el-loading-mask",
-              this.customClass,
-              this.fullscreen ? "is-fullscreen" : ""
-            ]
-          }, [
-            h$1("div", {
-              class: "el-loading-spinner"
-            }, [spinner, this.text ? spinnerText : null])
-          ]), [[vShow, this.visible]])
-        ])
-      });
+      return () => {
+        const svg = data.spinner || data.svg;
+        const spinner = h$1("svg", {
+          class: "circular",
+          viewBox: data.svgViewBox ? data.svgViewBox : "25 25 50 50",
+          ...svg ? { innerHTML: svg } : {}
+        }, [
+          h$1("circle", {
+            class: "path",
+            cx: "50",
+            cy: "50",
+            r: "20",
+            fill: "none"
+          })
+        ]);
+        const spinnerText = data.text ? h$1("p", { class: "el-loading-text" }, [data.text]) : void 0;
+        return h$1(Transition, {
+          name: "el-loading-fade",
+          onAfterLeave: handleAfterLeave
+        }, {
+          default: withCtx(() => [
+            withDirectives(createVNode("div", {
+              style: {
+                backgroundColor: data.background || ""
+              },
+              class: [
+                "el-loading-mask",
+                data.customClass,
+                data.fullscreen ? "is-fullscreen" : ""
+              ]
+            }, [
+              h$1("div", {
+                class: "el-loading-spinner"
+              }, [spinner, spinnerText])
+            ]), [[vShow, data.visible]])
+          ])
+        });
+      };
     }
   };
-  vm = createVNode(elLoadingComponent);
-  render$2s(vm, document.createElement("div"));
+  const vm = createApp(elLoadingComponent).mount(document.createElement("div"));
   return {
-    ...componentSetupConfig,
+    ...toRefs(data),
+    setText,
+    close,
+    handleAfterLeave,
     vm,
     get $el() {
-      return vm.el;
+      return vm.$el;
     }
   };
 }
 
-const defaults = {
-  parent: null,
-  background: "",
-  svg: null,
-  svgViewBox: null,
-  spinner: false,
-  text: null,
-  fullscreen: true,
-  body: false,
-  lock: false,
-  customClass: ""
+let fullscreenInstance = void 0;
+const Loading = function(options = {}) {
+  if (!isClient)
+    return void 0;
+  const resolved = resolveOptions(options);
+  if (resolved.fullscreen && fullscreenInstance) {
+    fullscreenInstance.close();
+  }
+  const instance = createLoadingComponent({
+    ...resolved,
+    closed: () => {
+      var _a;
+      (_a = resolved.closed) == null ? void 0 : _a.call(resolved);
+      if (resolved.fullscreen)
+        fullscreenInstance = void 0;
+    }
+  });
+  addStyle(resolved, resolved.parent, instance);
+  addClassList(resolved, resolved.parent, instance);
+  resolved.parent.vLoadingAddClassList = () => addClassList(resolved, resolved.parent, instance);
+  let loadingNumber = resolved.parent.getAttribute("loading-number");
+  if (!loadingNumber) {
+    loadingNumber = "1";
+  } else {
+    loadingNumber = `${Number.parseInt(loadingNumber) + 1}`;
+  }
+  resolved.parent.setAttribute("loading-number", loadingNumber);
+  resolved.parent.appendChild(instance.$el);
+  nextTick(() => instance.visible.value = resolved.visible);
+  if (resolved.fullscreen) {
+    fullscreenInstance = instance;
+  }
+  return instance;
 };
-const globalLoadingOption = {
-  fullscreenLoading: null
+const resolveOptions = (options) => {
+  var _a, _b, _c, _d;
+  let target;
+  if (isString$1(options.target)) {
+    target = (_a = document.querySelector(options.target)) != null ? _a : document.body;
+  } else {
+    target = options.target || document.body;
+  }
+  return {
+    parent: target === document.body || options.body ? document.body : target,
+    background: options.background || "",
+    svg: options.svg || "",
+    svgViewBox: options.svgViewBox || "",
+    spinner: options.spinner || false,
+    text: options.text || "",
+    fullscreen: target === document.body && ((_b = options.fullscreen) != null ? _b : true),
+    lock: (_c = options.lock) != null ? _c : false,
+    customClass: options.customClass || "",
+    visible: (_d = options.visible) != null ? _d : true,
+    target
+  };
 };
 const addStyle = async (options, parent, instance) => {
   const maskStyle = {};
@@ -44833,22 +44816,22 @@ const addStyle = async (options, parent, instance) => {
     instance.originalPosition.value = getStyle(document.body, "position");
     instance.originalOverflow.value = getStyle(document.body, "overflow");
     maskStyle.zIndex = PopupManager.nextZIndex();
-  } else if (options.body) {
+  } else if (options.parent === document.body) {
     instance.originalPosition.value = getStyle(document.body, "position");
     await nextTick();
-    ["top", "left"].forEach((property) => {
+    for (const property of ["top", "left"]) {
       const scroll = property === "top" ? "scrollTop" : "scrollLeft";
       maskStyle[property] = `${options.target.getBoundingClientRect()[property] + document.body[scroll] + document.documentElement[scroll] - parseInt(getStyle(document.body, `margin-${property}`), 10)}px`;
-    });
-    ["height", "width"].forEach((property) => {
+    }
+    for (const property of ["height", "width"]) {
       maskStyle[property] = `${options.target.getBoundingClientRect()[property]}px`;
-    });
+    }
   } else {
     instance.originalPosition.value = getStyle(parent, "position");
   }
-  Object.keys(maskStyle).forEach((property) => {
-    instance.$el.style[property] = maskStyle[property];
-  });
+  for (const [key, value] of Object.entries(maskStyle)) {
+    instance.$el.style[key] = value;
+  }
 };
 const addClassList = (options, parent, instance) => {
   if (instance.originalPosition.value !== "absolute" && instance.originalPosition.value !== "fixed") {
@@ -44862,76 +44845,43 @@ const addClassList = (options, parent, instance) => {
     removeClass(parent, "el-loading-parent--hidden");
   }
 };
-const Loading = function(options = {}) {
-  if (isServer)
-    return;
-  options = {
-    ...defaults,
-    ...options
+
+const INSTANCE_KEY = Symbol("ElLoading");
+const createInstance = (el, binding) => {
+  var _a, _b, _c, _d;
+  const vm = binding.instance;
+  const getBindingProp = (key) => isObject$a(binding.value) ? binding.value[key] : void 0;
+  const resolveExpression = (key) => {
+    const data = isString$1(key) && (vm == null ? void 0 : vm[key]) || key;
+    if (data)
+      return ref(data);
+    else
+      return data;
   };
-  if (typeof options.target === "string") {
-    options.target = document.querySelector(options.target);
-  }
-  options.target = options.target || document.body;
-  if (options.target !== document.body) {
-    options.fullscreen = false;
-  } else {
-    options.body = true;
-  }
-  if (options.fullscreen && globalLoadingOption.fullscreenLoading) {
-    globalLoadingOption.fullscreenLoading.close();
-  }
-  const parent = options.body ? document.body : options.target;
-  options.parent = parent;
-  const instance = createLoadingComponent({
+  const getProp = (name) => resolveExpression(getBindingProp(name) || el.getAttribute(`element-loading-${hyphenate(name)}`));
+  const fullscreen = (_a = getBindingProp("fullscreen")) != null ? _a : binding.modifiers.fullscreen;
+  const options = {
+    text: getProp("text"),
+    svg: getProp("svg"),
+    svgViewBox: getProp("svgViewBox"),
+    spinner: getProp("spinner"),
+    background: getProp("background"),
+    customClass: getProp("customClass"),
+    fullscreen,
+    target: (_b = getBindingProp("target")) != null ? _b : fullscreen ? void 0 : el,
+    body: (_c = getBindingProp("body")) != null ? _c : binding.modifiers.body,
+    lock: (_d = getBindingProp("lock")) != null ? _d : binding.modifiers.lock
+  };
+  el[INSTANCE_KEY] = {
     options,
-    globalLoadingOption
-  });
-  addStyle(options, parent, instance);
-  addClassList(options, parent, instance);
-  options.parent.vLoadingAddClassList = () => {
-    addClassList(options, parent, instance);
+    instance: Loading(options)
   };
-  let loadingNumber = parent.getAttribute("loading-number");
-  if (!loadingNumber) {
-    loadingNumber = 1;
-  } else {
-    loadingNumber = Number.parseInt(loadingNumber) + 1;
-  }
-  parent.setAttribute("loading-number", loadingNumber.toString());
-  parent.appendChild(instance.$el);
-  nextTick().then(() => {
-    instance.visible.value = hasOwn(options, "visible") ? options.visible : true;
-  });
-  if (options.fullscreen) {
-    globalLoadingOption.fullscreenLoading = instance;
-  }
-  return instance;
 };
-var Loading$1 = Loading;
-
-const INSTANCE_NAME = "ElLoading";
-const createInstance = (el, binding) => {
-  const textExr = el.getAttribute("element-loading-text");
-  const spinnerExr = el.getAttribute("element-loading-spinner");
-  const svgExr = el.getAttribute("element-loading-svg");
-  const svgViewBoxExr = el.getAttribute("element-loading-svg-view-box");
-  const backgroundExr = el.getAttribute("element-loading-background");
-  const customClassExr = el.getAttribute("element-loading-custom-class");
-  const vm = binding.instance;
-  el[INSTANCE_NAME] = Loading$1({
-    text: vm && vm[textExr] || textExr,
-    svg: vm && vm[svgExr] || svgExr,
-    svgViewBox: vm && vm[svgViewBoxExr] || svgViewBoxExr,
-    spinner: vm && vm[spinnerExr] || spinnerExr,
-    background: vm && vm[backgroundExr] || backgroundExr,
-    customClass: vm && vm[customClassExr] || customClassExr,
-    fullscreen: !!binding.modifiers.fullscreen,
-    target: binding.modifiers.fullscreen ? null : el,
-    body: !!binding.modifiers.body,
-    visible: true,
-    lock: !!binding.modifiers.lock
-  });
+const updateOptions = (newOptions, originalOptions) => {
+  for (const key of Object.keys(originalOptions)) {
+    if (isRef(originalOptions[key]))
+      originalOptions[key].value = newOptions[key];
+  }
 };
 const vLoading = {
   mounted(el, binding) {
@@ -44940,32 +44890,34 @@ const vLoading = {
     }
   },
   updated(el, binding) {
-    const instance = el[INSTANCE_NAME];
+    const instance = el[INSTANCE_KEY];
     if (binding.oldValue !== binding.value) {
-      if (binding.value) {
+      if (binding.value && !binding.oldValue) {
         createInstance(el, binding);
+      } else if (binding.value && binding.oldValue) {
+        if (isObject$a(binding.value))
+          updateOptions(binding.value, instance.options);
       } else {
-        instance == null ? void 0 : instance.close();
+        instance == null ? void 0 : instance.instance.close();
       }
     }
   },
   unmounted(el) {
     var _a;
-    (_a = el[INSTANCE_NAME]) == null ? void 0 : _a.close();
+    (_a = el[INSTANCE_KEY]) == null ? void 0 : _a.instance.close();
   }
 };
-var vLoading$1 = vLoading;
 
 const ElLoading = {
   install(app) {
-    app.directive("loading", vLoading$1);
-    app.config.globalProperties.$loading = Loading$1;
+    app.directive("loading", vLoading);
+    app.config.globalProperties.$loading = Loading;
   },
-  directive: vLoading$1,
-  service: Loading$1
+  directive: vLoading,
+  service: Loading
 };
-const ElLoadingDirective = vLoading$1;
-const ElLoadingService = Loading$1;
+const ElLoadingDirective = vLoading;
+const ElLoadingService = Loading;
 
 const messageTypes = ["success", "info", "warning", "error"];
 const messageProps = buildProps({
@@ -45042,6 +44994,7 @@ var script$2 = defineComponent({
   emits: messageEmits,
   setup(props) {
     const visible = ref(false);
+    const badgeType = ref(props.type ? props.type === "error" ? "danger" : props.type : "info");
     let stopTimer = void 0;
     const typeClass = computed(() => {
       const type = props.type;
@@ -45091,6 +45044,7 @@ var script$2 = defineComponent({
       iconComponent,
       customStyle,
       visible,
+      badgeType,
       close,
       clearTimer,
       startTimer
@@ -45113,62 +45067,59 @@ function render$2(_ctx, _cache, $props, $setup, $data, $options) {
     onBeforeLeave: _ctx.onClose,
     onAfterLeave: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("destroy"))
   }, {
-    default: withCtx(() => {
-      var _a;
-      return [
-        withDirectives(createElementVNode("div", {
-          id: _ctx.id,
-          class: normalizeClass([
-            "el-message",
-            _ctx.type && !_ctx.icon ? `el-message--${_ctx.type}` : "",
-            _ctx.center ? "is-center" : "",
-            _ctx.showClose ? "is-closable" : "",
-            _ctx.customClass
+    default: withCtx(() => [
+      withDirectives(createElementVNode("div", {
+        id: _ctx.id,
+        class: normalizeClass([
+          "el-message",
+          _ctx.type && !_ctx.icon ? `el-message--${_ctx.type}` : "",
+          _ctx.center ? "is-center" : "",
+          _ctx.showClose ? "is-closable" : "",
+          _ctx.customClass
+        ]),
+        style: normalizeStyle(_ctx.customStyle),
+        role: "alert",
+        onMouseenter: _cache[0] || (_cache[0] = (...args) => _ctx.clearTimer && _ctx.clearTimer(...args)),
+        onMouseleave: _cache[1] || (_cache[1] = (...args) => _ctx.startTimer && _ctx.startTimer(...args))
+      }, [
+        _ctx.repeatNum > 1 ? (openBlock(), createBlock(_component_el_badge, {
+          key: 0,
+          value: _ctx.repeatNum,
+          type: _ctx.badgeType,
+          class: "el-message__badge"
+        }, null, 8, ["value", "type"])) : createCommentVNode("v-if", true),
+        _ctx.iconComponent ? (openBlock(), createBlock(_component_el_icon, {
+          key: 1,
+          class: normalizeClass(["el-message__icon", _ctx.typeClass])
+        }, {
+          default: withCtx(() => [
+            (openBlock(), createBlock(resolveDynamicComponent(_ctx.iconComponent)))
           ]),
-          style: normalizeStyle(_ctx.customStyle),
-          role: "alert",
-          onMouseenter: _cache[0] || (_cache[0] = (...args) => _ctx.clearTimer && _ctx.clearTimer(...args)),
-          onMouseleave: _cache[1] || (_cache[1] = (...args) => _ctx.startTimer && _ctx.startTimer(...args))
-        }, [
-          _ctx.repeatNum > 1 ? (openBlock(), createBlock(_component_el_badge, {
-            key: 0,
-            value: _ctx.repeatNum,
-            type: (_a = _ctx.type) != null ? _a : "info",
-            class: "el-message__badge"
-          }, null, 8, ["value", "type"])) : createCommentVNode("v-if", true),
-          _ctx.iconComponent ? (openBlock(), createBlock(_component_el_icon, {
-            key: 1,
-            class: normalizeClass(["el-message__icon", _ctx.typeClass])
-          }, {
-            default: withCtx(() => [
-              (openBlock(), createBlock(resolveDynamicComponent(_ctx.iconComponent)))
-            ]),
-            _: 1
-          }, 8, ["class"])) : createCommentVNode("v-if", true),
-          renderSlot(_ctx.$slots, "default", {}, () => [
-            !_ctx.dangerouslyUseHTMLString ? (openBlock(), createElementBlock("p", _hoisted_2$2, toDisplayString(_ctx.message), 1)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-              createCommentVNode(" Caution here, message could've been compromised, never use user's input as message "),
-              createElementVNode("p", {
-                class: "el-message__content",
-                innerHTML: _ctx.message
-              }, null, 8, _hoisted_3$2)
-            ], 2112))
+          _: 1
+        }, 8, ["class"])) : createCommentVNode("v-if", true),
+        renderSlot(_ctx.$slots, "default", {}, () => [
+          !_ctx.dangerouslyUseHTMLString ? (openBlock(), createElementBlock("p", _hoisted_2$2, toDisplayString(_ctx.message), 1)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+            createCommentVNode(" Caution here, message could've been compromised, never use user's input as message "),
+            createElementVNode("p", {
+              class: "el-message__content",
+              innerHTML: _ctx.message
+            }, null, 8, _hoisted_3$2)
+          ], 2112))
+        ]),
+        _ctx.showClose ? (openBlock(), createBlock(_component_el_icon, {
+          key: 2,
+          class: "el-message__closeBtn",
+          onClick: withModifiers(_ctx.close, ["stop"])
+        }, {
+          default: withCtx(() => [
+            createVNode(_component_close)
           ]),
-          _ctx.showClose ? (openBlock(), createBlock(_component_el_icon, {
-            key: 2,
-            class: "el-message__closeBtn",
-            onClick: withModifiers(_ctx.close, ["stop"])
-          }, {
-            default: withCtx(() => [
-              createVNode(_component_close)
-            ]),
-            _: 1
-          }, 8, ["onClick"])) : createCommentVNode("v-if", true)
-        ], 46, _hoisted_1$2), [
-          [vShow, _ctx.visible]
-        ])
-      ];
-    }),
+          _: 1
+        }, 8, ["onClick"])) : createCommentVNode("v-if", true)
+      ], 46, _hoisted_1$2), [
+        [vShow, _ctx.visible]
+      ])
+    ]),
     _: 3
   }, 8, ["onBeforeLeave"]);
 }
@@ -45228,9 +45179,9 @@ const message = function(options = {}) {
   const message2 = props.message;
   const vm = createVNode(script$2, props, isVNode(props.message) ? { default: () => message2 } : null);
   vm.props.onDestroy = () => {
-    render$2s(null, container);
+    render$1S(null, container);
   };
-  render$2s(vm, container);
+  render$1S(vm, container);
   instances.push({ vm });
   appendTo.appendChild(container.firstElementChild);
   return {
@@ -45687,7 +45638,7 @@ script$1.__file = "packages/components/message-box/src/index.vue";
 const messageInstance = /* @__PURE__ */ new Map();
 const initInstance = (props, container) => {
   const vnode = h$1(script$1, props);
-  render$2s(vnode, container);
+  render$1S(vnode, container);
   document.body.appendChild(container.firstElementChild);
   return vnode.component;
 };
@@ -45697,7 +45648,7 @@ const genContainer = () => {
 const showMessage = (options) => {
   const container = genContainer();
   options.onVanish = () => {
-    render$2s(null, container);
+    render$1S(null, container);
     messageInstance.delete(vm);
   };
   options.onAction = (action) => {
@@ -46087,9 +46038,9 @@ const notify = function(options = {}) {
     default: () => props.message
   } : null);
   vm.props.onDestroy = () => {
-    render$2s(null, container);
+    render$1S(null, container);
   };
-  render$2s(vm, container);
+  render$1S(vm, container);
   notifications[position].push({ vm });
   appendTo.appendChild(container.firstElementChild);
   return {
@@ -46156,9 +46107,9 @@ var Plugins = [
   ElPopoverDirective
 ];
 
-var installer = makeInstaller$1([...Components, ...Plugins]);
+var installer = makeInstaller([...Components, ...Plugins]);
 
 const install = installer.install;
 const version = installer.version;
 
-export { BAR_MAP, CASCADER_PANEL_INJECTION_KEY, CHANGE_EVENT, ClickOutside, script$1J as CommonPicker, CommonProps, DARK_EFFECT, DEFAULT_FORMATS_DATE, DEFAULT_FORMATS_DATEPICKER, DEFAULT_FORMATS_TIME, DefaultProps, FixedSizeGrid$1 as DynamicSizeGrid, DynamicSizeList$1 as DynamicSizeList, Effect, ElAffix, ElAlert, ElAside, ElAutocomplete, ElAvatar, ElBacktop, ElBadge, ElBreadcrumb, ElBreadcrumbItem, ElButton, ElButtonGroup$2 as ElButtonGroup, ElCalendar, ElCard, ElCarousel, ElCarouselItem, ElCascader, ElCascaderPanel, ElCheckTag, ElCheckbox, ElCheckboxButton, ElCheckboxGroup$1 as ElCheckboxGroup, ElCol, ElCollapse, ElCollapseItem, ElCollapseTransition, ElColorPicker, ElConfigProvider, ElContainer, ElDatePicker, ElDescriptions, ElDescriptionsItem, ElDialog, ElDivider, ElDrawer, ElDropdown, ElDropdownItem, ElDropdownMenu, ElEmpty, ElFooter, ElForm, ElFormItem, ElHeader, ElIcon, ElImage, ElImageViewer, ElInfiniteScroll, ElInput, ElInputNumber, ElLink, ElLoading, ElLoadingDirective, ElLoadingService, ElMain, ElMenu, ElMenuItem, ElMenuItemGroup, ElMessage, ElMessageBox, ElNotification, ElOption$1 as ElOption, ElOptionGroup, ElOverlay, ElPageHeader, ElPagination, ElPopconfirm, ElPopover, ElPopoverDirective, ElPopper$1 as ElPopper, ElProgress, ElRadio, ElRadioButton, ElRadioGroup, ElRate, ElResult, ElRow, ElScrollbar, ElSelect, ElSelectV2, ElSkeleton, ElSkeletonItem, ElSlider, ElSpace, ElStep, ElSteps, ElSubMenu, ElSwitch, ElTabPane, ElTable, ElTableColumn, ElTabs, ElTag, ElTimePicker, ElTimeSelect, ElTimeline, ElTimelineItem, ElTooltip, ElTransfer, ElTree, ElTreeV2, ElUpload, ExpandTrigger$1 as ExpandTrigger, FixedSizeGrid$3 as FixedSizeGrid, FixedSizeList$1 as FixedSizeList, IconComponentMap, IconMap, LIGHT_EFFECT, Mousewheel, RepeatClick, Resize, script$1H as TimePickPanel, TrapFocus, affixEmits, affixProps, alertEmits, alertProps, avatarEmits, avatarProps, backtopEmits, backtopProps, badgeProps, barProps, breadcrumbItemProps, breadcrumbProps, buildTranslator, buttonEmits, buttonGroupContextKey, buttonNativeType, buttonProps, buttonSize, buttonType, cardProps, colProps, configProviderContextKey, configProviderProps, installer as default, dialogEmits, dialogProps, dividerProps, elBreadcrumbKey, elFormItemKey, elFormKey, elPaginationKey, emptyProps, extractDateFormat, extractTimeFormat, iconProps, imageEmits, imageProps, imageViewerEmits, imageViewerProps, inputEmits, inputNumberEmits, inputNumberProps, inputProps, install, linkEmits, linkProps, localeContextKey, localeProviderMaker, makeInstaller$1 as makeInstaller, menuEmits, menuItemEmits, menuItemGroupProps, menuItemProps, menuProps, messageEmits, messageProps, messageTypes, notificationEmits, notificationProps, notificationTypes, overlayEmits, overlayProps, pageHeaderEmits, pageHeaderProps, paginationEmits, paginationProps, popconfirmEmits, popconfirmProps, popperDefaultProps, provideLocale, radioButtonProps, radioEmits, radioGroupEmits, radioGroupKey, radioGroupProps, radioProps, radioPropsBase, rangeArr, rateEmits, rateProps, renderArrow, renderPopper, renderThumbStyle$1 as renderThumbStyle, renderTrigger, resultProps, rowProps, scrollbarContextKey, scrollbarEmits, scrollbarProps, selectGroupKey, selectKey, selectV2InjectionKey, skeletonItemProps, skeletonProps, spaceProps, subMenuProps, tabBar, tabNavProps, tabPaneProps, tabsEmits, tabsProps, tabsRootContextKey, tagEmits, tagProps, timePickerDefaultProps, translate, useAttrs, useCascaderConfig, useDialog, useFocus, useFormItem, useFormItemProps, useGlobalConfig, useLocale, useLocaleProps, useLockscreen, useModal, useModelToggle, useModelToggleEmits, useModelToggleProps, usePopper, usePopperControlProps, usePopperHook, usePopperProps, usePreventGlobal, useRadio, useRestoreActive, useSameTarget, useSpace, useTeleport, useThrottleRender, useTimeout, version, virtualizedGridProps, virtualizedListProps, virtualizedProps, virtualizedScrollbarProps };
+export { BAR_MAP, CASCADER_PANEL_INJECTION_KEY, CHANGE_EVENT, ClickOutside, script$1J as CommonPicker, CommonProps, DARK_EFFECT, DEFAULT_FORMATS_DATE, DEFAULT_FORMATS_DATEPICKER, DEFAULT_FORMATS_TIME, DefaultProps, FixedSizeGrid$1 as DynamicSizeGrid, DynamicSizeList$1 as DynamicSizeList, Effect, ElAffix, ElAlert, ElAside, ElAutocomplete, ElAvatar, ElBacktop, ElBadge, ElBreadcrumb, ElBreadcrumbItem, ElButton, ElButtonGroup$1 as ElButtonGroup, ElCalendar, ElCard, ElCarousel, ElCarouselItem, ElCascader, ElCascaderPanel, ElCheckTag, ElCheckbox, ElCheckboxButton, ElCheckboxGroup$1 as ElCheckboxGroup, ElCol, ElCollapse, ElCollapseItem, ElCollapseTransition, ElColorPicker, ElConfigProvider, ElContainer, ElDatePicker, ElDescriptions, ElDescriptionsItem, ElDialog, ElDivider, ElDrawer, ElDropdown, ElDropdownItem, ElDropdownMenu, ElEmpty, ElFooter, ElForm, ElFormItem, ElHeader, ElIcon, ElImage, ElImageViewer, ElInfiniteScroll, ElInput, ElInputNumber, ElLink, ElLoading, ElLoadingDirective, ElLoadingService, ElMain, ElMenu, ElMenuItem, ElMenuItemGroup, ElMessage, ElMessageBox, ElNotification, ElOption$1 as ElOption, ElOptionGroup, ElOverlay, ElPageHeader, ElPagination, ElPopconfirm, ElPopover, ElPopoverDirective, ElPopper$1 as ElPopper, ElProgress, ElRadio, ElRadioButton, ElRadioGroup, ElRate, ElResult, ElRow, ElScrollbar, ElSelect, ElSelectV2, ElSkeleton, ElSkeletonItem, ElSlider, ElSpace, ElStep, ElSteps, ElSubMenu, ElSwitch, ElTabPane, ElTable, ElTableColumn, ElTabs, ElTag, ElTimePicker, ElTimeSelect, ElTimeline, ElTimelineItem, ElTooltip, ElTransfer, ElTree, ElTreeV2, ElUpload, ExpandTrigger$1 as ExpandTrigger, FixedSizeGrid$3 as FixedSizeGrid, FixedSizeList$1 as FixedSizeList, IconComponentMap, IconMap, LIGHT_EFFECT, Mousewheel, RepeatClick, Resize, script$1H as TimePickPanel, TrapFocus, affixEmits, affixProps, alertEmits, alertProps, avatarEmits, avatarProps, backtopEmits, backtopProps, badgeProps, barProps, breadcrumbItemProps, breadcrumbProps, buildTranslator, buttonEmits, buttonGroupContextKey, buttonNativeType, buttonProps, buttonSize, buttonType, calendarEmits, calendarProps, cardProps, colProps, configProviderContextKey, configProviderProps, installer as default, dialogEmits, dialogProps, dividerProps, drawerEmits, drawerProps, elBreadcrumbKey, elFormItemKey, elFormKey, elPaginationKey, emptyProps, extractDateFormat, extractTimeFormat, iconProps, imageEmits, imageProps, imageViewerEmits, imageViewerProps, inputEmits, inputNumberEmits, inputNumberProps, inputProps, install, linkEmits, linkProps, localeContextKey, localeProviderMaker, makeInstaller, menuEmits, menuItemEmits, menuItemGroupProps, menuItemProps, menuProps, messageEmits, messageProps, messageTypes, notificationEmits, notificationProps, notificationTypes, overlayEmits, overlayProps, pageHeaderEmits, pageHeaderProps, paginationEmits, paginationProps, popconfirmEmits, popconfirmProps, popperDefaultProps, progressProps, provideLocale, radioButtonProps, radioEmits, radioGroupEmits, radioGroupKey, radioGroupProps, radioProps, radioPropsBase, rangeArr, rateEmits, rateProps, renderArrow, renderPopper, renderThumbStyle$1 as renderThumbStyle, renderTrigger, resultProps, rowProps, scrollbarContextKey, scrollbarEmits, scrollbarProps, selectGroupKey, selectKey, selectV2InjectionKey, skeletonItemProps, skeletonProps, spaceProps, subMenuProps, switchEmits, switchProps, tabBar, tabNavProps, tabPaneProps, tabsEmits, tabsProps, tabsRootContextKey, tagEmits, tagProps, timePickerDefaultProps, translate, useAttrs, useCascaderConfig, useDialog, useDisabled$1 as useDisabled, useFocus, useFormItem, useGlobalConfig, useLocale, useLocaleProps, useLockscreen, useModal, useModelToggle, useModelToggleEmits, useModelToggleProps, usePopper, usePopperControlProps, usePopperHook, usePopperProps, usePreventGlobal, useProp, useRadio, useRestoreActive, useSameTarget, useSize, useSizeProp, useSpace, useTeleport, useThrottleRender, useTimeout, version, virtualizedGridProps, virtualizedListProps, virtualizedProps, virtualizedScrollbarProps };