element-plus 1.2.0-beta.6 → 1.3.0-beta.1

package/lib/components/select-v2/index.d.ts

@@ -76,7 +76,7 @@ declare const _Select: SFCWithInstall<import("vue").DefineComponent<{
         default: boolean;
     };
 }, {
-    collapseTagSize: import("vue").ComputedRef<"small" | "mini">;
+    collapseTagSize: import("vue").ComputedRef<"default" | "small">;
     currentPlaceholder: import("vue").ComputedRef<string>;
     expanded: import("vue").Ref<boolean>;
     emptyText: import("vue").ComputedRef<string | false | null>;
@@ -91,7 +91,7 @@ declare const _Select: SFCWithInstall<import("vue").DefineComponent<{
     hasModelValue: import("vue").ComputedRef<boolean>;
     shouldShowPlaceholder: import("vue").ComputedRef<boolean>;
     selectDisabled: import("vue").ComputedRef<boolean | undefined>;
-    selectSize: import("vue").ComputedRef<"" | import("element-plus/es/utils/types").ComponentSize>;
+    selectSize: import("vue").ComputedRef<import("element-plus/es/utils/types").ComponentSize>;
     showClearBtn: import("vue").ComputedRef<boolean>;
     states: {
         inputValue: string;
@@ -137,6 +137,8 @@ declare const _Select: SFCWithInstall<import("vue").DefineComponent<{
     selectRef: import("vue").Ref<null>;
     selectionRef: import("vue").Ref<null>;
     popperRef: import("vue").ComputedRef<any>;
+    validateState: import("vue").ComputedRef<string>;
+    validateIcon: import("vue").ComputedRef<any>;
     Effect: typeof import("..").Effect;
     debouncedOnInputChange: import("lodash").DebouncedFunc<() => Promise<void>>;
     deleteTag: (event: MouseEvent, tag: import("./src/select.types").Option<any>) => Promise<void> | undefined;
@@ -342,7 +344,7 @@ export declare const ElSelectV2: SFCWithInstall<import("vue").DefineComponent<{
         default: boolean;
     };
 }, {
-    collapseTagSize: import("vue").ComputedRef<"small" | "mini">;
+    collapseTagSize: import("vue").ComputedRef<"default" | "small">;
     currentPlaceholder: import("vue").ComputedRef<string>;
     expanded: import("vue").Ref<boolean>;
     emptyText: import("vue").ComputedRef<string | false | null>;
@@ -357,7 +359,7 @@ export declare const ElSelectV2: SFCWithInstall<import("vue").DefineComponent<{
     hasModelValue: import("vue").ComputedRef<boolean>;
     shouldShowPlaceholder: import("vue").ComputedRef<boolean>;
     selectDisabled: import("vue").ComputedRef<boolean | undefined>;
-    selectSize: import("vue").ComputedRef<"" | import("element-plus/es/utils/types").ComponentSize>;
+    selectSize: import("vue").ComputedRef<import("element-plus/es/utils/types").ComponentSize>;
     showClearBtn: import("vue").ComputedRef<boolean>;
     states: {
         inputValue: string;
@@ -403,6 +405,8 @@ export declare const ElSelectV2: SFCWithInstall<import("vue").DefineComponent<{
     selectRef: import("vue").Ref<null>;
     selectionRef: import("vue").Ref<null>;
     popperRef: import("vue").ComputedRef<any>;
+    validateState: import("vue").ComputedRef<string>;
+    validateIcon: import("vue").ComputedRef<any>;
     Effect: typeof import("..").Effect;
     debouncedOnInputChange: import("lodash").DebouncedFunc<() => Promise<void>>;
     deleteTag: (event: MouseEvent, tag: import("./src/select.types").Option<any>) => Promise<void> | undefined;

package/lib/components/select-v2/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../packages/components/select-v2/index.ts"],"sourcesContent":["import Select from './src/select.vue'\n\nimport type { App } from 'vue'\nimport type { SFCWithInstall } from '@element-plus/utils/types'\n\nSelect.install = (app: App): void => {\n  app.component(Select.name, Select)\n}\n\nconst _Select = Select as SFCWithInstall<typeof Select>\n\nexport default _Select\nexport const ElSelectV2 = _Select\n\nexport * from './src/token'\n"],"names":["Select"],"mappings":";;;;;;;;AAKAA,2CAAO,UAAU,CAAC,QAAmB;AACnC,MAAI,UAAUA,2CAAO,MAAMA;AAAA;MAGvB,UAAUA;MAGH,aAAa;;;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../packages/components/select-v2/index.ts"],"sourcesContent":["import Select from './src/select.vue'\n\nimport type { App } from 'vue'\nimport type { SFCWithInstall } from '@element-plus/utils/types'\n\nSelect.install = (app: App): void => {\n  app.component(Select.name, Select)\n}\n\nconst _Select = Select as SFCWithInstall<typeof Select>\n\nexport default _Select\nexport const ElSelectV2 = _Select\n\nexport * from './src/token'\n"],"names":["Select"],"mappings":";;;;;;;;AACAA,0CAAM,CAAC,OAAO,GAAG,CAAC,GAAG,KAAK;AAC1B,EAAE,GAAG,CAAC,SAAS,CAACA,0CAAM,CAAC,IAAI,EAAEA,0CAAM,CAAC,CAAC;AACrC,CAAC,CAAC;AACG,MAAC,OAAO,GAAGA,2CAAO;AAEX,MAAC,UAAU,GAAG;;;;;;"}

package/lib/components/select-v2/src/defaults.js.map

@@ -1 +1 @@
-{"version":3,"file":"defaults.js","sources":["../../../../../../packages/components/select-v2/src/defaults.ts"],"sourcesContent":["import { isValidComponentSize } from '@element-plus/utils/validators'\nimport { CircleClose } from '@element-plus/icons-vue'\n\nimport type { PropType, Component } from 'vue'\nimport type { ComponentSize } from '@element-plus/utils/types'\nimport type { OptionType } from './select.types'\nimport type { Options } from '@element-plus/components/popper'\n\nexport const SelectProps = {\n  allowCreate: Boolean,\n  autocomplete: {\n    type: String as PropType<'none' | 'both' | 'list' | 'inline'>,\n    default: 'none',\n  },\n  automaticDropdown: Boolean,\n  clearable: Boolean,\n  clearIcon: {\n    type: [String, Object] as PropType<string | Component>,\n    default: CircleClose,\n  },\n  collapseTags: Boolean,\n  defaultFirstOption: Boolean,\n  disabled: Boolean,\n  estimatedOptionHeight: {\n    type: Number,\n    default: undefined,\n  },\n  filterable: Boolean,\n  filterMethod: Function,\n  height: {\n    type: Number,\n    default: 170, // 5 items by default\n  },\n  itemHeight: {\n    type: Number,\n    default: 34,\n  },\n  id: String,\n  loading: Boolean,\n  loadingText: String,\n  label: String,\n  modelValue: [Array, String, Number, Boolean, Object] as PropType<\n    any[] | string | number | boolean | Record<string, any> | any\n  >,\n  multiple: Boolean,\n  multipleLimit: {\n    type: Number,\n    default: 0,\n  },\n  name: String,\n  noDataText: String,\n  noMatchText: String,\n  remoteMethod: Function,\n  reserveKeyword: Boolean,\n  options: {\n    type: Array as PropType<OptionType[]>,\n    required: true,\n  },\n  placeholder: {\n    type: String,\n  },\n  popperAppendToBody: {\n    type: Boolean,\n    default: true,\n  },\n  popperClass: {\n    type: String,\n    default: '',\n  },\n  popperOptions: {\n    type: Object as PropType<Partial<Options>>,\n    default: () => ({} as Partial<Options>),\n  },\n  remote: Boolean,\n  size: {\n    type: String as PropType<ComponentSize>,\n    validator: isValidComponentSize,\n  },\n  valueKey: {\n    type: String,\n    default: 'value',\n  },\n  scrollbarAlwaysOn: {\n    type: Boolean,\n    default: false,\n  },\n}\n\nexport const OptionProps = {\n  data: Array,\n  disabled: Boolean,\n  hovering: Boolean,\n  item: Object,\n  index: Number,\n  style: Object,\n  selected: Boolean,\n  created: Boolean,\n}\n"],"names":["CircleClose","isValidComponentSize"],"mappings":";;;;;;;MAQa,cAAc;AAAA,EACzB,aAAa;AAAA,EACb,cAAc;AAAA,IACZ,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,mBAAmB;AAAA,EACnB,WAAW;AAAA,EACX,WAAW;AAAA,IACT,MAAM,CAAC,QAAQ;AAAA,IACf,SAASA;AAAA;AAAA,EAEX,cAAc;AAAA,EACd,oBAAoB;AAAA,EACpB,UAAU;AAAA,EACV,uBAAuB;AAAA,IACrB,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,QAAQ;AAAA,IACN,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,YAAY;AAAA,IACV,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,IAAI;AAAA,EACJ,SAAS;AAAA,EACT,aAAa;AAAA,EACb,OAAO;AAAA,EACP,YAAY,CAAC,OAAO,QAAQ,QAAQ,SAAS;AAAA,EAG7C,UAAU;AAAA,EACV,eAAe;AAAA,IACb,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,cAAc;AAAA,EACd,gBAAgB;AAAA,EAChB,SAAS;AAAA,IACP,MAAM;AAAA,IACN,UAAU;AAAA;AAAA,EAEZ,aAAa;AAAA,IACX,MAAM;AAAA;AAAA,EAER,oBAAoB;AAAA,IAClB,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,aAAa;AAAA,IACX,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,eAAe;AAAA,IACb,MAAM;AAAA,IACN,SAAS;AAAO;AAAA,EAElB,QAAQ;AAAA,EACR,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,WAAWC;AAAA;AAAA,EAEb,UAAU;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,mBAAmB;AAAA,IACjB,MAAM;AAAA,IACN,SAAS;AAAA;AAAA;MAIA,cAAc;AAAA,EACzB,MAAM;AAAA,EACN,UAAU;AAAA,EACV,UAAU;AAAA,EACV,MAAM;AAAA,EACN,OAAO;AAAA,EACP,OAAO;AAAA,EACP,UAAU;AAAA,EACV,SAAS;AAAA;;;;;"}
+{"version":3,"file":"defaults.js","sources":["../../../../../../packages/components/select-v2/src/defaults.ts"],"sourcesContent":["import { isValidComponentSize } from '@element-plus/utils/validators'\nimport { CircleClose } from '@element-plus/icons-vue'\n\nimport type { PropType, Component } from 'vue'\nimport type { ComponentSize } from '@element-plus/utils/types'\nimport type { OptionType } from './select.types'\nimport type { Options } from '@element-plus/components/popper'\n\nexport const SelectProps = {\n  allowCreate: Boolean,\n  autocomplete: {\n    type: String as PropType<'none' | 'both' | 'list' | 'inline'>,\n    default: 'none',\n  },\n  automaticDropdown: Boolean,\n  clearable: Boolean,\n  clearIcon: {\n    type: [String, Object] as PropType<string | Component>,\n    default: CircleClose,\n  },\n  collapseTags: Boolean,\n  defaultFirstOption: Boolean,\n  disabled: Boolean,\n  estimatedOptionHeight: {\n    type: Number,\n    default: undefined,\n  },\n  filterable: Boolean,\n  filterMethod: Function,\n  height: {\n    type: Number,\n    default: 170, // 5 items by default\n  },\n  itemHeight: {\n    type: Number,\n    default: 34,\n  },\n  id: String,\n  loading: Boolean,\n  loadingText: String,\n  label: String,\n  modelValue: [Array, String, Number, Boolean, Object] as PropType<\n    any[] | string | number | boolean | Record<string, any> | any\n  >,\n  multiple: Boolean,\n  multipleLimit: {\n    type: Number,\n    default: 0,\n  },\n  name: String,\n  noDataText: String,\n  noMatchText: String,\n  remoteMethod: Function,\n  reserveKeyword: Boolean,\n  options: {\n    type: Array as PropType<OptionType[]>,\n    required: true,\n  },\n  placeholder: {\n    type: String,\n  },\n  popperAppendToBody: {\n    type: Boolean,\n    default: true,\n  },\n  popperClass: {\n    type: String,\n    default: '',\n  },\n  popperOptions: {\n    type: Object as PropType<Partial<Options>>,\n    default: () => ({} as Partial<Options>),\n  },\n  remote: Boolean,\n  size: {\n    type: String as PropType<ComponentSize>,\n    validator: isValidComponentSize,\n  },\n  valueKey: {\n    type: String,\n    default: 'value',\n  },\n  scrollbarAlwaysOn: {\n    type: Boolean,\n    default: false,\n  },\n}\n\nexport const OptionProps = {\n  data: Array,\n  disabled: Boolean,\n  hovering: Boolean,\n  item: Object,\n  index: Number,\n  style: Object,\n  selected: Boolean,\n  created: Boolean,\n}\n"],"names":["CircleClose","isValidComponentSize"],"mappings":"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"}

package/lib/components/select-v2/src/group-item.vue_vue_type_script_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"group-item.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/select-v2/src/group-item.vue"],"sourcesContent":["<template>\n  <div\n    v-if=\"item.isTitle\"\n    class=\"el-select-group__title\"\n    :style=\"[style, { lineHeight: `${height}px` }]\"\n  >\n    {{ item.label }}\n  </div>\n  <div v-else class=\"el-select-group__split\" :style=\"style\">\n    <span\n      class=\"el-select-group__split-dash\"\n      :style=\"{ top: `${height / 2}px` }\"\n    ></span>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent } from 'vue'\n\nexport default defineComponent({\n  props: {\n    item: {\n      type: Object,\n      required: true,\n    },\n    style: Object,\n    height: Number,\n  },\n})\n</script>\n"],"names":["defineComponent"],"mappings":";;;;;;AAmBA,aAAeA,oBAAgB;AAAA,EAC7B,OAAO;AAAA,IACL,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,UAAU;AAAA;AAAA,IAEZ,OAAO;AAAA,IACP,QAAQ;AAAA;AAAA;;;;"}
+{"version":3,"file":"group-item.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/select-v2/src/group-item.vue"],"sourcesContent":["<template>\n  <div\n    v-if=\"item.isTitle\"\n    class=\"el-select-group__title\"\n    :style=\"[style, { lineHeight: `${height}px` }]\"\n  >\n    {{ item.label }}\n  </div>\n  <div v-else class=\"el-select-group__split\" :style=\"style\">\n    <span\n      class=\"el-select-group__split-dash\"\n      :style=\"{ top: `${height / 2}px` }\"\n    ></span>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent } from 'vue'\n\nexport default defineComponent({\n  props: {\n    item: {\n      type: Object,\n      required: true,\n    },\n    style: Object,\n    height: Number,\n  },\n})\n</script>\n"],"names":["defineComponent"],"mappings":";;;;;;AAiBA,aAAeA,mBAAe;;AAE9B,IAAI,IAAI,EAAE;MACJ;MACA;;SAEG,EAAE,MAAM;IACb;;;;;;"}

package/lib/components/select-v2/src/group-item.vue_vue_type_template_id_bef7365a_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"group-item.vue_vue_type_template_id_bef7365a_lang.js","sources":["../../../../../../packages/components/select-v2/src/group-item.vue?vue&type=template&id=bef7365a&lang.js"],"sourcesContent":["<template>\n  <div\n    v-if=\"item.isTitle\"\n    class=\"el-select-group__title\"\n    :style=\"[style, { lineHeight: `${height}px` }]\"\n  >\n    {{ item.label }}\n  </div>\n  <div v-else class=\"el-select-group__split\" :style=\"style\">\n    <span\n      class=\"el-select-group__split-dash\"\n      :style=\"{ top: `${height / 2}px` }\"\n    ></span>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent } from 'vue'\n\nexport default defineComponent({\n  props: {\n    item: {\n      type: Object,\n      required: true,\n    },\n    style: Object,\n    height: Number,\n  },\n})\n</script>\n"],"names":["_createElementBlock","_createElementVNode"],"mappings":";;;;;;;SAEU,UAAK,4BADbA;;IAEE,OAAM;AAAA,IACL,2BAAQ,6BAAwB;yBAE9B,UAAK,gCAEVA;;IAAY,OAAM;AAAA,IAA0B,0BAAO;;IACjDC;MACE,OAAM;AAAA,MACL,oCAAiB;;;;;;;"}
+{"version":3,"file":"group-item.vue_vue_type_template_id_bef7365a_lang.js","sources":["../../../../../../packages/components/select-v2/src/group-item.vue?vue&type=template&id=bef7365a&lang.js"],"sourcesContent":["<template>\n  <div\n    v-if=\"item.isTitle\"\n    class=\"el-select-group__title\"\n    :style=\"[style, { lineHeight: `${height}px` }]\"\n  >\n    {{ item.label }}\n  </div>\n  <div v-else class=\"el-select-group__split\" :style=\"style\">\n    <span\n      class=\"el-select-group__split-dash\"\n      :style=\"{ top: `${height / 2}px` }\"\n    ></span>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent } from 'vue'\n\nexport default defineComponent({\n  props: {\n    item: {\n      type: Object,\n      required: true,\n    },\n    style: Object,\n    height: Number,\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;UAEU;;;;;mCAIC;;;;aAEwC;;;;;;;;"}

package/lib/components/select-v2/src/option-item.vue_vue_type_script_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"option-item.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/select-v2/src/option-item.vue"],"sourcesContent":["<template>\n  <li\n    :aria-selected=\"selected\"\n    :style=\"style\"\n    :class=\"{\n      'el-select-dropdown__option-item': true,\n      'is-selected': selected,\n      'is-disabled': disabled,\n      'is-created': created,\n      hover: hovering,\n    }\"\n    @mouseenter=\"hoverItem\"\n    @click.stop=\"selectOptionClick\"\n  >\n    <slot :item=\"item\" :index=\"index\" :disabled=\"disabled\">\n      <span>{{ item.label }}</span>\n    </slot>\n  </li>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent } from 'vue'\nimport { useOption } from './useOption'\nimport { OptionProps } from './defaults'\nexport default defineComponent({\n  props: OptionProps,\n  emits: ['select', 'hover'],\n  setup(props, { emit }) {\n    const { hoverItem, selectOptionClick } = useOption(props, { emit })\n    return {\n      hoverItem,\n      selectOptionClick,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","OptionProps","useOption"],"mappings":";;;;;;;;AAwBA,aAAeA,oBAAgB;AAAA,EAC7B,OAAOC;AAAA,EACP,OAAO,CAAC,UAAU;AAAA,EAClB,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,EAAE,WAAW,sBAAsBC,oBAAU,OAAO,EAAE;AAC5D,WAAO;AAAA,MACL;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}
+{"version":3,"file":"option-item.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/select-v2/src/option-item.vue"],"sourcesContent":["<template>\n  <li\n    :aria-selected=\"selected\"\n    :style=\"style\"\n    :class=\"{\n      'el-select-dropdown__option-item': true,\n      'is-selected': selected,\n      'is-disabled': disabled,\n      'is-created': created,\n      hover: hovering,\n    }\"\n    @mouseenter=\"hoverItem\"\n    @click.stop=\"selectOptionClick\"\n  >\n    <slot :item=\"item\" :index=\"index\" :disabled=\"disabled\">\n      <span>{{ item.label }}</span>\n    </slot>\n  </li>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent } from 'vue'\nimport { useOption } from './useOption'\nimport { OptionProps } from './defaults'\nexport default defineComponent({\n  props: OptionProps,\n  emits: ['select', 'hover'],\n  setup(props, { emit }) {\n    const { hoverItem, selectOptionClick } = useOption(props, { emit })\n    return {\n      hoverItem,\n      selectOptionClick,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","OptionProps"],"mappings":";;;;;;;;AAuBA,aAAeA,mBAAe,CAAC;AAC/B,EAAE,KAAK,EAAEC,oBAAW;EAClB,KAAK,EAAE,CAAC,QAAQ,EAAE;EAClB,KAAK,MAAM,EAAE,EAAE,IAAI,EAAE,EAAE;IACrB,MAAM,EAAE,WAAW;IACnB;MACE;MACA;MACA;;EAEJ;;;;"}

package/lib/components/select-v2/src/option-item.vue_vue_type_template_id_119b30a9_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"option-item.vue_vue_type_template_id_119b30a9_lang.js","sources":["../../../../../../packages/components/select-v2/src/option-item.vue?vue&type=template&id=119b30a9&lang.js"],"sourcesContent":["<template>\n  <li\n    :aria-selected=\"selected\"\n    :style=\"style\"\n    :class=\"{\n      'el-select-dropdown__option-item': true,\n      'is-selected': selected,\n      'is-disabled': disabled,\n      'is-created': created,\n      hover: hovering,\n    }\"\n    @mouseenter=\"hoverItem\"\n    @click.stop=\"selectOptionClick\"\n  >\n    <slot :item=\"item\" :index=\"index\" :disabled=\"disabled\">\n      <span>{{ item.label }}</span>\n    </slot>\n  </li>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent } from 'vue'\nimport { useOption } from './useOption'\nimport { OptionProps } from './defaults'\nexport default defineComponent({\n  props: OptionProps,\n  emits: ['select', 'hover'],\n  setup(props, { emit }) {\n    const { hoverItem, selectOptionClick } = useOption(props, { emit })\n    return {\n      hoverItem,\n      selectOptionClick,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_renderSlot","_createElementVNode"],"mappings":";;;;;;;;0BACEA;IACG,iBAAe;IACf,0BAAO;IACP;;;;;;;IAOA,qDAAY;IACZ,kEAAY;;IAEbC;MAAO,MAAM;MAAO,OAAO;MAAQ,UAAU;OAA7C;MACEC,yDAAS,UAAK;;;;;;;"}
+{"version":3,"file":"option-item.vue_vue_type_template_id_119b30a9_lang.js","sources":["../../../../../../packages/components/select-v2/src/option-item.vue?vue&type=template&id=119b30a9&lang.js"],"sourcesContent":["<template>\n  <li\n    :aria-selected=\"selected\"\n    :style=\"style\"\n    :class=\"{\n      'el-select-dropdown__option-item': true,\n      'is-selected': selected,\n      'is-disabled': disabled,\n      'is-created': created,\n      hover: hovering,\n    }\"\n    @mouseenter=\"hoverItem\"\n    @click.stop=\"selectOptionClick\"\n  >\n    <slot :item=\"item\" :index=\"index\" :disabled=\"disabled\">\n      <span>{{ item.label }}</span>\n    </slot>\n  </li>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent } from 'vue'\nimport { useOption } from './useOption'\nimport { OptionProps } from './defaults'\nexport default defineComponent({\n  props: OptionProps,\n  emits: ['select', 'hover'],\n  setup(props, { emit }) {\n    const { hoverItem, selectOptionClick } = useOption(props, { emit })\n    return {\n      hoverItem,\n      selectOptionClick,\n    }\n  },\n})\n</script>\n"],"names":["_renderSlot","_createElementVNode"],"mappings":";;;;;;;;;;;IAEK;;;;;;;;;;IAUAA;;;MAEM,eAAU;aAAU;MAAQC;;;;;;;"}

package/lib/components/select-v2/src/select-dropdown.vue_vue_type_script_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"select-dropdown.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/select-v2/src/select-dropdown.vue"],"sourcesContent":["<script lang=\"ts\">\nimport {\n  defineComponent,\n  computed,\n  inject,\n  ref,\n  renderSlot,\n  h,\n  withCtx,\n  withKeys,\n  withModifiers,\n} from 'vue'\nimport { getValueByPath, isUndefined, isObject } from '@element-plus/utils/util'\n// import { addResizeListener, removeResizeListener, ResizableElement } from '@element-plus/utils/resize-event'\nimport {\n  FixedSizeList,\n  DynamicSizeList,\n} from '@element-plus/components/virtual-list'\nimport GroupItem from './group-item.vue'\nimport OptionItem from './option-item.vue'\n\nimport { selectV2InjectionKey } from './token'\n\nimport type { ItemProps } from '@element-plus/components/virtual-list'\nimport type { OptionItemProps, Option } from './select.types'\n\nexport default defineComponent({\n  name: 'ElSelectDropdown',\n\n  props: {\n    data: Array,\n    hoveringIndex: Number,\n    width: Number,\n  },\n  setup(props) {\n    const select = inject(selectV2InjectionKey) as any\n    const cachedHeights = ref<Array<number>>([])\n\n    const listRef = ref(null)\n\n    const isSized = computed(() =>\n      isUndefined(select.props.estimatedOptionHeight)\n    )\n    const listProps = computed(() => {\n      if (isSized.value) {\n        return {\n          itemSize: select.props.itemHeight,\n        }\n      }\n\n      return {\n        estimatedSize: select.props.estimatedOptionHeight,\n        itemSize: (idx: number) => cachedHeights.value[idx],\n      }\n    })\n\n    const contains = (arr: Array<any> = [], target: any) => {\n      const {\n        props: { valueKey },\n      } = select\n\n      if (!isObject(target)) {\n        return arr.includes(target)\n      }\n\n      return (\n        arr &&\n        arr.some((item) => {\n          return (\n            getValueByPath(item, valueKey) === getValueByPath(target, valueKey)\n          )\n        })\n      )\n    }\n    const isEqual = (selected: unknown, target: unknown) => {\n      if (!isObject(target)) {\n        return selected === target\n      } else {\n        const { valueKey } = select.props\n        return (\n          getValueByPath(selected, valueKey) ===\n          getValueByPath(target, valueKey)\n        )\n      }\n    }\n\n    const isItemSelected = (modelValue: any[] | any, target: Option) => {\n      if (select.props.multiple) {\n        return contains(modelValue, target.value)\n      }\n      return isEqual(modelValue, target.value)\n    }\n\n    const isItemDisabled = (modelValue: any[] | any, selected: boolean) => {\n      const { disabled, multiple, multipleLimit } = select.props\n      return (\n        disabled ||\n        (!selected &&\n          (multiple\n            ? multipleLimit > 0 && modelValue.length >= multipleLimit\n            : false))\n      )\n    }\n\n    const isItemHovering = (target: number) => props.hoveringIndex === target\n\n    const scrollToItem = (index: number) => {\n      const list = listRef.value as any\n      if (list) {\n        list.scrollToItem(index)\n      }\n    }\n\n    const resetScrollTop = () => {\n      const list = listRef.value as any\n      if (list) {\n        list.resetScrollTop()\n      }\n    }\n\n    // computed\n    return {\n      select,\n      listProps,\n      listRef,\n      isSized,\n\n      isItemDisabled,\n      isItemHovering,\n      isItemSelected,\n\n      scrollToItem,\n      resetScrollTop,\n    }\n  },\n\n  render(_ctx, _cache) {\n    const {\n      $slots,\n\n      data,\n      listProps,\n      select,\n      isSized,\n      width,\n      // methods\n      isItemDisabled,\n      isItemHovering,\n      isItemSelected,\n    } = _ctx\n\n    const Comp = isSized ? FixedSizeList : DynamicSizeList\n\n    const {\n      props: selectProps,\n      onSelect,\n      onHover,\n      onKeyboardNavigate,\n      onKeyboardSelect,\n    } = select\n    const { height, modelValue, multiple } = selectProps\n\n    if (data.length === 0) {\n      return h(\n        'div',\n        {\n          class: 'el-select-dropdown',\n          style: {\n            width: `${width}px`,\n          },\n        },\n        $slots.empty?.()\n      )\n    }\n\n    const ListItem = withCtx((scoped: ItemProps<any>) => {\n      const { index, data } = scoped\n      const item = data[index]\n      // render group item which is not selectable.\n      if (data[index].type === 'Group') {\n        return h(GroupItem, {\n          item,\n          style: scoped.style,\n          height: isSized ? listProps.itemSize : listProps.estimatedSize,\n        })\n      }\n\n      const selected = isItemSelected(modelValue, item)\n      const itemDisabled = isItemDisabled(modelValue, selected)\n      // render option item which is selectable\n      return h(\n        OptionItem,\n        {\n          ...scoped,\n          selected,\n          disabled: item.disabled || itemDisabled,\n          created: !!item.created,\n          hovering: isItemHovering(index),\n          item,\n          onSelect,\n          onHover,\n        },\n        {\n          default: withCtx((props: OptionItemProps) => {\n            return renderSlot($slots, 'default', props, () => [\n              h('span', item.label),\n            ])\n          }),\n        }\n      )\n    })\n\n    const List = h(\n      Comp,\n      {\n        ref: 'listRef', // forwarded ref so that select can access the list directly\n        className: 'el-select-dropdown__list',\n        data,\n        height,\n        width,\n        total: data.length,\n        scrollbarAlwaysOn: selectProps.scrollbarAlwaysOn,\n        onKeydown: [\n          _cache[1] ||\n            (_cache[1] = withKeys(\n              withModifiers(\n                () => onKeyboardNavigate('forward'),\n                ['stop', 'prevent']\n              ),\n              ['down']\n            )),\n          _cache[2] ||\n            (_cache[2] = withKeys(\n              withModifiers(\n                () => onKeyboardNavigate('backward'),\n                ['stop', 'prevent']\n              ),\n              ['up']\n            )),\n          _cache[3] ||\n            (_cache[3] = withKeys(\n              withModifiers(onKeyboardSelect, ['stop', 'prevent']),\n              ['enter']\n            )),\n\n          _cache[4] ||\n            (_cache[4] = withKeys(\n              withModifiers(\n                () => (select.expanded = false),\n                ['stop', 'prevent']\n              ),\n              ['esc']\n            )),\n          _cache[5] ||\n            (_cache[5] = withKeys(() => (select.expanded = false), ['tab'])),\n          // _cache[6] || (_cache[6] = () => {\n          //   console.log(11)\n          // }),\n        ],\n        ...listProps,\n      },\n      {\n        default: ListItem,\n      }\n    )\n    return h(\n      'div',\n      {\n        class: {\n          'is-multiple': multiple,\n          'el-select-dropdown': true,\n        },\n      },\n      [List]\n    )\n  },\n})\n</script>\n"],"names":["defineComponent","inject","selectV2InjectionKey","ref","computed","isUndefined","isObject","getValueByPath","FixedSizeList","DynamicSizeList","h","withCtx","GroupItem","OptionItem","renderSlot","withKeys","withModifiers"],"mappings":"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"}
+{"version":3,"file":"select-dropdown.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/select-v2/src/select-dropdown.vue"],"sourcesContent":["<script lang=\"ts\">\nimport {\n  defineComponent,\n  computed,\n  inject,\n  ref,\n  renderSlot,\n  h,\n  withCtx,\n  withKeys,\n  withModifiers,\n} from 'vue'\nimport { getValueByPath, isUndefined, isObject } from '@element-plus/utils/util'\n// import { addResizeListener, removeResizeListener, ResizableElement } from '@element-plus/utils/resize-event'\nimport {\n  FixedSizeList,\n  DynamicSizeList,\n} from '@element-plus/components/virtual-list'\nimport GroupItem from './group-item.vue'\nimport OptionItem from './option-item.vue'\n\nimport { selectV2InjectionKey } from './token'\n\nimport type { ItemProps } from '@element-plus/components/virtual-list'\nimport type { OptionItemProps, Option } from './select.types'\n\nexport default defineComponent({\n  name: 'ElSelectDropdown',\n\n  props: {\n    data: Array,\n    hoveringIndex: Number,\n    width: Number,\n  },\n  setup(props) {\n    const select = inject(selectV2InjectionKey) as any\n    const cachedHeights = ref<Array<number>>([])\n\n    const listRef = ref(null)\n\n    const isSized = computed(() =>\n      isUndefined(select.props.estimatedOptionHeight)\n    )\n    const listProps = computed(() => {\n      if (isSized.value) {\n        return {\n          itemSize: select.props.itemHeight,\n        }\n      }\n\n      return {\n        estimatedSize: select.props.estimatedOptionHeight,\n        itemSize: (idx: number) => cachedHeights.value[idx],\n      }\n    })\n\n    const contains = (arr: Array<any> = [], target: any) => {\n      const {\n        props: { valueKey },\n      } = select\n\n      if (!isObject(target)) {\n        return arr.includes(target)\n      }\n\n      return (\n        arr &&\n        arr.some((item) => {\n          return (\n            getValueByPath(item, valueKey) === getValueByPath(target, valueKey)\n          )\n        })\n      )\n    }\n    const isEqual = (selected: unknown, target: unknown) => {\n      if (!isObject(target)) {\n        return selected === target\n      } else {\n        const { valueKey } = select.props\n        return (\n          getValueByPath(selected, valueKey) ===\n          getValueByPath(target, valueKey)\n        )\n      }\n    }\n\n    const isItemSelected = (modelValue: any[] | any, target: Option) => {\n      if (select.props.multiple) {\n        return contains(modelValue, target.value)\n      }\n      return isEqual(modelValue, target.value)\n    }\n\n    const isItemDisabled = (modelValue: any[] | any, selected: boolean) => {\n      const { disabled, multiple, multipleLimit } = select.props\n      return (\n        disabled ||\n        (!selected &&\n          (multiple\n            ? multipleLimit > 0 && modelValue.length >= multipleLimit\n            : false))\n      )\n    }\n\n    const isItemHovering = (target: number) => props.hoveringIndex === target\n\n    const scrollToItem = (index: number) => {\n      const list = listRef.value as any\n      if (list) {\n        list.scrollToItem(index)\n      }\n    }\n\n    const resetScrollTop = () => {\n      const list = listRef.value as any\n      if (list) {\n        list.resetScrollTop()\n      }\n    }\n\n    // computed\n    return {\n      select,\n      listProps,\n      listRef,\n      isSized,\n\n      isItemDisabled,\n      isItemHovering,\n      isItemSelected,\n\n      scrollToItem,\n      resetScrollTop,\n    }\n  },\n\n  render(_ctx, _cache) {\n    const {\n      $slots,\n\n      data,\n      listProps,\n      select,\n      isSized,\n      width,\n      // methods\n      isItemDisabled,\n      isItemHovering,\n      isItemSelected,\n    } = _ctx\n\n    const Comp = isSized ? FixedSizeList : DynamicSizeList\n\n    const {\n      props: selectProps,\n      onSelect,\n      onHover,\n      onKeyboardNavigate,\n      onKeyboardSelect,\n    } = select\n    const { height, modelValue, multiple } = selectProps\n\n    if (data.length === 0) {\n      return h(\n        'div',\n        {\n          class: 'el-select-dropdown',\n          style: {\n            width: `${width}px`,\n          },\n        },\n        $slots.empty?.()\n      )\n    }\n\n    const ListItem = withCtx((scoped: ItemProps<any>) => {\n      const { index, data } = scoped\n      const item = data[index]\n      // render group item which is not selectable.\n      if (data[index].type === 'Group') {\n        return h(GroupItem, {\n          item,\n          style: scoped.style,\n          height: isSized ? listProps.itemSize : listProps.estimatedSize,\n        })\n      }\n\n      const selected = isItemSelected(modelValue, item)\n      const itemDisabled = isItemDisabled(modelValue, selected)\n      // render option item which is selectable\n      return h(\n        OptionItem,\n        {\n          ...scoped,\n          selected,\n          disabled: item.disabled || itemDisabled,\n          created: !!item.created,\n          hovering: isItemHovering(index),\n          item,\n          onSelect,\n          onHover,\n        },\n        {\n          default: withCtx((props: OptionItemProps) => {\n            return renderSlot($slots, 'default', props, () => [\n              h('span', item.label),\n            ])\n          }),\n        }\n      )\n    })\n\n    const List = h(\n      Comp,\n      {\n        ref: 'listRef', // forwarded ref so that select can access the list directly\n        className: 'el-select-dropdown__list',\n        data,\n        height,\n        width,\n        total: data.length,\n        scrollbarAlwaysOn: selectProps.scrollbarAlwaysOn,\n        onKeydown: [\n          _cache[1] ||\n            (_cache[1] = withKeys(\n              withModifiers(\n                () => onKeyboardNavigate('forward'),\n                ['stop', 'prevent']\n              ),\n              ['down']\n            )),\n          _cache[2] ||\n            (_cache[2] = withKeys(\n              withModifiers(\n                () => onKeyboardNavigate('backward'),\n                ['stop', 'prevent']\n              ),\n              ['up']\n            )),\n          _cache[3] ||\n            (_cache[3] = withKeys(\n              withModifiers(onKeyboardSelect, ['stop', 'prevent']),\n              ['enter']\n            )),\n\n          _cache[4] ||\n            (_cache[4] = withKeys(\n              withModifiers(\n                () => (select.expanded = false),\n                ['stop', 'prevent']\n              ),\n              ['esc']\n            )),\n          _cache[5] ||\n            (_cache[5] = withKeys(() => (select.expanded = false), ['tab'])),\n          // _cache[6] || (_cache[6] = () => {\n          //   console.log(11)\n          // }),\n        ],\n        ...listProps,\n      },\n      {\n        default: ListItem,\n      }\n    )\n    return h(\n      'div',\n      {\n        class: {\n          'is-multiple': multiple,\n          'el-select-dropdown': true,\n        },\n      },\n      [List]\n    )\n  },\n})\n</script>\n"],"names":["defineComponent","inject","selectV2InjectionKey","computed","isObject","getValueByPath","FixedSizeList","withCtx","withKeys"],"mappings":";;;;;;;;;;;;;;;;AAmBA,aAAeA,mBAAe,CAAC;;AAE/B,EAAE,KAAK,EAAE;;AAET,IAAI,aAAa,EAAE;AACnB,IAAI,KAAK,QAAQ;;AAEjB,EAAE,KAAK,CAAC,KAAK,EAAE;IACX,MAAM,MAAM,GAAGC,UAAM,CAACC;;IAEtB;IACA,MAAM;IACN,MAAM,SAAS,GAAGC;MAChB,WAAW;;UAEP;UACA;OACH;;QAEC,aAAa,EAAE;;OAEhB,CAAC;MACF,CAAC;IACH;MACE,MAAM;aACC,EAAE,EAAE,QAAQ;UACf;UACA,CAACC,gBAAS,MAAM,CAAC,EAAE;QACrB;;;QAGA;QACA,CAAC;;;;;OAKF,MAAM;QACL;QACA,OAAOC;;;UAGL,cAAc,GAAG;UACjB,MAAM,CAAC,KAAK,CAAC,QAAQ,EAAE;;;MAG3B,OAAO;;UAEH,cAAc,GAAG;YACf,EAAE;aACD,QAAQ,IAAI,CAAC,QAAQ,KAAK,QAAQ,GAAG,aAAa,GAAG,CAAC,IAAI;;;;;MAKjE,IAAI,IAAI,EAAE;YACJ,CAAC,YAAY,CAAC;;MAEpB;UACI,iBAAiB,MAAM;YACrB;UACF,IAAI,EAAE;YACJ,CAAC,cAAc,EAAE,CAAC;;MAExB;IACF;;MAEE,SAAS;MACT,OAAO;aACA;MACP;MACA,cAAc;;;MAGd,cAAc;MACd;;QAEE,CAAC,IAAI,EAAE;QACP,EAAE,CAAC;UACD;YACE;;MAEN;;;MAGA,KAAK;;MAEL,cAAc;MACd,cAAc;YACR,CAAC;UACH,IAAI,GAAG,OAAO,GAAGC;;;;MAIrB,OAAO;MACP,kBAAkB;MAClB;QACE,MAAM,CAAC;;IAEX;;QAEI,KAAK;QACL;UACE;SACD;OACF,EAAE,CAAC,EAAE;;;MAGN,MAAM,EAAE,KAAK;MACb,MAAM,IAAI,GAAG;MACb,IAAI,KAAK,CAAC;;UAEN,IAAI;UACJ,KAAK,EAAE;;;;MAIX,MAAM,QAAQ,GAAG;MACjB;MACA;;QAEE;QACA;QACA;QACA;QACA;;QAEA,OAAO;OACR,EAAE;QACD,OAAO,EAAEC;UACP;;WAEC,CAAC,CAAC;;OAEN,CAAC;MACF,CAAC;UACG,IAAI;MACR,GAAG,EAAE;MACL,SAAS,EAAE;MACX,IAAI;MACJ,MAAM;MACN;;yBAEmB;MACnB;QACE;QACA;cACM,CAAC,EAAE,KAAK,MAAM,CAAC,CAAC,CAAC,GAAGC;cACpB,CAAC,EAAE;cACH,CAAC,CAAC,CAAC,KAAK,MAAM,CAAC,CAAC,CAAC;;SAEtB;;MAEH;;;MAGA,KAAK,EAAE;QACL,aAAa,EAAE,QAAQ;QACvB,oBAAoB;OACrB;OACA,KAAK,CAAC,CAAC,CAAC;;;;;;"}

package/lib/components/select-v2/src/select.vue.d.ts

@@ -75,7 +75,7 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
 }, {
-    collapseTagSize: import("vue").ComputedRef<"small" | "mini">;
+    collapseTagSize: import("vue").ComputedRef<"default" | "small">;
     currentPlaceholder: import("vue").ComputedRef<string>;
     expanded: import("vue").Ref<boolean>;
     emptyText: import("vue").ComputedRef<string | false | null>;
@@ -90,7 +90,7 @@ declare const _default: import("vue").DefineComponent<{
     hasModelValue: import("vue").ComputedRef<boolean>;
     shouldShowPlaceholder: import("vue").ComputedRef<boolean>;
     selectDisabled: import("vue").ComputedRef<boolean | undefined>;
-    selectSize: import("vue").ComputedRef<"" | import("../../../utils/types").ComponentSize>;
+    selectSize: import("vue").ComputedRef<import("../../../utils/types").ComponentSize>;
     showClearBtn: import("vue").ComputedRef<boolean>;
     states: {
         inputValue: string;
@@ -136,6 +136,8 @@ declare const _default: import("vue").DefineComponent<{
     selectRef: import("vue").Ref<null>;
     selectionRef: import("vue").Ref<null>;
     popperRef: import("vue").ComputedRef<any>;
+    validateState: import("vue").ComputedRef<string>;
+    validateIcon: import("vue").ComputedRef<any>;
     Effect: typeof import("element-plus/es/components/popper").Effect;
     debouncedOnInputChange: import("lodash").DebouncedFunc<() => Promise<void>>;
     deleteTag: (event: MouseEvent, tag: import("./select.types").Option<any>) => Promise<void> | undefined;

package/lib/components/select-v2/src/select.vue_vue_type_script_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"select.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/select-v2/src/select.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"selectRef\"\n    v-click-outside:[popperRef]=\"handleClickOutside\"\n    :class=\"[selectSize ? 'el-select-v2--' + selectSize : '']\"\n    class=\"el-select-v2\"\n    @click.stop=\"toggleMenu\"\n    @mouseenter=\"states.comboBoxHovering = true\"\n    @mouseleave=\"states.comboBoxHovering = false\"\n  >\n    <el-popper\n      ref=\"popper\"\n      v-model:visible=\"dropdownMenuVisible\"\n      :append-to-body=\"popperAppendToBody\"\n      :popper-class=\"`el-select-v2__popper ${popperClass}`\"\n      :gpu-acceleration=\"false\"\n      :stop-popper-mouse-event=\"false\"\n      :popper-options=\"popperOptions\"\n      :fallback-placements=\"['bottom-start', 'top-start', 'right', 'left']\"\n      :effect=\"Effect.LIGHT\"\n      manual-mode\n      placement=\"bottom-start\"\n      pure\n      transition=\"el-zoom-in-top\"\n      trigger=\"click\"\n      @before-enter=\"handleMenuEnter\"\n      @after-leave=\"states.inputValue = states.displayInputValue\"\n    >\n      <template #trigger>\n        <div\n          ref=\"selectionRef\"\n          class=\"el-select-v2__wrapper\"\n          :class=\"{\n            'is-focused': states.isComposing,\n            'is-hovering': states.comboBoxHovering,\n            'is-filterable': filterable,\n            'is-disabled': disabled,\n          }\"\n        >\n          <div v-if=\"$slots.prefix\">\n            <slot name=\"prefix\"></slot>\n          </div>\n          <div v-if=\"multiple\" class=\"el-select-v2__selection\">\n            <template v-if=\"collapseTags && modelValue.length > 0\">\n              <div class=\"el-select-v2__selected-item\">\n                <el-tag\n                  :closable=\"\n                    !selectDisabled && !states.cachedOptions[0]?.disable\n                  \"\n                  :size=\"collapseTagSize\"\n                  type=\"info\"\n                  disable-transitions\n                  @close=\"deleteTag($event, states.cachedOptions[0])\"\n                >\n                  <span\n                    class=\"el-select-v2__tags-text\"\n                    :style=\"{\n                      maxWidth: `${tagMaxWidth}px`,\n                    }\"\n                    >{{ states.cachedOptions[0]?.label }}</span\n                  >\n                </el-tag>\n                <el-tag\n                  v-if=\"modelValue.length > 1\"\n                  :closable=\"false\"\n                  :size=\"collapseTagSize\"\n                  type=\"info\"\n                  disable-transitions\n                >\n                  <span\n                    class=\"el-select-v2__tags-text\"\n                    :style=\"{\n                      maxWidth: `${tagMaxWidth}px`,\n                    }\"\n                    >+ {{ modelValue.length - 1 }}</span\n                  >\n                </el-tag>\n              </div>\n            </template>\n\n            <template v-else>\n              <div\n                v-for=\"(selected, idx) in states.cachedOptions\"\n                :key=\"idx\"\n                class=\"el-select-v2__selected-item\"\n              >\n                <el-tag\n                  :key=\"getValueKey(selected)\"\n                  :closable=\"!selectDisabled && !selected.disabled\"\n                  :size=\"collapseTagSize\"\n                  type=\"info\"\n                  disable-transitions\n                  @close=\"deleteTag($event, selected)\"\n                >\n                  <span\n                    class=\"el-select-v2__tags-text\"\n                    :style=\"{\n                      maxWidth: `${tagMaxWidth}px`,\n                    }\"\n                    >{{ getLabel(selected) }}</span\n                  >\n                </el-tag>\n              </div>\n            </template>\n            <div\n              class=\"el-select-v2__selected-item el-select-v2__input-wrapper\"\n              :style=\"inputWrapperStyle\"\n            >\n              <input\n                :id=\"id\"\n                ref=\"inputRef\"\n                v-model-text=\"states.displayInputValue\"\n                :autocomplete=\"autocomplete\"\n                aria-autocomplete=\"list\"\n                aria-haspopup=\"listbox\"\n                autocapitalize=\"off\"\n                :aria-expanded=\"expanded\"\n                :aria-labelledby=\"label\"\n                class=\"el-select-v2__combobox-input\"\n                :class=\"[selectSize ? `is-${selectSize}` : '']\"\n                :disabled=\"disabled\"\n                role=\"combobox\"\n                :readonly=\"!filterable\"\n                spellcheck=\"false\"\n                type=\"text\"\n                :name=\"name\"\n                :unselectable=\"expanded ? 'on' : undefined\"\n                @update:modelValue=\"onUpdateInputValue\"\n                @focus=\"handleFocus\"\n                @input=\"onInput\"\n                @compositionstart=\"handleCompositionStart\"\n                @compositionupdate=\"handleCompositionUpdate\"\n                @compositionend=\"handleCompositionEnd\"\n                @keydown.up.stop.prevent=\"onKeyboardNavigate('backward')\"\n                @keydown.down.stop.prevent=\"onKeyboardNavigate('forward')\"\n                @keydown.enter.stop.prevent=\"onKeyboardSelect\"\n                @keydown.esc.stop.prevent=\"handleEsc\"\n                @keydown.delete.stop=\"handleDel\"\n              />\n              <span\n                v-if=\"filterable\"\n                ref=\"calculatorRef\"\n                aria-hidden=\"true\"\n                class=\"el-select-v2__input-calculator\"\n                v-text=\"states.displayInputValue\"\n              >\n              </span>\n            </div>\n          </div>\n          <template v-else>\n            <div\n              class=\"el-select-v2__selected-item el-select-v2__input-wrapper\"\n            >\n              <input\n                :id=\"id\"\n                ref=\"inputRef\"\n                v-model-text=\"states.displayInputValue\"\n                aria-autocomplete=\"list\"\n                aria-haspopup=\"listbox\"\n                :aria-labelledby=\"label\"\n                :aria-expanded=\"expanded\"\n                autocapitalize=\"off\"\n                :autocomplete=\"autocomplete\"\n                class=\"el-select-v2__combobox-input\"\n                :disabled=\"disabled\"\n                :name=\"name\"\n                role=\"combobox\"\n                :readonly=\"!filterable\"\n                spellcheck=\"false\"\n                type=\"text\"\n                :unselectable=\"expanded ? 'on' : undefined\"\n                @compositionstart=\"handleCompositionStart\"\n                @compositionupdate=\"handleCompositionUpdate\"\n                @compositionend=\"handleCompositionEnd\"\n                @focus=\"handleFocus\"\n                @input=\"onInput\"\n                @keydown.up.stop.prevent=\"onKeyboardNavigate('backward')\"\n                @keydown.down.stop.prevent=\"onKeyboardNavigate('forward')\"\n                @keydown.enter.stop.prevent=\"onKeyboardSelect\"\n                @keydown.esc.stop.prevent=\"handleEsc\"\n                @update:modelValue=\"onUpdateInputValue\"\n              />\n            </div>\n            <span\n              v-if=\"filterable\"\n              ref=\"calculatorRef\"\n              aria-hidden=\"true\"\n              class=\"el-select-v2__selected-item el-select-v2__input-calculator\"\n              v-text=\"states.displayInputValue\"\n            >\n            </span>\n          </template>\n          <span\n            v-if=\"shouldShowPlaceholder\"\n            :class=\"{\n              'el-select-v2__placeholder': true,\n              'is-transparent':\n                states.isComposing ||\n                (placeholder && multiple\n                  ? modelValue.length === 0\n                  : !hasModelValue),\n            }\"\n          >\n            {{ currentPlaceholder }}\n          </span>\n          <span class=\"el-select-v2__suffix\">\n            <el-icon\n              v-if=\"iconComponent\"\n              v-show=\"!showClearBtn\"\n              :class=\"['el-select-v2__caret', 'el-input__icon', iconReverse]\"\n            >\n              <component :is=\"iconComponent\" />\n            </el-icon>\n            <el-icon\n              v-if=\"showClearBtn && clearIcon\"\n              class=\"el-select-v2__caret el-input__icon\"\n              @click.prevent.stop=\"handleClear\"\n            >\n              <component :is=\"clearIcon\" />\n            </el-icon>\n          </span>\n        </div>\n      </template>\n      <template #default>\n        <el-select-menu\n          ref=\"menuRef\"\n          :data=\"filteredOptions\"\n          :width=\"popperSize\"\n          :hovering-index=\"states.hoveringIndex\"\n          :scrollbar-always-on=\"scrollbarAlwaysOn\"\n        >\n          <template #default=\"scope\">\n            <slot v-bind=\"scope\"></slot>\n          </template>\n          <template #empty>\n            <slot name=\"empty\">\n              <p class=\"el-select-v2__empty\">\n                {{ emptyText ? emptyText : '' }}\n              </p>\n            </slot>\n          </template>\n        </el-select-menu>\n      </template>\n    </el-popper>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, provide, toRefs, reactive, vModelText } from 'vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport ElPopper from '@element-plus/components/popper'\nimport ElTag from '@element-plus/components/tag'\nimport ElIcon from '@element-plus/components/icon'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\nimport ElSelectMenu from './select-dropdown.vue'\nimport useSelect from './useSelect'\nimport { selectV2InjectionKey } from './token'\nimport { SelectProps } from './defaults'\nexport default defineComponent({\n  name: 'ElSelectV2',\n  components: {\n    ElSelectMenu,\n    ElTag,\n    ElPopper,\n    ElIcon,\n  },\n  directives: { ClickOutside, ModelText: vModelText },\n  props: SelectProps,\n  emits: [\n    UPDATE_MODEL_EVENT,\n    CHANGE_EVENT,\n    'remove-tag',\n    'clear',\n    'visible-change',\n    'focus',\n    'blur',\n  ],\n\n  setup(props, { emit }) {\n    const API = useSelect(props, emit)\n    // TODO, remove the any cast to align the actual API.\n    provide(selectV2InjectionKey, {\n      props: reactive({\n        ...toRefs(props),\n        height: API.popupHeight,\n      }),\n      onSelect: API.onSelect,\n      onHover: API.onHover,\n      onKeyboardNavigate: API.onKeyboardNavigate,\n      onKeyboardSelect: API.onKeyboardSelect,\n    } as any)\n\n    return API\n  },\n})\n</script>\n"],"names":["defineComponent","ElSelectMenu","ElTag","ElPopper","ElIcon","ClickOutside","vModelText","SelectProps","UPDATE_MODEL_EVENT","CHANGE_EVENT","useSelect","selectV2InjectionKey","reactive","toRefs"],"mappings":";;;;;;;;;;;;;;;;;AAkQA,aAAeA,oBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,kBACVC;AAAA,WACAC;AAAA,cACAC;AAAA,YACAC;AAAA;AAAA,EAEF,YAAY,gBAAEC,oBAAc,WAAWC;AAAA,EACvC,OAAOC;AAAA,EACP,OAAO;AAAA,IACLC;AAAA,IACAC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,EAGF,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,MAAMC,qBAAU,OAAO;AAE7B,gBAAQC,4BAAsB;AAAA,MAC5B,OAAOC,aAAS;AAAA,WACXC,WAAO;AAAA,QACV,QAAQ,IAAI;AAAA;AAAA,MAEd,UAAU,IAAI;AAAA,MACd,SAAS,IAAI;AAAA,MACb,oBAAoB,IAAI;AAAA,MACxB,kBAAkB,IAAI;AAAA;AAGxB,WAAO;AAAA;AAAA;;;;"}
+{"version":3,"file":"select.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/select-v2/src/select.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"selectRef\"\n    v-click-outside:[popperRef]=\"handleClickOutside\"\n    :class=\"[selectSize ? 'el-select-v2--' + selectSize : '']\"\n    class=\"el-select-v2\"\n    @click.stop=\"toggleMenu\"\n    @mouseenter=\"states.comboBoxHovering = true\"\n    @mouseleave=\"states.comboBoxHovering = false\"\n  >\n    <el-popper\n      ref=\"popper\"\n      v-model:visible=\"dropdownMenuVisible\"\n      :append-to-body=\"popperAppendToBody\"\n      :popper-class=\"`el-select-v2__popper ${popperClass}`\"\n      :gpu-acceleration=\"false\"\n      :stop-popper-mouse-event=\"false\"\n      :popper-options=\"popperOptions\"\n      :fallback-placements=\"['bottom-start', 'top-start', 'right', 'left']\"\n      :effect=\"Effect.LIGHT\"\n      manual-mode\n      placement=\"bottom-start\"\n      pure\n      transition=\"el-zoom-in-top\"\n      trigger=\"click\"\n      @before-enter=\"handleMenuEnter\"\n      @after-leave=\"states.inputValue = states.displayInputValue\"\n    >\n      <template #trigger>\n        <div\n          ref=\"selectionRef\"\n          class=\"el-select-v2__wrapper\"\n          :class=\"{\n            'is-focused': states.isComposing,\n            'is-hovering': states.comboBoxHovering,\n            'is-filterable': filterable,\n            'is-disabled': disabled,\n          }\"\n        >\n          <div v-if=\"$slots.prefix\">\n            <slot name=\"prefix\"></slot>\n          </div>\n          <div v-if=\"multiple\" class=\"el-select-v2__selection\">\n            <template v-if=\"collapseTags && modelValue.length > 0\">\n              <div class=\"el-select-v2__selected-item\">\n                <el-tag\n                  :closable=\"\n                    !selectDisabled && !states.cachedOptions[0]?.disable\n                  \"\n                  :size=\"collapseTagSize\"\n                  type=\"info\"\n                  disable-transitions\n                  @close=\"deleteTag($event, states.cachedOptions[0])\"\n                >\n                  <span\n                    class=\"el-select-v2__tags-text\"\n                    :style=\"{\n                      maxWidth: `${tagMaxWidth}px`,\n                    }\"\n                    >{{ states.cachedOptions[0]?.label }}</span\n                  >\n                </el-tag>\n                <el-tag\n                  v-if=\"modelValue.length > 1\"\n                  :closable=\"false\"\n                  :size=\"collapseTagSize\"\n                  type=\"info\"\n                  disable-transitions\n                >\n                  <span\n                    class=\"el-select-v2__tags-text\"\n                    :style=\"{\n                      maxWidth: `${tagMaxWidth}px`,\n                    }\"\n                    >+ {{ modelValue.length - 1 }}</span\n                  >\n                </el-tag>\n              </div>\n            </template>\n\n            <template v-else>\n              <div\n                v-for=\"(selected, idx) in states.cachedOptions\"\n                :key=\"idx\"\n                class=\"el-select-v2__selected-item\"\n              >\n                <el-tag\n                  :key=\"getValueKey(selected)\"\n                  :closable=\"!selectDisabled && !selected.disabled\"\n                  :size=\"collapseTagSize\"\n                  type=\"info\"\n                  disable-transitions\n                  @close=\"deleteTag($event, selected)\"\n                >\n                  <span\n                    class=\"el-select-v2__tags-text\"\n                    :style=\"{\n                      maxWidth: `${tagMaxWidth}px`,\n                    }\"\n                    >{{ getLabel(selected) }}</span\n                  >\n                </el-tag>\n              </div>\n            </template>\n            <div\n              class=\"el-select-v2__selected-item el-select-v2__input-wrapper\"\n              :style=\"inputWrapperStyle\"\n            >\n              <input\n                :id=\"id\"\n                ref=\"inputRef\"\n                v-model-text=\"states.displayInputValue\"\n                :autocomplete=\"autocomplete\"\n                aria-autocomplete=\"list\"\n                aria-haspopup=\"listbox\"\n                autocapitalize=\"off\"\n                :aria-expanded=\"expanded\"\n                :aria-labelledby=\"label\"\n                class=\"el-select-v2__combobox-input\"\n                :class=\"[selectSize ? `is-${selectSize}` : '']\"\n                :disabled=\"disabled\"\n                role=\"combobox\"\n                :readonly=\"!filterable\"\n                spellcheck=\"false\"\n                type=\"text\"\n                :name=\"name\"\n                :unselectable=\"expanded ? 'on' : undefined\"\n                @update:modelValue=\"onUpdateInputValue\"\n                @focus=\"handleFocus\"\n                @input=\"onInput\"\n                @compositionstart=\"handleCompositionStart\"\n                @compositionupdate=\"handleCompositionUpdate\"\n                @compositionend=\"handleCompositionEnd\"\n                @keydown.up.stop.prevent=\"onKeyboardNavigate('backward')\"\n                @keydown.down.stop.prevent=\"onKeyboardNavigate('forward')\"\n                @keydown.enter.stop.prevent=\"onKeyboardSelect\"\n                @keydown.esc.stop.prevent=\"handleEsc\"\n                @keydown.delete.stop=\"handleDel\"\n              />\n              <span\n                v-if=\"filterable\"\n                ref=\"calculatorRef\"\n                aria-hidden=\"true\"\n                class=\"el-select-v2__input-calculator\"\n                v-text=\"states.displayInputValue\"\n              >\n              </span>\n            </div>\n          </div>\n          <template v-else>\n            <div\n              class=\"el-select-v2__selected-item el-select-v2__input-wrapper\"\n            >\n              <input\n                :id=\"id\"\n                ref=\"inputRef\"\n                v-model-text=\"states.displayInputValue\"\n                aria-autocomplete=\"list\"\n                aria-haspopup=\"listbox\"\n                :aria-labelledby=\"label\"\n                :aria-expanded=\"expanded\"\n                autocapitalize=\"off\"\n                :autocomplete=\"autocomplete\"\n                class=\"el-select-v2__combobox-input\"\n                :disabled=\"disabled\"\n                :name=\"name\"\n                role=\"combobox\"\n                :readonly=\"!filterable\"\n                spellcheck=\"false\"\n                type=\"text\"\n                :unselectable=\"expanded ? 'on' : undefined\"\n                @compositionstart=\"handleCompositionStart\"\n                @compositionupdate=\"handleCompositionUpdate\"\n                @compositionend=\"handleCompositionEnd\"\n                @focus=\"handleFocus\"\n                @input=\"onInput\"\n                @keydown.up.stop.prevent=\"onKeyboardNavigate('backward')\"\n                @keydown.down.stop.prevent=\"onKeyboardNavigate('forward')\"\n                @keydown.enter.stop.prevent=\"onKeyboardSelect\"\n                @keydown.esc.stop.prevent=\"handleEsc\"\n                @update:modelValue=\"onUpdateInputValue\"\n              />\n            </div>\n            <span\n              v-if=\"filterable\"\n              ref=\"calculatorRef\"\n              aria-hidden=\"true\"\n              class=\"el-select-v2__selected-item el-select-v2__input-calculator\"\n              v-text=\"states.displayInputValue\"\n            >\n            </span>\n          </template>\n          <span\n            v-if=\"shouldShowPlaceholder\"\n            :class=\"{\n              'el-select-v2__placeholder': true,\n              'is-transparent':\n                states.isComposing ||\n                (placeholder && multiple\n                  ? modelValue.length === 0\n                  : !hasModelValue),\n            }\"\n          >\n            {{ currentPlaceholder }}\n          </span>\n          <span class=\"el-select-v2__suffix\">\n            <el-icon\n              v-if=\"iconComponent\"\n              v-show=\"!showClearBtn\"\n              :class=\"['el-select-v2__caret', 'el-input__icon', iconReverse]\"\n            >\n              <component :is=\"iconComponent\" />\n            </el-icon>\n            <el-icon\n              v-if=\"showClearBtn && clearIcon\"\n              class=\"el-select-v2__caret el-input__icon\"\n              @click.prevent.stop=\"handleClear\"\n            >\n              <component :is=\"clearIcon\" />\n            </el-icon>\n            <el-icon\n              v-if=\"validateState && validateIcon\"\n              class=\"el-input__icon el-input__validateIcon\"\n            >\n              <component :is=\"validateIcon\" />\n            </el-icon>\n          </span>\n        </div>\n      </template>\n      <template #default>\n        <el-select-menu\n          ref=\"menuRef\"\n          :data=\"filteredOptions\"\n          :width=\"popperSize\"\n          :hovering-index=\"states.hoveringIndex\"\n          :scrollbar-always-on=\"scrollbarAlwaysOn\"\n        >\n          <template #default=\"scope\">\n            <slot v-bind=\"scope\"></slot>\n          </template>\n          <template #empty>\n            <slot name=\"empty\">\n              <p class=\"el-select-v2__empty\">\n                {{ emptyText ? emptyText : '' }}\n              </p>\n            </slot>\n          </template>\n        </el-select-menu>\n      </template>\n    </el-popper>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, provide, toRefs, reactive, vModelText } from 'vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport ElPopper from '@element-plus/components/popper'\nimport ElTag from '@element-plus/components/tag'\nimport ElIcon from '@element-plus/components/icon'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\nimport ElSelectMenu from './select-dropdown.vue'\nimport useSelect from './useSelect'\nimport { selectV2InjectionKey } from './token'\nimport { SelectProps } from './defaults'\nexport default defineComponent({\n  name: 'ElSelectV2',\n  components: {\n    ElSelectMenu,\n    ElTag,\n    ElPopper,\n    ElIcon,\n  },\n  directives: { ClickOutside, ModelText: vModelText },\n  props: SelectProps,\n  emits: [\n    UPDATE_MODEL_EVENT,\n    CHANGE_EVENT,\n    'remove-tag',\n    'clear',\n    'visible-change',\n    'focus',\n    'blur',\n  ],\n\n  setup(props, { emit }) {\n    const API = useSelect(props, emit)\n    // TODO, remove the any cast to align the actual API.\n    provide(selectV2InjectionKey, {\n      props: reactive({\n        ...toRefs(props),\n        height: API.popupHeight,\n      }),\n      onSelect: API.onSelect,\n      onHover: API.onHover,\n      onKeyboardNavigate: API.onKeyboardNavigate,\n      onKeyboardSelect: API.onKeyboardSelect,\n    } as any)\n\n    return API\n  },\n})\n</script>\n"],"names":["defineComponent","ElSelectMenu","ElTag","ElPopper","ElIcon","SelectProps","UPDATE_MODEL_EVENT","CHANGE_EVENT","provide","selectV2InjectionKey","toRefs"],"mappings":";;;;;;;;;;;;;;;;;AAuQA,aAAeA,mBAAe,CAAC;AAC/B,EAAE,MAAM,YAAY;EAClB,UAAU,EAAE;kBACVC;WACAC,WAAK;cACLC;YACAC,cAAM;;EAER;EACA,KAAK,EAAEC,oBAAW;EAClB,KAAK,EAAE;IACLC;IACAC,sBAAY;IACZ,YAAY;IACZ,OAAO;IACP;IACA,OAAO;IACP,MAAM;;EAER;;IAEEC,WAAO,CAACC;MACN,KAAK,cAAU,CAAC;QACd,GAAGC,UAAM,CAAC,MAAM;QAChB,MAAM,EAAE,GAAG,CAAC,WAAW;OACxB,CAAC;cACM,EAAE,GAAG,CAAC;aACP,KAAK,CAAC,OAAO;MACpB;MACA,gBAAgB,EAAE,GAAG,CAAC;MACtB,CAAC;WACI,GAAG,CAAC;;;;;;"}

package/lib/components/select-v2/src/select.vue_vue_type_template_id_13e598a4_lang.js

@@ -112,7 +112,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                   key: idx,
                   class: "el-select-v2__selected-item"
                 }, [
-                  vue.createVNode(_component_el_tag, {
+                  (vue.openBlock(), vue.createBlock(_component_el_tag, {
                     key: _ctx.getValueKey(selected),
                     closable: !_ctx.selectDisabled && !selected.disabled,
                     size: _ctx.collapseTagSize,
@@ -129,7 +129,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                       }, vue.toDisplayString(_ctx.getLabel(selected)), 5)
                     ]),
                     _: 2
-                  }, 1032, ["closable", "size", "onClose"])
+                  }, 1032, ["closable", "size", "onClose"]))
                 ]);
               }), 128)),
               vue.createElementVNode("div", {
@@ -248,7 +248,16 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                   (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.clearIcon)))
                 ]),
                 _: 1
-              }, 8, ["onClick"])) : vue.createCommentVNode("v-if", true)
+              }, 8, ["onClick"])) : vue.createCommentVNode("v-if", true),
+              _ctx.validateState && _ctx.validateIcon ? (vue.openBlock(), vue.createBlock(_component_el_icon, {
+                key: 2,
+                class: "el-input__icon el-input__validateIcon"
+              }, {
+                default: vue.withCtx(() => [
+                  (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.validateIcon)))
+                ]),
+                _: 1
+              })) : vue.createCommentVNode("v-if", true)
             ])
           ], 2)
         ];

package/lib/components/select-v2/src/select.vue_vue_type_template_id_13e598a4_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"select.vue_vue_type_template_id_13e598a4_lang.js","sources":["../../../../../../packages/components/select-v2/src/select.vue?vue&type=template&id=13e598a4&lang.js"],"sourcesContent":["<template>\n  <div\n    ref=\"selectRef\"\n    v-click-outside:[popperRef]=\"handleClickOutside\"\n    :class=\"[selectSize ? 'el-select-v2--' + selectSize : '']\"\n    class=\"el-select-v2\"\n    @click.stop=\"toggleMenu\"\n    @mouseenter=\"states.comboBoxHovering = true\"\n    @mouseleave=\"states.comboBoxHovering = false\"\n  >\n    <el-popper\n      ref=\"popper\"\n      v-model:visible=\"dropdownMenuVisible\"\n      :append-to-body=\"popperAppendToBody\"\n      :popper-class=\"`el-select-v2__popper ${popperClass}`\"\n      :gpu-acceleration=\"false\"\n      :stop-popper-mouse-event=\"false\"\n      :popper-options=\"popperOptions\"\n      :fallback-placements=\"['bottom-start', 'top-start', 'right', 'left']\"\n      :effect=\"Effect.LIGHT\"\n      manual-mode\n      placement=\"bottom-start\"\n      pure\n      transition=\"el-zoom-in-top\"\n      trigger=\"click\"\n      @before-enter=\"handleMenuEnter\"\n      @after-leave=\"states.inputValue = states.displayInputValue\"\n    >\n      <template #trigger>\n        <div\n          ref=\"selectionRef\"\n          class=\"el-select-v2__wrapper\"\n          :class=\"{\n            'is-focused': states.isComposing,\n            'is-hovering': states.comboBoxHovering,\n            'is-filterable': filterable,\n            'is-disabled': disabled,\n          }\"\n        >\n          <div v-if=\"$slots.prefix\">\n            <slot name=\"prefix\"></slot>\n          </div>\n          <div v-if=\"multiple\" class=\"el-select-v2__selection\">\n            <template v-if=\"collapseTags && modelValue.length > 0\">\n              <div class=\"el-select-v2__selected-item\">\n                <el-tag\n                  :closable=\"\n                    !selectDisabled && !states.cachedOptions[0]?.disable\n                  \"\n                  :size=\"collapseTagSize\"\n                  type=\"info\"\n                  disable-transitions\n                  @close=\"deleteTag($event, states.cachedOptions[0])\"\n                >\n                  <span\n                    class=\"el-select-v2__tags-text\"\n                    :style=\"{\n                      maxWidth: `${tagMaxWidth}px`,\n                    }\"\n                    >{{ states.cachedOptions[0]?.label }}</span\n                  >\n                </el-tag>\n                <el-tag\n                  v-if=\"modelValue.length > 1\"\n                  :closable=\"false\"\n                  :size=\"collapseTagSize\"\n                  type=\"info\"\n                  disable-transitions\n                >\n                  <span\n                    class=\"el-select-v2__tags-text\"\n                    :style=\"{\n                      maxWidth: `${tagMaxWidth}px`,\n                    }\"\n                    >+ {{ modelValue.length - 1 }}</span\n                  >\n                </el-tag>\n              </div>\n            </template>\n\n            <template v-else>\n              <div\n                v-for=\"(selected, idx) in states.cachedOptions\"\n                :key=\"idx\"\n                class=\"el-select-v2__selected-item\"\n              >\n                <el-tag\n                  :key=\"getValueKey(selected)\"\n                  :closable=\"!selectDisabled && !selected.disabled\"\n                  :size=\"collapseTagSize\"\n                  type=\"info\"\n                  disable-transitions\n                  @close=\"deleteTag($event, selected)\"\n                >\n                  <span\n                    class=\"el-select-v2__tags-text\"\n                    :style=\"{\n                      maxWidth: `${tagMaxWidth}px`,\n                    }\"\n                    >{{ getLabel(selected) }}</span\n                  >\n                </el-tag>\n              </div>\n            </template>\n            <div\n              class=\"el-select-v2__selected-item el-select-v2__input-wrapper\"\n              :style=\"inputWrapperStyle\"\n            >\n              <input\n                :id=\"id\"\n                ref=\"inputRef\"\n                v-model-text=\"states.displayInputValue\"\n                :autocomplete=\"autocomplete\"\n                aria-autocomplete=\"list\"\n                aria-haspopup=\"listbox\"\n                autocapitalize=\"off\"\n                :aria-expanded=\"expanded\"\n                :aria-labelledby=\"label\"\n                class=\"el-select-v2__combobox-input\"\n                :class=\"[selectSize ? `is-${selectSize}` : '']\"\n                :disabled=\"disabled\"\n                role=\"combobox\"\n                :readonly=\"!filterable\"\n                spellcheck=\"false\"\n                type=\"text\"\n                :name=\"name\"\n                :unselectable=\"expanded ? 'on' : undefined\"\n                @update:modelValue=\"onUpdateInputValue\"\n                @focus=\"handleFocus\"\n                @input=\"onInput\"\n                @compositionstart=\"handleCompositionStart\"\n                @compositionupdate=\"handleCompositionUpdate\"\n                @compositionend=\"handleCompositionEnd\"\n                @keydown.up.stop.prevent=\"onKeyboardNavigate('backward')\"\n                @keydown.down.stop.prevent=\"onKeyboardNavigate('forward')\"\n                @keydown.enter.stop.prevent=\"onKeyboardSelect\"\n                @keydown.esc.stop.prevent=\"handleEsc\"\n                @keydown.delete.stop=\"handleDel\"\n              />\n              <span\n                v-if=\"filterable\"\n                ref=\"calculatorRef\"\n                aria-hidden=\"true\"\n                class=\"el-select-v2__input-calculator\"\n                v-text=\"states.displayInputValue\"\n              >\n              </span>\n            </div>\n          </div>\n          <template v-else>\n            <div\n              class=\"el-select-v2__selected-item el-select-v2__input-wrapper\"\n            >\n              <input\n                :id=\"id\"\n                ref=\"inputRef\"\n                v-model-text=\"states.displayInputValue\"\n                aria-autocomplete=\"list\"\n                aria-haspopup=\"listbox\"\n                :aria-labelledby=\"label\"\n                :aria-expanded=\"expanded\"\n                autocapitalize=\"off\"\n                :autocomplete=\"autocomplete\"\n                class=\"el-select-v2__combobox-input\"\n                :disabled=\"disabled\"\n                :name=\"name\"\n                role=\"combobox\"\n                :readonly=\"!filterable\"\n                spellcheck=\"false\"\n                type=\"text\"\n                :unselectable=\"expanded ? 'on' : undefined\"\n                @compositionstart=\"handleCompositionStart\"\n                @compositionupdate=\"handleCompositionUpdate\"\n                @compositionend=\"handleCompositionEnd\"\n                @focus=\"handleFocus\"\n                @input=\"onInput\"\n                @keydown.up.stop.prevent=\"onKeyboardNavigate('backward')\"\n                @keydown.down.stop.prevent=\"onKeyboardNavigate('forward')\"\n                @keydown.enter.stop.prevent=\"onKeyboardSelect\"\n                @keydown.esc.stop.prevent=\"handleEsc\"\n                @update:modelValue=\"onUpdateInputValue\"\n              />\n            </div>\n            <span\n              v-if=\"filterable\"\n              ref=\"calculatorRef\"\n              aria-hidden=\"true\"\n              class=\"el-select-v2__selected-item el-select-v2__input-calculator\"\n              v-text=\"states.displayInputValue\"\n            >\n            </span>\n          </template>\n          <span\n            v-if=\"shouldShowPlaceholder\"\n            :class=\"{\n              'el-select-v2__placeholder': true,\n              'is-transparent':\n                states.isComposing ||\n                (placeholder && multiple\n                  ? modelValue.length === 0\n                  : !hasModelValue),\n            }\"\n          >\n            {{ currentPlaceholder }}\n          </span>\n          <span class=\"el-select-v2__suffix\">\n            <el-icon\n              v-if=\"iconComponent\"\n              v-show=\"!showClearBtn\"\n              :class=\"['el-select-v2__caret', 'el-input__icon', iconReverse]\"\n            >\n              <component :is=\"iconComponent\" />\n            </el-icon>\n            <el-icon\n              v-if=\"showClearBtn && clearIcon\"\n              class=\"el-select-v2__caret el-input__icon\"\n              @click.prevent.stop=\"handleClear\"\n            >\n              <component :is=\"clearIcon\" />\n            </el-icon>\n          </span>\n        </div>\n      </template>\n      <template #default>\n        <el-select-menu\n          ref=\"menuRef\"\n          :data=\"filteredOptions\"\n          :width=\"popperSize\"\n          :hovering-index=\"states.hoveringIndex\"\n          :scrollbar-always-on=\"scrollbarAlwaysOn\"\n        >\n          <template #default=\"scope\">\n            <slot v-bind=\"scope\"></slot>\n          </template>\n          <template #empty>\n            <slot name=\"empty\">\n              <p class=\"el-select-v2__empty\">\n                {{ emptyText ? emptyText : '' }}\n              </p>\n            </slot>\n          </template>\n        </el-select-menu>\n      </template>\n    </el-popper>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, provide, toRefs, reactive, vModelText } from 'vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport ElPopper from '@element-plus/components/popper'\nimport ElTag from '@element-plus/components/tag'\nimport ElIcon from '@element-plus/components/icon'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\nimport ElSelectMenu from './select-dropdown.vue'\nimport useSelect from './useSelect'\nimport { selectV2InjectionKey } from './token'\nimport { SelectProps } from './defaults'\nexport default defineComponent({\n  name: 'ElSelectV2',\n  components: {\n    ElSelectMenu,\n    ElTag,\n    ElPopper,\n    ElIcon,\n  },\n  directives: { ClickOutside, ModelText: vModelText },\n  props: SelectProps,\n  emits: [\n    UPDATE_MODEL_EVENT,\n    CHANGE_EVENT,\n    'remove-tag',\n    'clear',\n    'visible-change',\n    'focus',\n    'blur',\n  ],\n\n  setup(props, { emit }) {\n    const API = useSelect(props, emit)\n    // TODO, remove the any cast to align the actual API.\n    provide(selectV2InjectionKey, {\n      props: reactive({\n        ...toRefs(props),\n        height: API.popupHeight,\n      }),\n      onSelect: API.onSelect,\n      onHover: API.onHover,\n      onKeyboardNavigate: API.onKeyboardNavigate,\n      onKeyboardSelect: API.onKeyboardSelect,\n    } as any)\n\n    return API\n  },\n})\n</script>\n"],"names":["_createElementBlock","_createVNode","_createElementVNode","_renderSlot","_createBlock","_toDisplayString"],"mappings":"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"}
+{"version":3,"file":"select.vue_vue_type_template_id_13e598a4_lang.js","sources":["../../../../../../packages/components/select-v2/src/select.vue?vue&type=template&id=13e598a4&lang.js"],"sourcesContent":["<template>\n  <div\n    ref=\"selectRef\"\n    v-click-outside:[popperRef]=\"handleClickOutside\"\n    :class=\"[selectSize ? 'el-select-v2--' + selectSize : '']\"\n    class=\"el-select-v2\"\n    @click.stop=\"toggleMenu\"\n    @mouseenter=\"states.comboBoxHovering = true\"\n    @mouseleave=\"states.comboBoxHovering = false\"\n  >\n    <el-popper\n      ref=\"popper\"\n      v-model:visible=\"dropdownMenuVisible\"\n      :append-to-body=\"popperAppendToBody\"\n      :popper-class=\"`el-select-v2__popper ${popperClass}`\"\n      :gpu-acceleration=\"false\"\n      :stop-popper-mouse-event=\"false\"\n      :popper-options=\"popperOptions\"\n      :fallback-placements=\"['bottom-start', 'top-start', 'right', 'left']\"\n      :effect=\"Effect.LIGHT\"\n      manual-mode\n      placement=\"bottom-start\"\n      pure\n      transition=\"el-zoom-in-top\"\n      trigger=\"click\"\n      @before-enter=\"handleMenuEnter\"\n      @after-leave=\"states.inputValue = states.displayInputValue\"\n    >\n      <template #trigger>\n        <div\n          ref=\"selectionRef\"\n          class=\"el-select-v2__wrapper\"\n          :class=\"{\n            'is-focused': states.isComposing,\n            'is-hovering': states.comboBoxHovering,\n            'is-filterable': filterable,\n            'is-disabled': disabled,\n          }\"\n        >\n          <div v-if=\"$slots.prefix\">\n            <slot name=\"prefix\"></slot>\n          </div>\n          <div v-if=\"multiple\" class=\"el-select-v2__selection\">\n            <template v-if=\"collapseTags && modelValue.length > 0\">\n              <div class=\"el-select-v2__selected-item\">\n                <el-tag\n                  :closable=\"\n                    !selectDisabled && !states.cachedOptions[0]?.disable\n                  \"\n                  :size=\"collapseTagSize\"\n                  type=\"info\"\n                  disable-transitions\n                  @close=\"deleteTag($event, states.cachedOptions[0])\"\n                >\n                  <span\n                    class=\"el-select-v2__tags-text\"\n                    :style=\"{\n                      maxWidth: `${tagMaxWidth}px`,\n                    }\"\n                    >{{ states.cachedOptions[0]?.label }}</span\n                  >\n                </el-tag>\n                <el-tag\n                  v-if=\"modelValue.length > 1\"\n                  :closable=\"false\"\n                  :size=\"collapseTagSize\"\n                  type=\"info\"\n                  disable-transitions\n                >\n                  <span\n                    class=\"el-select-v2__tags-text\"\n                    :style=\"{\n                      maxWidth: `${tagMaxWidth}px`,\n                    }\"\n                    >+ {{ modelValue.length - 1 }}</span\n                  >\n                </el-tag>\n              </div>\n            </template>\n\n            <template v-else>\n              <div\n                v-for=\"(selected, idx) in states.cachedOptions\"\n                :key=\"idx\"\n                class=\"el-select-v2__selected-item\"\n              >\n                <el-tag\n                  :key=\"getValueKey(selected)\"\n                  :closable=\"!selectDisabled && !selected.disabled\"\n                  :size=\"collapseTagSize\"\n                  type=\"info\"\n                  disable-transitions\n                  @close=\"deleteTag($event, selected)\"\n                >\n                  <span\n                    class=\"el-select-v2__tags-text\"\n                    :style=\"{\n                      maxWidth: `${tagMaxWidth}px`,\n                    }\"\n                    >{{ getLabel(selected) }}</span\n                  >\n                </el-tag>\n              </div>\n            </template>\n            <div\n              class=\"el-select-v2__selected-item el-select-v2__input-wrapper\"\n              :style=\"inputWrapperStyle\"\n            >\n              <input\n                :id=\"id\"\n                ref=\"inputRef\"\n                v-model-text=\"states.displayInputValue\"\n                :autocomplete=\"autocomplete\"\n                aria-autocomplete=\"list\"\n                aria-haspopup=\"listbox\"\n                autocapitalize=\"off\"\n                :aria-expanded=\"expanded\"\n                :aria-labelledby=\"label\"\n                class=\"el-select-v2__combobox-input\"\n                :class=\"[selectSize ? `is-${selectSize}` : '']\"\n                :disabled=\"disabled\"\n                role=\"combobox\"\n                :readonly=\"!filterable\"\n                spellcheck=\"false\"\n                type=\"text\"\n                :name=\"name\"\n                :unselectable=\"expanded ? 'on' : undefined\"\n                @update:modelValue=\"onUpdateInputValue\"\n                @focus=\"handleFocus\"\n                @input=\"onInput\"\n                @compositionstart=\"handleCompositionStart\"\n                @compositionupdate=\"handleCompositionUpdate\"\n                @compositionend=\"handleCompositionEnd\"\n                @keydown.up.stop.prevent=\"onKeyboardNavigate('backward')\"\n                @keydown.down.stop.prevent=\"onKeyboardNavigate('forward')\"\n                @keydown.enter.stop.prevent=\"onKeyboardSelect\"\n                @keydown.esc.stop.prevent=\"handleEsc\"\n                @keydown.delete.stop=\"handleDel\"\n              />\n              <span\n                v-if=\"filterable\"\n                ref=\"calculatorRef\"\n                aria-hidden=\"true\"\n                class=\"el-select-v2__input-calculator\"\n                v-text=\"states.displayInputValue\"\n              >\n              </span>\n            </div>\n          </div>\n          <template v-else>\n            <div\n              class=\"el-select-v2__selected-item el-select-v2__input-wrapper\"\n            >\n              <input\n                :id=\"id\"\n                ref=\"inputRef\"\n                v-model-text=\"states.displayInputValue\"\n                aria-autocomplete=\"list\"\n                aria-haspopup=\"listbox\"\n                :aria-labelledby=\"label\"\n                :aria-expanded=\"expanded\"\n                autocapitalize=\"off\"\n                :autocomplete=\"autocomplete\"\n                class=\"el-select-v2__combobox-input\"\n                :disabled=\"disabled\"\n                :name=\"name\"\n                role=\"combobox\"\n                :readonly=\"!filterable\"\n                spellcheck=\"false\"\n                type=\"text\"\n                :unselectable=\"expanded ? 'on' : undefined\"\n                @compositionstart=\"handleCompositionStart\"\n                @compositionupdate=\"handleCompositionUpdate\"\n                @compositionend=\"handleCompositionEnd\"\n                @focus=\"handleFocus\"\n                @input=\"onInput\"\n                @keydown.up.stop.prevent=\"onKeyboardNavigate('backward')\"\n                @keydown.down.stop.prevent=\"onKeyboardNavigate('forward')\"\n                @keydown.enter.stop.prevent=\"onKeyboardSelect\"\n                @keydown.esc.stop.prevent=\"handleEsc\"\n                @update:modelValue=\"onUpdateInputValue\"\n              />\n            </div>\n            <span\n              v-if=\"filterable\"\n              ref=\"calculatorRef\"\n              aria-hidden=\"true\"\n              class=\"el-select-v2__selected-item el-select-v2__input-calculator\"\n              v-text=\"states.displayInputValue\"\n            >\n            </span>\n          </template>\n          <span\n            v-if=\"shouldShowPlaceholder\"\n            :class=\"{\n              'el-select-v2__placeholder': true,\n              'is-transparent':\n                states.isComposing ||\n                (placeholder && multiple\n                  ? modelValue.length === 0\n                  : !hasModelValue),\n            }\"\n          >\n            {{ currentPlaceholder }}\n          </span>\n          <span class=\"el-select-v2__suffix\">\n            <el-icon\n              v-if=\"iconComponent\"\n              v-show=\"!showClearBtn\"\n              :class=\"['el-select-v2__caret', 'el-input__icon', iconReverse]\"\n            >\n              <component :is=\"iconComponent\" />\n            </el-icon>\n            <el-icon\n              v-if=\"showClearBtn && clearIcon\"\n              class=\"el-select-v2__caret el-input__icon\"\n              @click.prevent.stop=\"handleClear\"\n            >\n              <component :is=\"clearIcon\" />\n            </el-icon>\n            <el-icon\n              v-if=\"validateState && validateIcon\"\n              class=\"el-input__icon el-input__validateIcon\"\n            >\n              <component :is=\"validateIcon\" />\n            </el-icon>\n          </span>\n        </div>\n      </template>\n      <template #default>\n        <el-select-menu\n          ref=\"menuRef\"\n          :data=\"filteredOptions\"\n          :width=\"popperSize\"\n          :hovering-index=\"states.hoveringIndex\"\n          :scrollbar-always-on=\"scrollbarAlwaysOn\"\n        >\n          <template #default=\"scope\">\n            <slot v-bind=\"scope\"></slot>\n          </template>\n          <template #empty>\n            <slot name=\"empty\">\n              <p class=\"el-select-v2__empty\">\n                {{ emptyText ? emptyText : '' }}\n              </p>\n            </slot>\n          </template>\n        </el-select-menu>\n      </template>\n    </el-popper>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, provide, toRefs, reactive, vModelText } from 'vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport ElPopper from '@element-plus/components/popper'\nimport ElTag from '@element-plus/components/tag'\nimport ElIcon from '@element-plus/components/icon'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\nimport ElSelectMenu from './select-dropdown.vue'\nimport useSelect from './useSelect'\nimport { selectV2InjectionKey } from './token'\nimport { SelectProps } from './defaults'\nexport default defineComponent({\n  name: 'ElSelectV2',\n  components: {\n    ElSelectMenu,\n    ElTag,\n    ElPopper,\n    ElIcon,\n  },\n  directives: { ClickOutside, ModelText: vModelText },\n  props: SelectProps,\n  emits: [\n    UPDATE_MODEL_EVENT,\n    CHANGE_EVENT,\n    'remove-tag',\n    'clear',\n    'visible-change',\n    'focus',\n    'blur',\n  ],\n\n  setup(props, { emit }) {\n    const API = useSelect(props, emit)\n    // TODO, remove the any cast to align the actual API.\n    provide(selectV2InjectionKey, {\n      props: reactive({\n        ...toRefs(props),\n        height: API.popupHeight,\n      }),\n      onSelect: API.onSelect,\n      onHover: API.onHover,\n      onKeyboardNavigate: API.onKeyboardNavigate,\n      onKeyboardSelect: API.onKeyboardSelect,\n    } as any)\n\n    return API\n  },\n})\n</script>\n"],"names":["_createVNode","_normalizeStyle","_openBlock","_toDisplayString","_createElementBlock","_withCtx","_normalizeClass","_withDirectives"],"mappings":";;;;;;;;;;EA0C+B;;;;EAEZ;;;;0BA2GA;;;kDAsDyB;eAqC3B,KAAK,EAAC;;;;;;;;;;;IAhPnB;IAEC,qFACK;;IAELA,eAAU;;;;MAIT;MACQ;;MACP;MACA;MACA;MACA,yBAAuB;MACvB;MACA;MACA,MAAM,EAAE;MACT;MACA,SAAS;MACT;MACA,YAAW;;MAEV;;;;;;;;;;;;;;;gBAeK;;;;6BAEF;;;;;;;;;wBASQ;wBACC,OAAKC;;;;;;;;8CAOAC,eAAO;;;;;yCAGf;;uCAEW;;;;;;8BAKTC;;;;;oCAKG,IAAEC,uBAAG;;;;;;;;wBAST,QAAQ;;;;6BAIHC;;;;0BAIJ;0BACC;;;;;;;;;;;;;;;kBAaL;kBACC;;;;uBAII,EAACC;gCAES;;;;;;;;;;;;;;oBAeZ,qBAAiB,gDAAE,2DAAkB;oBACrC,OAAK;oBACL,OAAK;oBACL,qIAAwC;oBACxC,mEAAmB,qEAAuB;;6BAEnC;;;;;;;;;;mBAOF;;;;;;qCAIN;;;;;;;;sBAUG,EAAE;;;qCAIS;;qCAEE;oCACD;;;;;;oBAMd;oBACD,UAAU;oBACV,MAAK;oBACJ,wCAAgC;;uCAEf;;uEAEV;;;;;;;;;;;;;;;;;wCAYE;;mCAEZC,mCAAe;;;;;gCAInB;;gBAEG;;;;;;;;;;;;;;kBAeE,uEAAiD;;;;;;;;;;aAK5C;;;0BACD;;;oCAGL;;;;;;sCAGuB;;;0BAClB;;;;;;;;;;;;;;;;"}

package/lib/components/select-v2/src/token.js.map

@@ -1 +1 @@
-{"version":3,"file":"token.js","sources":["../../../../../../packages/components/select-v2/src/token.ts"],"sourcesContent":["import type { OptionProps, SelectProps } from './defaults'\nimport type { ExtractPropTypes, InjectionKey } from 'vue'\nimport type { Option } from './select.types'\n\nexport interface SelectV2Context {\n  props: ExtractPropTypes<typeof SelectProps>\n  expanded: boolean\n  onSelect: (option: Option<any>, index: number, byClick?: boolean) => void\n  onKeyboardNavigate: (direction: 'forward' | 'backward') => void\n  onKeyboardSelect: () => void\n}\n\nexport const selectV2InjectionKey =\n  'ElSelectV2Injection' as any as InjectionKey<SelectV2Context>\nexport type IOptionProps = ExtractPropTypes<typeof OptionProps>\nexport type ISelectProps = ExtractPropTypes<typeof SelectProps>\n"],"names":[],"mappings":";;;;MAYa,uBACX;;;;"}
+{"version":3,"file":"token.js","sources":["../../../../../../packages/components/select-v2/src/token.ts"],"sourcesContent":["import type { OptionProps, SelectProps } from './defaults'\nimport type { ExtractPropTypes, InjectionKey } from 'vue'\nimport type { Option } from './select.types'\n\nexport interface SelectV2Context {\n  props: ExtractPropTypes<typeof SelectProps>\n  expanded: boolean\n  onSelect: (option: Option<any>, index: number, byClick?: boolean) => void\n  onKeyboardNavigate: (direction: 'forward' | 'backward') => void\n  onKeyboardSelect: () => void\n}\n\nexport const selectV2InjectionKey =\n  'ElSelectV2Injection' as any as InjectionKey<SelectV2Context>\nexport type IOptionProps = ExtractPropTypes<typeof OptionProps>\nexport type ISelectProps = ExtractPropTypes<typeof SelectProps>\n"],"names":[],"mappings":";;;;AAAY,MAAC,oBAAoB,GAAG;;;;"}

package/lib/components/select-v2/src/useAllowCreate.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAllowCreate.js","sources":["../../../../../../packages/components/select-v2/src/useAllowCreate.ts"],"sourcesContent":["import { computed, ref } from 'vue'\nimport type { ISelectProps } from './token'\nimport type { Option } from './select.types'\n\nexport function useAllowCreate(props: ISelectProps, states) {\n  const createOptionCount = ref(0)\n  const cachedSelectedOption = ref<Option>(null)\n\n  const enableAllowCreateMode = computed(() => {\n    return props.allowCreate && props.filterable\n  })\n\n  function hasExistingOption(query: string) {\n    const hasValue = (option) => option.value === query\n    return (\n      (props.options && props.options.some(hasValue)) ||\n      states.createdOptions.some(hasValue)\n    )\n  }\n\n  function selectNewOption(option: Option) {\n    if (!enableAllowCreateMode.value) {\n      return\n    }\n    if (props.multiple && option.created) {\n      createOptionCount.value++\n    } else {\n      cachedSelectedOption.value = option\n    }\n  }\n\n  function createNewOption(query: string) {\n    if (enableAllowCreateMode.value) {\n      if (query && query.length > 0 && !hasExistingOption(query)) {\n        const newOption = {\n          value: query,\n          label: query,\n          created: true,\n          disabled: false,\n        }\n        if (states.createdOptions.length >= createOptionCount.value) {\n          states.createdOptions[createOptionCount.value] = newOption\n        } else {\n          states.createdOptions.push(newOption)\n        }\n      } else {\n        if (props.multiple) {\n          states.createdOptions.length = createOptionCount.value\n        } else {\n          const selectedOption = cachedSelectedOption.value\n          states.createdOptions.length = 0\n          if (selectedOption && selectedOption.created) {\n            states.createdOptions.push(selectedOption)\n          }\n        }\n      }\n    }\n  }\n\n  function removeNewOption(option: Option) {\n    if (!enableAllowCreateMode.value || !option || !option.created) {\n      return\n    }\n    const idx = states.createdOptions.findIndex(\n      (it) => it.value === option.value\n    )\n    if (~idx) {\n      states.createdOptions.splice(idx, 1)\n      createOptionCount.value--\n    }\n  }\n\n  function clearAllNewOption() {\n    if (enableAllowCreateMode.value) {\n      states.createdOptions.length = 0\n      createOptionCount.value = 0\n    }\n  }\n\n  return {\n    createNewOption,\n    removeNewOption,\n    selectNewOption,\n    clearAllNewOption,\n  }\n}\n"],"names":["ref","computed"],"mappings":";;;;;;wBAI+B,OAAqB,QAAQ;AAC1D,QAAM,oBAAoBA,QAAI;AAC9B,QAAM,uBAAuBA,QAAY;AAEzC,QAAM,wBAAwBC,aAAS,MAAM;AAC3C,WAAO,MAAM,eAAe,MAAM;AAAA;AAGpC,6BAA2B,OAAe;AACxC,UAAM,WAAW,CAAC,WAAW,OAAO,UAAU;AAC9C,WACG,MAAM,WAAW,MAAM,QAAQ,KAAK,aACrC,OAAO,eAAe,KAAK;AAAA;AAI/B,2BAAyB,QAAgB;AACvC,QAAI,CAAC,sBAAsB,OAAO;AAChC;AAAA;AAEF,QAAI,MAAM,YAAY,OAAO,SAAS;AACpC,wBAAkB;AAAA,WACb;AACL,2BAAqB,QAAQ;AAAA;AAAA;AAIjC,2BAAyB,OAAe;AACtC,QAAI,sBAAsB,OAAO;AAC/B,UAAI,SAAS,MAAM,SAAS,KAAK,CAAC,kBAAkB,QAAQ;AAC1D,cAAM,YAAY;AAAA,UAChB,OAAO;AAAA,UACP,OAAO;AAAA,UACP,SAAS;AAAA,UACT,UAAU;AAAA;AAEZ,YAAI,OAAO,eAAe,UAAU,kBAAkB,OAAO;AAC3D,iBAAO,eAAe,kBAAkB,SAAS;AAAA,eAC5C;AACL,iBAAO,eAAe,KAAK;AAAA;AAAA,aAExB;AACL,YAAI,MAAM,UAAU;AAClB,iBAAO,eAAe,SAAS,kBAAkB;AAAA,eAC5C;AACL,gBAAM,iBAAiB,qBAAqB;AAC5C,iBAAO,eAAe,SAAS;AAC/B,cAAI,kBAAkB,eAAe,SAAS;AAC5C,mBAAO,eAAe,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAOrC,2BAAyB,QAAgB;AACvC,QAAI,CAAC,sBAAsB,SAAS,CAAC,UAAU,CAAC,OAAO,SAAS;AAC9D;AAAA;AAEF,UAAM,MAAM,OAAO,eAAe,UAChC,CAAC,OAAO,GAAG,UAAU,OAAO;AAE9B,QAAI,CAAC,KAAK;AACR,aAAO,eAAe,OAAO,KAAK;AAClC,wBAAkB;AAAA;AAAA;AAItB,+BAA6B;AAC3B,QAAI,sBAAsB,OAAO;AAC/B,aAAO,eAAe,SAAS;AAC/B,wBAAkB,QAAQ;AAAA;AAAA;AAI9B,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA;;;;"}
+{"version":3,"file":"useAllowCreate.js","sources":["../../../../../../packages/components/select-v2/src/useAllowCreate.ts"],"sourcesContent":["import { computed, ref } from 'vue'\nimport type { ISelectProps } from './token'\nimport type { Option } from './select.types'\n\nexport function useAllowCreate(props: ISelectProps, states) {\n  const createOptionCount = ref(0)\n  const cachedSelectedOption = ref<Option>(null)\n\n  const enableAllowCreateMode = computed(() => {\n    return props.allowCreate && props.filterable\n  })\n\n  function hasExistingOption(query: string) {\n    const hasValue = (option) => option.value === query\n    return (\n      (props.options && props.options.some(hasValue)) ||\n      states.createdOptions.some(hasValue)\n    )\n  }\n\n  function selectNewOption(option: Option) {\n    if (!enableAllowCreateMode.value) {\n      return\n    }\n    if (props.multiple && option.created) {\n      createOptionCount.value++\n    } else {\n      cachedSelectedOption.value = option\n    }\n  }\n\n  function createNewOption(query: string) {\n    if (enableAllowCreateMode.value) {\n      if (query && query.length > 0 && !hasExistingOption(query)) {\n        const newOption = {\n          value: query,\n          label: query,\n          created: true,\n          disabled: false,\n        }\n        if (states.createdOptions.length >= createOptionCount.value) {\n          states.createdOptions[createOptionCount.value] = newOption\n        } else {\n          states.createdOptions.push(newOption)\n        }\n      } else {\n        if (props.multiple) {\n          states.createdOptions.length = createOptionCount.value\n        } else {\n          const selectedOption = cachedSelectedOption.value\n          states.createdOptions.length = 0\n          if (selectedOption && selectedOption.created) {\n            states.createdOptions.push(selectedOption)\n          }\n        }\n      }\n    }\n  }\n\n  function removeNewOption(option: Option) {\n    if (!enableAllowCreateMode.value || !option || !option.created) {\n      return\n    }\n    const idx = states.createdOptions.findIndex(\n      (it) => it.value === option.value\n    )\n    if (~idx) {\n      states.createdOptions.splice(idx, 1)\n      createOptionCount.value--\n    }\n  }\n\n  function clearAllNewOption() {\n    if (enableAllowCreateMode.value) {\n      states.createdOptions.length = 0\n      createOptionCount.value = 0\n    }\n  }\n\n  return {\n    createNewOption,\n    removeNewOption,\n    selectNewOption,\n    clearAllNewOption,\n  }\n}\n"],"names":["ref","computed"],"mappings":"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"}

package/lib/components/select-v2/src/useInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"useInput.js","sources":["../../../../../../packages/components/select-v2/src/useInput.ts"],"sourcesContent":["import { ref } from 'vue'\nimport { isFunction } from '@vue/shared'\nimport { isKorean } from '@element-plus/utils/isDef'\n\nexport function useInput(handleInput: (event: InputEvent) => void) {\n  const isComposing = ref(false)\n\n  const handleCompositionStart = () => {\n    isComposing.value = true\n  }\n\n  const handleCompositionUpdate = (event) => {\n    const text = event.target.value\n    const lastCharacter = text[text.length - 1] || ''\n    isComposing.value = !isKorean(lastCharacter)\n  }\n\n  const handleCompositionEnd = (event) => {\n    if (isComposing.value) {\n      isComposing.value = false\n      if (isFunction(handleInput)) {\n        handleInput(event)\n      }\n    }\n  }\n\n  return {\n    handleCompositionStart,\n    handleCompositionUpdate,\n    handleCompositionEnd,\n  }\n}\n"],"names":["ref","isKorean","isFunction"],"mappings":";;;;;;;;kBAIyB,aAA0C;AACjE,QAAM,cAAcA,QAAI;AAExB,QAAM,yBAAyB,MAAM;AACnC,gBAAY,QAAQ;AAAA;AAGtB,QAAM,0BAA0B,CAAC,UAAU;AACzC,UAAM,OAAO,MAAM,OAAO;AAC1B,UAAM,gBAAgB,KAAK,KAAK,SAAS,MAAM;AAC/C,gBAAY,QAAQ,CAACC,eAAS;AAAA;AAGhC,QAAM,uBAAuB,CAAC,UAAU;AACtC,QAAI,YAAY,OAAO;AACrB,kBAAY,QAAQ;AACpB,UAAIC,kBAAW,cAAc;AAC3B,oBAAY;AAAA;AAAA;AAAA;AAKlB,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA;AAAA;;;;"}
+{"version":3,"file":"useInput.js","sources":["../../../../../../packages/components/select-v2/src/useInput.ts"],"sourcesContent":["import { ref } from 'vue'\nimport { isFunction } from '@vue/shared'\nimport { isKorean } from '@element-plus/utils/isDef'\n\nexport function useInput(handleInput: (event: InputEvent) => void) {\n  const isComposing = ref(false)\n\n  const handleCompositionStart = () => {\n    isComposing.value = true\n  }\n\n  const handleCompositionUpdate = (event) => {\n    const text = event.target.value\n    const lastCharacter = text[text.length - 1] || ''\n    isComposing.value = !isKorean(lastCharacter)\n  }\n\n  const handleCompositionEnd = (event) => {\n    if (isComposing.value) {\n      isComposing.value = false\n      if (isFunction(handleInput)) {\n        handleInput(event)\n      }\n    }\n  }\n\n  return {\n    handleCompositionStart,\n    handleCompositionUpdate,\n    handleCompositionEnd,\n  }\n}\n"],"names":["ref","isKorean","isFunction"],"mappings":";;;;;;;;AAGO,SAAS,QAAQ,CAAC,WAAW,EAAE;AACtC,EAAE,MAAM,WAAW,GAAGA,OAAG,CAAC,KAAK,CAAC,CAAC;AACjC,EAAE,MAAM,sBAAsB,GAAG,MAAM;AACvC,IAAI,WAAW,CAAC,KAAK,GAAG,IAAI,CAAC;AAC7B,GAAG,CAAC;AACJ,EAAE,MAAM,uBAAuB,GAAG,CAAC,KAAK,KAAK;AAC7C,IAAI,MAAM,IAAI,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;AACpC,IAAI,MAAM,aAAa,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC;AACtD,IAAI,WAAW,CAAC,KAAK,GAAG,CAACC,cAAQ,CAAC,aAAa,CAAC,CAAC;AACjD,GAAG,CAAC;AACJ,EAAE,MAAM,oBAAoB,GAAG,CAAC,KAAK,KAAK;AAC1C,IAAI,IAAI,WAAW,CAAC,KAAK,EAAE;AAC3B,MAAM,WAAW,CAAC,KAAK,GAAG,KAAK,CAAC;AAChC,MAAM,IAAIC,iBAAU,CAAC,WAAW,CAAC,EAAE;AACnC,QAAQ,WAAW,CAAC,KAAK,CAAC,CAAC;AAC3B,OAAO;AACP,KAAK;AACL,GAAG,CAAC;AACJ,EAAE,OAAO;AACT,IAAI,sBAAsB;AAC1B,IAAI,uBAAuB;AAC3B,IAAI,oBAAoB;AACxB,GAAG,CAAC;AACJ;;;;"}

package/lib/components/select-v2/src/useOption.js.map

@@ -1 +1 @@
-{"version":3,"file":"useOption.js","sources":["../../../../../../packages/components/select-v2/src/useOption.ts"],"sourcesContent":["import type { IOptionProps } from './token'\n\nexport function useOption(props: IOptionProps, { emit }) {\n  return {\n    hoverItem: () => {\n      if (!props.disabled) {\n        emit('hover', props.index)\n      }\n    },\n    selectOptionClick: () => {\n      if (!props.disabled) {\n        emit('select', props.item, props.index)\n      }\n    },\n  }\n}\n"],"names":[],"mappings":";;;;mBAE0B,OAAqB,EAAE,QAAQ;AACvD,SAAO;AAAA,IACL,WAAW,MAAM;AACf,UAAI,CAAC,MAAM,UAAU;AACnB,aAAK,SAAS,MAAM;AAAA;AAAA;AAAA,IAGxB,mBAAmB,MAAM;AACvB,UAAI,CAAC,MAAM,UAAU;AACnB,aAAK,UAAU,MAAM,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA;;;;"}
+{"version":3,"file":"useOption.js","sources":["../../../../../../packages/components/select-v2/src/useOption.ts"],"sourcesContent":["import type { IOptionProps } from './token'\n\nexport function useOption(props: IOptionProps, { emit }) {\n  return {\n    hoverItem: () => {\n      if (!props.disabled) {\n        emit('hover', props.index)\n      }\n    },\n    selectOptionClick: () => {\n      if (!props.disabled) {\n        emit('select', props.item, props.index)\n      }\n    },\n  }\n}\n"],"names":[],"mappings":";;;;AAAO,SAAS,SAAS,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE;AAC3C,EAAE,OAAO;AACT,IAAI,SAAS,EAAE,MAAM;AACrB,MAAM,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;AAC3B,QAAQ,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;AACnC,OAAO;AACP,KAAK;AACL,IAAI,iBAAiB,EAAE,MAAM;AAC7B,MAAM,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;AAC3B,QAAQ,IAAI,CAAC,QAAQ,EAAE,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;AAChD,OAAO;AACP,KAAK;AACL,GAAG,CAAC;AACJ;;;;"}

package/lib/components/select-v2/src/useSelect.d.ts

@@ -3,7 +3,7 @@ import type { SelectProps } from './defaults';
 import type { ExtractPropTypes, CSSProperties } from 'vue';
 import type { Option } from './select.types';
 declare const useSelect: (props: ExtractPropTypes<typeof SelectProps>, emit: any) => {
-    collapseTagSize: import("vue").ComputedRef<"small" | "mini">;
+    collapseTagSize: import("vue").ComputedRef<"default" | "small">;
     currentPlaceholder: import("vue").ComputedRef<string>;
     expanded: import("vue").Ref<boolean>;
     emptyText: import("vue").ComputedRef<string | false | null>;
@@ -18,7 +18,7 @@ declare const useSelect: (props: ExtractPropTypes<typeof SelectProps>, emit: any
     hasModelValue: import("vue").ComputedRef<boolean>;
     shouldShowPlaceholder: import("vue").ComputedRef<boolean>;
     selectDisabled: import("vue").ComputedRef<boolean | undefined>;
-    selectSize: import("vue").ComputedRef<"" | import("../../../utils/types").ComponentSize>;
+    selectSize: import("vue").ComputedRef<import("../../../utils/types").ComponentSize>;
     showClearBtn: import("vue").ComputedRef<boolean>;
     states: {
         inputValue: string;
@@ -64,6 +64,8 @@ declare const useSelect: (props: ExtractPropTypes<typeof SelectProps>, emit: any
     selectRef: import("vue").Ref<null>;
     selectionRef: import("vue").Ref<null>;
     popperRef: import("vue").ComputedRef<any>;
+    validateState: import("vue").ComputedRef<string>;
+    validateIcon: import("vue").ComputedRef<any>;
     Effect: typeof Effect;
     debouncedOnInputChange: import("lodash").DebouncedFunc<() => Promise<void>>;
     deleteTag: (event: MouseEvent, tag: Option) => Promise<void> | undefined;

package/lib/components/select-v2/src/useSelect.js

@@ -6,9 +6,9 @@ var vue = require('vue');
 var shared = require('@vue/shared');
 var isEqual = require('lodash/isEqual');
 var debounce = require('lodash/debounce');
-require('../../../tokens/index.js');
 require('../../../hooks/index.js');
 var constants = require('../../../utils/constants.js');
+var icon = require('../../../utils/icon.js');
 var resizeEvent = require('../../../utils/resize-event.js');
 var util$1 = require('../../../utils/util.js');
 require('../../popper/index.js');
@@ -17,8 +17,8 @@ var useAllowCreate = require('./useAllowCreate.js');
 var util = require('./util.js');
 var useInput = require('./useInput.js');
 var index = require('../../../hooks/use-locale/index.js');
-var form = require('../../../tokens/form.js');
-var index$1 = require('../../../hooks/use-common-props/index.js');
+var index$1 = require('../../../hooks/use-form-item/index.js');
+var index$2 = require('../../../hooks/use-common-props/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 }; }
@@ -29,12 +29,13 @@ var debounce__default = /*#__PURE__*/_interopDefaultLegacy(debounce);
 const DEFAULT_INPUT_PLACEHOLDER = "";
 const MINIMUM_INPUT_WIDTH = 11;
 const TAG_BASE_WIDTH = {
-  small: 42,
-  mini: 33
+  larget: 51,
+  default: 42,
+  small: 33
 };
 const useSelect = (props, emit) => {
   const { t } = index.useLocale();
-  const elForm = vue.inject(form.elFormKey, {});
+  const { form: elForm, formItem: elFormItem } = index$1.useFormItem();
   const states = vue.reactive({
     inputValue: DEFAULT_INPUT_PLACEHOLDER,
     displayInputValue: DEFAULT_INPUT_PLACEHOLDER,
@@ -70,7 +71,7 @@ const useSelect = (props, emit) => {
   const selectionRef = vue.ref(null);
   const calculatorRef = vue.ref(null);
   const expanded = vue.ref(false);
-  const selectDisabled = vue.computed(() => props.disabled || elForm.disabled);
+  const selectDisabled = vue.computed(() => props.disabled || (elForm == null ? void 0 : elForm.disabled));
   const popupHeight = vue.computed(() => {
     const totalHeight = filteredOptions.value.length * 34;
     return totalHeight > props.height ? props.height : totalHeight;
@@ -85,6 +86,8 @@ const useSelect = (props, emit) => {
   });
   const iconComponent = vue.computed(() => props.remote && props.filterable ? "" : iconsVue.ArrowUp);
   const iconReverse = vue.computed(() => iconComponent.value && expanded.value ? "is-reverse" : "");
+  const validateState = vue.computed(() => (elFormItem == null ? void 0 : elFormItem.validateState) || "");
+  const validateIcon = vue.computed(() => icon.ValidateComponentsMap[validateState.value]);
   const debounce = vue.computed(() => props.remote ? 300 : 0);
   const emptyText = vue.computed(() => {
     const options = filteredOptions.value;
@@ -129,11 +132,11 @@ const useSelect = (props, emit) => {
     }).filter((v) => v !== null));
   });
   const optionsAllDisabled = vue.computed(() => filteredOptions.value.every((option) => option.disabled));
-  const selectSize = index$1.useSize();
-  const collapseTagSize = vue.computed(() => ["small", "mini"].indexOf(selectSize.value) > -1 ? "mini" : "small");
+  const selectSize = index$2.useSize();
+  const collapseTagSize = vue.computed(() => selectSize.value === "small" ? "small" : "default");
   const tagMaxWidth = vue.computed(() => {
     const select = selectionRef.value;
-    const size = collapseTagSize.value;
+    const size = collapseTagSize.value || "default";
     const paddingLeft = select ? parseInt(getComputedStyle(select).paddingLeft) : 0;
     const paddingRight = select ? parseInt(getComputedStyle(select).paddingRight) : 0;
     return states.selectWidth - paddingRight - paddingLeft - TAG_BASE_WIDTH[size];
@@ -546,10 +549,14 @@ const useSelect = (props, emit) => {
       createNewOption("");
     }
   });
-  vue.watch(() => props.modelValue, (val) => {
+  vue.watch(() => props.modelValue, (val, oldVal) => {
+    var _a;
     if (!val || val.toString() !== states.previousValue) {
       initStates();
     }
+    if (!isEqual__default["default"](val, oldVal)) {
+      (_a = elFormItem == null ? void 0 : elFormItem.validate) == null ? void 0 : _a.call(elFormItem, "change");
+    }
   }, {
     deep: true
   });
@@ -599,6 +606,8 @@ const useSelect = (props, emit) => {
     selectRef,
     selectionRef,
     popperRef,
+    validateState,
+    validateIcon,
     Effect: defaults.Effect,
     debouncedOnInputChange,
     deleteTag,