@element-plus/nightly 0.0.20211231 → 0.0.20220104

package/es/utils/util.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"util.mjs","sources":["../../../../packages/utils/util.ts"],"sourcesContent":["import {\n  camelize,\n  capitalize,\n  extend,\n  hasOwn,\n  hyphenate,\n  isArray,\n  isObject,\n  isString,\n  isFunction,\n  looseEqual,\n  toRawType,\n} from '@vue/shared'\nimport isEqualWith from 'lodash/isEqualWith'\nimport { isClient } from '@vueuse/core'\nimport { debugWarn, throwError } from './error'\n\nimport type { ComponentPublicInstance, CSSProperties, Ref } from 'vue'\nimport type { TimeoutHandle, Nullable } from './types'\n\nexport const SCOPE = 'Util'\n\nexport function toObject<T>(arr: Array<T>): Record<string, T> {\n  const res = {}\n  for (let i = 0; i < arr.length; i++) {\n    if (arr[i]) {\n      extend(res, arr[i])\n    }\n  }\n  return res\n}\n\nexport const getValueByPath = (obj, paths = ''): unknown => {\n  let ret: unknown = obj\n  paths.split('.').map((path) => {\n    ret = ret?.[path]\n  })\n  return ret\n}\n\nexport function getPropByPath(\n  obj: any,\n  path: string,\n  strict: boolean\n): {\n  o: unknown\n  k: string\n  v: Nullable<unknown>\n} {\n  let tempObj = obj\n  let key, value\n\n  if (obj && hasOwn(obj, path)) {\n    key = path\n    value = tempObj?.[path]\n  } else {\n    path = path.replace(/\\[(\\w+)\\]/g, '.$1')\n    path = path.replace(/^\\./, '')\n\n    const keyArr = path.split('.')\n    let i = 0\n    for (i; i < keyArr.length - 1; i++) {\n      if (!tempObj && !strict) break\n      const key = keyArr[i]\n\n      if (key in tempObj) {\n        tempObj = tempObj[key]\n      } else {\n        if (strict) {\n          throwError(SCOPE, 'Please transfer a valid prop path to form item!')\n        }\n        break\n      }\n    }\n    key = keyArr[i]\n    value = tempObj?.[keyArr[i]]\n  }\n  return {\n    o: tempObj,\n    k: key,\n    v: value,\n  }\n}\n\n/**\n * Generate random number in range [0, 1000]\n * Maybe replace with [uuid](https://www.npmjs.com/package/uuid)\n */\nexport const generateId = (): number => Math.floor(Math.random() * 10000)\n\n// use isEqual instead\n// export const valueEquals\n\nexport const escapeRegexpString = (value = ''): string =>\n  String(value).replace(/[|\\\\{}()[\\]^$+*?.]/g, '\\\\$&')\n\n// Use native Array.find, Array.findIndex instead\n\n// coerce truthy value to array\nexport const coerceTruthyValueToArray = (arr) => {\n  if (!arr && arr !== 0) {\n    return []\n  }\n  return Array.isArray(arr) ? arr : [arr]\n}\n\n// drop IE and (Edge < 79) support\n// export const isIE\n// export const isEdge\n\nexport const isFirefox = function (): boolean {\n  return isClient && !!window.navigator.userAgent.match(/firefox/i)\n}\n\nexport const autoprefixer = function (style: CSSProperties): CSSProperties {\n  const rules = ['transform', 'transition', 'animation']\n  const prefixes = ['ms-', 'webkit-']\n  rules.forEach((rule) => {\n    const value = style[rule]\n    if (rule && value) {\n      prefixes.forEach((prefix) => {\n        style[prefix + rule] = value\n      })\n    }\n  })\n  return style\n}\n\nexport const kebabCase = hyphenate\n\n// reexport from lodash & vue shared\nexport { isVNode } from 'vue'\nexport {\n  hasOwn,\n  // isEmpty,\n  // isEqual,\n  isObject,\n  isArray,\n  isString,\n  capitalize,\n  camelize,\n  looseEqual,\n  extend,\n}\n\nexport const isBool = (val: unknown): val is boolean => typeof val === 'boolean'\nexport const isNumber = (val: unknown): val is number => typeof val === 'number'\nexport const isHTMLElement = (val: unknown) => toRawType(val).startsWith('HTML')\n\nexport function rafThrottle<T extends (...args: any) => any>(fn: T): T {\n  let locked = false\n  return function (this: ThisParameterType<T>, ...args: any[]) {\n    if (locked) return\n    locked = true\n\n    window.requestAnimationFrame(() => {\n      Reflect.apply(fn, this, args)\n      locked = false\n    })\n  } as T\n}\n\nexport const clearTimer = (timer: Ref<TimeoutHandle>) => {\n  clearTimeout(timer.value)\n  timer.value = null\n}\n\n/**\n * Generating a random int in range (0, max - 1)\n * @param max {number}\n */\nexport function getRandomInt(max: number) {\n  return Math.floor(Math.random() * Math.floor(max))\n}\n\nexport function isUndefined(val: any): val is undefined {\n  return val === undefined\n}\n\nexport function isEmpty(val: unknown) {\n  if (\n    (!val && val !== 0) ||\n    (isArray(val) && !val.length) ||\n    (isObject(val) && !Object.keys(val).length)\n  )\n    return true\n\n  return false\n}\n\nexport function arrayFlat(arr: unknown[]) {\n  return arr.reduce((acm: unknown[], item) => {\n    const val = Array.isArray(item) ? arrayFlat(item) : item\n    return acm.concat(val)\n  }, [])\n}\n\nexport function deduplicate<T>(arr: T[]) {\n  return Array.from(new Set(arr))\n}\n\nexport function addUnit(value: string | number) {\n  if (isString(value)) {\n    return value\n  } else if (isNumber(value)) {\n    return `${value}px`\n  }\n  debugWarn(SCOPE, 'binding value must be a string or number')\n  return ''\n}\n\n/**\n * Enhance `lodash.isEqual` for it always return false even two functions have completely same statements.\n * @param obj The value to compare\n * @param other The other value to compare\n * @returns Returns `true` if the values are equivalent, else `false`.\n * @example\n *  lodash.isEqual(() => 1, () => 1)      // false\n *  isEqualWith(() => 1, () => 1)         // true\n */\nexport function isEqualWithFunction(obj: any, other: any) {\n  return isEqualWith(obj, other, (objVal, otherVal) => {\n    return isFunction(objVal) && isFunction(otherVal)\n      ? `${objVal}` === `${otherVal}`\n      : undefined\n  })\n}\n\n/**\n * Generate function for attach ref for the h renderer\n * @param ref Ref<HTMLElement | ComponentPublicInstance>\n * @returns (val: T) => void\n */\n\nexport const refAttacher = <T extends HTMLElement | ComponentPublicInstance>(\n  ref: Ref<T>\n) => {\n  return (val: T) => {\n    ref.value = val\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"util.mjs","sources":["../../../../packages/utils/util.ts"],"sourcesContent":["import {\n  camelize,\n  capitalize,\n  extend,\n  hasOwn,\n  hyphenate,\n  isArray,\n  isObject,\n  isString,\n  isFunction,\n  looseEqual,\n  toRawType,\n} from '@vue/shared'\nimport isEqualWith from 'lodash/isEqualWith'\nimport { isClient } from '@vueuse/core'\nimport { debugWarn, throwError } from './error'\n\nimport type { ComponentPublicInstance, CSSProperties, Ref } from 'vue'\nimport type { TimeoutHandle, Nullable } from './types'\n\nexport const SCOPE = 'Util'\n\nexport function toObject<T>(arr: Array<T>): Record<string, T> {\n  const res = {}\n  for (let i = 0; i < arr.length; i++) {\n    if (arr[i]) {\n      extend(res, arr[i])\n    }\n  }\n  return res\n}\n\nexport const getValueByPath = (obj, paths = ''): unknown => {\n  let ret: unknown = obj\n  paths.split('.').map((path) => {\n    ret = ret?.[path]\n  })\n  return ret\n}\n\nexport function getPropByPath(\n  obj: any,\n  path: string,\n  strict: boolean\n): {\n  o: unknown\n  k: string\n  v: Nullable<unknown>\n} {\n  let tempObj = obj\n  let key, value\n\n  if (obj && hasOwn(obj, path)) {\n    key = path\n    value = tempObj?.[path]\n  } else {\n    path = path.replace(/\\[(\\w+)\\]/g, '.$1')\n    path = path.replace(/^\\./, '')\n\n    const keyArr = path.split('.')\n    let i = 0\n    for (i; i < keyArr.length - 1; i++) {\n      if (!tempObj && !strict) break\n      const key = keyArr[i]\n\n      if (key in tempObj) {\n        tempObj = tempObj[key]\n      } else {\n        if (strict) {\n          throwError(SCOPE, 'Please transfer a valid prop path to form item!')\n        }\n        break\n      }\n    }\n    key = keyArr[i]\n    value = tempObj?.[keyArr[i]]\n  }\n  return {\n    o: tempObj,\n    k: key,\n    v: value,\n  }\n}\n\n/**\n * Generate random number in range [0, 1000]\n * Maybe replace with [uuid](https://www.npmjs.com/package/uuid)\n */\nexport const generateId = (): number => Math.floor(Math.random() * 10000)\n\n// use isEqual instead\n// export const valueEquals\n\nexport const escapeRegexpString = (value = ''): string =>\n  String(value).replace(/[|\\\\{}()[\\]^$+*?.]/g, '\\\\$&')\n\n// Use native Array.find, Array.findIndex instead\n\n// coerce truthy value to array\nexport const coerceTruthyValueToArray = (arr) => {\n  if (!arr && arr !== 0) {\n    return []\n  }\n  return Array.isArray(arr) ? arr : [arr]\n}\n\n// drop IE and (Edge < 79) support\n// export const isIE\n// export const isEdge\n\nexport const isFirefox = function (): boolean {\n  return isClient && !!window.navigator.userAgent.match(/firefox/i)\n}\n\nexport const autoprefixer = function (style: CSSProperties): CSSProperties {\n  const rules = ['transform', 'transition', 'animation']\n  const prefixes = ['ms-', 'webkit-']\n  rules.forEach((rule) => {\n    const value = style[rule]\n    if (rule && value) {\n      prefixes.forEach((prefix) => {\n        style[prefix + rule] = value\n      })\n    }\n  })\n  return style\n}\n\nexport const kebabCase = hyphenate\n\n// reexport from lodash & vue shared\nexport { isVNode } from 'vue'\nexport {\n  hasOwn,\n  // isEmpty,\n  // isEqual,\n  isObject,\n  isArray,\n  isString,\n  capitalize,\n  camelize,\n  looseEqual,\n  extend,\n}\n\nexport const isBool = (val: unknown): val is boolean => typeof val === 'boolean'\nexport const isNumber = (val: unknown): val is number => typeof val === 'number'\nexport const isHTMLElement = (val: unknown) => toRawType(val).startsWith('HTML')\n\nexport function rafThrottle<T extends (...args: any) => any>(fn: T): T {\n  let locked = false\n  return function (this: ThisParameterType<T>, ...args: any[]) {\n    if (locked) return\n    locked = true\n\n    window.requestAnimationFrame(() => {\n      Reflect.apply(fn, this, args)\n      locked = false\n    })\n  } as T\n}\n\nexport const clearTimer = (timer: Ref<TimeoutHandle>) => {\n  clearTimeout(timer.value)\n  timer.value = null\n}\n\n/**\n * Generating a random int in range (0, max - 1)\n * @param max {number}\n */\nexport function getRandomInt(max: number) {\n  return Math.floor(Math.random() * Math.floor(max))\n}\n\nexport function isUndefined(val: any): val is undefined {\n  return val === undefined\n}\n\nexport function isEmpty(val: unknown) {\n  if (\n    (!val && val !== 0) ||\n    (isArray(val) && !val.length) ||\n    (isObject(val) && !Object.keys(val).length)\n  )\n    return true\n\n  return false\n}\n\nexport function arrayFlat(arr: unknown[]) {\n  return arr.reduce((acm: unknown[], item) => {\n    const val = Array.isArray(item) ? arrayFlat(item) : item\n    return acm.concat(val)\n  }, [])\n}\n\nexport function deduplicate<T>(arr: T[]) {\n  return Array.from(new Set(arr))\n}\n\nexport function addUnit(value: string | number) {\n  if (isString(value)) {\n    return value\n  } else if (isNumber(value)) {\n    return `${value}px`\n  }\n  debugWarn(SCOPE, 'binding value must be a string or number')\n  return ''\n}\n\n/**\n * Enhance `lodash.isEqual` for it always return false even two functions have completely same statements.\n * @param obj The value to compare\n * @param other The other value to compare\n * @returns Returns `true` if the values are equivalent, else `false`.\n * @example\n *  lodash.isEqual(() => 1, () => 1)      // false\n *  isEqualWith(() => 1, () => 1)         // true\n */\nexport function isEqualWithFunction(obj: any, other: any) {\n  return isEqualWith(obj, other, (objVal, otherVal) => {\n    return isFunction(objVal) && isFunction(otherVal)\n      ? `${objVal}` === `${otherVal}`\n      : undefined\n  })\n}\n\n/**\n * Generate function for attach ref for the h renderer\n * @param ref Ref<HTMLElement | ComponentPublicInstance>\n * @returns (val: T) => void\n */\n\nexport const refAttacher = <T extends HTMLElement | ComponentPublicInstance>(\n  ref: Ref<T>\n) => {\n  return (val: T) => {\n    ref.value = val\n  }\n}\n\nexport const merge = <T extends Record<string, any>>(a: T, b: T) => {\n  const keys = [\n    ...new Set([...Object.keys(a), ...Object.keys(b)]),\n  ] as (keyof T)[]\n  const obj = {} as T\n  for (const key of keys) {\n    obj[key] = b[key] ?? a[key]\n  }\n  return obj\n}\n"],"names":[],"mappings":"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"}

package/es/version.d.ts

@@ -1 +1 @@
-export declare const version = "0.0.20211231";
+export declare const version = "0.0.20220104";

package/es/version.mjs

@@ -1,4 +1,4 @@
-const version = "0.0.20211231";
+const version = "0.0.20220104";
 
 export { version };
 //# sourceMappingURL=version.mjs.map

package/es/version.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"version.mjs","sources":["../../../packages/element-plus/version.ts"],"sourcesContent":["export const version = '0.0.20211231'\n"],"names":[],"mappings":"AAAY,MAAC,OAAO,GAAG;;;;"}
+{"version":3,"file":"version.mjs","sources":["../../../packages/element-plus/version.ts"],"sourcesContent":["export const version = '0.0.20220104'\n"],"names":[],"mappings":"AAAY,MAAC,OAAO,GAAG;;;;"}

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

@@ -46,22 +46,25 @@ declare const _Autocomplete: SFCWithInstall<import("vue").DefineComponent<{
         default: boolean;
     };
 }, {
-    Effect: typeof import("..").Effect;
     attrs: import("vue").ComputedRef<Record<string, unknown>>;
-    suggestions: import("vue").Ref<never[]>;
+    suggestions: import("vue").Ref<any[]>;
     highlightedIndex: import("vue").Ref<number>;
     dropdownWidth: import("vue").Ref<string>;
     activated: import("vue").Ref<boolean>;
     suggestionDisabled: import("vue").Ref<boolean>;
     loading: import("vue").Ref<boolean>;
-    inputRef: import("vue").Ref<null>;
-    regionRef: import("vue").Ref<null>;
+    inputRef: import("vue").Ref<{
+        inputOrTextarea: HTMLInputElement | HTMLTextAreaElement;
+        focus: () => void;
+        $el: HTMLElement;
+    } | null>;
+    regionRef: import("vue").Ref<HTMLElement | null>;
     popper: import("vue").Ref<null>;
     id: import("vue").ComputedRef<string>;
     suggestionVisible: import("vue").ComputedRef<boolean>;
     suggestionLoading: import("vue").ComputedRef<boolean>;
-    getData: (queryString: any) => void;
-    handleInput: (value: any) => void;
+    getData: (queryString: string) => void;
+    handleInput: (value: string) => void;
     handleChange: (value: any) => void;
     handleFocus: (e: any) => void;
     handleBlur: (e: any) => void;
@@ -70,7 +73,8 @@ declare const _Autocomplete: SFCWithInstall<import("vue").DefineComponent<{
     close: () => void;
     focus: () => void;
     select: (item: any) => void;
-    highlight: (index: 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;
@@ -97,10 +101,10 @@ declare const _Autocomplete: SFCWithInstall<import("vue").DefineComponent<{
     highlightFirstItem: boolean;
 } & {}> & {
     onChange?: ((...args: any[]) => any) | undefined;
+    onFocus?: ((...args: any[]) => any) | undefined;
+    onBlur?: ((...args: any[]) => any) | undefined;
     onInput?: ((...args: any[]) => any) | undefined;
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
-    onBlur?: ((...args: any[]) => any) | undefined;
-    onFocus?: ((...args: any[]) => any) | undefined;
     onClear?: ((...args: any[]) => any) | undefined;
     onSelect?: ((...args: any[]) => any) | undefined;
 }, {
@@ -164,22 +168,25 @@ export declare const ElAutocomplete: SFCWithInstall<import("vue").DefineComponen
         default: boolean;
     };
 }, {
-    Effect: typeof import("..").Effect;
     attrs: import("vue").ComputedRef<Record<string, unknown>>;
-    suggestions: import("vue").Ref<never[]>;
+    suggestions: import("vue").Ref<any[]>;
     highlightedIndex: import("vue").Ref<number>;
     dropdownWidth: import("vue").Ref<string>;
     activated: import("vue").Ref<boolean>;
     suggestionDisabled: import("vue").Ref<boolean>;
     loading: import("vue").Ref<boolean>;
-    inputRef: import("vue").Ref<null>;
-    regionRef: import("vue").Ref<null>;
+    inputRef: import("vue").Ref<{
+        inputOrTextarea: HTMLInputElement | HTMLTextAreaElement;
+        focus: () => void;
+        $el: HTMLElement;
+    } | null>;
+    regionRef: import("vue").Ref<HTMLElement | null>;
     popper: import("vue").Ref<null>;
     id: import("vue").ComputedRef<string>;
     suggestionVisible: import("vue").ComputedRef<boolean>;
     suggestionLoading: import("vue").ComputedRef<boolean>;
-    getData: (queryString: any) => void;
-    handleInput: (value: any) => void;
+    getData: (queryString: string) => void;
+    handleInput: (value: string) => void;
     handleChange: (value: any) => void;
     handleFocus: (e: any) => void;
     handleBlur: (e: any) => void;
@@ -188,7 +195,8 @@ export declare const ElAutocomplete: SFCWithInstall<import("vue").DefineComponen
     close: () => void;
     focus: () => void;
     select: (item: any) => void;
-    highlight: (index: 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;
@@ -215,10 +223,10 @@ export declare const ElAutocomplete: SFCWithInstall<import("vue").DefineComponen
     highlightFirstItem: boolean;
 } & {}> & {
     onChange?: ((...args: any[]) => any) | undefined;
+    onFocus?: ((...args: any[]) => any) | undefined;
+    onBlur?: ((...args: any[]) => any) | undefined;
     onInput?: ((...args: any[]) => any) | undefined;
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
-    onBlur?: ((...args: any[]) => any) | undefined;
-    onFocus?: ((...args: any[]) => any) | undefined;
     onClear?: ((...args: any[]) => any) | undefined;
     onSelect?: ((...args: any[]) => any) | undefined;
 }, {

package/lib/components/autocomplete/src/index.vue.d.ts

@@ -1,4 +1,3 @@
-import { Effect } from 'element-plus/es/components/popper';
 import type { Placement } from 'element-plus/es/components/popper';
 import type { PropType } from 'vue';
 declare const _default: import("vue").DefineComponent<{
@@ -48,22 +47,25 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
 }, {
-    Effect: typeof Effect;
     attrs: import("vue").ComputedRef<Record<string, unknown>>;
-    suggestions: import("vue").Ref<never[]>;
+    suggestions: import("vue").Ref<any[]>;
     highlightedIndex: import("vue").Ref<number>;
     dropdownWidth: import("vue").Ref<string>;
     activated: import("vue").Ref<boolean>;
     suggestionDisabled: import("vue").Ref<boolean>;
     loading: import("vue").Ref<boolean>;
-    inputRef: import("vue").Ref<null>;
-    regionRef: import("vue").Ref<null>;
+    inputRef: import("vue").Ref<{
+        inputOrTextarea: HTMLInputElement | HTMLTextAreaElement;
+        focus: () => void;
+        $el: HTMLElement;
+    } | null>;
+    regionRef: import("vue").Ref<HTMLElement | null>;
     popper: import("vue").Ref<null>;
     id: import("vue").ComputedRef<string>;
     suggestionVisible: import("vue").ComputedRef<boolean>;
     suggestionLoading: import("vue").ComputedRef<boolean>;
-    getData: (queryString: any) => void;
-    handleInput: (value: any) => void;
+    getData: (queryString: string) => void;
+    handleInput: (value: string) => void;
     handleChange: (value: any) => void;
     handleFocus: (e: any) => void;
     handleBlur: (e: any) => void;
@@ -72,7 +74,8 @@ declare const _default: import("vue").DefineComponent<{
     close: () => void;
     focus: () => void;
     select: (item: any) => void;
-    highlight: (index: 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;
@@ -99,10 +102,10 @@ declare const _default: import("vue").DefineComponent<{
     highlightFirstItem: boolean;
 } & {}> & {
     onChange?: ((...args: any[]) => any) | undefined;
+    onFocus?: ((...args: any[]) => any) | undefined;
+    onBlur?: ((...args: any[]) => any) | undefined;
     onInput?: ((...args: any[]) => any) | undefined;
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
-    onBlur?: ((...args: any[]) => any) | undefined;
-    onFocus?: ((...args: any[]) => any) | undefined;
     onClear?: ((...args: any[]) => any) | undefined;
     onSelect?: ((...args: any[]) => any) | undefined;
 }, {

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

@@ -12,12 +12,11 @@ var constants = require('../../../utils/constants.js');
 var error = require('../../../utils/error.js');
 var index$1 = require('../../input/index.js');
 var index$2 = require('../../scrollbar/index.js');
-var index = require('../../popper/index.js');
+var index = require('../../tooltip/index.js');
 var index$3 = require('../../icon/index.js');
 var iconsVue = require('@element-plus/icons-vue');
 var index$4 = require('../../../directives/click-outside/index.js');
 var index$5 = require('../../../hooks/use-attrs/index.js');
-var defaults = require('../../popper/src/use-popper/defaults.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -26,7 +25,7 @@ var debounce__default = /*#__PURE__*/_interopDefaultLegacy(debounce);
 var script = vue.defineComponent({
   name: "ElAutocomplete",
   components: {
-    ElPopper: index["default"],
+    ElTooltip: index.ElTooltip,
     ElInput: index$1.ElInput,
     ElScrollbar: index$2.ElScrollbar,
     ElIcon: index$3.ElIcon,
@@ -122,28 +121,24 @@ var script = vue.defineComponent({
     const suggestionLoading = vue.computed(() => {
       return !props.hideLoading && loading.value;
     });
-    const updatePopperPosition = () => {
-      vue.nextTick(popper.value.update);
+    const onSuggestionShow = () => {
+      vue.nextTick(() => {
+        if (suggestionVisible.value) {
+          dropdownWidth.value = `${inputRef.value.$el.offsetWidth}px`;
+        }
+      });
     };
-    vue.watch(suggestionVisible, () => {
-      dropdownWidth.value = `${inputRef.value.$el.offsetWidth}px`;
-    });
     vue.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 $ul = regionRef.value.querySelector(".el-autocomplete-suggestion__list");
-      $ul.setAttribute("role", "listbox");
-      $ul.setAttribute("id", id.value);
     });
-    vue.onUpdated(updatePopperPosition);
     const getData = (queryString) => {
       if (suggestionDisabled.value) {
         return;
       }
       loading.value = true;
-      updatePopperPosition();
       props.fetchSuggestions(queryString, (suggestionsArg) => {
         loading.value = false;
         if (suggestionDisabled.value) {
@@ -176,7 +171,7 @@ var script = vue.defineComponent({
       activated.value = true;
       ctx.emit("focus", e);
       if (props.triggerOnFocus) {
-        debouncedGetData(props.modelValue);
+        debouncedGetData(String(props.modelValue));
       }
     };
     const handleBlur = (e) => {
@@ -202,7 +197,8 @@ var script = vue.defineComponent({
       activated.value = false;
     };
     const focus = () => {
-      inputRef.value.focus();
+      var _a;
+      (_a = inputRef.value) == null ? void 0 : _a.focus();
     };
     const select = (item) => {
       ctx.emit("input", item[props.valueKey]);
@@ -239,7 +235,6 @@ var script = vue.defineComponent({
       inputRef.value.inputOrTextarea.setAttribute("aria-activedescendant", `${id.value}-item-${highlightedIndex.value}`);
     };
     return {
-      Effect: defaults.Effect,
       attrs,
       suggestions,
       highlightedIndex,
@@ -263,7 +258,8 @@ var script = vue.defineComponent({
       close,
       focus,
       select,
-      highlight
+      highlight,
+      onSuggestionShow
     };
   }
 });

package/lib/components/autocomplete/src/index.vue_vue_type_script_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/autocomplete/src/index.vue"],"sourcesContent":["<template>\n  <el-popper\n    ref=\"popper\"\n    v-model:visible=\"suggestionVisible\"\n    :placement=\"placement\"\n    :fallback-placements=\"['bottom-start', 'top-start']\"\n    :popper-class=\"`el-autocomplete__popper ${popperClass}`\"\n    :append-to-body=\"popperAppendToBody\"\n    pure\n    manual-mode\n    :effect=\"Effect.LIGHT\"\n    trigger=\"click\"\n    transition=\"el-zoom-in-top\"\n    :gpu-acceleration=\"false\"\n  >\n    <template #trigger>\n      <div\n        v-clickoutside=\"close\"\n        :class=\"['el-autocomplete', $attrs.class]\"\n        :style=\"$attrs.style\"\n        role=\"combobox\"\n        aria-haspopup=\"listbox\"\n        :aria-expanded=\"suggestionVisible\"\n        :aria-owns=\"id\"\n      >\n        <el-input\n          ref=\"inputRef\"\n          v-bind=\"attrs\"\n          :model-value=\"modelValue\"\n          @input=\"handleInput\"\n          @change=\"handleChange\"\n          @focus=\"handleFocus\"\n          @blur=\"handleBlur\"\n          @clear=\"handleClear\"\n          @keydown.up.prevent=\"highlight(highlightedIndex - 1)\"\n          @keydown.down.prevent=\"highlight(highlightedIndex + 1)\"\n          @keydown.enter=\"handleKeyEnter\"\n          @keydown.tab=\"close\"\n        >\n          <template v-if=\"$slots.prepend\" #prepend>\n            <slot name=\"prepend\"></slot>\n          </template>\n          <template v-if=\"$slots.append\" #append>\n            <slot name=\"append\"></slot>\n          </template>\n          <template v-if=\"$slots.prefix\" #prefix>\n            <slot name=\"prefix\"></slot>\n          </template>\n          <template v-if=\"$slots.suffix\" #suffix>\n            <slot name=\"suffix\"></slot>\n          </template>\n        </el-input>\n      </div>\n    </template>\n    <template #default>\n      <div\n        ref=\"regionRef\"\n        :class=\"[\n          'el-autocomplete-suggestion',\n          suggestionLoading && 'is-loading',\n        ]\"\n        :style=\"{ minWidth: dropdownWidth, outline: 'none' }\"\n        role=\"region\"\n      >\n        <el-scrollbar\n          tag=\"ul\"\n          wrap-class=\"el-autocomplete-suggestion__wrap\"\n          view-class=\"el-autocomplete-suggestion__list\"\n        >\n          <li v-if=\"suggestionLoading\">\n            <el-icon class=\"is-loading\"><loading /></el-icon>\n          </li>\n          <template v-else>\n            <li\n              v-for=\"(item, index) in suggestions\"\n              :id=\"`${id}-item-${index}`\"\n              :key=\"index\"\n              :class=\"{ highlighted: highlightedIndex === index }\"\n              role=\"option\"\n              :aria-selected=\"highlightedIndex === index\"\n              @click=\"select(item)\"\n            >\n              <slot :item=\"item\">{{ item[valueKey] }}</slot>\n            </li>\n          </template>\n        </el-scrollbar>\n      </div>\n    </template>\n  </el-popper>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  ref,\n  computed,\n  onMounted,\n  onUpdated,\n  nextTick,\n  watch,\n} from 'vue'\nimport { NOOP } from '@vue/shared'\nimport debounce from 'lodash/debounce'\nimport { useAttrs } from '@element-plus/hooks'\nimport { ClickOutside } from '@element-plus/directives'\nimport { generateId, isArray } from '@element-plus/utils/util'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { throwError } from '@element-plus/utils/error'\nimport ElInput from '@element-plus/components/input'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport ElPopper, { Effect } from '@element-plus/components/popper'\nimport ElIcon from '@element-plus/components/icon'\nimport { Loading } from '@element-plus/icons-vue'\n\nimport type { Placement } from '@element-plus/components/popper'\nimport type { PropType } from 'vue'\n\nexport default defineComponent({\n  name: 'ElAutocomplete',\n  components: {\n    ElPopper,\n    ElInput,\n    ElScrollbar,\n    ElIcon,\n    Loading,\n  },\n  directives: {\n    clickoutside: ClickOutside,\n  },\n  inheritAttrs: false,\n  props: {\n    valueKey: {\n      type: String,\n      default: 'value',\n    },\n    modelValue: {\n      type: [String, Number],\n      default: '',\n    },\n    debounce: {\n      type: Number,\n      default: 300,\n    },\n    placement: {\n      type: String as PropType<Placement>,\n      validator: (val: string): boolean => {\n        return [\n          'top',\n          'top-start',\n          'top-end',\n          'bottom',\n          'bottom-start',\n          'bottom-end',\n        ].includes(val)\n      },\n      default: 'bottom-start',\n    },\n    fetchSuggestions: {\n      type: Function as PropType<\n        (queryString: string, cb: (data: any[]) => void) => void\n      >,\n      default: NOOP,\n    },\n    popperClass: {\n      type: String,\n      default: '',\n    },\n    triggerOnFocus: {\n      type: Boolean,\n      default: true,\n    },\n    selectWhenUnmatched: {\n      type: Boolean,\n      default: false,\n    },\n    hideLoading: {\n      type: Boolean,\n      default: false,\n    },\n    popperAppendToBody: {\n      type: Boolean,\n      default: true,\n    },\n    highlightFirstItem: {\n      type: Boolean,\n      default: false,\n    },\n  },\n  emits: [\n    UPDATE_MODEL_EVENT,\n    'input',\n    'change',\n    'focus',\n    'blur',\n    'clear',\n    'select',\n  ],\n  setup(props, ctx) {\n    const attrs = useAttrs()\n    const suggestions = ref([])\n    const highlightedIndex = ref(-1)\n    const dropdownWidth = ref('')\n    const activated = ref(false)\n    const suggestionDisabled = ref(false)\n    const loading = ref(false)\n    const inputRef = ref(null)\n    const regionRef = ref(null)\n    const popper = ref(null)\n\n    const id = computed(() => {\n      return `el-autocomplete-${generateId()}`\n    })\n    const suggestionVisible = computed(() => {\n      const isValidData =\n        isArray(suggestions.value) && suggestions.value.length > 0\n      return (isValidData || loading.value) && activated.value\n    })\n    const suggestionLoading = computed(() => {\n      return !props.hideLoading && loading.value\n    })\n\n    const updatePopperPosition = () => {\n      nextTick(popper.value.update)\n    }\n\n    watch(suggestionVisible, () => {\n      dropdownWidth.value = `${inputRef.value.$el.offsetWidth}px`\n    })\n\n    onMounted(() => {\n      inputRef.value.inputOrTextarea.setAttribute('role', 'textbox')\n      inputRef.value.inputOrTextarea.setAttribute('aria-autocomplete', 'list')\n      inputRef.value.inputOrTextarea.setAttribute('aria-controls', 'id')\n      inputRef.value.inputOrTextarea.setAttribute(\n        'aria-activedescendant',\n        `${id.value}-item-${highlightedIndex.value}`\n      )\n      const $ul = regionRef.value.querySelector(\n        '.el-autocomplete-suggestion__list'\n      )\n      $ul.setAttribute('role', 'listbox')\n      $ul.setAttribute('id', id.value)\n    })\n\n    onUpdated(updatePopperPosition)\n\n    const getData = (queryString) => {\n      if (suggestionDisabled.value) {\n        return\n      }\n      loading.value = true\n      updatePopperPosition()\n      props.fetchSuggestions(queryString, (suggestionsArg) => {\n        loading.value = false\n        if (suggestionDisabled.value) {\n          return\n        }\n        if (isArray(suggestionsArg)) {\n          suggestions.value = suggestionsArg\n          highlightedIndex.value = props.highlightFirstItem ? 0 : -1\n        } else {\n          throwError(\n            'ElAutocomplete',\n            'autocomplete suggestions must be an array'\n          )\n        }\n      })\n    }\n    const debouncedGetData = debounce(getData, props.debounce)\n    const handleInput = (value) => {\n      ctx.emit('input', value)\n      ctx.emit(UPDATE_MODEL_EVENT, value)\n      suggestionDisabled.value = false\n      if (!props.triggerOnFocus && !value) {\n        suggestionDisabled.value = true\n        suggestions.value = []\n        return\n      }\n      debouncedGetData(value)\n    }\n    const handleChange = (value) => {\n      ctx.emit('change', value)\n    }\n    const handleFocus = (e) => {\n      activated.value = true\n      ctx.emit('focus', e)\n      if (props.triggerOnFocus) {\n        debouncedGetData(props.modelValue)\n      }\n    }\n    const handleBlur = (e) => {\n      ctx.emit('blur', e)\n    }\n    const handleClear = () => {\n      activated.value = false\n      ctx.emit(UPDATE_MODEL_EVENT, '')\n      ctx.emit('clear')\n    }\n    const handleKeyEnter = () => {\n      if (\n        suggestionVisible.value &&\n        highlightedIndex.value >= 0 &&\n        highlightedIndex.value < suggestions.value.length\n      ) {\n        select(suggestions.value[highlightedIndex.value])\n      } else if (props.selectWhenUnmatched) {\n        ctx.emit('select', { value: props.modelValue })\n        nextTick(() => {\n          suggestions.value = []\n          highlightedIndex.value = -1\n        })\n      }\n    }\n    const close = () => {\n      activated.value = false\n    }\n    const focus = () => {\n      inputRef.value.focus()\n    }\n    const select = (item) => {\n      ctx.emit('input', item[props.valueKey])\n      ctx.emit(UPDATE_MODEL_EVENT, item[props.valueKey])\n      ctx.emit('select', item)\n      nextTick(() => {\n        suggestions.value = []\n        highlightedIndex.value = -1\n      })\n    }\n    const highlight = (index) => {\n      if (!suggestionVisible.value || loading.value) {\n        return\n      }\n      if (index < 0) {\n        highlightedIndex.value = -1\n        return\n      }\n      if (index >= suggestions.value.length) {\n        index = suggestions.value.length - 1\n      }\n      const suggestion = regionRef.value.querySelector(\n        '.el-autocomplete-suggestion__wrap'\n      )\n      const suggestionList = suggestion.querySelectorAll(\n        '.el-autocomplete-suggestion__list li'\n      )\n      const highlightItem = suggestionList[index]\n      const scrollTop = suggestion.scrollTop\n      const { offsetTop, scrollHeight } = highlightItem\n\n      if (offsetTop + scrollHeight > scrollTop + suggestion.clientHeight) {\n        suggestion.scrollTop += scrollHeight\n      }\n      if (offsetTop < scrollTop) {\n        suggestion.scrollTop -= scrollHeight\n      }\n      highlightedIndex.value = index\n      inputRef.value.inputOrTextarea.setAttribute(\n        'aria-activedescendant',\n        `${id.value}-item-${highlightedIndex.value}`\n      )\n    }\n\n    return {\n      Effect,\n\n      attrs,\n      suggestions,\n      highlightedIndex,\n      dropdownWidth,\n      activated,\n      suggestionDisabled,\n      loading,\n      inputRef,\n      regionRef,\n      popper,\n\n      id,\n      suggestionVisible,\n      suggestionLoading,\n\n      getData,\n      handleInput,\n      handleChange,\n      handleFocus,\n      handleBlur,\n      handleClear,\n      handleKeyEnter,\n      close,\n      focus,\n      select,\n      highlight,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","ElPopper","ElScrollbar","ElIcon","Loading","UPDATE_MODEL_EVENT","ref","computed","isArray","nextTick","onMounted","debounce","Effect"],"mappings":"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"}
+{"version":3,"file":"index.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/autocomplete/src/index.vue"],"sourcesContent":["<template>\n  <el-tooltip\n    ref=\"popper\"\n    v-model:visible=\"suggestionVisible\"\n    :placement=\"placement\"\n    :fallback-placements=\"['bottom-start', 'top-start']\"\n    :popper-class=\"`el-autocomplete__popper ${popperClass}`\"\n    :append-to-body=\"popperAppendToBody\"\n    :gpu-acceleration=\"false\"\n    pure\n    manual-mode\n    effect=\"light\"\n    trigger=\"click\"\n    transition=\"el-zoom-in-top\"\n    @show=\"onSuggestionShow\"\n  >\n    <div\n      v-clickoutside=\"close\"\n      :class=\"['el-autocomplete', $attrs.class]\"\n      :style=\"$attrs.style\"\n      role=\"combobox\"\n      aria-haspopup=\"listbox\"\n      :aria-expanded=\"suggestionVisible\"\n      :aria-owns=\"id\"\n    >\n      <el-input\n        ref=\"inputRef\"\n        v-bind=\"attrs\"\n        :model-value=\"modelValue\"\n        @input=\"handleInput\"\n        @change=\"handleChange\"\n        @focus=\"handleFocus\"\n        @blur=\"handleBlur\"\n        @clear=\"handleClear\"\n        @keydown.up.prevent=\"highlight(highlightedIndex - 1)\"\n        @keydown.down.prevent=\"highlight(highlightedIndex + 1)\"\n        @keydown.enter=\"handleKeyEnter\"\n        @keydown.tab=\"close\"\n      >\n        <template v-if=\"$slots.prepend\" #prepend>\n          <slot name=\"prepend\"></slot>\n        </template>\n        <template v-if=\"$slots.append\" #append>\n          <slot name=\"append\"></slot>\n        </template>\n        <template v-if=\"$slots.prefix\" #prefix>\n          <slot name=\"prefix\"></slot>\n        </template>\n        <template v-if=\"$slots.suffix\" #suffix>\n          <slot name=\"suffix\"></slot>\n        </template>\n      </el-input>\n    </div>\n    <template #content>\n      <div\n        ref=\"regionRef\"\n        :class=\"[\n          'el-autocomplete-suggestion',\n          suggestionLoading && 'is-loading',\n        ]\"\n        :style=\"{ minWidth: dropdownWidth, outline: 'none' }\"\n        role=\"region\"\n      >\n        <el-scrollbar\n          :id=\"id\"\n          tag=\"ul\"\n          wrap-class=\"el-autocomplete-suggestion__wrap\"\n          view-class=\"el-autocomplete-suggestion__list\"\n          role=\"listbox\"\n        >\n          <li v-if=\"suggestionLoading\">\n            <el-icon class=\"is-loading\"><loading /></el-icon>\n          </li>\n          <template v-else>\n            <li\n              v-for=\"(item, index) in suggestions\"\n              :id=\"`${id}-item-${index}`\"\n              :key=\"index\"\n              :class=\"{ highlighted: highlightedIndex === index }\"\n              role=\"option\"\n              :aria-selected=\"highlightedIndex === index\"\n              @click=\"select(item)\"\n            >\n              <slot :item=\"item\">{{ item[valueKey] }}</slot>\n            </li>\n          </template>\n        </el-scrollbar>\n      </div>\n    </template>\n  </el-tooltip>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, computed, onMounted, nextTick } from 'vue'\nimport { NOOP } from '@vue/shared'\nimport debounce from 'lodash/debounce'\nimport { useAttrs } from '@element-plus/hooks'\nimport { ClickOutside } from '@element-plus/directives'\nimport { generateId, isArray } from '@element-plus/utils/util'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { throwError } from '@element-plus/utils/error'\nimport ElInput from '@element-plus/components/input'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElIcon from '@element-plus/components/icon'\nimport { Loading } from '@element-plus/icons-vue'\n\nimport type { Placement } from '@element-plus/components/popper'\nimport type { PropType } from 'vue'\n\nexport default defineComponent({\n  name: 'ElAutocomplete',\n  components: {\n    ElTooltip,\n    ElInput,\n    ElScrollbar,\n    ElIcon,\n    Loading,\n  },\n  directives: {\n    clickoutside: ClickOutside,\n  },\n  inheritAttrs: false,\n  props: {\n    valueKey: {\n      type: String,\n      default: 'value',\n    },\n    modelValue: {\n      type: [String, Number],\n      default: '',\n    },\n    debounce: {\n      type: Number,\n      default: 300,\n    },\n    placement: {\n      type: String as PropType<Placement>,\n      validator: (val: string): boolean => {\n        return [\n          'top',\n          'top-start',\n          'top-end',\n          'bottom',\n          'bottom-start',\n          'bottom-end',\n        ].includes(val)\n      },\n      default: 'bottom-start',\n    },\n    fetchSuggestions: {\n      type: Function as PropType<\n        (queryString: string, cb: (data: any[]) => void) => void\n      >,\n      default: NOOP,\n    },\n    popperClass: {\n      type: String,\n      default: '',\n    },\n    triggerOnFocus: {\n      type: Boolean,\n      default: true,\n    },\n    selectWhenUnmatched: {\n      type: Boolean,\n      default: false,\n    },\n    hideLoading: {\n      type: Boolean,\n      default: false,\n    },\n    popperAppendToBody: {\n      type: Boolean,\n      default: true,\n    },\n    highlightFirstItem: {\n      type: Boolean,\n      default: false,\n    },\n  },\n  emits: [\n    UPDATE_MODEL_EVENT,\n    'input',\n    'change',\n    'focus',\n    'blur',\n    'clear',\n    'select',\n  ],\n  setup(props, ctx) {\n    const attrs = useAttrs()\n    const suggestions = ref<any[]>([])\n    const highlightedIndex = ref(-1)\n    const dropdownWidth = ref('')\n    const activated = ref(false)\n    const suggestionDisabled = ref(false)\n    const loading = ref(false)\n    const inputRef = ref<{\n      inputOrTextarea: HTMLInputElement | HTMLTextAreaElement\n      focus: () => void\n      $el: HTMLElement\n    } | null>(null)\n    const regionRef = ref<HTMLElement | null>(null)\n    const popper = ref(null)\n\n    const id = computed(() => {\n      return `el-autocomplete-${generateId()}`\n    })\n    const suggestionVisible = computed(() => {\n      const isValidData =\n        isArray(suggestions.value) && suggestions.value.length > 0\n      return (isValidData || loading.value) && activated.value\n    })\n    const suggestionLoading = computed(() => {\n      return !props.hideLoading && loading.value\n    })\n\n    const onSuggestionShow = () => {\n      nextTick(() => {\n        if (suggestionVisible.value) {\n          dropdownWidth.value = `${inputRef.value!.$el.offsetWidth}px`\n        }\n      })\n    }\n\n    onMounted(() => {\n      inputRef.value!.inputOrTextarea.setAttribute('role', 'textbox')\n      inputRef.value!.inputOrTextarea.setAttribute('aria-autocomplete', 'list')\n      inputRef.value!.inputOrTextarea.setAttribute('aria-controls', 'id')\n      inputRef.value!.inputOrTextarea.setAttribute(\n        'aria-activedescendant',\n        `${id.value}-item-${highlightedIndex.value}`\n      )\n    })\n\n    const getData = (queryString: string) => {\n      if (suggestionDisabled.value) {\n        return\n      }\n      loading.value = true\n      props.fetchSuggestions(queryString, (suggestionsArg) => {\n        loading.value = false\n        if (suggestionDisabled.value) {\n          return\n        }\n        if (isArray(suggestionsArg)) {\n          suggestions.value = suggestionsArg\n          highlightedIndex.value = props.highlightFirstItem ? 0 : -1\n        } else {\n          throwError(\n            'ElAutocomplete',\n            'autocomplete suggestions must be an array'\n          )\n        }\n      })\n    }\n    const debouncedGetData = debounce(getData, props.debounce)\n    const handleInput = (value: string) => {\n      ctx.emit('input', value)\n      ctx.emit(UPDATE_MODEL_EVENT, value)\n      suggestionDisabled.value = false\n      if (!props.triggerOnFocus && !value) {\n        suggestionDisabled.value = true\n        suggestions.value = []\n        return\n      }\n      debouncedGetData(value)\n    }\n    const handleChange = (value) => {\n      ctx.emit('change', value)\n    }\n    const handleFocus = (e) => {\n      activated.value = true\n      ctx.emit('focus', e)\n      if (props.triggerOnFocus) {\n        debouncedGetData(String(props.modelValue))\n      }\n    }\n    const handleBlur = (e) => {\n      ctx.emit('blur', e)\n    }\n    const handleClear = () => {\n      activated.value = false\n      ctx.emit(UPDATE_MODEL_EVENT, '')\n      ctx.emit('clear')\n    }\n    const handleKeyEnter = () => {\n      if (\n        suggestionVisible.value &&\n        highlightedIndex.value >= 0 &&\n        highlightedIndex.value < suggestions.value.length\n      ) {\n        select(suggestions.value[highlightedIndex.value])\n      } else if (props.selectWhenUnmatched) {\n        ctx.emit('select', { value: props.modelValue })\n        nextTick(() => {\n          suggestions.value = []\n          highlightedIndex.value = -1\n        })\n      }\n    }\n    const close = () => {\n      activated.value = false\n    }\n    const focus = () => {\n      inputRef.value?.focus()\n    }\n    const select = (item) => {\n      ctx.emit('input', item[props.valueKey])\n      ctx.emit(UPDATE_MODEL_EVENT, item[props.valueKey])\n      ctx.emit('select', item)\n      nextTick(() => {\n        suggestions.value = []\n        highlightedIndex.value = -1\n      })\n    }\n    const highlight = (index: number) => {\n      if (!suggestionVisible.value || loading.value) {\n        return\n      }\n      if (index < 0) {\n        highlightedIndex.value = -1\n        return\n      }\n      if (index >= suggestions.value.length) {\n        index = suggestions.value.length - 1\n      }\n      const suggestion = regionRef.value!.querySelector(\n        '.el-autocomplete-suggestion__wrap'\n      )!\n      const suggestionList = suggestion.querySelectorAll(\n        '.el-autocomplete-suggestion__list li'\n      )!\n      const highlightItem = suggestionList[index]\n      const scrollTop = suggestion.scrollTop\n      const { offsetTop, scrollHeight } = highlightItem as HTMLElement\n\n      if (offsetTop + scrollHeight > scrollTop + suggestion.clientHeight) {\n        suggestion.scrollTop += scrollHeight\n      }\n      if (offsetTop < scrollTop) {\n        suggestion.scrollTop -= scrollHeight\n      }\n      highlightedIndex.value = index\n      inputRef.value!.inputOrTextarea.setAttribute(\n        'aria-activedescendant',\n        `${id.value}-item-${highlightedIndex.value}`\n      )\n    }\n\n    return {\n      attrs,\n      suggestions,\n      highlightedIndex,\n      dropdownWidth,\n      activated,\n      suggestionDisabled,\n      loading,\n      inputRef,\n      regionRef,\n      popper,\n\n      id,\n      suggestionVisible,\n      suggestionLoading,\n\n      getData,\n      handleInput,\n      handleChange,\n      handleFocus,\n      handleBlur,\n      handleClear,\n      handleKeyEnter,\n      close,\n      focus,\n      select,\n      highlight,\n      onSuggestionShow,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","ElTooltip","ElScrollbar","ElIcon","Loading","UPDATE_MODEL_EVENT","ref","computed","isArray","throwError","nextTick"],"mappings":"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"}

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

@@ -12,9 +12,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_loading = vue.resolveComponent("loading");
   const _component_el_icon = vue.resolveComponent("el-icon");
   const _component_el_scrollbar = vue.resolveComponent("el-scrollbar");
-  const _component_el_popper = vue.resolveComponent("el-popper");
+  const _component_el_tooltip = vue.resolveComponent("el-tooltip");
   const _directive_clickoutside = vue.resolveDirective("clickoutside");
-  return vue.openBlock(), vue.createBlock(_component_el_popper, {
+  return vue.openBlock(), vue.createBlock(_component_el_tooltip, {
     ref: "popper",
     visible: _ctx.suggestionVisible,
     "onUpdate:visible": _cache[2] || (_cache[2] = ($event) => _ctx.suggestionVisible = $event),
@@ -22,14 +22,59 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     "fallback-placements": ["bottom-start", "top-start"],
     "popper-class": `el-autocomplete__popper ${_ctx.popperClass}`,
     "append-to-body": _ctx.popperAppendToBody,
+    "gpu-acceleration": false,
     pure: "",
     "manual-mode": "",
-    effect: _ctx.Effect.LIGHT,
+    effect: "light",
     trigger: "click",
     transition: "el-zoom-in-top",
-    "gpu-acceleration": false
+    onShow: _ctx.onSuggestionShow
   }, {
-    trigger: vue.withCtx(() => [
+    content: vue.withCtx(() => [
+      vue.createElementVNode("div", {
+        ref: "regionRef",
+        class: vue.normalizeClass([
+          "el-autocomplete-suggestion",
+          _ctx.suggestionLoading && "is-loading"
+        ]),
+        style: vue.normalizeStyle({ minWidth: _ctx.dropdownWidth, outline: "none" }),
+        role: "region"
+      }, [
+        vue.createVNode(_component_el_scrollbar, {
+          id: _ctx.id,
+          tag: "ul",
+          "wrap-class": "el-autocomplete-suggestion__wrap",
+          "view-class": "el-autocomplete-suggestion__list",
+          role: "listbox"
+        }, {
+          default: vue.withCtx(() => [
+            _ctx.suggestionLoading ? (vue.openBlock(), vue.createElementBlock("li", _hoisted_2, [
+              vue.createVNode(_component_el_icon, { class: "is-loading" }, {
+                default: vue.withCtx(() => [
+                  vue.createVNode(_component_loading)
+                ]),
+                _: 1
+              })
+            ])) : (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 1 }, vue.renderList(_ctx.suggestions, (item, index) => {
+              return vue.openBlock(), vue.createElementBlock("li", {
+                id: `${_ctx.id}-item-${index}`,
+                key: index,
+                class: vue.normalizeClass({ highlighted: _ctx.highlightedIndex === index }),
+                role: "option",
+                "aria-selected": _ctx.highlightedIndex === index,
+                onClick: ($event) => _ctx.select(item)
+              }, [
+                vue.renderSlot(_ctx.$slots, "default", { item }, () => [
+                  vue.createTextVNode(vue.toDisplayString(item[_ctx.valueKey]), 1)
+                ])
+              ], 10, _hoisted_3);
+            }), 128))
+          ]),
+          _: 3
+        }, 8, ["id"])
+      ], 6)
+    ]),
+    default: vue.withCtx(() => [
       vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
         class: vue.normalizeClass(["el-autocomplete", _ctx.$attrs.class]),
         style: vue.normalizeStyle(_ctx.$attrs.style),
@@ -81,50 +126,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         [_directive_clickoutside, _ctx.close]
       ])
     ]),
-    default: vue.withCtx(() => [
-      vue.createElementVNode("div", {
-        ref: "regionRef",
-        class: vue.normalizeClass([
-          "el-autocomplete-suggestion",
-          _ctx.suggestionLoading && "is-loading"
-        ]),
-        style: vue.normalizeStyle({ minWidth: _ctx.dropdownWidth, outline: "none" }),
-        role: "region"
-      }, [
-        vue.createVNode(_component_el_scrollbar, {
-          tag: "ul",
-          "wrap-class": "el-autocomplete-suggestion__wrap",
-          "view-class": "el-autocomplete-suggestion__list"
-        }, {
-          default: vue.withCtx(() => [
-            _ctx.suggestionLoading ? (vue.openBlock(), vue.createElementBlock("li", _hoisted_2, [
-              vue.createVNode(_component_el_icon, { class: "is-loading" }, {
-                default: vue.withCtx(() => [
-                  vue.createVNode(_component_loading)
-                ]),
-                _: 1
-              })
-            ])) : (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 1 }, vue.renderList(_ctx.suggestions, (item, index) => {
-              return vue.openBlock(), vue.createElementBlock("li", {
-                id: `${_ctx.id}-item-${index}`,
-                key: index,
-                class: vue.normalizeClass({ highlighted: _ctx.highlightedIndex === index }),
-                role: "option",
-                "aria-selected": _ctx.highlightedIndex === index,
-                onClick: ($event) => _ctx.select(item)
-              }, [
-                vue.renderSlot(_ctx.$slots, "default", { item }, () => [
-                  vue.createTextVNode(vue.toDisplayString(item[_ctx.valueKey]), 1)
-                ])
-              ], 10, _hoisted_3);
-            }), 128))
-          ]),
-          _: 3
-        })
-      ], 6)
-    ]),
     _: 3
-  }, 8, ["visible", "placement", "popper-class", "append-to-body", "effect"]);
+  }, 8, ["visible", "placement", "popper-class", "append-to-body", "onShow"]);
 }
 
 exports.render = render;

package/lib/components/autocomplete/src/index.vue_vue_type_template_id_2f09f285_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.vue_vue_type_template_id_2f09f285_lang.js","sources":["../../../../../../packages/components/autocomplete/src/index.vue?vue&type=template&id=2f09f285&lang.js"],"sourcesContent":["<template>\n  <el-popper\n    ref=\"popper\"\n    v-model:visible=\"suggestionVisible\"\n    :placement=\"placement\"\n    :fallback-placements=\"['bottom-start', 'top-start']\"\n    :popper-class=\"`el-autocomplete__popper ${popperClass}`\"\n    :append-to-body=\"popperAppendToBody\"\n    pure\n    manual-mode\n    :effect=\"Effect.LIGHT\"\n    trigger=\"click\"\n    transition=\"el-zoom-in-top\"\n    :gpu-acceleration=\"false\"\n  >\n    <template #trigger>\n      <div\n        v-clickoutside=\"close\"\n        :class=\"['el-autocomplete', $attrs.class]\"\n        :style=\"$attrs.style\"\n        role=\"combobox\"\n        aria-haspopup=\"listbox\"\n        :aria-expanded=\"suggestionVisible\"\n        :aria-owns=\"id\"\n      >\n        <el-input\n          ref=\"inputRef\"\n          v-bind=\"attrs\"\n          :model-value=\"modelValue\"\n          @input=\"handleInput\"\n          @change=\"handleChange\"\n          @focus=\"handleFocus\"\n          @blur=\"handleBlur\"\n          @clear=\"handleClear\"\n          @keydown.up.prevent=\"highlight(highlightedIndex - 1)\"\n          @keydown.down.prevent=\"highlight(highlightedIndex + 1)\"\n          @keydown.enter=\"handleKeyEnter\"\n          @keydown.tab=\"close\"\n        >\n          <template v-if=\"$slots.prepend\" #prepend>\n            <slot name=\"prepend\"></slot>\n          </template>\n          <template v-if=\"$slots.append\" #append>\n            <slot name=\"append\"></slot>\n          </template>\n          <template v-if=\"$slots.prefix\" #prefix>\n            <slot name=\"prefix\"></slot>\n          </template>\n          <template v-if=\"$slots.suffix\" #suffix>\n            <slot name=\"suffix\"></slot>\n          </template>\n        </el-input>\n      </div>\n    </template>\n    <template #default>\n      <div\n        ref=\"regionRef\"\n        :class=\"[\n          'el-autocomplete-suggestion',\n          suggestionLoading && 'is-loading',\n        ]\"\n        :style=\"{ minWidth: dropdownWidth, outline: 'none' }\"\n        role=\"region\"\n      >\n        <el-scrollbar\n          tag=\"ul\"\n          wrap-class=\"el-autocomplete-suggestion__wrap\"\n          view-class=\"el-autocomplete-suggestion__list\"\n        >\n          <li v-if=\"suggestionLoading\">\n            <el-icon class=\"is-loading\"><loading /></el-icon>\n          </li>\n          <template v-else>\n            <li\n              v-for=\"(item, index) in suggestions\"\n              :id=\"`${id}-item-${index}`\"\n              :key=\"index\"\n              :class=\"{ highlighted: highlightedIndex === index }\"\n              role=\"option\"\n              :aria-selected=\"highlightedIndex === index\"\n              @click=\"select(item)\"\n            >\n              <slot :item=\"item\">{{ item[valueKey] }}</slot>\n            </li>\n          </template>\n        </el-scrollbar>\n      </div>\n    </template>\n  </el-popper>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  ref,\n  computed,\n  onMounted,\n  onUpdated,\n  nextTick,\n  watch,\n} from 'vue'\nimport { NOOP } from '@vue/shared'\nimport debounce from 'lodash/debounce'\nimport { useAttrs } from '@element-plus/hooks'\nimport { ClickOutside } from '@element-plus/directives'\nimport { generateId, isArray } from '@element-plus/utils/util'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { throwError } from '@element-plus/utils/error'\nimport ElInput from '@element-plus/components/input'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport ElPopper, { Effect } from '@element-plus/components/popper'\nimport ElIcon from '@element-plus/components/icon'\nimport { Loading } from '@element-plus/icons-vue'\n\nimport type { Placement } from '@element-plus/components/popper'\nimport type { PropType } from 'vue'\n\nexport default defineComponent({\n  name: 'ElAutocomplete',\n  components: {\n    ElPopper,\n    ElInput,\n    ElScrollbar,\n    ElIcon,\n    Loading,\n  },\n  directives: {\n    clickoutside: ClickOutside,\n  },\n  inheritAttrs: false,\n  props: {\n    valueKey: {\n      type: String,\n      default: 'value',\n    },\n    modelValue: {\n      type: [String, Number],\n      default: '',\n    },\n    debounce: {\n      type: Number,\n      default: 300,\n    },\n    placement: {\n      type: String as PropType<Placement>,\n      validator: (val: string): boolean => {\n        return [\n          'top',\n          'top-start',\n          'top-end',\n          'bottom',\n          'bottom-start',\n          'bottom-end',\n        ].includes(val)\n      },\n      default: 'bottom-start',\n    },\n    fetchSuggestions: {\n      type: Function as PropType<\n        (queryString: string, cb: (data: any[]) => void) => void\n      >,\n      default: NOOP,\n    },\n    popperClass: {\n      type: String,\n      default: '',\n    },\n    triggerOnFocus: {\n      type: Boolean,\n      default: true,\n    },\n    selectWhenUnmatched: {\n      type: Boolean,\n      default: false,\n    },\n    hideLoading: {\n      type: Boolean,\n      default: false,\n    },\n    popperAppendToBody: {\n      type: Boolean,\n      default: true,\n    },\n    highlightFirstItem: {\n      type: Boolean,\n      default: false,\n    },\n  },\n  emits: [\n    UPDATE_MODEL_EVENT,\n    'input',\n    'change',\n    'focus',\n    'blur',\n    'clear',\n    'select',\n  ],\n  setup(props, ctx) {\n    const attrs = useAttrs()\n    const suggestions = ref([])\n    const highlightedIndex = ref(-1)\n    const dropdownWidth = ref('')\n    const activated = ref(false)\n    const suggestionDisabled = ref(false)\n    const loading = ref(false)\n    const inputRef = ref(null)\n    const regionRef = ref(null)\n    const popper = ref(null)\n\n    const id = computed(() => {\n      return `el-autocomplete-${generateId()}`\n    })\n    const suggestionVisible = computed(() => {\n      const isValidData =\n        isArray(suggestions.value) && suggestions.value.length > 0\n      return (isValidData || loading.value) && activated.value\n    })\n    const suggestionLoading = computed(() => {\n      return !props.hideLoading && loading.value\n    })\n\n    const updatePopperPosition = () => {\n      nextTick(popper.value.update)\n    }\n\n    watch(suggestionVisible, () => {\n      dropdownWidth.value = `${inputRef.value.$el.offsetWidth}px`\n    })\n\n    onMounted(() => {\n      inputRef.value.inputOrTextarea.setAttribute('role', 'textbox')\n      inputRef.value.inputOrTextarea.setAttribute('aria-autocomplete', 'list')\n      inputRef.value.inputOrTextarea.setAttribute('aria-controls', 'id')\n      inputRef.value.inputOrTextarea.setAttribute(\n        'aria-activedescendant',\n        `${id.value}-item-${highlightedIndex.value}`\n      )\n      const $ul = regionRef.value.querySelector(\n        '.el-autocomplete-suggestion__list'\n      )\n      $ul.setAttribute('role', 'listbox')\n      $ul.setAttribute('id', id.value)\n    })\n\n    onUpdated(updatePopperPosition)\n\n    const getData = (queryString) => {\n      if (suggestionDisabled.value) {\n        return\n      }\n      loading.value = true\n      updatePopperPosition()\n      props.fetchSuggestions(queryString, (suggestionsArg) => {\n        loading.value = false\n        if (suggestionDisabled.value) {\n          return\n        }\n        if (isArray(suggestionsArg)) {\n          suggestions.value = suggestionsArg\n          highlightedIndex.value = props.highlightFirstItem ? 0 : -1\n        } else {\n          throwError(\n            'ElAutocomplete',\n            'autocomplete suggestions must be an array'\n          )\n        }\n      })\n    }\n    const debouncedGetData = debounce(getData, props.debounce)\n    const handleInput = (value) => {\n      ctx.emit('input', value)\n      ctx.emit(UPDATE_MODEL_EVENT, value)\n      suggestionDisabled.value = false\n      if (!props.triggerOnFocus && !value) {\n        suggestionDisabled.value = true\n        suggestions.value = []\n        return\n      }\n      debouncedGetData(value)\n    }\n    const handleChange = (value) => {\n      ctx.emit('change', value)\n    }\n    const handleFocus = (e) => {\n      activated.value = true\n      ctx.emit('focus', e)\n      if (props.triggerOnFocus) {\n        debouncedGetData(props.modelValue)\n      }\n    }\n    const handleBlur = (e) => {\n      ctx.emit('blur', e)\n    }\n    const handleClear = () => {\n      activated.value = false\n      ctx.emit(UPDATE_MODEL_EVENT, '')\n      ctx.emit('clear')\n    }\n    const handleKeyEnter = () => {\n      if (\n        suggestionVisible.value &&\n        highlightedIndex.value >= 0 &&\n        highlightedIndex.value < suggestions.value.length\n      ) {\n        select(suggestions.value[highlightedIndex.value])\n      } else if (props.selectWhenUnmatched) {\n        ctx.emit('select', { value: props.modelValue })\n        nextTick(() => {\n          suggestions.value = []\n          highlightedIndex.value = -1\n        })\n      }\n    }\n    const close = () => {\n      activated.value = false\n    }\n    const focus = () => {\n      inputRef.value.focus()\n    }\n    const select = (item) => {\n      ctx.emit('input', item[props.valueKey])\n      ctx.emit(UPDATE_MODEL_EVENT, item[props.valueKey])\n      ctx.emit('select', item)\n      nextTick(() => {\n        suggestions.value = []\n        highlightedIndex.value = -1\n      })\n    }\n    const highlight = (index) => {\n      if (!suggestionVisible.value || loading.value) {\n        return\n      }\n      if (index < 0) {\n        highlightedIndex.value = -1\n        return\n      }\n      if (index >= suggestions.value.length) {\n        index = suggestions.value.length - 1\n      }\n      const suggestion = regionRef.value.querySelector(\n        '.el-autocomplete-suggestion__wrap'\n      )\n      const suggestionList = suggestion.querySelectorAll(\n        '.el-autocomplete-suggestion__list li'\n      )\n      const highlightItem = suggestionList[index]\n      const scrollTop = suggestion.scrollTop\n      const { offsetTop, scrollHeight } = highlightItem\n\n      if (offsetTop + scrollHeight > scrollTop + suggestion.clientHeight) {\n        suggestion.scrollTop += scrollHeight\n      }\n      if (offsetTop < scrollTop) {\n        suggestion.scrollTop -= scrollHeight\n      }\n      highlightedIndex.value = index\n      inputRef.value.inputOrTextarea.setAttribute(\n        'aria-activedescendant',\n        `${id.value}-item-${highlightedIndex.value}`\n      )\n    }\n\n    return {\n      Effect,\n\n      attrs,\n      suggestions,\n      highlightedIndex,\n      dropdownWidth,\n      activated,\n      suggestionDisabled,\n      loading,\n      inputRef,\n      regionRef,\n      popper,\n\n      id,\n      suggestionVisible,\n      suggestionLoading,\n\n      getData,\n      handleInput,\n      handleChange,\n      handleFocus,\n      handleBlur,\n      handleClear,\n      handleKeyEnter,\n      close,\n      focus,\n      select,\n      highlight,\n    }\n  },\n})\n</script>\n"],"names":["_createVNode"],"mappings":";;;;;;;;;;;;;;;;;;;wBACE;IACE;IACQ;;IACP;IACA;IACA;IACA;IACD;IACA;IACC,oBAAe,KAAK;;IAErB;;;;;QAMK;QACA;QACD;;QAECA;;;;UAME,aAAW;UACX;UACA;UACA,SAAO;kBACD,eAAU;mBACT,gBAAW;;;;;sBAIL,UAAK;;;iCAEW;;;;kBAC5B;;;;WAEc;;;;;;;;;;iCAGsB;;;;;;;;yBAGN;;;;;;;;;;;;;;;;;;;;;;eAiB5B;;;;;;;;;;;;;;;;;;;;;oBAeC;;;;;"}
+{"version":3,"file":"index.vue_vue_type_template_id_2f09f285_lang.js","sources":["../../../../../../packages/components/autocomplete/src/index.vue?vue&type=template&id=2f09f285&lang.js"],"sourcesContent":["<template>\n  <el-tooltip\n    ref=\"popper\"\n    v-model:visible=\"suggestionVisible\"\n    :placement=\"placement\"\n    :fallback-placements=\"['bottom-start', 'top-start']\"\n    :popper-class=\"`el-autocomplete__popper ${popperClass}`\"\n    :append-to-body=\"popperAppendToBody\"\n    :gpu-acceleration=\"false\"\n    pure\n    manual-mode\n    effect=\"light\"\n    trigger=\"click\"\n    transition=\"el-zoom-in-top\"\n    @show=\"onSuggestionShow\"\n  >\n    <div\n      v-clickoutside=\"close\"\n      :class=\"['el-autocomplete', $attrs.class]\"\n      :style=\"$attrs.style\"\n      role=\"combobox\"\n      aria-haspopup=\"listbox\"\n      :aria-expanded=\"suggestionVisible\"\n      :aria-owns=\"id\"\n    >\n      <el-input\n        ref=\"inputRef\"\n        v-bind=\"attrs\"\n        :model-value=\"modelValue\"\n        @input=\"handleInput\"\n        @change=\"handleChange\"\n        @focus=\"handleFocus\"\n        @blur=\"handleBlur\"\n        @clear=\"handleClear\"\n        @keydown.up.prevent=\"highlight(highlightedIndex - 1)\"\n        @keydown.down.prevent=\"highlight(highlightedIndex + 1)\"\n        @keydown.enter=\"handleKeyEnter\"\n        @keydown.tab=\"close\"\n      >\n        <template v-if=\"$slots.prepend\" #prepend>\n          <slot name=\"prepend\"></slot>\n        </template>\n        <template v-if=\"$slots.append\" #append>\n          <slot name=\"append\"></slot>\n        </template>\n        <template v-if=\"$slots.prefix\" #prefix>\n          <slot name=\"prefix\"></slot>\n        </template>\n        <template v-if=\"$slots.suffix\" #suffix>\n          <slot name=\"suffix\"></slot>\n        </template>\n      </el-input>\n    </div>\n    <template #content>\n      <div\n        ref=\"regionRef\"\n        :class=\"[\n          'el-autocomplete-suggestion',\n          suggestionLoading && 'is-loading',\n        ]\"\n        :style=\"{ minWidth: dropdownWidth, outline: 'none' }\"\n        role=\"region\"\n      >\n        <el-scrollbar\n          :id=\"id\"\n          tag=\"ul\"\n          wrap-class=\"el-autocomplete-suggestion__wrap\"\n          view-class=\"el-autocomplete-suggestion__list\"\n          role=\"listbox\"\n        >\n          <li v-if=\"suggestionLoading\">\n            <el-icon class=\"is-loading\"><loading /></el-icon>\n          </li>\n          <template v-else>\n            <li\n              v-for=\"(item, index) in suggestions\"\n              :id=\"`${id}-item-${index}`\"\n              :key=\"index\"\n              :class=\"{ highlighted: highlightedIndex === index }\"\n              role=\"option\"\n              :aria-selected=\"highlightedIndex === index\"\n              @click=\"select(item)\"\n            >\n              <slot :item=\"item\">{{ item[valueKey] }}</slot>\n            </li>\n          </template>\n        </el-scrollbar>\n      </div>\n    </template>\n  </el-tooltip>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, computed, onMounted, nextTick } from 'vue'\nimport { NOOP } from '@vue/shared'\nimport debounce from 'lodash/debounce'\nimport { useAttrs } from '@element-plus/hooks'\nimport { ClickOutside } from '@element-plus/directives'\nimport { generateId, isArray } from '@element-plus/utils/util'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { throwError } from '@element-plus/utils/error'\nimport ElInput from '@element-plus/components/input'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElIcon from '@element-plus/components/icon'\nimport { Loading } from '@element-plus/icons-vue'\n\nimport type { Placement } from '@element-plus/components/popper'\nimport type { PropType } from 'vue'\n\nexport default defineComponent({\n  name: 'ElAutocomplete',\n  components: {\n    ElTooltip,\n    ElInput,\n    ElScrollbar,\n    ElIcon,\n    Loading,\n  },\n  directives: {\n    clickoutside: ClickOutside,\n  },\n  inheritAttrs: false,\n  props: {\n    valueKey: {\n      type: String,\n      default: 'value',\n    },\n    modelValue: {\n      type: [String, Number],\n      default: '',\n    },\n    debounce: {\n      type: Number,\n      default: 300,\n    },\n    placement: {\n      type: String as PropType<Placement>,\n      validator: (val: string): boolean => {\n        return [\n          'top',\n          'top-start',\n          'top-end',\n          'bottom',\n          'bottom-start',\n          'bottom-end',\n        ].includes(val)\n      },\n      default: 'bottom-start',\n    },\n    fetchSuggestions: {\n      type: Function as PropType<\n        (queryString: string, cb: (data: any[]) => void) => void\n      >,\n      default: NOOP,\n    },\n    popperClass: {\n      type: String,\n      default: '',\n    },\n    triggerOnFocus: {\n      type: Boolean,\n      default: true,\n    },\n    selectWhenUnmatched: {\n      type: Boolean,\n      default: false,\n    },\n    hideLoading: {\n      type: Boolean,\n      default: false,\n    },\n    popperAppendToBody: {\n      type: Boolean,\n      default: true,\n    },\n    highlightFirstItem: {\n      type: Boolean,\n      default: false,\n    },\n  },\n  emits: [\n    UPDATE_MODEL_EVENT,\n    'input',\n    'change',\n    'focus',\n    'blur',\n    'clear',\n    'select',\n  ],\n  setup(props, ctx) {\n    const attrs = useAttrs()\n    const suggestions = ref<any[]>([])\n    const highlightedIndex = ref(-1)\n    const dropdownWidth = ref('')\n    const activated = ref(false)\n    const suggestionDisabled = ref(false)\n    const loading = ref(false)\n    const inputRef = ref<{\n      inputOrTextarea: HTMLInputElement | HTMLTextAreaElement\n      focus: () => void\n      $el: HTMLElement\n    } | null>(null)\n    const regionRef = ref<HTMLElement | null>(null)\n    const popper = ref(null)\n\n    const id = computed(() => {\n      return `el-autocomplete-${generateId()}`\n    })\n    const suggestionVisible = computed(() => {\n      const isValidData =\n        isArray(suggestions.value) && suggestions.value.length > 0\n      return (isValidData || loading.value) && activated.value\n    })\n    const suggestionLoading = computed(() => {\n      return !props.hideLoading && loading.value\n    })\n\n    const onSuggestionShow = () => {\n      nextTick(() => {\n        if (suggestionVisible.value) {\n          dropdownWidth.value = `${inputRef.value!.$el.offsetWidth}px`\n        }\n      })\n    }\n\n    onMounted(() => {\n      inputRef.value!.inputOrTextarea.setAttribute('role', 'textbox')\n      inputRef.value!.inputOrTextarea.setAttribute('aria-autocomplete', 'list')\n      inputRef.value!.inputOrTextarea.setAttribute('aria-controls', 'id')\n      inputRef.value!.inputOrTextarea.setAttribute(\n        'aria-activedescendant',\n        `${id.value}-item-${highlightedIndex.value}`\n      )\n    })\n\n    const getData = (queryString: string) => {\n      if (suggestionDisabled.value) {\n        return\n      }\n      loading.value = true\n      props.fetchSuggestions(queryString, (suggestionsArg) => {\n        loading.value = false\n        if (suggestionDisabled.value) {\n          return\n        }\n        if (isArray(suggestionsArg)) {\n          suggestions.value = suggestionsArg\n          highlightedIndex.value = props.highlightFirstItem ? 0 : -1\n        } else {\n          throwError(\n            'ElAutocomplete',\n            'autocomplete suggestions must be an array'\n          )\n        }\n      })\n    }\n    const debouncedGetData = debounce(getData, props.debounce)\n    const handleInput = (value: string) => {\n      ctx.emit('input', value)\n      ctx.emit(UPDATE_MODEL_EVENT, value)\n      suggestionDisabled.value = false\n      if (!props.triggerOnFocus && !value) {\n        suggestionDisabled.value = true\n        suggestions.value = []\n        return\n      }\n      debouncedGetData(value)\n    }\n    const handleChange = (value) => {\n      ctx.emit('change', value)\n    }\n    const handleFocus = (e) => {\n      activated.value = true\n      ctx.emit('focus', e)\n      if (props.triggerOnFocus) {\n        debouncedGetData(String(props.modelValue))\n      }\n    }\n    const handleBlur = (e) => {\n      ctx.emit('blur', e)\n    }\n    const handleClear = () => {\n      activated.value = false\n      ctx.emit(UPDATE_MODEL_EVENT, '')\n      ctx.emit('clear')\n    }\n    const handleKeyEnter = () => {\n      if (\n        suggestionVisible.value &&\n        highlightedIndex.value >= 0 &&\n        highlightedIndex.value < suggestions.value.length\n      ) {\n        select(suggestions.value[highlightedIndex.value])\n      } else if (props.selectWhenUnmatched) {\n        ctx.emit('select', { value: props.modelValue })\n        nextTick(() => {\n          suggestions.value = []\n          highlightedIndex.value = -1\n        })\n      }\n    }\n    const close = () => {\n      activated.value = false\n    }\n    const focus = () => {\n      inputRef.value?.focus()\n    }\n    const select = (item) => {\n      ctx.emit('input', item[props.valueKey])\n      ctx.emit(UPDATE_MODEL_EVENT, item[props.valueKey])\n      ctx.emit('select', item)\n      nextTick(() => {\n        suggestions.value = []\n        highlightedIndex.value = -1\n      })\n    }\n    const highlight = (index: number) => {\n      if (!suggestionVisible.value || loading.value) {\n        return\n      }\n      if (index < 0) {\n        highlightedIndex.value = -1\n        return\n      }\n      if (index >= suggestions.value.length) {\n        index = suggestions.value.length - 1\n      }\n      const suggestion = regionRef.value!.querySelector(\n        '.el-autocomplete-suggestion__wrap'\n      )!\n      const suggestionList = suggestion.querySelectorAll(\n        '.el-autocomplete-suggestion__list li'\n      )!\n      const highlightItem = suggestionList[index]\n      const scrollTop = suggestion.scrollTop\n      const { offsetTop, scrollHeight } = highlightItem as HTMLElement\n\n      if (offsetTop + scrollHeight > scrollTop + suggestion.clientHeight) {\n        suggestion.scrollTop += scrollHeight\n      }\n      if (offsetTop < scrollTop) {\n        suggestion.scrollTop -= scrollHeight\n      }\n      highlightedIndex.value = index\n      inputRef.value!.inputOrTextarea.setAttribute(\n        'aria-activedescendant',\n        `${id.value}-item-${highlightedIndex.value}`\n      )\n    }\n\n    return {\n      attrs,\n      suggestions,\n      highlightedIndex,\n      dropdownWidth,\n      activated,\n      suggestionDisabled,\n      loading,\n      inputRef,\n      regionRef,\n      popper,\n\n      id,\n      suggestionVisible,\n      suggestionLoading,\n\n      getData,\n      handleInput,\n      handleChange,\n      handleFocus,\n      handleBlur,\n      handleClear,\n      handleKeyEnter,\n      close,\n      focus,\n      select,\n      highlight,\n      onSuggestionShow,\n    }\n  },\n})\n</script>\n"],"names":["_createVNode"],"mappings":";;;;;;;;;;;;;;;;;;;wBACE;IACE;IACQ;;IACP;IACA;IACA;IACA;IACA;IACD;IACA;IACA,MAAM,EAAC;;IAEP;oCACuB;;;;;;;;;QA8ClBA;YACG,EAAC;;;UAGF;UACD;;UAEA;gBACK;;;;;;;sCAGoC;;;;;;;gDAKb;;6DAED;;;;;;;;;;;;;;;;;QA5D9B;;QAEDA;uBACa,EAAC;uBACA;;;;UAMX,aAAW;UACX,SAAO;kBACD,EAAE;mBACD,gBAAW;;sCAEA;;;;;;;;WAMH;;;;;;;;;;iCAGsB;;;;;;;;;;;;;;;;;;;;"}