@element-plus/nightly 0.0.20220106 → 0.0.20220107

package/lib/components/slider/src/index.vue_vue_type_template_id_24c42d04_lang.js

@@ -8,33 +8,18 @@ const _hoisted_1 = ["aria-valuemin", "aria-valuemax", "aria-orientation", "aria-
 const _hoisted_2 = { key: 1 };
 const _hoisted_3 = { class: "el-slider__marks" };
 function render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_el_input_number = vue.resolveComponent("el-input-number");
   const _component_slider_button = vue.resolveComponent("slider-button");
   const _component_slider_marker = vue.resolveComponent("slider-marker");
+  const _component_el_input_number = vue.resolveComponent("el-input-number");
   return vue.openBlock(), vue.createElementBlock("div", {
     ref: "sliderWrapper",
-    class: vue.normalizeClass(["el-slider", { "is-vertical": _ctx.vertical, "el-slider--with-input": _ctx.showInput }]),
+    class: vue.normalizeClass(_ctx.sliderKls),
     role: "slider",
     "aria-valuemin": _ctx.min,
     "aria-valuemax": _ctx.max,
     "aria-orientation": _ctx.vertical ? "vertical" : "horizontal",
     "aria-disabled": _ctx.sliderDisabled
   }, [
-    _ctx.showInput && !_ctx.range ? (vue.openBlock(), vue.createBlock(_component_el_input_number, {
-      key: 0,
-      ref: "input",
-      "model-value": _ctx.firstValue,
-      class: "el-slider__input",
-      step: _ctx.step,
-      disabled: _ctx.sliderDisabled,
-      controls: _ctx.showInputControls,
-      min: _ctx.min,
-      max: _ctx.max,
-      debounce: _ctx.debounce,
-      size: _ctx.inputSize,
-      "onUpdate:modelValue": _ctx.setFirstValue,
-      onChange: _ctx.emitChange
-    }, null, 8, ["model-value", "step", "disabled", "controls", "min", "max", "debounce", "size", "onUpdate:modelValue", "onChange"])) : vue.createCommentVNode("v-if", true),
     vue.createElementVNode("div", {
       ref: "slider",
       class: vue.normalizeClass(["el-slider__runway", { "show-input": _ctx.showInput && !_ctx.range, disabled: _ctx.sliderDisabled }]),
@@ -89,7 +74,22 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           }), 128))
         ])
       ], 64)) : vue.createCommentVNode("v-if", true)
-    ], 6)
+    ], 6),
+    _ctx.showInput && !_ctx.range ? (vue.openBlock(), vue.createBlock(_component_el_input_number, {
+      key: 0,
+      ref: "input",
+      "model-value": _ctx.firstValue,
+      class: "el-slider__input",
+      step: _ctx.step,
+      disabled: _ctx.sliderDisabled,
+      controls: _ctx.showInputControls,
+      min: _ctx.min,
+      max: _ctx.max,
+      debounce: _ctx.debounce,
+      size: _ctx.sliderInputSize,
+      "onUpdate:modelValue": _ctx.setFirstValue,
+      onChange: _ctx.emitChange
+    }, null, 8, ["model-value", "step", "disabled", "controls", "min", "max", "debounce", "size", "onUpdate:modelValue", "onChange"])) : vue.createCommentVNode("v-if", true)
   ], 10, _hoisted_1);
 }
 

package/lib/components/slider/src/index.vue_vue_type_template_id_24c42d04_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.vue_vue_type_template_id_24c42d04_lang.js","sources":["../../../../../../packages/components/slider/src/index.vue?vue&type=template&id=24c42d04&lang.js"],"sourcesContent":["<template>\n  <div\n    ref=\"sliderWrapper\"\n    class=\"el-slider\"\n    :class=\"{ 'is-vertical': vertical, 'el-slider--with-input': showInput }\"\n    role=\"slider\"\n    :aria-valuemin=\"min\"\n    :aria-valuemax=\"max\"\n    :aria-orientation=\"vertical ? 'vertical' : 'horizontal'\"\n    :aria-disabled=\"sliderDisabled\"\n  >\n    <el-input-number\n      v-if=\"showInput && !range\"\n      ref=\"input\"\n      :model-value=\"firstValue\"\n      class=\"el-slider__input\"\n      :step=\"step\"\n      :disabled=\"sliderDisabled\"\n      :controls=\"showInputControls\"\n      :min=\"min\"\n      :max=\"max\"\n      :debounce=\"debounce\"\n      :size=\"inputSize\"\n      @update:model-value=\"setFirstValue\"\n      @change=\"emitChange\"\n    />\n    <div\n      ref=\"slider\"\n      class=\"el-slider__runway\"\n      :class=\"{ 'show-input': showInput && !range, disabled: sliderDisabled }\"\n      :style=\"runwayStyle\"\n      @click=\"onSliderClick\"\n    >\n      <div class=\"el-slider__bar\" :style=\"barStyle\"></div>\n      <slider-button\n        ref=\"firstButton\"\n        :model-value=\"firstValue\"\n        :vertical=\"vertical\"\n        :tooltip-class=\"tooltipClass\"\n        @update:model-value=\"setFirstValue\"\n      />\n      <slider-button\n        v-if=\"range\"\n        ref=\"secondButton\"\n        :model-value=\"secondValue\"\n        :vertical=\"vertical\"\n        :tooltip-class=\"tooltipClass\"\n        @update:model-value=\"setSecondValue\"\n      />\n      <div v-if=\"showStops\">\n        <div\n          v-for=\"(item, key) in stops\"\n          :key=\"key\"\n          class=\"el-slider__stop\"\n          :style=\"getStopStyle(item)\"\n        ></div>\n      </div>\n      <template v-if=\"markList.length > 0\">\n        <div>\n          <div\n            v-for=\"(item, key) in markList\"\n            :key=\"key\"\n            :style=\"getStopStyle(item.position)\"\n            class=\"el-slider__stop el-slider__marks-stop\"\n          ></div>\n        </div>\n        <div class=\"el-slider__marks\">\n          <slider-marker\n            v-for=\"(item, key) in markList\"\n            :key=\"key\"\n            :mark=\"item.mark\"\n            :style=\"getStopStyle(item.position)\"\n          />\n        </div>\n      </template>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  nextTick,\n  onBeforeUnmount,\n  onMounted,\n  provide,\n  reactive,\n  ref,\n  toRefs,\n  watch,\n} from 'vue'\nimport ElInputNumber from '@element-plus/components/input-number'\nimport {\n  UPDATE_MODEL_EVENT,\n  CHANGE_EVENT,\n  INPUT_EVENT,\n} from '@element-plus/utils/constants'\nimport { off, on } from '@element-plus/utils/dom'\nimport { throwError } from '@element-plus/utils/error'\nimport SliderButton from './button.vue'\nimport SliderMarker from './marker.vue'\nimport { useMarks } from './useMarks'\nimport { useSlide } from './useSlide'\nimport { useStops } from './useStops'\n\nimport type { PropType, Ref } from 'vue'\nimport type { ComponentSize, Nullable } from '@element-plus/utils/types'\n\nexport default defineComponent({\n  name: 'ElSlider',\n\n  components: {\n    ElInputNumber,\n    SliderButton,\n    SliderMarker,\n  },\n\n  props: {\n    modelValue: {\n      type: [Number, Array] as PropType<number | number[]>,\n      default: 0,\n    },\n    min: {\n      type: Number,\n      default: 0,\n    },\n    max: {\n      type: Number,\n      default: 100,\n    },\n    step: {\n      type: Number,\n      default: 1,\n    },\n    showInput: {\n      type: Boolean,\n      default: false,\n    },\n    showInputControls: {\n      type: Boolean,\n      default: true,\n    },\n    inputSize: {\n      type: String as PropType<ComponentSize>,\n      default: 'small',\n    },\n    showStops: {\n      type: Boolean,\n      default: false,\n    },\n    showTooltip: {\n      type: Boolean,\n      default: true,\n    },\n    formatTooltip: {\n      type: Function as PropType<(val: number) => number | string>,\n      default: undefined,\n    },\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n    range: {\n      type: Boolean,\n      default: false,\n    },\n    vertical: {\n      type: Boolean,\n      default: false,\n    },\n    height: {\n      type: String,\n      default: '',\n    },\n    debounce: {\n      type: Number,\n      default: 300,\n    },\n    label: {\n      type: String,\n      default: undefined,\n    },\n    tooltipClass: {\n      type: String,\n      default: undefined,\n    },\n    marks: Object,\n  },\n\n  emits: [UPDATE_MODEL_EVENT, CHANGE_EVENT, INPUT_EVENT],\n\n  setup(props, { emit }) {\n    const initData = reactive({\n      firstValue: 0,\n      secondValue: 0,\n      oldValue: 0,\n      dragging: false,\n      sliderSize: 1,\n    })\n\n    const {\n      elFormItem,\n      slider,\n      firstButton,\n      secondButton,\n      sliderDisabled,\n      minValue,\n      maxValue,\n      runwayStyle,\n      barStyle,\n      resetSize,\n      emitChange,\n      onSliderClick,\n      setFirstValue,\n      setSecondValue,\n    } = useSlide(props, initData, emit)\n\n    const { stops, getStopStyle } = useStops(\n      props,\n      initData,\n      minValue,\n      maxValue\n    )\n\n    const markList = useMarks(props)\n\n    useWatch(props, initData, minValue, maxValue, emit, elFormItem)\n\n    const precision = computed(() => {\n      const precisions = [props.min, props.max, props.step].map((item) => {\n        const decimal = `${item}`.split('.')[1]\n        return decimal ? decimal.length : 0\n      })\n      return Math.max.apply(null, precisions)\n    })\n\n    const { sliderWrapper } = useLifecycle(props, initData, resetSize)\n\n    const { firstValue, secondValue, oldValue, dragging, sliderSize } =\n      toRefs(initData)\n\n    const updateDragging = (val: boolean) => {\n      initData.dragging = val\n    }\n\n    provide('SliderProvider', {\n      ...toRefs(props),\n      sliderSize,\n      disabled: sliderDisabled,\n      precision,\n      emitChange,\n      resetSize,\n      updateDragging,\n    })\n\n    return {\n      firstValue,\n      secondValue,\n      oldValue,\n      dragging,\n      sliderSize,\n\n      slider,\n      firstButton,\n      secondButton,\n      sliderDisabled,\n      runwayStyle,\n      barStyle,\n      emitChange,\n      onSliderClick,\n      getStopStyle,\n      setFirstValue,\n      setSecondValue,\n\n      stops,\n      markList,\n\n      sliderWrapper,\n    }\n  },\n})\n\nconst useWatch = (props, initData, minValue, maxValue, emit, elFormItem) => {\n  const _emit = (val: number | number[]) => {\n    emit(UPDATE_MODEL_EVENT, val)\n    emit(INPUT_EVENT, val)\n  }\n\n  const valueChanged = () => {\n    if (props.range) {\n      return ![minValue.value, maxValue.value].every(\n        (item, index) => item === initData.oldValue[index]\n      )\n    } else {\n      return props.modelValue !== initData.oldValue\n    }\n  }\n\n  const setValues = () => {\n    if (props.min > props.max) {\n      throwError('Slider', 'min should not be greater than max.')\n      return\n    }\n    const val = props.modelValue\n    if (props.range && Array.isArray(val)) {\n      if (val[1] < props.min) {\n        _emit([props.min, props.min])\n      } else if (val[0] > props.max) {\n        _emit([props.max, props.max])\n      } else if (val[0] < props.min) {\n        _emit([props.min, val[1]])\n      } else if (val[1] > props.max) {\n        _emit([val[0], props.max])\n      } else {\n        initData.firstValue = val[0]\n        initData.secondValue = val[1]\n        if (valueChanged()) {\n          elFormItem.validate?.('change')\n          initData.oldValue = val.slice()\n        }\n      }\n    } else if (!props.range && typeof val === 'number' && !isNaN(val)) {\n      if (val < props.min) {\n        _emit(props.min)\n      } else if (val > props.max) {\n        _emit(props.max)\n      } else {\n        initData.firstValue = val\n        if (valueChanged()) {\n          elFormItem.validate?.('change')\n          initData.oldValue = val\n        }\n      }\n    }\n  }\n\n  setValues()\n\n  watch(\n    () => initData.dragging,\n    (val) => {\n      if (!val) {\n        setValues()\n      }\n    }\n  )\n\n  watch(\n    () => props.modelValue,\n    (val, oldVal) => {\n      if (\n        initData.dragging ||\n        (Array.isArray(val) &&\n          Array.isArray(oldVal) &&\n          val.every((item, index) => item === oldVal[index]))\n      ) {\n        return\n      }\n      setValues()\n    }\n  )\n\n  watch(\n    () => [props.min, props.max],\n    () => {\n      setValues()\n    }\n  )\n}\n\nconst useLifecycle = (props, initData, resetSize) => {\n  const sliderWrapper: Ref<Nullable<HTMLElement>> = ref(null)\n\n  onMounted(async () => {\n    let valuetext\n    if (props.range) {\n      if (Array.isArray(props.modelValue)) {\n        initData.firstValue = Math.max(props.min, props.modelValue[0])\n        initData.secondValue = Math.min(props.max, props.modelValue[1])\n      } else {\n        initData.firstValue = props.min\n        initData.secondValue = props.max\n      }\n      initData.oldValue = [initData.firstValue, initData.secondValue]\n      valuetext = `${initData.firstValue}-${initData.secondValue}`\n    } else {\n      if (typeof props.modelValue !== 'number' || isNaN(props.modelValue)) {\n        initData.firstValue = props.min\n      } else {\n        initData.firstValue = Math.min(\n          props.max,\n          Math.max(props.min, props.modelValue)\n        )\n      }\n      initData.oldValue = initData.firstValue\n      valuetext = initData.firstValue\n    }\n\n    sliderWrapper.value.setAttribute('aria-valuetext', valuetext)\n\n    // label screen reader\n    sliderWrapper.value.setAttribute(\n      'aria-label',\n      props.label ? props.label : `slider between ${props.min} and ${props.max}`\n    )\n\n    on(window, 'resize', resetSize)\n\n    await nextTick()\n    resetSize()\n  })\n\n  onBeforeUnmount(() => {\n    off(window, 'resize', resetSize)\n  })\n\n  return {\n    sliderWrapper,\n  }\n}\n</script>\n"],"names":["_createElementVNode","_createElementBlock","_createBlock"],"mappings":";;;;;;;;;;;;;;;;;IAEI;IACA;IAEA;IACC,eAAa,EAAE;;IAEf,kBAAgB;;;;;;;;eAOV;gBACE;oBACI;UACV;;;;;;;;;;MASDA;;gDAGmB;aACb;;;QAED;QAAwB,uBAAO;;;aAE9B;;QAEH;QACA;QACA;;;;;;4BAKW,EAAEC;;YAEb;YACA;;;;;;;wBAKO;;;;;;;;;;oCAONC;;kBAEG;4CACO,kBAAa;yBACf;;;;;;;;;;"}
+{"version":3,"file":"index.vue_vue_type_template_id_24c42d04_lang.js","sources":["../../../../../../packages/components/slider/src/index.vue?vue&type=template&id=24c42d04&lang.js"],"sourcesContent":["<template>\n  <div\n    ref=\"sliderWrapper\"\n    :class=\"sliderKls\"\n    role=\"slider\"\n    :aria-valuemin=\"min\"\n    :aria-valuemax=\"max\"\n    :aria-orientation=\"vertical ? 'vertical' : 'horizontal'\"\n    :aria-disabled=\"sliderDisabled\"\n  >\n    <div\n      ref=\"slider\"\n      class=\"el-slider__runway\"\n      :class=\"{ 'show-input': showInput && !range, disabled: sliderDisabled }\"\n      :style=\"runwayStyle\"\n      @click=\"onSliderClick\"\n    >\n      <div class=\"el-slider__bar\" :style=\"barStyle\"></div>\n      <slider-button\n        ref=\"firstButton\"\n        :model-value=\"firstValue\"\n        :vertical=\"vertical\"\n        :tooltip-class=\"tooltipClass\"\n        @update:model-value=\"setFirstValue\"\n      />\n      <slider-button\n        v-if=\"range\"\n        ref=\"secondButton\"\n        :model-value=\"secondValue\"\n        :vertical=\"vertical\"\n        :tooltip-class=\"tooltipClass\"\n        @update:model-value=\"setSecondValue\"\n      />\n      <div v-if=\"showStops\">\n        <div\n          v-for=\"(item, key) in stops\"\n          :key=\"key\"\n          class=\"el-slider__stop\"\n          :style=\"getStopStyle(item)\"\n        ></div>\n      </div>\n      <template v-if=\"markList.length > 0\">\n        <div>\n          <div\n            v-for=\"(item, key) in markList\"\n            :key=\"key\"\n            :style=\"getStopStyle(item.position)\"\n            class=\"el-slider__stop el-slider__marks-stop\"\n          ></div>\n        </div>\n        <div class=\"el-slider__marks\">\n          <slider-marker\n            v-for=\"(item, key) in markList\"\n            :key=\"key\"\n            :mark=\"item.mark\"\n            :style=\"getStopStyle(item.position)\"\n          />\n        </div>\n      </template>\n    </div>\n    <el-input-number\n      v-if=\"showInput && !range\"\n      ref=\"input\"\n      :model-value=\"firstValue\"\n      class=\"el-slider__input\"\n      :step=\"step\"\n      :disabled=\"sliderDisabled\"\n      :controls=\"showInputControls\"\n      :min=\"min\"\n      :max=\"max\"\n      :debounce=\"debounce\"\n      :size=\"sliderInputSize\"\n      @update:model-value=\"setFirstValue\"\n      @change=\"emitChange\"\n    />\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  nextTick,\n  onBeforeUnmount,\n  onMounted,\n  provide,\n  reactive,\n  ref,\n  toRefs,\n  watch,\n} from 'vue'\nimport ElInputNumber from '@element-plus/components/input-number'\nimport {\n  UPDATE_MODEL_EVENT,\n  CHANGE_EVENT,\n  INPUT_EVENT,\n} from '@element-plus/utils/constants'\nimport { off, on } from '@element-plus/utils/dom'\nimport { throwError } from '@element-plus/utils/error'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport { useSize } from '@element-plus/hooks'\nimport SliderButton from './button.vue'\nimport SliderMarker from './marker.vue'\nimport { useMarks } from './useMarks'\nimport { useSlide } from './useSlide'\nimport { useStops } from './useStops'\n\nimport type { PropType, Ref } from 'vue'\nimport type { ComponentSize, Nullable } from '@element-plus/utils/types'\n\nexport default defineComponent({\n  name: 'ElSlider',\n\n  components: {\n    ElInputNumber,\n    SliderButton,\n    SliderMarker,\n  },\n\n  props: {\n    modelValue: {\n      type: [Number, Array] as PropType<number | number[]>,\n      default: 0,\n    },\n    min: {\n      type: Number,\n      default: 0,\n    },\n    max: {\n      type: Number,\n      default: 100,\n    },\n    step: {\n      type: Number,\n      default: 1,\n    },\n    showInput: {\n      type: Boolean,\n      default: false,\n    },\n    showInputControls: {\n      type: Boolean,\n      default: true,\n    },\n    size: {\n      type: String as PropType<ComponentSize>,\n      validator: isValidComponentSize,\n    },\n    inputSize: {\n      type: String as PropType<ComponentSize>,\n      validator: isValidComponentSize,\n    },\n    showStops: {\n      type: Boolean,\n      default: false,\n    },\n    showTooltip: {\n      type: Boolean,\n      default: true,\n    },\n    formatTooltip: {\n      type: Function as PropType<(val: number) => number | string>,\n      default: undefined,\n    },\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n    range: {\n      type: Boolean,\n      default: false,\n    },\n    vertical: {\n      type: Boolean,\n      default: false,\n    },\n    height: {\n      type: String,\n      default: '',\n    },\n    debounce: {\n      type: Number,\n      default: 300,\n    },\n    label: {\n      type: String,\n      default: undefined,\n    },\n    tooltipClass: {\n      type: String,\n      default: undefined,\n    },\n    marks: Object,\n  },\n\n  emits: [UPDATE_MODEL_EVENT, CHANGE_EVENT, INPUT_EVENT],\n\n  setup(props, { emit }) {\n    const initData = reactive({\n      firstValue: 0,\n      secondValue: 0,\n      oldValue: 0,\n      dragging: false,\n      sliderSize: 1,\n    })\n\n    const {\n      elFormItem,\n      slider,\n      firstButton,\n      secondButton,\n      sliderDisabled,\n      minValue,\n      maxValue,\n      runwayStyle,\n      barStyle,\n      resetSize,\n      emitChange,\n      onSliderClick,\n      setFirstValue,\n      setSecondValue,\n    } = useSlide(props, initData, emit)\n\n    const { stops, getStopStyle } = useStops(\n      props,\n      initData,\n      minValue,\n      maxValue\n    )\n\n    const sliderWrapperSize = useSize()\n    const sliderInputSize = computed(\n      () => props.inputSize || sliderWrapperSize.value\n    )\n\n    const prefix = 'el-slider'\n    const sliderKls = computed(() => [\n      prefix,\n      `${prefix}--${sliderWrapperSize.value}`,\n      props.vertical ? 'is-vertical' : '',\n      props.showInput ? 'el-slider--with-input' : '',\n    ])\n\n    const markList = useMarks(props)\n\n    useWatch(props, initData, minValue, maxValue, emit, elFormItem)\n\n    const precision = computed(() => {\n      const precisions = [props.min, props.max, props.step].map((item) => {\n        const decimal = `${item}`.split('.')[1]\n        return decimal ? decimal.length : 0\n      })\n      return Math.max.apply(null, precisions)\n    })\n\n    const { sliderWrapper } = useLifecycle(props, initData, resetSize)\n\n    const { firstValue, secondValue, oldValue, dragging, sliderSize } =\n      toRefs(initData)\n\n    const updateDragging = (val: boolean) => {\n      initData.dragging = val\n    }\n\n    provide('SliderProvider', {\n      ...toRefs(props),\n      sliderSize,\n      disabled: sliderDisabled,\n      precision,\n      emitChange,\n      resetSize,\n      updateDragging,\n    })\n\n    return {\n      firstValue,\n      secondValue,\n      oldValue,\n      dragging,\n      sliderSize,\n\n      slider,\n      firstButton,\n      secondButton,\n      sliderDisabled,\n      runwayStyle,\n      barStyle,\n      emitChange,\n      onSliderClick,\n      getStopStyle,\n      setFirstValue,\n      setSecondValue,\n\n      stops,\n      markList,\n\n      sliderWrapper,\n      sliderWrapperSize,\n      sliderInputSize,\n      sliderKls,\n    }\n  },\n})\n\nconst useWatch = (props, initData, minValue, maxValue, emit, elFormItem) => {\n  const _emit = (val: number | number[]) => {\n    emit(UPDATE_MODEL_EVENT, val)\n    emit(INPUT_EVENT, val)\n  }\n\n  const valueChanged = () => {\n    if (props.range) {\n      return ![minValue.value, maxValue.value].every(\n        (item, index) => item === initData.oldValue[index]\n      )\n    } else {\n      return props.modelValue !== initData.oldValue\n    }\n  }\n\n  const setValues = () => {\n    if (props.min > props.max) {\n      throwError('Slider', 'min should not be greater than max.')\n      return\n    }\n    const val = props.modelValue\n    if (props.range && Array.isArray(val)) {\n      if (val[1] < props.min) {\n        _emit([props.min, props.min])\n      } else if (val[0] > props.max) {\n        _emit([props.max, props.max])\n      } else if (val[0] < props.min) {\n        _emit([props.min, val[1]])\n      } else if (val[1] > props.max) {\n        _emit([val[0], props.max])\n      } else {\n        initData.firstValue = val[0]\n        initData.secondValue = val[1]\n        if (valueChanged()) {\n          elFormItem.validate?.('change')\n          initData.oldValue = val.slice()\n        }\n      }\n    } else if (!props.range && typeof val === 'number' && !isNaN(val)) {\n      if (val < props.min) {\n        _emit(props.min)\n      } else if (val > props.max) {\n        _emit(props.max)\n      } else {\n        initData.firstValue = val\n        if (valueChanged()) {\n          elFormItem.validate?.('change')\n          initData.oldValue = val\n        }\n      }\n    }\n  }\n\n  setValues()\n\n  watch(\n    () => initData.dragging,\n    (val) => {\n      if (!val) {\n        setValues()\n      }\n    }\n  )\n\n  watch(\n    () => props.modelValue,\n    (val, oldVal) => {\n      if (\n        initData.dragging ||\n        (Array.isArray(val) &&\n          Array.isArray(oldVal) &&\n          val.every((item, index) => item === oldVal[index]))\n      ) {\n        return\n      }\n      setValues()\n    }\n  )\n\n  watch(\n    () => [props.min, props.max],\n    () => {\n      setValues()\n    }\n  )\n}\n\nconst useLifecycle = (props, initData, resetSize) => {\n  const sliderWrapper: Ref<Nullable<HTMLElement>> = ref(null)\n\n  onMounted(async () => {\n    let valuetext\n    if (props.range) {\n      if (Array.isArray(props.modelValue)) {\n        initData.firstValue = Math.max(props.min, props.modelValue[0])\n        initData.secondValue = Math.min(props.max, props.modelValue[1])\n      } else {\n        initData.firstValue = props.min\n        initData.secondValue = props.max\n      }\n      initData.oldValue = [initData.firstValue, initData.secondValue]\n      valuetext = `${initData.firstValue}-${initData.secondValue}`\n    } else {\n      if (typeof props.modelValue !== 'number' || isNaN(props.modelValue)) {\n        initData.firstValue = props.min\n      } else {\n        initData.firstValue = Math.min(\n          props.max,\n          Math.max(props.min, props.modelValue)\n        )\n      }\n      initData.oldValue = initData.firstValue\n      valuetext = initData.firstValue\n    }\n\n    sliderWrapper.value.setAttribute('aria-valuetext', valuetext)\n\n    // label screen reader\n    sliderWrapper.value.setAttribute(\n      'aria-label',\n      props.label ? props.label : `slider between ${props.min} and ${props.max}`\n    )\n\n    on(window, 'resize', resetSize)\n\n    await nextTick()\n    resetSize()\n  })\n\n  onBeforeUnmount(() => {\n    off(window, 'resize', resetSize)\n  })\n\n  return {\n    sliderWrapper,\n  }\n}\n</script>\n"],"names":["_createElementVNode","_createElementBlock"],"mappings":";;;;;;;;;;;;;;;;;IAEI;IACC;IACD;IACC,eAAa,EAAE;;IAEfA,uBAAkB;mBACL;;;MAGZ;;MAGCA;aACK;;;;QAEuB,KAAK;;;QAEhC;QACC;gBACQ,EAAE;;QAEV;;;;;;;oBAMQ;8BACKC,sBAAc;;;;;;;;mBAMtB;;wBAEE;;;;;qBAGe;;;oCAErB;;;;kBAIE,OAAM;;;;;;;kBAML,KAAK;;kBAEL;;;;;;;;;;;;iBASD;;;;;;"}

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

@@ -18,11 +18,13 @@ export declare const ElSwitch: import("../../utils/types").SFCWithInstall<import
     readonly id: StringConstructor;
     readonly loading: import("../../utils/props").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
     readonly beforeChange: import("../../utils/props").BuildPropReturn<import("../../utils/props").PropWrapper<() => boolean | Promise<boolean>>, unknown, unknown, unknown, unknown>;
+    readonly size: import("../../utils/props").BuildPropReturn<(new (...args: any[]) => import("../../utils/types").ComponentSize & {}) | (() => import("../../utils/types").ComponentSize) | ((new (...args: any[]) => import("../../utils/types").ComponentSize & {}) | (() => import("../../utils/types").ComponentSize))[], unknown, unknown, unknown, unknown>;
 }, {
     input: import("vue").Ref<HTMLInputElement | undefined>;
     core: import("vue").Ref<HTMLSpanElement | undefined>;
     switchDisabled: import("vue").ComputedRef<boolean>;
     checked: import("vue").ComputedRef<boolean>;
+    switchKls: import("vue").ComputedRef<string[]>;
     handleChange: () => void;
     switchValue: () => void;
     focus: () => void;
@@ -50,6 +52,7 @@ export declare const ElSwitch: import("../../utils/types").SFCWithInstall<import
     readonly id?: unknown;
     readonly loading?: unknown;
     readonly beforeChange?: unknown;
+    readonly size?: unknown;
 } & {
     disabled: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     loading: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
@@ -69,6 +72,7 @@ export declare const ElSwitch: import("../../utils/types").SFCWithInstall<import
     activeValue: import("../../utils/props").BuildPropType<readonly [BooleanConstructor, StringConstructor, NumberConstructor], unknown, unknown>;
     inactiveValue: import("../../utils/props").BuildPropType<readonly [BooleanConstructor, StringConstructor, NumberConstructor], unknown, unknown>;
 } & {
+    size?: import("../../utils/props").BuildPropType<(new (...args: any[]) => import("../../utils/types").ComponentSize & {}) | (() => import("../../utils/types").ComponentSize) | ((new (...args: any[]) => import("../../utils/types").ComponentSize & {}) | (() => import("../../utils/types").ComponentSize))[], unknown, unknown> | undefined;
     id?: string | undefined;
     beforeChange?: (() => boolean | Promise<boolean>) | undefined;
 }> & {
@@ -76,6 +80,7 @@ export declare const ElSwitch: import("../../utils/types").SFCWithInstall<import
     onInput?: ((val: string | number | boolean) => any) | undefined;
     "onUpdate:modelValue"?: ((val: string | number | boolean) => any) | undefined;
 }, {
+    size: import("../../utils/props").BuildPropType<(new (...args: any[]) => import("../../utils/types").ComponentSize & {}) | (() => import("../../utils/types").ComponentSize) | ((new (...args: any[]) => import("../../utils/types").ComponentSize & {}) | (() => import("../../utils/types").ComponentSize))[], unknown, unknown>;
     disabled: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     loading: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     name: string;

package/lib/components/switch/src/switch.d.ts

@@ -1,3 +1,4 @@
+import type { ComponentSize } from 'element-plus/es/utils/types';
 import type Switch from './switch.vue';
 import type { Component, ExtractPropTypes } from 'vue';
 export declare const switchProps: {
@@ -20,6 +21,7 @@ export declare const switchProps: {
     readonly id: StringConstructor;
     readonly loading: import("element-plus/es/utils/props").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
     readonly beforeChange: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<() => Promise<boolean> | boolean>, unknown, unknown, unknown, unknown>;
+    readonly size: import("element-plus/es/utils/props").BuildPropReturn<(new (...args: any[]) => ComponentSize & {}) | (() => ComponentSize) | ((new (...args: any[]) => ComponentSize & {}) | (() => ComponentSize))[], unknown, unknown, unknown, unknown>;
 };
 export declare type SwitchProps = ExtractPropTypes<typeof switchProps>;
 export declare const switchEmits: {

package/lib/components/switch/src/switch.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var props = require('../../../utils/props.js');
 var constants = require('../../../utils/constants.js');
 var util = require('../../../utils/util.js');
+var validators = require('../../../utils/validators.js');
 var shared = require('@vue/shared');
 
 const switchProps = props.buildProps({
@@ -79,6 +80,10 @@ const switchProps = props.buildProps({
   },
   beforeChange: {
     type: props.definePropType(Function)
+  },
+  size: {
+    type: String,
+    validator: validators.isValidComponentSize
   }
 });
 const switchEmits = {

package/lib/components/switch/src/switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"switch.js","sources":["../../../../../../packages/components/switch/src/switch.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils/props'\nimport {\n  UPDATE_MODEL_EVENT,\n  CHANGE_EVENT,\n  INPUT_EVENT,\n} from '@element-plus/utils/constants'\nimport { isBool, isNumber, isString } from '@element-plus/utils/util'\nimport type Switch from './switch.vue'\nimport type { Component, ExtractPropTypes } from 'vue'\n\nexport const switchProps = buildProps({\n  modelValue: {\n    type: [Boolean, String, Number],\n    default: false,\n  },\n  value: {\n    type: [Boolean, String, Number],\n    default: false,\n  },\n  disabled: {\n    type: Boolean,\n    default: false,\n  },\n  width: {\n    type: Number,\n    default: 40,\n  },\n  inlinePrompt: {\n    type: Boolean,\n    default: false,\n  },\n  activeIcon: {\n    type: definePropType<string | Component>([String, Object, Function]),\n    default: '',\n  },\n  inactiveIcon: {\n    type: definePropType<string | Component>([String, Object, Function]),\n    default: '',\n  },\n  activeText: {\n    type: String,\n    default: '',\n  },\n  inactiveText: {\n    type: String,\n    default: '',\n  },\n  activeColor: {\n    type: String,\n    default: '',\n  },\n  inactiveColor: {\n    type: String,\n    default: '',\n  },\n  borderColor: {\n    type: String,\n    default: '',\n  },\n  activeValue: {\n    type: [Boolean, String, Number],\n    default: true,\n  },\n  inactiveValue: {\n    type: [Boolean, String, Number],\n    default: false,\n  },\n  name: {\n    type: String,\n    default: '',\n  },\n  validateEvent: {\n    type: Boolean,\n    default: true,\n  },\n  id: String,\n  loading: {\n    type: Boolean,\n    default: false,\n  },\n  beforeChange: {\n    type: definePropType<() => Promise<boolean> | boolean>(Function),\n  },\n} as const)\n\nexport type SwitchProps = ExtractPropTypes<typeof switchProps>\n\nexport const switchEmits = {\n  [UPDATE_MODEL_EVENT]: (val: boolean | string | number) =>\n    isBool(val) || isString(val) || isNumber(val),\n  [CHANGE_EVENT]: (val: boolean | string | number) =>\n    isBool(val) || isString(val) || isNumber(val),\n  [INPUT_EVENT]: (val: boolean | string | number) =>\n    isBool(val) || isString(val) || isNumber(val),\n}\nexport type SwitchEmits = typeof switchEmits\n\nexport type SwitchInstance = InstanceType<typeof Switch>\n"],"names":["buildProps","definePropType","UPDATE_MODEL_EVENT","isBool","isString","isNumber","CHANGE_EVENT","INPUT_EVENT"],"mappings":"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"}
+{"version":3,"file":"switch.js","sources":["../../../../../../packages/components/switch/src/switch.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils/props'\nimport {\n  UPDATE_MODEL_EVENT,\n  CHANGE_EVENT,\n  INPUT_EVENT,\n} from '@element-plus/utils/constants'\nimport { isBool, isNumber, isString } from '@element-plus/utils/util'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport type { ComponentSize } from '@element-plus/utils/types'\nimport type Switch from './switch.vue'\nimport type { Component, ExtractPropTypes, PropType } from 'vue'\n\nexport const switchProps = buildProps({\n  modelValue: {\n    type: [Boolean, String, Number],\n    default: false,\n  },\n  value: {\n    type: [Boolean, String, Number],\n    default: false,\n  },\n  disabled: {\n    type: Boolean,\n    default: false,\n  },\n  width: {\n    type: Number,\n    default: 40,\n  },\n  inlinePrompt: {\n    type: Boolean,\n    default: false,\n  },\n  activeIcon: {\n    type: definePropType<string | Component>([String, Object, Function]),\n    default: '',\n  },\n  inactiveIcon: {\n    type: definePropType<string | Component>([String, Object, Function]),\n    default: '',\n  },\n  activeText: {\n    type: String,\n    default: '',\n  },\n  inactiveText: {\n    type: String,\n    default: '',\n  },\n  activeColor: {\n    type: String,\n    default: '',\n  },\n  inactiveColor: {\n    type: String,\n    default: '',\n  },\n  borderColor: {\n    type: String,\n    default: '',\n  },\n  activeValue: {\n    type: [Boolean, String, Number],\n    default: true,\n  },\n  inactiveValue: {\n    type: [Boolean, String, Number],\n    default: false,\n  },\n  name: {\n    type: String,\n    default: '',\n  },\n  validateEvent: {\n    type: Boolean,\n    default: true,\n  },\n  id: String,\n  loading: {\n    type: Boolean,\n    default: false,\n  },\n  beforeChange: {\n    type: definePropType<() => Promise<boolean> | boolean>(Function),\n  },\n  size: {\n    type: String as PropType<ComponentSize>,\n    validator: isValidComponentSize,\n  },\n} as const)\n\nexport type SwitchProps = ExtractPropTypes<typeof switchProps>\n\nexport const switchEmits = {\n  [UPDATE_MODEL_EVENT]: (val: boolean | string | number) =>\n    isBool(val) || isString(val) || isNumber(val),\n  [CHANGE_EVENT]: (val: boolean | string | number) =>\n    isBool(val) || isString(val) || isNumber(val),\n  [INPUT_EVENT]: (val: boolean | string | number) =>\n    isBool(val) || isString(val) || isNumber(val),\n}\nexport type SwitchEmits = typeof switchEmits\n\nexport type SwitchInstance = InstanceType<typeof Switch>\n"],"names":["buildProps","definePropType","isValidComponentSize","UPDATE_MODEL_EVENT","isBool","isString","isNumber","CHANGE_EVENT","INPUT_EVENT"],"mappings":"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"}

package/lib/components/switch/src/switch.vue.d.ts

@@ -18,11 +18,13 @@ declare const _default: import("vue").DefineComponent<{
     readonly id: StringConstructor;
     readonly loading: import("../../../utils/props").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
     readonly beforeChange: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<() => boolean | Promise<boolean>>, unknown, unknown, unknown, unknown>;
+    readonly size: import("../../../utils/props").BuildPropReturn<(new (...args: any[]) => import("../../../utils/types").ComponentSize & {}) | (() => import("../../../utils/types").ComponentSize) | ((new (...args: any[]) => import("../../../utils/types").ComponentSize & {}) | (() => import("../../../utils/types").ComponentSize))[], unknown, unknown, unknown, unknown>;
 }, {
     input: import("vue").Ref<HTMLInputElement | undefined>;
     core: import("vue").Ref<HTMLSpanElement | undefined>;
     switchDisabled: import("vue").ComputedRef<boolean>;
     checked: import("vue").ComputedRef<boolean>;
+    switchKls: import("vue").ComputedRef<string[]>;
     handleChange: () => void;
     switchValue: () => void;
     focus: () => void;
@@ -50,6 +52,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly id?: unknown;
     readonly loading?: unknown;
     readonly beforeChange?: unknown;
+    readonly size?: unknown;
 } & {
     disabled: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     loading: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
@@ -69,6 +72,7 @@ declare const _default: import("vue").DefineComponent<{
     activeValue: import("../../../utils/props").BuildPropType<readonly [BooleanConstructor, StringConstructor, NumberConstructor], unknown, unknown>;
     inactiveValue: import("../../../utils/props").BuildPropType<readonly [BooleanConstructor, StringConstructor, NumberConstructor], unknown, unknown>;
 } & {
+    size?: import("../../../utils/props").BuildPropType<(new (...args: any[]) => import("../../../utils/types").ComponentSize & {}) | (() => import("../../../utils/types").ComponentSize) | ((new (...args: any[]) => import("../../../utils/types").ComponentSize & {}) | (() => import("../../../utils/types").ComponentSize))[], unknown, unknown> | undefined;
     id?: string | undefined;
     beforeChange?: (() => boolean | Promise<boolean>) | undefined;
 }> & {
@@ -76,6 +80,7 @@ declare const _default: import("vue").DefineComponent<{
     onInput?: ((val: string | number | boolean) => any) | undefined;
     "onUpdate:modelValue"?: ((val: string | number | boolean) => any) | undefined;
 }, {
+    size: import("../../../utils/props").BuildPropType<(new (...args: any[]) => import("../../../utils/types").ComponentSize & {}) | (() => import("../../../utils/types").ComponentSize) | ((new (...args: any[]) => import("../../../utils/types").ComponentSize & {}) | (() => import("../../../utils/types").ComponentSize))[], unknown, unknown>;
     disabled: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     loading: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     name: string;

package/lib/components/switch/src/switch.vue_vue_type_script_lang.js

@@ -23,9 +23,17 @@ var script = vue.defineComponent({
   setup(props, { emit }) {
     const { formItem } = index$1.useFormItem();
     const switchDisabled = index$2.useDisabled(vue.computed(() => props.loading));
+    const switchSize = index$2.useSize();
     const isModelValue = vue.ref(props.modelValue !== false);
     const input = vue.ref();
     const core = vue.ref();
+    const prefix = "el-switch";
+    const switchKls = vue.computed(() => [
+      prefix,
+      `${prefix}--${switchSize.value}`,
+      switchDisabled.value ? "is-disabled" : "",
+      checked.value ? "is-checked" : ""
+    ]);
     vue.watch(() => props.modelValue, () => {
       isModelValue.value = true;
     });
@@ -110,6 +118,7 @@ var script = vue.defineComponent({
       core,
       switchDisabled,
       checked,
+      switchKls,
       handleChange,
       switchValue,
       focus

package/lib/components/switch/src/switch.vue_vue_type_script_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"switch.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/switch/src/switch.vue"],"sourcesContent":["<template>\n  <div\n    class=\"el-switch\"\n    :class=\"{ 'is-disabled': switchDisabled, 'is-checked': checked }\"\n    role=\"switch\"\n    :aria-checked=\"checked\"\n    :aria-disabled=\"switchDisabled\"\n    @click.prevent=\"switchValue\"\n  >\n    <input\n      :id=\"id\"\n      ref=\"input\"\n      class=\"el-switch__input\"\n      type=\"checkbox\"\n      :name=\"name\"\n      :true-value=\"activeValue\"\n      :false-value=\"inactiveValue\"\n      :disabled=\"switchDisabled\"\n      @change=\"handleChange\"\n      @keydown.enter=\"switchValue\"\n    />\n    <span\n      v-if=\"!inlinePrompt && (inactiveIcon || inactiveText)\"\n      :class=\"[\n        'el-switch__label',\n        'el-switch__label--left',\n        !checked ? 'is-active' : '',\n      ]\"\n    >\n      <el-icon v-if=\"inactiveIcon\"><component :is=\"inactiveIcon\" /></el-icon>\n      <span v-if=\"!inactiveIcon && inactiveText\" :aria-hidden=\"checked\">{{\n        inactiveText\n      }}</span>\n    </span>\n    <span\n      ref=\"core\"\n      class=\"el-switch__core\"\n      :style=\"{ width: (width || 40) + 'px' }\"\n    >\n      <div v-if=\"inlinePrompt\" class=\"el-switch__inner\">\n        <template v-if=\"activeIcon || inactiveIcon\">\n          <el-icon\n            v-if=\"activeIcon\"\n            class=\"is-icon\"\n            :class=\"checked ? 'is-show' : 'is-hide'\"\n          >\n            <component :is=\"activeIcon\" />\n          </el-icon>\n          <el-icon\n            v-if=\"inactiveIcon\"\n            class=\"is-icon\"\n            :class=\"!checked ? 'is-show' : 'is-hide'\"\n          >\n            <component :is=\"inactiveIcon\" />\n          </el-icon>\n        </template>\n        <template v-else-if=\"activeText || inactiveIcon\">\n          <span\n            v-if=\"activeText\"\n            class=\"is-text\"\n            :class=\"checked ? 'is-show' : 'is-hide'\"\n            :aria-hidden=\"!checked\"\n          >\n            {{ activeText.substr(0, 1) }}\n          </span>\n          <span\n            v-if=\"inactiveText\"\n            class=\"is-text\"\n            :class=\"!checked ? 'is-show' : 'is-hide'\"\n            :aria-hidden=\"checked\"\n          >\n            {{ inactiveText.substr(0, 1) }}\n          </span>\n        </template>\n      </div>\n      <div class=\"el-switch__action\">\n        <el-icon v-if=\"loading\" class=\"is-loading\"><loading /></el-icon>\n      </div>\n    </span>\n    <span\n      v-if=\"!inlinePrompt && (activeIcon || activeText)\"\n      :class=\"[\n        'el-switch__label',\n        'el-switch__label--right',\n        checked ? 'is-active' : '',\n      ]\"\n    >\n      <el-icon v-if=\"activeIcon\"><component :is=\"activeIcon\" /></el-icon>\n      <span v-if=\"!activeIcon && activeText\" :aria-hidden=\"!checked\">{{\n        activeText\n      }}</span>\n    </span>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed, onMounted, ref, nextTick, watch } from 'vue'\nimport { isPromise } from '@vue/shared'\nimport { isBool } from '@element-plus/utils/util'\nimport { throwError, debugWarn } from '@element-plus/utils/error'\nimport ElIcon from '@element-plus/components/icon'\nimport { Loading } from '@element-plus/icons-vue'\nimport {\n  UPDATE_MODEL_EVENT,\n  CHANGE_EVENT,\n  INPUT_EVENT,\n} from '@element-plus/utils/constants'\nimport { useDisabled, useFormItem } from '@element-plus/hooks'\nimport { switchProps, switchEmits } from './switch'\n\nconst COMPONENT_NAME = 'ElSwitch'\n\nexport default defineComponent({\n  name: COMPONENT_NAME,\n  components: { ElIcon, Loading },\n\n  props: switchProps,\n  emits: switchEmits,\n\n  setup(props, { emit }) {\n    const { formItem } = useFormItem()\n    const switchDisabled = useDisabled(computed(() => props.loading))\n\n    const isModelValue = ref(props.modelValue !== false)\n    const input = ref<HTMLInputElement>()\n    const core = ref<HTMLSpanElement>()\n\n    watch(\n      () => props.modelValue,\n      () => {\n        isModelValue.value = true\n      }\n    )\n\n    watch(\n      () => props.value,\n      () => {\n        isModelValue.value = false\n      }\n    )\n\n    const actualValue = computed(() => {\n      return isModelValue.value ? props.modelValue : props.value\n    })\n\n    const checked = computed(() => actualValue.value === props.activeValue)\n\n    if (![props.activeValue, props.inactiveValue].includes(actualValue.value)) {\n      emit(UPDATE_MODEL_EVENT, props.inactiveValue)\n      emit(CHANGE_EVENT, props.inactiveValue)\n      emit(INPUT_EVENT, props.inactiveValue)\n    }\n\n    watch(checked, () => {\n      input.value!.checked = checked.value\n\n      if (props.activeColor || props.inactiveColor) {\n        setBackgroundColor()\n      }\n\n      if (props.validateEvent) {\n        formItem?.validate?.('change')\n      }\n    })\n\n    const handleChange = (): void => {\n      const val = checked.value ? props.inactiveValue : props.activeValue\n      emit(UPDATE_MODEL_EVENT, val)\n      emit(CHANGE_EVENT, val)\n      emit(INPUT_EVENT, val)\n      nextTick(() => {\n        input.value!.checked = checked.value\n      })\n    }\n\n    const switchValue = (): void => {\n      if (switchDisabled.value) return\n\n      const { beforeChange } = props\n      if (!beforeChange) {\n        handleChange()\n        return\n      }\n\n      const shouldChange = beforeChange()\n\n      const isExpectType = [isPromise(shouldChange), isBool(shouldChange)].some(\n        (i) => i\n      )\n      if (!isExpectType) {\n        throwError(\n          COMPONENT_NAME,\n          'beforeChange must return type `Promise<boolean>` or `boolean`'\n        )\n      }\n\n      if (isPromise(shouldChange)) {\n        shouldChange\n          .then((result) => {\n            if (result) {\n              handleChange()\n            }\n          })\n          .catch((e) => {\n            debugWarn(COMPONENT_NAME, `some error occurred: ${e}`)\n          })\n      } else if (shouldChange) {\n        handleChange()\n      }\n    }\n\n    const setBackgroundColor = (): void => {\n      const newColor = checked.value ? props.activeColor : props.inactiveColor\n      const coreEl = core.value\n      if (props.borderColor) coreEl!.style.borderColor = props.borderColor\n      else if (!props.borderColor) coreEl!.style.borderColor = newColor\n      coreEl!.style.backgroundColor = newColor\n      ;(coreEl!.children[0] as HTMLDivElement).style.color = newColor\n    }\n\n    const focus = (): void => {\n      input.value?.focus?.()\n    }\n\n    onMounted(() => {\n      if (props.activeColor || props.inactiveColor || props.borderColor) {\n        setBackgroundColor()\n      }\n\n      input.value!.checked = checked.value\n    })\n\n    return {\n      input,\n      core,\n      switchDisabled,\n      checked,\n      handleChange,\n      switchValue,\n      focus,\n    }\n  },\n})\n</script>\n"],"names":["switchProps","switchEmits","ref","watch","UPDATE_MODEL_EVENT","CHANGE_EVENT","INPUT_EVENT","nextTick","throwError","isPromise"],"mappings":";;;;;;;;;;;;;;;;AA4GA,oBAAoB,GAAG,WAAW;;AAElC,EAAE,IAAI,EAAE;;AAER,EAAE,KAAK,EAAEA,mBAAW;EAClB,OAAOC,mBAAW;EAClB,KAAK,CAAC,SAAS,IAAI,IAAI;;IAErB,MAAM;IACN,MAAM;;IAEN,MAAM,OAAOC,OAAG,EAAE,CAAC;IACnBC,UAAM,MAAM,KAAK,WAAW,EAAE;MAC5B,YAAY,CAAC,QAAQ,IAAI,CAAC;;IAE5BA,UAAM,MAAM,KAAK,MAAM,EAAE,MAAM;MAC7B,YAAY,CAAC,KAAK,GAAG,KAAK,CAAC;KAC5B,CAAC,CAAC;;MAED;MACA,CAAC;UACG;QACF,CAAC,CAAC,KAAK,CAAC,WAAW,EAAE;MACvB;;;KAGD;aACI,CAAC,OAAO,EAAE;MACb,IAAI,EAAE;WACD,CAAC,KAAK,CAAC,OAAO;MACnB;;;MAGA,IAAI,KAAK,CAAC,aAAa,EAAE;QACvB,CAAC,EAAE,GAAG,QAAQ,IAAI,IAAI,QAAQ,CAAC,GAAG,SAAS,QAAQ;;;IAGvD,MAAM,YAAY,GAAG;;UAEf,CAACC,4BAAkB,EAAE,GAAG,CAAC,CAAC;MAC9B,IAAI,CAACC,sBAAY,EAAE,GAAG,CAAC;MACvB,IAAI,CAACC,qBAAW,KAAK,CAAC,CAAC;MACvBC,YAAQ,CAAC,MAAM;;;KAGhB,CAAC;UACI,WAAW,GAAG,MAAM;;eAEf;YACH,EAAE,YAAY;MACpB;;eAES;;MAET;;;QAGEC,gBAAU,CAAC,gBAAgB;OAC5B;MACD,IAAIC,gBAAS,CAAC,YAAY,CAAC;QACzB,YAAY,CAAC,IAAI,CAAC,CAAC;UACjB,IAAI,MAAM,EAAE;YACV;WACD;;;;OAIJ,MAAM,IAAI,YAAY,EAAE;oBACX,EAAE,CAAC;;MAEjB;UACI;YACE,QAAQ;YACR;MACN;;eAES,CAAC,KAAK,CAAC,WAAW;;MAE3B,MAAM,CAAC,KAAK,CAAC,eAAe,GAAG,QAAQ,CAAC;YAClC,CAAC;MACP;UACI,KAAK,GAAG;UACR,EAAE,EAAE,EAAE,CAAC;YACL,CAAC,EAAE,GAAG,KAAK,CAAC;;;MAGlB;;OAEC;WACI,CAAC,KAAK,CAAC;;;;;;aAML;kBACK;;MAEZ,KAAK;;;;;;;"}
+{"version":3,"file":"switch.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/switch/src/switch.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"switchKls\"\n    role=\"switch\"\n    :aria-checked=\"checked\"\n    :aria-disabled=\"switchDisabled\"\n    @click.prevent=\"switchValue\"\n  >\n    <input\n      :id=\"id\"\n      ref=\"input\"\n      class=\"el-switch__input\"\n      type=\"checkbox\"\n      :name=\"name\"\n      :true-value=\"activeValue\"\n      :false-value=\"inactiveValue\"\n      :disabled=\"switchDisabled\"\n      @change=\"handleChange\"\n      @keydown.enter=\"switchValue\"\n    />\n    <span\n      v-if=\"!inlinePrompt && (inactiveIcon || inactiveText)\"\n      :class=\"[\n        'el-switch__label',\n        'el-switch__label--left',\n        !checked ? 'is-active' : '',\n      ]\"\n    >\n      <el-icon v-if=\"inactiveIcon\"><component :is=\"inactiveIcon\" /></el-icon>\n      <span v-if=\"!inactiveIcon && inactiveText\" :aria-hidden=\"checked\">{{\n        inactiveText\n      }}</span>\n    </span>\n    <span\n      ref=\"core\"\n      class=\"el-switch__core\"\n      :style=\"{ width: (width || 40) + 'px' }\"\n    >\n      <div v-if=\"inlinePrompt\" class=\"el-switch__inner\">\n        <template v-if=\"activeIcon || inactiveIcon\">\n          <el-icon\n            v-if=\"activeIcon\"\n            class=\"is-icon\"\n            :class=\"checked ? 'is-show' : 'is-hide'\"\n          >\n            <component :is=\"activeIcon\" />\n          </el-icon>\n          <el-icon\n            v-if=\"inactiveIcon\"\n            class=\"is-icon\"\n            :class=\"!checked ? 'is-show' : 'is-hide'\"\n          >\n            <component :is=\"inactiveIcon\" />\n          </el-icon>\n        </template>\n        <template v-else-if=\"activeText || inactiveIcon\">\n          <span\n            v-if=\"activeText\"\n            class=\"is-text\"\n            :class=\"checked ? 'is-show' : 'is-hide'\"\n            :aria-hidden=\"!checked\"\n          >\n            {{ activeText.substr(0, 1) }}\n          </span>\n          <span\n            v-if=\"inactiveText\"\n            class=\"is-text\"\n            :class=\"!checked ? 'is-show' : 'is-hide'\"\n            :aria-hidden=\"checked\"\n          >\n            {{ inactiveText.substr(0, 1) }}\n          </span>\n        </template>\n      </div>\n      <div class=\"el-switch__action\">\n        <el-icon v-if=\"loading\" class=\"is-loading\"><loading /></el-icon>\n      </div>\n    </span>\n    <span\n      v-if=\"!inlinePrompt && (activeIcon || activeText)\"\n      :class=\"[\n        'el-switch__label',\n        'el-switch__label--right',\n        checked ? 'is-active' : '',\n      ]\"\n    >\n      <el-icon v-if=\"activeIcon\"><component :is=\"activeIcon\" /></el-icon>\n      <span v-if=\"!activeIcon && activeText\" :aria-hidden=\"!checked\">{{\n        activeText\n      }}</span>\n    </span>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed, onMounted, ref, nextTick, watch } from 'vue'\nimport { isPromise } from '@vue/shared'\nimport { isBool } from '@element-plus/utils/util'\nimport { throwError, debugWarn } from '@element-plus/utils/error'\nimport ElIcon from '@element-plus/components/icon'\nimport { Loading } from '@element-plus/icons-vue'\nimport {\n  UPDATE_MODEL_EVENT,\n  CHANGE_EVENT,\n  INPUT_EVENT,\n} from '@element-plus/utils/constants'\nimport { useDisabled, useFormItem, useSize } from '@element-plus/hooks'\nimport { switchProps, switchEmits } from './switch'\n\nconst COMPONENT_NAME = 'ElSwitch'\n\nexport default defineComponent({\n  name: COMPONENT_NAME,\n  components: { ElIcon, Loading },\n\n  props: switchProps,\n  emits: switchEmits,\n\n  setup(props, { emit }) {\n    const { formItem } = useFormItem()\n    const switchDisabled = useDisabled(computed(() => props.loading))\n\n    const switchSize = useSize()\n    const isModelValue = ref(props.modelValue !== false)\n    const input = ref<HTMLInputElement>()\n    const core = ref<HTMLSpanElement>()\n\n    const prefix = 'el-switch'\n    const switchKls = computed(() => [\n      prefix,\n      `${prefix}--${switchSize.value}`,\n      switchDisabled.value ? 'is-disabled' : '',\n      checked.value ? 'is-checked' : '',\n    ])\n\n    watch(\n      () => props.modelValue,\n      () => {\n        isModelValue.value = true\n      }\n    )\n\n    watch(\n      () => props.value,\n      () => {\n        isModelValue.value = false\n      }\n    )\n\n    const actualValue = computed(() => {\n      return isModelValue.value ? props.modelValue : props.value\n    })\n\n    const checked = computed(() => actualValue.value === props.activeValue)\n\n    if (![props.activeValue, props.inactiveValue].includes(actualValue.value)) {\n      emit(UPDATE_MODEL_EVENT, props.inactiveValue)\n      emit(CHANGE_EVENT, props.inactiveValue)\n      emit(INPUT_EVENT, props.inactiveValue)\n    }\n\n    watch(checked, () => {\n      input.value!.checked = checked.value\n\n      if (props.activeColor || props.inactiveColor) {\n        setBackgroundColor()\n      }\n\n      if (props.validateEvent) {\n        formItem?.validate?.('change')\n      }\n    })\n\n    const handleChange = (): void => {\n      const val = checked.value ? props.inactiveValue : props.activeValue\n      emit(UPDATE_MODEL_EVENT, val)\n      emit(CHANGE_EVENT, val)\n      emit(INPUT_EVENT, val)\n      nextTick(() => {\n        input.value!.checked = checked.value\n      })\n    }\n\n    const switchValue = (): void => {\n      if (switchDisabled.value) return\n\n      const { beforeChange } = props\n      if (!beforeChange) {\n        handleChange()\n        return\n      }\n\n      const shouldChange = beforeChange()\n\n      const isExpectType = [isPromise(shouldChange), isBool(shouldChange)].some(\n        (i) => i\n      )\n      if (!isExpectType) {\n        throwError(\n          COMPONENT_NAME,\n          'beforeChange must return type `Promise<boolean>` or `boolean`'\n        )\n      }\n\n      if (isPromise(shouldChange)) {\n        shouldChange\n          .then((result) => {\n            if (result) {\n              handleChange()\n            }\n          })\n          .catch((e) => {\n            debugWarn(COMPONENT_NAME, `some error occurred: ${e}`)\n          })\n      } else if (shouldChange) {\n        handleChange()\n      }\n    }\n\n    const setBackgroundColor = (): void => {\n      const newColor = checked.value ? props.activeColor : props.inactiveColor\n      const coreEl = core.value\n      if (props.borderColor) coreEl!.style.borderColor = props.borderColor\n      else if (!props.borderColor) coreEl!.style.borderColor = newColor\n      coreEl!.style.backgroundColor = newColor\n      ;(coreEl!.children[0] as HTMLDivElement).style.color = newColor\n    }\n\n    const focus = (): void => {\n      input.value?.focus?.()\n    }\n\n    onMounted(() => {\n      if (props.activeColor || props.inactiveColor || props.borderColor) {\n        setBackgroundColor()\n      }\n\n      input.value!.checked = checked.value\n    })\n\n    return {\n      input,\n      core,\n      switchDisabled,\n      checked,\n      switchKls,\n      handleChange,\n      switchValue,\n      focus,\n    }\n  },\n})\n</script>\n"],"names":["switchProps","switchEmits","ref","watch","computed","UPDATE_MODEL_EVENT","CHANGE_EVENT","INPUT_EVENT","nextTick","isPromise"],"mappings":";;;;;;;;;;;;;;;;AA2GA,oBAAoB,GAAG,WAAW;;AAElC,EAAE,IAAI,EAAE;;AAER,EAAE,KAAK,EAAEA,mBAAW;EAClB,OAAOC,mBAAW;EAClB,KAAK,CAAC,SAAS,IAAI,IAAI;;IAErB,MAAM;IACN,MAAM,UAAU;;IAEhB,MAAM,KAAK,GAAGC,SAAK;IACnB,MAAM,IAAI,GAAGA,UAAM;IACnB,MAAM,MAAM,GAAG,WAAW,CAAC;;MAEzB,MAAM;MACN,CAAC,QAAQ,CAAC,EAAE,EAAE,UAAU,CAAC,KAAK,CAAC,CAAC;MAChC,cAAc,CAAC,KAAK,GAAG;MACvB,OAAO,MAAM,GAAG,YAAY,GAAG;;IAEjCC,UAAM,WAAW,CAAC;MAChB,YAAY,MAAM,GAAG,IAAI,CAAC;MAC1B,CAAC;aACE,CAAC,MAAM,KAAK,CAAC,KAAK,EAAE,MAAM;MAC7B,YAAY,CAAC,KAAK,GAAG,KAAK,CAAC;MAC3B,CAAC;IACH;;KAEC,CAAC,CAAC;UACG,OAAO,GAAGC,YAAQ;SACnB,CAAC;UACA,CAACC,4BAAkB,EAAE;MACzB;;;IAGFF,SAAK;MACH,IAAI,EAAE,CAAC;MACP,MAAM;UACF,KAAK,CAAC,WAAW,IAAI;;;;QAIvB,GAAG,GAAG,QAAQ,IAAI,IAAI,GAAG,MAAM;OAChC;KACF;;MAEC,MAAM,GAAG,GAAG,OAAO,CAAC,aAAa,CAAC,aAAa,QAAQ,CAAC,WAAW,CAAC;;UAEhE,CAACG,sBAAY,EAAE,IAAI,CAAC;MACxB,IAAI,CAACC,qBAAW,EAAE,GAAG,CAAC,CAAC;MACvBC,YAAQ,CAAC,MAAM;QACb,KAAK,CAAC,KAAK,CAAC,OAAO,GAAG,OAAO,CAAC,KAAK;;;IAGvC,MAAM;MACJ,IAAI,cAAc,CAAC,KAAK;;MAExB,MAAM,EAAE,YAAY,EAAE,GAAG,KAAK,CAAC;UAC3B,CAAC,YAAY,EAAE;;;OAGlB;YACK,YAAY,GAAG;MACrB;;;OAGC;MACD,IAAIC,gBAAS,CAAC,YAAY,GAAG;QAC3B,YAAY,CAAC,IAAI,CAAC,CAAC,MAAM;UACvB,IAAI,MAAM,EAAE;YACV,YAAY,EAAE,CAAC;WAChB;SACF,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK;;;;QAIhB,YAAY,EAAE;OACf;;UAEG,qBAAqB;MACzB,MAAM,QAAQ,GAAG;YACX,MAAM,GAAG;UACX;;;QAGF,MAAM,CAAC,KAAK,CAAC,WAAW,GAAG;;MAE7B,MAAM,CAAC,QAAQ,CAAC,CAAC,EAAE,KAAK,CAAC,KAAK,GAAG,QAAQ,CAAC;;;MAG1C,IAAI,EAAE,EAAE,EAAE,CAAC;SACR,GAAG,CAAC,EAAE,GAAG;;iBAEL,CAAC,MAAM;;;;MAId,KAAK,CAAC,KAAK,CAAC,OAAO,GAAG,OAAO;;WAExB;;;;;eAKI;kBACG;;MAEZ,KAAK;;;;;;;"}

package/lib/components/switch/src/switch.vue_vue_type_template_id_538fbc85_lang.js

@@ -19,7 +19,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_icon = vue.resolveComponent("el-icon");
   const _component_loading = vue.resolveComponent("loading");
   return vue.openBlock(), vue.createElementBlock("div", {
-    class: vue.normalizeClass(["el-switch", { "is-disabled": _ctx.switchDisabled, "is-checked": _ctx.checked }]),
+    class: vue.normalizeClass(_ctx.switchKls),
     role: "switch",
     "aria-checked": _ctx.checked,
     "aria-disabled": _ctx.switchDisabled,

package/lib/components/switch/src/switch.vue_vue_type_template_id_538fbc85_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"switch.vue_vue_type_template_id_538fbc85_lang.js","sources":["../../../../../../packages/components/switch/src/switch.vue?vue&type=template&id=538fbc85&lang.js"],"sourcesContent":["<template>\n  <div\n    class=\"el-switch\"\n    :class=\"{ 'is-disabled': switchDisabled, 'is-checked': checked }\"\n    role=\"switch\"\n    :aria-checked=\"checked\"\n    :aria-disabled=\"switchDisabled\"\n    @click.prevent=\"switchValue\"\n  >\n    <input\n      :id=\"id\"\n      ref=\"input\"\n      class=\"el-switch__input\"\n      type=\"checkbox\"\n      :name=\"name\"\n      :true-value=\"activeValue\"\n      :false-value=\"inactiveValue\"\n      :disabled=\"switchDisabled\"\n      @change=\"handleChange\"\n      @keydown.enter=\"switchValue\"\n    />\n    <span\n      v-if=\"!inlinePrompt && (inactiveIcon || inactiveText)\"\n      :class=\"[\n        'el-switch__label',\n        'el-switch__label--left',\n        !checked ? 'is-active' : '',\n      ]\"\n    >\n      <el-icon v-if=\"inactiveIcon\"><component :is=\"inactiveIcon\" /></el-icon>\n      <span v-if=\"!inactiveIcon && inactiveText\" :aria-hidden=\"checked\">{{\n        inactiveText\n      }}</span>\n    </span>\n    <span\n      ref=\"core\"\n      class=\"el-switch__core\"\n      :style=\"{ width: (width || 40) + 'px' }\"\n    >\n      <div v-if=\"inlinePrompt\" class=\"el-switch__inner\">\n        <template v-if=\"activeIcon || inactiveIcon\">\n          <el-icon\n            v-if=\"activeIcon\"\n            class=\"is-icon\"\n            :class=\"checked ? 'is-show' : 'is-hide'\"\n          >\n            <component :is=\"activeIcon\" />\n          </el-icon>\n          <el-icon\n            v-if=\"inactiveIcon\"\n            class=\"is-icon\"\n            :class=\"!checked ? 'is-show' : 'is-hide'\"\n          >\n            <component :is=\"inactiveIcon\" />\n          </el-icon>\n        </template>\n        <template v-else-if=\"activeText || inactiveIcon\">\n          <span\n            v-if=\"activeText\"\n            class=\"is-text\"\n            :class=\"checked ? 'is-show' : 'is-hide'\"\n            :aria-hidden=\"!checked\"\n          >\n            {{ activeText.substr(0, 1) }}\n          </span>\n          <span\n            v-if=\"inactiveText\"\n            class=\"is-text\"\n            :class=\"!checked ? 'is-show' : 'is-hide'\"\n            :aria-hidden=\"checked\"\n          >\n            {{ inactiveText.substr(0, 1) }}\n          </span>\n        </template>\n      </div>\n      <div class=\"el-switch__action\">\n        <el-icon v-if=\"loading\" class=\"is-loading\"><loading /></el-icon>\n      </div>\n    </span>\n    <span\n      v-if=\"!inlinePrompt && (activeIcon || activeText)\"\n      :class=\"[\n        'el-switch__label',\n        'el-switch__label--right',\n        checked ? 'is-active' : '',\n      ]\"\n    >\n      <el-icon v-if=\"activeIcon\"><component :is=\"activeIcon\" /></el-icon>\n      <span v-if=\"!activeIcon && activeText\" :aria-hidden=\"!checked\">{{\n        activeText\n      }}</span>\n    </span>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed, onMounted, ref, nextTick, watch } from 'vue'\nimport { isPromise } from '@vue/shared'\nimport { isBool } from '@element-plus/utils/util'\nimport { throwError, debugWarn } from '@element-plus/utils/error'\nimport ElIcon from '@element-plus/components/icon'\nimport { Loading } from '@element-plus/icons-vue'\nimport {\n  UPDATE_MODEL_EVENT,\n  CHANGE_EVENT,\n  INPUT_EVENT,\n} from '@element-plus/utils/constants'\nimport { useDisabled, useFormItem } from '@element-plus/hooks'\nimport { switchProps, switchEmits } from './switch'\n\nconst COMPONENT_NAME = 'ElSwitch'\n\nexport default defineComponent({\n  name: COMPONENT_NAME,\n  components: { ElIcon, Loading },\n\n  props: switchProps,\n  emits: switchEmits,\n\n  setup(props, { emit }) {\n    const { formItem } = useFormItem()\n    const switchDisabled = useDisabled(computed(() => props.loading))\n\n    const isModelValue = ref(props.modelValue !== false)\n    const input = ref<HTMLInputElement>()\n    const core = ref<HTMLSpanElement>()\n\n    watch(\n      () => props.modelValue,\n      () => {\n        isModelValue.value = true\n      }\n    )\n\n    watch(\n      () => props.value,\n      () => {\n        isModelValue.value = false\n      }\n    )\n\n    const actualValue = computed(() => {\n      return isModelValue.value ? props.modelValue : props.value\n    })\n\n    const checked = computed(() => actualValue.value === props.activeValue)\n\n    if (![props.activeValue, props.inactiveValue].includes(actualValue.value)) {\n      emit(UPDATE_MODEL_EVENT, props.inactiveValue)\n      emit(CHANGE_EVENT, props.inactiveValue)\n      emit(INPUT_EVENT, props.inactiveValue)\n    }\n\n    watch(checked, () => {\n      input.value!.checked = checked.value\n\n      if (props.activeColor || props.inactiveColor) {\n        setBackgroundColor()\n      }\n\n      if (props.validateEvent) {\n        formItem?.validate?.('change')\n      }\n    })\n\n    const handleChange = (): void => {\n      const val = checked.value ? props.inactiveValue : props.activeValue\n      emit(UPDATE_MODEL_EVENT, val)\n      emit(CHANGE_EVENT, val)\n      emit(INPUT_EVENT, val)\n      nextTick(() => {\n        input.value!.checked = checked.value\n      })\n    }\n\n    const switchValue = (): void => {\n      if (switchDisabled.value) return\n\n      const { beforeChange } = props\n      if (!beforeChange) {\n        handleChange()\n        return\n      }\n\n      const shouldChange = beforeChange()\n\n      const isExpectType = [isPromise(shouldChange), isBool(shouldChange)].some(\n        (i) => i\n      )\n      if (!isExpectType) {\n        throwError(\n          COMPONENT_NAME,\n          'beforeChange must return type `Promise<boolean>` or `boolean`'\n        )\n      }\n\n      if (isPromise(shouldChange)) {\n        shouldChange\n          .then((result) => {\n            if (result) {\n              handleChange()\n            }\n          })\n          .catch((e) => {\n            debugWarn(COMPONENT_NAME, `some error occurred: ${e}`)\n          })\n      } else if (shouldChange) {\n        handleChange()\n      }\n    }\n\n    const setBackgroundColor = (): void => {\n      const newColor = checked.value ? props.activeColor : props.inactiveColor\n      const coreEl = core.value\n      if (props.borderColor) coreEl!.style.borderColor = props.borderColor\n      else if (!props.borderColor) coreEl!.style.borderColor = newColor\n      coreEl!.style.backgroundColor = newColor\n      ;(coreEl!.children[0] as HTMLDivElement).style.color = newColor\n    }\n\n    const focus = (): void => {\n      input.value?.focus?.()\n    }\n\n    onMounted(() => {\n      if (props.activeColor || props.inactiveColor || props.borderColor) {\n        setBackgroundColor()\n      }\n\n      input.value!.checked = checked.value\n    })\n\n    return {\n      input,\n      core,\n      switchDisabled,\n      checked,\n      handleChange,\n      switchValue,\n      focus,\n    }\n  },\n})\n</script>\n"],"names":["_createElementVNode","_normalizeClass","_createBlock"],"mappings":";;;;;;;;;;;;EAuC+B;;;;;;;;;;;wBAtC7B;IACE;IAEA;;IAECA;;;;MAIE,IAAI;MACL;MACA;MACA;MACC,eAAU;MACV,8BAAuB;MACvB,iCAA0B;;6GAEN;MACpB;;;;;;;;;;;WAUc;;;;;;;;;;;;;;;;;WAMX;;;;;yBAIJ;;;mBAGYC,kBAAU;;;gCACXC;;;;;;;;;;;;;;;;;;;;iBAaY;;;;;;6CAKF;;;;;;0BAMf;;;;;;;;;SASW;;;cAAS;;;;;;;;;"}
+{"version":3,"file":"switch.vue_vue_type_template_id_538fbc85_lang.js","sources":["../../../../../../packages/components/switch/src/switch.vue?vue&type=template&id=538fbc85&lang.js"],"sourcesContent":["<template>\n  <div\n    :class=\"switchKls\"\n    role=\"switch\"\n    :aria-checked=\"checked\"\n    :aria-disabled=\"switchDisabled\"\n    @click.prevent=\"switchValue\"\n  >\n    <input\n      :id=\"id\"\n      ref=\"input\"\n      class=\"el-switch__input\"\n      type=\"checkbox\"\n      :name=\"name\"\n      :true-value=\"activeValue\"\n      :false-value=\"inactiveValue\"\n      :disabled=\"switchDisabled\"\n      @change=\"handleChange\"\n      @keydown.enter=\"switchValue\"\n    />\n    <span\n      v-if=\"!inlinePrompt && (inactiveIcon || inactiveText)\"\n      :class=\"[\n        'el-switch__label',\n        'el-switch__label--left',\n        !checked ? 'is-active' : '',\n      ]\"\n    >\n      <el-icon v-if=\"inactiveIcon\"><component :is=\"inactiveIcon\" /></el-icon>\n      <span v-if=\"!inactiveIcon && inactiveText\" :aria-hidden=\"checked\">{{\n        inactiveText\n      }}</span>\n    </span>\n    <span\n      ref=\"core\"\n      class=\"el-switch__core\"\n      :style=\"{ width: (width || 40) + 'px' }\"\n    >\n      <div v-if=\"inlinePrompt\" class=\"el-switch__inner\">\n        <template v-if=\"activeIcon || inactiveIcon\">\n          <el-icon\n            v-if=\"activeIcon\"\n            class=\"is-icon\"\n            :class=\"checked ? 'is-show' : 'is-hide'\"\n          >\n            <component :is=\"activeIcon\" />\n          </el-icon>\n          <el-icon\n            v-if=\"inactiveIcon\"\n            class=\"is-icon\"\n            :class=\"!checked ? 'is-show' : 'is-hide'\"\n          >\n            <component :is=\"inactiveIcon\" />\n          </el-icon>\n        </template>\n        <template v-else-if=\"activeText || inactiveIcon\">\n          <span\n            v-if=\"activeText\"\n            class=\"is-text\"\n            :class=\"checked ? 'is-show' : 'is-hide'\"\n            :aria-hidden=\"!checked\"\n          >\n            {{ activeText.substr(0, 1) }}\n          </span>\n          <span\n            v-if=\"inactiveText\"\n            class=\"is-text\"\n            :class=\"!checked ? 'is-show' : 'is-hide'\"\n            :aria-hidden=\"checked\"\n          >\n            {{ inactiveText.substr(0, 1) }}\n          </span>\n        </template>\n      </div>\n      <div class=\"el-switch__action\">\n        <el-icon v-if=\"loading\" class=\"is-loading\"><loading /></el-icon>\n      </div>\n    </span>\n    <span\n      v-if=\"!inlinePrompt && (activeIcon || activeText)\"\n      :class=\"[\n        'el-switch__label',\n        'el-switch__label--right',\n        checked ? 'is-active' : '',\n      ]\"\n    >\n      <el-icon v-if=\"activeIcon\"><component :is=\"activeIcon\" /></el-icon>\n      <span v-if=\"!activeIcon && activeText\" :aria-hidden=\"!checked\">{{\n        activeText\n      }}</span>\n    </span>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed, onMounted, ref, nextTick, watch } from 'vue'\nimport { isPromise } from '@vue/shared'\nimport { isBool } from '@element-plus/utils/util'\nimport { throwError, debugWarn } from '@element-plus/utils/error'\nimport ElIcon from '@element-plus/components/icon'\nimport { Loading } from '@element-plus/icons-vue'\nimport {\n  UPDATE_MODEL_EVENT,\n  CHANGE_EVENT,\n  INPUT_EVENT,\n} from '@element-plus/utils/constants'\nimport { useDisabled, useFormItem, useSize } from '@element-plus/hooks'\nimport { switchProps, switchEmits } from './switch'\n\nconst COMPONENT_NAME = 'ElSwitch'\n\nexport default defineComponent({\n  name: COMPONENT_NAME,\n  components: { ElIcon, Loading },\n\n  props: switchProps,\n  emits: switchEmits,\n\n  setup(props, { emit }) {\n    const { formItem } = useFormItem()\n    const switchDisabled = useDisabled(computed(() => props.loading))\n\n    const switchSize = useSize()\n    const isModelValue = ref(props.modelValue !== false)\n    const input = ref<HTMLInputElement>()\n    const core = ref<HTMLSpanElement>()\n\n    const prefix = 'el-switch'\n    const switchKls = computed(() => [\n      prefix,\n      `${prefix}--${switchSize.value}`,\n      switchDisabled.value ? 'is-disabled' : '',\n      checked.value ? 'is-checked' : '',\n    ])\n\n    watch(\n      () => props.modelValue,\n      () => {\n        isModelValue.value = true\n      }\n    )\n\n    watch(\n      () => props.value,\n      () => {\n        isModelValue.value = false\n      }\n    )\n\n    const actualValue = computed(() => {\n      return isModelValue.value ? props.modelValue : props.value\n    })\n\n    const checked = computed(() => actualValue.value === props.activeValue)\n\n    if (![props.activeValue, props.inactiveValue].includes(actualValue.value)) {\n      emit(UPDATE_MODEL_EVENT, props.inactiveValue)\n      emit(CHANGE_EVENT, props.inactiveValue)\n      emit(INPUT_EVENT, props.inactiveValue)\n    }\n\n    watch(checked, () => {\n      input.value!.checked = checked.value\n\n      if (props.activeColor || props.inactiveColor) {\n        setBackgroundColor()\n      }\n\n      if (props.validateEvent) {\n        formItem?.validate?.('change')\n      }\n    })\n\n    const handleChange = (): void => {\n      const val = checked.value ? props.inactiveValue : props.activeValue\n      emit(UPDATE_MODEL_EVENT, val)\n      emit(CHANGE_EVENT, val)\n      emit(INPUT_EVENT, val)\n      nextTick(() => {\n        input.value!.checked = checked.value\n      })\n    }\n\n    const switchValue = (): void => {\n      if (switchDisabled.value) return\n\n      const { beforeChange } = props\n      if (!beforeChange) {\n        handleChange()\n        return\n      }\n\n      const shouldChange = beforeChange()\n\n      const isExpectType = [isPromise(shouldChange), isBool(shouldChange)].some(\n        (i) => i\n      )\n      if (!isExpectType) {\n        throwError(\n          COMPONENT_NAME,\n          'beforeChange must return type `Promise<boolean>` or `boolean`'\n        )\n      }\n\n      if (isPromise(shouldChange)) {\n        shouldChange\n          .then((result) => {\n            if (result) {\n              handleChange()\n            }\n          })\n          .catch((e) => {\n            debugWarn(COMPONENT_NAME, `some error occurred: ${e}`)\n          })\n      } else if (shouldChange) {\n        handleChange()\n      }\n    }\n\n    const setBackgroundColor = (): void => {\n      const newColor = checked.value ? props.activeColor : props.inactiveColor\n      const coreEl = core.value\n      if (props.borderColor) coreEl!.style.borderColor = props.borderColor\n      else if (!props.borderColor) coreEl!.style.borderColor = newColor\n      coreEl!.style.backgroundColor = newColor\n      ;(coreEl!.children[0] as HTMLDivElement).style.color = newColor\n    }\n\n    const focus = (): void => {\n      input.value?.focus?.()\n    }\n\n    onMounted(() => {\n      if (props.activeColor || props.inactiveColor || props.borderColor) {\n        setBackgroundColor()\n      }\n\n      input.value!.checked = checked.value\n    })\n\n    return {\n      input,\n      core,\n      switchDisabled,\n      checked,\n      switchKls,\n      handleChange,\n      switchValue,\n      focus,\n    }\n  },\n})\n</script>\n"],"names":["_createElementVNode","_normalizeClass","_createBlock"],"mappings":";;;;;;;;;;;;EAsC+B;;;;;;;;;;;wBArC7B;IACG;IACD;;IAECA;;;;MAIE,IAAI;MACL;MACA;MACA;MACC,eAAU;MACV,8BAAuB;MACvB,iCAA0B;;6GAEN;MACpB;;;;;;;;;;;WAUc;;;;;;;;;;;;;;;;;WAMX;;;;;yBAIJ;;;mBAGYC,kBAAU;;;gCACXC;;;;;;;;;;;;;;;;;;;;iBAaY;;;;;;6CAKF;;;;;;0BAMf;;;;;;;;;SASW;;;cAAS;;;;;;;;;"}

package/lib/components/table/src/table-layout.js

@@ -58,8 +58,7 @@ class TableLayout {
       if (this.bodyHeight.value === null) {
         scrollY = false;
       } else {
-        const body = bodyWrapper.querySelector(".el-table__body");
-        scrollY = body.offsetHeight > this.bodyHeight.value;
+        scrollY = bodyWrapper.scrollHeight > this.bodyHeight.value;
       }
       this.scrollY.value = scrollY;
       return prevScrollY !== scrollY;

package/lib/components/table/src/table-layout.js.map

@@ -1 +1 @@
-{"version":3,"file":"table-layout.js","sources":["../../../../../../packages/components/table/src/table-layout.ts"],"sourcesContent":["import { nextTick, ref, isRef } from 'vue'\nimport { hasOwn } from '@vue/shared'\nimport { isClient } from '@vueuse/core'\nimport scrollbarWidth from '@element-plus/utils/scrollbar-width'\nimport { parseHeight } from './util'\nimport type { Ref } from 'vue'\n\nimport type { TableColumnCtx } from './table-column/defaults'\nimport type { TableHeader } from './table-header'\nimport type { Table } from './table/defaults'\nimport type { Store } from './store'\nclass TableLayout<T> {\n  observers: TableHeader[]\n  table: Table<T>\n  store: Store<T>\n  columns: TableColumnCtx<T>[]\n  fit: boolean\n  showHeader: boolean\n\n  height: Ref<null | number>\n  scrollX: Ref<boolean>\n  scrollY: Ref<boolean>\n  bodyWidth: Ref<null | number>\n  fixedWidth: Ref<null | number>\n  rightFixedWidth: Ref<null | number>\n  tableHeight: Ref<null | number>\n  headerHeight: Ref<null | number> // Table Header Height\n  appendHeight: Ref<null | number> // Append Slot Height\n  footerHeight: Ref<null | number> // Table Footer Height\n  viewportHeight: Ref<null | number> // Table Height - Scroll Bar Height\n  bodyHeight: Ref<null | number> // Table Height - Table Header Height\n  bodyScrollHeight: Ref<number>\n  fixedBodyHeight: Ref<null | number> // Table Height - Table Header Height - Scroll Bar Height\n  gutterWidth: number\n  constructor(options: Record<string, any>) {\n    this.observers = []\n    this.table = null\n    this.store = null\n    this.columns = []\n    this.fit = true\n    this.showHeader = true\n    this.height = ref(null)\n    this.scrollX = ref(false)\n    this.scrollY = ref(false)\n    this.bodyWidth = ref(null)\n    this.fixedWidth = ref(null)\n    this.rightFixedWidth = ref(null)\n    this.tableHeight = ref(null)\n    this.headerHeight = ref(44)\n    this.appendHeight = ref(0)\n    this.footerHeight = ref(44)\n    this.viewportHeight = ref(null)\n    this.bodyHeight = ref(null)\n    this.bodyScrollHeight = ref(0)\n    this.fixedBodyHeight = ref(null)\n    this.gutterWidth = scrollbarWidth()\n    for (const name in options) {\n      if (hasOwn(options, name)) {\n        if (isRef(this[name])) {\n          this[name as string].value = options[name]\n        } else {\n          this[name as string] = options[name]\n        }\n      }\n    }\n    if (!this.table) {\n      throw new Error('Table is required for Table Layout')\n    }\n    if (!this.store) {\n      throw new Error('Store is required for Table Layout')\n    }\n  }\n\n  updateScrollY() {\n    const height = this.height.value\n    /**\n     * When the height is not initialized, it is null.\n     * After the table is initialized, when the height is not configured, the height is 0.\n     */\n    if (height === null) return false\n    const bodyWrapper = this.table.refs.bodyWrapper as HTMLElement\n    if (this.table.vnode.el && bodyWrapper) {\n      let scrollY = true\n      const prevScrollY = this.scrollY.value\n      /**\n       * When bodyHeight has no value,\n       * it means that the table height is not set,\n       * and the scroll bar will never appear\n       */\n      if (this.bodyHeight.value === null) {\n        scrollY = false\n      } else {\n        const body = bodyWrapper.querySelector('.el-table__body') as HTMLElement\n        scrollY = body.offsetHeight > this.bodyHeight.value\n      }\n      this.scrollY.value = scrollY\n      return prevScrollY !== scrollY\n    }\n    return false\n  }\n\n  setHeight(value: string | number, prop = 'height') {\n    if (!isClient) return\n    const el = this.table.vnode.el\n    value = parseHeight(value)\n    this.height.value = Number(value)\n\n    if (!el && (value || value === 0))\n      return nextTick(() => this.setHeight(value, prop))\n\n    if (typeof value === 'number') {\n      el.style[prop] = `${value}px`\n      this.updateElsHeight()\n    } else if (typeof value === 'string') {\n      el.style[prop] = value\n      this.updateElsHeight()\n    }\n  }\n\n  setMaxHeight(value: string | number) {\n    this.setHeight(value, 'max-height')\n  }\n\n  getFlattenColumns(): TableColumnCtx<T>[] {\n    const flattenColumns = []\n    const columns = this.table.store.states.columns.value\n    columns.forEach((column) => {\n      if (column.isColumnGroup) {\n        // eslint-disable-next-line prefer-spread\n        flattenColumns.push.apply(flattenColumns, column.columns)\n      } else {\n        flattenColumns.push(column)\n      }\n    })\n\n    return flattenColumns\n  }\n\n  updateElsHeight() {\n    if (!this.table.$ready) return nextTick(() => this.updateElsHeight())\n    const { headerWrapper, appendWrapper, footerWrapper, bodyWrapper } =\n      this.table.refs\n    this.appendHeight.value = appendWrapper ? appendWrapper.offsetHeight : 0\n    if (this.showHeader && !headerWrapper) return\n\n    const headerTrElm: HTMLElement = headerWrapper\n      ? headerWrapper.querySelector('.el-table__header tr')\n      : null\n    const noneHeader = this.headerDisplayNone(headerTrElm)\n\n    const headerHeight = (this.headerHeight.value = !this.showHeader\n      ? 0\n      : headerWrapper.offsetHeight)\n    if (\n      this.showHeader &&\n      !noneHeader &&\n      headerWrapper.offsetWidth > 0 &&\n      (this.table.store.states.columns.value || []).length > 0 &&\n      headerHeight < 2\n    ) {\n      return nextTick(() => this.updateElsHeight())\n    }\n    const tableHeight = (this.tableHeight.value =\n      this.table.vnode.el.clientHeight)\n    const footerHeight = (this.footerHeight.value = footerWrapper\n      ? footerWrapper.offsetHeight\n      : 0)\n    if (this.height.value !== null) {\n      if (this.bodyHeight.value === null) {\n        requestAnimationFrame(() => this.updateElsHeight())\n      }\n      this.bodyHeight.value =\n        tableHeight - headerHeight - footerHeight + (footerWrapper ? 1 : 0)\n      this.bodyScrollHeight.value =\n        bodyWrapper.querySelector('.el-table__body')?.scrollHeight!\n    }\n    this.fixedBodyHeight.value = this.scrollX.value\n      ? this.bodyHeight.value - this.gutterWidth\n      : this.bodyHeight.value\n\n    this.viewportHeight.value = this.scrollX.value\n      ? tableHeight - this.gutterWidth\n      : tableHeight\n\n    this.updateScrollY()\n    this.notifyObservers('scrollable')\n  }\n\n  headerDisplayNone(elm: HTMLElement) {\n    if (!elm) return true\n    let headerChild = elm\n    while (headerChild.tagName !== 'DIV') {\n      if (getComputedStyle(headerChild).display === 'none') {\n        return true\n      }\n      headerChild = headerChild.parentElement\n    }\n    return false\n  }\n\n  updateColumnsWidth() {\n    if (!isClient) return\n    const fit = this.fit\n    const bodyWidth = this.table.vnode.el.clientWidth\n    let bodyMinWidth = 0\n\n    const flattenColumns = this.getFlattenColumns()\n    const flexColumns = flattenColumns.filter(\n      (column) => typeof column.width !== 'number'\n    )\n    flattenColumns.forEach((column) => {\n      // Clean those columns whose width changed from flex to unflex\n      if (typeof column.width === 'number' && column.realWidth)\n        column.realWidth = null\n    })\n    if (flexColumns.length > 0 && fit) {\n      flattenColumns.forEach((column) => {\n        bodyMinWidth += Number(column.width || column.minWidth || 80)\n      })\n\n      const scrollYWidth = this.scrollY.value ? this.gutterWidth : 0\n\n      if (bodyMinWidth <= bodyWidth - scrollYWidth) {\n        // DON'T HAVE SCROLL BAR\n        this.scrollX.value = false\n\n        const totalFlexWidth = bodyWidth - scrollYWidth - bodyMinWidth\n\n        if (flexColumns.length === 1) {\n          flexColumns[0].realWidth =\n            Number(flexColumns[0].minWidth || 80) + totalFlexWidth\n        } else {\n          const allColumnsWidth = flexColumns.reduce(\n            (prev, column) => prev + Number(column.minWidth || 80),\n            0\n          )\n          const flexWidthPerPixel = totalFlexWidth / allColumnsWidth\n          let noneFirstWidth = 0\n\n          flexColumns.forEach((column, index) => {\n            if (index === 0) return\n            const flexWidth = Math.floor(\n              Number(column.minWidth || 80) * flexWidthPerPixel\n            )\n            noneFirstWidth += flexWidth\n            column.realWidth = Number(column.minWidth || 80) + flexWidth\n          })\n\n          flexColumns[0].realWidth =\n            Number(flexColumns[0].minWidth || 80) +\n            totalFlexWidth -\n            noneFirstWidth\n        }\n      } else {\n        // HAVE HORIZONTAL SCROLL BAR\n        this.scrollX.value = true\n        flexColumns.forEach(function (column) {\n          column.realWidth = Number(column.minWidth)\n        })\n      }\n\n      this.bodyWidth.value = Math.max(bodyMinWidth, bodyWidth)\n      this.table.state.resizeState.value.width = this.bodyWidth.value\n    } else {\n      flattenColumns.forEach((column) => {\n        if (!column.width && !column.minWidth) {\n          column.realWidth = 80\n        } else {\n          column.realWidth = Number(column.width || column.minWidth)\n        }\n        bodyMinWidth += column.realWidth\n      })\n      this.scrollX.value = bodyMinWidth > bodyWidth\n\n      this.bodyWidth.value = bodyMinWidth\n    }\n\n    const fixedColumns = this.store.states.fixedColumns.value\n\n    if (fixedColumns.length > 0) {\n      let fixedWidth = 0\n      fixedColumns.forEach(function (column) {\n        fixedWidth += Number(column.realWidth || column.width)\n      })\n\n      this.fixedWidth.value = fixedWidth\n    }\n\n    const rightFixedColumns = this.store.states.rightFixedColumns.value\n    if (rightFixedColumns.length > 0) {\n      let rightFixedWidth = 0\n      rightFixedColumns.forEach(function (column) {\n        rightFixedWidth += Number(column.realWidth || column.width)\n      })\n\n      this.rightFixedWidth.value = rightFixedWidth\n    }\n    this.notifyObservers('columns')\n  }\n\n  addObserver(observer: TableHeader) {\n    this.observers.push(observer)\n  }\n\n  removeObserver(observer: TableHeader) {\n    const index = this.observers.indexOf(observer)\n    if (index !== -1) {\n      this.observers.splice(index, 1)\n    }\n  }\n\n  notifyObservers(event: string) {\n    const observers = this.observers\n    observers.forEach((observer) => {\n      switch (event) {\n        case 'columns':\n          observer.state?.onColumnsChange(this)\n          break\n        case 'scrollable':\n          observer.state?.onScrollableChange(this)\n          break\n        default:\n          throw new Error(`Table Layout don't have event ${event}.`)\n      }\n    })\n  }\n}\n\nexport default TableLayout\n"],"names":["ref","scrollbarWidth","hasOwn","isRef","isClient","parseHeight","nextTick"],"mappings":"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"}
+{"version":3,"file":"table-layout.js","sources":["../../../../../../packages/components/table/src/table-layout.ts"],"sourcesContent":["import { nextTick, ref, isRef } from 'vue'\nimport { hasOwn } from '@vue/shared'\nimport { isClient } from '@vueuse/core'\nimport scrollbarWidth from '@element-plus/utils/scrollbar-width'\nimport { parseHeight } from './util'\nimport type { Ref } from 'vue'\n\nimport type { TableColumnCtx } from './table-column/defaults'\nimport type { TableHeader } from './table-header'\nimport type { Table } from './table/defaults'\nimport type { Store } from './store'\nclass TableLayout<T> {\n  observers: TableHeader[]\n  table: Table<T>\n  store: Store<T>\n  columns: TableColumnCtx<T>[]\n  fit: boolean\n  showHeader: boolean\n\n  height: Ref<null | number>\n  scrollX: Ref<boolean>\n  scrollY: Ref<boolean>\n  bodyWidth: Ref<null | number>\n  fixedWidth: Ref<null | number>\n  rightFixedWidth: Ref<null | number>\n  tableHeight: Ref<null | number>\n  headerHeight: Ref<null | number> // Table Header Height\n  appendHeight: Ref<null | number> // Append Slot Height\n  footerHeight: Ref<null | number> // Table Footer Height\n  viewportHeight: Ref<null | number> // Table Height - Scroll Bar Height\n  bodyHeight: Ref<null | number> // Table Height - Table Header Height\n  bodyScrollHeight: Ref<number>\n  fixedBodyHeight: Ref<null | number> // Table Height - Table Header Height - Scroll Bar Height\n  gutterWidth: number\n  constructor(options: Record<string, any>) {\n    this.observers = []\n    this.table = null\n    this.store = null\n    this.columns = []\n    this.fit = true\n    this.showHeader = true\n    this.height = ref(null)\n    this.scrollX = ref(false)\n    this.scrollY = ref(false)\n    this.bodyWidth = ref(null)\n    this.fixedWidth = ref(null)\n    this.rightFixedWidth = ref(null)\n    this.tableHeight = ref(null)\n    this.headerHeight = ref(44)\n    this.appendHeight = ref(0)\n    this.footerHeight = ref(44)\n    this.viewportHeight = ref(null)\n    this.bodyHeight = ref(null)\n    this.bodyScrollHeight = ref(0)\n    this.fixedBodyHeight = ref(null)\n    this.gutterWidth = scrollbarWidth()\n    for (const name in options) {\n      if (hasOwn(options, name)) {\n        if (isRef(this[name])) {\n          this[name as string].value = options[name]\n        } else {\n          this[name as string] = options[name]\n        }\n      }\n    }\n    if (!this.table) {\n      throw new Error('Table is required for Table Layout')\n    }\n    if (!this.store) {\n      throw new Error('Store is required for Table Layout')\n    }\n  }\n\n  updateScrollY() {\n    const height = this.height.value\n    /**\n     * When the height is not initialized, it is null.\n     * After the table is initialized, when the height is not configured, the height is 0.\n     */\n    if (height === null) return false\n    const bodyWrapper = this.table.refs.bodyWrapper as HTMLElement\n    if (this.table.vnode.el && bodyWrapper) {\n      let scrollY = true\n      const prevScrollY = this.scrollY.value\n      /**\n       * When bodyHeight has no value,\n       * it means that the table height is not set,\n       * and the scroll bar will never appear\n       */\n      if (this.bodyHeight.value === null) {\n        scrollY = false\n      } else {\n        scrollY = bodyWrapper.scrollHeight > this.bodyHeight.value\n      }\n      this.scrollY.value = scrollY\n      return prevScrollY !== scrollY\n    }\n    return false\n  }\n\n  setHeight(value: string | number, prop = 'height') {\n    if (!isClient) return\n    const el = this.table.vnode.el\n    value = parseHeight(value)\n    this.height.value = Number(value)\n\n    if (!el && (value || value === 0))\n      return nextTick(() => this.setHeight(value, prop))\n\n    if (typeof value === 'number') {\n      el.style[prop] = `${value}px`\n      this.updateElsHeight()\n    } else if (typeof value === 'string') {\n      el.style[prop] = value\n      this.updateElsHeight()\n    }\n  }\n\n  setMaxHeight(value: string | number) {\n    this.setHeight(value, 'max-height')\n  }\n\n  getFlattenColumns(): TableColumnCtx<T>[] {\n    const flattenColumns = []\n    const columns = this.table.store.states.columns.value\n    columns.forEach((column) => {\n      if (column.isColumnGroup) {\n        // eslint-disable-next-line prefer-spread\n        flattenColumns.push.apply(flattenColumns, column.columns)\n      } else {\n        flattenColumns.push(column)\n      }\n    })\n\n    return flattenColumns\n  }\n\n  updateElsHeight() {\n    if (!this.table.$ready) return nextTick(() => this.updateElsHeight())\n    const { headerWrapper, appendWrapper, footerWrapper, bodyWrapper } =\n      this.table.refs\n    this.appendHeight.value = appendWrapper ? appendWrapper.offsetHeight : 0\n    if (this.showHeader && !headerWrapper) return\n\n    const headerTrElm: HTMLElement = headerWrapper\n      ? headerWrapper.querySelector('.el-table__header tr')\n      : null\n    const noneHeader = this.headerDisplayNone(headerTrElm)\n\n    const headerHeight = (this.headerHeight.value = !this.showHeader\n      ? 0\n      : headerWrapper.offsetHeight)\n    if (\n      this.showHeader &&\n      !noneHeader &&\n      headerWrapper.offsetWidth > 0 &&\n      (this.table.store.states.columns.value || []).length > 0 &&\n      headerHeight < 2\n    ) {\n      return nextTick(() => this.updateElsHeight())\n    }\n    const tableHeight = (this.tableHeight.value =\n      this.table.vnode.el.clientHeight)\n    const footerHeight = (this.footerHeight.value = footerWrapper\n      ? footerWrapper.offsetHeight\n      : 0)\n    if (this.height.value !== null) {\n      if (this.bodyHeight.value === null) {\n        requestAnimationFrame(() => this.updateElsHeight())\n      }\n      this.bodyHeight.value =\n        tableHeight - headerHeight - footerHeight + (footerWrapper ? 1 : 0)\n      this.bodyScrollHeight.value =\n        bodyWrapper.querySelector('.el-table__body')?.scrollHeight!\n    }\n    this.fixedBodyHeight.value = this.scrollX.value\n      ? this.bodyHeight.value - this.gutterWidth\n      : this.bodyHeight.value\n\n    this.viewportHeight.value = this.scrollX.value\n      ? tableHeight - this.gutterWidth\n      : tableHeight\n\n    this.updateScrollY()\n    this.notifyObservers('scrollable')\n  }\n\n  headerDisplayNone(elm: HTMLElement) {\n    if (!elm) return true\n    let headerChild = elm\n    while (headerChild.tagName !== 'DIV') {\n      if (getComputedStyle(headerChild).display === 'none') {\n        return true\n      }\n      headerChild = headerChild.parentElement\n    }\n    return false\n  }\n\n  updateColumnsWidth() {\n    if (!isClient) return\n    const fit = this.fit\n    const bodyWidth = this.table.vnode.el.clientWidth\n    let bodyMinWidth = 0\n\n    const flattenColumns = this.getFlattenColumns()\n    const flexColumns = flattenColumns.filter(\n      (column) => typeof column.width !== 'number'\n    )\n    flattenColumns.forEach((column) => {\n      // Clean those columns whose width changed from flex to unflex\n      if (typeof column.width === 'number' && column.realWidth)\n        column.realWidth = null\n    })\n    if (flexColumns.length > 0 && fit) {\n      flattenColumns.forEach((column) => {\n        bodyMinWidth += Number(column.width || column.minWidth || 80)\n      })\n\n      const scrollYWidth = this.scrollY.value ? this.gutterWidth : 0\n\n      if (bodyMinWidth <= bodyWidth - scrollYWidth) {\n        // DON'T HAVE SCROLL BAR\n        this.scrollX.value = false\n\n        const totalFlexWidth = bodyWidth - scrollYWidth - bodyMinWidth\n\n        if (flexColumns.length === 1) {\n          flexColumns[0].realWidth =\n            Number(flexColumns[0].minWidth || 80) + totalFlexWidth\n        } else {\n          const allColumnsWidth = flexColumns.reduce(\n            (prev, column) => prev + Number(column.minWidth || 80),\n            0\n          )\n          const flexWidthPerPixel = totalFlexWidth / allColumnsWidth\n          let noneFirstWidth = 0\n\n          flexColumns.forEach((column, index) => {\n            if (index === 0) return\n            const flexWidth = Math.floor(\n              Number(column.minWidth || 80) * flexWidthPerPixel\n            )\n            noneFirstWidth += flexWidth\n            column.realWidth = Number(column.minWidth || 80) + flexWidth\n          })\n\n          flexColumns[0].realWidth =\n            Number(flexColumns[0].minWidth || 80) +\n            totalFlexWidth -\n            noneFirstWidth\n        }\n      } else {\n        // HAVE HORIZONTAL SCROLL BAR\n        this.scrollX.value = true\n        flexColumns.forEach(function (column) {\n          column.realWidth = Number(column.minWidth)\n        })\n      }\n\n      this.bodyWidth.value = Math.max(bodyMinWidth, bodyWidth)\n      this.table.state.resizeState.value.width = this.bodyWidth.value\n    } else {\n      flattenColumns.forEach((column) => {\n        if (!column.width && !column.minWidth) {\n          column.realWidth = 80\n        } else {\n          column.realWidth = Number(column.width || column.minWidth)\n        }\n        bodyMinWidth += column.realWidth\n      })\n      this.scrollX.value = bodyMinWidth > bodyWidth\n\n      this.bodyWidth.value = bodyMinWidth\n    }\n\n    const fixedColumns = this.store.states.fixedColumns.value\n\n    if (fixedColumns.length > 0) {\n      let fixedWidth = 0\n      fixedColumns.forEach(function (column) {\n        fixedWidth += Number(column.realWidth || column.width)\n      })\n\n      this.fixedWidth.value = fixedWidth\n    }\n\n    const rightFixedColumns = this.store.states.rightFixedColumns.value\n    if (rightFixedColumns.length > 0) {\n      let rightFixedWidth = 0\n      rightFixedColumns.forEach(function (column) {\n        rightFixedWidth += Number(column.realWidth || column.width)\n      })\n\n      this.rightFixedWidth.value = rightFixedWidth\n    }\n    this.notifyObservers('columns')\n  }\n\n  addObserver(observer: TableHeader) {\n    this.observers.push(observer)\n  }\n\n  removeObserver(observer: TableHeader) {\n    const index = this.observers.indexOf(observer)\n    if (index !== -1) {\n      this.observers.splice(index, 1)\n    }\n  }\n\n  notifyObservers(event: string) {\n    const observers = this.observers\n    observers.forEach((observer) => {\n      switch (event) {\n        case 'columns':\n          observer.state?.onColumnsChange(this)\n          break\n        case 'scrollable':\n          observer.state?.onScrollableChange(this)\n          break\n        default:\n          throw new Error(`Table Layout don't have event ${event}.`)\n      }\n    })\n  }\n}\n\nexport default TableLayout\n"],"names":["ref","scrollbarWidth","hasOwn","isRef","isClient","parseHeight","nextTick"],"mappings":"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"}

package/lib/components/table/src/util.d.ts

@@ -17,8 +17,8 @@ export declare const getKeysMap: <T>(array: T[], rowKey: string) => Record<strin
     index: number;
 }>;
 export declare function mergeOptions<T, K>(defaults: T, config: K): T & K;
-export declare function parseWidth(width: number | string): number;
-export declare function parseMinWidth(minWidth: any): number;
+export declare function parseWidth(width: number | string): number | string;
+export declare function parseMinWidth(minWidth: number | string): number | string;
 export declare function parseHeight(height: number | string): string | number | null;
 export declare function compose(...funcs: any[]): any;
 export declare function toggleRowStatus<T>(statusArr: T[], row: T, newVal: boolean): boolean;

package/lib/components/table/src/util.js

@@ -146,18 +146,22 @@ function mergeOptions(defaults, config) {
   return options;
 }
 function parseWidth(width) {
+  if (width === "")
+    return width;
   if (width !== void 0) {
     width = parseInt(width, 10);
-    if (isNaN(width)) {
-      width = null;
+    if (Number.isNaN(width)) {
+      width = "";
     }
   }
-  return +width;
+  return width;
 }
 function parseMinWidth(minWidth) {
-  if (typeof minWidth !== "undefined") {
+  if (minWidth === "")
+    return minWidth;
+  if (minWidth !== void 0) {
     minWidth = parseWidth(minWidth);
-    if (isNaN(minWidth)) {
+    if (Number.isNaN(minWidth)) {
       minWidth = 80;
     }
   }