@element-plus/nightly 0.0.20220104 → 0.0.20220108

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

@@ -1 +1 @@
-{"version":3,"file":"switch.vue_vue_type_script_lang.mjs","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":[],"mappings":";;;;;;;;;;;;AA4GA,oBAAoB,GAAG,WAAW;;AAElC,EAAE,IAAI,EAAE;;AAER,EAAE,KAAK,EAAE,WAAW;EAClB,OAAO,WAAW;EAClB,KAAK,CAAC,SAAS,IAAI,IAAI;;IAErB,MAAM;IACN,MAAM;;IAEN,MAAM,OAAO,GAAG,EAAE,CAAC;IACnB,MAAM,MAAM,KAAK,WAAW,EAAE;MAC5B,YAAY,CAAC,QAAQ,IAAI,CAAC;;IAE5B,MAAM,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;SACI,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,CAAC,kBAAkB,EAAE,GAAG,CAAC,CAAC;MAC9B,IAAI,CAAC,YAAY,EAAE,GAAG,CAAC;MACvB,IAAI,CAAC,WAAW,KAAK,CAAC,CAAC;MACvB,QAAQ,CAAC,MAAM;;;KAGhB,CAAC;UACI,WAAW,GAAG,MAAM;;eAEf;YACH,EAAE,YAAY;MACpB;;eAES;;MAET;;;QAGE,UAAU,CAAC,gBAAgB;OAC5B;MACD,IAAI,SAAS,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.mjs","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":[],"mappings":";;;;;;;;;;;;AA2GA,oBAAoB,GAAG,WAAW;;AAElC,EAAE,IAAI,EAAE;;AAER,EAAE,KAAK,EAAE,WAAW;EAClB,OAAO,WAAW;EAClB,KAAK,CAAC,SAAS,IAAI,IAAI;;IAErB,MAAM;IACN,MAAM,UAAU;;IAEhB,MAAM,KAAK,GAAG,KAAK;IACnB,MAAM,IAAI,GAAG,MAAM;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;;IAEjC,MAAM,WAAW,CAAC;MAChB,YAAY,MAAM,GAAG,IAAI,CAAC;MAC1B,CAAC;SACE,CAAC,MAAM,KAAK,CAAC,KAAK,EAAE,MAAM;MAC7B,YAAY,CAAC,KAAK,GAAG,KAAK,CAAC;MAC3B,CAAC;IACH;;KAEC,CAAC,CAAC;UACG,OAAO,GAAG,QAAQ;SACnB,CAAC;UACA,CAAC,kBAAkB,EAAE;MACzB;;;IAGF,KAAK;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,CAAC,YAAY,EAAE,IAAI,CAAC;MACxB,IAAI,CAAC,WAAW,EAAE,GAAG,CAAC,CAAC;MACvB,QAAQ,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,IAAI,SAAS,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;;aAEL,CAAC,MAAM;;;;MAId,KAAK,CAAC,KAAK,CAAC,OAAO,GAAG,OAAO;;WAExB;;;;;eAKI;kBACG;;MAEZ,KAAK;;;;;;;"}

package/es/components/switch/src/switch.vue_vue_type_template_id_538fbc85_lang.mjs

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

package/es/components/switch/src/switch.vue_vue_type_template_id_538fbc85_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"switch.vue_vue_type_template_id_538fbc85_lang.mjs","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;;qGAEN;MACpB;;;;;;;;;;;WAUc;;;;;;;;;;;;;;;;;WAMX;;;;;yBAIJ;;;mBAGYC,cAAU;;;4BACXC;;;;;;;;;;;;;;;;;;;;iBAaY;;;;;;yCAKF;;;;;;0BAMf;;;;;;;;;SASW;;;cAAS;;;;;;;;;"}
+{"version":3,"file":"switch.vue_vue_type_template_id_538fbc85_lang.mjs","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;;qGAEN;MACpB;;;;;;;;;;;WAUc;;;;;;;;;;;;;;;;;WAMX;;;;;yBAIJ;;;mBAGYC,cAAU;;;4BACXC;;;;;;;;;;;;;;;;;;;;iBAaY;;;;;;yCAKF;;;;;;0BAMf;;;;;;;;;SASW;;;cAAS;;;;;;;;;"}

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

@@ -120,10 +120,17 @@ export declare const ElTable: import("../../utils/types").SFCWithInstall<import(
         height?: undefined;
         'max-height'?: undefined;
     }>;
+    tableBodyStyles: import("vue").ComputedRef<{
+        width: string;
+    }>;
     emptyBlockStyle: import("vue").ComputedRef<{
         width: string;
         height: string;
     } | null>;
+    borderBottomPatchStyles: import("vue").ComputedRef<{
+        bottom: string;
+        right: string;
+    }>;
     debouncedUpdateLayout: import("lodash").DebouncedFunc<() => void>;
     handleFixedMousewheel: (event: any, data: any) => void;
     fixedHeight: import("vue").ComputedRef<{
@@ -158,6 +165,8 @@ export declare const ElTable: import("../../utils/types").SFCWithInstall<import(
     t: import("../..").Translator;
     setDragVisible: (visible: boolean) => void;
     context: import("./src/table/defaults").Table<any>;
+    computedSumText: import("vue").ComputedRef<string>;
+    computedEmptyText: import("vue").ComputedRef<string>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("select" | "select-all" | "expand-change" | "current-change" | "selection-change" | "cell-mouse-enter" | "cell-mouse-leave" | "cell-contextmenu" | "cell-click" | "cell-dblclick" | "row-click" | "row-contextmenu" | "row-dblclick" | "header-click" | "header-contextmenu" | "sort-change" | "filter-change" | "header-dragend")[], "select" | "select-all" | "expand-change" | "current-change" | "selection-change" | "cell-mouse-enter" | "cell-mouse-leave" | "cell-contextmenu" | "cell-click" | "cell-dblclick" | "row-click" | "row-contextmenu" | "row-dblclick" | "header-click" | "header-contextmenu" | "sort-change" | "filter-change" | "header-dragend", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     data?: unknown;
     size?: unknown;

package/es/components/table/src/table/style-helper.d.ts

@@ -51,5 +51,12 @@ declare function useStyle<T>(props: TableProps<T>, layout: TableLayout<T>, store
         height: null;
     }>;
     doLayout: () => void;
+    tableBodyStyles: import("vue").ComputedRef<{
+        width: string;
+    }>;
+    borderBottomPatchStyles: import("vue").ComputedRef<{
+        bottom: string;
+        right: string;
+    }>;
 };
 export default useStyle;

package/es/components/table/src/table/style-helper.mjs

@@ -1,5 +1,4 @@
 import { ref, watchEffect, watch, unref, computed, onMounted, nextTick, onUnmounted } from 'vue';
-import throttle from 'lodash/throttle';
 import { addResizeListener, removeResizeListener } from '../../../../utils/resize-event.mjs';
 import { on, off } from '../../../../utils/dom.mjs';
 import '../../../../hooks/index.mjs';
@@ -56,6 +55,17 @@ function useStyle(props, layout, store, table) {
   const shouldUpdateHeight = computed(() => {
     return props.height || props.maxHeight || store.states.fixedColumns.value.length > 0 || store.states.rightFixedColumns.value.length > 0;
   });
+  const tableBodyStyles = computed(() => {
+    return {
+      width: layout.bodyWidth.value ? `${layout.bodyWidth.value}px` : ""
+    };
+  });
+  const borderBottomPatchStyles = computed(() => {
+    return {
+      bottom: `${layout.gutterWidth}px`,
+      right: `${layout.gutterWidth}px`
+    };
+  });
   const doLayout = () => {
     if (shouldUpdateHeight.value) {
       layout.updateElsHeight();
@@ -92,27 +102,18 @@ function useStyle(props, layout, store, table) {
     el.className = classList.join(" ");
   };
   const setScrollClass = (className) => {
-    const { bodyWrapper } = table.refs;
-    setScrollClassByEl(bodyWrapper, className);
+    const { tableWrapper } = table.refs;
+    setScrollClassByEl(tableWrapper, className);
   };
-  const syncPostion = throttle(function() {
+  const syncPostion = function() {
     if (!table.refs.bodyWrapper)
       return;
-    const { scrollLeft, scrollTop, offsetWidth, scrollWidth } = table.refs.bodyWrapper;
-    const {
-      headerWrapper,
-      footerWrapper,
-      fixedBodyWrapper,
-      rightFixedBodyWrapper
-    } = table.refs;
+    const { scrollLeft, offsetWidth, scrollWidth } = table.refs.bodyWrapper;
+    const { headerWrapper, footerWrapper } = table.refs;
     if (headerWrapper)
       headerWrapper.scrollLeft = scrollLeft;
     if (footerWrapper)
       footerWrapper.scrollLeft = scrollLeft;
-    if (fixedBodyWrapper)
-      fixedBodyWrapper.scrollTop = scrollTop;
-    if (rightFixedBodyWrapper)
-      rightFixedBodyWrapper.scrollTop = scrollTop;
     const maxScrollLeftPosition = scrollWidth - offsetWidth - 1;
     if (scrollLeft >= maxScrollLeftPosition) {
       setScrollClass("is-scrolling-right");
@@ -121,7 +122,7 @@ function useStyle(props, layout, store, table) {
     } else {
       setScrollClass("is-scrolling-middle");
     }
-  }, 10);
+  };
   const bindEvents = () => {
     table.refs.bodyWrapper.addEventListener("scroll", syncPostion, {
       passive: true
@@ -273,7 +274,9 @@ function useStyle(props, layout, store, table) {
     resizeProxyVisible,
     bodyWidth,
     resizeState,
-    doLayout
+    doLayout,
+    tableBodyStyles,
+    borderBottomPatchStyles
   };
 }
 

package/es/components/table/src/table/style-helper.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style-helper.mjs","sources":["../../../../../../../packages/components/table/src/table/style-helper.ts"],"sourcesContent":["import {\n  onMounted,\n  onUnmounted,\n  computed,\n  ref,\n  watchEffect,\n  watch,\n  unref,\n  nextTick,\n} from 'vue'\nimport throttle from 'lodash/throttle'\nimport {\n  addResizeListener,\n  removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { on, off } from '@element-plus/utils/dom'\nimport { useSize } from '@element-plus/hooks'\nimport { parseHeight } from '../util'\n\nimport type { ResizableElement } from '@element-plus/utils/resize-event'\nimport type { Table, TableProps } from './defaults'\nimport type { Store } from '../store'\nimport type TableLayout from '../table-layout'\nimport type { TableColumnCtx } from '../table-column/defaults'\n\nfunction useStyle<T>(\n  props: TableProps<T>,\n  layout: TableLayout<T>,\n  store: Store<T>,\n  table: Table<T>\n) {\n  const isHidden = ref(false)\n  const renderExpanded = ref(null)\n  const resizeProxyVisible = ref(false)\n  const setDragVisible = (visible: boolean) => {\n    resizeProxyVisible.value = visible\n  }\n  const resizeState = ref({\n    width: null,\n    height: null,\n  })\n  const isGroup = ref(false)\n\n  watchEffect(() => {\n    layout.setHeight(props.height)\n  })\n  watchEffect(() => {\n    layout.setMaxHeight(props.maxHeight)\n  })\n  watch(\n    () => [props.currentRowKey, store.states.rowKey],\n    ([currentRowKey, rowKey]) => {\n      if (!unref(rowKey)) return\n      store.setCurrentRowKey(`${currentRowKey}`)\n    },\n    {\n      immediate: true,\n    }\n  )\n  watch(\n    () => props.data,\n    (data) => {\n      table.store.commit('setData', data)\n    },\n    {\n      immediate: true,\n      deep: true,\n    }\n  )\n  watchEffect(() => {\n    if (props.expandRowKeys) {\n      store.setExpandRowKeysAdapter(props.expandRowKeys)\n    }\n  })\n\n  const handleMouseLeave = () => {\n    table.store.commit('setHoverRow', null)\n    if (table.hoverState) table.hoverState = null\n  }\n\n  const handleHeaderFooterMousewheel = (event, data) => {\n    const { pixelX, pixelY } = data\n    if (Math.abs(pixelX) >= Math.abs(pixelY)) {\n      table.refs.bodyWrapper.scrollLeft += data.pixelX / 5\n    }\n  }\n\n  const shouldUpdateHeight = computed(() => {\n    return (\n      props.height ||\n      props.maxHeight ||\n      store.states.fixedColumns.value.length > 0 ||\n      store.states.rightFixedColumns.value.length > 0\n    )\n  })\n\n  const doLayout = () => {\n    if (shouldUpdateHeight.value) {\n      layout.updateElsHeight()\n    }\n    layout.updateColumnsWidth()\n    requestAnimationFrame(syncPostion)\n  }\n  onMounted(async () => {\n    setScrollClass('is-scrolling-left')\n    store.updateColumns()\n    await nextTick()\n    bindEvents()\n    requestAnimationFrame(doLayout)\n\n    resizeState.value = {\n      width: table.vnode.el.offsetWidth,\n      height: table.vnode.el.offsetHeight,\n    }\n\n    // init filters\n    store.states.columns.value.forEach((column: TableColumnCtx<T>) => {\n      if (column.filteredValue && column.filteredValue.length) {\n        table.store.commit('filterChange', {\n          column,\n          values: column.filteredValue,\n          silent: true,\n        })\n      }\n    })\n    table.$ready = true\n  })\n  const setScrollClassByEl = (el: HTMLElement, className: string) => {\n    if (!el) return\n    const classList = Array.from(el.classList).filter(\n      (item) => !item.startsWith('is-scrolling-')\n    )\n    classList.push(layout.scrollX.value ? className : 'is-scrolling-none')\n    el.className = classList.join(' ')\n  }\n  const setScrollClass = (className: string) => {\n    const { bodyWrapper } = table.refs\n    setScrollClassByEl(bodyWrapper, className)\n  }\n  const syncPostion = throttle(function () {\n    if (!table.refs.bodyWrapper) return\n    const { scrollLeft, scrollTop, offsetWidth, scrollWidth } =\n      table.refs.bodyWrapper\n    const {\n      headerWrapper,\n      footerWrapper,\n      fixedBodyWrapper,\n      rightFixedBodyWrapper,\n    } = table.refs\n    if (headerWrapper) headerWrapper.scrollLeft = scrollLeft\n    if (footerWrapper) footerWrapper.scrollLeft = scrollLeft\n    if (fixedBodyWrapper) fixedBodyWrapper.scrollTop = scrollTop\n    if (rightFixedBodyWrapper) rightFixedBodyWrapper.scrollTop = scrollTop\n    const maxScrollLeftPosition = scrollWidth - offsetWidth - 1\n    if (scrollLeft >= maxScrollLeftPosition) {\n      setScrollClass('is-scrolling-right')\n    } else if (scrollLeft === 0) {\n      setScrollClass('is-scrolling-left')\n    } else {\n      setScrollClass('is-scrolling-middle')\n    }\n  }, 10)\n\n  const bindEvents = () => {\n    table.refs.bodyWrapper.addEventListener('scroll', syncPostion, {\n      passive: true,\n    })\n    if (props.fit) {\n      addResizeListener(table.vnode.el as ResizableElement, resizeListener)\n    } else {\n      on(window, 'resize', doLayout)\n    }\n  }\n  onUnmounted(() => {\n    unbindEvents()\n  })\n  const unbindEvents = () => {\n    table.refs.bodyWrapper?.removeEventListener('scroll', syncPostion, true)\n    if (props.fit) {\n      removeResizeListener(table.vnode.el as ResizableElement, resizeListener)\n    } else {\n      off(window, 'resize', doLayout)\n    }\n  }\n  const resizeListener = () => {\n    if (!table.$ready) return\n    let shouldUpdateLayout = false\n    const el = table.vnode.el\n    const { width: oldWidth, height: oldHeight } = resizeState.value\n\n    const width = el.offsetWidth\n    if (oldWidth !== width) {\n      shouldUpdateLayout = true\n    }\n\n    const height = el.offsetHeight\n    if ((props.height || shouldUpdateHeight.value) && oldHeight !== height) {\n      shouldUpdateLayout = true\n    }\n\n    if (shouldUpdateLayout) {\n      resizeState.value = {\n        width,\n        height,\n      }\n      doLayout()\n    }\n  }\n  const tableSize = useSize()\n  const bodyWidth = computed(() => {\n    const { bodyWidth: bodyWidth_, scrollY, gutterWidth } = layout\n    return bodyWidth_.value\n      ? `${(bodyWidth_.value as number) - (scrollY.value ? gutterWidth : 0)}px`\n      : ''\n  })\n  const bodyHeight = computed(() => {\n    const headerHeight = layout.headerHeight.value || 0\n    const bodyHeight = layout.bodyHeight.value\n    const footerHeight = layout.footerHeight.value || 0\n    if (props.height) {\n      return {\n        height: bodyHeight ? `${bodyHeight}px` : '',\n      }\n    } else if (props.maxHeight) {\n      const maxHeight = parseHeight(props.maxHeight)\n      if (typeof maxHeight === 'number') {\n        return {\n          'max-height': `${\n            maxHeight - footerHeight - (props.showHeader ? headerHeight : 0)\n          }px`,\n        }\n      }\n    }\n    return {}\n  })\n  const emptyBlockStyle = computed(() => {\n    if (props.data && props.data.length) return null\n    let height = '100%'\n    if (layout.appendHeight.value) {\n      height = `calc(100% - ${layout.appendHeight.value}px)`\n    }\n    return {\n      width: bodyWidth.value,\n      height,\n    }\n  })\n  /**\n   * fix layout\n   */\n  const handleFixedMousewheel = (event, data) => {\n    const bodyWrapper = table.refs.bodyWrapper\n    if (Math.abs(data.spinY) > 0) {\n      const currentScrollTop = bodyWrapper.scrollTop\n      if (data.pixelY < 0 && currentScrollTop !== 0) {\n        event.preventDefault()\n      }\n      if (\n        data.pixelY > 0 &&\n        bodyWrapper.scrollHeight - bodyWrapper.clientHeight > currentScrollTop\n      ) {\n        event.preventDefault()\n      }\n      bodyWrapper.scrollTop += Math.ceil(data.pixelY / 5)\n    } else {\n      bodyWrapper.scrollLeft += Math.ceil(data.pixelX / 5)\n    }\n  }\n  const fixedHeight = computed(() => {\n    if (props.maxHeight) {\n      if (props.showSummary) {\n        return {\n          bottom: 0,\n        }\n      }\n      return {\n        bottom:\n          layout.scrollX.value && props.data.length\n            ? `${layout.gutterWidth}px`\n            : '',\n      }\n    } else {\n      if (props.showSummary) {\n        return {\n          height: layout.tableHeight.value\n            ? `${layout.tableHeight.value}px`\n            : '',\n        }\n      }\n      return {\n        height: layout.viewportHeight.value\n          ? `${layout.viewportHeight.value}px`\n          : '',\n      }\n    }\n  })\n  const fixedBodyHeight = computed(() => {\n    if (props.height) {\n      return {\n        height: layout.fixedBodyHeight.value\n          ? `${layout.fixedBodyHeight.value}px`\n          : '',\n      }\n    } else if (props.maxHeight) {\n      let maxHeight = parseHeight(props.maxHeight)\n      if (typeof maxHeight === 'number') {\n        maxHeight = layout.scrollX.value\n          ? maxHeight - layout.gutterWidth\n          : maxHeight\n        if (props.showHeader) {\n          maxHeight -= layout.headerHeight.value\n        }\n        maxHeight -= layout.footerHeight.value\n        return {\n          'max-height': `${maxHeight}px`,\n        }\n      }\n    }\n    return {}\n  })\n\n  return {\n    isHidden,\n    renderExpanded,\n    setDragVisible,\n    isGroup,\n    handleMouseLeave,\n    handleHeaderFooterMousewheel,\n    tableSize,\n    bodyHeight,\n    emptyBlockStyle,\n    handleFixedMousewheel,\n    fixedHeight,\n    fixedBodyHeight,\n    resizeProxyVisible,\n    bodyWidth,\n    resizeState,\n    doLayout,\n  }\n}\n\nexport default useStyle\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"style-helper.mjs","sources":["../../../../../../../packages/components/table/src/table/style-helper.ts"],"sourcesContent":["import {\n  onMounted,\n  onUnmounted,\n  computed,\n  ref,\n  watchEffect,\n  watch,\n  unref,\n  nextTick,\n} from 'vue'\nimport {\n  addResizeListener,\n  removeResizeListener,\n} from '@element-plus/utils/resize-event'\nimport { on, off } from '@element-plus/utils/dom'\nimport { useSize } from '@element-plus/hooks'\nimport { parseHeight } from '../util'\n\nimport type { ResizableElement } from '@element-plus/utils/resize-event'\nimport type { Table, TableProps } from './defaults'\nimport type { Store } from '../store'\nimport type TableLayout from '../table-layout'\nimport type { TableColumnCtx } from '../table-column/defaults'\n\nfunction useStyle<T>(\n  props: TableProps<T>,\n  layout: TableLayout<T>,\n  store: Store<T>,\n  table: Table<T>\n) {\n  const isHidden = ref(false)\n  const renderExpanded = ref(null)\n  const resizeProxyVisible = ref(false)\n  const setDragVisible = (visible: boolean) => {\n    resizeProxyVisible.value = visible\n  }\n  const resizeState = ref({\n    width: null,\n    height: null,\n  })\n  const isGroup = ref(false)\n\n  watchEffect(() => {\n    layout.setHeight(props.height)\n  })\n  watchEffect(() => {\n    layout.setMaxHeight(props.maxHeight)\n  })\n  watch(\n    () => [props.currentRowKey, store.states.rowKey],\n    ([currentRowKey, rowKey]) => {\n      if (!unref(rowKey)) return\n      store.setCurrentRowKey(`${currentRowKey}`)\n    },\n    {\n      immediate: true,\n    }\n  )\n  watch(\n    () => props.data,\n    (data) => {\n      table.store.commit('setData', data)\n    },\n    {\n      immediate: true,\n      deep: true,\n    }\n  )\n  watchEffect(() => {\n    if (props.expandRowKeys) {\n      store.setExpandRowKeysAdapter(props.expandRowKeys)\n    }\n  })\n\n  const handleMouseLeave = () => {\n    table.store.commit('setHoverRow', null)\n    if (table.hoverState) table.hoverState = null\n  }\n\n  const handleHeaderFooterMousewheel = (event, data) => {\n    const { pixelX, pixelY } = data\n    if (Math.abs(pixelX) >= Math.abs(pixelY)) {\n      table.refs.bodyWrapper.scrollLeft += data.pixelX / 5\n    }\n  }\n\n  const shouldUpdateHeight = computed(() => {\n    return (\n      props.height ||\n      props.maxHeight ||\n      store.states.fixedColumns.value.length > 0 ||\n      store.states.rightFixedColumns.value.length > 0\n    )\n  })\n\n  const tableBodyStyles = computed(() => {\n    return {\n      width: layout.bodyWidth.value ? `${layout.bodyWidth.value}px` : '',\n    }\n  })\n\n  const borderBottomPatchStyles = computed(() => {\n    return {\n      bottom: `${layout.gutterWidth}px`,\n      right: `${layout.gutterWidth}px`,\n    }\n  })\n\n  const doLayout = () => {\n    if (shouldUpdateHeight.value) {\n      layout.updateElsHeight()\n    }\n    layout.updateColumnsWidth()\n    requestAnimationFrame(syncPostion)\n  }\n  onMounted(async () => {\n    setScrollClass('is-scrolling-left')\n    store.updateColumns()\n    await nextTick()\n    bindEvents()\n    requestAnimationFrame(doLayout)\n\n    resizeState.value = {\n      width: table.vnode.el.offsetWidth,\n      height: table.vnode.el.offsetHeight,\n    }\n\n    // init filters\n    store.states.columns.value.forEach((column: TableColumnCtx<T>) => {\n      if (column.filteredValue && column.filteredValue.length) {\n        table.store.commit('filterChange', {\n          column,\n          values: column.filteredValue,\n          silent: true,\n        })\n      }\n    })\n    table.$ready = true\n  })\n  const setScrollClassByEl = (el: HTMLElement, className: string) => {\n    if (!el) return\n    const classList = Array.from(el.classList).filter(\n      (item) => !item.startsWith('is-scrolling-')\n    )\n    classList.push(layout.scrollX.value ? className : 'is-scrolling-none')\n    el.className = classList.join(' ')\n  }\n  const setScrollClass = (className: string) => {\n    const { tableWrapper } = table.refs\n    setScrollClassByEl(tableWrapper, className)\n  }\n  const syncPostion = function () {\n    if (!table.refs.bodyWrapper) return\n    const { scrollLeft, offsetWidth, scrollWidth } = table.refs.bodyWrapper\n    const { headerWrapper, footerWrapper } = table.refs\n    if (headerWrapper) headerWrapper.scrollLeft = scrollLeft\n    if (footerWrapper) footerWrapper.scrollLeft = scrollLeft\n    const maxScrollLeftPosition = scrollWidth - offsetWidth - 1\n    if (scrollLeft >= maxScrollLeftPosition) {\n      setScrollClass('is-scrolling-right')\n    } else if (scrollLeft === 0) {\n      setScrollClass('is-scrolling-left')\n    } else {\n      setScrollClass('is-scrolling-middle')\n    }\n  }\n\n  const bindEvents = () => {\n    table.refs.bodyWrapper.addEventListener('scroll', syncPostion, {\n      passive: true,\n    })\n    if (props.fit) {\n      addResizeListener(table.vnode.el as ResizableElement, resizeListener)\n    } else {\n      on(window, 'resize', doLayout)\n    }\n  }\n  onUnmounted(() => {\n    unbindEvents()\n  })\n  const unbindEvents = () => {\n    table.refs.bodyWrapper?.removeEventListener('scroll', syncPostion, true)\n    if (props.fit) {\n      removeResizeListener(table.vnode.el as ResizableElement, resizeListener)\n    } else {\n      off(window, 'resize', doLayout)\n    }\n  }\n  const resizeListener = () => {\n    if (!table.$ready) return\n    let shouldUpdateLayout = false\n    const el = table.vnode.el\n    const { width: oldWidth, height: oldHeight } = resizeState.value\n\n    const width = el.offsetWidth\n    if (oldWidth !== width) {\n      shouldUpdateLayout = true\n    }\n\n    const height = el.offsetHeight\n    if ((props.height || shouldUpdateHeight.value) && oldHeight !== height) {\n      shouldUpdateLayout = true\n    }\n\n    if (shouldUpdateLayout) {\n      resizeState.value = {\n        width,\n        height,\n      }\n      doLayout()\n    }\n  }\n  const tableSize = useSize()\n  const bodyWidth = computed(() => {\n    const { bodyWidth: bodyWidth_, scrollY, gutterWidth } = layout\n    return bodyWidth_.value\n      ? `${(bodyWidth_.value as number) - (scrollY.value ? gutterWidth : 0)}px`\n      : ''\n  })\n  const bodyHeight = computed(() => {\n    const headerHeight = layout.headerHeight.value || 0\n    const bodyHeight = layout.bodyHeight.value\n    const footerHeight = layout.footerHeight.value || 0\n    if (props.height) {\n      return {\n        height: bodyHeight ? `${bodyHeight}px` : '',\n      }\n    } else if (props.maxHeight) {\n      const maxHeight = parseHeight(props.maxHeight)\n      if (typeof maxHeight === 'number') {\n        return {\n          'max-height': `${\n            maxHeight - footerHeight - (props.showHeader ? headerHeight : 0)\n          }px`,\n        }\n      }\n    }\n    return {}\n  })\n  const emptyBlockStyle = computed(() => {\n    if (props.data && props.data.length) return null\n    let height = '100%'\n    if (layout.appendHeight.value) {\n      height = `calc(100% - ${layout.appendHeight.value}px)`\n    }\n    return {\n      width: bodyWidth.value,\n      height,\n    }\n  })\n  /**\n   * fix layout\n   */\n  const handleFixedMousewheel = (event, data) => {\n    const bodyWrapper = table.refs.bodyWrapper\n    if (Math.abs(data.spinY) > 0) {\n      const currentScrollTop = bodyWrapper.scrollTop\n      if (data.pixelY < 0 && currentScrollTop !== 0) {\n        event.preventDefault()\n      }\n      if (\n        data.pixelY > 0 &&\n        bodyWrapper.scrollHeight - bodyWrapper.clientHeight > currentScrollTop\n      ) {\n        event.preventDefault()\n      }\n      bodyWrapper.scrollTop += Math.ceil(data.pixelY / 5)\n    } else {\n      bodyWrapper.scrollLeft += Math.ceil(data.pixelX / 5)\n    }\n  }\n  const fixedHeight = computed(() => {\n    if (props.maxHeight) {\n      if (props.showSummary) {\n        return {\n          bottom: 0,\n        }\n      }\n      return {\n        bottom:\n          layout.scrollX.value && props.data.length\n            ? `${layout.gutterWidth}px`\n            : '',\n      }\n    } else {\n      if (props.showSummary) {\n        return {\n          height: layout.tableHeight.value\n            ? `${layout.tableHeight.value}px`\n            : '',\n        }\n      }\n      return {\n        height: layout.viewportHeight.value\n          ? `${layout.viewportHeight.value}px`\n          : '',\n      }\n    }\n  })\n  const fixedBodyHeight = computed(() => {\n    if (props.height) {\n      return {\n        height: layout.fixedBodyHeight.value\n          ? `${layout.fixedBodyHeight.value}px`\n          : '',\n      }\n    } else if (props.maxHeight) {\n      let maxHeight = parseHeight(props.maxHeight)\n      if (typeof maxHeight === 'number') {\n        maxHeight = layout.scrollX.value\n          ? maxHeight - layout.gutterWidth\n          : maxHeight\n        if (props.showHeader) {\n          maxHeight -= layout.headerHeight.value\n        }\n        maxHeight -= layout.footerHeight.value\n        return {\n          'max-height': `${maxHeight}px`,\n        }\n      }\n    }\n    return {}\n  })\n\n  return {\n    isHidden,\n    renderExpanded,\n    setDragVisible,\n    isGroup,\n    handleMouseLeave,\n    handleHeaderFooterMousewheel,\n    tableSize,\n    bodyHeight,\n    emptyBlockStyle,\n    handleFixedMousewheel,\n    fixedHeight,\n    fixedBodyHeight,\n    resizeProxyVisible,\n    bodyWidth,\n    resizeState,\n    doLayout,\n    tableBodyStyles,\n    borderBottomPatchStyles,\n  }\n}\n\nexport default useStyle\n"],"names":[],"mappings":";;;;;;;AAiBA,SAAS,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE;AAC/C,EAAE,MAAM,QAAQ,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC;AAC9B,EAAE,MAAM,cAAc,GAAG,GAAG,CAAC,IAAI,CAAC,CAAC;AACnC,EAAE,MAAM,kBAAkB,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC;AACxC,EAAE,MAAM,cAAc,GAAG,CAAC,OAAO,KAAK;AACtC,IAAI,kBAAkB,CAAC,KAAK,GAAG,OAAO,CAAC;AACvC,GAAG,CAAC;AACJ,EAAE,MAAM,WAAW,GAAG,GAAG,CAAC;AAC1B,IAAI,KAAK,EAAE,IAAI;AACf,IAAI,MAAM,EAAE,IAAI;AAChB,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,OAAO,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC;AAC7B,EAAE,WAAW,CAAC,MAAM;AACpB,IAAI,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;AACnC,GAAG,CAAC,CAAC;AACL,EAAE,WAAW,CAAC,MAAM;AACpB,IAAI,MAAM,CAAC,YAAY,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;AACzC,GAAG,CAAC,CAAC;AACL,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,aAAa,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,aAAa,EAAE,MAAM,CAAC,KAAK;AACvF,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;AACtB,MAAM,OAAO;AACb,IAAI,KAAK,CAAC,gBAAgB,CAAC,CAAC,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;AAC/C,GAAG,EAAE;AACL,IAAI,SAAS,EAAE,IAAI;AACnB,GAAG,CAAC,CAAC;AACL,EAAE,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,EAAE,CAAC,IAAI,KAAK;AACpC,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC;AACxC,GAAG,EAAE;AACL,IAAI,SAAS,EAAE,IAAI;AACnB,IAAI,IAAI,EAAE,IAAI;AACd,GAAG,CAAC,CAAC;AACL,EAAE,WAAW,CAAC,MAAM;AACpB,IAAI,IAAI,KAAK,CAAC,aAAa,EAAE;AAC7B,MAAM,KAAK,CAAC,uBAAuB,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC;AACzD,KAAK;AACL,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,gBAAgB,GAAG,MAAM;AACjC,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC;AAC5C,IAAI,IAAI,KAAK,CAAC,UAAU;AACxB,MAAM,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC;AAC9B,GAAG,CAAC;AACJ,EAAE,MAAM,4BAA4B,GAAG,CAAC,KAAK,EAAE,IAAI,KAAK;AACxD,IAAI,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;AACpC,IAAI,IAAI,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;AAC9C,MAAM,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,UAAU,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC;AAC3D,KAAK;AACL,GAAG,CAAC;AACJ,EAAE,MAAM,kBAAkB,GAAG,QAAQ,CAAC,MAAM;AAC5C,IAAI,OAAO,KAAK,CAAC,MAAM,IAAI,KAAK,CAAC,SAAS,IAAI,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,KAAK,CAAC,MAAM,CAAC,iBAAiB,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;AAC5I,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,eAAe,GAAG,QAAQ,CAAC,MAAM;AACzC,IAAI,OAAO;AACX,MAAM,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,KAAK,GAAG,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE,CAAC,GAAG,EAAE;AACxE,KAAK,CAAC;AACN,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,uBAAuB,GAAG,QAAQ,CAAC,MAAM;AACjD,IAAI,OAAO;AACX,MAAM,MAAM,EAAE,CAAC,EAAE,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC;AACvC,MAAM,KAAK,EAAE,CAAC,EAAE,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC;AACtC,KAAK,CAAC;AACN,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,QAAQ,GAAG,MAAM;AACzB,IAAI,IAAI,kBAAkB,CAAC,KAAK,EAAE;AAClC,MAAM,MAAM,CAAC,eAAe,EAAE,CAAC;AAC/B,KAAK;AACL,IAAI,MAAM,CAAC,kBAAkB,EAAE,CAAC;AAChC,IAAI,qBAAqB,CAAC,WAAW,CAAC,CAAC;AACvC,GAAG,CAAC;AACJ,EAAE,SAAS,CAAC,YAAY;AACxB,IAAI,cAAc,CAAC,mBAAmB,CAAC,CAAC;AACxC,IAAI,KAAK,CAAC,aAAa,EAAE,CAAC;AAC1B,IAAI,MAAM,QAAQ,EAAE,CAAC;AACrB,IAAI,UAAU,EAAE,CAAC;AACjB,IAAI,qBAAqB,CAAC,QAAQ,CAAC,CAAC;AACpC,IAAI,WAAW,CAAC,KAAK,GAAG;AACxB,MAAM,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,WAAW;AACvC,MAAM,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,YAAY;AACzC,KAAK,CAAC;AACN,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,MAAM,KAAK;AACnD,MAAM,IAAI,MAAM,CAAC,aAAa,IAAI,MAAM,CAAC,aAAa,CAAC,MAAM,EAAE;AAC/D,QAAQ,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,cAAc,EAAE;AAC3C,UAAU,MAAM;AAChB,UAAU,MAAM,EAAE,MAAM,CAAC,aAAa;AACtC,UAAU,MAAM,EAAE,IAAI;AACtB,SAAS,CAAC,CAAC;AACX,OAAO;AACP,KAAK,CAAC,CAAC;AACP,IAAI,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC;AACxB,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,kBAAkB,GAAG,CAAC,EAAE,EAAE,SAAS,KAAK;AAChD,IAAI,IAAI,CAAC,EAAE;AACX,MAAM,OAAO;AACb,IAAI,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,CAAC,IAAI,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,eAAe,CAAC,CAAC,CAAC;AACnG,IAAI,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,GAAG,SAAS,GAAG,mBAAmB,CAAC,CAAC;AAC3E,IAAI,EAAE,CAAC,SAAS,GAAG,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AACvC,GAAG,CAAC;AACJ,EAAE,MAAM,cAAc,GAAG,CAAC,SAAS,KAAK;AACxC,IAAI,MAAM,EAAE,YAAY,EAAE,GAAG,KAAK,CAAC,IAAI,CAAC;AACxC,IAAI,kBAAkB,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC;AAChD,GAAG,CAAC;AACJ,EAAE,MAAM,WAAW,GAAG,WAAW;AACjC,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW;AAC/B,MAAM,OAAO;AACb,IAAI,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC;AAC5E,IAAI,MAAM,EAAE,aAAa,EAAE,aAAa,EAAE,GAAG,KAAK,CAAC,IAAI,CAAC;AACxD,IAAI,IAAI,aAAa;AACrB,MAAM,aAAa,CAAC,UAAU,GAAG,UAAU,CAAC;AAC5C,IAAI,IAAI,aAAa;AACrB,MAAM,aAAa,CAAC,UAAU,GAAG,UAAU,CAAC;AAC5C,IAAI,MAAM,qBAAqB,GAAG,WAAW,GAAG,WAAW,GAAG,CAAC,CAAC;AAChE,IAAI,IAAI,UAAU,IAAI,qBAAqB,EAAE;AAC7C,MAAM,cAAc,CAAC,oBAAoB,CAAC,CAAC;AAC3C,KAAK,MAAM,IAAI,UAAU,KAAK,CAAC,EAAE;AACjC,MAAM,cAAc,CAAC,mBAAmB,CAAC,CAAC;AAC1C,KAAK,MAAM;AACX,MAAM,cAAc,CAAC,qBAAqB,CAAC,CAAC;AAC5C,KAAK;AACL,GAAG,CAAC;AACJ,EAAE,MAAM,UAAU,GAAG,MAAM;AAC3B,IAAI,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,QAAQ,EAAE,WAAW,EAAE;AACnE,MAAM,OAAO,EAAE,IAAI;AACnB,KAAK,CAAC,CAAC;AACP,IAAI,IAAI,KAAK,CAAC,GAAG,EAAE;AACnB,MAAM,iBAAiB,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,EAAE,cAAc,CAAC,CAAC;AACxD,KAAK,MAAM;AACX,MAAM,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;AACrC,KAAK;AACL,GAAG,CAAC;AACJ,EAAE,WAAW,CAAC,MAAM;AACpB,IAAI,YAAY,EAAE,CAAC;AACnB,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,YAAY,GAAG,MAAM;AAC7B,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,CAAC,EAAE,GAAG,KAAK,CAAC,IAAI,CAAC,WAAW,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,mBAAmB,CAAC,QAAQ,EAAE,WAAW,EAAE,IAAI,CAAC,CAAC;AACzG,IAAI,IAAI,KAAK,CAAC,GAAG,EAAE;AACnB,MAAM,oBAAoB,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,EAAE,cAAc,CAAC,CAAC;AAC3D,KAAK,MAAM;AACX,MAAM,GAAG,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;AACtC,KAAK;AACL,GAAG,CAAC;AACJ,EAAE,MAAM,cAAc,GAAG,MAAM;AAC/B,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM;AACrB,MAAM,OAAO;AACb,IAAI,IAAI,kBAAkB,GAAG,KAAK,CAAC;AACnC,IAAI,MAAM,EAAE,GAAG,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;AAC9B,IAAI,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,WAAW,CAAC,KAAK,CAAC;AACrE,IAAI,MAAM,KAAK,GAAG,EAAE,CAAC,WAAW,CAAC;AACjC,IAAI,IAAI,QAAQ,KAAK,KAAK,EAAE;AAC5B,MAAM,kBAAkB,GAAG,IAAI,CAAC;AAChC,KAAK;AACL,IAAI,MAAM,MAAM,GAAG,EAAE,CAAC,YAAY,CAAC;AACnC,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,IAAI,kBAAkB,CAAC,KAAK,KAAK,SAAS,KAAK,MAAM,EAAE;AAC5E,MAAM,kBAAkB,GAAG,IAAI,CAAC;AAChC,KAAK;AACL,IAAI,IAAI,kBAAkB,EAAE;AAC5B,MAAM,WAAW,CAAC,KAAK,GAAG;AAC1B,QAAQ,KAAK;AACb,QAAQ,MAAM;AACd,OAAO,CAAC;AACR,MAAM,QAAQ,EAAE,CAAC;AACjB,KAAK;AACL,GAAG,CAAC;AACJ,EAAE,MAAM,SAAS,GAAG,OAAO,EAAE,CAAC;AAC9B,EAAE,MAAM,SAAS,GAAG,QAAQ,CAAC,MAAM;AACnC,IAAI,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,MAAM,CAAC;AACnE,IAAI,OAAO,UAAU,CAAC,KAAK,GAAG,CAAC,EAAE,UAAU,CAAC,KAAK,IAAI,OAAO,CAAC,KAAK,GAAG,WAAW,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC;AAC/F,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,UAAU,GAAG,QAAQ,CAAC,MAAM;AACpC,IAAI,MAAM,YAAY,GAAG,MAAM,CAAC,YAAY,CAAC,KAAK,IAAI,CAAC,CAAC;AACxD,IAAI,MAAM,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC;AAChD,IAAI,MAAM,YAAY,GAAG,MAAM,CAAC,YAAY,CAAC,KAAK,IAAI,CAAC,CAAC;AACxD,IAAI,IAAI,KAAK,CAAC,MAAM,EAAE;AACtB,MAAM,OAAO;AACb,QAAQ,MAAM,EAAE,WAAW,GAAG,CAAC,EAAE,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE;AACrD,OAAO,CAAC;AACR,KAAK,MAAM,IAAI,KAAK,CAAC,SAAS,EAAE;AAChC,MAAM,MAAM,SAAS,GAAG,WAAW,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;AACrD,MAAM,IAAI,OAAO,SAAS,KAAK,QAAQ,EAAE;AACzC,QAAQ,OAAO;AACf,UAAU,YAAY,EAAE,CAAC,EAAE,SAAS,GAAG,YAAY,IAAI,KAAK,CAAC,UAAU,GAAG,YAAY,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC;AAC/F,SAAS,CAAC;AACV,OAAO;AACP,KAAK;AACL,IAAI,OAAO,EAAE,CAAC;AACd,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,eAAe,GAAG,QAAQ,CAAC,MAAM;AACzC,IAAI,IAAI,KAAK,CAAC,IAAI,IAAI,KAAK,CAAC,IAAI,CAAC,MAAM;AACvC,MAAM,OAAO,IAAI,CAAC;AAClB,IAAI,IAAI,MAAM,GAAG,MAAM,CAAC;AACxB,IAAI,IAAI,MAAM,CAAC,YAAY,CAAC,KAAK,EAAE;AACnC,MAAM,MAAM,GAAG,CAAC,YAAY,EAAE,MAAM,CAAC,YAAY,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;AAC7D,KAAK;AACL,IAAI,OAAO;AACX,MAAM,KAAK,EAAE,SAAS,CAAC,KAAK;AAC5B,MAAM,MAAM;AACZ,KAAK,CAAC;AACN,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,qBAAqB,GAAG,CAAC,KAAK,EAAE,IAAI,KAAK;AACjD,IAAI,MAAM,WAAW,GAAG,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC;AAC/C,IAAI,IAAI,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE;AAClC,MAAM,MAAM,gBAAgB,GAAG,WAAW,CAAC,SAAS,CAAC;AACrD,MAAM,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,gBAAgB,KAAK,CAAC,EAAE;AACrD,QAAQ,KAAK,CAAC,cAAc,EAAE,CAAC;AAC/B,OAAO;AACP,MAAM,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,WAAW,CAAC,YAAY,GAAG,WAAW,CAAC,YAAY,GAAG,gBAAgB,EAAE;AACrG,QAAQ,KAAK,CAAC,cAAc,EAAE,CAAC;AAC/B,OAAO;AACP,MAAM,WAAW,CAAC,SAAS,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;AAC1D,KAAK,MAAM;AACX,MAAM,WAAW,CAAC,UAAU,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;AAC3D,KAAK;AACL,GAAG,CAAC;AACJ,EAAE,MAAM,WAAW,GAAG,QAAQ,CAAC,MAAM;AACrC,IAAI,IAAI,KAAK,CAAC,SAAS,EAAE;AACzB,MAAM,IAAI,KAAK,CAAC,WAAW,EAAE;AAC7B,QAAQ,OAAO;AACf,UAAU,MAAM,EAAE,CAAC;AACnB,SAAS,CAAC;AACV,OAAO;AACP,MAAM,OAAO;AACb,QAAQ,MAAM,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK,IAAI,KAAK,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE;AAC1F,OAAO,CAAC;AACR,KAAK,MAAM;AACX,MAAM,IAAI,KAAK,CAAC,WAAW,EAAE;AAC7B,QAAQ,OAAO;AACf,UAAU,MAAM,EAAE,MAAM,CAAC,WAAW,CAAC,KAAK,GAAG,CAAC,EAAE,MAAM,CAAC,WAAW,CAAC,KAAK,CAAC,EAAE,CAAC,GAAG,EAAE;AACjF,SAAS,CAAC;AACV,OAAO;AACP,MAAM,OAAO;AACb,QAAQ,MAAM,EAAE,MAAM,CAAC,cAAc,CAAC,KAAK,GAAG,CAAC,EAAE,MAAM,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,CAAC,GAAG,EAAE;AACrF,OAAO,CAAC;AACR,KAAK;AACL,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,eAAe,GAAG,QAAQ,CAAC,MAAM;AACzC,IAAI,IAAI,KAAK,CAAC,MAAM,EAAE;AACtB,MAAM,OAAO;AACb,QAAQ,MAAM,EAAE,MAAM,CAAC,eAAe,CAAC,KAAK,GAAG,CAAC,EAAE,MAAM,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,CAAC,GAAG,EAAE;AACvF,OAAO,CAAC;AACR,KAAK,MAAM,IAAI,KAAK,CAAC,SAAS,EAAE;AAChC,MAAM,IAAI,SAAS,GAAG,WAAW,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;AACnD,MAAM,IAAI,OAAO,SAAS,KAAK,QAAQ,EAAE;AACzC,QAAQ,SAAS,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,GAAG,SAAS,GAAG,MAAM,CAAC,WAAW,GAAG,SAAS,CAAC;AACtF,QAAQ,IAAI,KAAK,CAAC,UAAU,EAAE;AAC9B,UAAU,SAAS,IAAI,MAAM,CAAC,YAAY,CAAC,KAAK,CAAC;AACjD,SAAS;AACT,QAAQ,SAAS,IAAI,MAAM,CAAC,YAAY,CAAC,KAAK,CAAC;AAC/C,QAAQ,OAAO;AACf,UAAU,YAAY,EAAE,CAAC,EAAE,SAAS,CAAC,EAAE,CAAC;AACxC,SAAS,CAAC;AACV,OAAO;AACP,KAAK;AACL,IAAI,OAAO,EAAE,CAAC;AACd,GAAG,CAAC,CAAC;AACL,EAAE,OAAO;AACT,IAAI,QAAQ;AACZ,IAAI,cAAc;AAClB,IAAI,cAAc;AAClB,IAAI,OAAO;AACX,IAAI,gBAAgB;AACpB,IAAI,4BAA4B;AAChC,IAAI,SAAS;AACb,IAAI,UAAU;AACd,IAAI,eAAe;AACnB,IAAI,qBAAqB;AACzB,IAAI,WAAW;AACf,IAAI,eAAe;AACnB,IAAI,kBAAkB;AACtB,IAAI,SAAS;AACb,IAAI,WAAW;AACf,IAAI,QAAQ;AACZ,IAAI,eAAe;AACnB,IAAI,uBAAuB;AAC3B,GAAG,CAAC;AACJ;;;;"}

package/es/components/table/src/table-body/index.mjs

@@ -51,17 +51,19 @@ var TableBody = defineComponent({
     };
   },
   render() {
-    const data = this.store.states.data.value || [];
+    const { wrappedRowRender, store } = this;
+    const data = store.states.data.value || [];
+    const columns = store.states.columns.value;
     return h("table", {
       class: "el-table__body",
       cellspacing: "0",
       cellpadding: "0",
       border: "0"
     }, [
-      hColgroup(this.store.states.columns.value),
+      hColgroup(columns),
       h("tbody", {}, [
         data.reduce((acc, row) => {
-          return acc.concat(this.wrappedRowRender(row, acc.length));
+          return acc.concat(wrappedRowRender(row, acc.length));
         }, [])
       ])
     ]);

package/es/components/table/src/table-body/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../../../../../packages/components/table/src/table-body/index.ts"],"sourcesContent":["import {\n  defineComponent,\n  getCurrentInstance,\n  h,\n  watch,\n  onUnmounted,\n  onUpdated,\n} from 'vue'\nimport { isClient } from '@vueuse/core'\nimport { addClass, removeClass } from '@element-plus/utils/dom'\nimport { hColgroup } from '../h-helper'\nimport useLayoutObserver from '../layout-observer'\nimport { removePopper } from '../util'\nimport useRender from './render-helper'\nimport defaultProps from './defaults'\n\nimport type { VNode } from 'vue'\nimport type { DefaultRow, Table } from '../table/defaults'\n\nexport default defineComponent({\n  name: 'ElTableBody',\n  props: defaultProps,\n  setup(props) {\n    const instance = getCurrentInstance()\n    const parent = instance.parent as Table<DefaultRow>\n\n    const { wrappedRowRender, tooltipContent, tooltipTrigger } =\n      useRender(props)\n    const { onColumnsChange, onScrollableChange } = useLayoutObserver(parent)\n\n    watch(props.store.states.hoverRow, (newVal: any, oldVal: any) => {\n      if (!props.store.states.isComplex.value || !isClient) return\n      let raf = window.requestAnimationFrame\n      if (!raf) {\n        raf = (fn) => window.setTimeout(fn, 16)\n      }\n      raf(() => {\n        const rows = instance.vnode.el.querySelectorAll('.el-table__row')\n        const oldRow = rows[oldVal]\n        const newRow = rows[newVal]\n        if (oldRow) {\n          removeClass(oldRow, 'hover-row')\n        }\n        if (newRow) {\n          addClass(newRow, 'hover-row')\n        }\n      })\n    })\n\n    onUnmounted(() => {\n      removePopper?.()\n    })\n    onUpdated(() => {\n      removePopper?.()\n    })\n\n    return {\n      onColumnsChange,\n      onScrollableChange,\n      wrappedRowRender,\n      tooltipContent,\n      tooltipTrigger,\n    }\n  },\n  render() {\n    const data = this.store.states.data.value || []\n    return h(\n      'table',\n      {\n        class: 'el-table__body',\n        cellspacing: '0',\n        cellpadding: '0',\n        border: '0',\n      },\n      [\n        hColgroup(this.store.states.columns.value),\n        h('tbody', {}, [\n          data.reduce((acc: VNode[], row) => {\n            return acc.concat(this.wrappedRowRender(row, acc.length))\n          }, []),\n        ]),\n      ]\n    )\n  },\n})\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../../../../../../../packages/components/table/src/table-body/index.ts"],"sourcesContent":["import {\n  defineComponent,\n  getCurrentInstance,\n  h,\n  watch,\n  onUnmounted,\n  onUpdated,\n} from 'vue'\nimport { isClient } from '@vueuse/core'\nimport { addClass, removeClass } from '@element-plus/utils/dom'\nimport { hColgroup } from '../h-helper'\nimport useLayoutObserver from '../layout-observer'\nimport { removePopper } from '../util'\nimport useRender from './render-helper'\nimport defaultProps from './defaults'\n\nimport type { VNode } from 'vue'\nimport type { DefaultRow, Table } from '../table/defaults'\n\nexport default defineComponent({\n  name: 'ElTableBody',\n  props: defaultProps,\n  setup(props) {\n    const instance = getCurrentInstance()\n    const parent = instance.parent as Table<DefaultRow>\n\n    const { wrappedRowRender, tooltipContent, tooltipTrigger } =\n      useRender(props)\n    const { onColumnsChange, onScrollableChange } = useLayoutObserver(parent)\n\n    watch(props.store.states.hoverRow, (newVal: any, oldVal: any) => {\n      if (!props.store.states.isComplex.value || !isClient) return\n      let raf = window.requestAnimationFrame\n      if (!raf) {\n        raf = (fn) => window.setTimeout(fn, 16)\n      }\n      raf(() => {\n        const rows = instance.vnode.el.querySelectorAll('.el-table__row')\n        const oldRow = rows[oldVal]\n        const newRow = rows[newVal]\n        if (oldRow) {\n          removeClass(oldRow, 'hover-row')\n        }\n        if (newRow) {\n          addClass(newRow, 'hover-row')\n        }\n      })\n    })\n\n    onUnmounted(() => {\n      removePopper?.()\n    })\n    onUpdated(() => {\n      removePopper?.()\n    })\n\n    return {\n      onColumnsChange,\n      onScrollableChange,\n      wrappedRowRender,\n      tooltipContent,\n      tooltipTrigger,\n    }\n  },\n  render() {\n    const { wrappedRowRender, store } = this\n    const data = store.states.data.value || []\n    const columns = store.states.columns.value\n    return h(\n      'table',\n      {\n        class: 'el-table__body',\n        cellspacing: '0',\n        cellpadding: '0',\n        border: '0',\n      },\n      [\n        hColgroup(columns),\n        h('tbody', {}, [\n          data.reduce((acc: VNode[], row) => {\n            return acc.concat(wrappedRowRender(row, acc.length))\n          }, []),\n        ]),\n      ]\n    )\n  },\n})\n"],"names":[],"mappings":"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"}

package/es/components/table/src/table-body/styles-helper.d.ts

@@ -10,6 +10,5 @@ declare function useStyles<T>(props: Partial<TableBodyProps<T>>): {
         colspan: number;
     };
     getColspanRealWidth: (columns: TableColumnCtx<T>[], colspan: number, index: number) => number;
-    isColumnHidden: (index: any) => boolean;
 };
 export default useStyles;

package/es/components/table/src/table-body/styles-helper.mjs

@@ -1,17 +1,9 @@
 import { getCurrentInstance } from 'vue';
+import { getFixedColumnOffset, ensurePosition, getFixedColumnsClass } from '../util.mjs';
 
 function useStyles(props) {
   const instance = getCurrentInstance();
   const parent = instance.parent;
-  const isColumnHidden = (index) => {
-    if (props.fixed === "left") {
-      return index >= props.store.states.fixedLeafColumnsLength.value;
-    } else if (props.fixed === "right") {
-      return index < props.store.states.columns.value.length - props.store.states.rightFixedLeafColumnsLength.value;
-    } else {
-      return index < props.store.states.fixedLeafColumnsLength.value || index >= props.store.states.columns.value.length - props.store.states.rightFixedLeafColumnsLength.value;
-    }
-  };
   const getRowStyle = (row, rowIndex) => {
     const rowStyle = parent.props.rowStyle;
     if (typeof rowStyle === "function") {
@@ -46,21 +38,23 @@ function useStyles(props) {
   };
   const getCellStyle = (rowIndex, columnIndex, row, column) => {
     const cellStyle = parent.props.cellStyle;
+    let cellStyles = cellStyle != null ? cellStyle : {};
     if (typeof cellStyle === "function") {
-      return cellStyle.call(null, {
+      cellStyles = cellStyle.call(null, {
         rowIndex,
         columnIndex,
         row,
         column
       });
     }
-    return cellStyle;
+    const fixedStyle = getFixedColumnOffset(columnIndex, props.fixed, props.store);
+    ensurePosition(fixedStyle, "left");
+    ensurePosition(fixedStyle, "right");
+    return Object.assign({}, cellStyles, fixedStyle);
   };
   const getCellClass = (rowIndex, columnIndex, row, column) => {
-    const classes = [column.id, column.align, column.className];
-    if (isColumnHidden(columnIndex)) {
-      classes.push("is-hidden");
-    }
+    const fixedClasses = column.isSubColumn ? [] : getFixedColumnsClass(columnIndex, props.fixed, props.store);
+    const classes = [column.id, column.align, column.className, ...fixedClasses];
     const cellClassName = parent.props.cellClassName;
     if (typeof cellClassName === "string") {
       classes.push(cellClassName);
@@ -109,8 +103,7 @@ function useStyles(props) {
     getCellStyle,
     getCellClass,
     getSpan,
-    getColspanRealWidth,
-    isColumnHidden
+    getColspanRealWidth
   };
 }
 

package/es/components/table/src/table-body/styles-helper.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"styles-helper.mjs","sources":["../../../../../../../packages/components/table/src/table-body/styles-helper.ts"],"sourcesContent":["import { getCurrentInstance } from 'vue'\n\nimport type { TableColumnCtx } from '../table-column/defaults'\nimport type { Table } from '../table/defaults'\nimport type { TableBodyProps } from './defaults'\n\nfunction useStyles<T>(props: Partial<TableBodyProps<T>>) {\n  const instance = getCurrentInstance()\n  const parent = instance.parent as Table<T>\n  const isColumnHidden = (index) => {\n    if (props.fixed === 'left') {\n      return index >= props.store.states.fixedLeafColumnsLength.value\n    } else if (props.fixed === 'right') {\n      return (\n        index <\n        props.store.states.columns.value.length -\n          props.store.states.rightFixedLeafColumnsLength.value\n      )\n    } else {\n      return (\n        index < props.store.states.fixedLeafColumnsLength.value ||\n        index >=\n          props.store.states.columns.value.length -\n            props.store.states.rightFixedLeafColumnsLength.value\n      )\n    }\n  }\n  const getRowStyle = (row: T, rowIndex: number) => {\n    const rowStyle = parent.props.rowStyle\n    if (typeof rowStyle === 'function') {\n      return rowStyle.call(null, {\n        row,\n        rowIndex,\n      })\n    }\n    return rowStyle || null\n  }\n\n  const getRowClass = (row: T, rowIndex: number) => {\n    const classes = ['el-table__row']\n    if (\n      parent.props.highlightCurrentRow &&\n      row === props.store.states.currentRow.value\n    ) {\n      classes.push('current-row')\n    }\n\n    if (props.stripe && rowIndex % 2 === 1) {\n      classes.push('el-table__row--striped')\n    }\n    const rowClassName = parent.props.rowClassName\n    if (typeof rowClassName === 'string') {\n      classes.push(rowClassName)\n    } else if (typeof rowClassName === 'function') {\n      classes.push(\n        rowClassName.call(null, {\n          row,\n          rowIndex,\n        })\n      )\n    }\n\n    if (props.store.states.expandRows.value.indexOf(row) > -1) {\n      classes.push('expanded')\n    }\n\n    return classes\n  }\n\n  const getCellStyle = (\n    rowIndex: number,\n    columnIndex: number,\n    row: T,\n    column: TableColumnCtx<T>\n  ) => {\n    const cellStyle = parent.props.cellStyle\n    if (typeof cellStyle === 'function') {\n      return cellStyle.call(null, {\n        rowIndex,\n        columnIndex,\n        row,\n        column,\n      })\n    }\n    return cellStyle\n  }\n\n  const getCellClass = (\n    rowIndex: number,\n    columnIndex: number,\n    row: T,\n    column: TableColumnCtx<T>\n  ) => {\n    const classes = [column.id, column.align, column.className]\n\n    if (isColumnHidden(columnIndex)) {\n      classes.push('is-hidden')\n    }\n\n    const cellClassName = parent.props.cellClassName\n    if (typeof cellClassName === 'string') {\n      classes.push(cellClassName)\n    } else if (typeof cellClassName === 'function') {\n      classes.push(\n        cellClassName.call(null, {\n          rowIndex,\n          columnIndex,\n          row,\n          column,\n        })\n      )\n    }\n\n    classes.push('el-table__cell')\n\n    return classes.join(' ')\n  }\n  const getSpan = (\n    row: T,\n    column: TableColumnCtx<T>,\n    rowIndex: number,\n    columnIndex: number\n  ) => {\n    let rowspan = 1\n    let colspan = 1\n    const fn = parent.props.spanMethod\n    if (typeof fn === 'function') {\n      const result = fn({\n        row,\n        column,\n        rowIndex,\n        columnIndex,\n      })\n      if (Array.isArray(result)) {\n        rowspan = result[0]\n        colspan = result[1]\n      } else if (typeof result === 'object') {\n        rowspan = result.rowspan\n        colspan = result.colspan\n      }\n    }\n    return { rowspan, colspan }\n  }\n  const getColspanRealWidth = (\n    columns: TableColumnCtx<T>[],\n    colspan: number,\n    index: number\n  ): number => {\n    if (colspan < 1) {\n      return columns[index].realWidth\n    }\n    const widthArr = columns\n      .map(({ realWidth, width }) => realWidth || width)\n      .slice(index, index + colspan)\n    return Number(\n      widthArr.reduce((acc, width) => Number(acc) + Number(width), -1)\n    )\n  }\n\n  return {\n    getRowStyle,\n    getRowClass,\n    getCellStyle,\n    getCellClass,\n    getSpan,\n    getColspanRealWidth,\n    isColumnHidden,\n  }\n}\n\nexport default useStyles\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"styles-helper.mjs","sources":["../../../../../../../packages/components/table/src/table-body/styles-helper.ts"],"sourcesContent":["import { getCurrentInstance } from 'vue'\nimport {\n  getFixedColumnOffset,\n  getFixedColumnsClass,\n  ensurePosition,\n} from '../util'\nimport type { TableColumnCtx } from '../table-column/defaults'\nimport type { Table } from '../table/defaults'\nimport type { TableBodyProps } from './defaults'\n\nfunction useStyles<T>(props: Partial<TableBodyProps<T>>) {\n  const instance = getCurrentInstance()\n  const parent = instance.parent as Table<T>\n\n  const getRowStyle = (row: T, rowIndex: number) => {\n    const rowStyle = parent.props.rowStyle\n    if (typeof rowStyle === 'function') {\n      return rowStyle.call(null, {\n        row,\n        rowIndex,\n      })\n    }\n    return rowStyle || null\n  }\n\n  const getRowClass = (row: T, rowIndex: number) => {\n    const classes = ['el-table__row']\n    if (\n      parent.props.highlightCurrentRow &&\n      row === props.store.states.currentRow.value\n    ) {\n      classes.push('current-row')\n    }\n\n    if (props.stripe && rowIndex % 2 === 1) {\n      classes.push('el-table__row--striped')\n    }\n    const rowClassName = parent.props.rowClassName\n    if (typeof rowClassName === 'string') {\n      classes.push(rowClassName)\n    } else if (typeof rowClassName === 'function') {\n      classes.push(\n        rowClassName.call(null, {\n          row,\n          rowIndex,\n        })\n      )\n    }\n\n    if (props.store.states.expandRows.value.indexOf(row) > -1) {\n      classes.push('expanded')\n    }\n\n    return classes\n  }\n\n  const getCellStyle = (\n    rowIndex: number,\n    columnIndex: number,\n    row: T,\n    column: TableColumnCtx<T>\n  ) => {\n    const cellStyle = parent.props.cellStyle\n    let cellStyles = cellStyle ?? {}\n    if (typeof cellStyle === 'function') {\n      cellStyles = cellStyle.call(null, {\n        rowIndex,\n        columnIndex,\n        row,\n        column,\n      })\n    }\n    const fixedStyle = getFixedColumnOffset(\n      columnIndex,\n      props.fixed,\n      props.store\n    )\n    ensurePosition(fixedStyle, 'left')\n    ensurePosition(fixedStyle, 'right')\n    return Object.assign({}, cellStyles, fixedStyle)\n  }\n\n  const getCellClass = (\n    rowIndex: number,\n    columnIndex: number,\n    row: T,\n    column: TableColumnCtx<T>\n  ) => {\n    const fixedClasses = column.isSubColumn\n      ? []\n      : getFixedColumnsClass(columnIndex, props.fixed, props.store)\n    const classes = [column.id, column.align, column.className, ...fixedClasses]\n    const cellClassName = parent.props.cellClassName\n    if (typeof cellClassName === 'string') {\n      classes.push(cellClassName)\n    } else if (typeof cellClassName === 'function') {\n      classes.push(\n        cellClassName.call(null, {\n          rowIndex,\n          columnIndex,\n          row,\n          column,\n        })\n      )\n    }\n\n    classes.push('el-table__cell')\n\n    return classes.join(' ')\n  }\n  const getSpan = (\n    row: T,\n    column: TableColumnCtx<T>,\n    rowIndex: number,\n    columnIndex: number\n  ) => {\n    let rowspan = 1\n    let colspan = 1\n    const fn = parent.props.spanMethod\n    if (typeof fn === 'function') {\n      const result = fn({\n        row,\n        column,\n        rowIndex,\n        columnIndex,\n      })\n      if (Array.isArray(result)) {\n        rowspan = result[0]\n        colspan = result[1]\n      } else if (typeof result === 'object') {\n        rowspan = result.rowspan\n        colspan = result.colspan\n      }\n    }\n    return { rowspan, colspan }\n  }\n  const getColspanRealWidth = (\n    columns: TableColumnCtx<T>[],\n    colspan: number,\n    index: number\n  ): number => {\n    if (colspan < 1) {\n      return columns[index].realWidth\n    }\n    const widthArr = columns\n      .map(({ realWidth, width }) => realWidth || width)\n      .slice(index, index + colspan)\n    return Number(\n      widthArr.reduce((acc, width) => Number(acc) + Number(width), -1)\n    )\n  }\n\n  return {\n    getRowStyle,\n    getRowClass,\n    getCellStyle,\n    getCellClass,\n    getSpan,\n    getColspanRealWidth,\n  }\n}\n\nexport default useStyles\n"],"names":[],"mappings":";;;AAMA,SAAS,SAAS,CAAC,KAAK,EAAE;AAC1B,EAAE,MAAM,QAAQ,GAAG,kBAAkB,EAAE,CAAC;AACxC,EAAE,MAAM,MAAM,GAAG,QAAQ,CAAC,MAAM,CAAC;AACjC,EAAE,MAAM,WAAW,GAAG,CAAC,GAAG,EAAE,QAAQ,KAAK;AACzC,IAAI,MAAM,QAAQ,GAAG,MAAM,CAAC,KAAK,CAAC,QAAQ,CAAC;AAC3C,IAAI,IAAI,OAAO,QAAQ,KAAK,UAAU,EAAE;AACxC,MAAM,OAAO,QAAQ,CAAC,IAAI,CAAC,IAAI,EAAE;AACjC,QAAQ,GAAG;AACX,QAAQ,QAAQ;AAChB,OAAO,CAAC,CAAC;AACT,KAAK;AACL,IAAI,OAAO,QAAQ,IAAI,IAAI,CAAC;AAC5B,GAAG,CAAC;AACJ,EAAE,MAAM,WAAW,GAAG,CAAC,GAAG,EAAE,QAAQ,KAAK;AACzC,IAAI,MAAM,OAAO,GAAG,CAAC,eAAe,CAAC,CAAC;AACtC,IAAI,IAAI,MAAM,CAAC,KAAK,CAAC,mBAAmB,IAAI,GAAG,KAAK,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC,KAAK,EAAE;AACzF,MAAM,OAAO,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;AAClC,KAAK;AACL,IAAI,IAAI,KAAK,CAAC,MAAM,IAAI,QAAQ,GAAG,CAAC,KAAK,CAAC,EAAE;AAC5C,MAAM,OAAO,CAAC,IAAI,CAAC,wBAAwB,CAAC,CAAC;AAC7C,KAAK;AACL,IAAI,MAAM,YAAY,GAAG,MAAM,CAAC,KAAK,CAAC,YAAY,CAAC;AACnD,IAAI,IAAI,OAAO,YAAY,KAAK,QAAQ,EAAE;AAC1C,MAAM,OAAO,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;AACjC,KAAK,MAAM,IAAI,OAAO,YAAY,KAAK,UAAU,EAAE;AACnD,MAAM,OAAO,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,EAAE;AAC3C,QAAQ,GAAG;AACX,QAAQ,QAAQ;AAChB,OAAO,CAAC,CAAC,CAAC;AACV,KAAK;AACL,IAAI,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE;AAC/D,MAAM,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;AAC/B,KAAK;AACL,IAAI,OAAO,OAAO,CAAC;AACnB,GAAG,CAAC;AACJ,EAAE,MAAM,YAAY,GAAG,CAAC,QAAQ,EAAE,WAAW,EAAE,GAAG,EAAE,MAAM,KAAK;AAC/D,IAAI,MAAM,SAAS,GAAG,MAAM,CAAC,KAAK,CAAC,SAAS,CAAC;AAC7C,IAAI,IAAI,UAAU,GAAG,SAAS,IAAI,IAAI,GAAG,SAAS,GAAG,EAAE,CAAC;AACxD,IAAI,IAAI,OAAO,SAAS,KAAK,UAAU,EAAE;AACzC,MAAM,UAAU,GAAG,SAAS,CAAC,IAAI,CAAC,IAAI,EAAE;AACxC,QAAQ,QAAQ;AAChB,QAAQ,WAAW;AACnB,QAAQ,GAAG;AACX,QAAQ,MAAM;AACd,OAAO,CAAC,CAAC;AACT,KAAK;AACL,IAAI,MAAM,UAAU,GAAG,oBAAoB,CAAC,WAAW,EAAE,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;AACnF,IAAI,cAAc,CAAC,UAAU,EAAE,MAAM,CAAC,CAAC;AACvC,IAAI,cAAc,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;AACxC,IAAI,OAAO,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,UAAU,EAAE,UAAU,CAAC,CAAC;AACrD,GAAG,CAAC;AACJ,EAAE,MAAM,YAAY,GAAG,CAAC,QAAQ,EAAE,WAAW,EAAE,GAAG,EAAE,MAAM,KAAK;AAC/D,IAAI,MAAM,YAAY,GAAG,MAAM,CAAC,WAAW,GAAG,EAAE,GAAG,oBAAoB,CAAC,WAAW,EAAE,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;AAC/G,IAAI,MAAM,OAAO,GAAG,CAAC,MAAM,CAAC,EAAE,EAAE,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,SAAS,EAAE,GAAG,YAAY,CAAC,CAAC;AACjF,IAAI,MAAM,aAAa,GAAG,MAAM,CAAC,KAAK,CAAC,aAAa,CAAC;AACrD,IAAI,IAAI,OAAO,aAAa,KAAK,QAAQ,EAAE;AAC3C,MAAM,OAAO,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;AAClC,KAAK,MAAM,IAAI,OAAO,aAAa,KAAK,UAAU,EAAE;AACpD,MAAM,OAAO,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,EAAE;AAC5C,QAAQ,QAAQ;AAChB,QAAQ,WAAW;AACnB,QAAQ,GAAG;AACX,QAAQ,MAAM;AACd,OAAO,CAAC,CAAC,CAAC;AACV,KAAK;AACL,IAAI,OAAO,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;AACnC,IAAI,OAAO,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AAC7B,GAAG,CAAC;AACJ,EAAE,MAAM,OAAO,GAAG,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,EAAE,WAAW,KAAK;AAC1D,IAAI,IAAI,OAAO,GAAG,CAAC,CAAC;AACpB,IAAI,IAAI,OAAO,GAAG,CAAC,CAAC;AACpB,IAAI,MAAM,EAAE,GAAG,MAAM,CAAC,KAAK,CAAC,UAAU,CAAC;AACvC,IAAI,IAAI,OAAO,EAAE,KAAK,UAAU,EAAE;AAClC,MAAM,MAAM,MAAM,GAAG,EAAE,CAAC;AACxB,QAAQ,GAAG;AACX,QAAQ,MAAM;AACd,QAAQ,QAAQ;AAChB,QAAQ,WAAW;AACnB,OAAO,CAAC,CAAC;AACT,MAAM,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;AACjC,QAAQ,OAAO,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;AAC5B,QAAQ,OAAO,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;AAC5B,OAAO,MAAM,IAAI,OAAO,MAAM,KAAK,QAAQ,EAAE;AAC7C,QAAQ,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC;AACjC,QAAQ,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC;AACjC,OAAO;AACP,KAAK;AACL,IAAI,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC;AAChC,GAAG,CAAC;AACJ,EAAE,MAAM,mBAAmB,GAAG,CAAC,OAAO,EAAE,OAAO,EAAE,KAAK,KAAK;AAC3D,IAAI,IAAI,OAAO,GAAG,CAAC,EAAE;AACrB,MAAM,OAAO,OAAO,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC;AACtC,KAAK;AACL,IAAI,MAAM,QAAQ,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,SAAS,IAAI,KAAK,CAAC,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,GAAG,OAAO,CAAC,CAAC;AAC7G,IAAI,OAAO,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,KAAK,KAAK,MAAM,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;AACpF,GAAG,CAAC;AACJ,EAAE,OAAO;AACT,IAAI,WAAW;AACf,IAAI,WAAW;AACf,IAAI,YAAY;AAChB,IAAI,YAAY;AAChB,IAAI,OAAO;AACX,IAAI,mBAAmB;AACvB,GAAG,CAAC;AACJ;;;;"}

package/es/components/table/src/table-column/defaults.d.ts

@@ -51,6 +51,7 @@ interface TableColumnCtx<T> {
     filterable: boolean | FilterMethods<T> | Filters;
     order: string;
     isColumnGroup: boolean;
+    isSubColumn: boolean;
     columns: TableColumnCtx<T>[];
     getColumnIndex: () => number;
     no: number;

package/es/components/table/src/table-column/defaults.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"defaults.mjs","sources":["../../../../../../../packages/components/table/src/table-column/defaults.ts"],"sourcesContent":["import type { PropType, ComponentInternalInstance, Ref, VNode } from 'vue'\nimport type { DefaultRow, Table } from '../table/defaults'\n\ntype CI<T> = { column: TableColumnCtx<T>; $index: number }\n\ntype Filters = {\n  text: string\n  value: string\n}[]\n\ntype FilterMethods<T> = (value, row: T, column: TableColumnCtx<T>) => void\n\ntype ValueOf<T> = T[keyof T]\n\ninterface TableColumnCtx<T> {\n  id: string\n  realWidth: number\n  type: string\n  label: string\n  className: string\n  labelClassName: string\n  property: string\n  prop: string\n  width: string | number\n  minWidth: string | number\n  renderHeader: (data: CI<T>) => VNode\n  sortable: boolean | string\n  sortMethod: (a: T, b: T) => number\n  sortBy: string | ((row: T, index: number) => string) | string[]\n  resizable: boolean\n  columnKey: string\n  rawColumnKey: string\n  align: string\n  headerAlign: string\n  showTooltipWhenOverflow: boolean\n  showOverflowTooltip: boolean\n  fixed: boolean | string\n  formatter: (\n    row: T,\n    column: TableColumnCtx<T>,\n    cellValue,\n    index: number\n  ) => VNode | string\n  selectable: (row: T, index: number) => boolean\n  reserveSelection: boolean\n  filterMethod: FilterMethods<T>\n  filteredValue: string[]\n  filters: Filters\n  filterPlacement: string\n  filterMultiple: boolean\n  index: number | ((index: number) => number)\n  sortOrders: ('ascending' | 'descending' | null)[]\n  renderCell: (data: any) => void\n  colSpan: number\n  rowSpan: number\n  children: TableColumnCtx<T>[]\n  level: number\n  filterable: boolean | FilterMethods<T> | Filters\n  order: string\n  isColumnGroup: boolean\n  columns: TableColumnCtx<T>[]\n  getColumnIndex: () => number\n  no: number\n  filterOpened?: boolean\n}\n\ninterface TableColumn<T> extends ComponentInternalInstance {\n  vnode: {\n    vParent: TableColumn<T> | Table<T>\n  } & VNode\n  vParent: TableColumn<T> | Table<T>\n  columnId: string\n  columnConfig: Ref<Partial<TableColumnCtx<T>>>\n}\n\nexport type { Filters, FilterMethods, TableColumnCtx, TableColumn, ValueOf }\n\nexport default {\n  type: {\n    type: String,\n    default: 'default',\n  },\n  label: String,\n  className: String,\n  labelClassName: String,\n  property: String,\n  prop: String,\n  width: {\n    type: [String, Number],\n    default: '',\n  },\n  minWidth: {\n    type: [String, Number],\n    default: '',\n  },\n  renderHeader: Function as PropType<\n    TableColumnCtx<DefaultRow>['renderHeader']\n  >,\n  sortable: {\n    type: [Boolean, String],\n    default: false,\n  },\n  sortMethod: Function as PropType<TableColumnCtx<DefaultRow>['sortMethod']>,\n  sortBy: [String, Function, Array] as PropType<\n    TableColumnCtx<DefaultRow>['sortBy']\n  >,\n  resizable: {\n    type: Boolean,\n    default: true,\n  },\n  columnKey: String,\n  align: String,\n  headerAlign: String,\n  showTooltipWhenOverflow: Boolean,\n  showOverflowTooltip: Boolean,\n  fixed: [Boolean, String],\n  formatter: Function as PropType<TableColumnCtx<DefaultRow>['formatter']>,\n  selectable: Function as PropType<TableColumnCtx<DefaultRow>['selectable']>,\n  reserveSelection: Boolean,\n  filterMethod: Function as PropType<\n    TableColumnCtx<DefaultRow>['filterMethod']\n  >,\n  filteredValue: Array as PropType<TableColumnCtx<DefaultRow>['filteredValue']>,\n  filters: Array as PropType<TableColumnCtx<DefaultRow>['filters']>,\n  filterPlacement: String,\n  filterMultiple: {\n    type: Boolean,\n    default: true,\n  },\n  index: [Number, Function] as PropType<TableColumnCtx<DefaultRow>['index']>,\n  sortOrders: {\n    type: Array as PropType<TableColumnCtx<DefaultRow>['sortOrders']>,\n    default: () => {\n      return ['ascending', 'descending', null]\n    },\n    validator: (val: TableColumnCtx<unknown>['sortOrders']) => {\n      return val.every(\n        (order: string) => ['ascending', 'descending', null].indexOf(order) > -1\n      )\n    },\n  },\n}\n"],"names":[],"mappings":"AAAA,mBAAe;AACf,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,SAAS;AACtB,GAAG;AACH,EAAE,KAAK,EAAE,MAAM;AACf,EAAE,SAAS,EAAE,MAAM;AACnB,EAAE,cAAc,EAAE,MAAM;AACxB,EAAE,QAAQ,EAAE,MAAM;AAClB,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,YAAY,EAAE,QAAQ;AACxB,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC;AAC3B,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,UAAU,EAAE,QAAQ;AACtB,EAAE,MAAM,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,KAAK,CAAC;AACnC,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,SAAS,EAAE,MAAM;AACnB,EAAE,KAAK,EAAE,MAAM;AACf,EAAE,WAAW,EAAE,MAAM;AACrB,EAAE,uBAAuB,EAAE,OAAO;AAClC,EAAE,mBAAmB,EAAE,OAAO;AAC9B,EAAE,KAAK,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC;AAC1B,EAAE,SAAS,EAAE,QAAQ;AACrB,EAAE,UAAU,EAAE,QAAQ;AACtB,EAAE,gBAAgB,EAAE,OAAO;AAC3B,EAAE,YAAY,EAAE,QAAQ;AACxB,EAAE,aAAa,EAAE,KAAK;AACtB,EAAE,OAAO,EAAE,KAAK;AAChB,EAAE,eAAe,EAAE,MAAM;AACzB,EAAE,cAAc,EAAE;AAClB,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,KAAK,EAAE,CAAC,MAAM,EAAE,QAAQ,CAAC;AAC3B,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,KAAK;AACf,IAAI,OAAO,EAAE,MAAM;AACnB,MAAM,OAAO,CAAC,WAAW,EAAE,YAAY,EAAE,IAAI,CAAC,CAAC;AAC/C,KAAK;AACL,IAAI,SAAS,EAAE,CAAC,GAAG,KAAK;AACxB,MAAM,OAAO,GAAG,CAAC,KAAK,CAAC,CAAC,KAAK,KAAK,CAAC,WAAW,EAAE,YAAY,EAAE,IAAI,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;AACzF,KAAK;AACL,GAAG;AACH,CAAC;;;;"}
+{"version":3,"file":"defaults.mjs","sources":["../../../../../../../packages/components/table/src/table-column/defaults.ts"],"sourcesContent":["import type { PropType, ComponentInternalInstance, Ref, VNode } from 'vue'\nimport type { DefaultRow, Table } from '../table/defaults'\n\ntype CI<T> = { column: TableColumnCtx<T>; $index: number }\n\ntype Filters = {\n  text: string\n  value: string\n}[]\n\ntype FilterMethods<T> = (value, row: T, column: TableColumnCtx<T>) => void\n\ntype ValueOf<T> = T[keyof T]\n\ninterface TableColumnCtx<T> {\n  id: string\n  realWidth: number\n  type: string\n  label: string\n  className: string\n  labelClassName: string\n  property: string\n  prop: string\n  width: string | number\n  minWidth: string | number\n  renderHeader: (data: CI<T>) => VNode\n  sortable: boolean | string\n  sortMethod: (a: T, b: T) => number\n  sortBy: string | ((row: T, index: number) => string) | string[]\n  resizable: boolean\n  columnKey: string\n  rawColumnKey: string\n  align: string\n  headerAlign: string\n  showTooltipWhenOverflow: boolean\n  showOverflowTooltip: boolean\n  fixed: boolean | string\n  formatter: (\n    row: T,\n    column: TableColumnCtx<T>,\n    cellValue,\n    index: number\n  ) => VNode | string\n  selectable: (row: T, index: number) => boolean\n  reserveSelection: boolean\n  filterMethod: FilterMethods<T>\n  filteredValue: string[]\n  filters: Filters\n  filterPlacement: string\n  filterMultiple: boolean\n  index: number | ((index: number) => number)\n  sortOrders: ('ascending' | 'descending' | null)[]\n  renderCell: (data: any) => void\n  colSpan: number\n  rowSpan: number\n  children: TableColumnCtx<T>[]\n  level: number\n  filterable: boolean | FilterMethods<T> | Filters\n  order: string\n  isColumnGroup: boolean\n  isSubColumn: boolean\n  columns: TableColumnCtx<T>[]\n  getColumnIndex: () => number\n  no: number\n  filterOpened?: boolean\n}\n\ninterface TableColumn<T> extends ComponentInternalInstance {\n  vnode: {\n    vParent: TableColumn<T> | Table<T>\n  } & VNode\n  vParent: TableColumn<T> | Table<T>\n  columnId: string\n  columnConfig: Ref<Partial<TableColumnCtx<T>>>\n}\n\nexport type { Filters, FilterMethods, TableColumnCtx, TableColumn, ValueOf }\n\nexport default {\n  type: {\n    type: String,\n    default: 'default',\n  },\n  label: String,\n  className: String,\n  labelClassName: String,\n  property: String,\n  prop: String,\n  width: {\n    type: [String, Number],\n    default: '',\n  },\n  minWidth: {\n    type: [String, Number],\n    default: '',\n  },\n  renderHeader: Function as PropType<\n    TableColumnCtx<DefaultRow>['renderHeader']\n  >,\n  sortable: {\n    type: [Boolean, String],\n    default: false,\n  },\n  sortMethod: Function as PropType<TableColumnCtx<DefaultRow>['sortMethod']>,\n  sortBy: [String, Function, Array] as PropType<\n    TableColumnCtx<DefaultRow>['sortBy']\n  >,\n  resizable: {\n    type: Boolean,\n    default: true,\n  },\n  columnKey: String,\n  align: String,\n  headerAlign: String,\n  showTooltipWhenOverflow: Boolean,\n  showOverflowTooltip: Boolean,\n  fixed: [Boolean, String],\n  formatter: Function as PropType<TableColumnCtx<DefaultRow>['formatter']>,\n  selectable: Function as PropType<TableColumnCtx<DefaultRow>['selectable']>,\n  reserveSelection: Boolean,\n  filterMethod: Function as PropType<\n    TableColumnCtx<DefaultRow>['filterMethod']\n  >,\n  filteredValue: Array as PropType<TableColumnCtx<DefaultRow>['filteredValue']>,\n  filters: Array as PropType<TableColumnCtx<DefaultRow>['filters']>,\n  filterPlacement: String,\n  filterMultiple: {\n    type: Boolean,\n    default: true,\n  },\n  index: [Number, Function] as PropType<TableColumnCtx<DefaultRow>['index']>,\n  sortOrders: {\n    type: Array as PropType<TableColumnCtx<DefaultRow>['sortOrders']>,\n    default: () => {\n      return ['ascending', 'descending', null]\n    },\n    validator: (val: TableColumnCtx<unknown>['sortOrders']) => {\n      return val.every(\n        (order: string) => ['ascending', 'descending', null].indexOf(order) > -1\n      )\n    },\n  },\n}\n"],"names":[],"mappings":"AAAA,mBAAe;AACf,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,SAAS;AACtB,GAAG;AACH,EAAE,KAAK,EAAE,MAAM;AACf,EAAE,SAAS,EAAE,MAAM;AACnB,EAAE,cAAc,EAAE,MAAM;AACxB,EAAE,QAAQ,EAAE,MAAM;AAClB,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,YAAY,EAAE,QAAQ;AACxB,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC;AAC3B,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,UAAU,EAAE,QAAQ;AACtB,EAAE,MAAM,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,KAAK,CAAC;AACnC,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,SAAS,EAAE,MAAM;AACnB,EAAE,KAAK,EAAE,MAAM;AACf,EAAE,WAAW,EAAE,MAAM;AACrB,EAAE,uBAAuB,EAAE,OAAO;AAClC,EAAE,mBAAmB,EAAE,OAAO;AAC9B,EAAE,KAAK,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC;AAC1B,EAAE,SAAS,EAAE,QAAQ;AACrB,EAAE,UAAU,EAAE,QAAQ;AACtB,EAAE,gBAAgB,EAAE,OAAO;AAC3B,EAAE,YAAY,EAAE,QAAQ;AACxB,EAAE,aAAa,EAAE,KAAK;AACtB,EAAE,OAAO,EAAE,KAAK;AAChB,EAAE,eAAe,EAAE,MAAM;AACzB,EAAE,cAAc,EAAE;AAClB,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,KAAK,EAAE,CAAC,MAAM,EAAE,QAAQ,CAAC;AAC3B,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,KAAK;AACf,IAAI,OAAO,EAAE,MAAM;AACnB,MAAM,OAAO,CAAC,WAAW,EAAE,YAAY,EAAE,IAAI,CAAC,CAAC;AAC/C,KAAK;AACL,IAAI,SAAS,EAAE,CAAC,GAAG,KAAK;AACxB,MAAM,OAAO,GAAG,CAAC,KAAK,CAAC,CAAC,KAAK,KAAK,CAAC,WAAW,EAAE,YAAY,EAAE,IAAI,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;AACzF,KAAK;AACL,GAAG;AACH,CAAC;;;;"}

package/es/components/table/src/table-column/index.mjs

@@ -54,6 +54,7 @@ var ElTableColumn = defineComponent({
         filteredValue: [],
         filterPlacement: "",
         isColumnGroup: false,
+        isSubColumn: false,
         filterOpened: false,
         sortable,
         index: props.index,

package/es/components/table/src/table-column/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../../../../../packages/components/table/src/table-column/index.ts"],"sourcesContent":["import {\n  defineComponent,\n  ref,\n  onBeforeMount,\n  onMounted,\n  computed,\n  getCurrentInstance,\n  h,\n  onBeforeUnmount,\n  Fragment,\n} from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { cellStarts } from '../config'\nimport { mergeOptions, compose } from '../util'\nimport useWatcher from './watcher-helper'\nimport useRender from './render-helper'\nimport defaultProps from './defaults'\nimport type { TableColumn, TableColumnCtx } from './defaults'\n\nimport type { DefaultRow } from '../table/defaults'\n\nlet columnIdSeed = 1\n\nexport default defineComponent({\n  name: 'ElTableColumn',\n  components: {\n    ElCheckbox,\n  },\n  props: defaultProps,\n  setup(props, { slots }) {\n    const instance = getCurrentInstance() as TableColumn<DefaultRow>\n    const columnConfig = ref<Partial<TableColumnCtx<DefaultRow>>>({})\n    const owner = computed(() => {\n      let parent = instance.parent as any\n      while (parent && !parent.tableId) {\n        parent = parent.parent\n      }\n      return parent\n    })\n\n    const { registerNormalWatchers, registerComplexWatchers } = useWatcher(\n      owner,\n      props\n    )\n    const {\n      columnId,\n      isSubColumn,\n      realHeaderAlign,\n      columnOrTableParent,\n      setColumnWidth,\n      setColumnForcedProps,\n      setColumnRenders,\n      getPropsData,\n      getColumnElIndex,\n      realAlign,\n    } = useRender(props as unknown as TableColumnCtx<unknown>, slots, owner)\n\n    const parent = columnOrTableParent.value\n    columnId.value = `${\n      parent.tableId || parent.columnId\n    }_column_${columnIdSeed++}`\n    onBeforeMount(() => {\n      isSubColumn.value = owner.value !== parent\n\n      const type = props.type || 'default'\n      const sortable = props.sortable === '' ? true : props.sortable\n      const defaults = {\n        ...cellStarts[type],\n        id: columnId.value,\n        type,\n        property: props.prop || props.property,\n        align: realAlign,\n        headerAlign: realHeaderAlign,\n        showOverflowTooltip:\n          props.showOverflowTooltip || props.showTooltipWhenOverflow,\n        // filter 相关属性\n        filterable: props.filters || props.filterMethod,\n        filteredValue: [],\n        filterPlacement: '',\n        isColumnGroup: false,\n        filterOpened: false,\n        // sort 相关属性\n        sortable,\n        // index 列\n        index: props.index,\n        // <el-table-column key=\"xxx\" />\n        rawColumnKey: instance.vnode.key,\n      }\n\n      const basicProps = [\n        'columnKey',\n        'label',\n        'className',\n        'labelClassName',\n        'type',\n        'renderHeader',\n        'formatter',\n        'fixed',\n        'resizable',\n      ]\n      const sortProps = ['sortMethod', 'sortBy', 'sortOrders']\n      const selectProps = ['selectable', 'reserveSelection']\n      const filterProps = [\n        'filterMethod',\n        'filters',\n        'filterMultiple',\n        'filterOpened',\n        'filteredValue',\n        'filterPlacement',\n      ]\n\n      let column = getPropsData(basicProps, sortProps, selectProps, filterProps)\n\n      column = mergeOptions(defaults, column)\n      // 注意 compose 中函数执行的顺序是从右到左\n      const chains = compose(\n        setColumnRenders,\n        setColumnWidth,\n        setColumnForcedProps\n      )\n      column = chains(column)\n      columnConfig.value = column\n\n      // 注册 watcher\n      registerNormalWatchers()\n      registerComplexWatchers()\n    })\n    onMounted(() => {\n      const parent = columnOrTableParent.value\n      const children = isSubColumn.value\n        ? parent.vnode.el.children\n        : parent.refs.hiddenColumns?.children\n      const getColumnIndex = () =>\n        getColumnElIndex(children || [], instance.vnode.el)\n      columnConfig.value.getColumnIndex = getColumnIndex\n      const columnIndex = getColumnIndex()\n      columnIndex > -1 &&\n        owner.value.store.commit(\n          'insertColumn',\n          columnConfig.value,\n          isSubColumn.value ? parent.columnConfig.value : null\n        )\n    })\n    onBeforeUnmount(() => {\n      owner.value.store.commit(\n        'removeColumn',\n        columnConfig.value,\n        isSubColumn.value ? parent.columnConfig.value : null\n      )\n    })\n    instance.columnId = columnId.value\n\n    // eslint-disable-next-line\n    instance.columnConfig = columnConfig\n    return\n  },\n  render() {\n    let children = []\n    try {\n      const renderDefault = this.$slots.default?.({\n        row: {},\n        column: {},\n        $index: -1,\n      })\n      if (renderDefault instanceof Array) {\n        for (const childNode of renderDefault) {\n          if (\n            childNode.type?.name === 'ElTableColumn' ||\n            childNode.shapeFlag & 2\n          ) {\n            children.push(childNode)\n          } else if (\n            childNode.type === Fragment &&\n            childNode.children instanceof Array\n          ) {\n            children.push(...childNode.children)\n          }\n        }\n      }\n    } catch {\n      children = []\n    }\n    return h('div', children)\n  },\n})\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../../../../../../../packages/components/table/src/table-column/index.ts"],"sourcesContent":["import {\n  defineComponent,\n  ref,\n  onBeforeMount,\n  onMounted,\n  computed,\n  getCurrentInstance,\n  h,\n  onBeforeUnmount,\n  Fragment,\n} from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { cellStarts } from '../config'\nimport { mergeOptions, compose } from '../util'\nimport useWatcher from './watcher-helper'\nimport useRender from './render-helper'\nimport defaultProps from './defaults'\nimport type { TableColumn, TableColumnCtx } from './defaults'\n\nimport type { DefaultRow } from '../table/defaults'\n\nlet columnIdSeed = 1\n\nexport default defineComponent({\n  name: 'ElTableColumn',\n  components: {\n    ElCheckbox,\n  },\n  props: defaultProps,\n  setup(props, { slots }) {\n    const instance = getCurrentInstance() as TableColumn<DefaultRow>\n    const columnConfig = ref<Partial<TableColumnCtx<DefaultRow>>>({})\n    const owner = computed(() => {\n      let parent = instance.parent as any\n      while (parent && !parent.tableId) {\n        parent = parent.parent\n      }\n      return parent\n    })\n\n    const { registerNormalWatchers, registerComplexWatchers } = useWatcher(\n      owner,\n      props\n    )\n    const {\n      columnId,\n      isSubColumn,\n      realHeaderAlign,\n      columnOrTableParent,\n      setColumnWidth,\n      setColumnForcedProps,\n      setColumnRenders,\n      getPropsData,\n      getColumnElIndex,\n      realAlign,\n    } = useRender(props as unknown as TableColumnCtx<unknown>, slots, owner)\n\n    const parent = columnOrTableParent.value\n    columnId.value = `${\n      parent.tableId || parent.columnId\n    }_column_${columnIdSeed++}`\n    onBeforeMount(() => {\n      isSubColumn.value = owner.value !== parent\n\n      const type = props.type || 'default'\n      const sortable = props.sortable === '' ? true : props.sortable\n      const defaults = {\n        ...cellStarts[type],\n        id: columnId.value,\n        type,\n        property: props.prop || props.property,\n        align: realAlign,\n        headerAlign: realHeaderAlign,\n        showOverflowTooltip:\n          props.showOverflowTooltip || props.showTooltipWhenOverflow,\n        // filter 相关属性\n        filterable: props.filters || props.filterMethod,\n        filteredValue: [],\n        filterPlacement: '',\n        isColumnGroup: false,\n        isSubColumn: false,\n        filterOpened: false,\n        // sort 相关属性\n        sortable,\n        // index 列\n        index: props.index,\n        // <el-table-column key=\"xxx\" />\n        rawColumnKey: instance.vnode.key,\n      }\n\n      const basicProps = [\n        'columnKey',\n        'label',\n        'className',\n        'labelClassName',\n        'type',\n        'renderHeader',\n        'formatter',\n        'fixed',\n        'resizable',\n      ]\n      const sortProps = ['sortMethod', 'sortBy', 'sortOrders']\n      const selectProps = ['selectable', 'reserveSelection']\n      const filterProps = [\n        'filterMethod',\n        'filters',\n        'filterMultiple',\n        'filterOpened',\n        'filteredValue',\n        'filterPlacement',\n      ]\n\n      let column = getPropsData(basicProps, sortProps, selectProps, filterProps)\n\n      column = mergeOptions(defaults, column)\n      // 注意 compose 中函数执行的顺序是从右到左\n      const chains = compose(\n        setColumnRenders,\n        setColumnWidth,\n        setColumnForcedProps\n      )\n      column = chains(column)\n      columnConfig.value = column\n\n      // 注册 watcher\n      registerNormalWatchers()\n      registerComplexWatchers()\n    })\n    onMounted(() => {\n      const parent = columnOrTableParent.value\n      const children = isSubColumn.value\n        ? parent.vnode.el.children\n        : parent.refs.hiddenColumns?.children\n      const getColumnIndex = () =>\n        getColumnElIndex(children || [], instance.vnode.el)\n      columnConfig.value.getColumnIndex = getColumnIndex\n      const columnIndex = getColumnIndex()\n      columnIndex > -1 &&\n        owner.value.store.commit(\n          'insertColumn',\n          columnConfig.value,\n          isSubColumn.value ? parent.columnConfig.value : null\n        )\n    })\n    onBeforeUnmount(() => {\n      owner.value.store.commit(\n        'removeColumn',\n        columnConfig.value,\n        isSubColumn.value ? parent.columnConfig.value : null\n      )\n    })\n    instance.columnId = columnId.value\n\n    // eslint-disable-next-line\n    instance.columnConfig = columnConfig\n    return\n  },\n  render() {\n    let children = []\n    try {\n      const renderDefault = this.$slots.default?.({\n        row: {},\n        column: {},\n        $index: -1,\n      })\n      if (renderDefault instanceof Array) {\n        for (const childNode of renderDefault) {\n          if (\n            childNode.type?.name === 'ElTableColumn' ||\n            childNode.shapeFlag & 2\n          ) {\n            children.push(childNode)\n          } else if (\n            childNode.type === Fragment &&\n            childNode.children instanceof Array\n          ) {\n            children.push(...childNode.children)\n          }\n        }\n      }\n    } catch {\n      children = []\n    }\n    return h('div', children)\n  },\n})\n"],"names":[],"mappings":"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"}

package/es/components/table/src/table-footer/index.d.ts

@@ -29,8 +29,10 @@ declare const _default: import("vue").DefineComponent<{
         };
     };
 }, {
-    getRowClasses: (column: import("../table-column/defaults").TableColumnCtx<any>, cellIndex: number) => string[];
-    hasGutter: import("vue").ComputedRef<boolean>;
+    getCellClasses: (columns: import("../table-column/defaults").TableColumnCtx<any>[], cellIndex: number, hasGutter: boolean) => string[];
+    getCellStyles: (column: import("../table-column/defaults").TableColumnCtx<any>, cellIndex: number, hasGutter: boolean) => any;
+    hasGutter: import("vue").ComputedRef<boolean | 0 | null>;
+    gutterWidth: import("vue").ComputedRef<number>;
     columns: any;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     fixed?: unknown;