@element-plus/nightly 0.0.20250424 → 0.0.20250426

package/lib/components/alert/src/alert2.js

@@ -2,46 +2,99 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var vue = require('vue');
+var index$1 = require('../../icon/index.js');
+var alert = require('./alert.js');
+var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
 var icon = require('../../../utils/vue/icon.js');
-var runtime = require('../../../utils/vue/props/runtime.js');
-var objects = require('../../../utils/objects.js');
+var index = require('../../../hooks/use-namespace/index.js');
 
-const alertEffects = ["light", "dark"];
-const alertProps = runtime.buildProps({
-  title: {
-    type: String,
-    default: ""
-  },
-  description: {
-    type: String,
-    default: ""
-  },
-  type: {
-    type: String,
-    values: objects.keysOf(icon.TypeComponentsMap),
-    default: "info"
-  },
-  closable: {
-    type: Boolean,
-    default: true
-  },
-  closeText: {
-    type: String,
-    default: ""
-  },
-  showIcon: Boolean,
-  center: Boolean,
-  effect: {
-    type: String,
-    values: alertEffects,
-    default: "light"
+const __default__ = vue.defineComponent({
+  name: "ElAlert"
+});
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...__default__,
+  props: alert.alertProps,
+  emits: alert.alertEmits,
+  setup(__props, { emit }) {
+    const props = __props;
+    const { Close } = icon.TypeComponents;
+    const slots = vue.useSlots();
+    const ns = index.useNamespace("alert");
+    const visible = vue.ref(true);
+    const iconComponent = vue.computed(() => icon.TypeComponentsMap[props.type]);
+    const hasDesc = vue.computed(() => !!(props.description || slots.default));
+    const close = (evt) => {
+      visible.value = false;
+      emit("close", evt);
+    };
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createBlock(vue.Transition, {
+        name: vue.unref(ns).b("fade"),
+        persisted: ""
+      }, {
+        default: vue.withCtx(() => [
+          vue.withDirectives(vue.createElementVNode("div", {
+            class: vue.normalizeClass([vue.unref(ns).b(), vue.unref(ns).m(_ctx.type), vue.unref(ns).is("center", _ctx.center), vue.unref(ns).is(_ctx.effect)]),
+            role: "alert"
+          }, [
+            _ctx.showIcon && (_ctx.$slots.icon || vue.unref(iconComponent)) ? (vue.openBlock(), vue.createBlock(vue.unref(index$1.ElIcon), {
+              key: 0,
+              class: vue.normalizeClass([vue.unref(ns).e("icon"), { [vue.unref(ns).is("big")]: vue.unref(hasDesc) }])
+            }, {
+              default: vue.withCtx(() => [
+                vue.renderSlot(_ctx.$slots, "icon", {}, () => [
+                  (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(iconComponent))))
+                ])
+              ]),
+              _: 3
+            }, 8, ["class"])) : vue.createCommentVNode("v-if", true),
+            vue.createElementVNode("div", {
+              class: vue.normalizeClass(vue.unref(ns).e("content"))
+            }, [
+              _ctx.title || _ctx.$slots.title ? (vue.openBlock(), vue.createElementBlock("span", {
+                key: 0,
+                class: vue.normalizeClass([vue.unref(ns).e("title"), { "with-description": vue.unref(hasDesc) }])
+              }, [
+                vue.renderSlot(_ctx.$slots, "title", {}, () => [
+                  vue.createTextVNode(vue.toDisplayString(_ctx.title), 1)
+                ])
+              ], 2)) : vue.createCommentVNode("v-if", true),
+              vue.unref(hasDesc) ? (vue.openBlock(), vue.createElementBlock("p", {
+                key: 1,
+                class: vue.normalizeClass(vue.unref(ns).e("description"))
+              }, [
+                vue.renderSlot(_ctx.$slots, "default", {}, () => [
+                  vue.createTextVNode(vue.toDisplayString(_ctx.description), 1)
+                ])
+              ], 2)) : vue.createCommentVNode("v-if", true),
+              _ctx.closable ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 2 }, [
+                _ctx.closeText ? (vue.openBlock(), vue.createElementBlock("div", {
+                  key: 0,
+                  class: vue.normalizeClass([vue.unref(ns).e("close-btn"), vue.unref(ns).is("customed")]),
+                  onClick: close
+                }, vue.toDisplayString(_ctx.closeText), 3)) : (vue.openBlock(), vue.createBlock(vue.unref(index$1.ElIcon), {
+                  key: 1,
+                  class: vue.normalizeClass(vue.unref(ns).e("close-btn")),
+                  onClick: close
+                }, {
+                  default: vue.withCtx(() => [
+                    vue.createVNode(vue.unref(Close))
+                  ]),
+                  _: 1
+                }, 8, ["class"]))
+              ], 64)) : vue.createCommentVNode("v-if", true)
+            ], 2)
+          ], 2), [
+            [vue.vShow, visible.value]
+          ])
+        ]),
+        _: 3
+      }, 8, ["name"]);
+    };
   }
 });
-const alertEmits = {
-  close: (evt) => evt instanceof MouseEvent
-};
+var Alert = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "alert.vue"]]);
 
-exports.alertEffects = alertEffects;
-exports.alertEmits = alertEmits;
-exports.alertProps = alertProps;
+exports["default"] = Alert;
 //# sourceMappingURL=alert2.js.map

package/lib/components/alert/src/alert2.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert2.js","sources":["../../../../../../packages/components/alert/src/alert.ts"],"sourcesContent":["import { TypeComponentsMap, buildProps, keysOf } from '@element-plus/utils'\nimport type { ExtractPropTypes } from 'vue'\n\nexport const alertEffects = ['light', 'dark'] as const\n\nexport const alertProps = buildProps({\n  /**\n   * @description alert title.\n   */\n  title: {\n    type: String,\n    default: '',\n  },\n  description: {\n    type: String,\n    default: '',\n  },\n  /**\n   * @description alert type.\n   */\n  type: {\n    type: String,\n    values: keysOf(TypeComponentsMap),\n    default: 'info',\n  },\n  /**\n   * @description whether alert can be dismissed.\n   */\n  closable: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description text for replacing x button\n   */\n  closeText: {\n    type: String,\n    default: '',\n  },\n  /**\n   * @description whether show icon\n   */\n  showIcon: Boolean,\n  /**\n   * @description should content be placed in center.\n   */\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"],"names":["buildProps","keysOf","TypeComponentsMap"],"mappings":";;;;;;;;AACY,MAAC,YAAY,GAAG,CAAC,OAAO,EAAE,MAAM,EAAE;AAClC,MAAC,UAAU,GAAGA,kBAAU,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,EAAEC,cAAM,CAACC,sBAAiB,CAAC;AACrC,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;;;;;;"}
+{"version":3,"file":"alert2.js","sources":["../../../../../../packages/components/alert/src/alert.vue"],"sourcesContent":["<template>\n  <transition :name=\"ns.b('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 && ($slots.icon || iconComponent)\"\n        :class=\"[ns.e('icon'), { [ns.is('big')]: hasDesc }]\"\n      >\n        <slot name=\"icon\">\n          <component :is=\"iconComponent\" />\n        </slot>\n      </el-icon>\n\n      <div :class=\"ns.e('content')\">\n        <span\n          v-if=\"title || $slots.title\"\n          :class=\"[ns.e('title'), { 'with-description': hasDesc }]\"\n        >\n          <slot name=\"title\">{{ title }}</slot>\n        </span>\n        <p v-if=\"hasDesc\" :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('close-btn'), ns.is('customed')]\"\n            @click=\"close\"\n          >\n            {{ closeText }}\n          </div>\n          <el-icon v-else :class=\"ns.e('close-btn')\" @click=\"close\">\n            <Close />\n          </el-icon>\n        </template>\n      </div>\n    </div>\n  </transition>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, ref, useSlots } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { alertEmits, alertProps } from './alert'\n\nconst { Close } = TypeComponents\n\ndefineOptions({\n  name: 'ElAlert',\n})\n\nconst props = defineProps(alertProps)\nconst emit = defineEmits(alertEmits)\nconst slots = useSlots()\n\nconst ns = useNamespace('alert')\n\nconst visible = ref(true)\n\nconst iconComponent = computed(() => TypeComponentsMap[props.type])\n\nconst hasDesc = computed(() => !!(props.description || slots.default))\n\nconst close = (evt: MouseEvent) => {\n  visible.value = false\n  emit('close', evt)\n}\n</script>\n"],"names":["TypeComponents","useSlots","useNamespace","ref","computed","TypeComponentsMap"],"mappings":";;;;;;;;;;;uCAsDc,CAAA;AAAA,EACZ,IAAM,EAAA,SAAA;AACR,CAAA,CAAA,CAAA;;;;;;;AAJA,IAAM,MAAA,EAAE,OAAU,GAAAA,mBAAA,CAAA;AAQlB,IAAA,MAAM,QAAQC,YAAS,EAAA,CAAA;AAEvB,IAAM,MAAA,EAAA,GAAKC,mBAAa,OAAO,CAAA,CAAA;AAE/B,IAAM,MAAA,OAAA,GAAUC,QAAI,IAAI,CAAA,CAAA;AAExB,IAAA,MAAM,gBAAgBC,YAAS,CAAA,MAAMC,sBAAkB,CAAA,KAAA,CAAM,IAAI,CAAC,CAAA,CAAA;AAElE,IAAM,MAAA,OAAA,GAAUD,aAAS,MAAM,CAAC,EAAE,KAAM,CAAA,WAAA,IAAe,MAAM,OAAQ,CAAA,CAAA,CAAA;AAErE,IAAM,MAAA,KAAA,GAAQ,CAAC,GAAoB,KAAA;AACjC,MAAA,OAAA,CAAQ,KAAQ,GAAA,KAAA,CAAA;AAChB,MAAA,IAAA,CAAK,SAAS,GAAG,CAAA,CAAA;AAAA,KACnB,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/components/autocomplete/index.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var autocomplete$1 = require('./src/autocomplete2.js');
-var autocomplete = require('./src/autocomplete.js');
+var autocomplete$1 = require('./src/autocomplete.js');
+var autocomplete = require('./src/autocomplete2.js');
 var install = require('../../utils/vue/install.js');
 
 const ElAutocomplete = install.withInstall(autocomplete$1["default"]);

package/lib/components/autocomplete/src/autocomplete.js

@@ -2,88 +2,377 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var content = require('../../tooltip/src/content2.js');
-var runtime = require('../../../utils/vue/props/runtime.js');
+var vue = require('vue');
+var lodashUnified = require('lodash-unified');
+var core = require('@vueuse/core');
+var iconsVue = require('@element-plus/icons-vue');
+var index$6 = require('../../input/index.js');
+var index$4 = require('../../scrollbar/index.js');
+var index$3 = require('../../tooltip/index.js');
+var index$5 = require('../../icon/index.js');
+var autocomplete = require('./autocomplete2.js');
+var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
+var index = require('../../../hooks/use-attrs/index.js');
+var useFormCommonProps = require('../../form/src/hooks/use-form-common-props.js');
+var index$1 = require('../../../hooks/use-namespace/index.js');
+var index$2 = require('../../../hooks/use-id/index.js');
 var shared = require('@vue/shared');
-var index = require('../../../hooks/use-aria/index.js');
 var event = require('../../../constants/event.js');
+var error = require('../../../utils/error.js');
 
-const autocompleteProps = runtime.buildProps({
-  valueKey: {
-    type: String,
-    default: "value"
-  },
-  modelValue: {
-    type: [String, Number],
-    default: ""
-  },
-  debounce: {
-    type: Number,
-    default: 300
-  },
-  placement: {
-    type: runtime.definePropType(String),
-    values: [
-      "top",
-      "top-start",
-      "top-end",
-      "bottom",
-      "bottom-start",
-      "bottom-end"
-    ],
-    default: "bottom-start"
-  },
-  fetchSuggestions: {
-    type: runtime.definePropType([Function, Array]),
-    default: shared.NOOP
-  },
-  popperClass: {
-    type: String,
-    default: ""
-  },
-  triggerOnFocus: {
-    type: Boolean,
-    default: true
-  },
-  selectWhenUnmatched: {
-    type: Boolean,
-    default: false
-  },
-  hideLoading: {
-    type: Boolean,
-    default: false
-  },
-  teleported: content.useTooltipContentProps.teleported,
-  appendTo: content.useTooltipContentProps.appendTo,
-  highlightFirstItem: {
-    type: Boolean,
-    default: false
-  },
-  fitInputWidth: {
-    type: Boolean,
-    default: false
-  },
-  clearable: {
-    type: Boolean,
-    default: false
-  },
-  disabled: {
-    type: Boolean,
-    default: false
-  },
-  name: String,
-  ...index.useAriaProps(["ariaLabel"])
+const COMPONENT_NAME = "ElAutocomplete";
+const __default__ = vue.defineComponent({
+  name: COMPONENT_NAME,
+  inheritAttrs: false
 });
-const autocompleteEmits = {
-  [event.UPDATE_MODEL_EVENT]: (value) => shared.isString(value),
-  [event.INPUT_EVENT]: (value) => shared.isString(value),
-  [event.CHANGE_EVENT]: (value) => shared.isString(value),
-  focus: (evt) => evt instanceof FocusEvent,
-  blur: (evt) => evt instanceof FocusEvent,
-  clear: () => true,
-  select: (item) => shared.isObject(item)
-};
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...__default__,
+  props: autocomplete.autocompleteProps,
+  emits: autocomplete.autocompleteEmits,
+  setup(__props, { expose, emit }) {
+    const props = __props;
+    const attrs = index.useAttrs();
+    const rawAttrs = vue.useAttrs();
+    const disabled = useFormCommonProps.useFormDisabled();
+    const ns = index$1.useNamespace("autocomplete");
+    const inputRef = vue.ref();
+    const regionRef = vue.ref();
+    const popperRef = vue.ref();
+    const listboxRef = vue.ref();
+    let readonly = false;
+    let ignoreFocusEvent = false;
+    const suggestions = vue.ref([]);
+    const highlightedIndex = vue.ref(-1);
+    const dropdownWidth = vue.ref("");
+    const activated = vue.ref(false);
+    const suggestionDisabled = vue.ref(false);
+    const loading = vue.ref(false);
+    const listboxId = index$2.useId();
+    const styles = vue.computed(() => rawAttrs.style);
+    const suggestionVisible = vue.computed(() => {
+      const isValidData = suggestions.value.length > 0;
+      return (isValidData || loading.value) && activated.value;
+    });
+    const suggestionLoading = vue.computed(() => !props.hideLoading && loading.value);
+    const refInput = vue.computed(() => {
+      if (inputRef.value) {
+        return Array.from(inputRef.value.$el.querySelectorAll("input"));
+      }
+      return [];
+    });
+    const onSuggestionShow = () => {
+      if (suggestionVisible.value) {
+        dropdownWidth.value = `${inputRef.value.$el.offsetWidth}px`;
+      }
+    };
+    const onHide = () => {
+      highlightedIndex.value = -1;
+    };
+    const getData = async (queryString) => {
+      if (suggestionDisabled.value)
+        return;
+      const cb = (suggestionList) => {
+        loading.value = false;
+        if (suggestionDisabled.value)
+          return;
+        if (shared.isArray(suggestionList)) {
+          suggestions.value = suggestionList;
+          highlightedIndex.value = props.highlightFirstItem ? 0 : -1;
+        } else {
+          error.throwError(COMPONENT_NAME, "autocomplete suggestions must be an array");
+        }
+      };
+      loading.value = true;
+      if (shared.isArray(props.fetchSuggestions)) {
+        cb(props.fetchSuggestions);
+      } else {
+        const result = await props.fetchSuggestions(queryString, cb);
+        if (shared.isArray(result))
+          cb(result);
+      }
+    };
+    const debouncedGetData = lodashUnified.debounce(getData, props.debounce);
+    const handleInput = (value) => {
+      const valuePresented = !!value;
+      emit(event.INPUT_EVENT, value);
+      emit(event.UPDATE_MODEL_EVENT, value);
+      suggestionDisabled.value = false;
+      activated.value || (activated.value = valuePresented);
+      if (!props.triggerOnFocus && !value) {
+        suggestionDisabled.value = true;
+        suggestions.value = [];
+        return;
+      }
+      debouncedGetData(value);
+    };
+    const handleMouseDown = (event) => {
+      var _a;
+      if (disabled.value)
+        return;
+      if (((_a = event.target) == null ? void 0 : _a.tagName) !== "INPUT" || refInput.value.includes(document.activeElement)) {
+        activated.value = true;
+      }
+    };
+    const handleChange = (value) => {
+      emit(event.CHANGE_EVENT, value);
+    };
+    const handleFocus = (evt) => {
+      var _a;
+      if (!ignoreFocusEvent) {
+        activated.value = true;
+        emit("focus", evt);
+        const queryString = (_a = props.modelValue) != null ? _a : "";
+        if (props.triggerOnFocus && !readonly) {
+          debouncedGetData(String(queryString));
+        }
+      } else {
+        ignoreFocusEvent = false;
+      }
+    };
+    const handleBlur = (evt) => {
+      setTimeout(() => {
+        var _a;
+        if ((_a = popperRef.value) == null ? void 0 : _a.isFocusInsideContent()) {
+          ignoreFocusEvent = true;
+          return;
+        }
+        activated.value && close();
+        emit("blur", evt);
+      });
+    };
+    const handleClear = () => {
+      activated.value = false;
+      emit(event.UPDATE_MODEL_EVENT, "");
+      emit("clear");
+    };
+    const handleKeyEnter = async () => {
+      if (suggestionVisible.value && highlightedIndex.value >= 0 && highlightedIndex.value < suggestions.value.length) {
+        handleSelect(suggestions.value[highlightedIndex.value]);
+      } else if (props.selectWhenUnmatched) {
+        emit("select", { value: props.modelValue });
+        suggestions.value = [];
+        highlightedIndex.value = -1;
+      }
+    };
+    const handleKeyEscape = (evt) => {
+      if (suggestionVisible.value) {
+        evt.preventDefault();
+        evt.stopPropagation();
+        close();
+      }
+    };
+    const close = () => {
+      activated.value = false;
+    };
+    const focus = () => {
+      var _a;
+      (_a = inputRef.value) == null ? void 0 : _a.focus();
+    };
+    const blur = () => {
+      var _a;
+      (_a = inputRef.value) == null ? void 0 : _a.blur();
+    };
+    const handleSelect = async (item) => {
+      emit(event.INPUT_EVENT, item[props.valueKey]);
+      emit(event.UPDATE_MODEL_EVENT, item[props.valueKey]);
+      emit("select", item);
+      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.ref.setAttribute("aria-activedescendant", `${listboxId.value}-item-${highlightedIndex.value}`);
+    };
+    const stopHandle = core.onClickOutside(listboxRef, () => {
+      var _a;
+      if ((_a = popperRef.value) == null ? void 0 : _a.isFocusInsideContent())
+        return;
+      suggestionVisible.value && close();
+    });
+    vue.onBeforeUnmount(() => {
+      stopHandle == null ? void 0 : stopHandle();
+    });
+    vue.onMounted(() => {
+      inputRef.value.ref.setAttribute("role", "textbox");
+      inputRef.value.ref.setAttribute("aria-autocomplete", "list");
+      inputRef.value.ref.setAttribute("aria-controls", "id");
+      inputRef.value.ref.setAttribute("aria-activedescendant", `${listboxId.value}-item-${highlightedIndex.value}`);
+      readonly = inputRef.value.ref.hasAttribute("readonly");
+    });
+    expose({
+      highlightedIndex,
+      activated,
+      loading,
+      inputRef,
+      popperRef,
+      suggestions,
+      handleSelect,
+      handleKeyEnter,
+      focus,
+      blur,
+      close,
+      highlight,
+      getData
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createBlock(vue.unref(index$3.ElTooltip), {
+        ref_key: "popperRef",
+        ref: popperRef,
+        visible: vue.unref(suggestionVisible),
+        placement: _ctx.placement,
+        "fallback-placements": ["bottom-start", "top-start"],
+        "popper-class": [vue.unref(ns).e("popper"), _ctx.popperClass],
+        teleported: _ctx.teleported,
+        "append-to": _ctx.appendTo,
+        "gpu-acceleration": false,
+        pure: "",
+        "manual-mode": "",
+        effect: "light",
+        trigger: "click",
+        transition: `${vue.unref(ns).namespace.value}-zoom-in-top`,
+        persistent: "",
+        role: "listbox",
+        onBeforeShow: onSuggestionShow,
+        onHide
+      }, {
+        content: vue.withCtx(() => [
+          vue.createElementVNode("div", {
+            ref_key: "regionRef",
+            ref: regionRef,
+            class: vue.normalizeClass([vue.unref(ns).b("suggestion"), vue.unref(ns).is("loading", vue.unref(suggestionLoading))]),
+            style: vue.normalizeStyle({
+              [_ctx.fitInputWidth ? "width" : "minWidth"]: dropdownWidth.value,
+              outline: "none"
+            }),
+            role: "region"
+          }, [
+            vue.createVNode(vue.unref(index$4.ElScrollbar), {
+              id: vue.unref(listboxId),
+              tag: "ul",
+              "wrap-class": vue.unref(ns).be("suggestion", "wrap"),
+              "view-class": vue.unref(ns).be("suggestion", "list"),
+              role: "listbox"
+            }, {
+              default: vue.withCtx(() => [
+                vue.unref(suggestionLoading) ? (vue.openBlock(), vue.createElementBlock("li", { key: 0 }, [
+                  vue.renderSlot(_ctx.$slots, "loading", {}, () => [
+                    vue.createVNode(vue.unref(index$5.ElIcon), {
+                      class: vue.normalizeClass(vue.unref(ns).is("loading"))
+                    }, {
+                      default: vue.withCtx(() => [
+                        vue.createVNode(vue.unref(iconsVue.Loading))
+                      ]),
+                      _: 1
+                    }, 8, ["class"])
+                  ])
+                ])) : (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 1 }, vue.renderList(suggestions.value, (item, index) => {
+                  return vue.openBlock(), vue.createElementBlock("li", {
+                    id: `${vue.unref(listboxId)}-item-${index}`,
+                    key: index,
+                    class: vue.normalizeClass({ highlighted: highlightedIndex.value === index }),
+                    role: "option",
+                    "aria-selected": highlightedIndex.value === index,
+                    onClick: ($event) => handleSelect(item)
+                  }, [
+                    vue.renderSlot(_ctx.$slots, "default", { item }, () => [
+                      vue.createTextVNode(vue.toDisplayString(item[_ctx.valueKey]), 1)
+                    ])
+                  ], 10, ["id", "aria-selected", "onClick"]);
+                }), 128))
+              ]),
+              _: 3
+            }, 8, ["id", "wrap-class", "view-class"])
+          ], 6)
+        ]),
+        default: vue.withCtx(() => [
+          vue.createElementVNode("div", {
+            ref_key: "listboxRef",
+            ref: listboxRef,
+            class: vue.normalizeClass([vue.unref(ns).b(), _ctx.$attrs.class]),
+            style: vue.normalizeStyle(vue.unref(styles)),
+            role: "combobox",
+            "aria-haspopup": "listbox",
+            "aria-expanded": vue.unref(suggestionVisible),
+            "aria-owns": vue.unref(listboxId)
+          }, [
+            vue.createVNode(vue.unref(index$6.ElInput), vue.mergeProps({
+              ref_key: "inputRef",
+              ref: inputRef
+            }, vue.unref(attrs), {
+              clearable: _ctx.clearable,
+              disabled: vue.unref(disabled),
+              name: _ctx.name,
+              "model-value": _ctx.modelValue,
+              "aria-label": _ctx.ariaLabel,
+              onInput: handleInput,
+              onChange: handleChange,
+              onFocus: handleFocus,
+              onBlur: handleBlur,
+              onClear: handleClear,
+              onKeydown: [
+                vue.withKeys(vue.withModifiers(($event) => highlight(highlightedIndex.value - 1), ["prevent"]), ["up"]),
+                vue.withKeys(vue.withModifiers(($event) => highlight(highlightedIndex.value + 1), ["prevent"]), ["down"]),
+                vue.withKeys(handleKeyEnter, ["enter"]),
+                vue.withKeys(close, ["tab"]),
+                vue.withKeys(handleKeyEscape, ["esc"])
+              ],
+              onMousedown: handleMouseDown
+            }), vue.createSlots({
+              _: 2
+            }, [
+              _ctx.$slots.prepend ? {
+                name: "prepend",
+                fn: vue.withCtx(() => [
+                  vue.renderSlot(_ctx.$slots, "prepend")
+                ])
+              } : void 0,
+              _ctx.$slots.append ? {
+                name: "append",
+                fn: vue.withCtx(() => [
+                  vue.renderSlot(_ctx.$slots, "append")
+                ])
+              } : void 0,
+              _ctx.$slots.prefix ? {
+                name: "prefix",
+                fn: vue.withCtx(() => [
+                  vue.renderSlot(_ctx.$slots, "prefix")
+                ])
+              } : void 0,
+              _ctx.$slots.suffix ? {
+                name: "suffix",
+                fn: vue.withCtx(() => [
+                  vue.renderSlot(_ctx.$slots, "suffix")
+                ])
+              } : void 0
+            ]), 1040, ["clearable", "disabled", "name", "model-value", "aria-label", "onKeydown"])
+          ], 14, ["aria-expanded", "aria-owns"])
+        ]),
+        _: 3
+      }, 8, ["visible", "placement", "popper-class", "teleported", "append-to", "transition"]);
+    };
+  }
+});
+var Autocomplete = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "autocomplete.vue"]]);
 
-exports.autocompleteEmits = autocompleteEmits;
-exports.autocompleteProps = autocompleteProps;
+exports["default"] = Autocomplete;
 //# sourceMappingURL=autocomplete.js.map