@element-plus/nightly 0.0.20220121 → 0.0.20220125

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

@@ -1 +1 @@
-{"version":3,"file":"affix2.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}
+{"version":3,"file":"affix2.mjs","sources":["../../../../../../packages/components/affix/src/affix.vue"],"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":["_openBlock"],"mappings":";;;;;;;;AAuBA,MAAK,YAAa,gBAAa;AAAA,EAC7B,MAAM;AAAA,EAEN,OAAO;AAAA,EACP,OAAO;AAAA,EAEP,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,KAAK,aAAa;AAExB,UAAM,SAAS;AACf,UAAM,OAAO;AACb,UAAM,kBAAkB;AAExB,UAAM,QAAQ,SAAS;AAAA,MACrB,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,OAAO;AAAA,MACP,WAAW;AAAA,MACX,cAAc;AAAA,MACd,WAAW;AAAA;AAGb,UAAM,YAAY,SAAwB,MAAM;AAC9C,aAAO;AAAA,QACL,QAAQ,MAAM,QAAQ,GAAG,MAAM,aAAa;AAAA,QAC5C,OAAO,MAAM,QAAQ,GAAG,MAAM,YAAY;AAAA;AAAA;AAI9C,UAAM,aAAa,SAAoC,MAAM;AAC3D,UAAI,CAAC,MAAM;AAAO;AAElB,YAAM,SAAS,MAAM,SAAS,GAAG,MAAM,aAAa;AACpD,YAAM,YAAY,MAAM,YACpB,cAAc,MAAM,iBACpB;AAEJ,aAAO;AAAA,QACL,QAAQ,GAAG,MAAM;AAAA,QACjB,OAAO,GAAG,MAAM;AAAA,QAChB,KAAK,MAAM,aAAa,QAAQ,SAAS;AAAA,QACzC,QAAQ,MAAM,aAAa,WAAW,SAAS;AAAA,QAC/C;AAAA,QACA,QAAQ,MAAM;AAAA;AAAA;AAIlB,UAAM,SAAS,MAAM;AACnB,UAAI,CAAC,KAAK,SAAS,CAAC,OAAO,SAAS,CAAC,gBAAgB;AAAO;AAE5D,YAAM,WAAW,KAAK,MAAM;AAC5B,YAAM,aAAa,OAAO,MAAM;AAChC,YAAM,SAAS,SAAS;AACxB,YAAM,QAAQ,SAAS;AACvB,YAAM,YACJ,gBAAgB,iBAAiB,SAC7B,SAAS,gBAAgB,YACzB,gBAAgB,MAAM,aAAa;AACzC,YAAM,eAAe,SAAS,gBAAgB;AAE9C,UAAI,MAAM,aAAa,OAAO;AAC5B,YAAI,MAAM,QAAQ;AAChB,gBAAM,aAAa,WAAW,SAAS,MAAM,SAAS,MAAM;AAC5D,gBAAM,QAAQ,MAAM,SAAS,SAAS,OAAO,WAAW,SAAS;AACjE,gBAAM,YAAY,aAAa,IAAI,aAAa;AAAA,eAC3C;AACL,gBAAM,QAAQ,MAAM,SAAS,SAAS;AAAA;AAAA,aAEnC;AACL,YAAI,MAAM,QAAQ;AAChB,gBAAM,aACJ,MAAM,eAAe,WAAW,MAAM,MAAM,SAAS,MAAM;AAC7D,gBAAM,QACJ,MAAM,eAAe,MAAM,SAAS,SAAS,UAC7C,MAAM,eAAe,WAAW;AAClC,gBAAM,YAAY,aAAa,IAAI,CAAC,aAAa;AAAA,eAC5C;AACL,gBAAM,QAAQ,MAAM,eAAe,MAAM,SAAS,SAAS;AAAA;AAAA;AAAA;AAKjE,UAAM,WAAW,MAAM;AACrB;AAEA,WAAK,UAAU;AAAA,QACb,WAAW,MAAM;AAAA,QACjB,OAAO,MAAM;AAAA;AAAA;AAIjB,UACE,MAAM,MAAM,OACZ,MAAM;AACJ,WAAK,UAAU,MAAM;AAAA;AAIzB,cAAU,MAAM;AACd,UAAI;AACF,eAAO;AAEP,oBAAY;AACV,oBAAU;AAAsC;AAAA;AAGlD;AAAwB;AAE1B;AAAwD;AAG1D;AACA;AACA,sBAAkB;AAElB;AAAO;AACL,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;SA/IK;AAAM,SAAOA;AAAA,IAAW;AAAO;;AACtC;AAAW,4BAA4C;AAAU;;AAC/D;;;;;;;;;"}

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

@@ -20,7 +20,7 @@ export declare const ElAlert: import("../../utils/types").SFCWithInstall<import(
         is: (name: string, state?: boolean) => string;
     };
     visible: import("vue").Ref<boolean>;
-    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<{}>, {}>>;
+    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<import("vue").ExtractPropTypes<{}>>, {}>>;
     isBigIcon: import("vue").ComputedRef<string>;
     isBoldTitle: import("vue").ComputedRef<string>;
     close: (evt: MouseEvent) => void;

package/es/components/alert/index.mjs

@@ -1,9 +1,8 @@
 import { withInstall } from '../../utils/with-install.mjs';
-import './src/alert2.mjs';
+import Alert from './src/alert2.mjs';
 export { alertEffects, alertEmits, alertProps } from './src/alert.mjs';
-import script from './src/alert.vue_vue_type_script_lang.mjs';
 
-const ElAlert = withInstall(script);
+const ElAlert = withInstall(Alert);
 
 export { ElAlert, ElAlert as default };
 //# sourceMappingURL=index.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../../../packages/components/alert/index.ts"],"sourcesContent":["import { withInstall } from '@element-plus/utils/with-install'\n\nimport Alert from './src/alert.vue'\n\nexport const ElAlert = withInstall(Alert)\nexport default ElAlert\n\nexport * from './src/alert'\n"],"names":["Alert"],"mappings":";;;;;AAEY,MAAC,OAAO,GAAG,WAAW,CAACA,MAAK;;;;"}
+{"version":3,"file":"index.mjs","sources":["../../../../../packages/components/alert/index.ts"],"sourcesContent":["import { withInstall } from '@element-plus/utils/with-install'\n\nimport Alert from './src/alert.vue'\n\nexport const ElAlert = withInstall(Alert)\nexport default ElAlert\n\nexport * from './src/alert'\n"],"names":[],"mappings":";;;;AAEY,MAAC,OAAO,GAAG,WAAW,CAAC,KAAK;;;;"}

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

@@ -20,7 +20,7 @@ declare const _default: import("vue").DefineComponent<{
         is: (name: string, state?: boolean) => string;
     };
     visible: import("vue").Ref<boolean>;
-    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<{}>, {}>>;
+    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<import("vue").ExtractPropTypes<{}>>, {}>>;
     isBigIcon: import("vue").ComputedRef<string>;
     isBoldTitle: import("vue").ComputedRef<string>;
     close: (evt: MouseEvent) => void;

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

@@ -1,7 +1,101 @@
-import script from './alert.vue_vue_type_script_lang.mjs';
-export { default } from './alert.vue_vue_type_script_lang.mjs';
-import { render } from './alert.vue_vue_type_template_id_1755b449_lang.mjs';
+import { defineComponent, ref, computed, resolveComponent, openBlock, createBlock, Transition, withCtx, withDirectives, createElementVNode, normalizeClass, resolveDynamicComponent, createCommentVNode, createElementBlock, renderSlot, createTextVNode, toDisplayString, Fragment, createVNode, vShow } 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 _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
 
-script.render = render;
-script.__file = "packages/components/alert/src/alert.vue";
+const _sfc_main = defineComponent({
+  name: "ElAlert",
+  components: {
+    ElIcon,
+    ...TypeComponents
+  },
+  props: alertProps,
+  emits: alertEmits,
+  setup(props, { emit, slots }) {
+    const ns = useNamespace("alert");
+    const visible = ref(true);
+    const iconComponent = computed(() => TypeComponentsMap[props.type] || TypeComponentsMap["info"]);
+    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,
+      iconComponent,
+      isBigIcon,
+      isBoldTitle,
+      close
+    };
+  }
+});
+function _sfc_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([_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([_ctx.ns.e("icon"), _ctx.isBigIcon])
+        }, {
+          default: withCtx(() => [
+            (openBlock(), createBlock(resolveDynamicComponent(_ctx.iconComponent)))
+          ]),
+          _: 1
+        }, 8, ["class"])) : createCommentVNode("v-if", true),
+        createElementVNode("div", {
+          class: normalizeClass(_ctx.ns.e("content"))
+        }, [
+          _ctx.title || _ctx.$slots.title ? (openBlock(), createElementBlock("span", {
+            key: 0,
+            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", {
+            key: 1,
+            class: normalizeClass(_ctx.ns.e("description"))
+          }, [
+            renderSlot(_ctx.$slots, "default", {}, () => [
+              createTextVNode(toDisplayString(_ctx.description), 1)
+            ])
+          ], 2)) : createCommentVNode("v-if", true),
+          _ctx.closable ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
+            _ctx.closeText ? (openBlock(), createElementBlock("div", {
+              key: 0,
+              class: normalizeClass([_ctx.ns.e("closebtn"), _ctx.ns.is("customed")]),
+              onClick: _cache[0] || (_cache[0] = (...args) => _ctx.close && _ctx.close(...args))
+            }, toDisplayString(_ctx.closeText), 3)) : (openBlock(), createBlock(_component_el_icon, {
+              key: 1,
+              class: normalizeClass(_ctx.ns.e("closebtn")),
+              onClick: _ctx.close
+            }, {
+              default: withCtx(() => [
+                createVNode(_component_close)
+              ]),
+              _: 1
+            }, 8, ["class", "onClick"]))
+          ], 2112)) : createCommentVNode("v-if", true)
+        ], 2)
+      ], 2), [
+        [vShow, _ctx.visible]
+      ])
+    ]),
+    _: 3
+  });
+}
+var Alert = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+
+export { Alert as default };
 //# sourceMappingURL=alert2.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"alert2.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}
+{"version":3,"file":"alert2.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":["_createBlock","_createElementVNode","_normalizeClass","_createCommentVNode","_createElementBlock","_Fragment","_withCtx"],"mappings":";;;;;;;;AAgDA,MAAK,YAAa,gBAAa;AAAA,EAC7B,MAAM;AAAA,EAEN,YAAY;AAAA,IACV;AAAA,OACG;AAAA;AAAA,EAGL,OAAO;AAAA,EACP,OAAO;AAAA,EAEP,MAAM,OAAO,EAAE,MAAM,SAAS;AAC5B,UAAM,KAAK,aAAa;AAGxB,UAAM,UAAU,IAAI;AAGpB,UAAM,gBAAgB,SACpB,MAAM,kBAAkB,MAAM,SAAS,kBAAkB;AAE3D,UAAM,YAAY,SAAS,MACzB,MAAM,eAAe,MAAM,UAAU,GAAG,GAAG,SAAS;AAEtD,UAAM,cAAc,SAAS,MAC3B,MAAM,eAAe,MAAM,UAAU,GAAG,GAAG,UAAU;AAIvD,UAAM,QAAQ,CAAC,QAAoB;AACjC,cAAQ,QAAQ;AAChB,WAAK,SAAS;AAAA;AAGhB,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;sBAlDIA;AAAA,qBApCN;AAAA,qBAEQC,mBAAO,OAAI;AAAA,QACjB,OAAKC,eAAO;AAAA;SAGJ;AAAA,8BADR;UAEG,KAAK;AAAA;;2BAEN;AAAA;;;4BAEFC,mBAwBM;AAAA,2BAxBK,OAAE;AAAA;WAEH;AAAA,6BADR;YAEG,KAAK;AAAA;aAEN;AAAA,iDAAsB;AAAA;;mBAEfA,mBAAkB;AAAA,iCAA3B;YAAyC,KAAK;AAAA;aAC5C;AAAA,+CACK;AAAA;;mBAGSA,mBAAQ;AAAA,wCAEdC,mBAASC;AAAA;cACd,KAAK;AAAA,cACL,OAAKH,4CAAE;AAAA,iDAEI;AAAA,+BAEd,iBAEU;cAFO,KAAK;AAAA,cAAqB,OAAKA,eAAO;AAAA;;uBACrDI,QAAS;AAAA;;;;;;aA/BP;AAAA;;;;;;;;;;"}

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

@@ -75,6 +75,17 @@ declare const _Autocomplete: SFCWithInstall<import("vue").DefineComponent<{
     select: (item: any) => void;
     highlight: (index: number) => void;
     onSuggestionShow: () => void;
+    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;
+    };
 }, 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;
@@ -219,6 +230,17 @@ export declare const ElAutocomplete: SFCWithInstall<import("vue").DefineComponen
     select: (item: any) => void;
     highlight: (index: number) => void;
     onSuggestionShow: () => void;
+    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;
+    };
 }, 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;

package/es/components/autocomplete/index.mjs

@@ -1,10 +1,9 @@
-import './src/index.mjs';
-import script from './src/index.vue_vue_type_script_lang.mjs';
+import Autocomplete from './src/index.mjs';
 
-script.install = (app) => {
-  app.component(script.name, script);
+Autocomplete.install = (app) => {
+  app.component(Autocomplete.name, Autocomplete);
 };
-const _Autocomplete = script;
+const _Autocomplete = Autocomplete;
 const ElAutocomplete = _Autocomplete;
 
 export { ElAutocomplete, _Autocomplete as default };

package/es/components/autocomplete/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../../../packages/components/autocomplete/index.ts"],"sourcesContent":["import Autocomplete from './src/index.vue'\nimport type { App } from 'vue'\nimport type { SFCWithInstall } from '@element-plus/utils/types'\n\nAutocomplete.install = (app: App): void => {\n  app.component(Autocomplete.name, Autocomplete)\n}\n\nconst _Autocomplete = Autocomplete as SFCWithInstall<typeof Autocomplete>\n\nexport default _Autocomplete\nexport const ElAutocomplete = _Autocomplete\n"],"names":["Autocomplete"],"mappings":";;;AACAA,MAAY,CAAC,OAAO,GAAG,CAAC,GAAG,KAAK;AAChC,EAAE,GAAG,CAAC,SAAS,CAACA,MAAY,CAAC,IAAI,EAAEA,MAAY,CAAC,CAAC;AACjD,CAAC,CAAC;AACG,MAAC,aAAa,GAAGA,OAAa;AAEvB,MAAC,cAAc,GAAG;;;;"}
+{"version":3,"file":"index.mjs","sources":["../../../../../packages/components/autocomplete/index.ts"],"sourcesContent":["import Autocomplete from './src/index.vue'\nimport type { App } from 'vue'\nimport type { SFCWithInstall } from '@element-plus/utils/types'\n\nAutocomplete.install = (app: App): void => {\n  app.component(Autocomplete.name, Autocomplete)\n}\n\nconst _Autocomplete = Autocomplete as SFCWithInstall<typeof Autocomplete>\n\nexport default _Autocomplete\nexport const ElAutocomplete = _Autocomplete\n"],"names":[],"mappings":";;AACA,YAAY,CAAC,OAAO,GAAG,CAAC,GAAG,KAAK;AAChC,EAAE,GAAG,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC;AACjD,CAAC,CAAC;AACG,MAAC,aAAa,GAAG,aAAa;AAEvB,MAAC,cAAc,GAAG;;;;"}

package/es/components/autocomplete/src/index.mjs

@@ -1,7 +1,388 @@
-import script from './index.vue_vue_type_script_lang.mjs';
-export { default } from './index.vue_vue_type_script_lang.mjs';
-import { render } from './index.vue_vue_type_template_id_2f09f285_lang.mjs';
+import { defineComponent, ref, computed, nextTick, onMounted, resolveComponent, resolveDirective, openBlock, createBlock, withCtx, createElementVNode, normalizeClass, normalizeStyle, createVNode, createElementBlock, Fragment, renderList, renderSlot, createTextVNode, toDisplayString, withDirectives, mergeProps, withKeys, withModifiers, createSlots } from 'vue';
+import { NOOP, isArray } from '@vue/shared';
+import debounce from 'lodash/debounce';
+import '../../../hooks/index.mjs';
+import '../../../directives/index.mjs';
+import { generateId } from '../../../utils/util.mjs';
+import { UPDATE_MODEL_EVENT } from '../../../utils/constants.mjs';
+import { throwError } from '../../../utils/error.mjs';
+import { ElInput } from '../../input/index.mjs';
+import { ElScrollbar } from '../../scrollbar/index.mjs';
+import { ElTooltip } from '../../tooltip/index.mjs';
+import { ElIcon } from '../../icon/index.mjs';
+import { Loading } from '@element-plus/icons-vue';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import ClickOutside from '../../../directives/click-outside/index.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
+import { useAttrs } from '../../../hooks/use-attrs/index.mjs';
 
-script.render = render;
-script.__file = "packages/components/autocomplete/src/index.vue";
+const _sfc_main = defineComponent({
+  name: "ElAutocomplete",
+  components: {
+    ElTooltip,
+    ElInput,
+    ElScrollbar,
+    ElIcon,
+    Loading
+  },
+  directives: {
+    clickoutside: ClickOutside
+  },
+  inheritAttrs: false,
+  props: {
+    valueKey: {
+      type: String,
+      default: "value"
+    },
+    modelValue: {
+      type: [String, Number],
+      default: ""
+    },
+    debounce: {
+      type: Number,
+      default: 300
+    },
+    placement: {
+      type: String,
+      validator: (val) => {
+        return [
+          "top",
+          "top-start",
+          "top-end",
+          "bottom",
+          "bottom-start",
+          "bottom-end"
+        ].includes(val);
+      },
+      default: "bottom-start"
+    },
+    fetchSuggestions: {
+      type: Function,
+      default: NOOP
+    },
+    popperClass: {
+      type: String,
+      default: ""
+    },
+    triggerOnFocus: {
+      type: Boolean,
+      default: true
+    },
+    selectWhenUnmatched: {
+      type: Boolean,
+      default: false
+    },
+    hideLoading: {
+      type: Boolean,
+      default: false
+    },
+    popperAppendToBody: {
+      type: Boolean,
+      default: true
+    },
+    highlightFirstItem: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: [
+    UPDATE_MODEL_EVENT,
+    "input",
+    "change",
+    "focus",
+    "blur",
+    "clear",
+    "select"
+  ],
+  setup(props, ctx) {
+    const ns = useNamespace("autocomplete");
+    const attrs = useAttrs();
+    const suggestions = ref([]);
+    const highlightedIndex = ref(-1);
+    const dropdownWidth = ref("");
+    const activated = ref(false);
+    const suggestionDisabled = ref(false);
+    const loading = ref(false);
+    const inputRef = ref(null);
+    const regionRef = ref(null);
+    const popper = ref(null);
+    const id = computed(() => {
+      return ns.b(String(generateId()));
+    });
+    const suggestionVisible = computed(() => {
+      const isValidData = isArray(suggestions.value) && suggestions.value.length > 0;
+      return (isValidData || loading.value) && activated.value;
+    });
+    const suggestionLoading = computed(() => {
+      return !props.hideLoading && loading.value;
+    });
+    const onSuggestionShow = () => {
+      nextTick(() => {
+        if (suggestionVisible.value) {
+          dropdownWidth.value = `${inputRef.value.$el.offsetWidth}px`;
+        }
+      });
+    };
+    onMounted(() => {
+      inputRef.value.inputOrTextarea.setAttribute("role", "textbox");
+      inputRef.value.inputOrTextarea.setAttribute("aria-autocomplete", "list");
+      inputRef.value.inputOrTextarea.setAttribute("aria-controls", "id");
+      inputRef.value.inputOrTextarea.setAttribute("aria-activedescendant", `${id.value}-item-${highlightedIndex.value}`);
+    });
+    const getData = (queryString) => {
+      if (suggestionDisabled.value) {
+        return;
+      }
+      loading.value = true;
+      props.fetchSuggestions(queryString, (suggestionsArg) => {
+        loading.value = false;
+        if (suggestionDisabled.value) {
+          return;
+        }
+        if (isArray(suggestionsArg)) {
+          suggestions.value = suggestionsArg;
+          highlightedIndex.value = props.highlightFirstItem ? 0 : -1;
+        } else {
+          throwError("ElAutocomplete", "autocomplete suggestions must be an array");
+        }
+      });
+    };
+    const debouncedGetData = debounce(getData, props.debounce);
+    const handleInput = (value) => {
+      ctx.emit("input", value);
+      ctx.emit(UPDATE_MODEL_EVENT, value);
+      suggestionDisabled.value = false;
+      if (!props.triggerOnFocus && !value) {
+        suggestionDisabled.value = true;
+        suggestions.value = [];
+        return;
+      }
+      debouncedGetData(value);
+    };
+    const handleChange = (value) => {
+      ctx.emit("change", value);
+    };
+    const handleFocus = (e) => {
+      activated.value = true;
+      ctx.emit("focus", e);
+      if (props.triggerOnFocus) {
+        debouncedGetData(String(props.modelValue));
+      }
+    };
+    const handleBlur = (e) => {
+      ctx.emit("blur", e);
+    };
+    const handleClear = () => {
+      activated.value = false;
+      ctx.emit(UPDATE_MODEL_EVENT, "");
+      ctx.emit("clear");
+    };
+    const handleKeyEnter = () => {
+      if (suggestionVisible.value && highlightedIndex.value >= 0 && highlightedIndex.value < suggestions.value.length) {
+        select(suggestions.value[highlightedIndex.value]);
+      } else if (props.selectWhenUnmatched) {
+        ctx.emit("select", { value: props.modelValue });
+        nextTick(() => {
+          suggestions.value = [];
+          highlightedIndex.value = -1;
+        });
+      }
+    };
+    const close = () => {
+      activated.value = false;
+    };
+    const focus = () => {
+      var _a;
+      (_a = inputRef.value) == null ? void 0 : _a.focus();
+    };
+    const select = (item) => {
+      ctx.emit("input", item[props.valueKey]);
+      ctx.emit(UPDATE_MODEL_EVENT, item[props.valueKey]);
+      ctx.emit("select", item);
+      nextTick(() => {
+        suggestions.value = [];
+        highlightedIndex.value = -1;
+      });
+    };
+    const highlight = (index) => {
+      if (!suggestionVisible.value || loading.value) {
+        return;
+      }
+      if (index < 0) {
+        highlightedIndex.value = -1;
+        return;
+      }
+      if (index >= suggestions.value.length) {
+        index = suggestions.value.length - 1;
+      }
+      const suggestion = regionRef.value.querySelector(`.${ns.be("suggestion", "wrap")}`);
+      const suggestionList = suggestion.querySelectorAll(`.${ns.be("suggestion", "list")} li`);
+      const highlightItem = suggestionList[index];
+      const scrollTop = suggestion.scrollTop;
+      const { offsetTop, scrollHeight } = highlightItem;
+      if (offsetTop + scrollHeight > scrollTop + suggestion.clientHeight) {
+        suggestion.scrollTop += scrollHeight;
+      }
+      if (offsetTop < scrollTop) {
+        suggestion.scrollTop -= scrollHeight;
+      }
+      highlightedIndex.value = index;
+      inputRef.value.inputOrTextarea.setAttribute("aria-activedescendant", `${id.value}-item-${highlightedIndex.value}`);
+    };
+    return {
+      attrs,
+      suggestions,
+      highlightedIndex,
+      dropdownWidth,
+      activated,
+      suggestionDisabled,
+      loading,
+      inputRef,
+      regionRef,
+      popper,
+      id,
+      suggestionVisible,
+      suggestionLoading,
+      getData,
+      handleInput,
+      handleChange,
+      handleFocus,
+      handleBlur,
+      handleClear,
+      handleKeyEnter,
+      close,
+      focus,
+      select,
+      highlight,
+      onSuggestionShow,
+      ns
+    };
+  }
+});
+const _hoisted_1 = ["aria-expanded", "aria-owns"];
+const _hoisted_2 = { key: 0 };
+const _hoisted_3 = ["id", "aria-selected", "onClick"];
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_el_input = resolveComponent("el-input");
+  const _component_loading = resolveComponent("loading");
+  const _component_el_icon = resolveComponent("el-icon");
+  const _component_el_scrollbar = resolveComponent("el-scrollbar");
+  const _component_el_tooltip = resolveComponent("el-tooltip");
+  const _directive_clickoutside = resolveDirective("clickoutside");
+  return openBlock(), createBlock(_component_el_tooltip, {
+    ref: "popper",
+    visible: _ctx.suggestionVisible,
+    "onUpdate:visible": _cache[2] || (_cache[2] = ($event) => _ctx.suggestionVisible = $event),
+    placement: _ctx.placement,
+    "fallback-placements": ["bottom-start", "top-start"],
+    "popper-class": `${_ctx.ns.e("popper")} ${_ctx.popperClass}`,
+    "append-to-body": _ctx.popperAppendToBody,
+    "gpu-acceleration": false,
+    pure: "",
+    "manual-mode": "",
+    effect: "light",
+    trigger: "click",
+    transition: `${_ctx.ns.namespace.value}-zoom-in-top`,
+    persistent: "",
+    onShow: _ctx.onSuggestionShow
+  }, {
+    content: withCtx(() => [
+      createElementVNode("div", {
+        ref: "regionRef",
+        class: normalizeClass([_ctx.ns.b("suggestion"), _ctx.ns.is("loading", _ctx.suggestionLoading)]),
+        style: normalizeStyle({ minWidth: _ctx.dropdownWidth, outline: "none" }),
+        role: "region"
+      }, [
+        createVNode(_component_el_scrollbar, {
+          id: _ctx.id,
+          tag: "ul",
+          "wrap-class": _ctx.ns.be("suggestion", "wrap"),
+          "view-class": _ctx.ns.be("suggestion", "list"),
+          role: "listbox"
+        }, {
+          default: withCtx(() => [
+            _ctx.suggestionLoading ? (openBlock(), createElementBlock("li", _hoisted_2, [
+              createVNode(_component_el_icon, { class: "is-loading" }, {
+                default: withCtx(() => [
+                  createVNode(_component_loading)
+                ]),
+                _: 1
+              })
+            ])) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(_ctx.suggestions, (item, index) => {
+              return openBlock(), createElementBlock("li", {
+                id: `${_ctx.id}-item-${index}`,
+                key: index,
+                class: normalizeClass({ highlighted: _ctx.highlightedIndex === index }),
+                role: "option",
+                "aria-selected": _ctx.highlightedIndex === index,
+                onClick: ($event) => _ctx.select(item)
+              }, [
+                renderSlot(_ctx.$slots, "default", { item }, () => [
+                  createTextVNode(toDisplayString(item[_ctx.valueKey]), 1)
+                ])
+              ], 10, _hoisted_3);
+            }), 128))
+          ]),
+          _: 3
+        }, 8, ["id", "wrap-class", "view-class"])
+      ], 6)
+    ]),
+    default: withCtx(() => [
+      withDirectives((openBlock(), createElementBlock("div", {
+        class: normalizeClass([_ctx.ns.b(), _ctx.$attrs.class]),
+        style: normalizeStyle(_ctx.$attrs.style),
+        role: "combobox",
+        "aria-haspopup": "listbox",
+        "aria-expanded": _ctx.suggestionVisible,
+        "aria-owns": _ctx.id
+      }, [
+        createVNode(_component_el_input, mergeProps({ ref: "inputRef" }, _ctx.attrs, {
+          "model-value": _ctx.modelValue,
+          onInput: _ctx.handleInput,
+          onChange: _ctx.handleChange,
+          onFocus: _ctx.handleFocus,
+          onBlur: _ctx.handleBlur,
+          onClear: _ctx.handleClear,
+          onKeydown: [
+            _cache[0] || (_cache[0] = withKeys(withModifiers(($event) => _ctx.highlight(_ctx.highlightedIndex - 1), ["prevent"]), ["up"])),
+            _cache[1] || (_cache[1] = withKeys(withModifiers(($event) => _ctx.highlight(_ctx.highlightedIndex + 1), ["prevent"]), ["down"])),
+            withKeys(_ctx.handleKeyEnter, ["enter"]),
+            withKeys(_ctx.close, ["tab"])
+          ]
+        }), createSlots({ _: 2 }, [
+          _ctx.$slots.prepend ? {
+            name: "prepend",
+            fn: withCtx(() => [
+              renderSlot(_ctx.$slots, "prepend")
+            ])
+          } : void 0,
+          _ctx.$slots.append ? {
+            name: "append",
+            fn: withCtx(() => [
+              renderSlot(_ctx.$slots, "append")
+            ])
+          } : void 0,
+          _ctx.$slots.prefix ? {
+            name: "prefix",
+            fn: withCtx(() => [
+              renderSlot(_ctx.$slots, "prefix")
+            ])
+          } : void 0,
+          _ctx.$slots.suffix ? {
+            name: "suffix",
+            fn: withCtx(() => [
+              renderSlot(_ctx.$slots, "suffix")
+            ])
+          } : void 0
+        ]), 1040, ["model-value", "onInput", "onChange", "onFocus", "onBlur", "onClear", "onKeydown"])
+      ], 14, _hoisted_1)), [
+        [_directive_clickoutside, _ctx.close]
+      ])
+    ]),
+    _: 3
+  }, 8, ["visible", "placement", "popper-class", "append-to-body", "transition", "onShow"]);
+}
+var Autocomplete = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+
+export { Autocomplete as default };
 //# sourceMappingURL=index.mjs.map