element-plus 1.2.0-beta.2 → 1.2.0-beta.6

package/es/components/scrollbar/src/util.d.ts

@@ -1,3 +1,4 @@
+import type { CSSProperties } from 'vue';
 export declare const BAR_MAP: {
     vertical: {
         offset: string;
@@ -20,8 +21,8 @@ export declare const BAR_MAP: {
         direction: string;
     };
 };
-export declare function renderThumbStyle({ move, size, bar }: {
+export declare const renderThumbStyle: ({ move, size, bar }: {
     move: any;
     size: any;
     bar: any;
-}): any;
+}) => CSSProperties;

package/es/components/scrollbar/src/util.mjs

@@ -20,15 +20,10 @@ const BAR_MAP = {
     direction: "left"
   }
 };
-function renderThumbStyle({ move, size, bar }) {
-  const style = {};
-  const translate = `translate${bar.axis}(${move}%)`;
-  style[bar.size] = size;
-  style.transform = translate;
-  style.msTransform = translate;
-  style.webkitTransform = translate;
-  return style;
-}
+const renderThumbStyle = ({ move, size, bar }) => ({
+  [bar.size]: size,
+  transform: `translate${bar.axis}(${move}%)`
+});
 
 export { BAR_MAP, renderThumbStyle };
 //# sourceMappingURL=util.mjs.map

package/es/components/scrollbar/src/util.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"util.mjs","sources":["../../../../../../packages/components/scrollbar/src/util.ts"],"sourcesContent":["export const BAR_MAP = {\n  vertical: {\n    offset: 'offsetHeight',\n    scroll: 'scrollTop',\n    scrollSize: 'scrollHeight',\n    size: 'height',\n    key: 'vertical',\n    axis: 'Y',\n    client: 'clientY',\n    direction: 'top',\n  },\n  horizontal: {\n    offset: 'offsetWidth',\n    scroll: 'scrollLeft',\n    scrollSize: 'scrollWidth',\n    size: 'width',\n    key: 'horizontal',\n    axis: 'X',\n    client: 'clientX',\n    direction: 'left',\n  },\n}\n\nexport function renderThumbStyle({ move, size, bar }) {\n  const style = {} as any\n  const translate = `translate${bar.axis}(${move}%)`\n\n  style[bar.size] = size\n  style.transform = translate\n  style.msTransform = translate\n  style.webkitTransform = translate\n\n  return style\n}\n"],"names":[],"mappings":"MAAa,UAAU;AAAA,EACrB,UAAU;AAAA,IACR,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,MAAM;AAAA,IACN,KAAK;AAAA,IACL,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,WAAW;AAAA;AAAA,EAEb,YAAY;AAAA,IACV,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,MAAM;AAAA,IACN,KAAK;AAAA,IACL,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,WAAW;AAAA;AAAA;0BAIkB,EAAE,MAAM,MAAM,OAAO;AACpD,QAAM,QAAQ;AACd,QAAM,YAAY,YAAY,IAAI,QAAQ;AAE1C,QAAM,IAAI,QAAQ;AAClB,QAAM,YAAY;AAClB,QAAM,cAAc;AACpB,QAAM,kBAAkB;AAExB,SAAO;AAAA;;;;"}
+{"version":3,"file":"util.mjs","sources":["../../../../../../packages/components/scrollbar/src/util.ts"],"sourcesContent":["import type { CSSProperties } from 'vue'\n\nexport const BAR_MAP = {\n  vertical: {\n    offset: 'offsetHeight',\n    scroll: 'scrollTop',\n    scrollSize: 'scrollHeight',\n    size: 'height',\n    key: 'vertical',\n    axis: 'Y',\n    client: 'clientY',\n    direction: 'top',\n  },\n  horizontal: {\n    offset: 'offsetWidth',\n    scroll: 'scrollLeft',\n    scrollSize: 'scrollWidth',\n    size: 'width',\n    key: 'horizontal',\n    axis: 'X',\n    client: 'clientX',\n    direction: 'left',\n  },\n}\n\nexport const renderThumbStyle = ({ move, size, bar }): CSSProperties => ({\n  [bar.size]: size,\n  transform: `translate${bar.axis}(${move}%)`,\n})\n"],"names":[],"mappings":"MAEa,UAAU;AAAA,EACrB,UAAU;AAAA,IACR,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,MAAM;AAAA,IACN,KAAK;AAAA,IACL,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,WAAW;AAAA;AAAA,EAEb,YAAY;AAAA,IACV,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,MAAM;AAAA,IACN,KAAK;AAAA,IACL,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,WAAW;AAAA;AAAA;MAIF,mBAAmB,CAAC,EAAE,MAAM,MAAM;AAA0B,GACtE,IAAI,OAAO;AAAA,EACZ,WAAW,YAAY,IAAI,QAAQ;AAAA;;;;"}

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

@@ -2,7 +2,7 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
     name: StringConstructor;
     id: StringConstructor;
     modelValue: {
-        type: (BooleanConstructor | ObjectConstructor | NumberConstructor | StringConstructor | ArrayConstructor)[];
+        type: (BooleanConstructor | ObjectConstructor | StringConstructor | NumberConstructor | ArrayConstructor)[];
         default: undefined;
     };
     autocomplete: {
@@ -56,11 +56,19 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
         type: BooleanConstructor;
         default: boolean;
     };
+    suffixIcon: {
+        type: import("vue").PropType<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>;
+        default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{}>, {}>;
+    };
+    tagType: {
+        type: StringConstructor;
+        default: string;
+    };
 }, {
     Effect: typeof import("..").Effect;
     tagInMultiLine: import("vue").Ref<boolean>;
     prefixWidth: import("vue").Ref<null>;
-    selectSize: import("vue").ComputedRef<any>;
+    selectSize: import("vue").ComputedRef<"" | import("../../utils/types").ComponentSize>;
     readonly: import("vue").ComputedRef<any>;
     handleResize: () => void;
     collapseTagSize: import("vue").ComputedRef<"small" | "mini">;
@@ -90,7 +98,7 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
     managePlaceholder: () => void;
     showClose: import("vue").ComputedRef<any>;
     selectDisabled: import("vue").ComputedRef<any>;
-    iconComponent: import("vue").ComputedRef<"" | import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{}>, {}>>;
+    iconComponent: import("vue").ComputedRef<any>;
     iconReverse: import("vue").ComputedRef<"" | "is-reverse">;
     showNewOption: import("vue").ComputedRef<any>;
     emptyText: import("vue").ComputedRef<any>;
@@ -116,7 +124,7 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
     tags: import("vue").Ref<null>;
     selectWrapper: import("vue").Ref<HTMLElement | null>;
     scrollbar: import("vue").Ref<null>;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("clear" | "focus" | "update:modelValue" | "change" | "blur" | "visible-change" | "remove-tag")[], "change" | "clear" | "focus" | "update:modelValue" | "blur" | "visible-change" | "remove-tag", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "change" | "blur" | "focus" | "clear" | "visible-change" | "remove-tag")[], "update:modelValue" | "change" | "blur" | "focus" | "clear" | "visible-change" | "remove-tag", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     name?: unknown;
     id?: unknown;
     modelValue?: unknown;
@@ -145,15 +153,18 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
     popperAppendToBody?: unknown;
     clearIcon?: unknown;
     fitInputWidth?: unknown;
+    suffixIcon?: unknown;
+    tagType?: unknown;
 } & {
-    multiple: boolean;
     disabled: boolean;
+    loading: boolean;
+    multiple: boolean;
     popperClass: string;
     autocomplete: string;
     clearable: boolean;
+    suffixIcon: string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;
     valueKey: string;
     popperAppendToBody: boolean;
-    loading: boolean;
     filterable: boolean;
     collapseTags: boolean;
     clearIcon: string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;
@@ -164,10 +175,11 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
     multipleLimit: number;
     defaultFirstOption: boolean;
     reserveKeyword: boolean;
+    tagType: string;
 } & {
-    name?: string | undefined;
     size?: import("../../utils/types").ComponentSize | undefined;
-    modelValue?: string | number | boolean | Record<string, any> | unknown[] | undefined;
+    name?: string | undefined;
+    modelValue?: string | number | boolean | unknown[] | Record<string, any> | undefined;
     placeholder?: string | undefined;
     id?: string | undefined;
     filterMethod?: Function | undefined;
@@ -177,22 +189,23 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
     remoteMethod?: Function | undefined;
 }> & {
     onChange?: ((...args: any[]) => any) | undefined;
-    onClear?: ((...args: any[]) => any) | undefined;
-    onFocus?: ((...args: any[]) => any) | undefined;
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
     onBlur?: ((...args: any[]) => any) | undefined;
+    onFocus?: ((...args: any[]) => any) | undefined;
+    onClear?: ((...args: any[]) => any) | undefined;
     "onVisible-change"?: ((...args: any[]) => any) | undefined;
     "onRemove-tag"?: ((...args: any[]) => any) | undefined;
 }, {
-    multiple: boolean;
     disabled: boolean;
+    loading: boolean;
+    modelValue: string | number | boolean | unknown[] | Record<string, any>;
+    multiple: boolean;
     popperClass: string;
-    modelValue: string | number | boolean | Record<string, any> | unknown[];
     autocomplete: string;
     clearable: boolean;
+    suffixIcon: string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;
     valueKey: string;
     popperAppendToBody: boolean;
-    loading: boolean;
     filterable: boolean;
     collapseTags: boolean;
     clearIcon: string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;
@@ -203,13 +216,14 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
     multipleLimit: number;
     defaultFirstOption: boolean;
     reserveKeyword: boolean;
+    tagType: string;
 }>> & {
     Option: import("vue").DefineComponent<{
         value: {
             required: true;
-            type: (BooleanConstructor | ObjectConstructor | NumberConstructor | StringConstructor)[];
+            type: (BooleanConstructor | ObjectConstructor | StringConstructor | NumberConstructor)[];
         };
-        label: (NumberConstructor | StringConstructor)[];
+        label: (StringConstructor | NumberConstructor)[];
         created: BooleanConstructor;
         disabled: {
             type: BooleanConstructor;
@@ -224,6 +238,13 @@ export declare const ElSelect: import("../../utils/types").SFCWithInstall<import
         visible: import("vue").Ref<boolean>;
         hover: import("vue").Ref<boolean>;
         selectOptionClick: () => void;
+        states: {
+            index: number;
+            groupDisabled: boolean;
+            visible: boolean;
+            hitState: boolean;
+            hover: boolean;
+        };
     }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
         value?: unknown;
         label?: unknown;
@@ -262,9 +283,9 @@ export default ElSelect;
 export declare const ElOption: import("../../utils/types").SFCWithInstall<import("vue").DefineComponent<{
     value: {
         required: true;
-        type: (BooleanConstructor | ObjectConstructor | NumberConstructor | StringConstructor)[];
+        type: (BooleanConstructor | ObjectConstructor | StringConstructor | NumberConstructor)[];
     };
-    label: (NumberConstructor | StringConstructor)[];
+    label: (StringConstructor | NumberConstructor)[];
     created: BooleanConstructor;
     disabled: {
         type: BooleanConstructor;
@@ -279,6 +300,13 @@ export declare const ElOption: import("../../utils/types").SFCWithInstall<import
     visible: import("vue").Ref<boolean>;
     hover: import("vue").Ref<boolean>;
     selectOptionClick: () => void;
+    states: {
+        index: number;
+        groupDisabled: boolean;
+        visible: boolean;
+        hitState: boolean;
+        hover: boolean;
+    };
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     value?: unknown;
     label?: unknown;

package/es/components/select/index.mjs

@@ -3,9 +3,9 @@ import './src/select.mjs';
 import './src/option.mjs';
 import './src/option-group.mjs';
 export { selectGroupKey, selectKey } from './src/token.mjs';
-import script from './src/select.vue_vue&type=script&lang.mjs';
-import script$1 from './src/option.vue_vue&type=script&lang.mjs';
-import script$2 from './src/option-group.vue_vue&type=script&lang.mjs';
+import script from './src/select.vue_vue_type_script_lang.mjs';
+import script$1 from './src/option.vue_vue_type_script_lang.mjs';
+import script$2 from './src/option-group.vue_vue_type_script_lang.mjs';
 
 const ElSelect = withInstall(script, {
   Option: script$1,

package/es/components/select/src/option-group.mjs

@@ -1,6 +1,6 @@
-import script from './option-group.vue_vue&type=script&lang.mjs';
-export { default } from './option-group.vue_vue&type=script&lang.mjs';
-import { render } from './option-group.vue_vue&type=template&id=072bbb70&lang.mjs';
+import script from './option-group.vue_vue_type_script_lang.mjs';
+export { default } from './option-group.vue_vue_type_script_lang.mjs';
+import { render } from './option-group.vue_vue_type_template_id_072bbb70_lang.mjs';
 
 script.render = render;
 script.__file = "packages/components/select/src/option-group.vue";

package/es/components/select/src/option-group.vue_vue_type_script_lang.mjs

@@ -0,0 +1,50 @@
+import { defineComponent, ref, getCurrentInstance, provide, reactive, toRefs, inject, onMounted, toRaw, watch } from 'vue';
+import { selectGroupKey, selectKey } from './token.mjs';
+
+var script = defineComponent({
+  name: "ElOptionGroup",
+  componentName: "ElOptionGroup",
+  props: {
+    label: String,
+    disabled: {
+      type: Boolean,
+      default: false
+    }
+  },
+  setup(props) {
+    const visible = ref(true);
+    const instance = getCurrentInstance();
+    const children = ref([]);
+    provide(selectGroupKey, reactive({
+      ...toRefs(props)
+    }));
+    const select = inject(selectKey);
+    onMounted(() => {
+      children.value = flattedChildren(instance.subTree);
+    });
+    const flattedChildren = (node) => {
+      const children2 = [];
+      if (Array.isArray(node.children)) {
+        node.children.forEach((child) => {
+          var _a;
+          if (child.type && child.type.name === "ElOption" && child.component && child.component.proxy) {
+            children2.push(child.component.proxy);
+          } else if ((_a = child.children) == null ? void 0 : _a.length) {
+            children2.push(...flattedChildren(child));
+          }
+        });
+      }
+      return children2;
+    };
+    const { groupQueryChange } = toRaw(select);
+    watch(groupQueryChange, () => {
+      visible.value = children.value.some((option) => option.visible === true);
+    });
+    return {
+      visible
+    };
+  }
+});
+
+export { script as default };
+//# sourceMappingURL=option-group.vue_vue_type_script_lang.mjs.map

package/es/components/select/src/option-group.vue_vue_type_script_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"option-group.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/select/src/option-group.vue"],"sourcesContent":["<template>\n  <ul v-show=\"visible\" class=\"el-select-group__wrap\">\n    <li class=\"el-select-group__title\">{{ label }}</li>\n    <li>\n      <ul class=\"el-select-group\">\n        <slot></slot>\n      </ul>\n    </li>\n  </ul>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  provide,\n  inject,\n  ref,\n  reactive,\n  toRefs,\n  getCurrentInstance,\n  onMounted,\n  watch,\n  toRaw,\n} from 'vue'\nimport { selectGroupKey, selectKey } from './token'\n\nexport default defineComponent({\n  name: 'ElOptionGroup',\n  componentName: 'ElOptionGroup',\n\n  props: {\n    label: String,\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n  },\n  setup(props) {\n    const visible = ref(true)\n    const instance = getCurrentInstance()\n    const children = ref([])\n\n    provide(\n      selectGroupKey,\n      reactive({\n        ...toRefs(props),\n      })\n    )\n\n    const select = inject(selectKey)\n\n    onMounted(() => {\n      children.value = flattedChildren(instance.subTree)\n    })\n\n    // get all instances of options\n    const flattedChildren = (node) => {\n      const children = []\n      if (Array.isArray(node.children)) {\n        node.children.forEach((child) => {\n          if (\n            child.type &&\n            child.type.name === 'ElOption' &&\n            child.component &&\n            child.component.proxy\n          ) {\n            children.push(child.component.proxy)\n          } else if (child.children?.length) {\n            children.push(...flattedChildren(child))\n          }\n        })\n      }\n      return children\n    }\n\n    const { groupQueryChange } = toRaw(select)\n    watch(groupQueryChange, () => {\n      visible.value = children.value.some((option) => option.visible === true)\n    })\n\n    return {\n      visible,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;AA0BA,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,eAAe;AAAA,EAEf,OAAO;AAAA,IACL,OAAO;AAAA,IACP,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA;AAAA;AAAA,EAGb,MAAM,OAAO;AACX,UAAM,UAAU,IAAI;AACpB,UAAM,WAAW;AACjB,UAAM,WAAW,IAAI;AAErB,YACE,gBACA,SAAS;AAAA,SACJ,OAAO;AAAA;AAId,UAAM,SAAS,OAAO;AAEtB,cAAU,MAAM;AACd,eAAS,QAAQ,gBAAgB,SAAS;AAAA;AAI5C,UAAM,kBAAkB,CAAC,SAAS;AAChC,YAAM,YAAW;AACjB,UAAI,MAAM,QAAQ,KAAK,WAAW;AAChC,aAAK,SAAS,QAAQ,CAAC,UAAU;;AAC/B,cACE,MAAM,QACN,MAAM,KAAK,SAAS,cACpB,MAAM,aACN,MAAM,UAAU,OAChB;AACA,sBAAS,KAAK,MAAM,UAAU;AAAA,qBACrB,YAAM,aAAN,mBAAgB,QAAQ;AACjC,sBAAS,KAAK,GAAG,gBAAgB;AAAA;AAAA;AAAA;AAIvC,aAAO;AAAA;AAGT,UAAM,EAAE,qBAAqB,MAAM;AACnC,UAAM,kBAAkB,MAAM;AAC5B,cAAQ,QAAQ,SAAS,MAAM,KAAK,CAAC,WAAW,OAAO,YAAY;AAAA;AAGrE,WAAO;AAAA,MACL;AAAA;AAAA;AAAA;;;;"}

package/es/components/select/src/option-group.vue_vue_type_template_id_072bbb70_lang.mjs

@@ -0,0 +1,20 @@
+import { withDirectives, openBlock, createElementBlock, createElementVNode, toDisplayString, renderSlot, vShow } from 'vue';
+
+const _hoisted_1 = { class: "el-select-group__wrap" };
+const _hoisted_2 = { class: "el-select-group__title" };
+const _hoisted_3 = { class: "el-select-group" };
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return withDirectives((openBlock(), createElementBlock("ul", _hoisted_1, [
+    createElementVNode("li", _hoisted_2, toDisplayString(_ctx.label), 1),
+    createElementVNode("li", null, [
+      createElementVNode("ul", _hoisted_3, [
+        renderSlot(_ctx.$slots, "default")
+      ])
+    ])
+  ], 512)), [
+    [vShow, _ctx.visible]
+  ]);
+}
+
+export { render };
+//# sourceMappingURL=option-group.vue_vue_type_template_id_072bbb70_lang.mjs.map

package/es/components/select/src/option-group.vue_vue_type_template_id_072bbb70_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"option-group.vue_vue_type_template_id_072bbb70_lang.mjs","sources":["../../../../../../packages/components/select/src/option-group.vue?vue&type=template&id=072bbb70&lang.js"],"sourcesContent":["<template>\n  <ul v-show=\"visible\" class=\"el-select-group__wrap\">\n    <li class=\"el-select-group__title\">{{ label }}</li>\n    <li>\n      <ul class=\"el-select-group\">\n        <slot></slot>\n      </ul>\n    </li>\n  </ul>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  provide,\n  inject,\n  ref,\n  reactive,\n  toRefs,\n  getCurrentInstance,\n  onMounted,\n  watch,\n  toRaw,\n} from 'vue'\nimport { selectGroupKey, selectKey } from './token'\n\nexport default defineComponent({\n  name: 'ElOptionGroup',\n  componentName: 'ElOptionGroup',\n\n  props: {\n    label: String,\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n  },\n  setup(props) {\n    const visible = ref(true)\n    const instance = getCurrentInstance()\n    const children = ref([])\n\n    provide(\n      selectGroupKey,\n      reactive({\n        ...toRefs(props),\n      })\n    )\n\n    const select = inject(selectKey)\n\n    onMounted(() => {\n      children.value = flattedChildren(instance.subTree)\n    })\n\n    // get all instances of options\n    const flattedChildren = (node) => {\n      const children = []\n      if (Array.isArray(node.children)) {\n        node.children.forEach((child) => {\n          if (\n            child.type &&\n            child.type.name === 'ElOption' &&\n            child.component &&\n            child.component.proxy\n          ) {\n            children.push(child.component.proxy)\n          } else if (child.children?.length) {\n            children.push(...flattedChildren(child))\n          }\n        })\n      }\n      return children\n    }\n\n    const { groupQueryChange } = toRaw(select)\n    watch(groupQueryChange, () => {\n      visible.value = children.value.some((option) => option.visible === true)\n    })\n\n    return {\n      visible,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_createElementVNode","_renderSlot"],"mappings":";;qBACuB,OAAM;qBACrB,OAAM;qBAEJ,OAAM;;sCAHdA,yBAAA;IACEC,yBAAA,4BAAsC;IACtCA;MACEA,yBAAA;QACEC;;;;YAJM;;;;;;"}

package/es/components/select/src/option.mjs

@@ -1,6 +1,6 @@
-import script from './option.vue_vue&type=script&lang.mjs';
-export { default } from './option.vue_vue&type=script&lang.mjs';
-import { render } from './option.vue_vue&type=template&id=2feb8304&lang.mjs';
+import script from './option.vue_vue_type_script_lang.mjs';
+export { default } from './option.vue_vue_type_script_lang.mjs';
+import { render } from './option.vue_vue_type_template_id_2feb8304_lang.mjs';
 
 script.render = render;
 script.__file = "packages/components/select/src/option.vue";

package/es/components/select/src/option.vue.d.ts

@@ -1,9 +1,9 @@
 declare const _default: import("vue").DefineComponent<{
     value: {
         required: true;
-        type: (BooleanConstructor | ObjectConstructor | NumberConstructor | StringConstructor)[];
+        type: (BooleanConstructor | ObjectConstructor | StringConstructor | NumberConstructor)[];
     };
-    label: (NumberConstructor | StringConstructor)[];
+    label: (StringConstructor | NumberConstructor)[];
     created: BooleanConstructor;
     disabled: {
         type: BooleanConstructor;
@@ -18,6 +18,13 @@ declare const _default: import("vue").DefineComponent<{
     visible: import("vue").Ref<boolean>;
     hover: import("vue").Ref<boolean>;
     selectOptionClick: () => void;
+    states: {
+        index: number;
+        groupDisabled: boolean;
+        visible: boolean;
+        hitState: boolean;
+        hover: boolean;
+    };
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     value?: unknown;
     label?: unknown;

package/es/components/select/src/option.vue_vue_type_script_lang.mjs

@@ -0,0 +1,64 @@
+import { defineComponent, reactive, toRefs, getCurrentInstance, onBeforeUnmount } from 'vue';
+import { useOption } from './useOption.mjs';
+
+var script = defineComponent({
+  name: "ElOption",
+  componentName: "ElOption",
+  props: {
+    value: {
+      required: true,
+      type: [String, Number, Boolean, Object]
+    },
+    label: [String, Number],
+    created: Boolean,
+    disabled: {
+      type: Boolean,
+      default: false
+    }
+  },
+  setup(props) {
+    const states = reactive({
+      index: -1,
+      groupDisabled: false,
+      visible: true,
+      hitState: false,
+      hover: false
+    });
+    const { currentLabel, itemSelected, isDisabled, select, hoverItem } = useOption(props, states);
+    const { visible, hover } = toRefs(states);
+    const vm = getCurrentInstance().proxy;
+    const key = vm.value;
+    select.onOptionCreate(vm);
+    onBeforeUnmount(() => {
+      const { selected } = select;
+      const selectedOptions = select.props.multiple ? selected : [selected];
+      const doesExist = select.cachedOptions.has(key);
+      const doesSelected = selectedOptions.some((item) => {
+        return item.value === vm.value;
+      });
+      if (doesExist && !doesSelected) {
+        select.cachedOptions.delete(key);
+      }
+      select.onOptionDestroy(key);
+    });
+    function selectOptionClick() {
+      if (props.disabled !== true && states.groupDisabled !== true) {
+        select.handleOptionSelect(vm, true);
+      }
+    }
+    return {
+      currentLabel,
+      itemSelected,
+      isDisabled,
+      select,
+      hoverItem,
+      visible,
+      hover,
+      selectOptionClick,
+      states
+    };
+  }
+});
+
+export { script as default };
+//# sourceMappingURL=option.vue_vue_type_script_lang.mjs.map

package/es/components/select/src/option.vue_vue_type_script_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"option.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/select/src/option.vue"],"sourcesContent":["<template>\n  <li\n    v-show=\"visible\"\n    class=\"el-select-dropdown__item\"\n    :class=\"{\n      selected: itemSelected,\n      'is-disabled': isDisabled,\n      hover: hover,\n    }\"\n    @mouseenter=\"hoverItem\"\n    @click.stop=\"selectOptionClick\"\n  >\n    <slot>\n      <span>{{ currentLabel }}</span>\n    </slot>\n  </li>\n</template>\n\n<script lang=\"ts\">\nimport {\n  toRefs,\n  defineComponent,\n  getCurrentInstance,\n  onBeforeUnmount,\n  reactive,\n} from 'vue'\nimport { useOption } from './useOption'\nimport type { SelectOptionProxy } from './token'\n\nexport default defineComponent({\n  name: 'ElOption',\n  componentName: 'ElOption',\n\n  props: {\n    value: {\n      required: true,\n      type: [String, Number, Boolean, Object],\n    },\n    label: [String, Number],\n    created: Boolean,\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n  },\n\n  setup(props) {\n    const states = reactive({\n      index: -1,\n      groupDisabled: false,\n      visible: true,\n      hitState: false,\n      hover: false,\n    })\n\n    const { currentLabel, itemSelected, isDisabled, select, hoverItem } =\n      useOption(props, states)\n\n    const { visible, hover } = toRefs(states)\n\n    const vm = getCurrentInstance().proxy\n    const key = (vm as unknown as SelectOptionProxy).value\n    select.onOptionCreate(vm as unknown as SelectOptionProxy)\n\n    onBeforeUnmount(() => {\n      const { selected } = select\n      const selectedOptions = select.props.multiple ? selected : [selected]\n      const doesExist = select.cachedOptions.has(key)\n      const doesSelected = selectedOptions.some((item) => {\n        return item.value === (vm as unknown as SelectOptionProxy).value\n      })\n      // if option is not selected, remove it from cache\n      if (doesExist && !doesSelected) {\n        select.cachedOptions.delete(key)\n      }\n      select.onOptionDestroy(key)\n    })\n\n    function selectOptionClick() {\n      if (props.disabled !== true && states.groupDisabled !== true) {\n        select.handleOptionSelect(vm, true)\n      }\n    }\n\n    return {\n      currentLabel,\n      itemSelected,\n      isDisabled,\n      select,\n      hoverItem,\n      visible,\n      hover,\n      selectOptionClick,\n      states,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;AA6BA,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,eAAe;AAAA,EAEf,OAAO;AAAA,IACL,OAAO;AAAA,MACL,UAAU;AAAA,MACV,MAAM,CAAC,QAAQ,QAAQ,SAAS;AAAA;AAAA,IAElC,OAAO,CAAC,QAAQ;AAAA,IAChB,SAAS;AAAA,IACT,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA;AAAA;AAAA,EAIb,MAAM,OAAO;AACX,UAAM,SAAS,SAAS;AAAA,MACtB,OAAO;AAAA,MACP,eAAe;AAAA,MACf,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OAAO;AAAA;AAGT,UAAM,EAAE,cAAc,cAAc,YAAY,QAAQ,cACtD,UAAU,OAAO;AAEnB,UAAM,EAAE,SAAS,UAAU,OAAO;AAElC,UAAM,KAAK,qBAAqB;AAChC,UAAM,MAAO,GAAoC;AACjD,WAAO,eAAe;AAEtB,oBAAgB,MAAM;AACpB,YAAM,EAAE,aAAa;AACrB,YAAM,kBAAkB,OAAO,MAAM,WAAW,WAAW,CAAC;AAC5D,YAAM,YAAY,OAAO,cAAc,IAAI;AAC3C,YAAM,eAAe,gBAAgB,KAAK,CAAC,SAAS;AAClD,eAAO,KAAK,UAAW,GAAoC;AAAA;AAG7D,UAAI,aAAa,CAAC,cAAc;AAC9B,eAAO,cAAc,OAAO;AAAA;AAE9B,aAAO,gBAAgB;AAAA;AAGzB,iCAA6B;AAC3B,UAAI,MAAM,aAAa,QAAQ,OAAO,kBAAkB,MAAM;AAC5D,eAAO,mBAAmB,IAAI;AAAA;AAAA;AAIlC,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}

package/es/components/select/src/option.vue_vue_type_template_id_2feb8304_lang.mjs

@@ -0,0 +1,22 @@
+import { withDirectives, openBlock, createElementBlock, normalizeClass, withModifiers, renderSlot, createElementVNode, toDisplayString, vShow } from 'vue';
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return withDirectives((openBlock(), createElementBlock("li", {
+    class: normalizeClass(["el-select-dropdown__item", {
+      selected: _ctx.itemSelected,
+      "is-disabled": _ctx.isDisabled,
+      hover: _ctx.hover
+    }]),
+    onMouseenter: _cache[0] || (_cache[0] = (...args) => _ctx.hoverItem && _ctx.hoverItem(...args)),
+    onClick: _cache[1] || (_cache[1] = withModifiers((...args) => _ctx.selectOptionClick && _ctx.selectOptionClick(...args), ["stop"]))
+  }, [
+    renderSlot(_ctx.$slots, "default", {}, () => [
+      createElementVNode("span", null, toDisplayString(_ctx.currentLabel), 1)
+    ])
+  ], 34)), [
+    [vShow, _ctx.visible]
+  ]);
+}
+
+export { render };
+//# sourceMappingURL=option.vue_vue_type_template_id_2feb8304_lang.mjs.map

package/es/components/select/src/option.vue_vue_type_template_id_2feb8304_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"option.vue_vue_type_template_id_2feb8304_lang.mjs","sources":["../../../../../../packages/components/select/src/option.vue?vue&type=template&id=2feb8304&lang.js"],"sourcesContent":["<template>\n  <li\n    v-show=\"visible\"\n    class=\"el-select-dropdown__item\"\n    :class=\"{\n      selected: itemSelected,\n      'is-disabled': isDisabled,\n      hover: hover,\n    }\"\n    @mouseenter=\"hoverItem\"\n    @click.stop=\"selectOptionClick\"\n  >\n    <slot>\n      <span>{{ currentLabel }}</span>\n    </slot>\n  </li>\n</template>\n\n<script lang=\"ts\">\nimport {\n  toRefs,\n  defineComponent,\n  getCurrentInstance,\n  onBeforeUnmount,\n  reactive,\n} from 'vue'\nimport { useOption } from './useOption'\nimport type { SelectOptionProxy } from './token'\n\nexport default defineComponent({\n  name: 'ElOption',\n  componentName: 'ElOption',\n\n  props: {\n    value: {\n      required: true,\n      type: [String, Number, Boolean, Object],\n    },\n    label: [String, Number],\n    created: Boolean,\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n  },\n\n  setup(props) {\n    const states = reactive({\n      index: -1,\n      groupDisabled: false,\n      visible: true,\n      hitState: false,\n      hover: false,\n    })\n\n    const { currentLabel, itemSelected, isDisabled, select, hoverItem } =\n      useOption(props, states)\n\n    const { visible, hover } = toRefs(states)\n\n    const vm = getCurrentInstance().proxy\n    const key = (vm as unknown as SelectOptionProxy).value\n    select.onOptionCreate(vm as unknown as SelectOptionProxy)\n\n    onBeforeUnmount(() => {\n      const { selected } = select\n      const selectedOptions = select.props.multiple ? selected : [selected]\n      const doesExist = select.cachedOptions.has(key)\n      const doesSelected = selectedOptions.some((item) => {\n        return item.value === (vm as unknown as SelectOptionProxy).value\n      })\n      // if option is not selected, remove it from cache\n      if (doesExist && !doesSelected) {\n        select.cachedOptions.delete(key)\n      }\n      select.onOptionDestroy(key)\n    })\n\n    function selectOptionClick() {\n      if (props.disabled !== true && states.groupDisabled !== true) {\n        select.handleOptionSelect(vm, true)\n      }\n    }\n\n    return {\n      currentLabel,\n      itemSelected,\n      isDisabled,\n      select,\n      hoverItem,\n      visible,\n      hover,\n      selectOptionClick,\n      states,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_renderSlot","_createElementVNode"],"mappings":";;;sCACEA;IAEE,uBAAM;;;;;IAML,qDAAY;IACZ,8DAAY;;IAEbC,uCAAA;MACEC,iDAAS;;;YAXH;;;;;;"}

package/es/components/select/src/select-dropdown.mjs

@@ -1,6 +1,6 @@
-import script from './select-dropdown.vue_vue&type=script&lang.mjs';
-export { default } from './select-dropdown.vue_vue&type=script&lang.mjs';
-import { render } from './select-dropdown.vue_vue&type=template&id=46cf6eee&lang.mjs';
+import script from './select-dropdown.vue_vue_type_script_lang.mjs';
+export { default } from './select-dropdown.vue_vue_type_script_lang.mjs';
+import { render } from './select-dropdown.vue_vue_type_template_id_46cf6eee_lang.mjs';
 
 script.render = render;
 script.__file = "packages/components/select/src/select-dropdown.vue";

package/es/components/select/src/select-dropdown.vue_vue_type_script_lang.mjs

@@ -0,0 +1,34 @@
+import { defineComponent, inject, computed, ref, onMounted, onBeforeUnmount } from 'vue';
+import { addResizeListener, removeResizeListener } from '../../../utils/resize-event.mjs';
+import { selectKey } from './token.mjs';
+
+var script = defineComponent({
+  name: "ElSelectDropdown",
+  componentName: "ElSelectDropdown",
+  setup() {
+    const select = inject(selectKey);
+    const popperClass = computed(() => select.props.popperClass);
+    const isMultiple = computed(() => select.props.multiple);
+    const isFitInputWidth = computed(() => select.props.fitInputWidth);
+    const minWidth = ref("");
+    function updateMinWidth() {
+      var _a;
+      minWidth.value = `${(_a = select.selectWrapper) == null ? void 0 : _a.getBoundingClientRect().width}px`;
+    }
+    onMounted(() => {
+      addResizeListener(select.selectWrapper, updateMinWidth);
+    });
+    onBeforeUnmount(() => {
+      removeResizeListener(select.selectWrapper, updateMinWidth);
+    });
+    return {
+      minWidth,
+      popperClass,
+      isMultiple,
+      isFitInputWidth
+    };
+  }
+});
+
+export { script as default };
+//# sourceMappingURL=select-dropdown.vue_vue_type_script_lang.mjs.map

package/es/components/select/src/select-dropdown.vue_vue_type_script_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-dropdown.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/select/src/select-dropdown.vue"],"sourcesContent":["<template>\n  <div\n    class=\"el-select-dropdown\"\n    :class=\"[{ 'is-multiple': isMultiple }, popperClass]\"\n    :style=\"{ [isFitInputWidth ? 'width' : 'minWidth']: minWidth }\"\n  >\n    <slot></slot>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  computed,\n  onMounted,\n  onBeforeUnmount,\n  inject,\n  ref,\n} from 'vue'\nimport {\n  addResizeListener,\n  removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { selectKey } from './token'\nimport type { ResizableElement } from '@element-plus/utils/resize-event'\n\nexport default defineComponent({\n  name: 'ElSelectDropdown',\n\n  componentName: 'ElSelectDropdown',\n\n  setup() {\n    const select = inject(selectKey)\n\n    // computed\n    const popperClass = computed(() => select.props.popperClass)\n    const isMultiple = computed(() => select.props.multiple)\n    const isFitInputWidth = computed(() => select.props.fitInputWidth)\n    const minWidth = ref('')\n\n    function updateMinWidth() {\n      minWidth.value = `${\n        select.selectWrapper?.getBoundingClientRect().width\n      }px`\n    }\n\n    onMounted(() => {\n      // TODO: updatePopper\n      // popper.value.update()\n\n      addResizeListener(\n        select.selectWrapper as ResizableElement,\n        updateMinWidth\n      )\n    })\n\n    onBeforeUnmount(() => {\n      removeResizeListener(\n        select.selectWrapper as ResizableElement,\n        updateMinWidth\n      )\n    })\n\n    return {\n      minWidth,\n      popperClass,\n      isMultiple,\n      isFitInputWidth,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;AA0BA,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EAEN,eAAe;AAAA,EAEf,QAAQ;AACN,UAAM,SAAS,OAAO;AAGtB,UAAM,cAAc,SAAS,MAAM,OAAO,MAAM;AAChD,UAAM,aAAa,SAAS,MAAM,OAAO,MAAM;AAC/C,UAAM,kBAAkB,SAAS,MAAM,OAAO,MAAM;AACpD,UAAM,WAAW,IAAI;AAErB,8BAA0B;;AACxB,eAAS,QAAQ,GACf,aAAO,kBAAP,mBAAsB,wBAAwB;AAAA;AAIlD,cAAU,MAAM;AAId,wBACE,OAAO,eACP;AAAA;AAIJ,oBAAgB,MAAM;AACpB,2BACE,OAAO,eACP;AAAA;AAIJ,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}

package/es/components/select/src/select-dropdown.vue_vue_type_template_id_46cf6eee_lang.mjs

@@ -0,0 +1,13 @@
+import { openBlock, createElementBlock, normalizeClass, normalizeStyle, renderSlot } from 'vue';
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", {
+    class: normalizeClass(["el-select-dropdown", [{ "is-multiple": _ctx.isMultiple }, _ctx.popperClass]]),
+    style: normalizeStyle({ [_ctx.isFitInputWidth ? "width" : "minWidth"]: _ctx.minWidth })
+  }, [
+    renderSlot(_ctx.$slots, "default")
+  ], 6);
+}
+
+export { render };
+//# sourceMappingURL=select-dropdown.vue_vue_type_template_id_46cf6eee_lang.mjs.map

package/es/components/select/src/select-dropdown.vue_vue_type_template_id_46cf6eee_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-dropdown.vue_vue_type_template_id_46cf6eee_lang.mjs","sources":["../../../../../../packages/components/select/src/select-dropdown.vue?vue&type=template&id=46cf6eee&lang.js"],"sourcesContent":["<template>\n  <div\n    class=\"el-select-dropdown\"\n    :class=\"[{ 'is-multiple': isMultiple }, popperClass]\"\n    :style=\"{ [isFitInputWidth ? 'width' : 'minWidth']: minWidth }\"\n  >\n    <slot></slot>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  computed,\n  onMounted,\n  onBeforeUnmount,\n  inject,\n  ref,\n} from 'vue'\nimport {\n  addResizeListener,\n  removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { selectKey } from './token'\nimport type { ResizableElement } from '@element-plus/utils/resize-event'\n\nexport default defineComponent({\n  name: 'ElSelectDropdown',\n\n  componentName: 'ElSelectDropdown',\n\n  setup() {\n    const select = inject(selectKey)\n\n    // computed\n    const popperClass = computed(() => select.props.popperClass)\n    const isMultiple = computed(() => select.props.multiple)\n    const isFitInputWidth = computed(() => select.props.fitInputWidth)\n    const minWidth = ref('')\n\n    function updateMinWidth() {\n      minWidth.value = `${\n        select.selectWrapper?.getBoundingClientRect().width\n      }px`\n    }\n\n    onMounted(() => {\n      // TODO: updatePopper\n      // popper.value.update()\n\n      addResizeListener(\n        select.selectWrapper as ResizableElement,\n        updateMinWidth\n      )\n    })\n\n    onBeforeUnmount(() => {\n      removeResizeListener(\n        select.selectWrapper as ResizableElement,\n        updateMinWidth\n      )\n    })\n\n    return {\n      minWidth,\n      popperClass,\n      isMultiple,\n      isFitInputWidth,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_renderSlot"],"mappings":";;;sBACEA;IACE,uBAAM,wCACoB,mBAAc;IACvC,yBAAU,8CAAyC;;IAEpDC;;;;;;"}

package/es/components/select/src/select.mjs

@@ -1,6 +1,6 @@
-import script from './select.vue_vue&type=script&lang.mjs';
-export { default } from './select.vue_vue&type=script&lang.mjs';
-import { render } from './select.vue_vue&type=template&id=33774f85&lang.mjs';
+import script from './select.vue_vue_type_script_lang.mjs';
+export { default } from './select.vue_vue_type_script_lang.mjs';
+import { render } from './select.vue_vue_type_template_id_33774f85_lang.mjs';
 
 script.render = render;
 script.__file = "packages/components/select/src/select.vue";