@element-plus/nightly 0.0.20251124 → 0.0.20251125

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

@@ -1,143 +1,15 @@
-import { defineComponent, inject, ref, computed, onBeforeUnmount, toRef, openBlock, createBlock, Transition, unref, withCtx, withDirectives, createElementVNode, normalizeClass, withModifiers, normalizeStyle, vShow } from 'vue';
-import { useEventListener, isClient } from '@vueuse/core';
-import { scrollbarContextKey } from './constants.mjs';
-import { BAR_MAP, renderThumbStyle } from './util.mjs';
-import { thumbProps } from './thumb.mjs';
-import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
-import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
-import { throwError } from '../../../utils/error.mjs';
+import { buildProps } from '../../../utils/vue/props/runtime.mjs';
 
-const COMPONENT_NAME = "Thumb";
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "thumb",
-  props: thumbProps,
-  setup(__props) {
-    const props = __props;
-    const scrollbar = inject(scrollbarContextKey);
-    const ns = useNamespace("scrollbar");
-    if (!scrollbar)
-      throwError(COMPONENT_NAME, "can not inject scrollbar context");
-    const instance = ref();
-    const thumb = ref();
-    const thumbState = ref({});
-    const visible = ref(false);
-    let cursorDown = false;
-    let cursorLeave = false;
-    let baseScrollHeight = 0;
-    let baseScrollWidth = 0;
-    let originalOnSelectStart = isClient ? document.onselectstart : null;
-    const bar = computed(() => BAR_MAP[props.vertical ? "vertical" : "horizontal"]);
-    const thumbStyle = computed(() => renderThumbStyle({
-      size: props.size,
-      move: props.move,
-      bar: bar.value
-    }));
-    const offsetRatio = computed(() => instance.value[bar.value.offset] ** 2 / scrollbar.wrapElement[bar.value.scrollSize] / props.ratio / thumb.value[bar.value.offset]);
-    const clickThumbHandler = (e) => {
-      var _a;
-      e.stopPropagation();
-      if (e.ctrlKey || [1, 2].includes(e.button))
-        return;
-      (_a = window.getSelection()) == null ? void 0 : _a.removeAllRanges();
-      startDrag(e);
-      const el = e.currentTarget;
-      if (!el)
-        return;
-      thumbState.value[bar.value.axis] = el[bar.value.offset] - (e[bar.value.client] - el.getBoundingClientRect()[bar.value.direction]);
-    };
-    const clickTrackHandler = (e) => {
-      if (!thumb.value || !instance.value || !scrollbar.wrapElement)
-        return;
-      const offset = Math.abs(e.target.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]);
-      const thumbHalf = thumb.value[bar.value.offset] / 2;
-      const thumbPositionPercentage = (offset - thumbHalf) * 100 * offsetRatio.value / instance.value[bar.value.offset];
-      scrollbar.wrapElement[bar.value.scroll] = thumbPositionPercentage * scrollbar.wrapElement[bar.value.scrollSize] / 100;
-    };
-    const startDrag = (e) => {
-      e.stopImmediatePropagation();
-      cursorDown = true;
-      baseScrollHeight = scrollbar.wrapElement.scrollHeight;
-      baseScrollWidth = scrollbar.wrapElement.scrollWidth;
-      document.addEventListener("mousemove", mouseMoveDocumentHandler);
-      document.addEventListener("mouseup", mouseUpDocumentHandler);
-      originalOnSelectStart = document.onselectstart;
-      document.onselectstart = () => false;
-    };
-    const mouseMoveDocumentHandler = (e) => {
-      if (!instance.value || !thumb.value)
-        return;
-      if (cursorDown === false)
-        return;
-      const prevPage = thumbState.value[bar.value.axis];
-      if (!prevPage)
-        return;
-      const offset = (instance.value.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]) * -1;
-      const thumbClickPosition = thumb.value[bar.value.offset] - prevPage;
-      const thumbPositionPercentage = (offset - thumbClickPosition) * 100 * offsetRatio.value / instance.value[bar.value.offset];
-      if (bar.value.scroll === "scrollLeft") {
-        scrollbar.wrapElement[bar.value.scroll] = thumbPositionPercentage * baseScrollWidth / 100;
-      } else {
-        scrollbar.wrapElement[bar.value.scroll] = thumbPositionPercentage * baseScrollHeight / 100;
-      }
-    };
-    const mouseUpDocumentHandler = () => {
-      cursorDown = false;
-      thumbState.value[bar.value.axis] = 0;
-      document.removeEventListener("mousemove", mouseMoveDocumentHandler);
-      document.removeEventListener("mouseup", mouseUpDocumentHandler);
-      restoreOnselectstart();
-      if (cursorLeave)
-        visible.value = false;
-    };
-    const mouseMoveScrollbarHandler = () => {
-      cursorLeave = false;
-      visible.value = !!props.size;
-    };
-    const mouseLeaveScrollbarHandler = () => {
-      cursorLeave = true;
-      visible.value = cursorDown;
-    };
-    onBeforeUnmount(() => {
-      restoreOnselectstart();
-      document.removeEventListener("mouseup", mouseUpDocumentHandler);
-    });
-    const restoreOnselectstart = () => {
-      if (document.onselectstart !== originalOnSelectStart)
-        document.onselectstart = originalOnSelectStart;
-    };
-    useEventListener(toRef(scrollbar, "scrollbarElement"), "mousemove", mouseMoveScrollbarHandler);
-    useEventListener(toRef(scrollbar, "scrollbarElement"), "mouseleave", mouseLeaveScrollbarHandler);
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(Transition, {
-        name: unref(ns).b("fade"),
-        persisted: ""
-      }, {
-        default: withCtx(() => [
-          withDirectives(createElementVNode("div", {
-            ref_key: "instance",
-            ref: instance,
-            class: normalizeClass([unref(ns).e("bar"), unref(ns).is(unref(bar).key)]),
-            onMousedown: clickTrackHandler,
-            onClick: withModifiers(() => {
-            }, ["stop"])
-          }, [
-            createElementVNode("div", {
-              ref_key: "thumb",
-              ref: thumb,
-              class: normalizeClass(unref(ns).e("thumb")),
-              style: normalizeStyle(unref(thumbStyle)),
-              onMousedown: clickThumbHandler
-            }, null, 38)
-          ], 42, ["onClick"]), [
-            [vShow, _ctx.always || visible.value]
-          ])
-        ]),
-        _: 1
-      }, 8, ["name"]);
-    };
-  }
+const thumbProps = buildProps({
+  vertical: Boolean,
+  size: String,
+  move: Number,
+  ratio: {
+    type: Number,
+    required: true
+  },
+  always: Boolean
 });
-var Thumb = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "thumb.vue"]]);
 
-export { Thumb as default };
+export { thumbProps };
 //# sourceMappingURL=thumb2.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"thumb2.mjs","sources":["../../../../../../packages/components/scrollbar/src/thumb.vue"],"sourcesContent":["<template>\n  <transition :name=\"ns.b('fade')\">\n    <div\n      v-show=\"always || visible\"\n      ref=\"instance\"\n      :class=\"[ns.e('bar'), ns.is(bar.key)]\"\n      @mousedown=\"clickTrackHandler\"\n      @click.stop\n    >\n      <div\n        ref=\"thumb\"\n        :class=\"ns.e('thumb')\"\n        :style=\"thumbStyle\"\n        @mousedown=\"clickThumbHandler\"\n      />\n    </div>\n  </transition>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, onBeforeUnmount, ref, toRef } from 'vue'\nimport { useEventListener } from '@vueuse/core'\nimport { isClient, throwError } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { scrollbarContextKey } from './constants'\nimport { BAR_MAP, renderThumbStyle } from './util'\nimport { thumbProps } from './thumb'\n\nconst COMPONENT_NAME = 'Thumb'\nconst props = defineProps(thumbProps)\n\nconst scrollbar = inject(scrollbarContextKey)\nconst ns = useNamespace('scrollbar')\n\nif (!scrollbar) throwError(COMPONENT_NAME, 'can not inject scrollbar context')\n\nconst instance = ref<HTMLDivElement>()\nconst thumb = ref<HTMLDivElement>()\n\nconst thumbState = ref<Partial<Record<'X' | 'Y', number>>>({})\nconst visible = ref(false)\n\nlet cursorDown = false\nlet cursorLeave = false\nlet baseScrollHeight = 0\nlet baseScrollWidth = 0\nlet originalOnSelectStart:\n  | ((this: GlobalEventHandlers, ev: Event) => any)\n  | null = isClient ? document.onselectstart : null\n\nconst bar = computed(() => BAR_MAP[props.vertical ? 'vertical' : 'horizontal'])\n\nconst thumbStyle = computed(() =>\n  renderThumbStyle({\n    size: props.size,\n    move: props.move,\n    bar: bar.value,\n  })\n)\n\nconst offsetRatio = computed(\n  () =>\n    // offsetRatioX = original width of thumb / current width of thumb / ratioX\n    // offsetRatioY = original height of thumb / current height of thumb / ratioY\n    // instance height = wrap height - GAP\n    instance.value![bar.value.offset] ** 2 /\n    scrollbar.wrapElement![bar.value.scrollSize] /\n    props.ratio /\n    thumb.value![bar.value.offset]\n)\n\nconst clickThumbHandler = (e: MouseEvent) => {\n  // prevent click event of middle and right button\n  e.stopPropagation()\n  if (e.ctrlKey || [1, 2].includes(e.button)) return\n\n  window.getSelection()?.removeAllRanges()\n  startDrag(e)\n\n  const el = e.currentTarget as HTMLDivElement\n  if (!el) return\n  thumbState.value[bar.value.axis] =\n    el[bar.value.offset] -\n    (e[bar.value.client] - el.getBoundingClientRect()[bar.value.direction])\n}\n\nconst clickTrackHandler = (e: MouseEvent) => {\n  if (!thumb.value || !instance.value || !scrollbar.wrapElement) return\n\n  const offset = Math.abs(\n    (e.target as HTMLElement).getBoundingClientRect()[bar.value.direction] -\n      e[bar.value.client]\n  )\n  const thumbHalf = thumb.value[bar.value.offset] / 2\n  const thumbPositionPercentage =\n    ((offset - thumbHalf) * 100 * offsetRatio.value) /\n    instance.value[bar.value.offset]\n\n  scrollbar.wrapElement[bar.value.scroll] =\n    (thumbPositionPercentage * scrollbar.wrapElement[bar.value.scrollSize]) /\n    100\n}\n\nconst startDrag = (e: MouseEvent) => {\n  e.stopImmediatePropagation()\n  cursorDown = true\n  baseScrollHeight = scrollbar.wrapElement.scrollHeight\n  baseScrollWidth = scrollbar.wrapElement.scrollWidth\n  document.addEventListener('mousemove', mouseMoveDocumentHandler)\n  document.addEventListener('mouseup', mouseUpDocumentHandler)\n  originalOnSelectStart = document.onselectstart\n  document.onselectstart = () => false\n}\n\nconst mouseMoveDocumentHandler = (e: MouseEvent) => {\n  if (!instance.value || !thumb.value) return\n  if (cursorDown === false) return\n\n  const prevPage = thumbState.value[bar.value.axis]\n  if (!prevPage) return\n\n  const offset =\n    (instance.value.getBoundingClientRect()[bar.value.direction] -\n      e[bar.value.client]) *\n    -1\n  const thumbClickPosition = thumb.value[bar.value.offset] - prevPage\n  const thumbPositionPercentage =\n    ((offset - thumbClickPosition) * 100 * offsetRatio.value) /\n    instance.value[bar.value.offset]\n\n  if (bar.value.scroll === 'scrollLeft') {\n    scrollbar.wrapElement[bar.value.scroll] =\n      (thumbPositionPercentage * baseScrollWidth) / 100\n  } else {\n    scrollbar.wrapElement[bar.value.scroll] =\n      (thumbPositionPercentage * baseScrollHeight) / 100\n  }\n}\n\nconst mouseUpDocumentHandler = () => {\n  cursorDown = false\n  thumbState.value[bar.value.axis] = 0\n  document.removeEventListener('mousemove', mouseMoveDocumentHandler)\n  document.removeEventListener('mouseup', mouseUpDocumentHandler)\n  restoreOnselectstart()\n  if (cursorLeave) visible.value = false\n}\n\nconst mouseMoveScrollbarHandler = () => {\n  cursorLeave = false\n  visible.value = !!props.size\n}\n\nconst mouseLeaveScrollbarHandler = () => {\n  cursorLeave = true\n  visible.value = cursorDown\n}\n\nonBeforeUnmount(() => {\n  restoreOnselectstart()\n  document.removeEventListener('mouseup', mouseUpDocumentHandler)\n})\n\nconst restoreOnselectstart = () => {\n  if (document.onselectstart !== originalOnSelectStart)\n    document.onselectstart = originalOnSelectStart\n}\n\nuseEventListener(\n  toRef(scrollbar, 'scrollbarElement'),\n  'mousemove',\n  mouseMoveScrollbarHandler\n)\nuseEventListener(\n  toRef(scrollbar, 'scrollbarElement'),\n  'mouseleave',\n  mouseLeaveScrollbarHandler\n)\n</script>\n"],"names":["_createBlock","_Transition","_unref","_withCtx","_withDirectives","_createElementVNode","_normalizeClass"],"mappings":"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"}
+{"version":3,"file":"thumb2.mjs","sources":["../../../../../../packages/components/scrollbar/src/thumb.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\n\nimport type { ExtractPropTypes, __ExtractPublicPropTypes } from 'vue'\nimport type Thumb from './thumb.vue'\n\nexport const thumbProps = buildProps({\n  vertical: Boolean,\n  size: String,\n  move: Number,\n  ratio: {\n    type: Number,\n    required: true,\n  },\n  always: Boolean,\n} as const)\nexport type ThumbProps = ExtractPropTypes<typeof thumbProps>\nexport type ThumbPropsPublic = __ExtractPublicPropTypes<typeof thumbProps>\n\nexport type ThumbInstance = InstanceType<typeof Thumb> & unknown\n"],"names":[],"mappings":";;AACY,MAAC,UAAU,GAAG,UAAU,CAAC;AACrC,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,QAAQ,EAAE,IAAI;AAClB,GAAG;AACH,EAAE,MAAM,EAAE,OAAO;AACjB,CAAC;;;;"}

package/es/components/segmented/src/segmented2.mjs

@@ -37,10 +37,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       translateY: 0,
       focusVisible: false
     });
-    const handleChange = (item) => {
+    const handleChange = (evt, item) => {
       const value = getValue(item);
       emit(UPDATE_MODEL_EVENT, value);
       emit(CHANGE_EVENT, value);
+      evt.target.checked = value === props.modelValue;
     };
     const aliasProps = computed(() => ({ ...defaultProps, ...props.props }));
     const intoAny = (item) => item;
@@ -151,7 +152,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 name: unref(name),
                 disabled: getDisabled(item),
                 checked: getSelected(item),
-                onChange: ($event) => handleChange(item)
+                onChange: ($event) => handleChange($event, item)
               }, null, 42, ["name", "disabled", "checked", "onChange"]),
               createElementVNode("div", {
                 class: normalizeClass(unref(ns).e("item-label"))

package/es/components/segmented/src/segmented2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"segmented2.mjs","sources":["../../../../../../packages/components/segmented/src/segmented.vue"],"sourcesContent":["<template>\n  <div\n    v-if=\"options.length\"\n    :id=\"inputId\"\n    ref=\"segmentedRef\"\n    :class=\"segmentedCls\"\n    role=\"radiogroup\"\n    :aria-label=\"!isLabeledByFormItem ? ariaLabel || 'segmented' : undefined\"\n    :aria-labelledby=\"isLabeledByFormItem ? formItem!.labelId : undefined\"\n  >\n    <div :class=\"[ns.e('group'), ns.m(direction)]\">\n      <div :style=\"selectedStyle\" :class=\"selectedCls\" />\n      <label\n        v-for=\"(item, index) in options\"\n        :key=\"index\"\n        :class=\"getItemCls(item)\"\n      >\n        <input\n          :class=\"ns.e('item-input')\"\n          type=\"radio\"\n          :name=\"name\"\n          :disabled=\"getDisabled(item)\"\n          :checked=\"getSelected(item)\"\n          @change=\"handleChange(item)\"\n        />\n        <div :class=\"ns.e('item-label')\">\n          <slot :item=\"intoAny(item)\">{{ getLabel(item) }}</slot>\n        </div>\n      </label>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, reactive, ref, watch } from 'vue'\nimport { useActiveElement, useResizeObserver } from '@vueuse/core'\nimport { useId, useNamespace } from '@element-plus/hooks'\nimport {\n  useFormDisabled,\n  useFormItem,\n  useFormItemInputId,\n  useFormSize,\n} from '@element-plus/components/form'\nimport { debugWarn, isObject } from '@element-plus/utils'\nimport { CHANGE_EVENT, UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport { defaultProps, segmentedEmits, segmentedProps } from './segmented'\n\nimport type { Option } from './types'\n\ndefineOptions({\n  name: 'ElSegmented',\n})\n\nconst props = defineProps(segmentedProps)\nconst emit = defineEmits(segmentedEmits)\n\nconst ns = useNamespace('segmented')\nconst segmentedId = useId()\nconst segmentedSize = useFormSize()\nconst _disabled = useFormDisabled()\nconst { formItem } = useFormItem()\nconst { inputId, isLabeledByFormItem } = useFormItemInputId(props, {\n  formItemContext: formItem,\n})\n\nconst segmentedRef = ref<HTMLElement | null>(null)\nconst activeElement = useActiveElement()\n\nconst state = reactive({\n  isInit: false,\n  width: 0,\n  height: 0,\n  translateX: 0,\n  translateY: 0,\n  focusVisible: false,\n})\n\nconst handleChange = (item: Option) => {\n  const value = getValue(item)\n  emit(UPDATE_MODEL_EVENT, value)\n  emit(CHANGE_EVENT, value)\n}\n\nconst aliasProps = computed(() => ({ ...defaultProps, ...props.props }))\n\n//FIXME: remove this when vue >=3.3\nconst intoAny = (item: any) => item\n\nconst getValue = (item: Option) => {\n  return isObject(item) ? item[aliasProps.value.value] : item\n}\n\nconst getLabel = (item: Option) => {\n  return isObject(item) ? item[aliasProps.value.label] : item\n}\n\nconst getDisabled = (item: Option | undefined) => {\n  return !!(\n    _disabled.value ||\n    (isObject(item) ? item[aliasProps.value.disabled] : false)\n  )\n}\n\nconst getSelected = (item: Option) => {\n  return props.modelValue === getValue(item)\n}\n\nconst getOption = (value: any) => {\n  return props.options.find((item) => getValue(item) === value)\n}\n\nconst getItemCls = (item: Option) => {\n  return [\n    ns.e('item'),\n    ns.is('selected', getSelected(item)),\n    ns.is('disabled', getDisabled(item)),\n  ]\n}\n\nconst updateSelect = () => {\n  if (!segmentedRef.value) return\n  const selectedItem = segmentedRef.value.querySelector(\n    '.is-selected'\n  ) as HTMLElement\n  const selectedItemInput = segmentedRef.value.querySelector(\n    '.is-selected input'\n  ) as HTMLElement\n  if (!selectedItem || !selectedItemInput) {\n    state.width = 0\n    state.height = 0\n    state.translateX = 0\n    state.translateY = 0\n    state.focusVisible = false\n    return\n  }\n  state.isInit = true\n  if (props.direction === 'vertical') {\n    state.height = selectedItem.offsetHeight\n    state.translateY = selectedItem.offsetTop\n  } else {\n    state.width = selectedItem.offsetWidth\n    state.translateX = selectedItem.offsetLeft\n  }\n  try {\n    // This will failed in test\n    state.focusVisible = selectedItemInput.matches(':focus-visible')\n  } catch {}\n}\n\nconst segmentedCls = computed(() => [\n  ns.b(),\n  ns.m(segmentedSize.value),\n  ns.is('block', props.block),\n])\n\nconst selectedStyle = computed(() => ({\n  width: props.direction === 'vertical' ? '100%' : `${state.width}px`,\n  height: props.direction === 'vertical' ? `${state.height}px` : '100%',\n  transform:\n    props.direction === 'vertical'\n      ? `translateY(${state.translateY}px)`\n      : `translateX(${state.translateX}px)`,\n  display: state.isInit ? 'block' : 'none',\n}))\n\nconst selectedCls = computed(() => [\n  ns.e('item-selected'),\n  ns.is('disabled', getDisabled(getOption(props.modelValue))),\n  ns.is('focus-visible', state.focusVisible),\n])\n\nconst name = computed(() => {\n  return props.name || segmentedId.value\n})\n\nuseResizeObserver(segmentedRef, updateSelect)\n\nwatch(activeElement, updateSelect)\n\nwatch(\n  () => props.modelValue,\n  () => {\n    updateSelect()\n    if (props.validateEvent) {\n      formItem?.validate?.('change').catch((err) => debugWarn(err))\n    }\n  },\n  {\n    flush: 'post',\n  }\n)\n</script>\n"],"names":["_openBlock","_createElementBlock","_unref"],"mappings":"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"}
+{"version":3,"file":"segmented2.mjs","sources":["../../../../../../packages/components/segmented/src/segmented.vue"],"sourcesContent":["<template>\n  <div\n    v-if=\"options.length\"\n    :id=\"inputId\"\n    ref=\"segmentedRef\"\n    :class=\"segmentedCls\"\n    role=\"radiogroup\"\n    :aria-label=\"!isLabeledByFormItem ? ariaLabel || 'segmented' : undefined\"\n    :aria-labelledby=\"isLabeledByFormItem ? formItem!.labelId : undefined\"\n  >\n    <div :class=\"[ns.e('group'), ns.m(direction)]\">\n      <div :style=\"selectedStyle\" :class=\"selectedCls\" />\n      <label\n        v-for=\"(item, index) in options\"\n        :key=\"index\"\n        :class=\"getItemCls(item)\"\n      >\n        <input\n          :class=\"ns.e('item-input')\"\n          type=\"radio\"\n          :name=\"name\"\n          :disabled=\"getDisabled(item)\"\n          :checked=\"getSelected(item)\"\n          @change=\"handleChange($event, item)\"\n        />\n        <div :class=\"ns.e('item-label')\">\n          <slot :item=\"intoAny(item)\">{{ getLabel(item) }}</slot>\n        </div>\n      </label>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, reactive, ref, watch } from 'vue'\nimport { useActiveElement, useResizeObserver } from '@vueuse/core'\nimport { useId, useNamespace } from '@element-plus/hooks'\nimport {\n  useFormDisabled,\n  useFormItem,\n  useFormItemInputId,\n  useFormSize,\n} from '@element-plus/components/form'\nimport { debugWarn, isObject } from '@element-plus/utils'\nimport { CHANGE_EVENT, UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport { defaultProps, segmentedEmits, segmentedProps } from './segmented'\n\nimport type { Option } from './types'\n\ndefineOptions({\n  name: 'ElSegmented',\n})\n\nconst props = defineProps(segmentedProps)\nconst emit = defineEmits(segmentedEmits)\n\nconst ns = useNamespace('segmented')\nconst segmentedId = useId()\nconst segmentedSize = useFormSize()\nconst _disabled = useFormDisabled()\nconst { formItem } = useFormItem()\nconst { inputId, isLabeledByFormItem } = useFormItemInputId(props, {\n  formItemContext: formItem,\n})\n\nconst segmentedRef = ref<HTMLElement | null>(null)\nconst activeElement = useActiveElement()\n\nconst state = reactive({\n  isInit: false,\n  width: 0,\n  height: 0,\n  translateX: 0,\n  translateY: 0,\n  focusVisible: false,\n})\n\nconst handleChange = (evt: Event, item: Option) => {\n  const value = getValue(item)\n  emit(UPDATE_MODEL_EVENT, value)\n  emit(CHANGE_EVENT, value)\n  ;(evt.target as HTMLInputElement).checked = value === props.modelValue\n}\n\nconst aliasProps = computed(() => ({ ...defaultProps, ...props.props }))\n\n//FIXME: remove this when vue >=3.3\nconst intoAny = (item: any) => item\n\nconst getValue = (item: Option) => {\n  return isObject(item) ? item[aliasProps.value.value] : item\n}\n\nconst getLabel = (item: Option) => {\n  return isObject(item) ? item[aliasProps.value.label] : item\n}\n\nconst getDisabled = (item: Option | undefined) => {\n  return !!(\n    _disabled.value ||\n    (isObject(item) ? item[aliasProps.value.disabled] : false)\n  )\n}\n\nconst getSelected = (item: Option) => {\n  return props.modelValue === getValue(item)\n}\n\nconst getOption = (value: any) => {\n  return props.options.find((item) => getValue(item) === value)\n}\n\nconst getItemCls = (item: Option) => {\n  return [\n    ns.e('item'),\n    ns.is('selected', getSelected(item)),\n    ns.is('disabled', getDisabled(item)),\n  ]\n}\n\nconst updateSelect = () => {\n  if (!segmentedRef.value) return\n  const selectedItem = segmentedRef.value.querySelector(\n    '.is-selected'\n  ) as HTMLElement\n  const selectedItemInput = segmentedRef.value.querySelector(\n    '.is-selected input'\n  ) as HTMLElement\n  if (!selectedItem || !selectedItemInput) {\n    state.width = 0\n    state.height = 0\n    state.translateX = 0\n    state.translateY = 0\n    state.focusVisible = false\n    return\n  }\n  state.isInit = true\n  if (props.direction === 'vertical') {\n    state.height = selectedItem.offsetHeight\n    state.translateY = selectedItem.offsetTop\n  } else {\n    state.width = selectedItem.offsetWidth\n    state.translateX = selectedItem.offsetLeft\n  }\n  try {\n    // This will failed in test\n    state.focusVisible = selectedItemInput.matches(':focus-visible')\n  } catch {}\n}\n\nconst segmentedCls = computed(() => [\n  ns.b(),\n  ns.m(segmentedSize.value),\n  ns.is('block', props.block),\n])\n\nconst selectedStyle = computed(() => ({\n  width: props.direction === 'vertical' ? '100%' : `${state.width}px`,\n  height: props.direction === 'vertical' ? `${state.height}px` : '100%',\n  transform:\n    props.direction === 'vertical'\n      ? `translateY(${state.translateY}px)`\n      : `translateX(${state.translateX}px)`,\n  display: state.isInit ? 'block' : 'none',\n}))\n\nconst selectedCls = computed(() => [\n  ns.e('item-selected'),\n  ns.is('disabled', getDisabled(getOption(props.modelValue))),\n  ns.is('focus-visible', state.focusVisible),\n])\n\nconst name = computed(() => {\n  return props.name || segmentedId.value\n})\n\nuseResizeObserver(segmentedRef, updateSelect)\n\nwatch(activeElement, updateSelect)\n\nwatch(\n  () => props.modelValue,\n  () => {\n    updateSelect()\n    if (props.validateEvent) {\n      formItem?.validate?.('change').catch((err) => debugWarn(err))\n    }\n  },\n  {\n    flush: 'post',\n  }\n)\n</script>\n"],"names":["_openBlock","_createElementBlock","_unref"],"mappings":"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"}

package/es/components/select-v2/src/defaults.d.ts

@@ -194,6 +194,7 @@ export declare const selectV2Props: {
     readonly scrollbarAlwaysOn: BooleanConstructor;
     readonly validateEvent: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
     readonly offset: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 12, boolean>;
+    readonly remoteShowSuffix: BooleanConstructor;
     readonly showArrow: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
     readonly placement: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => "left" | "right" | "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement) | ((new (...args: any[]) => "left" | "right" | "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => Placement))[], Placement, unknown, "bottom-start", boolean>;
     readonly fallbackPlacements: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => Placement[]) | (() => Placement[]) | ((new (...args: any[]) => Placement[]) | (() => Placement[]))[], unknown, unknown, readonly ["bottom-start", "top-start", "right", "left"], boolean>;

package/es/components/select-v2/src/defaults.mjs

@@ -114,6 +114,7 @@ const selectV2Props = buildProps({
     type: Number,
     default: 12
   },
+  remoteShowSuffix: Boolean,
   showArrow: {
     type: Boolean,
     default: true

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

@@ -1 +1 @@
-{"version":3,"file":"defaults.mjs","sources":["../../../../../../packages/components/select-v2/src/defaults.ts"],"sourcesContent":["import { placements } from '@popperjs/core'\nimport {\n  useAriaProps,\n  useEmptyValuesProps,\n  useSizeProp,\n} from '@element-plus/hooks'\nimport {\n  buildProps,\n  definePropType,\n  iconPropType,\n  isBoolean,\n  isNumber,\n} from '@element-plus/utils'\nimport { CHANGE_EVENT, UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport { useTooltipContentProps } from '@element-plus/components/tooltip'\nimport { ArrowDown, CircleClose } from '@element-plus/icons-vue'\nimport { tagProps } from '../../tag'\nimport { defaultProps } from './useProps'\n\nimport type SelectV2 from './select.vue'\nimport type { Option, OptionType } from './select.types'\nimport type { Props } from './useProps'\nimport type { EmitFn } from '@element-plus/utils/vue/typescript'\nimport type { ExtractPropTypes, __ExtractPublicPropTypes } from 'vue'\nimport type {\n  Options,\n  Placement,\n  PopperEffect,\n} from '@element-plus/components/popper'\n\nexport const selectV2Props = buildProps({\n  /**\n   * @description whether creating new items is allowed. To use this, `filterable` must be true\n   */\n  allowCreate: Boolean,\n  /**\n   * @description autocomplete of select input\n   */\n  autocomplete: {\n    type: definePropType<'none' | 'both' | 'list' | 'inline'>(String),\n    default: 'none',\n  },\n  /**\n   * @description for non-filterable Select, this prop decides if the option menu pops up when the input is focused\n   */\n  automaticDropdown: Boolean,\n  /**\n   * @description whether select can be cleared\n   */\n  clearable: Boolean,\n  /**\n   * @description custom clear icon\n   */\n  clearIcon: {\n    type: iconPropType,\n    default: CircleClose,\n  },\n  /**\n   * @description tooltip theme, built-in theme: `dark` / `light`\n   */\n  effect: {\n    type: definePropType<PopperEffect>(String),\n    default: 'light',\n  },\n  /**\n   * @description whether to collapse tags to a text when multiple selecting\n   */\n  collapseTags: Boolean,\n  /**\n   * @description whether show all selected tags when mouse hover text of collapse-tags. To use this, `collapse-tags` must be true\n   */\n  collapseTagsTooltip: Boolean,\n  /**\n   * @description The max tags number to be shown. To use this, `collapse-tags` must be true\n   */\n  maxCollapseTags: {\n    type: Number,\n    default: 1,\n  },\n  /**\n   * @description\n   */\n  defaultFirstOption: Boolean,\n  /**\n   * @description is disabled\n   */\n  disabled: Boolean,\n  /**\n   * @description\n   */\n  estimatedOptionHeight: {\n    type: Number,\n    default: undefined,\n  },\n  /**\n   * @description whether Select is filterable\n   */\n  filterable: Boolean,\n  /**\n   * @description custom filter method, the first parameter is the current input value. To use this, `filterable` must be true\n   */\n  filterMethod: {\n    type: definePropType<(query: string) => void>(Function),\n  },\n  /**\n   * @description The height of the dropdown panel, 34px for each item\n   */\n  height: {\n    type: Number,\n    default: 274, // same as select dropdown menu\n  },\n  /**\n   * @description The height of the dropdown item\n   */\n  itemHeight: {\n    type: Number,\n    default: 34,\n  },\n  /**\n   * @description native input id\n   */\n  id: String,\n  /**\n   * @description whether Select is loading data from server\n   */\n  loading: Boolean,\n  /**\n   * @description displayed text while loading data from server, default is 'Loading'\n   */\n  loadingText: String,\n  /**\n   * @description biding value\n   */\n  modelValue: {\n    type: definePropType<\n      any[] | string | number | boolean | Record<string, any> | any\n    >([Array, String, Number, Boolean, Object]),\n    default: undefined,\n  },\n  /**\n   * @description is multiple\n   */\n  multiple: Boolean,\n  /**\n   * @description maximum number of options user can select when multiple is true. No limit when set to 0\n   */\n  multipleLimit: {\n    type: Number,\n    default: 0,\n  },\n  /**\n   * @description the name attribute of select input\n   */\n  name: String,\n  /**\n   * @description displayed text when there is no options, you can also use slot empty, the default is 'No Data'\n   */\n  noDataText: String,\n  /**\n   * @description displayed text when no data matches the filtering query, you can also use slot `empty`, default is 'No matching data'\n   */\n  noMatchText: String,\n  /**\n   * @description function that gets called when the input value changes. Its parameter is the current input value. To use this, `filterable` must be true\n   */\n  remoteMethod: {\n    type: definePropType<(query: string) => void>(Function),\n  },\n  /**\n   * @description whether reserve the keyword after select filtered option.\n   */\n  reserveKeyword: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description data of the options, the key of `value` and `label` can be customize by `props`\n   */\n  options: {\n    type: definePropType<OptionType[]>(Array),\n    required: true,\n  },\n  /**\n   * @description placeholder, the default is 'Please select'\n   */\n  placeholder: {\n    type: String,\n  },\n  /**\n   * @description whether select dropdown is teleported, if `true` it will be teleported to where `append-to` sets\n   */\n  teleported: useTooltipContentProps.teleported,\n  /**\n   * @description when select dropdown is inactive and `persistent` is `false`, select dropdown will be destroyed\n   */\n  persistent: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description custom class name for Select's dropdown\n   */\n  popperClass: useTooltipContentProps.popperClass,\n  /**\n   * @description custom style for Select's dropdown\n   */\n  popperStyle: useTooltipContentProps.popperStyle,\n  /**\n   * @description [popper.js](https://popper.js.org/docs/v2/) parameters\n   */\n  popperOptions: {\n    type: definePropType<Partial<Options>>(Object),\n    default: () => ({}) as Partial<Options>,\n  },\n  /**\n   * @description whether search data from server\n   */\n  remote: Boolean,\n  /**\n   * @description debounce delay during remote search, in milliseconds\n   */\n  debounce: {\n    type: Number,\n    default: 300,\n  },\n  /**\n   * @description size of component\n   */\n  size: useSizeProp,\n  /**\n   * @description configuration options, see the following table\n   */\n  props: {\n    type: definePropType<Props>(Object),\n    default: () => defaultProps,\n  },\n  /**\n   * @description unique identity key name for value, required when value is an object\n   */\n  valueKey: {\n    type: String,\n    default: 'value',\n  },\n  /**\n   * @description Controls whether the scrollbar is always displayed\n   */\n  scrollbarAlwaysOn: Boolean,\n  /**\n   * @description whether to trigger form validation\n   */\n  validateEvent: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description offset of the dropdown\n   */\n  offset: {\n    type: Number,\n    default: 12,\n  },\n  /**\n   * @description Determines whether the arrow is displayed\n   */\n  showArrow: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description position of dropdown\n   */\n  placement: {\n    type: definePropType<Placement>(String),\n    values: placements,\n    default: 'bottom-start',\n  },\n  /**\n   * @description list of possible positions for dropdown\n   */\n  fallbackPlacements: {\n    type: definePropType<Placement[]>(Array),\n    default: ['bottom-start', 'top-start', 'right', 'left'],\n  },\n  /**\n   * @description tag type\n   */\n  tagType: { ...tagProps.type, default: 'info' },\n  /**\n   * @description tag effect\n   */\n  tagEffect: { ...tagProps.effect, default: 'light' },\n  /**\n   * @description tabindex for input\n   */\n  tabindex: {\n    type: [String, Number],\n    default: 0,\n  },\n  /**\n   * @description which element the select dropdown appends to\n   */\n  appendTo: useTooltipContentProps.appendTo,\n  /**\n   * @description if it is `true`, the width of the dropdown panel is the same as the input box.\n   * if it is `false`, the width is automatically calculated based on the value of `label`,\n   * or it can be set to a number to make it a fixed width\n   */\n  fitInputWidth: {\n    type: [Boolean, Number],\n    default: true,\n    validator(val) {\n      return isBoolean(val) || isNumber(val)\n    },\n  },\n  suffixIcon: {\n    type: iconPropType,\n    default: ArrowDown,\n  },\n  ...useEmptyValuesProps,\n  ...useAriaProps(['ariaLabel']),\n} as const)\n\nexport const optionV2Props = buildProps({\n  data: Array,\n  disabled: Boolean,\n  hovering: Boolean,\n  item: {\n    type: definePropType<Option>(Object),\n    required: true,\n  },\n  index: Number,\n  style: Object,\n  selected: Boolean,\n  created: Boolean,\n} as const)\n\n/* eslint-disable @typescript-eslint/no-unused-vars */\nexport const selectV2Emits = {\n  [UPDATE_MODEL_EVENT]: (val: SelectV2Props['modelValue']) => true,\n  [CHANGE_EVENT]: (val: SelectV2Props['modelValue']) => true,\n  'remove-tag': (val: unknown) => true,\n  'visible-change': (visible: boolean) => true,\n  focus: (evt: FocusEvent) => evt instanceof FocusEvent,\n  blur: (evt: FocusEvent) => evt instanceof FocusEvent,\n  clear: () => true,\n}\nexport const optionV2Emits = {\n  hover: (index?: number) => isNumber(index),\n  select: (val: Option, index?: number) => true,\n}\n/* eslint-enable @typescript-eslint/no-unused-vars */\n\nexport type SelectV2Props = ExtractPropTypes<typeof selectV2Props>\nexport type SelectV2PropsPublic = __ExtractPublicPropTypes<typeof selectV2Props>\nexport type OptionV2Props = ExtractPropTypes<typeof optionV2Props>\nexport type OptionV2PropsPublic = __ExtractPublicPropTypes<typeof optionV2Props>\nexport type SelectV2EmitFn = EmitFn<typeof selectV2Emits>\nexport type OptionV2EmitFn = EmitFn<typeof optionV2Emits>\n\nexport type SelectV2Instance = InstanceType<typeof SelectV2> & unknown\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"defaults.mjs","sources":["../../../../../../packages/components/select-v2/src/defaults.ts"],"sourcesContent":["import { placements } from '@popperjs/core'\nimport {\n  useAriaProps,\n  useEmptyValuesProps,\n  useSizeProp,\n} from '@element-plus/hooks'\nimport {\n  buildProps,\n  definePropType,\n  iconPropType,\n  isBoolean,\n  isNumber,\n} from '@element-plus/utils'\nimport { CHANGE_EVENT, UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport { useTooltipContentProps } from '@element-plus/components/tooltip'\nimport { ArrowDown, CircleClose } from '@element-plus/icons-vue'\nimport { tagProps } from '../../tag'\nimport { defaultProps } from './useProps'\n\nimport type SelectV2 from './select.vue'\nimport type { Option, OptionType } from './select.types'\nimport type { Props } from './useProps'\nimport type { EmitFn } from '@element-plus/utils/vue/typescript'\nimport type { ExtractPropTypes, __ExtractPublicPropTypes } from 'vue'\nimport type {\n  Options,\n  Placement,\n  PopperEffect,\n} from '@element-plus/components/popper'\n\nexport const selectV2Props = buildProps({\n  /**\n   * @description whether creating new items is allowed. To use this, `filterable` must be true\n   */\n  allowCreate: Boolean,\n  /**\n   * @description autocomplete of select input\n   */\n  autocomplete: {\n    type: definePropType<'none' | 'both' | 'list' | 'inline'>(String),\n    default: 'none',\n  },\n  /**\n   * @description for non-filterable Select, this prop decides if the option menu pops up when the input is focused\n   */\n  automaticDropdown: Boolean,\n  /**\n   * @description whether select can be cleared\n   */\n  clearable: Boolean,\n  /**\n   * @description custom clear icon\n   */\n  clearIcon: {\n    type: iconPropType,\n    default: CircleClose,\n  },\n  /**\n   * @description tooltip theme, built-in theme: `dark` / `light`\n   */\n  effect: {\n    type: definePropType<PopperEffect>(String),\n    default: 'light',\n  },\n  /**\n   * @description whether to collapse tags to a text when multiple selecting\n   */\n  collapseTags: Boolean,\n  /**\n   * @description whether show all selected tags when mouse hover text of collapse-tags. To use this, `collapse-tags` must be true\n   */\n  collapseTagsTooltip: Boolean,\n  /**\n   * @description The max tags number to be shown. To use this, `collapse-tags` must be true\n   */\n  maxCollapseTags: {\n    type: Number,\n    default: 1,\n  },\n  /**\n   * @description\n   */\n  defaultFirstOption: Boolean,\n  /**\n   * @description is disabled\n   */\n  disabled: Boolean,\n  /**\n   * @description\n   */\n  estimatedOptionHeight: {\n    type: Number,\n    default: undefined,\n  },\n  /**\n   * @description whether Select is filterable\n   */\n  filterable: Boolean,\n  /**\n   * @description custom filter method, the first parameter is the current input value. To use this, `filterable` must be true\n   */\n  filterMethod: {\n    type: definePropType<(query: string) => void>(Function),\n  },\n  /**\n   * @description The height of the dropdown panel, 34px for each item\n   */\n  height: {\n    type: Number,\n    default: 274, // same as select dropdown menu\n  },\n  /**\n   * @description The height of the dropdown item\n   */\n  itemHeight: {\n    type: Number,\n    default: 34,\n  },\n  /**\n   * @description native input id\n   */\n  id: String,\n  /**\n   * @description whether Select is loading data from server\n   */\n  loading: Boolean,\n  /**\n   * @description displayed text while loading data from server, default is 'Loading'\n   */\n  loadingText: String,\n  /**\n   * @description biding value\n   */\n  modelValue: {\n    type: definePropType<\n      any[] | string | number | boolean | Record<string, any> | any\n    >([Array, String, Number, Boolean, Object]),\n    default: undefined,\n  },\n  /**\n   * @description is multiple\n   */\n  multiple: Boolean,\n  /**\n   * @description maximum number of options user can select when multiple is true. No limit when set to 0\n   */\n  multipleLimit: {\n    type: Number,\n    default: 0,\n  },\n  /**\n   * @description the name attribute of select input\n   */\n  name: String,\n  /**\n   * @description displayed text when there is no options, you can also use slot empty, the default is 'No Data'\n   */\n  noDataText: String,\n  /**\n   * @description displayed text when no data matches the filtering query, you can also use slot `empty`, default is 'No matching data'\n   */\n  noMatchText: String,\n  /**\n   * @description function that gets called when the input value changes. Its parameter is the current input value. To use this, `filterable` must be true\n   */\n  remoteMethod: {\n    type: definePropType<(query: string) => void>(Function),\n  },\n  /**\n   * @description whether reserve the keyword after select filtered option.\n   */\n  reserveKeyword: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description data of the options, the key of `value` and `label` can be customize by `props`\n   */\n  options: {\n    type: definePropType<OptionType[]>(Array),\n    required: true,\n  },\n  /**\n   * @description placeholder, the default is 'Please select'\n   */\n  placeholder: {\n    type: String,\n  },\n  /**\n   * @description whether select dropdown is teleported, if `true` it will be teleported to where `append-to` sets\n   */\n  teleported: useTooltipContentProps.teleported,\n  /**\n   * @description when select dropdown is inactive and `persistent` is `false`, select dropdown will be destroyed\n   */\n  persistent: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description custom class name for Select's dropdown\n   */\n  popperClass: useTooltipContentProps.popperClass,\n  /**\n   * @description custom style for Select's dropdown\n   */\n  popperStyle: useTooltipContentProps.popperStyle,\n  /**\n   * @description [popper.js](https://popper.js.org/docs/v2/) parameters\n   */\n  popperOptions: {\n    type: definePropType<Partial<Options>>(Object),\n    default: () => ({}) as Partial<Options>,\n  },\n  /**\n   * @description whether search data from server\n   */\n  remote: Boolean,\n  /**\n   * @description debounce delay during remote search, in milliseconds\n   */\n  debounce: {\n    type: Number,\n    default: 300,\n  },\n  /**\n   * @description size of component\n   */\n  size: useSizeProp,\n  /**\n   * @description configuration options, see the following table\n   */\n  props: {\n    type: definePropType<Props>(Object),\n    default: () => defaultProps,\n  },\n  /**\n   * @description unique identity key name for value, required when value is an object\n   */\n  valueKey: {\n    type: String,\n    default: 'value',\n  },\n  /**\n   * @description Controls whether the scrollbar is always displayed\n   */\n  scrollbarAlwaysOn: Boolean,\n  /**\n   * @description whether to trigger form validation\n   */\n  validateEvent: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description offset of the dropdown\n   */\n  offset: {\n    type: Number,\n    default: 12,\n  },\n  /**\n   * @description in remote search method show suffix icon\n   */\n  remoteShowSuffix: Boolean,\n  /**\n   * @description Determines whether the arrow is displayed\n   */\n  showArrow: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description position of dropdown\n   */\n  placement: {\n    type: definePropType<Placement>(String),\n    values: placements,\n    default: 'bottom-start',\n  },\n  /**\n   * @description list of possible positions for dropdown\n   */\n  fallbackPlacements: {\n    type: definePropType<Placement[]>(Array),\n    default: ['bottom-start', 'top-start', 'right', 'left'],\n  },\n  /**\n   * @description tag type\n   */\n  tagType: { ...tagProps.type, default: 'info' },\n  /**\n   * @description tag effect\n   */\n  tagEffect: { ...tagProps.effect, default: 'light' },\n  /**\n   * @description tabindex for input\n   */\n  tabindex: {\n    type: [String, Number],\n    default: 0,\n  },\n  /**\n   * @description which element the select dropdown appends to\n   */\n  appendTo: useTooltipContentProps.appendTo,\n  /**\n   * @description if it is `true`, the width of the dropdown panel is the same as the input box.\n   * if it is `false`, the width is automatically calculated based on the value of `label`,\n   * or it can be set to a number to make it a fixed width\n   */\n  fitInputWidth: {\n    type: [Boolean, Number],\n    default: true,\n    validator(val) {\n      return isBoolean(val) || isNumber(val)\n    },\n  },\n  suffixIcon: {\n    type: iconPropType,\n    default: ArrowDown,\n  },\n  ...useEmptyValuesProps,\n  ...useAriaProps(['ariaLabel']),\n} as const)\n\nexport const optionV2Props = buildProps({\n  data: Array,\n  disabled: Boolean,\n  hovering: Boolean,\n  item: {\n    type: definePropType<Option>(Object),\n    required: true,\n  },\n  index: Number,\n  style: Object,\n  selected: Boolean,\n  created: Boolean,\n} as const)\n\n/* eslint-disable @typescript-eslint/no-unused-vars */\nexport const selectV2Emits = {\n  [UPDATE_MODEL_EVENT]: (val: SelectV2Props['modelValue']) => true,\n  [CHANGE_EVENT]: (val: SelectV2Props['modelValue']) => true,\n  'remove-tag': (val: unknown) => true,\n  'visible-change': (visible: boolean) => true,\n  focus: (evt: FocusEvent) => evt instanceof FocusEvent,\n  blur: (evt: FocusEvent) => evt instanceof FocusEvent,\n  clear: () => true,\n}\nexport const optionV2Emits = {\n  hover: (index?: number) => isNumber(index),\n  select: (val: Option, index?: number) => true,\n}\n/* eslint-enable @typescript-eslint/no-unused-vars */\n\nexport type SelectV2Props = ExtractPropTypes<typeof selectV2Props>\nexport type SelectV2PropsPublic = __ExtractPublicPropTypes<typeof selectV2Props>\nexport type OptionV2Props = ExtractPropTypes<typeof optionV2Props>\nexport type OptionV2PropsPublic = __ExtractPublicPropTypes<typeof optionV2Props>\nexport type SelectV2EmitFn = EmitFn<typeof selectV2Emits>\nexport type OptionV2EmitFn = EmitFn<typeof optionV2Emits>\n\nexport type SelectV2Instance = InstanceType<typeof SelectV2> & unknown\n"],"names":[],"mappings":"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"}

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

@@ -188,6 +188,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly scrollbarAlwaysOn: BooleanConstructor;
     readonly validateEvent: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
     readonly offset: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 12, boolean>;
+    readonly remoteShowSuffix: BooleanConstructor;
     readonly showArrow: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
     readonly placement: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => "left" | "right" | "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("element-plus").Placement) | ((new (...args: any[]) => "left" | "right" | "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("element-plus").Placement))[], import("element-plus").Placement, unknown, "bottom-start", boolean>;
     readonly fallbackPlacements: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => import("element-plus").Placement[]) | (() => import("element-plus").Placement[]) | ((new (...args: any[]) => import("element-plus").Placement[]) | (() => import("element-plus").Placement[]))[], unknown, unknown, readonly ["bottom-start", "top-start", "right", "left"], boolean>;
@@ -540,6 +541,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly scrollbarAlwaysOn: BooleanConstructor;
     readonly validateEvent: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
     readonly offset: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 12, boolean>;
+    readonly remoteShowSuffix: BooleanConstructor;
     readonly showArrow: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
     readonly placement: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => "left" | "right" | "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("element-plus").Placement) | ((new (...args: any[]) => "left" | "right" | "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("element-plus").Placement))[], import("element-plus").Placement, unknown, "bottom-start", boolean>;
     readonly fallbackPlacements: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => import("element-plus").Placement[]) | (() => import("element-plus").Placement[]) | ((new (...args: any[]) => import("element-plus").Placement[]) | (() => import("element-plus").Placement[]))[], unknown, unknown, readonly ["bottom-start", "top-start", "right", "left"], boolean>;
@@ -617,5 +619,6 @@ declare const _default: import("vue").DefineComponent<{
     readonly allowCreate: boolean;
     readonly defaultFirstOption: boolean;
     readonly remote: boolean;
+    readonly remoteShowSuffix: boolean;
 }>;
 export default _default;

package/es/components/select-v2/src/useSelect.mjs

@@ -108,7 +108,7 @@ const useSelect = (props, emit) => {
   const showClearBtn = computed(() => {
     return props.clearable && !selectDisabled.value && hasModelValue.value && (isFocused.value || states.inputHovering);
   });
-  const iconComponent = computed(() => props.remote && props.filterable ? "" : props.suffixIcon);
+  const iconComponent = computed(() => props.remote && props.filterable && !props.remoteShowSuffix ? "" : props.suffixIcon);
   const iconReverse = computed(() => iconComponent.value && nsSelect.is("reverse", expanded.value));
   const validateState = computed(() => (elFormItem == null ? void 0 : elFormItem.validateState) || "");
   const validateIcon = computed(() => {