@element-plus/nightly 0.0.20220108 → 0.0.20220109

package/es/components/popconfirm/src/popconfirm.vue_vue_type_template_id_16409d25_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"popconfirm.vue_vue_type_template_id_16409d25_lang.mjs","sources":["../../../../../../packages/components/popconfirm/src/popconfirm.vue?vue&type=template&id=16409d25&lang.js"],"sourcesContent":["<template>\n  <el-tooltip\n    ref=\"tooltipRef\"\n    v-bind=\"$attrs\"\n    trigger=\"click\"\n    effect=\"light\"\n    popper-class=\"el-popover\"\n    append-to-body\n    :fallback-placements=\"['bottom', 'top', 'right', 'left']\"\n    :hide-after=\"hideAfter\"\n  >\n    <template #content>\n      <div class=\"el-popconfirm\">\n        <div class=\"el-popconfirm__main\">\n          <el-icon\n            v-if=\"!hideIcon && icon\"\n            class=\"el-popconfirm__icon\"\n            :style=\"{ color: iconColor }\"\n          >\n            <component :is=\"icon\" />\n          </el-icon>\n          {{ title }}\n        </div>\n        <div class=\"el-popconfirm__action\">\n          <el-button size=\"small\" :type=\"cancelButtonType\" @click=\"cancel\">\n            {{ finalCancelButtonText }}\n          </el-button>\n          <el-button size=\"small\" :type=\"confirmButtonType\" @click=\"confirm\">\n            {{ finalConfirmButtonText }}\n          </el-button>\n        </div>\n      </div>\n    </template>\n    <template v-if=\"$slots.reference\">\n      <slot name=\"reference\" />\n    </template>\n  </el-tooltip>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, computed, unref } from 'vue'\nimport ElButton from '@element-plus/components/button'\nimport ElIcon from '@element-plus/components/icon'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { useLocale } from '@element-plus/hooks'\nimport { popconfirmProps } from './popconfirm'\n\nexport default defineComponent({\n  name: 'ElPopconfirm',\n\n  components: {\n    ElButton,\n    ElTooltip,\n    ElIcon,\n  },\n\n  props: popconfirmProps,\n\n  setup(props) {\n    const { t } = useLocale()\n    const tooltipRef = ref<{ onClose: () => void }>()\n\n    const hidePopper = () => {\n      unref(tooltipRef)?.onClose?.()\n    }\n\n    const handleCallback = () => {\n      hidePopper()\n    }\n\n    const confirm = (e: Event) => {\n      props.onConfirm?.(e)\n      handleCallback()\n    }\n    const cancel = (e: Event) => {\n      props.onCancel?.(e)\n      handleCallback()\n    }\n\n    const finalConfirmButtonText = computed(\n      () => props.confirmButtonText || t('el.popconfirm.confirmButtonText')\n    )\n    const finalCancelButtonText = computed(\n      () => props.cancelButtonText || t('el.popconfirm.cancelButtonText')\n    )\n\n    return {\n      finalConfirmButtonText,\n      finalCancelButtonText,\n      tooltipRef,\n\n      confirm,\n      cancel,\n    }\n  },\n})\n</script>\n"],"names":["_toDisplayString"],"mappings":";;;qBAYW,KAAK,EAAC;qBACJ,KAAK,EAAC;4CAUuB;;;;;;;;IAnBtC;IACA;IACA,cAAY;IACZ;IACC;;;WAGiB;;;YAIH;;;;;;;gCAIPA;;;;;;;;;;;YAKgD;;;;;;;;;;YAGC;;;;;;;;;;;;;;"}
+{"version":3,"file":"popconfirm.vue_vue_type_template_id_16409d25_lang.mjs","sources":["../../../../../../packages/components/popconfirm/src/popconfirm.vue?vue&type=template&id=16409d25&lang.js"],"sourcesContent":["<template>\n  <el-tooltip\n    ref=\"tooltipRef\"\n    v-bind=\"$attrs\"\n    trigger=\"click\"\n    effect=\"light\"\n    popper-class=\"el-popover\"\n    append-to-body\n    :fallback-placements=\"['bottom', 'top', 'right', 'left']\"\n    :hide-after=\"hideAfter\"\n    persistent\n  >\n    <template #content>\n      <div class=\"el-popconfirm\">\n        <div class=\"el-popconfirm__main\">\n          <el-icon\n            v-if=\"!hideIcon && icon\"\n            class=\"el-popconfirm__icon\"\n            :style=\"{ color: iconColor }\"\n          >\n            <component :is=\"icon\" />\n          </el-icon>\n          {{ title }}\n        </div>\n        <div class=\"el-popconfirm__action\">\n          <el-button size=\"small\" :type=\"cancelButtonType\" @click=\"cancel\">\n            {{ finalCancelButtonText }}\n          </el-button>\n          <el-button size=\"small\" :type=\"confirmButtonType\" @click=\"confirm\">\n            {{ finalConfirmButtonText }}\n          </el-button>\n        </div>\n      </div>\n    </template>\n    <template v-if=\"$slots.reference\">\n      <slot name=\"reference\" />\n    </template>\n  </el-tooltip>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, computed, unref } from 'vue'\nimport ElButton from '@element-plus/components/button'\nimport ElIcon from '@element-plus/components/icon'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { useLocale } from '@element-plus/hooks'\nimport { popconfirmProps } from './popconfirm'\n\nexport default defineComponent({\n  name: 'ElPopconfirm',\n\n  components: {\n    ElButton,\n    ElTooltip,\n    ElIcon,\n  },\n\n  props: popconfirmProps,\n\n  setup(props) {\n    const { t } = useLocale()\n    const tooltipRef = ref<{ onClose: () => void }>()\n\n    const hidePopper = () => {\n      unref(tooltipRef)?.onClose?.()\n    }\n\n    const handleCallback = () => {\n      hidePopper()\n    }\n\n    const confirm = (e: Event) => {\n      props.onConfirm?.(e)\n      handleCallback()\n    }\n    const cancel = (e: Event) => {\n      props.onCancel?.(e)\n      handleCallback()\n    }\n\n    const finalConfirmButtonText = computed(\n      () => props.confirmButtonText || t('el.popconfirm.confirmButtonText')\n    )\n    const finalCancelButtonText = computed(\n      () => props.cancelButtonText || t('el.popconfirm.cancelButtonText')\n    )\n\n    return {\n      finalConfirmButtonText,\n      finalCancelButtonText,\n      tooltipRef,\n\n      confirm,\n      cancel,\n    }\n  },\n})\n</script>\n"],"names":["_toDisplayString"],"mappings":";;;qBAaW,KAAK,EAAC;qBACJ,KAAK,EAAC;4CAUuB;;;;;;;;IApBtC;IACA;IACA,cAAY;IACZ;IACC;IACA;;;WAGiB;;;YAIH;;;;;;;gCAIPA;;;;;;;;;;;YAKgD;;;;;;;;;;YAGC;;;;;;;;;;;;;;"}

package/es/components/popover/src/index.vue_vue_type_script_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/popover/src/index.vue"],"sourcesContent":["<template>\n  <el-tooltip\n    ref=\"tooltipRef\"\n    v-bind=\"$attrs\"\n    :aria-label=\"title\"\n    :effect=\"effect\"\n    :enterable=\"enterable\"\n    :popper-class=\"kls\"\n    :popper-style=\"style\"\n  >\n    <template v-if=\"$slots.reference\">\n      <slot name=\"reference\" />\n    </template>\n\n    <template #content>\n      <div v-if=\"title\" class=\"el-popover__title\" role=\"title\">\n        {{ title }}\n      </div>\n      <slot>\n        {{ content }}\n      </slot>\n    </template>\n  </el-tooltip>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, unref } from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { isString } from '@element-plus/utils/util'\nimport { usePopoverProps } from './popover'\n\nimport type { StyleValue } from 'vue'\n\nconst emits = ['update:visible', 'after-enter', 'after-leave']\n\nconst NAME = 'ElPopover'\n\nexport default defineComponent({\n  name: NAME,\n  components: {\n    ElTooltip,\n  },\n  props: usePopoverProps,\n  emits,\n  setup(props) {\n    const tooltipRef = ref<InstanceType<typeof ElTooltip> | null>(null)\n    const popperRef = computed(() => {\n      return unref(tooltipRef)?.popperRef\n    })\n    const width = computed(() => {\n      if (isString(props.width)) {\n        return props.width as string\n      }\n      return `${props.width}px`\n    })\n\n    const style = computed(() => {\n      return [\n        {\n          width: width.value,\n        },\n        props.popperStyle,\n      ] as StyleValue\n    })\n\n    const kls = computed(() => {\n      return [\n        { 'el-popover--plain': !!props.content },\n        'el-popover',\n        props.popperClass,\n      ]\n    })\n\n    return {\n      kls,\n      style,\n      tooltipRef,\n      popperRef,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;AA4BA,WAAW,GAAG,CAAC,kBAAkB;;AAEjC,aAAe,eAAe;;AAE9B,EAAE,UAAU,EAAE;;AAEd,GAAG;;AAEH,EAAE,KAAK;EACL,MAAM;IACJ,MAAM;IACN,MAAM;;MAEJ,OAAO,CAAC,EAAE,GAAG,KAAK;KACnB,CAAC,CAAC;IACH,MAAM,KAAK;MACT,IAAI,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;QACzB,OAAO,KAAK,MAAM,CAAC;OACpB;;KAEF,CAAC,CAAC;UACG,KAAK,GAAG,QAAQ,CAAC,MAAM;aACpB;;UAEH,KAAK,EAAE,KAAK,CAAC,KAAK;;;OAGrB,CAAC;MACF,CAAC;;aAEM;QACL;QACA,YAAY;QACZ,KAAK,CAAC;;;IAGV,OAAO;MACL,GAAG;WACE;gBACK;eACD;MACT;;;;;;"}
+{"version":3,"file":"index.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/popover/src/index.vue"],"sourcesContent":["<template>\n  <el-tooltip\n    ref=\"tooltipRef\"\n    v-bind=\"$attrs\"\n    :aria-label=\"title\"\n    :effect=\"effect\"\n    :enterable=\"enterable\"\n    :popper-class=\"kls\"\n    :popper-style=\"style\"\n    persistent\n  >\n    <template v-if=\"$slots.reference\">\n      <slot name=\"reference\" />\n    </template>\n\n    <template #content>\n      <div v-if=\"title\" class=\"el-popover__title\" role=\"title\">\n        {{ title }}\n      </div>\n      <slot>\n        {{ content }}\n      </slot>\n    </template>\n  </el-tooltip>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, unref } from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { isString } from '@element-plus/utils/util'\nimport { usePopoverProps } from './popover'\n\nimport type { StyleValue } from 'vue'\n\nconst emits = ['update:visible', 'after-enter', 'after-leave']\n\nconst NAME = 'ElPopover'\n\nexport default defineComponent({\n  name: NAME,\n  components: {\n    ElTooltip,\n  },\n  props: usePopoverProps,\n  emits,\n  setup(props) {\n    const tooltipRef = ref<InstanceType<typeof ElTooltip> | null>(null)\n    const popperRef = computed(() => {\n      return unref(tooltipRef)?.popperRef\n    })\n    const width = computed(() => {\n      if (isString(props.width)) {\n        return props.width as string\n      }\n      return `${props.width}px`\n    })\n\n    const style = computed(() => {\n      return [\n        {\n          width: width.value,\n        },\n        props.popperStyle,\n      ] as StyleValue\n    })\n\n    const kls = computed(() => {\n      return [\n        { 'el-popover--plain': !!props.content },\n        'el-popover',\n        props.popperClass,\n      ]\n    })\n\n    return {\n      kls,\n      style,\n      tooltipRef,\n      popperRef,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;AA6BA,WAAW,GAAG,CAAC,kBAAkB;;AAEjC,aAAe,eAAe;;AAE9B,EAAE,UAAU,EAAE;;AAEd,GAAG;;AAEH,EAAE,KAAK;EACL,MAAM;IACJ,MAAM;IACN,MAAM;;MAEJ,OAAO,CAAC,EAAE,GAAG,KAAK;KACnB,CAAC,CAAC;IACH,MAAM,KAAK;MACT,IAAI,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;QACzB,OAAO,KAAK,MAAM,CAAC;OACpB;;KAEF,CAAC,CAAC;UACG,KAAK,GAAG,QAAQ,CAAC,MAAM;aACpB;;UAEH,KAAK,EAAE,KAAK,CAAC,KAAK;;;OAGrB,CAAC;MACF,CAAC;;aAEM;QACL;QACA,YAAY;QACZ,KAAK,CAAC;;;IAGV,OAAO;MACL,GAAG;WACE;gBACK;eACD;MACT;;;;;;"}

package/es/components/popover/src/index.vue_vue_type_template_id_15486cf0_lang.mjs

@@ -12,7 +12,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     effect: _ctx.effect,
     enterable: _ctx.enterable,
     "popper-class": _ctx.kls,
-    "popper-style": _ctx.style
+    "popper-style": _ctx.style,
+    persistent: ""
   }), {
     content: withCtx(() => [
       _ctx.title ? (openBlock(), createElementBlock("div", _hoisted_1, toDisplayString(_ctx.title), 1)) : createCommentVNode("v-if", true),

package/es/components/popover/src/index.vue_vue_type_template_id_15486cf0_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.vue_vue_type_template_id_15486cf0_lang.mjs","sources":["../../../../../../packages/components/popover/src/index.vue?vue&type=template&id=15486cf0&lang.js"],"sourcesContent":["<template>\n  <el-tooltip\n    ref=\"tooltipRef\"\n    v-bind=\"$attrs\"\n    :aria-label=\"title\"\n    :effect=\"effect\"\n    :enterable=\"enterable\"\n    :popper-class=\"kls\"\n    :popper-style=\"style\"\n  >\n    <template v-if=\"$slots.reference\">\n      <slot name=\"reference\" />\n    </template>\n\n    <template #content>\n      <div v-if=\"title\" class=\"el-popover__title\" role=\"title\">\n        {{ title }}\n      </div>\n      <slot>\n        {{ content }}\n      </slot>\n    </template>\n  </el-tooltip>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, unref } from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { isString } from '@element-plus/utils/util'\nimport { usePopoverProps } from './popover'\n\nimport type { StyleValue } from 'vue'\n\nconst emits = ['update:visible', 'after-enter', 'after-leave']\n\nconst NAME = 'ElPopover'\n\nexport default defineComponent({\n  name: NAME,\n  components: {\n    ElTooltip,\n  },\n  props: usePopoverProps,\n  emits,\n  setup(props) {\n    const tooltipRef = ref<InstanceType<typeof ElTooltip> | null>(null)\n    const popperRef = computed(() => {\n      return unref(tooltipRef)?.popperRef\n    })\n    const width = computed(() => {\n      if (isString(props.width)) {\n        return props.width as string\n      }\n      return `${props.width}px`\n    })\n\n    const style = computed(() => {\n      return [\n        {\n          width: width.value,\n        },\n        props.popperStyle,\n      ] as StyleValue\n    })\n\n    const kls = computed(() => {\n      return [\n        { 'el-popover--plain': !!props.content },\n        'el-popover',\n        props.popperClass,\n      ]\n    })\n\n    return {\n      kls,\n      style,\n      tooltipRef,\n      popperRef,\n    }\n  },\n})\n</script>\n"],"names":["_openBlock"],"mappings":";;;;;EAewB;EAA0B;;;;;;;IAX7C,cAAY,UAAK;IACjB;IACA;IACA,uBAAiB;oBACHA,SAAK;;;OAOP;;;MAGX,uCAAA;;;;;;;;"}
+{"version":3,"file":"index.vue_vue_type_template_id_15486cf0_lang.mjs","sources":["../../../../../../packages/components/popover/src/index.vue?vue&type=template&id=15486cf0&lang.js"],"sourcesContent":["<template>\n  <el-tooltip\n    ref=\"tooltipRef\"\n    v-bind=\"$attrs\"\n    :aria-label=\"title\"\n    :effect=\"effect\"\n    :enterable=\"enterable\"\n    :popper-class=\"kls\"\n    :popper-style=\"style\"\n    persistent\n  >\n    <template v-if=\"$slots.reference\">\n      <slot name=\"reference\" />\n    </template>\n\n    <template #content>\n      <div v-if=\"title\" class=\"el-popover__title\" role=\"title\">\n        {{ title }}\n      </div>\n      <slot>\n        {{ content }}\n      </slot>\n    </template>\n  </el-tooltip>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, unref } from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { isString } from '@element-plus/utils/util'\nimport { usePopoverProps } from './popover'\n\nimport type { StyleValue } from 'vue'\n\nconst emits = ['update:visible', 'after-enter', 'after-leave']\n\nconst NAME = 'ElPopover'\n\nexport default defineComponent({\n  name: NAME,\n  components: {\n    ElTooltip,\n  },\n  props: usePopoverProps,\n  emits,\n  setup(props) {\n    const tooltipRef = ref<InstanceType<typeof ElTooltip> | null>(null)\n    const popperRef = computed(() => {\n      return unref(tooltipRef)?.popperRef\n    })\n    const width = computed(() => {\n      if (isString(props.width)) {\n        return props.width as string\n      }\n      return `${props.width}px`\n    })\n\n    const style = computed(() => {\n      return [\n        {\n          width: width.value,\n        },\n        props.popperStyle,\n      ] as StyleValue\n    })\n\n    const kls = computed(() => {\n      return [\n        { 'el-popover--plain': !!props.content },\n        'el-popover',\n        props.popperClass,\n      ]\n    })\n\n    return {\n      kls,\n      style,\n      tooltipRef,\n      popperRef,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;EAgBwB;EAA0B;;;;;;;IAZ7C,cAAY,UAAK;IACjB;IACA;IACA;IACA;gBACD;;;OAOa;;;MAGX,uCAAA;;;;;;;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"select.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/select/src/select.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"selectWrapper\"\n    v-click-outside:[popperPaneRef]=\"handleClose\"\n    :class=\"wrapperKls\"\n    @click.stop=\"toggleMenu\"\n  >\n    <el-tooltip\n      ref=\"tooltipRef\"\n      v-model:visible=\"dropMenuVisible\"\n      placement=\"bottom-start\"\n      :append-to-body=\"popperAppendToBody\"\n      :popper-class=\"`el-select__popper ${popperClass}`\"\n      :fallback-placements=\"['bottom-start', 'top-start', 'right', 'left']\"\n      effect=\"light\"\n      pure\n      trigger=\"click\"\n      transition=\"el-zoom-in-top\"\n      :stop-popper-mouse-event=\"false\"\n      :gpu-acceleration=\"false\"\n      @show=\"handleMenuEnter\"\n    >\n      <template #default>\n        <div class=\"select-trigger\">\n          <div\n            v-if=\"multiple\"\n            ref=\"tags\"\n            class=\"el-select__tags\"\n            :style=\"selectTagsStyle\"\n          >\n            <span v-if=\"collapseTags && selected.length\">\n              <el-tag\n                :closable=\"!selectDisabled && !selected[0].isDisabled\"\n                :size=\"collapseTagSize\"\n                :hit=\"selected[0].hitState\"\n                :type=\"tagType\"\n                disable-transitions\n                @close=\"deleteTag($event, selected[0])\"\n              >\n                <span\n                  class=\"el-select__tags-text\"\n                  :style=\"{ maxWidth: inputWidth - 123 + 'px' }\"\n                  >{{ selected[0].currentLabel }}</span\n                >\n              </el-tag>\n              <el-tag\n                v-if=\"selected.length > 1\"\n                :closable=\"false\"\n                :size=\"collapseTagSize\"\n                :type=\"tagType\"\n                disable-transitions\n              >\n                <span class=\"el-select__tags-text\"\n                  >+ {{ selected.length - 1 }}</span\n                >\n              </el-tag>\n            </span>\n            <!-- <div> -->\n            <transition v-if=\"!collapseTags\" @after-leave=\"resetInputHeight\">\n              <span\n                :style=\"{\n                  marginLeft:\n                    prefixWidth && selected.length ? `${prefixWidth}px` : null,\n                }\"\n              >\n                <el-tag\n                  v-for=\"item in selected\"\n                  :key=\"getValueKey(item)\"\n                  :closable=\"!selectDisabled && !item.isDisabled\"\n                  :size=\"collapseTagSize\"\n                  :hit=\"item.hitState\"\n                  :type=\"tagType\"\n                  disable-transitions\n                  @close=\"deleteTag($event, item)\"\n                >\n                  <span\n                    class=\"el-select__tags-text\"\n                    :style=\"{ maxWidth: inputWidth - 75 + 'px' }\"\n                    >{{ item.currentLabel }}</span\n                  >\n                </el-tag>\n              </span>\n            </transition>\n            <!-- </div> -->\n            <input\n              v-if=\"filterable\"\n              ref=\"input\"\n              v-model=\"query\"\n              type=\"text\"\n              class=\"el-select__input\"\n              :class=\"[selectSize ? `is-${selectSize}` : '']\"\n              :disabled=\"selectDisabled\"\n              :autocomplete=\"autocomplete\"\n              :style=\"{\n                marginLeft:\n                  (prefixWidth && !selected.length) || tagInMultiLine\n                    ? `${prefixWidth}px`\n                    : null,\n                flexGrow: '1',\n                width: `${inputLength / (inputWidth - 32)}%`,\n                maxWidth: `${inputWidth - 42}px`,\n              }\"\n              @focus=\"handleFocus\"\n              @blur=\"handleBlur\"\n              @keyup=\"managePlaceholder\"\n              @keydown=\"resetInputState\"\n              @keydown.down.prevent=\"navigateOptions('next')\"\n              @keydown.up.prevent=\"navigateOptions('prev')\"\n              @keydown.esc.stop.prevent=\"visible = false\"\n              @keydown.enter.stop.prevent=\"selectOption\"\n              @keydown.delete=\"deletePrevTag\"\n              @keydown.tab=\"visible = false\"\n              @compositionstart=\"handleComposition\"\n              @compositionupdate=\"handleComposition\"\n              @compositionend=\"handleComposition\"\n              @input=\"debouncedQueryChange\"\n            />\n          </div>\n          <el-input\n            :id=\"id\"\n            ref=\"reference\"\n            v-model=\"selectedLabel\"\n            type=\"text\"\n            :placeholder=\"currentPlaceholder\"\n            :name=\"name\"\n            :autocomplete=\"autocomplete\"\n            :size=\"selectSize\"\n            :disabled=\"selectDisabled\"\n            :readonly=\"readonly\"\n            :validate-event=\"false\"\n            :class=\"{ 'is-focus': visible }\"\n            :tabindex=\"multiple && filterable ? -1 : undefined\"\n            @focus=\"handleFocus\"\n            @blur=\"handleBlur\"\n            @input=\"debouncedOnInputChange\"\n            @paste=\"debouncedOnInputChange\"\n            @compositionstart=\"handleComposition\"\n            @compositionupdate=\"handleComposition\"\n            @compositionend=\"handleComposition\"\n            @keydown.down.stop.prevent=\"navigateOptions('next')\"\n            @keydown.up.stop.prevent=\"navigateOptions('prev')\"\n            @keydown.enter.stop.prevent=\"selectOption\"\n            @keydown.esc.stop.prevent=\"visible = false\"\n            @keydown.tab=\"visible = false\"\n            @mouseenter=\"inputHovering = true\"\n            @mouseleave=\"inputHovering = false\"\n          >\n            <template v-if=\"$slots.prefix\" #prefix>\n              <div\n                style=\"\n                  height: 100%;\n                  display: flex;\n                  justify-content: center;\n                  align-items: center;\n                \"\n              >\n                <slot name=\"prefix\"></slot>\n              </div>\n            </template>\n            <template #suffix>\n              <el-icon\n                v-if=\"iconComponent\"\n                v-show=\"!showClose\"\n                :class=\"['el-select__caret', 'el-input__icon', iconReverse]\"\n              >\n                <component :is=\"iconComponent\" />\n              </el-icon>\n              <el-icon\n                v-if=\"showClose && clearIcon\"\n                class=\"el-select__caret el-input__icon\"\n                @click=\"handleClearClick\"\n              >\n                <component :is=\"clearIcon\" />\n              </el-icon>\n            </template>\n          </el-input>\n        </div>\n      </template>\n      <template #content>\n        <el-select-menu>\n          <el-scrollbar\n            v-show=\"options.size > 0 && !loading\"\n            ref=\"scrollbar\"\n            tag=\"ul\"\n            wrap-class=\"el-select-dropdown__wrap\"\n            view-class=\"el-select-dropdown__list\"\n            :class=\"{\n              'is-empty': !allowCreate && query && filteredOptionsCount === 0,\n            }\"\n          >\n            <el-option v-if=\"showNewOption\" :value=\"query\" :created=\"true\" />\n            <slot></slot>\n          </el-scrollbar>\n          <template\n            v-if=\"\n              emptyText &&\n              (!allowCreate || loading || (allowCreate && options.size === 0))\n            \"\n          >\n            <slot v-if=\"$slots.empty\" name=\"empty\"></slot>\n            <p v-else class=\"el-select-dropdown__empty\">\n              {{ emptyText }}\n            </p>\n          </template>\n        </el-select-menu>\n      </template>\n    </el-tooltip>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  toRefs,\n  defineComponent,\n  onMounted,\n  onBeforeUnmount,\n  nextTick,\n  reactive,\n  provide,\n  computed,\n  unref,\n} from 'vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport { useFocus, useLocale } from '@element-plus/hooks'\nimport ElInput from '@element-plus/components/input'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\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 {\n  addResizeListener,\n  removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport { CircleClose, ArrowUp } from '@element-plus/icons-vue'\nimport ElOption from './option.vue'\nimport ElSelectMenu from './select-dropdown.vue'\nimport { useSelect, useSelectStates } from './useSelect'\nimport { selectKey } from './token'\n\nimport type { PropType, Component } from 'vue'\nimport type { ComponentSize } from '@element-plus/utils/types'\nimport type { SelectContext } from './token'\n\nexport default defineComponent({\n  name: 'ElSelect',\n  componentName: 'ElSelect',\n  components: {\n    ElInput,\n    ElSelectMenu,\n    ElOption,\n    ElTag,\n    ElScrollbar,\n    ElTooltip,\n    ElIcon,\n  },\n  directives: { ClickOutside },\n  props: {\n    name: String,\n    id: String,\n    modelValue: {\n      type: [Array, String, Number, Boolean, Object],\n      default: undefined,\n    },\n    autocomplete: {\n      type: String,\n      default: 'off',\n    },\n    automaticDropdown: Boolean,\n    size: {\n      type: String as PropType<ComponentSize>,\n      validator: isValidComponentSize,\n    },\n    disabled: Boolean,\n    clearable: Boolean,\n    filterable: Boolean,\n    allowCreate: Boolean,\n    loading: Boolean,\n    popperClass: {\n      type: String,\n      default: '',\n    },\n    remote: Boolean,\n    loadingText: String,\n    noMatchText: String,\n    noDataText: String,\n    remoteMethod: Function,\n    filterMethod: Function,\n    multiple: Boolean,\n    multipleLimit: {\n      type: Number,\n      default: 0,\n    },\n    placeholder: {\n      type: String,\n    },\n    defaultFirstOption: Boolean,\n    reserveKeyword: Boolean,\n    valueKey: {\n      type: String,\n      default: 'value',\n    },\n    collapseTags: Boolean,\n    popperAppendToBody: {\n      type: Boolean,\n      default: true,\n    },\n    clearIcon: {\n      type: [String, Object] as PropType<string | Component>,\n      default: CircleClose,\n    },\n    fitInputWidth: {\n      type: Boolean,\n      default: false,\n    },\n    suffixIcon: {\n      type: [String, Object] as PropType<string | Component>,\n      default: ArrowUp,\n    },\n    tagType: {\n      type: String,\n      default: 'info',\n    },\n  },\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, ctx) {\n    const { t } = useLocale()\n    const states = useSelectStates(props)\n    const {\n      optionsArray,\n      selectSize,\n      readonly,\n      handleResize,\n      collapseTagSize,\n      debouncedOnInputChange,\n      debouncedQueryChange,\n      deletePrevTag,\n      deleteTag,\n      deleteSelected,\n      handleOptionSelect,\n      scrollToOption,\n      setSelected,\n      resetInputHeight,\n      managePlaceholder,\n      showClose,\n      selectDisabled,\n      iconComponent,\n      iconReverse,\n      showNewOption,\n      emptyText,\n      toggleLastOptionHitState,\n      resetInputState,\n      handleComposition,\n      onOptionCreate,\n      onOptionDestroy,\n      handleMenuEnter,\n      handleFocus,\n      blur,\n      handleBlur,\n      handleClearClick,\n      handleClose,\n      toggleMenu,\n      selectOption,\n      getValueKey,\n      navigateOptions,\n      dropMenuVisible,\n\n      reference,\n      input,\n      tooltipRef,\n      tags,\n      selectWrapper,\n      scrollbar,\n      queryChange,\n      groupQueryChange,\n    } = useSelect(props, states, ctx)\n\n    const { focus } = useFocus(reference)\n\n    const {\n      inputWidth,\n      selected,\n      inputLength,\n      filteredOptionsCount,\n      visible,\n      softFocus,\n      selectedLabel,\n      hoverIndex,\n      query,\n      inputHovering,\n      currentPlaceholder,\n      menuVisibleOnFocus,\n      isOnComposition,\n      isSilentBlur,\n      options,\n      cachedOptions,\n      optionsCount,\n      prefixWidth,\n      tagInMultiLine,\n    } = toRefs(states)\n\n    const wrapperKls = computed(() => {\n      const classList = ['el-select']\n      const _selectSize = unref(selectSize)\n      if (_selectSize) {\n        classList.push(`el-select--${_selectSize}`)\n      }\n      return classList\n    })\n\n    const selectTagsStyle = computed(() => ({\n      maxWidth: `${unref(inputWidth) - 32}px`,\n      width: '100%',\n    }))\n\n    provide(\n      selectKey,\n      reactive({\n        props,\n        options,\n        optionsArray,\n        cachedOptions,\n        optionsCount,\n        filteredOptionsCount,\n        hoverIndex,\n        handleOptionSelect,\n        onOptionCreate,\n        onOptionDestroy,\n        selectWrapper,\n        selected,\n        setSelected,\n        queryChange,\n        groupQueryChange,\n      }) as unknown as SelectContext\n    )\n\n    onMounted(() => {\n      states.cachedPlaceHolder = currentPlaceholder.value =\n        props.placeholder || t('el.select.placeholder')\n      if (\n        props.multiple &&\n        Array.isArray(props.modelValue) &&\n        props.modelValue.length > 0\n      ) {\n        currentPlaceholder.value = ''\n      }\n      addResizeListener(selectWrapper.value as any, handleResize)\n      if (reference.value && reference.value.$el) {\n        const sizeMap = {\n          large: 36,\n          default: 32,\n          small: 28,\n        }\n        const input = reference.value.input as HTMLInputElement\n        states.initialInputHeight =\n          input.getBoundingClientRect().height || sizeMap[selectSize.value]\n      }\n      if (props.remote && props.multiple) {\n        resetInputHeight()\n      }\n      nextTick(() => {\n        if (!reference.value) return\n        if (reference.value.$el) {\n          inputWidth.value = reference.value.$el.getBoundingClientRect().width\n        }\n        if (ctx.slots.prefix) {\n          const inputChildNodes = reference.value.$el.childNodes\n          const input = (Array.from(inputChildNodes) as HTMLElement[]).filter(\n            (item) => item.tagName === 'INPUT'\n          )[0]\n          const prefix = reference.value.$el.querySelector('.el-input__prefix')\n          prefixWidth.value = Math.max(\n            prefix.getBoundingClientRect().width + 5,\n            30\n          )\n          if (states.prefixWidth) {\n            input.style.paddingLeft = `${Math.max(states.prefixWidth, 30)}px`\n          }\n        }\n      })\n      setSelected()\n    })\n\n    onBeforeUnmount(() => {\n      removeResizeListener(selectWrapper.value as any, handleResize)\n    })\n\n    if (props.multiple && !Array.isArray(props.modelValue)) {\n      ctx.emit(UPDATE_MODEL_EVENT, [])\n    }\n    if (!props.multiple && Array.isArray(props.modelValue)) {\n      ctx.emit(UPDATE_MODEL_EVENT, '')\n    }\n\n    const popperPaneRef = computed(() => {\n      return tooltipRef.value?.popperRef?.contentRef\n    })\n\n    return {\n      tagInMultiLine,\n      prefixWidth,\n      selectSize,\n      readonly,\n      handleResize,\n      collapseTagSize,\n      debouncedOnInputChange,\n      debouncedQueryChange,\n      deletePrevTag,\n      deleteTag,\n      deleteSelected,\n      handleOptionSelect,\n      scrollToOption,\n      inputWidth,\n      selected,\n      inputLength,\n      filteredOptionsCount,\n      visible,\n      softFocus,\n      selectedLabel,\n      hoverIndex,\n      query,\n      inputHovering,\n      currentPlaceholder,\n      menuVisibleOnFocus,\n      isOnComposition,\n      isSilentBlur,\n      options,\n      resetInputHeight,\n      managePlaceholder,\n      showClose,\n      selectDisabled,\n      iconComponent,\n      iconReverse,\n      showNewOption,\n      emptyText,\n      toggleLastOptionHitState,\n      resetInputState,\n      handleComposition,\n      handleMenuEnter,\n      handleFocus,\n      blur,\n      handleBlur,\n      handleClearClick,\n      handleClose,\n      toggleMenu,\n      selectOption,\n      getValueKey,\n      navigateOptions,\n      dropMenuVisible,\n      focus,\n\n      reference,\n      input,\n      tooltipRef,\n      popperPaneRef,\n      tags,\n      selectWrapper,\n      scrollbar,\n\n      wrapperKls,\n      selectTagsStyle,\n    }\n  },\n})\n</script>\n"],"names":["ElOption"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA+OA,aAAe,eAAe,CAAC;;AAE/B,EAAE,aAAa,EAAE,UAAU;AAC3B,EAAE,UAAU,EAAE;AACd,IAAI;;AAEJ,cAAIA,QAAQ;IACR,KAAK;IACL,WAAW;IACX;IACA,MAAM;;YAEE;OACL,EAAE;IACL,IAAI,EAAE;IACN,EAAE,EAAE;IACJ;;MAEE,cAAc,CAAC;KAChB;IACD,YAAY;MACV,IAAI,EAAE;MACN,OAAO;;qBAEQ,EAAE;IACnB;MACE,IAAI,EAAE,MAAM;MACZ,SAAS,EAAE;;IAEb;IACA,SAAS,EAAE;IACX;eACW,EAAE,OAAO;WACb,EAAE,OAAO;IAChB;MACE,IAAI,EAAE,MAAM;MACZ,OAAO,EAAE,EAAE;KACZ;IACD,MAAM,EAAE,OAAO;IACf,WAAW,EAAE;IACb,WAAW,EAAE;cACH,EAAE;gBACA;IACZ;IACA,QAAQ,EAAE;IACV,aAAa,EAAE;MACb,IAAI,EAAE,MAAM;MACZ,OAAO,GAAG;KACX;IACD,WAAW;MACT,IAAI,EAAE,MAAM;KACb;;;IAGD;MACE,IAAI,EAAE;MACN,OAAO,EAAE;KACV;IACD,YAAY,EAAE,OAAO;IACrB,kBAAkB,EAAE;MAClB,IAAI,EAAE;MACN,OAAO,EAAE;;IAEX;MACE,IAAI,EAAE,CAAC,MAAM,EAAE;MACf,OAAO,EAAE;;iBAEE,EAAE;;MAEb,OAAO,EAAE;;gBAEC;;MAEV,OAAO,EAAE;;WAEJ,EAAE;;MAEP,OAAO;;;;IAIT;gBACY;gBACA;IACZ;;IAEA;IACA,MAAM;;OAEH,CAAC,KAAK,EAAE;IACX,MAAM;IACN,MAAM,MAAM,GAAG;IACf,MAAM;MACJ;;;MAGA,YAAY;MACZ,eAAe;MACf,sBAAsB;MACtB;MACA;MACA,SAAS;MACT;MACA;MACA,cAAc;MACd,WAAW;MACX,gBAAgB;MAChB;MACA,SAAS;MACT,cAAc;MACd,aAAa;MACb,WAAW;MACX;MACA,SAAS;MACT;MACA;MACA;MACA;MACA;MACA;MACA;MACA,IAAI;MACJ,UAAU;MACV,gBAAgB;MAChB,WAAW;MACX,UAAU;MACV,YAAY;MACZ,WAAW;MACX;MACA;MACA,SAAS;MACT,KAAK;MACL,UAAU;MACV,IAAI;MACJ;MACA,SAAS;MACT,WAAW;;QAET;UACE;UACA;MACJ;MACA,QAAQ;MACR;MACA;MACA,OAAO;MACP,SAAS;;MAET,UAAU;;MAEV;MACA;MACA;MACA;MACA,YAAY;MACZ,OAAO;MACP;MACA,YAAY;MACZ;MACA;QACE,MAAM,CAAC;UACL,UAAU,GAAG;MACjB,MAAM,SAAS,GAAG;MAClB,MAAM;MACN,IAAI;QACF;OACD;MACD,OAAO;MACP,CAAC;UACG;MACJ,QAAQ,EAAE,CAAC,EAAE;;KAEd,CAAC,CAAC,CAAC;YACI,mBAAmB,CAAC;MAC1B;MACA,OAAO;kBACK;MACZ;MACA,YAAY;;;MAGZ,kBAAkB;MAClB,cAAc;MACd;MACA;;MAEA;MACA;MACA;QACE;aACK,CAAC;YACF,CAAC;UACH,KAAK,CAAC;QACR;;;UAGE,SAAS,CAAC,KAAK;QACjB,MAAM,OAAO;UACX,KAAK,EAAE,EAAE;UACT,OAAO,EAAE,EAAE;UACX,KAAK;SACN,CAAC;QACF,MAAM;QACN,MAAM,CAAC;OACR;;;OAGA;MACD,QAAQ,CAAC,MAAM;QACb,IAAI,CAAC,SAAS,CAAC;;QAEf,IAAI,SAAS;UACX,UAAU,CAAC,KAAK,GAAG,SAAS;SAC7B;QACD;UACE,MAAM,eAAe;;UAErB,MAAM,MAAM,GAAG,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC;UACjD,WAAW,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC;UACpC,IAAI,MAAM;YACR,MAAM,CAAC;WACR;;QAEH;iBACS,GAAG;;mBAED,CAAC,MAAM;MACpB;MACA,CAAC;QACC,KAAK,CAAC,QAAQ;MAChB;;QAEE,CAAC,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC;SACxB,KAAK,CAAC,kBAAkB;;;YAGrB,EAAE,EAAE,CAAC;aACJ,CAAC,EAAE,GAAG,CAAC,EAAE,GAAG,UAAU,CAAC,KAAK,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG;;;;iBAI7C;gBACD;cACF;;;4BAGc;0BACF;;;MAGpB;MACA;;;MAGA,QAAQ;MACR,WAAW;;;eAGF;MACT,aAAa;;WAER;MACL,aAAa;;;MAGb,eAAe;MACf,YAAY;;;MAGZ;MACA,SAAS;MACT;MACA;MACA;MACA;MACA,SAAS;MACT;MACA,eAAe;MACf;MACA;MACA,WAAW;MACX,IAAI;MACJ,UAAU;MACV;MACA;MACA,UAAU;MACV,YAAY;MACZ;MACA;MACA;MACA,KAAK;MACL;MACA,KAAK;MACL,UAAU;MACV,aAAa;MACb,IAAI;MACJ;MACA;MACA,UAAU;MACV,eAAe;MACf;;;;;;"}
+{"version":3,"file":"select.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/select/src/select.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"selectWrapper\"\n    v-click-outside:[popperPaneRef]=\"handleClose\"\n    :class=\"wrapperKls\"\n    @click.stop=\"toggleMenu\"\n  >\n    <el-tooltip\n      ref=\"tooltipRef\"\n      v-model:visible=\"dropMenuVisible\"\n      placement=\"bottom-start\"\n      :append-to-body=\"popperAppendToBody\"\n      :popper-class=\"`el-select__popper ${popperClass}`\"\n      :fallback-placements=\"['bottom-start', 'top-start', 'right', 'left']\"\n      effect=\"light\"\n      pure\n      trigger=\"click\"\n      transition=\"el-zoom-in-top\"\n      :stop-popper-mouse-event=\"false\"\n      :gpu-acceleration=\"false\"\n      persistent\n      @show=\"handleMenuEnter\"\n    >\n      <template #default>\n        <div class=\"select-trigger\">\n          <div\n            v-if=\"multiple\"\n            ref=\"tags\"\n            class=\"el-select__tags\"\n            :style=\"selectTagsStyle\"\n          >\n            <span v-if=\"collapseTags && selected.length\">\n              <el-tag\n                :closable=\"!selectDisabled && !selected[0].isDisabled\"\n                :size=\"collapseTagSize\"\n                :hit=\"selected[0].hitState\"\n                :type=\"tagType\"\n                disable-transitions\n                @close=\"deleteTag($event, selected[0])\"\n              >\n                <span\n                  class=\"el-select__tags-text\"\n                  :style=\"{ maxWidth: inputWidth - 123 + 'px' }\"\n                  >{{ selected[0].currentLabel }}</span\n                >\n              </el-tag>\n              <el-tag\n                v-if=\"selected.length > 1\"\n                :closable=\"false\"\n                :size=\"collapseTagSize\"\n                :type=\"tagType\"\n                disable-transitions\n              >\n                <span class=\"el-select__tags-text\"\n                  >+ {{ selected.length - 1 }}</span\n                >\n              </el-tag>\n            </span>\n            <!-- <div> -->\n            <transition v-if=\"!collapseTags\" @after-leave=\"resetInputHeight\">\n              <span\n                :style=\"{\n                  marginLeft:\n                    prefixWidth && selected.length ? `${prefixWidth}px` : null,\n                }\"\n              >\n                <el-tag\n                  v-for=\"item in selected\"\n                  :key=\"getValueKey(item)\"\n                  :closable=\"!selectDisabled && !item.isDisabled\"\n                  :size=\"collapseTagSize\"\n                  :hit=\"item.hitState\"\n                  :type=\"tagType\"\n                  disable-transitions\n                  @close=\"deleteTag($event, item)\"\n                >\n                  <span\n                    class=\"el-select__tags-text\"\n                    :style=\"{ maxWidth: inputWidth - 75 + 'px' }\"\n                    >{{ item.currentLabel }}</span\n                  >\n                </el-tag>\n              </span>\n            </transition>\n            <!-- </div> -->\n            <input\n              v-if=\"filterable\"\n              ref=\"input\"\n              v-model=\"query\"\n              type=\"text\"\n              class=\"el-select__input\"\n              :class=\"[selectSize ? `is-${selectSize}` : '']\"\n              :disabled=\"selectDisabled\"\n              :autocomplete=\"autocomplete\"\n              :style=\"{\n                marginLeft:\n                  (prefixWidth && !selected.length) || tagInMultiLine\n                    ? `${prefixWidth}px`\n                    : null,\n                flexGrow: '1',\n                width: `${inputLength / (inputWidth - 32)}%`,\n                maxWidth: `${inputWidth - 42}px`,\n              }\"\n              @focus=\"handleFocus\"\n              @blur=\"handleBlur\"\n              @keyup=\"managePlaceholder\"\n              @keydown=\"resetInputState\"\n              @keydown.down.prevent=\"navigateOptions('next')\"\n              @keydown.up.prevent=\"navigateOptions('prev')\"\n              @keydown.esc.stop.prevent=\"visible = false\"\n              @keydown.enter.stop.prevent=\"selectOption\"\n              @keydown.delete=\"deletePrevTag\"\n              @keydown.tab=\"visible = false\"\n              @compositionstart=\"handleComposition\"\n              @compositionupdate=\"handleComposition\"\n              @compositionend=\"handleComposition\"\n              @input=\"debouncedQueryChange\"\n            />\n          </div>\n          <el-input\n            :id=\"id\"\n            ref=\"reference\"\n            v-model=\"selectedLabel\"\n            type=\"text\"\n            :placeholder=\"currentPlaceholder\"\n            :name=\"name\"\n            :autocomplete=\"autocomplete\"\n            :size=\"selectSize\"\n            :disabled=\"selectDisabled\"\n            :readonly=\"readonly\"\n            :validate-event=\"false\"\n            :class=\"{ 'is-focus': visible }\"\n            :tabindex=\"multiple && filterable ? -1 : undefined\"\n            @focus=\"handleFocus\"\n            @blur=\"handleBlur\"\n            @input=\"debouncedOnInputChange\"\n            @paste=\"debouncedOnInputChange\"\n            @compositionstart=\"handleComposition\"\n            @compositionupdate=\"handleComposition\"\n            @compositionend=\"handleComposition\"\n            @keydown.down.stop.prevent=\"navigateOptions('next')\"\n            @keydown.up.stop.prevent=\"navigateOptions('prev')\"\n            @keydown.enter.stop.prevent=\"selectOption\"\n            @keydown.esc.stop.prevent=\"visible = false\"\n            @keydown.tab=\"visible = false\"\n            @mouseenter=\"inputHovering = true\"\n            @mouseleave=\"inputHovering = false\"\n          >\n            <template v-if=\"$slots.prefix\" #prefix>\n              <div\n                style=\"\n                  height: 100%;\n                  display: flex;\n                  justify-content: center;\n                  align-items: center;\n                \"\n              >\n                <slot name=\"prefix\"></slot>\n              </div>\n            </template>\n            <template #suffix>\n              <el-icon\n                v-if=\"iconComponent\"\n                v-show=\"!showClose\"\n                :class=\"['el-select__caret', 'el-input__icon', iconReverse]\"\n              >\n                <component :is=\"iconComponent\" />\n              </el-icon>\n              <el-icon\n                v-if=\"showClose && clearIcon\"\n                class=\"el-select__caret el-input__icon\"\n                @click=\"handleClearClick\"\n              >\n                <component :is=\"clearIcon\" />\n              </el-icon>\n            </template>\n          </el-input>\n        </div>\n      </template>\n      <template #content>\n        <el-select-menu>\n          <el-scrollbar\n            v-show=\"options.size > 0 && !loading\"\n            ref=\"scrollbar\"\n            tag=\"ul\"\n            wrap-class=\"el-select-dropdown__wrap\"\n            view-class=\"el-select-dropdown__list\"\n            :class=\"{\n              'is-empty': !allowCreate && query && filteredOptionsCount === 0,\n            }\"\n          >\n            <el-option v-if=\"showNewOption\" :value=\"query\" :created=\"true\" />\n            <slot></slot>\n          </el-scrollbar>\n          <template\n            v-if=\"\n              emptyText &&\n              (!allowCreate || loading || (allowCreate && options.size === 0))\n            \"\n          >\n            <slot v-if=\"$slots.empty\" name=\"empty\"></slot>\n            <p v-else class=\"el-select-dropdown__empty\">\n              {{ emptyText }}\n            </p>\n          </template>\n        </el-select-menu>\n      </template>\n    </el-tooltip>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  toRefs,\n  defineComponent,\n  onMounted,\n  onBeforeUnmount,\n  nextTick,\n  reactive,\n  provide,\n  computed,\n  unref,\n} from 'vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport { useFocus, useLocale } from '@element-plus/hooks'\nimport ElInput from '@element-plus/components/input'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\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 {\n  addResizeListener,\n  removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport { CircleClose, ArrowUp } from '@element-plus/icons-vue'\nimport ElOption from './option.vue'\nimport ElSelectMenu from './select-dropdown.vue'\nimport { useSelect, useSelectStates } from './useSelect'\nimport { selectKey } from './token'\n\nimport type { PropType, Component } from 'vue'\nimport type { ComponentSize } from '@element-plus/utils/types'\nimport type { SelectContext } from './token'\n\nexport default defineComponent({\n  name: 'ElSelect',\n  componentName: 'ElSelect',\n  components: {\n    ElInput,\n    ElSelectMenu,\n    ElOption,\n    ElTag,\n    ElScrollbar,\n    ElTooltip,\n    ElIcon,\n  },\n  directives: { ClickOutside },\n  props: {\n    name: String,\n    id: String,\n    modelValue: {\n      type: [Array, String, Number, Boolean, Object],\n      default: undefined,\n    },\n    autocomplete: {\n      type: String,\n      default: 'off',\n    },\n    automaticDropdown: Boolean,\n    size: {\n      type: String as PropType<ComponentSize>,\n      validator: isValidComponentSize,\n    },\n    disabled: Boolean,\n    clearable: Boolean,\n    filterable: Boolean,\n    allowCreate: Boolean,\n    loading: Boolean,\n    popperClass: {\n      type: String,\n      default: '',\n    },\n    remote: Boolean,\n    loadingText: String,\n    noMatchText: String,\n    noDataText: String,\n    remoteMethod: Function,\n    filterMethod: Function,\n    multiple: Boolean,\n    multipleLimit: {\n      type: Number,\n      default: 0,\n    },\n    placeholder: {\n      type: String,\n    },\n    defaultFirstOption: Boolean,\n    reserveKeyword: Boolean,\n    valueKey: {\n      type: String,\n      default: 'value',\n    },\n    collapseTags: Boolean,\n    popperAppendToBody: {\n      type: Boolean,\n      default: true,\n    },\n    clearIcon: {\n      type: [String, Object] as PropType<string | Component>,\n      default: CircleClose,\n    },\n    fitInputWidth: {\n      type: Boolean,\n      default: false,\n    },\n    suffixIcon: {\n      type: [String, Object] as PropType<string | Component>,\n      default: ArrowUp,\n    },\n    tagType: {\n      type: String,\n      default: 'info',\n    },\n  },\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, ctx) {\n    const { t } = useLocale()\n    const states = useSelectStates(props)\n    const {\n      optionsArray,\n      selectSize,\n      readonly,\n      handleResize,\n      collapseTagSize,\n      debouncedOnInputChange,\n      debouncedQueryChange,\n      deletePrevTag,\n      deleteTag,\n      deleteSelected,\n      handleOptionSelect,\n      scrollToOption,\n      setSelected,\n      resetInputHeight,\n      managePlaceholder,\n      showClose,\n      selectDisabled,\n      iconComponent,\n      iconReverse,\n      showNewOption,\n      emptyText,\n      toggleLastOptionHitState,\n      resetInputState,\n      handleComposition,\n      onOptionCreate,\n      onOptionDestroy,\n      handleMenuEnter,\n      handleFocus,\n      blur,\n      handleBlur,\n      handleClearClick,\n      handleClose,\n      toggleMenu,\n      selectOption,\n      getValueKey,\n      navigateOptions,\n      dropMenuVisible,\n\n      reference,\n      input,\n      tooltipRef,\n      tags,\n      selectWrapper,\n      scrollbar,\n      queryChange,\n      groupQueryChange,\n    } = useSelect(props, states, ctx)\n\n    const { focus } = useFocus(reference)\n\n    const {\n      inputWidth,\n      selected,\n      inputLength,\n      filteredOptionsCount,\n      visible,\n      softFocus,\n      selectedLabel,\n      hoverIndex,\n      query,\n      inputHovering,\n      currentPlaceholder,\n      menuVisibleOnFocus,\n      isOnComposition,\n      isSilentBlur,\n      options,\n      cachedOptions,\n      optionsCount,\n      prefixWidth,\n      tagInMultiLine,\n    } = toRefs(states)\n\n    const wrapperKls = computed(() => {\n      const classList = ['el-select']\n      const _selectSize = unref(selectSize)\n      if (_selectSize) {\n        classList.push(`el-select--${_selectSize}`)\n      }\n      return classList\n    })\n\n    const selectTagsStyle = computed(() => ({\n      maxWidth: `${unref(inputWidth) - 32}px`,\n      width: '100%',\n    }))\n\n    provide(\n      selectKey,\n      reactive({\n        props,\n        options,\n        optionsArray,\n        cachedOptions,\n        optionsCount,\n        filteredOptionsCount,\n        hoverIndex,\n        handleOptionSelect,\n        onOptionCreate,\n        onOptionDestroy,\n        selectWrapper,\n        selected,\n        setSelected,\n        queryChange,\n        groupQueryChange,\n      }) as unknown as SelectContext\n    )\n\n    onMounted(() => {\n      states.cachedPlaceHolder = currentPlaceholder.value =\n        props.placeholder || t('el.select.placeholder')\n      if (\n        props.multiple &&\n        Array.isArray(props.modelValue) &&\n        props.modelValue.length > 0\n      ) {\n        currentPlaceholder.value = ''\n      }\n      addResizeListener(selectWrapper.value as any, handleResize)\n      if (reference.value && reference.value.$el) {\n        const sizeMap = {\n          large: 36,\n          default: 32,\n          small: 28,\n        }\n        const input = reference.value.input as HTMLInputElement\n        states.initialInputHeight =\n          input.getBoundingClientRect().height || sizeMap[selectSize.value]\n      }\n      if (props.remote && props.multiple) {\n        resetInputHeight()\n      }\n      nextTick(() => {\n        if (!reference.value) return\n        if (reference.value.$el) {\n          inputWidth.value = reference.value.$el.getBoundingClientRect().width\n        }\n        if (ctx.slots.prefix) {\n          const inputChildNodes = reference.value.$el.childNodes\n          const input = (Array.from(inputChildNodes) as HTMLElement[]).filter(\n            (item) => item.tagName === 'INPUT'\n          )[0]\n          const prefix = reference.value.$el.querySelector('.el-input__prefix')\n          prefixWidth.value = Math.max(\n            prefix.getBoundingClientRect().width + 5,\n            30\n          )\n          if (states.prefixWidth) {\n            input.style.paddingLeft = `${Math.max(states.prefixWidth, 30)}px`\n          }\n        }\n      })\n      setSelected()\n    })\n\n    onBeforeUnmount(() => {\n      removeResizeListener(selectWrapper.value as any, handleResize)\n    })\n\n    if (props.multiple && !Array.isArray(props.modelValue)) {\n      ctx.emit(UPDATE_MODEL_EVENT, [])\n    }\n    if (!props.multiple && Array.isArray(props.modelValue)) {\n      ctx.emit(UPDATE_MODEL_EVENT, '')\n    }\n\n    const popperPaneRef = computed(() => {\n      return tooltipRef.value?.popperRef?.contentRef\n    })\n\n    return {\n      tagInMultiLine,\n      prefixWidth,\n      selectSize,\n      readonly,\n      handleResize,\n      collapseTagSize,\n      debouncedOnInputChange,\n      debouncedQueryChange,\n      deletePrevTag,\n      deleteTag,\n      deleteSelected,\n      handleOptionSelect,\n      scrollToOption,\n      inputWidth,\n      selected,\n      inputLength,\n      filteredOptionsCount,\n      visible,\n      softFocus,\n      selectedLabel,\n      hoverIndex,\n      query,\n      inputHovering,\n      currentPlaceholder,\n      menuVisibleOnFocus,\n      isOnComposition,\n      isSilentBlur,\n      options,\n      resetInputHeight,\n      managePlaceholder,\n      showClose,\n      selectDisabled,\n      iconComponent,\n      iconReverse,\n      showNewOption,\n      emptyText,\n      toggleLastOptionHitState,\n      resetInputState,\n      handleComposition,\n      handleMenuEnter,\n      handleFocus,\n      blur,\n      handleBlur,\n      handleClearClick,\n      handleClose,\n      toggleMenu,\n      selectOption,\n      getValueKey,\n      navigateOptions,\n      dropMenuVisible,\n      focus,\n\n      reference,\n      input,\n      tooltipRef,\n      popperPaneRef,\n      tags,\n      selectWrapper,\n      scrollbar,\n\n      wrapperKls,\n      selectTagsStyle,\n    }\n  },\n})\n</script>\n"],"names":["ElOption"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAgPA,aAAe,eAAe,CAAC;;AAE/B,EAAE,aAAa,EAAE,UAAU;AAC3B,EAAE,UAAU,EAAE;AACd,IAAI;;AAEJ,cAAIA,QAAQ;IACR,KAAK;IACL,WAAW;IACX;IACA,MAAM;;YAEE;OACL,EAAE;IACL,IAAI,EAAE;IACN,EAAE,EAAE;IACJ;;MAEE,cAAc,CAAC;KAChB;IACD,YAAY;MACV,IAAI,EAAE;MACN,OAAO;;qBAEQ,EAAE;IACnB;MACE,IAAI,EAAE,MAAM;MACZ,SAAS,EAAE;;IAEb;IACA,SAAS,EAAE;IACX;eACW,EAAE,OAAO;WACb,EAAE,OAAO;IAChB;MACE,IAAI,EAAE,MAAM;MACZ,OAAO,EAAE,EAAE;KACZ;IACD,MAAM,EAAE,OAAO;IACf,WAAW,EAAE;IACb,WAAW,EAAE;cACH,EAAE;gBACA;IACZ;IACA,QAAQ,EAAE;IACV,aAAa,EAAE;MACb,IAAI,EAAE,MAAM;MACZ,OAAO,GAAG;KACX;IACD,WAAW;MACT,IAAI,EAAE,MAAM;KACb;;;IAGD;MACE,IAAI,EAAE;MACN,OAAO,EAAE;KACV;IACD,YAAY,EAAE,OAAO;IACrB,kBAAkB,EAAE;MAClB,IAAI,EAAE;MACN,OAAO,EAAE;;IAEX;MACE,IAAI,EAAE,CAAC,MAAM,EAAE;MACf,OAAO,EAAE;;iBAEE,EAAE;;MAEb,OAAO,EAAE;;gBAEC;;MAEV,OAAO,EAAE;;WAEJ,EAAE;;MAEP,OAAO;;;;IAIT;gBACY;gBACA;IACZ;;IAEA;IACA,MAAM;;OAEH,CAAC,KAAK,EAAE;IACX,MAAM;IACN,MAAM,MAAM,GAAG;IACf,MAAM;MACJ;;;MAGA,YAAY;MACZ,eAAe;MACf,sBAAsB;MACtB;MACA;MACA,SAAS;MACT;MACA;MACA,cAAc;MACd,WAAW;MACX,gBAAgB;MAChB;MACA,SAAS;MACT,cAAc;MACd,aAAa;MACb,WAAW;MACX;MACA,SAAS;MACT;MACA;MACA;MACA;MACA;MACA;MACA;MACA,IAAI;MACJ,UAAU;MACV,gBAAgB;MAChB,WAAW;MACX,UAAU;MACV,YAAY;MACZ,WAAW;MACX;MACA;MACA,SAAS;MACT,KAAK;MACL,UAAU;MACV,IAAI;MACJ;MACA,SAAS;MACT,WAAW;;QAET;UACE;UACA;MACJ;MACA,QAAQ;MACR;MACA;MACA,OAAO;MACP,SAAS;;MAET,UAAU;;MAEV;MACA;MACA;MACA;MACA,YAAY;MACZ,OAAO;MACP;MACA,YAAY;MACZ;MACA;QACE,MAAM,CAAC;UACL,UAAU,GAAG;MACjB,MAAM,SAAS,GAAG;MAClB,MAAM;MACN,IAAI;QACF;OACD;MACD,OAAO;MACP,CAAC;UACG;MACJ,QAAQ,EAAE,CAAC,EAAE;;KAEd,CAAC,CAAC,CAAC;YACI,mBAAmB,CAAC;MAC1B;MACA,OAAO;kBACK;MACZ;MACA,YAAY;;;MAGZ,kBAAkB;MAClB,cAAc;MACd;MACA;;MAEA;MACA;MACA;QACE;aACK,CAAC;YACF,CAAC;UACH,KAAK,CAAC;QACR;;;UAGE,SAAS,CAAC,KAAK;QACjB,MAAM,OAAO;UACX,KAAK,EAAE,EAAE;UACT,OAAO,EAAE,EAAE;UACX,KAAK;SACN,CAAC;QACF,MAAM;QACN,MAAM,CAAC;OACR;;;OAGA;MACD,QAAQ,CAAC,MAAM;QACb,IAAI,CAAC,SAAS,CAAC;;QAEf,IAAI,SAAS;UACX,UAAU,CAAC,KAAK,GAAG,SAAS;SAC7B;QACD;UACE,MAAM,eAAe;;UAErB,MAAM,MAAM,GAAG,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC;UACjD,WAAW,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC;UACpC,IAAI,MAAM;YACR,MAAM,CAAC;WACR;;QAEH;iBACS,GAAG;;mBAED,CAAC,MAAM;MACpB;MACA,CAAC;QACC,KAAK,CAAC,QAAQ;MAChB;;QAEE,CAAC,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC;SACxB,KAAK,CAAC,kBAAkB;;;YAGrB,EAAE,EAAE,CAAC;aACJ,CAAC,EAAE,GAAG,CAAC,EAAE,GAAG,UAAU,CAAC,KAAK,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG;;;;iBAI7C;gBACD;cACF;;;4BAGc;0BACF;;;MAGpB;MACA;;;MAGA,QAAQ;MACR,WAAW;;;eAGF;MACT,aAAa;;WAER;MACL,aAAa;;;MAGb,eAAe;MACf,YAAY;;;MAGZ;MACA,SAAS;MACT;MACA;MACA;MACA;MACA,SAAS;MACT;MACA,eAAe;MACf;MACA;MACA,WAAW;MACX,IAAI;MACJ,UAAU;MACV;MACA;MACA,UAAU;MACV,YAAY;MACZ;MACA;MACA;MACA,KAAK;MACL;MACA,KAAK;MACL,UAAU;MACV,aAAa;MACb,IAAI;MACJ;MACA;MACA,UAAU;MACV,eAAe;MACf;;;;;;"}

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

@@ -37,6 +37,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
       transition: "el-zoom-in-top",
       "stop-popper-mouse-event": false,
       "gpu-acceleration": false,
+      persistent: "",
       onShow: _ctx.handleMenuEnter
     }, {
       default: withCtx(() => [

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

@@ -1 +1 @@
-{"version":3,"file":"select.vue_vue_type_template_id_33774f85_lang.mjs","sources":["../../../../../../packages/components/select/src/select.vue?vue&type=template&id=33774f85&lang.js"],"sourcesContent":["<template>\n  <div\n    ref=\"selectWrapper\"\n    v-click-outside:[popperPaneRef]=\"handleClose\"\n    :class=\"wrapperKls\"\n    @click.stop=\"toggleMenu\"\n  >\n    <el-tooltip\n      ref=\"tooltipRef\"\n      v-model:visible=\"dropMenuVisible\"\n      placement=\"bottom-start\"\n      :append-to-body=\"popperAppendToBody\"\n      :popper-class=\"`el-select__popper ${popperClass}`\"\n      :fallback-placements=\"['bottom-start', 'top-start', 'right', 'left']\"\n      effect=\"light\"\n      pure\n      trigger=\"click\"\n      transition=\"el-zoom-in-top\"\n      :stop-popper-mouse-event=\"false\"\n      :gpu-acceleration=\"false\"\n      @show=\"handleMenuEnter\"\n    >\n      <template #default>\n        <div class=\"select-trigger\">\n          <div\n            v-if=\"multiple\"\n            ref=\"tags\"\n            class=\"el-select__tags\"\n            :style=\"selectTagsStyle\"\n          >\n            <span v-if=\"collapseTags && selected.length\">\n              <el-tag\n                :closable=\"!selectDisabled && !selected[0].isDisabled\"\n                :size=\"collapseTagSize\"\n                :hit=\"selected[0].hitState\"\n                :type=\"tagType\"\n                disable-transitions\n                @close=\"deleteTag($event, selected[0])\"\n              >\n                <span\n                  class=\"el-select__tags-text\"\n                  :style=\"{ maxWidth: inputWidth - 123 + 'px' }\"\n                  >{{ selected[0].currentLabel }}</span\n                >\n              </el-tag>\n              <el-tag\n                v-if=\"selected.length > 1\"\n                :closable=\"false\"\n                :size=\"collapseTagSize\"\n                :type=\"tagType\"\n                disable-transitions\n              >\n                <span class=\"el-select__tags-text\"\n                  >+ {{ selected.length - 1 }}</span\n                >\n              </el-tag>\n            </span>\n            <!-- <div> -->\n            <transition v-if=\"!collapseTags\" @after-leave=\"resetInputHeight\">\n              <span\n                :style=\"{\n                  marginLeft:\n                    prefixWidth && selected.length ? `${prefixWidth}px` : null,\n                }\"\n              >\n                <el-tag\n                  v-for=\"item in selected\"\n                  :key=\"getValueKey(item)\"\n                  :closable=\"!selectDisabled && !item.isDisabled\"\n                  :size=\"collapseTagSize\"\n                  :hit=\"item.hitState\"\n                  :type=\"tagType\"\n                  disable-transitions\n                  @close=\"deleteTag($event, item)\"\n                >\n                  <span\n                    class=\"el-select__tags-text\"\n                    :style=\"{ maxWidth: inputWidth - 75 + 'px' }\"\n                    >{{ item.currentLabel }}</span\n                  >\n                </el-tag>\n              </span>\n            </transition>\n            <!-- </div> -->\n            <input\n              v-if=\"filterable\"\n              ref=\"input\"\n              v-model=\"query\"\n              type=\"text\"\n              class=\"el-select__input\"\n              :class=\"[selectSize ? `is-${selectSize}` : '']\"\n              :disabled=\"selectDisabled\"\n              :autocomplete=\"autocomplete\"\n              :style=\"{\n                marginLeft:\n                  (prefixWidth && !selected.length) || tagInMultiLine\n                    ? `${prefixWidth}px`\n                    : null,\n                flexGrow: '1',\n                width: `${inputLength / (inputWidth - 32)}%`,\n                maxWidth: `${inputWidth - 42}px`,\n              }\"\n              @focus=\"handleFocus\"\n              @blur=\"handleBlur\"\n              @keyup=\"managePlaceholder\"\n              @keydown=\"resetInputState\"\n              @keydown.down.prevent=\"navigateOptions('next')\"\n              @keydown.up.prevent=\"navigateOptions('prev')\"\n              @keydown.esc.stop.prevent=\"visible = false\"\n              @keydown.enter.stop.prevent=\"selectOption\"\n              @keydown.delete=\"deletePrevTag\"\n              @keydown.tab=\"visible = false\"\n              @compositionstart=\"handleComposition\"\n              @compositionupdate=\"handleComposition\"\n              @compositionend=\"handleComposition\"\n              @input=\"debouncedQueryChange\"\n            />\n          </div>\n          <el-input\n            :id=\"id\"\n            ref=\"reference\"\n            v-model=\"selectedLabel\"\n            type=\"text\"\n            :placeholder=\"currentPlaceholder\"\n            :name=\"name\"\n            :autocomplete=\"autocomplete\"\n            :size=\"selectSize\"\n            :disabled=\"selectDisabled\"\n            :readonly=\"readonly\"\n            :validate-event=\"false\"\n            :class=\"{ 'is-focus': visible }\"\n            :tabindex=\"multiple && filterable ? -1 : undefined\"\n            @focus=\"handleFocus\"\n            @blur=\"handleBlur\"\n            @input=\"debouncedOnInputChange\"\n            @paste=\"debouncedOnInputChange\"\n            @compositionstart=\"handleComposition\"\n            @compositionupdate=\"handleComposition\"\n            @compositionend=\"handleComposition\"\n            @keydown.down.stop.prevent=\"navigateOptions('next')\"\n            @keydown.up.stop.prevent=\"navigateOptions('prev')\"\n            @keydown.enter.stop.prevent=\"selectOption\"\n            @keydown.esc.stop.prevent=\"visible = false\"\n            @keydown.tab=\"visible = false\"\n            @mouseenter=\"inputHovering = true\"\n            @mouseleave=\"inputHovering = false\"\n          >\n            <template v-if=\"$slots.prefix\" #prefix>\n              <div\n                style=\"\n                  height: 100%;\n                  display: flex;\n                  justify-content: center;\n                  align-items: center;\n                \"\n              >\n                <slot name=\"prefix\"></slot>\n              </div>\n            </template>\n            <template #suffix>\n              <el-icon\n                v-if=\"iconComponent\"\n                v-show=\"!showClose\"\n                :class=\"['el-select__caret', 'el-input__icon', iconReverse]\"\n              >\n                <component :is=\"iconComponent\" />\n              </el-icon>\n              <el-icon\n                v-if=\"showClose && clearIcon\"\n                class=\"el-select__caret el-input__icon\"\n                @click=\"handleClearClick\"\n              >\n                <component :is=\"clearIcon\" />\n              </el-icon>\n            </template>\n          </el-input>\n        </div>\n      </template>\n      <template #content>\n        <el-select-menu>\n          <el-scrollbar\n            v-show=\"options.size > 0 && !loading\"\n            ref=\"scrollbar\"\n            tag=\"ul\"\n            wrap-class=\"el-select-dropdown__wrap\"\n            view-class=\"el-select-dropdown__list\"\n            :class=\"{\n              'is-empty': !allowCreate && query && filteredOptionsCount === 0,\n            }\"\n          >\n            <el-option v-if=\"showNewOption\" :value=\"query\" :created=\"true\" />\n            <slot></slot>\n          </el-scrollbar>\n          <template\n            v-if=\"\n              emptyText &&\n              (!allowCreate || loading || (allowCreate && options.size === 0))\n            \"\n          >\n            <slot v-if=\"$slots.empty\" name=\"empty\"></slot>\n            <p v-else class=\"el-select-dropdown__empty\">\n              {{ emptyText }}\n            </p>\n          </template>\n        </el-select-menu>\n      </template>\n    </el-tooltip>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  toRefs,\n  defineComponent,\n  onMounted,\n  onBeforeUnmount,\n  nextTick,\n  reactive,\n  provide,\n  computed,\n  unref,\n} from 'vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport { useFocus, useLocale } from '@element-plus/hooks'\nimport ElInput from '@element-plus/components/input'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\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 {\n  addResizeListener,\n  removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport { CircleClose, ArrowUp } from '@element-plus/icons-vue'\nimport ElOption from './option.vue'\nimport ElSelectMenu from './select-dropdown.vue'\nimport { useSelect, useSelectStates } from './useSelect'\nimport { selectKey } from './token'\n\nimport type { PropType, Component } from 'vue'\nimport type { ComponentSize } from '@element-plus/utils/types'\nimport type { SelectContext } from './token'\n\nexport default defineComponent({\n  name: 'ElSelect',\n  componentName: 'ElSelect',\n  components: {\n    ElInput,\n    ElSelectMenu,\n    ElOption,\n    ElTag,\n    ElScrollbar,\n    ElTooltip,\n    ElIcon,\n  },\n  directives: { ClickOutside },\n  props: {\n    name: String,\n    id: String,\n    modelValue: {\n      type: [Array, String, Number, Boolean, Object],\n      default: undefined,\n    },\n    autocomplete: {\n      type: String,\n      default: 'off',\n    },\n    automaticDropdown: Boolean,\n    size: {\n      type: String as PropType<ComponentSize>,\n      validator: isValidComponentSize,\n    },\n    disabled: Boolean,\n    clearable: Boolean,\n    filterable: Boolean,\n    allowCreate: Boolean,\n    loading: Boolean,\n    popperClass: {\n      type: String,\n      default: '',\n    },\n    remote: Boolean,\n    loadingText: String,\n    noMatchText: String,\n    noDataText: String,\n    remoteMethod: Function,\n    filterMethod: Function,\n    multiple: Boolean,\n    multipleLimit: {\n      type: Number,\n      default: 0,\n    },\n    placeholder: {\n      type: String,\n    },\n    defaultFirstOption: Boolean,\n    reserveKeyword: Boolean,\n    valueKey: {\n      type: String,\n      default: 'value',\n    },\n    collapseTags: Boolean,\n    popperAppendToBody: {\n      type: Boolean,\n      default: true,\n    },\n    clearIcon: {\n      type: [String, Object] as PropType<string | Component>,\n      default: CircleClose,\n    },\n    fitInputWidth: {\n      type: Boolean,\n      default: false,\n    },\n    suffixIcon: {\n      type: [String, Object] as PropType<string | Component>,\n      default: ArrowUp,\n    },\n    tagType: {\n      type: String,\n      default: 'info',\n    },\n  },\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, ctx) {\n    const { t } = useLocale()\n    const states = useSelectStates(props)\n    const {\n      optionsArray,\n      selectSize,\n      readonly,\n      handleResize,\n      collapseTagSize,\n      debouncedOnInputChange,\n      debouncedQueryChange,\n      deletePrevTag,\n      deleteTag,\n      deleteSelected,\n      handleOptionSelect,\n      scrollToOption,\n      setSelected,\n      resetInputHeight,\n      managePlaceholder,\n      showClose,\n      selectDisabled,\n      iconComponent,\n      iconReverse,\n      showNewOption,\n      emptyText,\n      toggleLastOptionHitState,\n      resetInputState,\n      handleComposition,\n      onOptionCreate,\n      onOptionDestroy,\n      handleMenuEnter,\n      handleFocus,\n      blur,\n      handleBlur,\n      handleClearClick,\n      handleClose,\n      toggleMenu,\n      selectOption,\n      getValueKey,\n      navigateOptions,\n      dropMenuVisible,\n\n      reference,\n      input,\n      tooltipRef,\n      tags,\n      selectWrapper,\n      scrollbar,\n      queryChange,\n      groupQueryChange,\n    } = useSelect(props, states, ctx)\n\n    const { focus } = useFocus(reference)\n\n    const {\n      inputWidth,\n      selected,\n      inputLength,\n      filteredOptionsCount,\n      visible,\n      softFocus,\n      selectedLabel,\n      hoverIndex,\n      query,\n      inputHovering,\n      currentPlaceholder,\n      menuVisibleOnFocus,\n      isOnComposition,\n      isSilentBlur,\n      options,\n      cachedOptions,\n      optionsCount,\n      prefixWidth,\n      tagInMultiLine,\n    } = toRefs(states)\n\n    const wrapperKls = computed(() => {\n      const classList = ['el-select']\n      const _selectSize = unref(selectSize)\n      if (_selectSize) {\n        classList.push(`el-select--${_selectSize}`)\n      }\n      return classList\n    })\n\n    const selectTagsStyle = computed(() => ({\n      maxWidth: `${unref(inputWidth) - 32}px`,\n      width: '100%',\n    }))\n\n    provide(\n      selectKey,\n      reactive({\n        props,\n        options,\n        optionsArray,\n        cachedOptions,\n        optionsCount,\n        filteredOptionsCount,\n        hoverIndex,\n        handleOptionSelect,\n        onOptionCreate,\n        onOptionDestroy,\n        selectWrapper,\n        selected,\n        setSelected,\n        queryChange,\n        groupQueryChange,\n      }) as unknown as SelectContext\n    )\n\n    onMounted(() => {\n      states.cachedPlaceHolder = currentPlaceholder.value =\n        props.placeholder || t('el.select.placeholder')\n      if (\n        props.multiple &&\n        Array.isArray(props.modelValue) &&\n        props.modelValue.length > 0\n      ) {\n        currentPlaceholder.value = ''\n      }\n      addResizeListener(selectWrapper.value as any, handleResize)\n      if (reference.value && reference.value.$el) {\n        const sizeMap = {\n          large: 36,\n          default: 32,\n          small: 28,\n        }\n        const input = reference.value.input as HTMLInputElement\n        states.initialInputHeight =\n          input.getBoundingClientRect().height || sizeMap[selectSize.value]\n      }\n      if (props.remote && props.multiple) {\n        resetInputHeight()\n      }\n      nextTick(() => {\n        if (!reference.value) return\n        if (reference.value.$el) {\n          inputWidth.value = reference.value.$el.getBoundingClientRect().width\n        }\n        if (ctx.slots.prefix) {\n          const inputChildNodes = reference.value.$el.childNodes\n          const input = (Array.from(inputChildNodes) as HTMLElement[]).filter(\n            (item) => item.tagName === 'INPUT'\n          )[0]\n          const prefix = reference.value.$el.querySelector('.el-input__prefix')\n          prefixWidth.value = Math.max(\n            prefix.getBoundingClientRect().width + 5,\n            30\n          )\n          if (states.prefixWidth) {\n            input.style.paddingLeft = `${Math.max(states.prefixWidth, 30)}px`\n          }\n        }\n      })\n      setSelected()\n    })\n\n    onBeforeUnmount(() => {\n      removeResizeListener(selectWrapper.value as any, handleResize)\n    })\n\n    if (props.multiple && !Array.isArray(props.modelValue)) {\n      ctx.emit(UPDATE_MODEL_EVENT, [])\n    }\n    if (!props.multiple && Array.isArray(props.modelValue)) {\n      ctx.emit(UPDATE_MODEL_EVENT, '')\n    }\n\n    const popperPaneRef = computed(() => {\n      return tooltipRef.value?.popperRef?.contentRef\n    })\n\n    return {\n      tagInMultiLine,\n      prefixWidth,\n      selectSize,\n      readonly,\n      handleResize,\n      collapseTagSize,\n      debouncedOnInputChange,\n      debouncedQueryChange,\n      deletePrevTag,\n      deleteTag,\n      deleteSelected,\n      handleOptionSelect,\n      scrollToOption,\n      inputWidth,\n      selected,\n      inputLength,\n      filteredOptionsCount,\n      visible,\n      softFocus,\n      selectedLabel,\n      hoverIndex,\n      query,\n      inputHovering,\n      currentPlaceholder,\n      menuVisibleOnFocus,\n      isOnComposition,\n      isSilentBlur,\n      options,\n      resetInputHeight,\n      managePlaceholder,\n      showClose,\n      selectDisabled,\n      iconComponent,\n      iconReverse,\n      showNewOption,\n      emptyText,\n      toggleLastOptionHitState,\n      resetInputState,\n      handleComposition,\n      handleMenuEnter,\n      handleFocus,\n      blur,\n      handleBlur,\n      handleClearClick,\n      handleClose,\n      toggleMenu,\n      selectOption,\n      getValueKey,\n      navigateOptions,\n      dropMenuVisible,\n      focus,\n\n      reference,\n      input,\n      tooltipRef,\n      popperPaneRef,\n      tags,\n      selectWrapper,\n      scrollbar,\n\n      wrapperKls,\n      selectTagsStyle,\n    }\n  },\n})\n</script>\n"],"names":["_createVNode","_createCommentVNode","_withModifiers","_withDirectives","_createBlock"],"mappings":";;;qBAuBa,KAAK;;;;;;;EAiLI;;;;;;;;;;;;;;;IApMjBA;WACK;;;MAGJ;MACQ;;MACR;MACC;MACA;MACA;MACD;MACA;MACA;MACA,YAAW;;MAEV,iBAAgB;;;;;;;;gBAOX;;gBAEC;;sCAE2B;;;gCAEf,sDAA4C;;;;;qEAK7C,eAAU;;;;iCAGX;4BACJ;;;;;qCAKY;;;qCACJ;;;;;;8BAKX,yCACK;;;;;;;;;;;;;;;+BAOC;;;;;;iDAKN;iCAEM;gEAC2B;;;;8BAI/B;;;;;kCAIE,KAAKC;;uDAEI;;;;;;;;;;gBAKjB;;;;;;;;sBAQG,QAAQ;sBACR,cAAc;sBACd;;;;;;;;;6BASK;;;;;;;;;;;;sBAUL;;sBAEA;sBACA;;;;;;;;YAIF;YACD;;;YAEA;uBACY;;uBAECC,kBAAc;;oBAElB;;YAER,uBAAqB;YACrB;;YAEA;kBACI,iBAAYC;mBACX,EAAE;qBACA;;gCAEY;;;;;;;;;;;;;gCAwBGC;;;oBAElB;;;;;;;;;;eAKK;;;;;;;;;;;;;;;;;+BArB4B;;;;;;;;;;;aA+B1B;;;;;cAKZ;;;;;;;;;;;;"}
+{"version":3,"file":"select.vue_vue_type_template_id_33774f85_lang.mjs","sources":["../../../../../../packages/components/select/src/select.vue?vue&type=template&id=33774f85&lang.js"],"sourcesContent":["<template>\n  <div\n    ref=\"selectWrapper\"\n    v-click-outside:[popperPaneRef]=\"handleClose\"\n    :class=\"wrapperKls\"\n    @click.stop=\"toggleMenu\"\n  >\n    <el-tooltip\n      ref=\"tooltipRef\"\n      v-model:visible=\"dropMenuVisible\"\n      placement=\"bottom-start\"\n      :append-to-body=\"popperAppendToBody\"\n      :popper-class=\"`el-select__popper ${popperClass}`\"\n      :fallback-placements=\"['bottom-start', 'top-start', 'right', 'left']\"\n      effect=\"light\"\n      pure\n      trigger=\"click\"\n      transition=\"el-zoom-in-top\"\n      :stop-popper-mouse-event=\"false\"\n      :gpu-acceleration=\"false\"\n      persistent\n      @show=\"handleMenuEnter\"\n    >\n      <template #default>\n        <div class=\"select-trigger\">\n          <div\n            v-if=\"multiple\"\n            ref=\"tags\"\n            class=\"el-select__tags\"\n            :style=\"selectTagsStyle\"\n          >\n            <span v-if=\"collapseTags && selected.length\">\n              <el-tag\n                :closable=\"!selectDisabled && !selected[0].isDisabled\"\n                :size=\"collapseTagSize\"\n                :hit=\"selected[0].hitState\"\n                :type=\"tagType\"\n                disable-transitions\n                @close=\"deleteTag($event, selected[0])\"\n              >\n                <span\n                  class=\"el-select__tags-text\"\n                  :style=\"{ maxWidth: inputWidth - 123 + 'px' }\"\n                  >{{ selected[0].currentLabel }}</span\n                >\n              </el-tag>\n              <el-tag\n                v-if=\"selected.length > 1\"\n                :closable=\"false\"\n                :size=\"collapseTagSize\"\n                :type=\"tagType\"\n                disable-transitions\n              >\n                <span class=\"el-select__tags-text\"\n                  >+ {{ selected.length - 1 }}</span\n                >\n              </el-tag>\n            </span>\n            <!-- <div> -->\n            <transition v-if=\"!collapseTags\" @after-leave=\"resetInputHeight\">\n              <span\n                :style=\"{\n                  marginLeft:\n                    prefixWidth && selected.length ? `${prefixWidth}px` : null,\n                }\"\n              >\n                <el-tag\n                  v-for=\"item in selected\"\n                  :key=\"getValueKey(item)\"\n                  :closable=\"!selectDisabled && !item.isDisabled\"\n                  :size=\"collapseTagSize\"\n                  :hit=\"item.hitState\"\n                  :type=\"tagType\"\n                  disable-transitions\n                  @close=\"deleteTag($event, item)\"\n                >\n                  <span\n                    class=\"el-select__tags-text\"\n                    :style=\"{ maxWidth: inputWidth - 75 + 'px' }\"\n                    >{{ item.currentLabel }}</span\n                  >\n                </el-tag>\n              </span>\n            </transition>\n            <!-- </div> -->\n            <input\n              v-if=\"filterable\"\n              ref=\"input\"\n              v-model=\"query\"\n              type=\"text\"\n              class=\"el-select__input\"\n              :class=\"[selectSize ? `is-${selectSize}` : '']\"\n              :disabled=\"selectDisabled\"\n              :autocomplete=\"autocomplete\"\n              :style=\"{\n                marginLeft:\n                  (prefixWidth && !selected.length) || tagInMultiLine\n                    ? `${prefixWidth}px`\n                    : null,\n                flexGrow: '1',\n                width: `${inputLength / (inputWidth - 32)}%`,\n                maxWidth: `${inputWidth - 42}px`,\n              }\"\n              @focus=\"handleFocus\"\n              @blur=\"handleBlur\"\n              @keyup=\"managePlaceholder\"\n              @keydown=\"resetInputState\"\n              @keydown.down.prevent=\"navigateOptions('next')\"\n              @keydown.up.prevent=\"navigateOptions('prev')\"\n              @keydown.esc.stop.prevent=\"visible = false\"\n              @keydown.enter.stop.prevent=\"selectOption\"\n              @keydown.delete=\"deletePrevTag\"\n              @keydown.tab=\"visible = false\"\n              @compositionstart=\"handleComposition\"\n              @compositionupdate=\"handleComposition\"\n              @compositionend=\"handleComposition\"\n              @input=\"debouncedQueryChange\"\n            />\n          </div>\n          <el-input\n            :id=\"id\"\n            ref=\"reference\"\n            v-model=\"selectedLabel\"\n            type=\"text\"\n            :placeholder=\"currentPlaceholder\"\n            :name=\"name\"\n            :autocomplete=\"autocomplete\"\n            :size=\"selectSize\"\n            :disabled=\"selectDisabled\"\n            :readonly=\"readonly\"\n            :validate-event=\"false\"\n            :class=\"{ 'is-focus': visible }\"\n            :tabindex=\"multiple && filterable ? -1 : undefined\"\n            @focus=\"handleFocus\"\n            @blur=\"handleBlur\"\n            @input=\"debouncedOnInputChange\"\n            @paste=\"debouncedOnInputChange\"\n            @compositionstart=\"handleComposition\"\n            @compositionupdate=\"handleComposition\"\n            @compositionend=\"handleComposition\"\n            @keydown.down.stop.prevent=\"navigateOptions('next')\"\n            @keydown.up.stop.prevent=\"navigateOptions('prev')\"\n            @keydown.enter.stop.prevent=\"selectOption\"\n            @keydown.esc.stop.prevent=\"visible = false\"\n            @keydown.tab=\"visible = false\"\n            @mouseenter=\"inputHovering = true\"\n            @mouseleave=\"inputHovering = false\"\n          >\n            <template v-if=\"$slots.prefix\" #prefix>\n              <div\n                style=\"\n                  height: 100%;\n                  display: flex;\n                  justify-content: center;\n                  align-items: center;\n                \"\n              >\n                <slot name=\"prefix\"></slot>\n              </div>\n            </template>\n            <template #suffix>\n              <el-icon\n                v-if=\"iconComponent\"\n                v-show=\"!showClose\"\n                :class=\"['el-select__caret', 'el-input__icon', iconReverse]\"\n              >\n                <component :is=\"iconComponent\" />\n              </el-icon>\n              <el-icon\n                v-if=\"showClose && clearIcon\"\n                class=\"el-select__caret el-input__icon\"\n                @click=\"handleClearClick\"\n              >\n                <component :is=\"clearIcon\" />\n              </el-icon>\n            </template>\n          </el-input>\n        </div>\n      </template>\n      <template #content>\n        <el-select-menu>\n          <el-scrollbar\n            v-show=\"options.size > 0 && !loading\"\n            ref=\"scrollbar\"\n            tag=\"ul\"\n            wrap-class=\"el-select-dropdown__wrap\"\n            view-class=\"el-select-dropdown__list\"\n            :class=\"{\n              'is-empty': !allowCreate && query && filteredOptionsCount === 0,\n            }\"\n          >\n            <el-option v-if=\"showNewOption\" :value=\"query\" :created=\"true\" />\n            <slot></slot>\n          </el-scrollbar>\n          <template\n            v-if=\"\n              emptyText &&\n              (!allowCreate || loading || (allowCreate && options.size === 0))\n            \"\n          >\n            <slot v-if=\"$slots.empty\" name=\"empty\"></slot>\n            <p v-else class=\"el-select-dropdown__empty\">\n              {{ emptyText }}\n            </p>\n          </template>\n        </el-select-menu>\n      </template>\n    </el-tooltip>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  toRefs,\n  defineComponent,\n  onMounted,\n  onBeforeUnmount,\n  nextTick,\n  reactive,\n  provide,\n  computed,\n  unref,\n} from 'vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport { useFocus, useLocale } from '@element-plus/hooks'\nimport ElInput from '@element-plus/components/input'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\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 {\n  addResizeListener,\n  removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport { CircleClose, ArrowUp } from '@element-plus/icons-vue'\nimport ElOption from './option.vue'\nimport ElSelectMenu from './select-dropdown.vue'\nimport { useSelect, useSelectStates } from './useSelect'\nimport { selectKey } from './token'\n\nimport type { PropType, Component } from 'vue'\nimport type { ComponentSize } from '@element-plus/utils/types'\nimport type { SelectContext } from './token'\n\nexport default defineComponent({\n  name: 'ElSelect',\n  componentName: 'ElSelect',\n  components: {\n    ElInput,\n    ElSelectMenu,\n    ElOption,\n    ElTag,\n    ElScrollbar,\n    ElTooltip,\n    ElIcon,\n  },\n  directives: { ClickOutside },\n  props: {\n    name: String,\n    id: String,\n    modelValue: {\n      type: [Array, String, Number, Boolean, Object],\n      default: undefined,\n    },\n    autocomplete: {\n      type: String,\n      default: 'off',\n    },\n    automaticDropdown: Boolean,\n    size: {\n      type: String as PropType<ComponentSize>,\n      validator: isValidComponentSize,\n    },\n    disabled: Boolean,\n    clearable: Boolean,\n    filterable: Boolean,\n    allowCreate: Boolean,\n    loading: Boolean,\n    popperClass: {\n      type: String,\n      default: '',\n    },\n    remote: Boolean,\n    loadingText: String,\n    noMatchText: String,\n    noDataText: String,\n    remoteMethod: Function,\n    filterMethod: Function,\n    multiple: Boolean,\n    multipleLimit: {\n      type: Number,\n      default: 0,\n    },\n    placeholder: {\n      type: String,\n    },\n    defaultFirstOption: Boolean,\n    reserveKeyword: Boolean,\n    valueKey: {\n      type: String,\n      default: 'value',\n    },\n    collapseTags: Boolean,\n    popperAppendToBody: {\n      type: Boolean,\n      default: true,\n    },\n    clearIcon: {\n      type: [String, Object] as PropType<string | Component>,\n      default: CircleClose,\n    },\n    fitInputWidth: {\n      type: Boolean,\n      default: false,\n    },\n    suffixIcon: {\n      type: [String, Object] as PropType<string | Component>,\n      default: ArrowUp,\n    },\n    tagType: {\n      type: String,\n      default: 'info',\n    },\n  },\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, ctx) {\n    const { t } = useLocale()\n    const states = useSelectStates(props)\n    const {\n      optionsArray,\n      selectSize,\n      readonly,\n      handleResize,\n      collapseTagSize,\n      debouncedOnInputChange,\n      debouncedQueryChange,\n      deletePrevTag,\n      deleteTag,\n      deleteSelected,\n      handleOptionSelect,\n      scrollToOption,\n      setSelected,\n      resetInputHeight,\n      managePlaceholder,\n      showClose,\n      selectDisabled,\n      iconComponent,\n      iconReverse,\n      showNewOption,\n      emptyText,\n      toggleLastOptionHitState,\n      resetInputState,\n      handleComposition,\n      onOptionCreate,\n      onOptionDestroy,\n      handleMenuEnter,\n      handleFocus,\n      blur,\n      handleBlur,\n      handleClearClick,\n      handleClose,\n      toggleMenu,\n      selectOption,\n      getValueKey,\n      navigateOptions,\n      dropMenuVisible,\n\n      reference,\n      input,\n      tooltipRef,\n      tags,\n      selectWrapper,\n      scrollbar,\n      queryChange,\n      groupQueryChange,\n    } = useSelect(props, states, ctx)\n\n    const { focus } = useFocus(reference)\n\n    const {\n      inputWidth,\n      selected,\n      inputLength,\n      filteredOptionsCount,\n      visible,\n      softFocus,\n      selectedLabel,\n      hoverIndex,\n      query,\n      inputHovering,\n      currentPlaceholder,\n      menuVisibleOnFocus,\n      isOnComposition,\n      isSilentBlur,\n      options,\n      cachedOptions,\n      optionsCount,\n      prefixWidth,\n      tagInMultiLine,\n    } = toRefs(states)\n\n    const wrapperKls = computed(() => {\n      const classList = ['el-select']\n      const _selectSize = unref(selectSize)\n      if (_selectSize) {\n        classList.push(`el-select--${_selectSize}`)\n      }\n      return classList\n    })\n\n    const selectTagsStyle = computed(() => ({\n      maxWidth: `${unref(inputWidth) - 32}px`,\n      width: '100%',\n    }))\n\n    provide(\n      selectKey,\n      reactive({\n        props,\n        options,\n        optionsArray,\n        cachedOptions,\n        optionsCount,\n        filteredOptionsCount,\n        hoverIndex,\n        handleOptionSelect,\n        onOptionCreate,\n        onOptionDestroy,\n        selectWrapper,\n        selected,\n        setSelected,\n        queryChange,\n        groupQueryChange,\n      }) as unknown as SelectContext\n    )\n\n    onMounted(() => {\n      states.cachedPlaceHolder = currentPlaceholder.value =\n        props.placeholder || t('el.select.placeholder')\n      if (\n        props.multiple &&\n        Array.isArray(props.modelValue) &&\n        props.modelValue.length > 0\n      ) {\n        currentPlaceholder.value = ''\n      }\n      addResizeListener(selectWrapper.value as any, handleResize)\n      if (reference.value && reference.value.$el) {\n        const sizeMap = {\n          large: 36,\n          default: 32,\n          small: 28,\n        }\n        const input = reference.value.input as HTMLInputElement\n        states.initialInputHeight =\n          input.getBoundingClientRect().height || sizeMap[selectSize.value]\n      }\n      if (props.remote && props.multiple) {\n        resetInputHeight()\n      }\n      nextTick(() => {\n        if (!reference.value) return\n        if (reference.value.$el) {\n          inputWidth.value = reference.value.$el.getBoundingClientRect().width\n        }\n        if (ctx.slots.prefix) {\n          const inputChildNodes = reference.value.$el.childNodes\n          const input = (Array.from(inputChildNodes) as HTMLElement[]).filter(\n            (item) => item.tagName === 'INPUT'\n          )[0]\n          const prefix = reference.value.$el.querySelector('.el-input__prefix')\n          prefixWidth.value = Math.max(\n            prefix.getBoundingClientRect().width + 5,\n            30\n          )\n          if (states.prefixWidth) {\n            input.style.paddingLeft = `${Math.max(states.prefixWidth, 30)}px`\n          }\n        }\n      })\n      setSelected()\n    })\n\n    onBeforeUnmount(() => {\n      removeResizeListener(selectWrapper.value as any, handleResize)\n    })\n\n    if (props.multiple && !Array.isArray(props.modelValue)) {\n      ctx.emit(UPDATE_MODEL_EVENT, [])\n    }\n    if (!props.multiple && Array.isArray(props.modelValue)) {\n      ctx.emit(UPDATE_MODEL_EVENT, '')\n    }\n\n    const popperPaneRef = computed(() => {\n      return tooltipRef.value?.popperRef?.contentRef\n    })\n\n    return {\n      tagInMultiLine,\n      prefixWidth,\n      selectSize,\n      readonly,\n      handleResize,\n      collapseTagSize,\n      debouncedOnInputChange,\n      debouncedQueryChange,\n      deletePrevTag,\n      deleteTag,\n      deleteSelected,\n      handleOptionSelect,\n      scrollToOption,\n      inputWidth,\n      selected,\n      inputLength,\n      filteredOptionsCount,\n      visible,\n      softFocus,\n      selectedLabel,\n      hoverIndex,\n      query,\n      inputHovering,\n      currentPlaceholder,\n      menuVisibleOnFocus,\n      isOnComposition,\n      isSilentBlur,\n      options,\n      resetInputHeight,\n      managePlaceholder,\n      showClose,\n      selectDisabled,\n      iconComponent,\n      iconReverse,\n      showNewOption,\n      emptyText,\n      toggleLastOptionHitState,\n      resetInputState,\n      handleComposition,\n      handleMenuEnter,\n      handleFocus,\n      blur,\n      handleBlur,\n      handleClearClick,\n      handleClose,\n      toggleMenu,\n      selectOption,\n      getValueKey,\n      navigateOptions,\n      dropMenuVisible,\n      focus,\n\n      reference,\n      input,\n      tooltipRef,\n      popperPaneRef,\n      tags,\n      selectWrapper,\n      scrollbar,\n\n      wrapperKls,\n      selectTagsStyle,\n    }\n  },\n})\n</script>\n"],"names":["_createVNode","_createCommentVNode","_withModifiers","_withDirectives","_createBlock"],"mappings":";;;qBAwBa,KAAK;;;;;;;EAiLI;;;;;;;;;;;;;;;IArMjBA;WACK;;;MAGJ;MACQ;;MACR;MACC;MACA;MACA;MACD;MACA;MACA;MACA,UAAU,EAAC;MACV;;MAED;;;;;;;;gBAOM;;gBAEC;;sCAE2B;;;gCAEf,sDAA4C;;;;;qEAK7C,eAAU;;;;iCAGX;4BACJ;;;;;qCAKY;;;qCACJ;;;;;;8BAKX,yCACK;;;;;;;;;;;;;;;+BAOC;;;;;;iDAKN;iCAEM;gEAC2B;;;;8BAI/B;;;;;kCAIE,KAAKC;;uDAEI;;;;;;;;;;gBAKjB;;;;;;;;sBAQG,QAAQ;sBACR,cAAc;sBACd;;;;;;;;;6BASK;;;;;;;;;;;;sBAUL;;sBAEA;sBACA;;;;;;;;YAIF;YACD;;;YAEA;uBACY;;uBAECC,kBAAc;;oBAElB;;YAER,uBAAqB;YACrB;;YAEA;kBACI,iBAAYC;mBACX,EAAE;qBACA;;gCAEY;;;;;;;;;;;;;gCAwBGC;;;oBAElB;;;;;;;;;;eAKK;;;;;;;;;;;;;;;;;+BArB4B;;;;;;;;;;;aA+B1B;;;;;cAKZ;;;;;;;;;;;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"select.vue_vue_type_script_lang.mjs","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-tooltip\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=\"light\"\n      placement=\"bottom-start\"\n      pure\n      transition=\"el-zoom-in-top\"\n      trigger=\"click\"\n      @show=\"handleMenuEnter\"\n      @hide=\"states.inputValue = states.displayInputValue\"\n    >\n      <template #default>\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 #content>\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-tooltip>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, provide, toRefs, reactive, vModelText } from 'vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport ElTooltip from '@element-plus/components/tooltip'\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    ElTooltip,\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":["ElSelectMenu"],"mappings":";;;;;;;;;;;;;AAsQA,aAAe,eAAe,CAAC;AAC/B,EAAE,MAAM,YAAY;EAClB,UAAU,EAAE;kBACVA;IACA,KAAK;IACL;IACA,MAAM;;EAER;EACA,KAAK,EAAE,WAAW;EAClB,KAAK,EAAE;IACL;IACA,YAAY;IACZ,YAAY;IACZ,OAAO;IACP;IACA,OAAO;IACP,MAAM;;EAER;;IAEE,OAAO,CAAC;MACN,KAAK,UAAU,CAAC;QACd,GAAG,MAAM,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;;;;;;"}
+{"version":3,"file":"select.vue_vue_type_script_lang.mjs","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-tooltip\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=\"light\"\n      placement=\"bottom-start\"\n      pure\n      transition=\"el-zoom-in-top\"\n      trigger=\"click\"\n      persistent\n      @show=\"handleMenuEnter\"\n      @hide=\"states.inputValue = states.displayInputValue\"\n    >\n      <template #default>\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 #content>\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-tooltip>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, provide, toRefs, reactive, vModelText } from 'vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport ElTooltip from '@element-plus/components/tooltip'\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    ElTooltip,\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":["ElSelectMenu"],"mappings":";;;;;;;;;;;;;AAuQA,aAAe,eAAe,CAAC;AAC/B,EAAE,MAAM,YAAY;EAClB,UAAU,EAAE;kBACVA;IACA,KAAK;IACL;IACA,MAAM;;EAER;EACA,KAAK,EAAE,WAAW;EAClB,KAAK,EAAE;IACL;IACA,YAAY;IACZ,YAAY;IACZ,OAAO;IACP;IACA,OAAO;IACP,MAAM;;EAER;;IAEE,OAAO,CAAC;MACN,KAAK,UAAU,CAAC;QACd,GAAG,MAAM,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/es/components/select-v2/src/select.vue_vue_type_template_id_13e598a4_lang.mjs

@@ -45,6 +45,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
       pure: "",
       transition: "el-zoom-in-top",
       trigger: "click",
+      persistent: "",
       onShow: _ctx.handleMenuEnter,
       onHide: _cache[23] || (_cache[23] = ($event) => _ctx.states.inputValue = _ctx.states.displayInputValue)
     }, {

package/es/components/select-v2/src/select.vue_vue_type_template_id_13e598a4_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"select.vue_vue_type_template_id_13e598a4_lang.mjs","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-tooltip\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=\"light\"\n      placement=\"bottom-start\"\n      pure\n      transition=\"el-zoom-in-top\"\n      trigger=\"click\"\n      @show=\"handleMenuEnter\"\n      @hide=\"states.inputValue = states.displayInputValue\"\n    >\n      <template #default>\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 #content>\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-tooltip>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, provide, toRefs, reactive, vModelText } from 'vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport ElTooltip from '@element-plus/components/tooltip'\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    ElTooltip,\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":";;;;;;EAyC+B;;;;EAEZ;;;;0BA2GA;;;kDAsDyB;eAqC3B,KAAK,EAAC;;;;;;;;;;;IA/OnB;IAEC,qFACK;;IAELA,WAAU;;;;MAIT;MACQ;;MACP;MACA;MACA;MACA;MACA;MACA;MACD;MACA,SAAS;MACT,MAAA;MACA;;MAEC;YACI;;;;;;;;;;;;;;gBAcC;;;;6BAEF;;;;;;;;;wBASQ;wBACC,OAAKC;;;;;;;;8CAOAC,WAAO;;;;;yCAGf;;mCAEW;;;;;;8BAKTC;;;;;gCAKG,IAAEC,mBAAG;;;;;;;;wBAST,QAAQ;;;;6BAIHC;;;;0BAIJ;0BACC;;;;;;;;;;;;;;;kBAaL;kBACC;;;;uBAII,EAACC;gCAES;;;;;;;;;;;;;;oBAeZ,qBAAiB,wCAAE,2DAAkB;oBACrC,OAAK;oBACL,OAAK;oBACL,6HAAwC;oBACxC,2DAAmB,qEAAuB;;6BAEnC;;;;;;;;;;mBAOF;;;;;;qCAIN;;;;;;;;sBAUG,EAAE;;;qCAIS;;qCAEE;oCACD;;;;;;oBAMd;oBACD,UAAU;oBACV,MAAK;oBACJ,oCAAgC;;uCAEf;;uEAEV;;;;;;;;;;;;;;;;;oCAYE;;mCAEZC,2BAAe;;;;;4BAInB;;gBAEG;;;;;;;;;;;;;;kBAeE,+DAAiD;;;;;;;;;;aAK5C;;;sBACD;;;oCAGL;;;;;;kCAGuB;;;sBAClB;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"select.vue_vue_type_template_id_13e598a4_lang.mjs","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-tooltip\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=\"light\"\n      placement=\"bottom-start\"\n      pure\n      transition=\"el-zoom-in-top\"\n      trigger=\"click\"\n      persistent\n      @show=\"handleMenuEnter\"\n      @hide=\"states.inputValue = states.displayInputValue\"\n    >\n      <template #default>\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 #content>\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-tooltip>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, provide, toRefs, reactive, vModelText } from 'vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport ElTooltip from '@element-plus/components/tooltip'\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    ElTooltip,\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,WAAU;;;;MAIT;MACQ;;MACP;MACA;MACA;MACA;MACA;MACA;MACD;MACA,SAAS;MACT;MACA,YAAW;MACX;;MAEC;YACI;;;;;;;;;;;;;;gBAcC;;;;6BAEF;;;;;;;;;wBASQ;wBACC,OAAKC;;;;;;;;8CAOAC,WAAO;;;;;yCAGf;;mCAEW;;;;;;8BAKTC;;;;;gCAKG,IAAEC,mBAAG;;;;;;;;wBAST,QAAQ;;;;6BAIHC;;;;0BAIJ;0BACC;;;;;;;;;;;;;;;kBAaL;kBACC;;;;uBAII,EAACC;gCAES;;;;;;;;;;;;;;oBAeZ,qBAAiB,wCAAE,2DAAkB;oBACrC,OAAK;oBACL,OAAK;oBACL,6HAAwC;oBACxC,2DAAmB,qEAAuB;;6BAEnC;;;;;;;;;;mBAOF;;;;;;qCAIN;;;;;;;;sBAUG,EAAE;;;qCAIS;;qCAEE;oCACD;;;;;;oBAMd;oBACD,UAAU;oBACV,MAAK;oBACJ,oCAAgC;;uCAEf;;uEAEV;;;;;;;;;;;;;;;;;oCAYE;;mCAEZC,2BAAe;;;;;4BAInB;;gBAEG;;;;;;;;;;;;;;kBAeE,+DAAiD;;;;;;;;;;aAK5C;;;sBACD;;;oCAGL;;;;;;kCAGuB;;;sBAClB;;;;;;;;;;;;;;;;"}

package/es/components/slider/src/button.vue_vue_type_script_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"button.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/slider/src/button.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"button\"\n    class=\"el-slider__button-wrapper\"\n    :class=\"{ hover: hovering, dragging: dragging }\"\n    :style=\"wrapperStyle\"\n    tabindex=\"0\"\n    @mouseenter=\"handleMouseEnter\"\n    @mouseleave=\"handleMouseLeave\"\n    @mousedown=\"onButtonDown\"\n    @touchstart=\"onButtonDown\"\n    @focus=\"handleMouseEnter\"\n    @blur=\"handleMouseLeave\"\n    @keydown.left=\"onLeftKeyDown\"\n    @keydown.right=\"onRightKeyDown\"\n    @keydown.down.prevent=\"onLeftKeyDown\"\n    @keydown.up.prevent=\"onRightKeyDown\"\n  >\n    <el-tooltip\n      ref=\"tooltip\"\n      v-model=\"tooltipVisible\"\n      placement=\"top\"\n      :stop-popper-mouse-event=\"false\"\n      :popper-class=\"tooltipClass\"\n      :disabled=\"!showTooltip\"\n      manual\n    >\n      <template #content>\n        <span>{{ formatValue }}</span>\n      </template>\n      <div\n        class=\"el-slider__button\"\n        :class=\"{ hover: hovering, dragging: dragging }\"\n      ></div>\n    </el-tooltip>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, reactive, toRefs } from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { useSliderButton } from './useSliderButton'\n\nexport default defineComponent({\n  name: 'ElSliderButton',\n\n  components: {\n    ElTooltip,\n  },\n\n  props: {\n    modelValue: {\n      type: Number,\n      default: 0,\n    },\n    vertical: {\n      type: Boolean,\n      default: false,\n    },\n    tooltipClass: {\n      type: String,\n      default: '',\n    },\n  },\n\n  emits: [UPDATE_MODEL_EVENT],\n\n  setup(props, { emit }) {\n    const initData = reactive({\n      hovering: false,\n      dragging: false,\n      isClick: false,\n      startX: 0,\n      currentX: 0,\n      startY: 0,\n      currentY: 0,\n      startPosition: 0,\n      newPosition: 0,\n      oldValue: props.modelValue,\n    })\n\n    const {\n      tooltip,\n      showTooltip,\n      tooltipVisible,\n      wrapperStyle,\n      formatValue,\n      handleMouseEnter,\n      handleMouseLeave,\n      onButtonDown,\n      onLeftKeyDown,\n      onRightKeyDown,\n      setPosition,\n    } = useSliderButton(props, initData, emit)\n\n    const { hovering, dragging } = toRefs(initData)\n\n    return {\n      tooltip,\n      tooltipVisible,\n      showTooltip,\n      wrapperStyle,\n      formatValue,\n      handleMouseEnter,\n      handleMouseLeave,\n      onButtonDown,\n      onLeftKeyDown,\n      onRightKeyDown,\n      setPosition,\n\n      hovering,\n      dragging,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;AA0CA,aAAe,eAAe;;AAE9B,EAAE,UAAU;IACR,SAAS;;EAEX,KAAK,EAAE;IACL;;;KAGC;IACD,QAAQ,EAAE;MACR,IAAI,EAAE;MACN,OAAO,EAAE;KACV;IACD;MACE,IAAI,EAAE,MAAM;MACZ,OAAO,EAAE,EAAE;KACZ;;OAEE,EAAE,CAAC;OACH,CAAC,KAAK,EAAE,EAAE;IACb;;;MAGE,OAAO,EAAE,KAAK;;MAEd,WAAW;MACX,MAAM,EAAE,CAAC;MACT,QAAQ,EAAE,CAAC;MACX,aAAa,EAAE;MACf,WAAW,EAAE,CAAC;MACd,QAAQ;MACR,CAAC;UACG;MACJ,OAAO;MACP,WAAW;MACX,cAAc;MACd,YAAY;;;MAGZ;MACA;MACA;MACA,cAAc;MACd,WAAW;QACT;UACE,EAAE,QAAQ,EAAE;WACX;MACL,OAAO;MACP;MACA,WAAW;MACX;MACA,WAAW;;MAEX,gBAAgB;;MAEhB;MACA;MACA,WAAW;MACX,QAAQ;MACR,QAAQ;MACR;;;;;;"}
+{"version":3,"file":"button.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/slider/src/button.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"button\"\n    class=\"el-slider__button-wrapper\"\n    :class=\"{ hover: hovering, dragging: dragging }\"\n    :style=\"wrapperStyle\"\n    tabindex=\"0\"\n    @mouseenter=\"handleMouseEnter\"\n    @mouseleave=\"handleMouseLeave\"\n    @mousedown=\"onButtonDown\"\n    @touchstart=\"onButtonDown\"\n    @focus=\"handleMouseEnter\"\n    @blur=\"handleMouseLeave\"\n    @keydown.left=\"onLeftKeyDown\"\n    @keydown.right=\"onRightKeyDown\"\n    @keydown.down.prevent=\"onLeftKeyDown\"\n    @keydown.up.prevent=\"onRightKeyDown\"\n  >\n    <el-tooltip\n      ref=\"tooltip\"\n      v-model=\"tooltipVisible\"\n      placement=\"top\"\n      :stop-popper-mouse-event=\"false\"\n      :popper-class=\"tooltipClass\"\n      :disabled=\"!showTooltip\"\n      manual\n      persistent\n    >\n      <template #content>\n        <span>{{ formatValue }}</span>\n      </template>\n      <div\n        class=\"el-slider__button\"\n        :class=\"{ hover: hovering, dragging: dragging }\"\n      ></div>\n    </el-tooltip>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, reactive, toRefs } from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { useSliderButton } from './useSliderButton'\n\nexport default defineComponent({\n  name: 'ElSliderButton',\n\n  components: {\n    ElTooltip,\n  },\n\n  props: {\n    modelValue: {\n      type: Number,\n      default: 0,\n    },\n    vertical: {\n      type: Boolean,\n      default: false,\n    },\n    tooltipClass: {\n      type: String,\n      default: '',\n    },\n  },\n\n  emits: [UPDATE_MODEL_EVENT],\n\n  setup(props, { emit }) {\n    const initData = reactive({\n      hovering: false,\n      dragging: false,\n      isClick: false,\n      startX: 0,\n      currentX: 0,\n      startY: 0,\n      currentY: 0,\n      startPosition: 0,\n      newPosition: 0,\n      oldValue: props.modelValue,\n    })\n\n    const {\n      tooltip,\n      showTooltip,\n      tooltipVisible,\n      wrapperStyle,\n      formatValue,\n      handleMouseEnter,\n      handleMouseLeave,\n      onButtonDown,\n      onLeftKeyDown,\n      onRightKeyDown,\n      setPosition,\n    } = useSliderButton(props, initData, emit)\n\n    const { hovering, dragging } = toRefs(initData)\n\n    return {\n      tooltip,\n      tooltipVisible,\n      showTooltip,\n      wrapperStyle,\n      formatValue,\n      handleMouseEnter,\n      handleMouseLeave,\n      onButtonDown,\n      onLeftKeyDown,\n      onRightKeyDown,\n      setPosition,\n\n      hovering,\n      dragging,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;AA2CA,aAAe,eAAe;;AAE9B,EAAE,UAAU;IACR,SAAS;;EAEX,KAAK,EAAE;IACL;;;KAGC;IACD,QAAQ,EAAE;MACR,IAAI,EAAE;MACN,OAAO,EAAE;KACV;IACD;MACE,IAAI,EAAE,MAAM;MACZ,OAAO,EAAE,EAAE;KACZ;;OAEE,EAAE,CAAC;OACH,CAAC,KAAK,EAAE,EAAE;IACb;;;MAGE,OAAO,EAAE,KAAK;;MAEd,WAAW;MACX,MAAM,EAAE,CAAC;MACT,QAAQ,EAAE,CAAC;MACX,aAAa,EAAE;MACf,WAAW,EAAE,CAAC;MACd,QAAQ;MACR,CAAC;UACG;MACJ,OAAO;MACP,WAAW;MACX,cAAc;MACd,YAAY;;;MAGZ;MACA;MACA;MACA,cAAc;MACd,WAAW;QACT;UACE,EAAE,QAAQ,EAAE;WACX;MACL,OAAO;MACP;MACA,WAAW;MACX;MACA,WAAW;;MAEX,gBAAgB;;MAEhB;MACA;MACA,WAAW;MACX,QAAQ;MACR,QAAQ;MACR;;;;;;"}

package/es/components/slider/src/button.vue_vue_type_template_id_9cd3e794_lang.mjs

@@ -28,7 +28,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
       "stop-popper-mouse-event": false,
       "popper-class": _ctx.tooltipClass,
       disabled: !_ctx.showTooltip,
-      manual: ""
+      manual: "",
+      persistent: ""
     }, {
       content: withCtx(() => [
         createElementVNode("span", null, toDisplayString(_ctx.formatValue), 1)

package/es/components/slider/src/button.vue_vue_type_template_id_9cd3e794_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"button.vue_vue_type_template_id_9cd3e794_lang.mjs","sources":["../../../../../../packages/components/slider/src/button.vue?vue&type=template&id=9cd3e794&lang.js"],"sourcesContent":["<template>\n  <div\n    ref=\"button\"\n    class=\"el-slider__button-wrapper\"\n    :class=\"{ hover: hovering, dragging: dragging }\"\n    :style=\"wrapperStyle\"\n    tabindex=\"0\"\n    @mouseenter=\"handleMouseEnter\"\n    @mouseleave=\"handleMouseLeave\"\n    @mousedown=\"onButtonDown\"\n    @touchstart=\"onButtonDown\"\n    @focus=\"handleMouseEnter\"\n    @blur=\"handleMouseLeave\"\n    @keydown.left=\"onLeftKeyDown\"\n    @keydown.right=\"onRightKeyDown\"\n    @keydown.down.prevent=\"onLeftKeyDown\"\n    @keydown.up.prevent=\"onRightKeyDown\"\n  >\n    <el-tooltip\n      ref=\"tooltip\"\n      v-model=\"tooltipVisible\"\n      placement=\"top\"\n      :stop-popper-mouse-event=\"false\"\n      :popper-class=\"tooltipClass\"\n      :disabled=\"!showTooltip\"\n      manual\n    >\n      <template #content>\n        <span>{{ formatValue }}</span>\n      </template>\n      <div\n        class=\"el-slider__button\"\n        :class=\"{ hover: hovering, dragging: dragging }\"\n      ></div>\n    </el-tooltip>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, reactive, toRefs } from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { useSliderButton } from './useSliderButton'\n\nexport default defineComponent({\n  name: 'ElSliderButton',\n\n  components: {\n    ElTooltip,\n  },\n\n  props: {\n    modelValue: {\n      type: Number,\n      default: 0,\n    },\n    vertical: {\n      type: Boolean,\n      default: false,\n    },\n    tooltipClass: {\n      type: String,\n      default: '',\n    },\n  },\n\n  emits: [UPDATE_MODEL_EVENT],\n\n  setup(props, { emit }) {\n    const initData = reactive({\n      hovering: false,\n      dragging: false,\n      isClick: false,\n      startX: 0,\n      currentX: 0,\n      startY: 0,\n      currentY: 0,\n      startPosition: 0,\n      newPosition: 0,\n      oldValue: props.modelValue,\n    })\n\n    const {\n      tooltip,\n      showTooltip,\n      tooltipVisible,\n      wrapperStyle,\n      formatValue,\n      handleMouseEnter,\n      handleMouseLeave,\n      onButtonDown,\n      onLeftKeyDown,\n      onRightKeyDown,\n      setPosition,\n    } = useSliderButton(props, initData, emit)\n\n    const { hovering, dragging } = toRefs(initData)\n\n    return {\n      tooltip,\n      tooltipVisible,\n      showTooltip,\n      wrapperStyle,\n      formatValue,\n      handleMouseEnter,\n      handleMouseLeave,\n      onButtonDown,\n      onLeftKeyDown,\n      onRightKeyDown,\n      setPosition,\n\n      hovering,\n      dragging,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;IAEI,KAAI;IACJ;IAEC,uBAAO,iBAAY;IACpB;IACC;IACA,YAAU;IACV,qDAAW;IACX,qGAAwB;IACxB;0GACsB;aACf;sDAAO;;;;;;;MAMb;;;MAEA;MACC,2BAAyB;MACzB;;MAED;;;;;;;;;;;;;;;"}
+{"version":3,"file":"button.vue_vue_type_template_id_9cd3e794_lang.mjs","sources":["../../../../../../packages/components/slider/src/button.vue?vue&type=template&id=9cd3e794&lang.js"],"sourcesContent":["<template>\n  <div\n    ref=\"button\"\n    class=\"el-slider__button-wrapper\"\n    :class=\"{ hover: hovering, dragging: dragging }\"\n    :style=\"wrapperStyle\"\n    tabindex=\"0\"\n    @mouseenter=\"handleMouseEnter\"\n    @mouseleave=\"handleMouseLeave\"\n    @mousedown=\"onButtonDown\"\n    @touchstart=\"onButtonDown\"\n    @focus=\"handleMouseEnter\"\n    @blur=\"handleMouseLeave\"\n    @keydown.left=\"onLeftKeyDown\"\n    @keydown.right=\"onRightKeyDown\"\n    @keydown.down.prevent=\"onLeftKeyDown\"\n    @keydown.up.prevent=\"onRightKeyDown\"\n  >\n    <el-tooltip\n      ref=\"tooltip\"\n      v-model=\"tooltipVisible\"\n      placement=\"top\"\n      :stop-popper-mouse-event=\"false\"\n      :popper-class=\"tooltipClass\"\n      :disabled=\"!showTooltip\"\n      manual\n      persistent\n    >\n      <template #content>\n        <span>{{ formatValue }}</span>\n      </template>\n      <div\n        class=\"el-slider__button\"\n        :class=\"{ hover: hovering, dragging: dragging }\"\n      ></div>\n    </el-tooltip>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, reactive, toRefs } from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { useSliderButton } from './useSliderButton'\n\nexport default defineComponent({\n  name: 'ElSliderButton',\n\n  components: {\n    ElTooltip,\n  },\n\n  props: {\n    modelValue: {\n      type: Number,\n      default: 0,\n    },\n    vertical: {\n      type: Boolean,\n      default: false,\n    },\n    tooltipClass: {\n      type: String,\n      default: '',\n    },\n  },\n\n  emits: [UPDATE_MODEL_EVENT],\n\n  setup(props, { emit }) {\n    const initData = reactive({\n      hovering: false,\n      dragging: false,\n      isClick: false,\n      startX: 0,\n      currentX: 0,\n      startY: 0,\n      currentY: 0,\n      startPosition: 0,\n      newPosition: 0,\n      oldValue: props.modelValue,\n    })\n\n    const {\n      tooltip,\n      showTooltip,\n      tooltipVisible,\n      wrapperStyle,\n      formatValue,\n      handleMouseEnter,\n      handleMouseLeave,\n      onButtonDown,\n      onLeftKeyDown,\n      onRightKeyDown,\n      setPosition,\n    } = useSliderButton(props, initData, emit)\n\n    const { hovering, dragging } = toRefs(initData)\n\n    return {\n      tooltip,\n      tooltipVisible,\n      showTooltip,\n      wrapperStyle,\n      formatValue,\n      handleMouseEnter,\n      handleMouseLeave,\n      onButtonDown,\n      onLeftKeyDown,\n      onRightKeyDown,\n      setPosition,\n\n      hovering,\n      dragging,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;IAEI,KAAI;IACJ;IAEC,uBAAO,iBAAY;IACpB;IACC;IACA,YAAU;IACV,qDAAW;IACX,qGAAwB;IACxB;0GACsB;aACf;sDAAO;;;;;;;MAMb;;;MAEA;MACC,2BAAyB;MACzB;MACA;;MAED;;;;;;;;;;;;;;;"}

package/es/components/table/src/filter-panel.vue_vue_type_script_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"filter-panel.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/table/src/filter-panel.vue"],"sourcesContent":["<template>\n  <el-tooltip\n    ref=\"tooltip\"\n    v-model:visible=\"tooltipVisible\"\n    :offset=\"0\"\n    :placement=\"placement\"\n    :show-arrow=\"false\"\n    :stop-popper-mouse-event=\"false\"\n    append-to-body\n    effect=\"light\"\n    pure\n    popper-class=\"el-table-filter\"\n  >\n    <template #content>\n      <div v-if=\"multiple\">\n        <div class=\"el-table-filter__content\">\n          <el-scrollbar wrap-class=\"el-table-filter__wrap\">\n            <el-checkbox-group\n              v-model=\"filteredValue\"\n              class=\"el-table-filter__checkbox-group\"\n            >\n              <el-checkbox\n                v-for=\"filter in filters\"\n                :key=\"filter.value\"\n                :label=\"filter.value\"\n              >\n                {{ filter.text }}\n              </el-checkbox>\n            </el-checkbox-group>\n          </el-scrollbar>\n        </div>\n        <div class=\"el-table-filter__bottom\">\n          <button\n            :class=\"{ 'is-disabled': filteredValue.length === 0 }\"\n            :disabled=\"filteredValue.length === 0\"\n            type=\"button\"\n            @click=\"handleConfirm\"\n          >\n            {{ t('el.table.confirmFilter') }}\n          </button>\n          <button type=\"button\" @click=\"handleReset\">\n            {{ t('el.table.resetFilter') }}\n          </button>\n        </div>\n      </div>\n      <ul v-else class=\"el-table-filter__list\">\n        <li\n          :class=\"{\n            'is-active': filterValue === undefined || filterValue === null,\n          }\"\n          class=\"el-table-filter__list-item\"\n          @click=\"handleSelect(null)\"\n        >\n          {{ t('el.table.clearFilter') }}\n        </li>\n        <li\n          v-for=\"filter in filters\"\n          :key=\"filter.value\"\n          :class=\"{ 'is-active': isActive(filter) }\"\n          :label=\"filter.value\"\n          class=\"el-table-filter__list-item\"\n          @click=\"handleSelect(filter.value)\"\n        >\n          {{ filter.text }}\n        </li>\n      </ul>\n    </template>\n    <template #default>\n      <span\n        v-click-outside:[popperPaneRef]=\"hideFilterPanel\"\n        class=\"el-table__column-filter-trigger el-none-outline\"\n        @click=\"showFilterPanel\"\n      >\n        <el-icon>\n          <arrow-up v-if=\"column.filterOpened\" />\n          <arrow-down v-else />\n        </el-icon>\n      </span>\n    </template>\n  </el-tooltip>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, computed, getCurrentInstance, watch } from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowDown, ArrowUp } from '@element-plus/icons-vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport { useLocale } from '@element-plus/hooks'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport type { Placement } from '@element-plus/components/popper'\n\nimport type { WritableComputedRef, PropType } from 'vue'\nimport type { TableColumnCtx } from './table-column/defaults'\nimport type { TableHeader } from './table-header'\nimport type { Store } from './store'\n\nconst { CheckboxGroup: ElCheckboxGroup } = ElCheckbox\n\nexport default defineComponent({\n  name: 'ElTableFilterPanel',\n  components: {\n    ElCheckbox,\n    ElCheckboxGroup,\n    ElScrollbar,\n    ElTooltip,\n    ElIcon,\n    ArrowDown,\n    ArrowUp,\n  },\n  directives: { ClickOutside },\n  props: {\n    placement: {\n      type: String as PropType<Placement>,\n      default: 'bottom-start',\n    },\n    store: {\n      type: Object as PropType<Store<unknown>>,\n    },\n    column: {\n      type: Object as PropType<TableColumnCtx<unknown>>,\n    },\n    upDataColumn: {\n      type: Function,\n    },\n  },\n  setup(props) {\n    const instance = getCurrentInstance()\n    const { t } = useLocale()\n    const parent = instance.parent as TableHeader\n    if (!parent.filterPanels.value[props.column.id]) {\n      parent.filterPanels.value[props.column.id] = instance\n    }\n    const tooltipVisible = ref(false)\n    const tooltip = ref<InstanceType<typeof ElTooltip> | null>(null)\n    const filters = computed(() => {\n      return props.column && props.column.filters\n    })\n    const filterValue = computed({\n      get: () => (props.column.filteredValue || [])[0],\n      set: (value: string) => {\n        if (filteredValue.value) {\n          if (typeof value !== 'undefined' && value !== null) {\n            filteredValue.value.splice(0, 1, value)\n          } else {\n            filteredValue.value.splice(0, 1)\n          }\n        }\n      },\n    })\n    const filteredValue: WritableComputedRef<unknown[]> = computed({\n      get() {\n        if (props.column) {\n          return props.column.filteredValue || []\n        }\n        return []\n      },\n      set(value: unknown[]) {\n        if (props.column) {\n          props.upDataColumn('filteredValue', value)\n        }\n      },\n    })\n    const multiple = computed(() => {\n      if (props.column) {\n        return props.column.filterMultiple\n      }\n      return true\n    })\n    const isActive = (filter) => {\n      return filter.value === filterValue.value\n    }\n    const hidden = () => {\n      tooltipVisible.value = false\n    }\n    const showFilterPanel = (e: MouseEvent) => {\n      e.stopPropagation()\n      tooltipVisible.value = !tooltipVisible.value\n    }\n    const hideFilterPanel = () => {\n      tooltipVisible.value = false\n    }\n    const handleConfirm = () => {\n      confirmFilter(filteredValue.value)\n      hidden()\n    }\n    const handleReset = () => {\n      filteredValue.value = []\n      confirmFilter(filteredValue.value)\n      hidden()\n    }\n    const handleSelect = (_filterValue?: string) => {\n      filterValue.value = _filterValue\n      if (typeof _filterValue !== 'undefined' && _filterValue !== null) {\n        confirmFilter(filteredValue.value)\n      } else {\n        confirmFilter([])\n      }\n      hidden()\n    }\n    const confirmFilter = (filteredValue: unknown[]) => {\n      props.store.commit('filterChange', {\n        column: props.column,\n        values: filteredValue,\n      })\n      props.store.updateAllSelected()\n    }\n    watch(\n      tooltipVisible,\n      (value) => {\n        // todo\n        if (props.column) {\n          props.upDataColumn('filterOpened', value)\n        }\n      },\n      {\n        immediate: true,\n      }\n    )\n\n    const popperPaneRef = computed(() => {\n      return tooltip.value?.popperRef?.contentRef\n    })\n\n    return {\n      tooltipVisible,\n      multiple,\n      filteredValue,\n      filterValue,\n      filters,\n      handleConfirm,\n      handleReset,\n      handleSelect,\n      isActive,\n      t,\n      showFilterPanel,\n      hideFilterPanel,\n      popperPaneRef,\n      tooltip,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;AA0FA,QAAQ,aAAa,iBAAiB,EAAE,GAAG,UAAU,CAAC;AACtD,aAAe,gBAAgB;;AAE/B,EAAE,UAAU,EAAE;AACd,IAAI,UAAU;AACd,IAAI,eAAe;AACnB,IAAI,WAAW;;AAEf,IAAI,MAAM;;AAEV,IAAI,OAAO;GACR;EACD,UAAU,EAAE;OACP,EAAE;IACL,SAAS,EAAE;MACT,IAAI,EAAE;MACN,OAAO;KACR;IACD,KAAK,EAAE;MACL,IAAI;;IAEN,MAAM,EAAE;MACN;KACD;gBACW;MACV,IAAI,EAAE,QAAQ;KACf;;OAEE,CAAC,KAAK,EAAE;IACX;IACA,MAAM,EAAE;UACF,MAAM,GAAG,QAAQ,CAAC,MAAM,CAAC;IAC/B;MACE,MAAM,CAAC;;IAET;;IAEA,MAAM;MACJ,OAAO,MAAM,MAAM,IAAI,KAAK,CAAC;KAC9B,CAAC,CAAC;IACH,MAAM,WAAW,GAAG,QAAQ,CAAC;SACxB,EAAE,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,aAAa,IAAI,EAAE,GAAG;MAC/C,GAAG,EAAE,CAAC,KAAK,KAAK;;UAEZ,IAAI,OAAO,UAAU;YACnB,aAAa,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,EAAE,GAAG,KAAK,CAAC,CAAC;WACzC;0BACe,KAAK,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;;;OAGtC;MACD,CAAC;uBACgB,GAAG;;YAEd,KAAK,CAAC,MAAM,EAAE;UAChB,OAAO;;;;MAIX;;UAEI,KAAK,CAAC,YAAY,CAAC,eAAe,EAAE,KAAK,CAAC,CAAC;SAC5C;;;;UAIC,KAAK,CAAC;;OAET;aACM,IAAI,CAAC;;;MAGZ;KACD;IACD,MAAM,MAAM,GAAG,MAAM;MACnB,cAAc,CAAC;;;MAGf,CAAC,CAAC;;KAEH,CAAC;UACI,kBAAkB,MAAM;;KAE7B,CAAC;UACI,aAAa,SAAS;;MAE1B,MAAM,EAAE,CAAC;MACT;UACI,WAAW,GAAG,MAAM;;MAExB,aAAa,CAAC,cAAc;MAC5B,MAAM,EAAE,CAAC;;IAEX,MAAM,YAAY,IAAI;MACpB,WAAW,CAAC,KAAK,GAAG,YAAY,CAAC;MACjC,IAAI;;OAEH,MAAM;QACL,aAAa,CAAC,EAAE,EAAE;OACnB;MACD,MAAM;;IAER,MAAM,aAAa,GAAG,CAAC,cAAc,KAAK;MACxC,KAAK,CAAC,KAAK,CAAC,MAAM;cACV,OAAO,CAAC,MAAM;QACpB,MAAM,EAAE,cAAc;QACtB,CAAC;WACE,CAAC,KAAK,CAAC;MACZ;SACG,CAAC;;QAEF,KAAK,CAAC,YAAY,CAAC,gBAAgB,KAAK,CAAC,CAAC;OAC3C;;iBAEU,IAAI;MACf,CAAC;UACG,aAAa,GAAG,QAAQ,CAAC;;MAE7B;MACA,CAAC;WACI;;cAEG;mBACK;;MAEb;MACA;iBACW;MACX;;;MAGA,eAAe;MACf,eAAe;;;KAGhB,CAAC;;;;;;"}
+{"version":3,"file":"filter-panel.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/table/src/filter-panel.vue"],"sourcesContent":["<template>\n  <el-tooltip\n    ref=\"tooltip\"\n    v-model:visible=\"tooltipVisible\"\n    :offset=\"0\"\n    :placement=\"placement\"\n    :show-arrow=\"false\"\n    :stop-popper-mouse-event=\"false\"\n    append-to-body\n    effect=\"light\"\n    pure\n    popper-class=\"el-table-filter\"\n    persistent\n  >\n    <template #content>\n      <div v-if=\"multiple\">\n        <div class=\"el-table-filter__content\">\n          <el-scrollbar wrap-class=\"el-table-filter__wrap\">\n            <el-checkbox-group\n              v-model=\"filteredValue\"\n              class=\"el-table-filter__checkbox-group\"\n            >\n              <el-checkbox\n                v-for=\"filter in filters\"\n                :key=\"filter.value\"\n                :label=\"filter.value\"\n              >\n                {{ filter.text }}\n              </el-checkbox>\n            </el-checkbox-group>\n          </el-scrollbar>\n        </div>\n        <div class=\"el-table-filter__bottom\">\n          <button\n            :class=\"{ 'is-disabled': filteredValue.length === 0 }\"\n            :disabled=\"filteredValue.length === 0\"\n            type=\"button\"\n            @click=\"handleConfirm\"\n          >\n            {{ t('el.table.confirmFilter') }}\n          </button>\n          <button type=\"button\" @click=\"handleReset\">\n            {{ t('el.table.resetFilter') }}\n          </button>\n        </div>\n      </div>\n      <ul v-else class=\"el-table-filter__list\">\n        <li\n          :class=\"{\n            'is-active': filterValue === undefined || filterValue === null,\n          }\"\n          class=\"el-table-filter__list-item\"\n          @click=\"handleSelect(null)\"\n        >\n          {{ t('el.table.clearFilter') }}\n        </li>\n        <li\n          v-for=\"filter in filters\"\n          :key=\"filter.value\"\n          :class=\"{ 'is-active': isActive(filter) }\"\n          :label=\"filter.value\"\n          class=\"el-table-filter__list-item\"\n          @click=\"handleSelect(filter.value)\"\n        >\n          {{ filter.text }}\n        </li>\n      </ul>\n    </template>\n    <template #default>\n      <span\n        v-click-outside:[popperPaneRef]=\"hideFilterPanel\"\n        class=\"el-table__column-filter-trigger el-none-outline\"\n        @click=\"showFilterPanel\"\n      >\n        <el-icon>\n          <arrow-up v-if=\"column.filterOpened\" />\n          <arrow-down v-else />\n        </el-icon>\n      </span>\n    </template>\n  </el-tooltip>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, computed, getCurrentInstance, watch } from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowDown, ArrowUp } from '@element-plus/icons-vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport { useLocale } from '@element-plus/hooks'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport type { Placement } from '@element-plus/components/popper'\n\nimport type { WritableComputedRef, PropType } from 'vue'\nimport type { TableColumnCtx } from './table-column/defaults'\nimport type { TableHeader } from './table-header'\nimport type { Store } from './store'\n\nconst { CheckboxGroup: ElCheckboxGroup } = ElCheckbox\n\nexport default defineComponent({\n  name: 'ElTableFilterPanel',\n  components: {\n    ElCheckbox,\n    ElCheckboxGroup,\n    ElScrollbar,\n    ElTooltip,\n    ElIcon,\n    ArrowDown,\n    ArrowUp,\n  },\n  directives: { ClickOutside },\n  props: {\n    placement: {\n      type: String as PropType<Placement>,\n      default: 'bottom-start',\n    },\n    store: {\n      type: Object as PropType<Store<unknown>>,\n    },\n    column: {\n      type: Object as PropType<TableColumnCtx<unknown>>,\n    },\n    upDataColumn: {\n      type: Function,\n    },\n  },\n  setup(props) {\n    const instance = getCurrentInstance()\n    const { t } = useLocale()\n    const parent = instance.parent as TableHeader\n    if (!parent.filterPanels.value[props.column.id]) {\n      parent.filterPanels.value[props.column.id] = instance\n    }\n    const tooltipVisible = ref(false)\n    const tooltip = ref<InstanceType<typeof ElTooltip> | null>(null)\n    const filters = computed(() => {\n      return props.column && props.column.filters\n    })\n    const filterValue = computed({\n      get: () => (props.column.filteredValue || [])[0],\n      set: (value: string) => {\n        if (filteredValue.value) {\n          if (typeof value !== 'undefined' && value !== null) {\n            filteredValue.value.splice(0, 1, value)\n          } else {\n            filteredValue.value.splice(0, 1)\n          }\n        }\n      },\n    })\n    const filteredValue: WritableComputedRef<unknown[]> = computed({\n      get() {\n        if (props.column) {\n          return props.column.filteredValue || []\n        }\n        return []\n      },\n      set(value: unknown[]) {\n        if (props.column) {\n          props.upDataColumn('filteredValue', value)\n        }\n      },\n    })\n    const multiple = computed(() => {\n      if (props.column) {\n        return props.column.filterMultiple\n      }\n      return true\n    })\n    const isActive = (filter) => {\n      return filter.value === filterValue.value\n    }\n    const hidden = () => {\n      tooltipVisible.value = false\n    }\n    const showFilterPanel = (e: MouseEvent) => {\n      e.stopPropagation()\n      tooltipVisible.value = !tooltipVisible.value\n    }\n    const hideFilterPanel = () => {\n      tooltipVisible.value = false\n    }\n    const handleConfirm = () => {\n      confirmFilter(filteredValue.value)\n      hidden()\n    }\n    const handleReset = () => {\n      filteredValue.value = []\n      confirmFilter(filteredValue.value)\n      hidden()\n    }\n    const handleSelect = (_filterValue?: string) => {\n      filterValue.value = _filterValue\n      if (typeof _filterValue !== 'undefined' && _filterValue !== null) {\n        confirmFilter(filteredValue.value)\n      } else {\n        confirmFilter([])\n      }\n      hidden()\n    }\n    const confirmFilter = (filteredValue: unknown[]) => {\n      props.store.commit('filterChange', {\n        column: props.column,\n        values: filteredValue,\n      })\n      props.store.updateAllSelected()\n    }\n    watch(\n      tooltipVisible,\n      (value) => {\n        // todo\n        if (props.column) {\n          props.upDataColumn('filterOpened', value)\n        }\n      },\n      {\n        immediate: true,\n      }\n    )\n\n    const popperPaneRef = computed(() => {\n      return tooltip.value?.popperRef?.contentRef\n    })\n\n    return {\n      tooltipVisible,\n      multiple,\n      filteredValue,\n      filterValue,\n      filters,\n      handleConfirm,\n      handleReset,\n      handleSelect,\n      isActive,\n      t,\n      showFilterPanel,\n      hideFilterPanel,\n      popperPaneRef,\n      tooltip,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;AA2FA,QAAQ,aAAa,iBAAiB,EAAE,GAAG,UAAU,CAAC;AACtD,aAAe,gBAAgB;;AAE/B,EAAE,UAAU,EAAE;AACd,IAAI,UAAU;AACd,IAAI,eAAe;AACnB,IAAI,WAAW;;AAEf,IAAI,MAAM;;AAEV,IAAI,OAAO;GACR;EACD,UAAU,EAAE;OACP,EAAE;IACL,SAAS,EAAE;MACT,IAAI,EAAE;MACN,OAAO;KACR;IACD,KAAK,EAAE;MACL,IAAI;;IAEN,MAAM,EAAE;MACN;KACD;gBACW;MACV,IAAI,EAAE,QAAQ;KACf;;OAEE,CAAC,KAAK,EAAE;IACX;IACA,MAAM,EAAE;UACF,MAAM,GAAG,QAAQ,CAAC,MAAM,CAAC;IAC/B;MACE,MAAM,CAAC;;IAET;;IAEA,MAAM;MACJ,OAAO,MAAM,MAAM,IAAI,KAAK,CAAC;KAC9B,CAAC,CAAC;IACH,MAAM,WAAW,GAAG,QAAQ,CAAC;SACxB,EAAE,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,aAAa,IAAI,EAAE,GAAG;MAC/C,GAAG,EAAE,CAAC,KAAK,KAAK;;UAEZ,IAAI,OAAO,UAAU;YACnB,aAAa,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,EAAE,GAAG,KAAK,CAAC,CAAC;WACzC;0BACe,KAAK,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;;;OAGtC;MACD,CAAC;uBACgB,GAAG;;YAEd,KAAK,CAAC,MAAM,EAAE;UAChB,OAAO;;;;MAIX;;UAEI,KAAK,CAAC,YAAY,CAAC,eAAe,EAAE,KAAK,CAAC,CAAC;SAC5C;;;;UAIC,KAAK,CAAC;;OAET;aACM,IAAI,CAAC;;;MAGZ;KACD;IACD,MAAM,MAAM,GAAG,MAAM;MACnB,cAAc,CAAC;;;MAGf,CAAC,CAAC;;KAEH,CAAC;UACI,kBAAkB,MAAM;;KAE7B,CAAC;UACI,aAAa,SAAS;;MAE1B,MAAM,EAAE,CAAC;MACT;UACI,WAAW,GAAG,MAAM;;MAExB,aAAa,CAAC,cAAc;MAC5B,MAAM,EAAE,CAAC;;IAEX,MAAM,YAAY,IAAI;MACpB,WAAW,CAAC,KAAK,GAAG,YAAY,CAAC;MACjC,IAAI;;OAEH,MAAM;QACL,aAAa,CAAC,EAAE,EAAE;OACnB;MACD,MAAM;;IAER,MAAM,aAAa,GAAG,CAAC,cAAc,KAAK;MACxC,KAAK,CAAC,KAAK,CAAC,MAAM;cACV,OAAO,CAAC,MAAM;QACpB,MAAM,EAAE,cAAc;QACtB,CAAC;WACE,CAAC,KAAK,CAAC;MACZ;SACG,CAAC;;QAEF,KAAK,CAAC,YAAY,CAAC,gBAAgB,KAAK,CAAC,CAAC;OAC3C;;iBAEU,IAAI;MACf,CAAC;UACG,aAAa,GAAG,QAAQ,CAAC;;MAE7B;MACA,CAAC;WACI;;cAEG;mBACK;;MAEb;MACA;iBACW;MACX;;;MAGA,eAAe;MACf,eAAe;;;KAGhB,CAAC;;;;;;"}

package/es/components/table/src/filter-panel.vue_vue_type_template_id_fde1c940_lang.mjs

@@ -29,7 +29,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     "append-to-body": "",
     effect: "light",
     pure: "",
-    "popper-class": "el-table-filter"
+    "popper-class": "el-table-filter",
+    persistent: ""
   }, {
     content: withCtx(() => [
       _ctx.multiple ? (openBlock(), createElementBlock("div", _hoisted_1, [

package/es/components/table/src/filter-panel.vue_vue_type_template_id_fde1c940_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"filter-panel.vue_vue_type_template_id_fde1c940_lang.mjs","sources":["../../../../../../packages/components/table/src/filter-panel.vue?vue&type=template&id=fde1c940&lang.js"],"sourcesContent":["<template>\n  <el-tooltip\n    ref=\"tooltip\"\n    v-model:visible=\"tooltipVisible\"\n    :offset=\"0\"\n    :placement=\"placement\"\n    :show-arrow=\"false\"\n    :stop-popper-mouse-event=\"false\"\n    append-to-body\n    effect=\"light\"\n    pure\n    popper-class=\"el-table-filter\"\n  >\n    <template #content>\n      <div v-if=\"multiple\">\n        <div class=\"el-table-filter__content\">\n          <el-scrollbar wrap-class=\"el-table-filter__wrap\">\n            <el-checkbox-group\n              v-model=\"filteredValue\"\n              class=\"el-table-filter__checkbox-group\"\n            >\n              <el-checkbox\n                v-for=\"filter in filters\"\n                :key=\"filter.value\"\n                :label=\"filter.value\"\n              >\n                {{ filter.text }}\n              </el-checkbox>\n            </el-checkbox-group>\n          </el-scrollbar>\n        </div>\n        <div class=\"el-table-filter__bottom\">\n          <button\n            :class=\"{ 'is-disabled': filteredValue.length === 0 }\"\n            :disabled=\"filteredValue.length === 0\"\n            type=\"button\"\n            @click=\"handleConfirm\"\n          >\n            {{ t('el.table.confirmFilter') }}\n          </button>\n          <button type=\"button\" @click=\"handleReset\">\n            {{ t('el.table.resetFilter') }}\n          </button>\n        </div>\n      </div>\n      <ul v-else class=\"el-table-filter__list\">\n        <li\n          :class=\"{\n            'is-active': filterValue === undefined || filterValue === null,\n          }\"\n          class=\"el-table-filter__list-item\"\n          @click=\"handleSelect(null)\"\n        >\n          {{ t('el.table.clearFilter') }}\n        </li>\n        <li\n          v-for=\"filter in filters\"\n          :key=\"filter.value\"\n          :class=\"{ 'is-active': isActive(filter) }\"\n          :label=\"filter.value\"\n          class=\"el-table-filter__list-item\"\n          @click=\"handleSelect(filter.value)\"\n        >\n          {{ filter.text }}\n        </li>\n      </ul>\n    </template>\n    <template #default>\n      <span\n        v-click-outside:[popperPaneRef]=\"hideFilterPanel\"\n        class=\"el-table__column-filter-trigger el-none-outline\"\n        @click=\"showFilterPanel\"\n      >\n        <el-icon>\n          <arrow-up v-if=\"column.filterOpened\" />\n          <arrow-down v-else />\n        </el-icon>\n      </span>\n    </template>\n  </el-tooltip>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, computed, getCurrentInstance, watch } from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowDown, ArrowUp } from '@element-plus/icons-vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport { useLocale } from '@element-plus/hooks'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport type { Placement } from '@element-plus/components/popper'\n\nimport type { WritableComputedRef, PropType } from 'vue'\nimport type { TableColumnCtx } from './table-column/defaults'\nimport type { TableHeader } from './table-header'\nimport type { Store } from './store'\n\nconst { CheckboxGroup: ElCheckboxGroup } = ElCheckbox\n\nexport default defineComponent({\n  name: 'ElTableFilterPanel',\n  components: {\n    ElCheckbox,\n    ElCheckboxGroup,\n    ElScrollbar,\n    ElTooltip,\n    ElIcon,\n    ArrowDown,\n    ArrowUp,\n  },\n  directives: { ClickOutside },\n  props: {\n    placement: {\n      type: String as PropType<Placement>,\n      default: 'bottom-start',\n    },\n    store: {\n      type: Object as PropType<Store<unknown>>,\n    },\n    column: {\n      type: Object as PropType<TableColumnCtx<unknown>>,\n    },\n    upDataColumn: {\n      type: Function,\n    },\n  },\n  setup(props) {\n    const instance = getCurrentInstance()\n    const { t } = useLocale()\n    const parent = instance.parent as TableHeader\n    if (!parent.filterPanels.value[props.column.id]) {\n      parent.filterPanels.value[props.column.id] = instance\n    }\n    const tooltipVisible = ref(false)\n    const tooltip = ref<InstanceType<typeof ElTooltip> | null>(null)\n    const filters = computed(() => {\n      return props.column && props.column.filters\n    })\n    const filterValue = computed({\n      get: () => (props.column.filteredValue || [])[0],\n      set: (value: string) => {\n        if (filteredValue.value) {\n          if (typeof value !== 'undefined' && value !== null) {\n            filteredValue.value.splice(0, 1, value)\n          } else {\n            filteredValue.value.splice(0, 1)\n          }\n        }\n      },\n    })\n    const filteredValue: WritableComputedRef<unknown[]> = computed({\n      get() {\n        if (props.column) {\n          return props.column.filteredValue || []\n        }\n        return []\n      },\n      set(value: unknown[]) {\n        if (props.column) {\n          props.upDataColumn('filteredValue', value)\n        }\n      },\n    })\n    const multiple = computed(() => {\n      if (props.column) {\n        return props.column.filterMultiple\n      }\n      return true\n    })\n    const isActive = (filter) => {\n      return filter.value === filterValue.value\n    }\n    const hidden = () => {\n      tooltipVisible.value = false\n    }\n    const showFilterPanel = (e: MouseEvent) => {\n      e.stopPropagation()\n      tooltipVisible.value = !tooltipVisible.value\n    }\n    const hideFilterPanel = () => {\n      tooltipVisible.value = false\n    }\n    const handleConfirm = () => {\n      confirmFilter(filteredValue.value)\n      hidden()\n    }\n    const handleReset = () => {\n      filteredValue.value = []\n      confirmFilter(filteredValue.value)\n      hidden()\n    }\n    const handleSelect = (_filterValue?: string) => {\n      filterValue.value = _filterValue\n      if (typeof _filterValue !== 'undefined' && _filterValue !== null) {\n        confirmFilter(filteredValue.value)\n      } else {\n        confirmFilter([])\n      }\n      hidden()\n    }\n    const confirmFilter = (filteredValue: unknown[]) => {\n      props.store.commit('filterChange', {\n        column: props.column,\n        values: filteredValue,\n      })\n      props.store.updateAllSelected()\n    }\n    watch(\n      tooltipVisible,\n      (value) => {\n        // todo\n        if (props.column) {\n          props.upDataColumn('filterOpened', value)\n        }\n      },\n      {\n        immediate: true,\n      }\n    )\n\n    const popperPaneRef = computed(() => {\n      return tooltip.value?.popperRef?.contentRef\n    })\n\n    return {\n      tooltipVisible,\n      multiple,\n      filteredValue,\n      filterValue,\n      filters,\n      handleConfirm,\n      handleReset,\n      handleSelect,\n      isActive,\n      t,\n      showFilterPanel,\n      hideFilterPanel,\n      popperPaneRef,\n      tooltip,\n    }\n  },\n})\n</script>\n"],"names":["_openBlock"],"mappings":";;;;qBAea,KAAK,EAAC;;;;;EA8BF;;;;;;;;;;;;;;wBA5Cf;IACE;IACQ,SAAS;;IAChB;IACA;IACA;IACA;IACD;;IAEA;;;qBAIE;;;;kEAE4B;;;;;oBAGpB,OAAMA;;;;6CAEN;;;;;;;;;;;;;;;;;YAUN;;;;gBAII;iEACQ;iCAEL;;;;iCAGA;;;yBAIT;;kBAEU;;;;;;mCAQR;gBAEG;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"filter-panel.vue_vue_type_template_id_fde1c940_lang.mjs","sources":["../../../../../../packages/components/table/src/filter-panel.vue?vue&type=template&id=fde1c940&lang.js"],"sourcesContent":["<template>\n  <el-tooltip\n    ref=\"tooltip\"\n    v-model:visible=\"tooltipVisible\"\n    :offset=\"0\"\n    :placement=\"placement\"\n    :show-arrow=\"false\"\n    :stop-popper-mouse-event=\"false\"\n    append-to-body\n    effect=\"light\"\n    pure\n    popper-class=\"el-table-filter\"\n    persistent\n  >\n    <template #content>\n      <div v-if=\"multiple\">\n        <div class=\"el-table-filter__content\">\n          <el-scrollbar wrap-class=\"el-table-filter__wrap\">\n            <el-checkbox-group\n              v-model=\"filteredValue\"\n              class=\"el-table-filter__checkbox-group\"\n            >\n              <el-checkbox\n                v-for=\"filter in filters\"\n                :key=\"filter.value\"\n                :label=\"filter.value\"\n              >\n                {{ filter.text }}\n              </el-checkbox>\n            </el-checkbox-group>\n          </el-scrollbar>\n        </div>\n        <div class=\"el-table-filter__bottom\">\n          <button\n            :class=\"{ 'is-disabled': filteredValue.length === 0 }\"\n            :disabled=\"filteredValue.length === 0\"\n            type=\"button\"\n            @click=\"handleConfirm\"\n          >\n            {{ t('el.table.confirmFilter') }}\n          </button>\n          <button type=\"button\" @click=\"handleReset\">\n            {{ t('el.table.resetFilter') }}\n          </button>\n        </div>\n      </div>\n      <ul v-else class=\"el-table-filter__list\">\n        <li\n          :class=\"{\n            'is-active': filterValue === undefined || filterValue === null,\n          }\"\n          class=\"el-table-filter__list-item\"\n          @click=\"handleSelect(null)\"\n        >\n          {{ t('el.table.clearFilter') }}\n        </li>\n        <li\n          v-for=\"filter in filters\"\n          :key=\"filter.value\"\n          :class=\"{ 'is-active': isActive(filter) }\"\n          :label=\"filter.value\"\n          class=\"el-table-filter__list-item\"\n          @click=\"handleSelect(filter.value)\"\n        >\n          {{ filter.text }}\n        </li>\n      </ul>\n    </template>\n    <template #default>\n      <span\n        v-click-outside:[popperPaneRef]=\"hideFilterPanel\"\n        class=\"el-table__column-filter-trigger el-none-outline\"\n        @click=\"showFilterPanel\"\n      >\n        <el-icon>\n          <arrow-up v-if=\"column.filterOpened\" />\n          <arrow-down v-else />\n        </el-icon>\n      </span>\n    </template>\n  </el-tooltip>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, computed, getCurrentInstance, watch } from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowDown, ArrowUp } from '@element-plus/icons-vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport { useLocale } from '@element-plus/hooks'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport type { Placement } from '@element-plus/components/popper'\n\nimport type { WritableComputedRef, PropType } from 'vue'\nimport type { TableColumnCtx } from './table-column/defaults'\nimport type { TableHeader } from './table-header'\nimport type { Store } from './store'\n\nconst { CheckboxGroup: ElCheckboxGroup } = ElCheckbox\n\nexport default defineComponent({\n  name: 'ElTableFilterPanel',\n  components: {\n    ElCheckbox,\n    ElCheckboxGroup,\n    ElScrollbar,\n    ElTooltip,\n    ElIcon,\n    ArrowDown,\n    ArrowUp,\n  },\n  directives: { ClickOutside },\n  props: {\n    placement: {\n      type: String as PropType<Placement>,\n      default: 'bottom-start',\n    },\n    store: {\n      type: Object as PropType<Store<unknown>>,\n    },\n    column: {\n      type: Object as PropType<TableColumnCtx<unknown>>,\n    },\n    upDataColumn: {\n      type: Function,\n    },\n  },\n  setup(props) {\n    const instance = getCurrentInstance()\n    const { t } = useLocale()\n    const parent = instance.parent as TableHeader\n    if (!parent.filterPanels.value[props.column.id]) {\n      parent.filterPanels.value[props.column.id] = instance\n    }\n    const tooltipVisible = ref(false)\n    const tooltip = ref<InstanceType<typeof ElTooltip> | null>(null)\n    const filters = computed(() => {\n      return props.column && props.column.filters\n    })\n    const filterValue = computed({\n      get: () => (props.column.filteredValue || [])[0],\n      set: (value: string) => {\n        if (filteredValue.value) {\n          if (typeof value !== 'undefined' && value !== null) {\n            filteredValue.value.splice(0, 1, value)\n          } else {\n            filteredValue.value.splice(0, 1)\n          }\n        }\n      },\n    })\n    const filteredValue: WritableComputedRef<unknown[]> = computed({\n      get() {\n        if (props.column) {\n          return props.column.filteredValue || []\n        }\n        return []\n      },\n      set(value: unknown[]) {\n        if (props.column) {\n          props.upDataColumn('filteredValue', value)\n        }\n      },\n    })\n    const multiple = computed(() => {\n      if (props.column) {\n        return props.column.filterMultiple\n      }\n      return true\n    })\n    const isActive = (filter) => {\n      return filter.value === filterValue.value\n    }\n    const hidden = () => {\n      tooltipVisible.value = false\n    }\n    const showFilterPanel = (e: MouseEvent) => {\n      e.stopPropagation()\n      tooltipVisible.value = !tooltipVisible.value\n    }\n    const hideFilterPanel = () => {\n      tooltipVisible.value = false\n    }\n    const handleConfirm = () => {\n      confirmFilter(filteredValue.value)\n      hidden()\n    }\n    const handleReset = () => {\n      filteredValue.value = []\n      confirmFilter(filteredValue.value)\n      hidden()\n    }\n    const handleSelect = (_filterValue?: string) => {\n      filterValue.value = _filterValue\n      if (typeof _filterValue !== 'undefined' && _filterValue !== null) {\n        confirmFilter(filteredValue.value)\n      } else {\n        confirmFilter([])\n      }\n      hidden()\n    }\n    const confirmFilter = (filteredValue: unknown[]) => {\n      props.store.commit('filterChange', {\n        column: props.column,\n        values: filteredValue,\n      })\n      props.store.updateAllSelected()\n    }\n    watch(\n      tooltipVisible,\n      (value) => {\n        // todo\n        if (props.column) {\n          props.upDataColumn('filterOpened', value)\n        }\n      },\n      {\n        immediate: true,\n      }\n    )\n\n    const popperPaneRef = computed(() => {\n      return tooltip.value?.popperRef?.contentRef\n    })\n\n    return {\n      tooltipVisible,\n      multiple,\n      filteredValue,\n      filterValue,\n      filters,\n      handleConfirm,\n      handleReset,\n      handleSelect,\n      isActive,\n      t,\n      showFilterPanel,\n      hideFilterPanel,\n      popperPaneRef,\n      tooltip,\n    }\n  },\n})\n</script>\n"],"names":["_openBlock"],"mappings":";;;;qBAgBa,KAAK,EAAC;;;;;EA8BF;;;;;;;;;;;;;;wBA7Cf;IACE;IACQ,SAAS;;IAChB;IACA;IACA;IACA;IACD;IACA;;IAEA;;;qBAIE;;;;kEAE4B;;;;;oBAGpB,OAAMA;;;;6CAEN;;;;;;;;;;;;;;;;;YAUN;;;;gBAII;iEACQ;iCAEL;;;;iCAGA;;;yBAIT;;kBAEU;;;;;;mCAQR;gBAEG;;;;;;;;;;;;;;;;;;;;;;;;"}