@element-plus/nightly 0.0.20220117 → 0.0.20220121

package/es/components/affix/src/affix.vue_vue_type_template_id_0745df9e_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"affix.vue_vue_type_template_id_0745df9e_lang.mjs","sources":["../../../../../../packages/components/affix/src/affix.vue?vue&type=template&id=0745df9e&lang.js"],"sourcesContent":["<template>\n  <div ref=\"root\" class=\"el-affix\" :style=\"rootStyle\">\n    <div :class=\"{ 'el-affix--fixed': state.fixed }\" :style=\"affixStyle\">\n      <slot></slot>\n    </div>\n  </div>\n</template>\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  onMounted,\n  reactive,\n  shallowRef,\n  watch,\n} from 'vue'\nimport { useEventListener, useResizeObserver } from '@vueuse/core'\nimport { getScrollContainer } from '@element-plus/utils/dom'\nimport { affixEmits, affixProps } from './affix'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElAffix',\n\n  props: affixProps,\n  emits: affixEmits,\n\n  setup(props, { emit }) {\n    const target = shallowRef<HTMLElement>()\n    const root = shallowRef<HTMLDivElement>()\n    const scrollContainer = shallowRef<HTMLElement | Window>()\n\n    const state = reactive({\n      fixed: false,\n      height: 0, // height of root\n      width: 0, // width of root\n      scrollTop: 0, // scrollTop of documentElement\n      clientHeight: 0, // clientHeight of documentElement\n      transform: 0,\n    })\n\n    const rootStyle = computed<CSSProperties>(() => {\n      return {\n        height: state.fixed ? `${state.height}px` : '',\n        width: state.fixed ? `${state.width}px` : '',\n      }\n    })\n\n    const affixStyle = computed<CSSProperties | undefined>(() => {\n      if (!state.fixed) return\n\n      const offset = props.offset ? `${props.offset}px` : 0\n      const transform = state.transform\n        ? `translateY(${state.transform}px)`\n        : ''\n\n      return {\n        height: `${state.height}px`,\n        width: `${state.width}px`,\n        top: props.position === 'top' ? offset : '',\n        bottom: props.position === 'bottom' ? offset : '',\n        transform,\n        zIndex: props.zIndex,\n      }\n    })\n\n    const update = () => {\n      if (!root.value || !target.value || !scrollContainer.value) return\n\n      const rootRect = root.value.getBoundingClientRect()\n      const targetRect = target.value.getBoundingClientRect()\n      state.height = rootRect.height\n      state.width = rootRect.width\n      state.scrollTop =\n        scrollContainer.value instanceof Window\n          ? document.documentElement.scrollTop\n          : scrollContainer.value.scrollTop || 0\n      state.clientHeight = document.documentElement.clientHeight\n\n      if (props.position === 'top') {\n        if (props.target) {\n          const difference = targetRect.bottom - props.offset - state.height\n          state.fixed = props.offset > rootRect.top && targetRect.bottom > 0\n          state.transform = difference < 0 ? difference : 0\n        } else {\n          state.fixed = props.offset > rootRect.top\n        }\n      } else {\n        if (props.target) {\n          const difference =\n            state.clientHeight - targetRect.top - props.offset - state.height\n          state.fixed =\n            state.clientHeight - props.offset < rootRect.bottom &&\n            state.clientHeight > targetRect.top\n          state.transform = difference < 0 ? -difference : 0\n        } else {\n          state.fixed = state.clientHeight - props.offset < rootRect.bottom\n        }\n      }\n    }\n\n    const onScroll = () => {\n      update()\n\n      emit('scroll', {\n        scrollTop: state.scrollTop,\n        fixed: state.fixed,\n      })\n    }\n\n    watch(\n      () => state.fixed,\n      () => {\n        emit('change', state.fixed)\n      }\n    )\n\n    onMounted(() => {\n      if (props.target) {\n        target.value =\n          document.querySelector<HTMLElement>(props.target) ?? undefined\n        if (!target.value) {\n          throw new Error(`Target is not existed: ${props.target}`)\n        }\n      } else {\n        target.value = document.documentElement\n      }\n      scrollContainer.value = getScrollContainer(root.value!, true)\n    })\n\n    useEventListener(scrollContainer, 'scroll', onScroll)\n    useResizeObserver(root, () => update())\n    useResizeObserver(target, () => update())\n\n    return {\n      root,\n      state,\n      rootStyle,\n      affixStyle,\n      update,\n    }\n  },\n})\n</script>\n"],"names":["_normalizeStyle"],"mappings":";;;;;IACO,KAAI;IAAO,KAAK,EAACA;;;;MACd,KAAK;;;;;;;;;"}
+{"version":3,"file":"affix.vue_vue_type_template_id_0745df9e_lang.mjs","sources":["../../../../../../packages/components/affix/src/affix.vue?vue&type=template&id=0745df9e&lang.js"],"sourcesContent":["<template>\n  <div ref=\"root\" :class=\"ns.b()\" :style=\"rootStyle\">\n    <div :class=\"{ [ns.m('fixed')]: state.fixed }\" :style=\"affixStyle\">\n      <slot></slot>\n    </div>\n  </div>\n</template>\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  onMounted,\n  reactive,\n  shallowRef,\n  watch,\n} from 'vue'\nimport { useEventListener, useResizeObserver } from '@vueuse/core'\nimport { getScrollContainer } from '@element-plus/utils/dom'\nimport { useNamespace } from '@element-plus/hooks'\nimport { affixEmits, affixProps } from './affix'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElAffix',\n\n  props: affixProps,\n  emits: affixEmits,\n\n  setup(props, { emit }) {\n    const ns = useNamespace('affix')\n\n    const target = shallowRef<HTMLElement>()\n    const root = shallowRef<HTMLDivElement>()\n    const scrollContainer = shallowRef<HTMLElement | Window>()\n\n    const state = reactive({\n      fixed: false,\n      height: 0, // height of root\n      width: 0, // width of root\n      scrollTop: 0, // scrollTop of documentElement\n      clientHeight: 0, // clientHeight of documentElement\n      transform: 0,\n    })\n\n    const rootStyle = computed<CSSProperties>(() => {\n      return {\n        height: state.fixed ? `${state.height}px` : '',\n        width: state.fixed ? `${state.width}px` : '',\n      }\n    })\n\n    const affixStyle = computed<CSSProperties | undefined>(() => {\n      if (!state.fixed) return\n\n      const offset = props.offset ? `${props.offset}px` : 0\n      const transform = state.transform\n        ? `translateY(${state.transform}px)`\n        : ''\n\n      return {\n        height: `${state.height}px`,\n        width: `${state.width}px`,\n        top: props.position === 'top' ? offset : '',\n        bottom: props.position === 'bottom' ? offset : '',\n        transform,\n        zIndex: props.zIndex,\n      }\n    })\n\n    const update = () => {\n      if (!root.value || !target.value || !scrollContainer.value) return\n\n      const rootRect = root.value.getBoundingClientRect()\n      const targetRect = target.value.getBoundingClientRect()\n      state.height = rootRect.height\n      state.width = rootRect.width\n      state.scrollTop =\n        scrollContainer.value instanceof Window\n          ? document.documentElement.scrollTop\n          : scrollContainer.value.scrollTop || 0\n      state.clientHeight = document.documentElement.clientHeight\n\n      if (props.position === 'top') {\n        if (props.target) {\n          const difference = targetRect.bottom - props.offset - state.height\n          state.fixed = props.offset > rootRect.top && targetRect.bottom > 0\n          state.transform = difference < 0 ? difference : 0\n        } else {\n          state.fixed = props.offset > rootRect.top\n        }\n      } else {\n        if (props.target) {\n          const difference =\n            state.clientHeight - targetRect.top - props.offset - state.height\n          state.fixed =\n            state.clientHeight - props.offset < rootRect.bottom &&\n            state.clientHeight > targetRect.top\n          state.transform = difference < 0 ? -difference : 0\n        } else {\n          state.fixed = state.clientHeight - props.offset < rootRect.bottom\n        }\n      }\n    }\n\n    const onScroll = () => {\n      update()\n\n      emit('scroll', {\n        scrollTop: state.scrollTop,\n        fixed: state.fixed,\n      })\n    }\n\n    watch(\n      () => state.fixed,\n      () => {\n        emit('change', state.fixed)\n      }\n    )\n\n    onMounted(() => {\n      if (props.target) {\n        target.value =\n          document.querySelector<HTMLElement>(props.target) ?? undefined\n        if (!target.value) {\n          throw new Error(`Target is not existed: ${props.target}`)\n        }\n      } else {\n        target.value = document.documentElement\n      }\n      scrollContainer.value = getScrollContainer(root.value!, true)\n    })\n\n    useEventListener(scrollContainer, 'scroll', onScroll)\n    useResizeObserver(root, () => update())\n    useResizeObserver(target, () => update())\n\n    return {\n      ns,\n      root,\n      state,\n      rootStyle,\n      affixStyle,\n      update,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;IACO,KAAI;IAAQ,KAAK,iBAAE;;;;MAChB,KAAK;;;;;;;;;"}

package/es/components/alert/index.d.ts

@@ -6,45 +6,46 @@ export declare const ElAlert: import("../../utils/types").SFCWithInstall<import(
     readonly closeText: import("../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
     readonly showIcon: BooleanConstructor;
     readonly center: BooleanConstructor;
-    readonly effect: import("../../utils/props").BuildPropReturn<StringConstructor, "light", unknown, "dark" | "light", unknown>;
+    readonly effect: import("../../utils/props").BuildPropReturn<StringConstructor, "light", unknown, "light" | "dark", unknown>;
 }, {
+    ns: {
+        namespace: import("vue").ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        is: (name: string, state?: boolean) => string;
+    };
     visible: import("vue").Ref<boolean>;
-    typeClass: import("vue").ComputedRef<string>;
     iconComponent: import("vue").ComputedRef<import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{}>, {}>>;
-    isBigIcon: import("vue").ComputedRef<"" | "is-big">;
-    isBoldTitle: import("vue").ComputedRef<"" | "is-bold">;
+    isBigIcon: import("vue").ComputedRef<string>;
+    isBoldTitle: import("vue").ComputedRef<string>;
     close: (evt: MouseEvent) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: (evt: MouseEvent) => boolean;
-}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    readonly title?: unknown;
-    readonly description?: unknown;
-    readonly type?: unknown;
-    readonly closable?: unknown;
-    readonly closeText?: unknown;
-    readonly showIcon?: unknown;
-    readonly center?: unknown;
-    readonly effect?: unknown;
-} & {
-    type: import("../../utils/props").BuildPropType<StringConstructor, "success" | "warning" | "info" | "error", unknown>;
-    closable: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
-    title: string;
-    center: boolean;
-    description: string;
-    closeText: string;
-    effect: import("../../utils/props").BuildPropType<StringConstructor, "dark" | "light", unknown>;
-    showIcon: boolean;
-} & {}> & {
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly title: import("../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly description: import("../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly type: import("../../utils/props").BuildPropReturn<StringConstructor, "info", unknown, "success" | "warning" | "info" | "error", unknown>;
+    readonly closable: import("../../utils/props").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+    readonly closeText: import("../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly showIcon: BooleanConstructor;
+    readonly center: BooleanConstructor;
+    readonly effect: import("../../utils/props").BuildPropReturn<StringConstructor, "light", unknown, "light" | "dark", unknown>;
+}>> & {
     onClose?: ((evt: MouseEvent) => any) | undefined;
 }, {
     type: import("../../utils/props").BuildPropType<StringConstructor, "success" | "warning" | "info" | "error", unknown>;
     closable: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     title: string;
-    center: boolean;
     description: string;
     closeText: string;
-    effect: import("../../utils/props").BuildPropType<StringConstructor, "dark" | "light", unknown>;
+    effect: import("../../utils/props").BuildPropType<StringConstructor, "light" | "dark", unknown>;
     showIcon: boolean;
+    center: boolean;
 }>> & Record<string, any>;
 export default ElAlert;
 export * from './src/alert';

package/es/components/alert/index.mjs

@@ -1,6 +1,6 @@
 import { withInstall } from '../../utils/with-install.mjs';
 import './src/alert2.mjs';
-export { alertEmits, alertProps } from './src/alert.mjs';
+export { alertEffects, alertEmits, alertProps } from './src/alert.mjs';
 import script from './src/alert.vue_vue_type_script_lang.mjs';
 
 const ElAlert = withInstall(script);

package/es/components/alert/src/alert.d.ts

@@ -1,5 +1,6 @@
 import type { ExtractPropTypes } from 'vue';
-export declare type AlertEffect = 'light' | 'dark';
+import type Alert from './alert.vue';
+export declare const alertEffects: readonly ["light", "dark"];
 export declare const alertProps: {
     readonly title: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
     readonly description: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
@@ -8,10 +9,11 @@ export declare const alertProps: {
     readonly closeText: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
     readonly showIcon: BooleanConstructor;
     readonly center: BooleanConstructor;
-    readonly effect: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "light", unknown, "dark" | "light", unknown>;
+    readonly effect: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, "light", unknown, "light" | "dark", unknown>;
 };
 export declare type AlertProps = ExtractPropTypes<typeof alertProps>;
 export declare const alertEmits: {
     close: (evt: MouseEvent) => boolean;
 };
 export declare type AlertEmits = typeof alertEmits;
+export declare type AlertInstance = InstanceType<typeof Alert>;

package/es/components/alert/src/alert.mjs

@@ -1,6 +1,7 @@
 import { TypeComponentsMap } from '../../../utils/icon.mjs';
 import { buildProps, keyOf } from '../../../utils/props.mjs';
 
+const alertEffects = ["light", "dark"];
 const alertProps = buildProps({
   title: {
     type: String,
@@ -27,7 +28,7 @@ const alertProps = buildProps({
   center: Boolean,
   effect: {
     type: String,
-    values: ["light", "dark"],
+    values: alertEffects,
     default: "light"
   }
 });
@@ -35,5 +36,5 @@ const alertEmits = {
   close: (evt) => evt instanceof MouseEvent
 };
 
-export { alertEmits, alertProps };
+export { alertEffects, alertEmits, alertProps };
 //# sourceMappingURL=alert.mjs.map

package/es/components/alert/src/alert.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"alert.mjs","sources":["../../../../../../packages/components/alert/src/alert.ts"],"sourcesContent":["import { TypeComponentsMap } from '@element-plus/utils/icon'\nimport { buildProps, keyOf } from '@element-plus/utils/props'\nimport type { ExtractPropTypes } from 'vue'\n\nexport type AlertEffect = 'light' | 'dark'\n\nexport const alertProps = buildProps({\n  title: {\n    type: String,\n    default: '',\n  },\n  description: {\n    type: String,\n    default: '',\n  },\n  type: {\n    type: String,\n    values: keyOf(TypeComponentsMap),\n    default: 'info',\n  },\n  closable: {\n    type: Boolean,\n    default: true,\n  },\n  closeText: {\n    type: String,\n    default: '',\n  },\n  showIcon: Boolean,\n  center: Boolean,\n  effect: {\n    type: String,\n    values: ['light', 'dark'],\n    default: 'light',\n  },\n} as const)\nexport type AlertProps = ExtractPropTypes<typeof alertProps>\n\nexport const alertEmits = {\n  close: (evt: MouseEvent) => evt instanceof MouseEvent,\n}\nexport type AlertEmits = typeof alertEmits\n"],"names":[],"mappings":";;;AAEY,MAAC,UAAU,GAAG,UAAU,CAAC;AACrC,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,KAAK,CAAC,iBAAiB,CAAC;AACpC,IAAI,OAAO,EAAE,MAAM;AACnB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,MAAM,EAAE,OAAO;AACjB,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC;AAC7B,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,CAAC,EAAE;AACS,MAAC,UAAU,GAAG;AAC1B,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,GAAG,YAAY,UAAU;AAC3C;;;;"}
+{"version":3,"file":"alert.mjs","sources":["../../../../../../packages/components/alert/src/alert.ts"],"sourcesContent":["import { TypeComponentsMap } from '@element-plus/utils/icon'\nimport { buildProps, keyOf } from '@element-plus/utils/props'\nimport type { ExtractPropTypes } from 'vue'\nimport type Alert from './alert.vue'\n\nexport const alertEffects = ['light', 'dark'] as const\n\nexport const alertProps = buildProps({\n  title: {\n    type: String,\n    default: '',\n  },\n  description: {\n    type: String,\n    default: '',\n  },\n  type: {\n    type: String,\n    values: keyOf(TypeComponentsMap),\n    default: 'info',\n  },\n  closable: {\n    type: Boolean,\n    default: true,\n  },\n  closeText: {\n    type: String,\n    default: '',\n  },\n  showIcon: Boolean,\n  center: Boolean,\n  effect: {\n    type: String,\n    values: alertEffects,\n    default: 'light',\n  },\n} as const)\nexport type AlertProps = ExtractPropTypes<typeof alertProps>\n\nexport const alertEmits = {\n  close: (evt: MouseEvent) => evt instanceof MouseEvent,\n}\nexport type AlertEmits = typeof alertEmits\n\nexport type AlertInstance = InstanceType<typeof Alert>\n"],"names":[],"mappings":";;;AAEY,MAAC,YAAY,GAAG,CAAC,OAAO,EAAE,MAAM,EAAE;AAClC,MAAC,UAAU,GAAG,UAAU,CAAC;AACrC,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,KAAK,CAAC,iBAAiB,CAAC;AACpC,IAAI,OAAO,EAAE,MAAM;AACnB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,MAAM,EAAE,OAAO;AACjB,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,YAAY;AACxB,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,CAAC,EAAE;AACS,MAAC,UAAU,GAAG;AAC1B,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,GAAG,YAAY,UAAU;AAC3C;;;;"}

package/es/components/alert/src/alert.vue.d.ts

@@ -6,44 +6,45 @@ declare const _default: import("vue").DefineComponent<{
     readonly closeText: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
     readonly showIcon: BooleanConstructor;
     readonly center: BooleanConstructor;
-    readonly effect: import("../../../utils/props").BuildPropReturn<StringConstructor, "light", unknown, "dark" | "light", unknown>;
+    readonly effect: import("../../../utils/props").BuildPropReturn<StringConstructor, "light", unknown, "light" | "dark", unknown>;
 }, {
+    ns: {
+        namespace: import("vue").ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        is: (name: string, state?: boolean) => string;
+    };
     visible: import("vue").Ref<boolean>;
-    typeClass: import("vue").ComputedRef<string>;
     iconComponent: import("vue").ComputedRef<import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{}>, {}>>;
-    isBigIcon: import("vue").ComputedRef<"" | "is-big">;
-    isBoldTitle: import("vue").ComputedRef<"" | "is-bold">;
+    isBigIcon: import("vue").ComputedRef<string>;
+    isBoldTitle: import("vue").ComputedRef<string>;
     close: (evt: MouseEvent) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: (evt: MouseEvent) => boolean;
-}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    readonly title?: unknown;
-    readonly description?: unknown;
-    readonly type?: unknown;
-    readonly closable?: unknown;
-    readonly closeText?: unknown;
-    readonly showIcon?: unknown;
-    readonly center?: unknown;
-    readonly effect?: unknown;
-} & {
-    type: import("../../../utils/props").BuildPropType<StringConstructor, "success" | "warning" | "info" | "error", unknown>;
-    closable: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
-    title: string;
-    center: boolean;
-    description: string;
-    closeText: string;
-    effect: import("../../../utils/props").BuildPropType<StringConstructor, "dark" | "light", unknown>;
-    showIcon: boolean;
-} & {}> & {
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly title: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly description: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly type: import("../../../utils/props").BuildPropReturn<StringConstructor, "info", unknown, "success" | "warning" | "info" | "error", unknown>;
+    readonly closable: import("../../../utils/props").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+    readonly closeText: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly showIcon: BooleanConstructor;
+    readonly center: BooleanConstructor;
+    readonly effect: import("../../../utils/props").BuildPropReturn<StringConstructor, "light", unknown, "light" | "dark", unknown>;
+}>> & {
     onClose?: ((evt: MouseEvent) => any) | undefined;
 }, {
     type: import("../../../utils/props").BuildPropType<StringConstructor, "success" | "warning" | "info" | "error", unknown>;
     closable: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     title: string;
-    center: boolean;
     description: string;
     closeText: string;
-    effect: import("../../../utils/props").BuildPropType<StringConstructor, "dark" | "light", unknown>;
+    effect: import("../../../utils/props").BuildPropType<StringConstructor, "light" | "dark", unknown>;
     showIcon: boolean;
+    center: boolean;
 }>;
 export default _default;

package/es/components/alert/src/alert.vue_vue_type_script_lang.mjs

@@ -1,7 +1,9 @@
 import { defineComponent, ref, computed } from 'vue';
 import { ElIcon } from '../../icon/index.mjs';
 import { TypeComponents, TypeComponentsMap } from '../../../utils/icon.mjs';
+import '../../../hooks/index.mjs';
 import { alertProps, alertEmits } from './alert.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
 
 var script = defineComponent({
   name: "ElAlert",
@@ -12,18 +14,18 @@ var script = defineComponent({
   props: alertProps,
   emits: alertEmits,
   setup(props, { emit, slots }) {
+    const ns = useNamespace("alert");
     const visible = ref(true);
-    const typeClass = computed(() => `el-alert--${props.type}`);
     const iconComponent = computed(() => TypeComponentsMap[props.type] || TypeComponentsMap["info"]);
-    const isBigIcon = computed(() => props.description || slots.default ? "is-big" : "");
-    const isBoldTitle = computed(() => props.description || slots.default ? "is-bold" : "");
+    const isBigIcon = computed(() => props.description || slots.default ? ns.is("big") : "");
+    const isBoldTitle = computed(() => props.description || slots.default ? ns.is("bold") : "");
     const close = (evt) => {
       visible.value = false;
       emit("close", evt);
     };
     return {
+      ns,
       visible,
-      typeClass,
       iconComponent,
       isBigIcon,
       isBoldTitle,

package/es/components/alert/src/alert.vue_vue_type_script_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"alert.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/alert/src/alert.vue"],"sourcesContent":["<template>\n  <transition name=\"el-alert-fade\">\n    <div\n      v-show=\"visible\"\n      class=\"el-alert\"\n      :class=\"[typeClass, center ? 'is-center' : '', 'is-' + effect]\"\n      role=\"alert\"\n    >\n      <el-icon\n        v-if=\"showIcon && iconComponent\"\n        class=\"el-alert__icon\"\n        :class=\"isBigIcon\"\n      >\n        <component :is=\"iconComponent\" />\n      </el-icon>\n      <div class=\"el-alert__content\">\n        <span\n          v-if=\"title || $slots.title\"\n          class=\"el-alert__title\"\n          :class=\"[isBoldTitle]\"\n        >\n          <slot name=\"title\">{{ title }}</slot>\n        </span>\n        <p v-if=\"$slots.default || description\" class=\"el-alert__description\">\n          <slot>\n            {{ description }}\n          </slot>\n        </p>\n        <template v-if=\"closable\">\n          <div\n            v-if=\"closeText\"\n            class=\"el-alert__closebtn is-customed\"\n            @click=\"close\"\n          >\n            {{ closeText }}\n          </div>\n          <el-icon v-else class=\"el-alert__closebtn\" @click=\"close\">\n            <close />\n          </el-icon>\n        </template>\n      </div>\n    </div>\n  </transition>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils/icon'\nimport { alertProps, alertEmits } from './alert'\n\nexport default defineComponent({\n  name: 'ElAlert',\n\n  components: {\n    ElIcon,\n    ...TypeComponents,\n  },\n\n  props: alertProps,\n  emits: alertEmits,\n\n  setup(props, { emit, slots }) {\n    // state\n    const visible = ref(true)\n\n    // computed\n    const typeClass = computed(() => `el-alert--${props.type}`)\n    const iconComponent = computed(\n      () => TypeComponentsMap[props.type] || TypeComponentsMap['info']\n    )\n    const isBigIcon = computed(() =>\n      props.description || slots.default ? 'is-big' : ''\n    )\n    const isBoldTitle = computed(() =>\n      props.description || slots.default ? 'is-bold' : ''\n    )\n\n    // methods\n    const close = (evt: MouseEvent) => {\n      visible.value = false\n      emit('close', evt)\n    }\n\n    return {\n      visible,\n      typeClass,\n      iconComponent,\n      isBigIcon,\n      isBoldTitle,\n      close,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;AAgDA,aAAe,eAAe;;AAE9B,EAAE,UAAU;IACR,MAAM;;GAEP;OACI,EAAE;OACF,EAAE,UAAU;EACjB;;IAEE,MAAM,SAAS;IACf,MAAM;;IAEN,MAAM,WAAW,GAAG,QAAQ;IAC5B,MAAM;MACJ,OAAO,CAAC,QAAQ,KAAK,CAAC;;KAEvB;IACD,OAAO;MACL,OAAO;MACP,SAAS;;MAET,SAAS;MACT,WAAW;;KAEZ,CAAC;;;;;;"}
+{"version":3,"file":"alert.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/alert/src/alert.vue"],"sourcesContent":["<template>\n  <transition name=\"el-alert-fade\">\n    <div\n      v-show=\"visible\"\n      :class=\"[ns.b(), ns.m(type), ns.is('center', center), ns.is(effect)]\"\n      role=\"alert\"\n    >\n      <el-icon\n        v-if=\"showIcon && iconComponent\"\n        :class=\"[ns.e('icon'), isBigIcon]\"\n      >\n        <component :is=\"iconComponent\" />\n      </el-icon>\n      <div :class=\"ns.e('content')\">\n        <span\n          v-if=\"title || $slots.title\"\n          :class=\"[ns.e('title'), isBoldTitle]\"\n        >\n          <slot name=\"title\">{{ title }}</slot>\n        </span>\n        <p v-if=\"$slots.default || description\" :class=\"ns.e('description')\">\n          <slot>\n            {{ description }}\n          </slot>\n        </p>\n        <template v-if=\"closable\">\n          <div\n            v-if=\"closeText\"\n            :class=\"[ns.e('closebtn'), ns.is('customed')]\"\n            @click=\"close\"\n          >\n            {{ closeText }}\n          </div>\n          <el-icon v-else :class=\"ns.e('closebtn')\" @click=\"close\">\n            <close />\n          </el-icon>\n        </template>\n      </div>\n    </div>\n  </transition>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils/icon'\nimport { useNamespace } from '@element-plus/hooks'\nimport { alertProps, alertEmits } from './alert'\n\nexport default defineComponent({\n  name: 'ElAlert',\n\n  components: {\n    ElIcon,\n    ...TypeComponents,\n  },\n\n  props: alertProps,\n  emits: alertEmits,\n\n  setup(props, { emit, slots }) {\n    const ns = useNamespace('alert')\n\n    // state\n    const visible = ref(true)\n\n    // computed\n    const iconComponent = computed(\n      () => TypeComponentsMap[props.type] || TypeComponentsMap['info']\n    )\n    const isBigIcon = computed(() =>\n      props.description || slots.default ? ns.is('big') : ''\n    )\n    const isBoldTitle = computed(() =>\n      props.description || slots.default ? ns.is('bold') : ''\n    )\n\n    // methods\n    const close = (evt: MouseEvent) => {\n      visible.value = false\n      emit('close', evt)\n    }\n\n    return {\n      ns,\n      visible,\n      iconComponent,\n      isBigIcon,\n      isBoldTitle,\n      close,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;AA8CA,aAAe,eAAe;;AAE9B,EAAE,UAAU;IACR,MAAM;;GAEP;OACI,EAAE;OACF,EAAE,UAAU;EACjB;;IAEE,MAAM,OAAO;IACb,MAAM;;IAEN,MAAM,WAAW,GAAG,QAAQ;IAC5B,MAAM,KAAK,GAAG,CAAC,GAAG,KAAK;;UAEjB,CAAC;KACN,CAAC;;QAEE;MACF,OAAO;MACP,aAAa;;MAEb,WAAW;MACX,KAAK;;;;;;;"}

package/es/components/alert/src/alert.vue_vue_type_template_id_1755b449_lang.mjs

@@ -1,59 +1,59 @@
 import { resolveComponent, openBlock, createBlock, Transition, withCtx, withDirectives, createElementVNode, normalizeClass, resolveDynamicComponent, createCommentVNode, createElementBlock, renderSlot, createTextVNode, toDisplayString, Fragment, createVNode, vShow } from 'vue';
 
-const _hoisted_1 = { class: "el-alert__content" };
-const _hoisted_2 = {
-  key: 1,
-  class: "el-alert__description"
-};
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_icon = resolveComponent("el-icon");
   const _component_close = resolveComponent("close");
   return openBlock(), createBlock(Transition, { name: "el-alert-fade" }, {
     default: withCtx(() => [
       withDirectives(createElementVNode("div", {
-        class: normalizeClass(["el-alert", [_ctx.typeClass, _ctx.center ? "is-center" : "", "is-" + _ctx.effect]]),
+        class: normalizeClass([_ctx.ns.b(), _ctx.ns.m(_ctx.type), _ctx.ns.is("center", _ctx.center), _ctx.ns.is(_ctx.effect)]),
         role: "alert"
       }, [
         _ctx.showIcon && _ctx.iconComponent ? (openBlock(), createBlock(_component_el_icon, {
           key: 0,
-          class: normalizeClass(["el-alert__icon", _ctx.isBigIcon])
+          class: normalizeClass([_ctx.ns.e("icon"), _ctx.isBigIcon])
         }, {
           default: withCtx(() => [
             (openBlock(), createBlock(resolveDynamicComponent(_ctx.iconComponent)))
           ]),
           _: 1
         }, 8, ["class"])) : createCommentVNode("v-if", true),
-        createElementVNode("div", _hoisted_1, [
+        createElementVNode("div", {
+          class: normalizeClass(_ctx.ns.e("content"))
+        }, [
           _ctx.title || _ctx.$slots.title ? (openBlock(), createElementBlock("span", {
             key: 0,
-            class: normalizeClass(["el-alert__title", [_ctx.isBoldTitle]])
+            class: normalizeClass([_ctx.ns.e("title"), _ctx.isBoldTitle])
           }, [
             renderSlot(_ctx.$slots, "title", {}, () => [
               createTextVNode(toDisplayString(_ctx.title), 1)
             ])
           ], 2)) : createCommentVNode("v-if", true),
-          _ctx.$slots.default || _ctx.description ? (openBlock(), createElementBlock("p", _hoisted_2, [
+          _ctx.$slots.default || _ctx.description ? (openBlock(), createElementBlock("p", {
+            key: 1,
+            class: normalizeClass(_ctx.ns.e("description"))
+          }, [
             renderSlot(_ctx.$slots, "default", {}, () => [
               createTextVNode(toDisplayString(_ctx.description), 1)
             ])
-          ])) : createCommentVNode("v-if", true),
+          ], 2)) : createCommentVNode("v-if", true),
           _ctx.closable ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
             _ctx.closeText ? (openBlock(), createElementBlock("div", {
               key: 0,
-              class: "el-alert__closebtn is-customed",
+              class: normalizeClass([_ctx.ns.e("closebtn"), _ctx.ns.is("customed")]),
               onClick: _cache[0] || (_cache[0] = (...args) => _ctx.close && _ctx.close(...args))
-            }, toDisplayString(_ctx.closeText), 1)) : (openBlock(), createBlock(_component_el_icon, {
+            }, toDisplayString(_ctx.closeText), 3)) : (openBlock(), createBlock(_component_el_icon, {
               key: 1,
-              class: "el-alert__closebtn",
+              class: normalizeClass(_ctx.ns.e("closebtn")),
               onClick: _ctx.close
             }, {
               default: withCtx(() => [
                 createVNode(_component_close)
               ]),
               _: 1
-            }, 8, ["onClick"]))
+            }, 8, ["class", "onClick"]))
           ], 2112)) : createCommentVNode("v-if", true)
-        ])
+        ], 2)
       ], 2), [
         [vShow, _ctx.visible]
       ])

package/es/components/alert/src/alert.vue_vue_type_template_id_1755b449_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"alert.vue_vue_type_template_id_1755b449_lang.mjs","sources":["../../../../../../packages/components/alert/src/alert.vue?vue&type=template&id=1755b449&lang.js"],"sourcesContent":["<template>\n  <transition name=\"el-alert-fade\">\n    <div\n      v-show=\"visible\"\n      class=\"el-alert\"\n      :class=\"[typeClass, center ? 'is-center' : '', 'is-' + effect]\"\n      role=\"alert\"\n    >\n      <el-icon\n        v-if=\"showIcon && iconComponent\"\n        class=\"el-alert__icon\"\n        :class=\"isBigIcon\"\n      >\n        <component :is=\"iconComponent\" />\n      </el-icon>\n      <div class=\"el-alert__content\">\n        <span\n          v-if=\"title || $slots.title\"\n          class=\"el-alert__title\"\n          :class=\"[isBoldTitle]\"\n        >\n          <slot name=\"title\">{{ title }}</slot>\n        </span>\n        <p v-if=\"$slots.default || description\" class=\"el-alert__description\">\n          <slot>\n            {{ description }}\n          </slot>\n        </p>\n        <template v-if=\"closable\">\n          <div\n            v-if=\"closeText\"\n            class=\"el-alert__closebtn is-customed\"\n            @click=\"close\"\n          >\n            {{ closeText }}\n          </div>\n          <el-icon v-else class=\"el-alert__closebtn\" @click=\"close\">\n            <close />\n          </el-icon>\n        </template>\n      </div>\n    </div>\n  </transition>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils/icon'\nimport { alertProps, alertEmits } from './alert'\n\nexport default defineComponent({\n  name: 'ElAlert',\n\n  components: {\n    ElIcon,\n    ...TypeComponents,\n  },\n\n  props: alertProps,\n  emits: alertEmits,\n\n  setup(props, { emit, slots }) {\n    // state\n    const visible = ref(true)\n\n    // computed\n    const typeClass = computed(() => `el-alert--${props.type}`)\n    const iconComponent = computed(\n      () => TypeComponentsMap[props.type] || TypeComponentsMap['info']\n    )\n    const isBigIcon = computed(() =>\n      props.description || slots.default ? 'is-big' : ''\n    )\n    const isBoldTitle = computed(() =>\n      props.description || slots.default ? 'is-bold' : ''\n    )\n\n    // methods\n    const close = (evt: MouseEvent) => {\n      visible.value = false\n      emit('close', evt)\n    }\n\n    return {\n      visible,\n      typeClass,\n      iconComponent,\n      isBigIcon,\n      isBoldTitle,\n      close,\n    }\n  },\n})\n</script>\n"],"names":["_createBlock","_createCommentVNode"],"mappings":";;;;;;EAuBgD;;;;;;;;;;QAnB1C,KAAK,6CACa,EAAEA;;;SAIZ;0BADR;;;;;;;;;;kCAOA;;;;qBAGS;;;;;;;;;;;;;;;;;;;6BAaG;sBACLC;;;;;;;;;;;;"}
+{"version":3,"file":"alert.vue_vue_type_template_id_1755b449_lang.mjs","sources":["../../../../../../packages/components/alert/src/alert.vue?vue&type=template&id=1755b449&lang.js"],"sourcesContent":["<template>\n  <transition name=\"el-alert-fade\">\n    <div\n      v-show=\"visible\"\n      :class=\"[ns.b(), ns.m(type), ns.is('center', center), ns.is(effect)]\"\n      role=\"alert\"\n    >\n      <el-icon\n        v-if=\"showIcon && iconComponent\"\n        :class=\"[ns.e('icon'), isBigIcon]\"\n      >\n        <component :is=\"iconComponent\" />\n      </el-icon>\n      <div :class=\"ns.e('content')\">\n        <span\n          v-if=\"title || $slots.title\"\n          :class=\"[ns.e('title'), isBoldTitle]\"\n        >\n          <slot name=\"title\">{{ title }}</slot>\n        </span>\n        <p v-if=\"$slots.default || description\" :class=\"ns.e('description')\">\n          <slot>\n            {{ description }}\n          </slot>\n        </p>\n        <template v-if=\"closable\">\n          <div\n            v-if=\"closeText\"\n            :class=\"[ns.e('closebtn'), ns.is('customed')]\"\n            @click=\"close\"\n          >\n            {{ closeText }}\n          </div>\n          <el-icon v-else :class=\"ns.e('closebtn')\" @click=\"close\">\n            <close />\n          </el-icon>\n        </template>\n      </div>\n    </div>\n  </transition>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils/icon'\nimport { useNamespace } from '@element-plus/hooks'\nimport { alertProps, alertEmits } from './alert'\n\nexport default defineComponent({\n  name: 'ElAlert',\n\n  components: {\n    ElIcon,\n    ...TypeComponents,\n  },\n\n  props: alertProps,\n  emits: alertEmits,\n\n  setup(props, { emit, slots }) {\n    const ns = useNamespace('alert')\n\n    // state\n    const visible = ref(true)\n\n    // computed\n    const iconComponent = computed(\n      () => TypeComponentsMap[props.type] || TypeComponentsMap['info']\n    )\n    const isBigIcon = computed(() =>\n      props.description || slots.default ? ns.is('big') : ''\n    )\n    const isBoldTitle = computed(() =>\n      props.description || slots.default ? ns.is('bold') : ''\n    )\n\n    // methods\n    const close = (evt: MouseEvent) => {\n      visible.value = false\n      emit('close', evt)\n    }\n\n    return {\n      ns,\n      visible,\n      iconComponent,\n      isBigIcon,\n      isBoldTitle,\n      close,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;QAKM,IAAI;;2CAG6B;;;;;;;;;;;;uCAKlB,CAAC;;oCAEU;;;8CACX;;;;;;;;;;gBAI4B;;;;;;;;;8BAOtB;;;;;;;;qBAMA;;;;;;;;;"}

package/es/components/autocomplete/index.d.ts

@@ -75,31 +75,53 @@ declare const _Autocomplete: SFCWithInstall<import("vue").DefineComponent<{
     select: (item: any) => void;
     highlight: (index: number) => void;
     onSuggestionShow: () => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("input" | "select" | "update:modelValue" | "change" | "blur" | "focus" | "clear")[], "input" | "select" | "update:modelValue" | "change" | "blur" | "focus" | "clear", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    valueKey?: unknown;
-    modelValue?: unknown;
-    debounce?: unknown;
-    placement?: unknown;
-    fetchSuggestions?: unknown;
-    popperClass?: unknown;
-    triggerOnFocus?: unknown;
-    selectWhenUnmatched?: unknown;
-    hideLoading?: unknown;
-    popperAppendToBody?: unknown;
-    highlightFirstItem?: unknown;
-} & {
-    modelValue: string | number;
-    placement: import("@popperjs/core").Placement;
-    popperClass: string;
-    valueKey: string;
-    debounce: number;
-    fetchSuggestions: (queryString: string, cb: (data: any[]) => void) => void;
-    triggerOnFocus: boolean;
-    selectWhenUnmatched: boolean;
-    hideLoading: boolean;
-    popperAppendToBody: boolean;
-    highlightFirstItem: boolean;
-} & {}> & {
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("input" | "select" | "update:modelValue" | "change" | "blur" | "focus" | "clear")[], "input" | "select" | "update:modelValue" | "change" | "blur" | "focus" | "clear", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    valueKey: {
+        type: StringConstructor;
+        default: string;
+    };
+    modelValue: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    debounce: {
+        type: NumberConstructor;
+        default: number;
+    };
+    placement: {
+        type: import("vue").PropType<import("@popperjs/core").Placement>;
+        validator: (val: string) => boolean;
+        default: string;
+    };
+    fetchSuggestions: {
+        type: import("vue").PropType<(queryString: string, cb: (data: any[]) => void) => void>;
+        default: () => void;
+    };
+    popperClass: {
+        type: StringConstructor;
+        default: string;
+    };
+    triggerOnFocus: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    selectWhenUnmatched: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hideLoading: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    popperAppendToBody: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    highlightFirstItem: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & {
     onChange?: ((...args: any[]) => any) | undefined;
     onFocus?: ((...args: any[]) => any) | undefined;
     onBlur?: ((...args: any[]) => any) | undefined;
@@ -197,31 +219,53 @@ export declare const ElAutocomplete: SFCWithInstall<import("vue").DefineComponen
     select: (item: any) => void;
     highlight: (index: number) => void;
     onSuggestionShow: () => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("input" | "select" | "update:modelValue" | "change" | "blur" | "focus" | "clear")[], "input" | "select" | "update:modelValue" | "change" | "blur" | "focus" | "clear", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    valueKey?: unknown;
-    modelValue?: unknown;
-    debounce?: unknown;
-    placement?: unknown;
-    fetchSuggestions?: unknown;
-    popperClass?: unknown;
-    triggerOnFocus?: unknown;
-    selectWhenUnmatched?: unknown;
-    hideLoading?: unknown;
-    popperAppendToBody?: unknown;
-    highlightFirstItem?: unknown;
-} & {
-    modelValue: string | number;
-    placement: import("@popperjs/core").Placement;
-    popperClass: string;
-    valueKey: string;
-    debounce: number;
-    fetchSuggestions: (queryString: string, cb: (data: any[]) => void) => void;
-    triggerOnFocus: boolean;
-    selectWhenUnmatched: boolean;
-    hideLoading: boolean;
-    popperAppendToBody: boolean;
-    highlightFirstItem: boolean;
-} & {}> & {
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("input" | "select" | "update:modelValue" | "change" | "blur" | "focus" | "clear")[], "input" | "select" | "update:modelValue" | "change" | "blur" | "focus" | "clear", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    valueKey: {
+        type: StringConstructor;
+        default: string;
+    };
+    modelValue: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    debounce: {
+        type: NumberConstructor;
+        default: number;
+    };
+    placement: {
+        type: import("vue").PropType<import("@popperjs/core").Placement>;
+        validator: (val: string) => boolean;
+        default: string;
+    };
+    fetchSuggestions: {
+        type: import("vue").PropType<(queryString: string, cb: (data: any[]) => void) => void>;
+        default: () => void;
+    };
+    popperClass: {
+        type: StringConstructor;
+        default: string;
+    };
+    triggerOnFocus: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    selectWhenUnmatched: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hideLoading: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    popperAppendToBody: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    highlightFirstItem: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & {
     onChange?: ((...args: any[]) => any) | undefined;
     onFocus?: ((...args: any[]) => any) | undefined;
     onBlur?: ((...args: any[]) => any) | undefined;