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

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

@@ -0,0 +1,98 @@
+declare const _default: import("vue").DefineComponent<{
+    readonly modelValue: import("../../../utils/props").BuildPropReturn<readonly [BooleanConstructor, StringConstructor, NumberConstructor], false, unknown, unknown, unknown>;
+    readonly value: import("../../../utils/props").BuildPropReturn<readonly [BooleanConstructor, StringConstructor, NumberConstructor], false, unknown, unknown, unknown>;
+    readonly disabled: import("../../../utils/props").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
+    readonly width: import("../../../utils/props").BuildPropReturn<NumberConstructor, 40, unknown, unknown, unknown>;
+    readonly inlinePrompt: import("../../../utils/props").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
+    readonly activeIcon: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, "", unknown, unknown, unknown>;
+    readonly inactiveIcon: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, "", unknown, unknown, unknown>;
+    readonly activeText: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly inactiveText: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly activeColor: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly inactiveColor: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly borderColor: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly activeValue: import("../../../utils/props").BuildPropReturn<readonly [BooleanConstructor, StringConstructor, NumberConstructor], true, unknown, unknown, unknown>;
+    readonly inactiveValue: import("../../../utils/props").BuildPropReturn<readonly [BooleanConstructor, StringConstructor, NumberConstructor], false, unknown, unknown, unknown>;
+    readonly name: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
+    readonly validateEvent: import("../../../utils/props").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
+    readonly id: StringConstructor;
+    readonly loading: import("../../../utils/props").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
+    readonly beforeChange: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<() => boolean | Promise<boolean>>, unknown, unknown, unknown, unknown>;
+}, {
+    input: import("vue").Ref<HTMLInputElement | undefined>;
+    core: import("vue").Ref<HTMLSpanElement | undefined>;
+    switchDisabled: import("vue").ComputedRef<boolean>;
+    checked: import("vue").ComputedRef<boolean>;
+    handleChange: () => void;
+    switchValue: () => void;
+    focus: () => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (val: string | number | boolean) => boolean;
+    change: (val: string | number | boolean) => boolean;
+    input: (val: string | number | boolean) => boolean;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    readonly modelValue?: unknown;
+    readonly value?: unknown;
+    readonly disabled?: unknown;
+    readonly width?: unknown;
+    readonly inlinePrompt?: unknown;
+    readonly activeIcon?: unknown;
+    readonly inactiveIcon?: unknown;
+    readonly activeText?: unknown;
+    readonly inactiveText?: unknown;
+    readonly activeColor?: unknown;
+    readonly inactiveColor?: unknown;
+    readonly borderColor?: unknown;
+    readonly activeValue?: unknown;
+    readonly inactiveValue?: unknown;
+    readonly name?: unknown;
+    readonly validateEvent?: unknown;
+    readonly id?: unknown;
+    readonly loading?: unknown;
+    readonly beforeChange?: unknown;
+} & {
+    disabled: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+    loading: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+    name: string;
+    modelValue: import("../../../utils/props").BuildPropType<readonly [BooleanConstructor, StringConstructor, NumberConstructor], unknown, unknown>;
+    width: number;
+    borderColor: string;
+    validateEvent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+    value: import("../../../utils/props").BuildPropType<readonly [BooleanConstructor, StringConstructor, NumberConstructor], unknown, unknown>;
+    inlinePrompt: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+    activeIcon: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, unknown, unknown>;
+    inactiveIcon: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, unknown, unknown>;
+    activeText: string;
+    inactiveText: string;
+    activeColor: string;
+    inactiveColor: string;
+    activeValue: import("../../../utils/props").BuildPropType<readonly [BooleanConstructor, StringConstructor, NumberConstructor], unknown, unknown>;
+    inactiveValue: import("../../../utils/props").BuildPropType<readonly [BooleanConstructor, StringConstructor, NumberConstructor], unknown, unknown>;
+} & {
+    id?: string | undefined;
+    beforeChange?: (() => boolean | Promise<boolean>) | undefined;
+}> & {
+    onChange?: ((val: string | number | boolean) => any) | undefined;
+    onInput?: ((val: string | number | boolean) => any) | undefined;
+    "onUpdate:modelValue"?: ((val: string | number | boolean) => any) | undefined;
+}, {
+    disabled: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+    loading: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+    name: string;
+    modelValue: import("../../../utils/props").BuildPropType<readonly [BooleanConstructor, StringConstructor, NumberConstructor], unknown, unknown>;
+    width: number;
+    borderColor: string;
+    validateEvent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+    value: import("../../../utils/props").BuildPropType<readonly [BooleanConstructor, StringConstructor, NumberConstructor], unknown, unknown>;
+    inlinePrompt: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+    activeIcon: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, unknown, unknown>;
+    inactiveIcon: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>, unknown, unknown>;
+    activeText: string;
+    inactiveText: string;
+    activeColor: string;
+    inactiveColor: string;
+    activeValue: import("../../../utils/props").BuildPropType<readonly [BooleanConstructor, StringConstructor, NumberConstructor], unknown, unknown>;
+    inactiveValue: import("../../../utils/props").BuildPropType<readonly [BooleanConstructor, StringConstructor, NumberConstructor], unknown, unknown>;
+    beforeChange: () => boolean | Promise<boolean>;
+}>;
+export default _default;

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

@@ -0,0 +1,117 @@
+import { defineComponent, computed, ref, watch, nextTick, onMounted } from 'vue';
+import { isPromise } from '@vue/shared';
+import { isBool } from '../../../utils/util.mjs';
+import { throwError, debugWarn } from '../../../utils/error.mjs';
+import { ElIcon } from '../../icon/index.mjs';
+import { Loading } from '@element-plus/icons-vue';
+import { UPDATE_MODEL_EVENT, CHANGE_EVENT, INPUT_EVENT } from '../../../utils/constants.mjs';
+import '../../../hooks/index.mjs';
+import { switchProps, switchEmits } from './switch.mjs';
+import { useFormItem } from '../../../hooks/use-form-item/index.mjs';
+import { useDisabled } from '../../../hooks/use-common-props/index.mjs';
+
+const COMPONENT_NAME = "ElSwitch";
+var script = defineComponent({
+  name: COMPONENT_NAME,
+  components: { ElIcon, Loading },
+  props: switchProps,
+  emits: switchEmits,
+  setup(props, { emit }) {
+    const { formItem } = useFormItem();
+    const switchDisabled = useDisabled(computed(() => props.loading));
+    const isModelValue = ref(props.modelValue !== false);
+    const input = ref();
+    const core = ref();
+    watch(() => props.modelValue, () => {
+      isModelValue.value = true;
+    });
+    watch(() => props.value, () => {
+      isModelValue.value = false;
+    });
+    const actualValue = computed(() => {
+      return isModelValue.value ? props.modelValue : props.value;
+    });
+    const checked = computed(() => actualValue.value === props.activeValue);
+    if (![props.activeValue, props.inactiveValue].includes(actualValue.value)) {
+      emit(UPDATE_MODEL_EVENT, props.inactiveValue);
+      emit(CHANGE_EVENT, props.inactiveValue);
+      emit(INPUT_EVENT, props.inactiveValue);
+    }
+    watch(checked, () => {
+      var _a;
+      input.value.checked = checked.value;
+      if (props.activeColor || props.inactiveColor) {
+        setBackgroundColor();
+      }
+      if (props.validateEvent) {
+        (_a = formItem == null ? void 0 : formItem.validate) == null ? void 0 : _a.call(formItem, "change");
+      }
+    });
+    const handleChange = () => {
+      const val = checked.value ? props.inactiveValue : props.activeValue;
+      emit(UPDATE_MODEL_EVENT, val);
+      emit(CHANGE_EVENT, val);
+      emit(INPUT_EVENT, val);
+      nextTick(() => {
+        input.value.checked = checked.value;
+      });
+    };
+    const switchValue = () => {
+      if (switchDisabled.value)
+        return;
+      const { beforeChange } = props;
+      if (!beforeChange) {
+        handleChange();
+        return;
+      }
+      const shouldChange = beforeChange();
+      const isExpectType = [isPromise(shouldChange), isBool(shouldChange)].some((i) => i);
+      if (!isExpectType) {
+        throwError(COMPONENT_NAME, "beforeChange must return type `Promise<boolean>` or `boolean`");
+      }
+      if (isPromise(shouldChange)) {
+        shouldChange.then((result) => {
+          if (result) {
+            handleChange();
+          }
+        }).catch((e) => {
+          debugWarn(COMPONENT_NAME, `some error occurred: ${e}`);
+        });
+      } else if (shouldChange) {
+        handleChange();
+      }
+    };
+    const setBackgroundColor = () => {
+      const newColor = checked.value ? props.activeColor : props.inactiveColor;
+      const coreEl = core.value;
+      if (props.borderColor)
+        coreEl.style.borderColor = props.borderColor;
+      else if (!props.borderColor)
+        coreEl.style.borderColor = newColor;
+      coreEl.style.backgroundColor = newColor;
+      coreEl.children[0].style.color = newColor;
+    };
+    const focus = () => {
+      var _a, _b;
+      (_b = (_a = input.value) == null ? void 0 : _a.focus) == null ? void 0 : _b.call(_a);
+    };
+    onMounted(() => {
+      if (props.activeColor || props.inactiveColor || props.borderColor) {
+        setBackgroundColor();
+      }
+      input.value.checked = checked.value;
+    });
+    return {
+      input,
+      core,
+      switchDisabled,
+      checked,
+      handleChange,
+      switchValue,
+      focus
+    };
+  }
+});
+
+export { script as default };
+//# sourceMappingURL=switch.vue_vue_type_script_lang.mjs.map

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

@@ -0,0 +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":";;;;;;;;;;;;AA8GA,MAAM,iBAAiB;AAEvB,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY,EAAE,QAAQ;AAAA,EAEtB,OAAO;AAAA,EACP,OAAO;AAAA,EAEP,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,EAAE,aAAa;AACrB,UAAM,iBAAiB,YAAY,SAAS,MAAM,MAAM;AAExD,UAAM,eAAe,IAAI,MAAM,eAAe;AAC9C,UAAM,QAAQ;AACd,UAAM,OAAO;AAEb,UACE,MAAM,MAAM,YACZ,MAAM;AACJ,mBAAa,QAAQ;AAAA;AAIzB,UACE,MAAM,MAAM,OACZ,MAAM;AACJ,mBAAa,QAAQ;AAAA;AAIzB,UAAM,cAAc,SAAS,MAAM;AACjC,aAAO,aAAa,QAAQ,MAAM,aAAa,MAAM;AAAA;AAGvD,UAAM,UAAU,SAAS,MAAM,YAAY,UAAU,MAAM;AAE3D,QAAI,CAAC,CAAC,MAAM,aAAa,MAAM,eAAe,SAAS,YAAY,QAAQ;AACzE,WAAK,oBAAoB,MAAM;AAC/B,WAAK,cAAc,MAAM;AACzB,WAAK,aAAa,MAAM;AAAA;AAG1B,UAAM,SAAS,MAAM;;AACnB,YAAM,MAAO,UAAU,QAAQ;AAE/B,UAAI,MAAM,eAAe,MAAM,eAAe;AAC5C;AAAA;AAGF,UAAI,MAAM,eAAe;AACvB,mDAAU,aAAV,kCAAqB;AAAA;AAAA;AAIzB,UAAM,eAAe,MAAY;AAC/B,YAAM,MAAM,QAAQ,QAAQ,MAAM,gBAAgB,MAAM;AACxD,WAAK,oBAAoB;AACzB,WAAK,cAAc;AACnB,WAAK,aAAa;AAClB,eAAS,MAAM;AACb,cAAM,MAAO,UAAU,QAAQ;AAAA;AAAA;AAInC,UAAM,cAAc,MAAY;AAC9B,UAAI,eAAe;AAAO;AAE1B,YAAM,EAAE,iBAAiB;AACzB,UAAI,CAAC,cAAc;AACjB;AACA;AAAA;AAGF,YAAM,eAAe;AAErB,YAAM,eAAe,CAAC,UAAU,eAAe,OAAO,eAAe,KACnE,CAAC,MAAM;AAET,UAAI,CAAC,cAAc;AACjB,mBACE,gBACA;AAAA;AAIJ,UAAI,UAAU,eAAe;AAC3B,qBACG,KAAK,CAAC,WAAW;AAChB,cAAI,QAAQ;AACV;AAAA;AAAA,WAGH,MAAM,CAAC,MAAM;AACZ,oBAAU,gBAAgB,wBAAwB;AAAA;AAAA,iBAE7C,cAAc;AACvB;AAAA;AAAA;AAIJ,UAAM,qBAAqB,MAAY;AACrC,YAAM,WAAW,QAAQ,QAAQ,MAAM,cAAc,MAAM;AAC3D,YAAM,SAAS,KAAK;AACpB,UAAI,MAAM;AAAa,eAAQ,MAAM,cAAc,MAAM;AAAA,eAChD,CAAC,MAAM;AAAa,eAAQ,MAAM,cAAc;AACzD,aAAQ,MAAM,kBAAkB;AAC/B,MAAC,OAAQ,SAAS,GAAsB,MAAM,QAAQ;AAAA;AAGzD,UAAM,QAAQ,MAAY;;AACxB,wBAAM,UAAN,mBAAa,UAAb;AAAA;AAGF,cAAU,MAAM;AACd,UAAI,MAAM,eAAe,MAAM,iBAAiB,MAAM,aAAa;AACjE;AAAA;AAGF,YAAM,MAAO,UAAU,QAAQ;AAAA;AAGjC,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}

package/es/components/switch/src/{index.vue_vue_type_template_id_ee4fcade_lang.mjs → switch.vue_vue_type_template_id_538fbc85_lang.mjs}

@@ -125,4 +125,4 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
 }
 
 export { render };
-//# sourceMappingURL=index.vue_vue_type_template_id_ee4fcade_lang.mjs.map
+//# sourceMappingURL=switch.vue_vue_type_template_id_538fbc85_lang.mjs.map

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

@@ -0,0 +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":["_createElementBlock","_createElementVNode","_createBlock","_resolveDynamicComponent","_createVNode"],"mappings":";;;;;;;EAuC+B,OAAM;AAAA;;;qBAoC1B,OAAM;;;;;sBA1EfA;IACE,uBAAM,8BACmB,mCAA8B;IACvD,MAAK;AAAA,IACJ,gBAAc;IACd,iBAAe;IACf,8DAAe;;IAEhBC;MACG,IAAI;MACL,KAAI;AAAA,MACJ,OAAM;AAAA,MACN,MAAK;AAAA,MACJ,MAAM;MACN,cAAY;MACZ,eAAa;MACb,UAAU;MACV,iDAAQ;MACR,2DAAe;;KAGT,2CAAiC,mCAD1CD;;MAEG;;;;;;MAMc,kCAAfE;yBAA6B;wBAAAA,YAAgCC,wBAAhB;;;;OAChC,qBAAgB,kCAA7BH;;QAA4C,eAAa;yBACvD;;IAGJC;MACE,KAAI;AAAA,MACJ,OAAM;AAAA,MACL,+BAAiB;;MAEP,kCAAXD,0BAAA;QACkB,mBAAc,kCAA9BA;UAEU,gCADRE;;YAEE,uBAAM,WACE;;6BAER;4BAAAA,oCAAgB;;;;UAGV,kCADRA;;YAEE,uBAAM,YACG;;6BAET;4BAAAA,oCAAgB;;;;kBAGC,mBAAc,kCAAnCF;UAEU,gCADRA;;YAEE,uBAAM,WACE;YACP,gBAAc;6BAEZ,gBAAW;UAGR,kCADRA;;YAEE,uBAAM,YACG;YACR,eAAa;6BAEX,kBAAa;;;MAItBC,0BAAA;QACiB,6BAAfC;;UAAwB,OAAM;AAAA;2BAAa;YAAAE,YAAW;AAAA;AAAA;;;;KAIjD,yCAA+B,iCADxCJ;;MAEG;;;;;;MAMc,gCAAfE;yBAA2B;wBAAAA,YAA8BC,wBAAd;;;;OAC9B,mBAAc,gCAA3BH;;QAAwC,gBAAc;yBACpD;;;;;;;"}

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

@@ -0,0 +1,7 @@
+import script from './switch.vue_vue_type_script_lang.mjs';
+export { default } from './switch.vue_vue_type_script_lang.mjs';
+import { render } from './switch.vue_vue_type_template_id_538fbc85_lang.mjs';
+
+script.render = render;
+script.__file = "packages/components/switch/src/switch.vue";
+//# sourceMappingURL=switch2.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"switch2.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

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

@@ -99,7 +99,7 @@ export declare const ElTable: import("../../utils/types").SFCWithInstall<import(
     handleHeaderFooterMousewheel: (event: any, data: any) => void;
     handleMouseLeave: () => void;
     tableId: string;
-    tableSize: import("vue").ComputedRef<any>;
+    tableSize: import("vue").ComputedRef<"" | import("../../utils/types").ComponentSize>;
     isHidden: import("vue").Ref<boolean>;
     isEmpty: import("vue").ComputedRef<boolean>;
     renderExpanded: import("vue").Ref<null>;
@@ -214,13 +214,13 @@ export declare const ElTable: import("../../utils/types").SFCWithInstall<import(
     selectOnIndeterminate: boolean;
     indent: number;
 } & {
-    emptyText?: string | undefined;
-    sumText?: string | undefined;
     size?: string | undefined;
     load?: ((row: any, treeNode: import("./src/table/defaults").TreeNode, resolve: (data: any[]) => void) => void) | undefined;
     height?: string | number | undefined;
     width?: string | number | undefined;
     maxHeight?: string | number | undefined;
+    emptyText?: string | undefined;
+    sumText?: string | undefined;
     cellClassName?: (string | ((data: {
         row: any;
         rowIndex: number;
@@ -342,7 +342,7 @@ export declare const ElTable: import("../../utils/types").SFCWithInstall<import(
         showTooltipWhenOverflow: BooleanConstructor;
         showOverflowTooltip: BooleanConstructor;
         fixed: (BooleanConstructor | StringConstructor)[];
-        formatter: import("vue").PropType<(row: any, column: import("./src/table-column/defaults").TableColumnCtx<any>, cellValue: any, index: number) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        formatter: import("vue").PropType<(row: any, column: import("./src/table-column/defaults").TableColumnCtx<any>, cellValue: any, index: number) => string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
             [key: string]: any;
         }>>;
         selectable: import("vue").PropType<(row: any, index: number) => boolean>;
@@ -408,10 +408,10 @@ export declare const ElTable: import("../../utils/types").SFCWithInstall<import(
         index?: number | ((index: number) => number) | undefined;
         align?: string | undefined;
         filters?: import("./src/table-column/defaults").Filters | undefined;
+        prop?: string | undefined;
         filterMethod?: import("./src/table-column/defaults").FilterMethods<any> | undefined;
         className?: string | undefined;
         labelClassName?: string | undefined;
-        prop?: string | undefined;
         renderHeader?: ((data: {
             column: import("./src/table-column/defaults").TableColumnCtx<any>;
             $index: number;
@@ -420,7 +420,7 @@ export declare const ElTable: import("../../utils/types").SFCWithInstall<import(
         }>) | undefined;
         sortMethod?: ((a: any, b: any) => number) | undefined;
         sortBy?: string | string[] | ((row: any, index: number) => string) | undefined;
-        formatter?: ((row: any, column: import("./src/table-column/defaults").TableColumnCtx<any>, cellValue: any, index: number) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        formatter?: ((row: any, column: import("./src/table-column/defaults").TableColumnCtx<any>, cellValue: any, index: number) => string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
             [key: string]: any;
         }>) | undefined;
         selectable?: ((row: any, index: number) => boolean) | undefined;
@@ -483,7 +483,7 @@ export declare const ElTableColumn: import("../../utils/types").SFCWithInstall<i
     showTooltipWhenOverflow: BooleanConstructor;
     showOverflowTooltip: BooleanConstructor;
     fixed: (BooleanConstructor | StringConstructor)[];
-    formatter: import("vue").PropType<(row: any, column: import("./src/table-column/defaults").TableColumnCtx<any>, cellValue: any, index: number) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    formatter: import("vue").PropType<(row: any, column: import("./src/table-column/defaults").TableColumnCtx<any>, cellValue: any, index: number) => string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>>;
     selectable: import("vue").PropType<(row: any, index: number) => boolean>;
@@ -549,10 +549,10 @@ export declare const ElTableColumn: import("../../utils/types").SFCWithInstall<i
     index?: number | ((index: number) => number) | undefined;
     align?: string | undefined;
     filters?: import("./src/table-column/defaults").Filters | undefined;
+    prop?: string | undefined;
     filterMethod?: import("./src/table-column/defaults").FilterMethods<any> | undefined;
     className?: string | undefined;
     labelClassName?: string | undefined;
-    prop?: string | undefined;
     renderHeader?: ((data: {
         column: import("./src/table-column/defaults").TableColumnCtx<any>;
         $index: number;
@@ -561,7 +561,7 @@ export declare const ElTableColumn: import("../../utils/types").SFCWithInstall<i
     }>) | undefined;
     sortMethod?: ((a: any, b: any) => number) | undefined;
     sortBy?: string | string[] | ((row: any, index: number) => string) | undefined;
-    formatter?: ((row: any, column: import("./src/table-column/defaults").TableColumnCtx<any>, cellValue: any, index: number) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    formatter?: ((row: any, column: import("./src/table-column/defaults").TableColumnCtx<any>, cellValue: any, index: number) => string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>) | undefined;
     selectable?: ((row: any, index: number) => boolean) | undefined;

package/es/components/table/src/config.mjs

@@ -1,7 +1,7 @@
 import { h } from 'vue';
 import { ElCheckbox } from '../../checkbox/index.mjs';
 import { ElIcon } from '../../icon/index.mjs';
-import { ArrowRight, Loading } from '@element-plus/icons';
+import { ArrowRight, Loading } from '@element-plus/icons-vue';
 import { getPropByPath } from '../../../utils/util.mjs';
 
 const cellStarts = {

package/es/components/table/src/config.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"config.mjs","sources":["../../../../../../packages/components/table/src/config.ts"],"sourcesContent":["import { h } from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowRight, Loading } from '@element-plus/icons'\nimport { getPropByPath } from '@element-plus/utils/util'\n\nimport type { VNode } from 'vue'\nimport type { TableColumnCtx } from './table-column/defaults'\nimport type { Store } from './store'\nimport type { TreeNode } from './table/defaults'\n\nexport const cellStarts = {\n  default: {\n    order: '',\n  },\n  selection: {\n    width: 48,\n    minWidth: 48,\n    realWidth: 48,\n    order: '',\n    className: 'el-table-column--selection',\n  },\n  expand: {\n    width: 48,\n    minWidth: 48,\n    realWidth: 48,\n    order: '',\n  },\n  index: {\n    width: 48,\n    minWidth: 48,\n    realWidth: 48,\n    order: '',\n  },\n}\n\n// 这些选项不应该被覆盖\nexport const cellForced = {\n  selection: {\n    renderHeader<T>({ store }: { store: Store<T> }) {\n      function isDisabled() {\n        return store.states.data.value && store.states.data.value.length === 0\n      }\n      return h(ElCheckbox, {\n        disabled: isDisabled(),\n        size: store.states.tableSize.value,\n        indeterminate:\n          store.states.selection.value.length > 0 &&\n          !store.states.isAllSelected.value,\n        'onUpdate:modelValue': store.toggleAllSelection,\n        modelValue: store.states.isAllSelected.value,\n      })\n    },\n    renderCell<T>({\n      row,\n      column,\n      store,\n      $index,\n    }: {\n      row: T\n      column: TableColumnCtx<T>\n      store: Store<T>\n      $index: string\n    }) {\n      return h(ElCheckbox, {\n        disabled: column.selectable\n          ? !column.selectable.call(null, row, $index)\n          : false,\n        size: store.states.tableSize.value,\n        onChange: () => {\n          store.commit('rowSelectedChanged', row)\n        },\n        onClick: (event: Event) => event.stopPropagation(),\n        modelValue: store.isSelected(row),\n      })\n    },\n    sortable: false,\n    resizable: false,\n  },\n  index: {\n    renderHeader<T>({ column }: { column: TableColumnCtx<T> }) {\n      return column.label || '#'\n    },\n    renderCell<T>({\n      column,\n      $index,\n    }: {\n      column: TableColumnCtx<T>\n      $index: number\n    }) {\n      let i = $index + 1\n      const index = column.index\n\n      if (typeof index === 'number') {\n        i = $index + index\n      } else if (typeof index === 'function') {\n        i = index($index)\n      }\n      return h('div', {}, [i])\n    },\n    sortable: false,\n  },\n  expand: {\n    renderHeader<T>({ column }: { column: TableColumnCtx<T> }) {\n      return column.label || ''\n    },\n    renderCell<T>({ row, store }: { row: T; store: Store<T> }) {\n      const classes = ['el-table__expand-icon']\n      if (store.states.expandRows.value.indexOf(row) > -1) {\n        classes.push('el-table__expand-icon--expanded')\n      }\n      const callback = function (e: Event) {\n        e.stopPropagation()\n        store.toggleRowExpansion(row)\n      }\n      return h(\n        'div',\n        {\n          class: classes,\n          onClick: callback,\n        },\n        {\n          default: () => {\n            return [\n              h(ElIcon, null, {\n                default: () => {\n                  return [h(ArrowRight)]\n                },\n              }),\n            ]\n          },\n        }\n      )\n    },\n    sortable: false,\n    resizable: false,\n    className: 'el-table__expand-column',\n  },\n}\n\nexport function defaultRenderCell<T>({\n  row,\n  column,\n  $index,\n}: {\n  row: T\n  column: TableColumnCtx<T>\n  $index: number\n}) {\n  const property = column.property\n  const value = property && getPropByPath(row, property, false).v\n  if (column && column.formatter) {\n    return column.formatter(row, column, value, $index)\n  }\n  return value?.toString?.() || ''\n}\n\nexport function treeCellPrefix<T>({\n  row,\n  treeNode,\n  store,\n}: {\n  row: T\n  treeNode: TreeNode\n  store: Store<T>\n}) {\n  if (!treeNode) return null\n  const ele: VNode[] = []\n  const callback = function (e) {\n    e.stopPropagation()\n    store.loadOrToggle(row)\n  }\n  if (treeNode.indent) {\n    ele.push(\n      h('span', {\n        class: 'el-table__indent',\n        style: { 'padding-left': `${treeNode.indent}px` },\n      })\n    )\n  }\n  if (typeof treeNode.expanded === 'boolean' && !treeNode.noLazyChildren) {\n    const expandClasses = [\n      'el-table__expand-icon',\n      treeNode.expanded ? 'el-table__expand-icon--expanded' : '',\n    ]\n    let icon = ArrowRight\n    if (treeNode.loading) {\n      icon = Loading\n    }\n\n    ele.push(\n      h(\n        'div',\n        {\n          class: expandClasses,\n          onClick: callback,\n        },\n        {\n          default: () => {\n            return [\n              h(\n                ElIcon,\n                { class: { 'is-loading': treeNode.loading } },\n                {\n                  default: () => [h(icon)],\n                }\n              ),\n            ]\n          },\n        }\n      )\n    )\n  } else {\n    ele.push(\n      h('span', {\n        class: 'el-table__placeholder',\n      })\n    )\n  }\n  return ele\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"config.mjs","sources":["../../../../../../packages/components/table/src/config.ts"],"sourcesContent":["import { h } from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowRight, Loading } from '@element-plus/icons-vue'\nimport { getPropByPath } from '@element-plus/utils/util'\n\nimport type { VNode } from 'vue'\nimport type { TableColumnCtx } from './table-column/defaults'\nimport type { Store } from './store'\nimport type { TreeNode } from './table/defaults'\n\nexport const cellStarts = {\n  default: {\n    order: '',\n  },\n  selection: {\n    width: 48,\n    minWidth: 48,\n    realWidth: 48,\n    order: '',\n    className: 'el-table-column--selection',\n  },\n  expand: {\n    width: 48,\n    minWidth: 48,\n    realWidth: 48,\n    order: '',\n  },\n  index: {\n    width: 48,\n    minWidth: 48,\n    realWidth: 48,\n    order: '',\n  },\n}\n\n// 这些选项不应该被覆盖\nexport const cellForced = {\n  selection: {\n    renderHeader<T>({ store }: { store: Store<T> }) {\n      function isDisabled() {\n        return store.states.data.value && store.states.data.value.length === 0\n      }\n      return h(ElCheckbox, {\n        disabled: isDisabled(),\n        size: store.states.tableSize.value,\n        indeterminate:\n          store.states.selection.value.length > 0 &&\n          !store.states.isAllSelected.value,\n        'onUpdate:modelValue': store.toggleAllSelection,\n        modelValue: store.states.isAllSelected.value,\n      })\n    },\n    renderCell<T>({\n      row,\n      column,\n      store,\n      $index,\n    }: {\n      row: T\n      column: TableColumnCtx<T>\n      store: Store<T>\n      $index: string\n    }) {\n      return h(ElCheckbox, {\n        disabled: column.selectable\n          ? !column.selectable.call(null, row, $index)\n          : false,\n        size: store.states.tableSize.value,\n        onChange: () => {\n          store.commit('rowSelectedChanged', row)\n        },\n        onClick: (event: Event) => event.stopPropagation(),\n        modelValue: store.isSelected(row),\n      })\n    },\n    sortable: false,\n    resizable: false,\n  },\n  index: {\n    renderHeader<T>({ column }: { column: TableColumnCtx<T> }) {\n      return column.label || '#'\n    },\n    renderCell<T>({\n      column,\n      $index,\n    }: {\n      column: TableColumnCtx<T>\n      $index: number\n    }) {\n      let i = $index + 1\n      const index = column.index\n\n      if (typeof index === 'number') {\n        i = $index + index\n      } else if (typeof index === 'function') {\n        i = index($index)\n      }\n      return h('div', {}, [i])\n    },\n    sortable: false,\n  },\n  expand: {\n    renderHeader<T>({ column }: { column: TableColumnCtx<T> }) {\n      return column.label || ''\n    },\n    renderCell<T>({ row, store }: { row: T; store: Store<T> }) {\n      const classes = ['el-table__expand-icon']\n      if (store.states.expandRows.value.indexOf(row) > -1) {\n        classes.push('el-table__expand-icon--expanded')\n      }\n      const callback = function (e: Event) {\n        e.stopPropagation()\n        store.toggleRowExpansion(row)\n      }\n      return h(\n        'div',\n        {\n          class: classes,\n          onClick: callback,\n        },\n        {\n          default: () => {\n            return [\n              h(ElIcon, null, {\n                default: () => {\n                  return [h(ArrowRight)]\n                },\n              }),\n            ]\n          },\n        }\n      )\n    },\n    sortable: false,\n    resizable: false,\n    className: 'el-table__expand-column',\n  },\n}\n\nexport function defaultRenderCell<T>({\n  row,\n  column,\n  $index,\n}: {\n  row: T\n  column: TableColumnCtx<T>\n  $index: number\n}) {\n  const property = column.property\n  const value = property && getPropByPath(row, property, false).v\n  if (column && column.formatter) {\n    return column.formatter(row, column, value, $index)\n  }\n  return value?.toString?.() || ''\n}\n\nexport function treeCellPrefix<T>({\n  row,\n  treeNode,\n  store,\n}: {\n  row: T\n  treeNode: TreeNode\n  store: Store<T>\n}) {\n  if (!treeNode) return null\n  const ele: VNode[] = []\n  const callback = function (e) {\n    e.stopPropagation()\n    store.loadOrToggle(row)\n  }\n  if (treeNode.indent) {\n    ele.push(\n      h('span', {\n        class: 'el-table__indent',\n        style: { 'padding-left': `${treeNode.indent}px` },\n      })\n    )\n  }\n  if (typeof treeNode.expanded === 'boolean' && !treeNode.noLazyChildren) {\n    const expandClasses = [\n      'el-table__expand-icon',\n      treeNode.expanded ? 'el-table__expand-icon--expanded' : '',\n    ]\n    let icon = ArrowRight\n    if (treeNode.loading) {\n      icon = Loading\n    }\n\n    ele.push(\n      h(\n        'div',\n        {\n          class: expandClasses,\n          onClick: callback,\n        },\n        {\n          default: () => {\n            return [\n              h(\n                ElIcon,\n                { class: { 'is-loading': treeNode.loading } },\n                {\n                  default: () => [h(icon)],\n                }\n              ),\n            ]\n          },\n        }\n      )\n    )\n  } else {\n    ele.push(\n      h('span', {\n        class: 'el-table__placeholder',\n      })\n    )\n  }\n  return ele\n}\n"],"names":[],"mappings":"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"}

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

@@ -1,7 +1,7 @@
 import { defineComponent, getCurrentInstance, ref, computed, watch } from 'vue';
 import { ElCheckbox } from '../../checkbox/index.mjs';
 import { ElIcon } from '../../icon/index.mjs';
-import { ArrowDown, ArrowUp } from '@element-plus/icons';
+import { ArrowDown, ArrowUp } from '@element-plus/icons-vue';
 import '../../../directives/index.mjs';
 import '../../../hooks/index.mjs';
 import _Popper from '../../popper/index.mjs';

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

@@ -1 +1 @@
-{"version":3,"file":"filter-panel.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/table/src/filter-panel.vue"],"sourcesContent":["<template>\n  <el-popper\n    ref=\"tooltip\"\n    v-model:visible=\"tooltipVisible\"\n    :offset=\"0\"\n    :placement=\"placement\"\n    :show-arrow=\"false\"\n    :stop-popper-mouse-event=\"false\"\n    :effect=\"Effect.LIGHT\"\n    pure\n    manual-mode\n    popper-class=\"el-table-filter\"\n    append-to-body\n  >\n    <template #default>\n      <div v-if=\"multiple\">\n        <div class=\"el-table-filter__content\">\n          <el-scrollbar wrap-class=\"el-table-filter__wrap\">\n            <el-checkbox-group\n              v-model=\"filteredValue\"\n              class=\"el-table-filter__checkbox-group\"\n            >\n              <el-checkbox\n                v-for=\"filter in filters\"\n                :key=\"filter.value\"\n                :label=\"filter.value\"\n              >\n                {{ filter.text }}\n              </el-checkbox>\n            </el-checkbox-group>\n          </el-scrollbar>\n        </div>\n        <div class=\"el-table-filter__bottom\">\n          <button\n            :class=\"{ 'is-disabled': filteredValue.length === 0 }\"\n            :disabled=\"filteredValue.length === 0\"\n            type=\"button\"\n            @click=\"handleConfirm\"\n          >\n            {{ t('el.table.confirmFilter') }}\n          </button>\n          <button type=\"button\" @click=\"handleReset\">\n            {{ t('el.table.resetFilter') }}\n          </button>\n        </div>\n      </div>\n      <ul v-else class=\"el-table-filter__list\">\n        <li\n          :class=\"{\n            'is-active': filterValue === undefined || filterValue === null,\n          }\"\n          class=\"el-table-filter__list-item\"\n          @click=\"handleSelect(null)\"\n        >\n          {{ t('el.table.clearFilter') }}\n        </li>\n        <li\n          v-for=\"filter in filters\"\n          :key=\"filter.value\"\n          :class=\"{ 'is-active': isActive(filter) }\"\n          :label=\"filter.value\"\n          class=\"el-table-filter__list-item\"\n          @click=\"handleSelect(filter.value)\"\n        >\n          {{ filter.text }}\n        </li>\n      </ul>\n    </template>\n    <template #trigger>\n      <span\n        v-click-outside:[popperPaneRef]=\"hideFilterPanel\"\n        class=\"el-table__column-filter-trigger el-none-outline\"\n        @click=\"showFilterPanel\"\n      >\n        <el-icon>\n          <arrow-up v-if=\"column.filterOpened\" />\n          <arrow-down v-else />\n        </el-icon>\n      </span>\n    </template>\n  </el-popper>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, computed, getCurrentInstance, watch } from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowDown, ArrowUp } from '@element-plus/icons'\nimport { ClickOutside } from '@element-plus/directives'\nimport { useLocale } from '@element-plus/hooks'\nimport ElPopper, { Effect } from '@element-plus/components/popper'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport type { Placement } from '@element-plus/components/popper'\n\nimport type { WritableComputedRef, PropType } from 'vue'\nimport type { TableColumnCtx } from './table-column/defaults'\nimport type { TableHeader } from './table-header'\nimport type { Store } from './store'\n\nconst { CheckboxGroup: ElCheckboxGroup } = ElCheckbox\n\nexport default defineComponent({\n  name: 'ElTableFilterPanel',\n  components: {\n    ElCheckbox,\n    ElCheckboxGroup,\n    ElScrollbar,\n    ElPopper,\n    ElIcon,\n    ArrowDown,\n    ArrowUp,\n  },\n  directives: { ClickOutside },\n  props: {\n    placement: {\n      type: String as PropType<Placement>,\n      default: 'bottom-start',\n    },\n    store: {\n      type: Object as PropType<Store<unknown>>,\n    },\n    column: {\n      type: Object as PropType<TableColumnCtx<unknown>>,\n    },\n    upDataColumn: {\n      type: Function,\n    },\n  },\n  setup(props) {\n    const instance = getCurrentInstance()\n    const { t } = useLocale()\n    const parent = instance.parent as TableHeader\n    if (!parent.filterPanels.value[props.column.id]) {\n      parent.filterPanels.value[props.column.id] = instance\n    }\n    const tooltipVisible = ref(false)\n    const tooltip = ref(null)\n    const filters = computed(() => {\n      return props.column && props.column.filters\n    })\n    const filterValue = computed({\n      get: () => (props.column.filteredValue || [])[0],\n      set: (value: string) => {\n        if (filteredValue.value) {\n          if (typeof value !== 'undefined' && value !== null) {\n            filteredValue.value.splice(0, 1, value)\n          } else {\n            filteredValue.value.splice(0, 1)\n          }\n        }\n      },\n    })\n    const filteredValue: WritableComputedRef<unknown[]> = computed({\n      get() {\n        if (props.column) {\n          return props.column.filteredValue || []\n        }\n        return []\n      },\n      set(value: unknown[]) {\n        if (props.column) {\n          props.upDataColumn('filteredValue', value)\n        }\n      },\n    })\n    const multiple = computed(() => {\n      if (props.column) {\n        return props.column.filterMultiple\n      }\n      return true\n    })\n    const isActive = (filter) => {\n      return filter.value === filterValue.value\n    }\n    const hidden = () => {\n      tooltipVisible.value = false\n    }\n    const showFilterPanel = (e: MouseEvent) => {\n      e.stopPropagation()\n      tooltipVisible.value = !tooltipVisible.value\n    }\n    const hideFilterPanel = () => {\n      tooltipVisible.value = false\n    }\n    const handleConfirm = () => {\n      confirmFilter(filteredValue.value)\n      hidden()\n    }\n    const handleReset = () => {\n      filteredValue.value = []\n      confirmFilter(filteredValue.value)\n      hidden()\n    }\n    const handleSelect = (_filterValue?: string) => {\n      filterValue.value = _filterValue\n      if (typeof _filterValue !== 'undefined' && _filterValue !== null) {\n        confirmFilter(filteredValue.value)\n      } else {\n        confirmFilter([])\n      }\n      hidden()\n    }\n    const confirmFilter = (filteredValue: unknown[]) => {\n      props.store.commit('filterChange', {\n        column: props.column,\n        values: filteredValue,\n      })\n      props.store.updateAllSelected()\n    }\n    watch(\n      tooltipVisible,\n      (value) => {\n        // todo\n        if (props.column) {\n          props.upDataColumn('filterOpened', value)\n        }\n      },\n      {\n        immediate: true,\n      }\n    )\n\n    const popperPaneRef = computed(() => {\n      return tooltip.value?.popperRef\n    })\n\n    return {\n      tooltipVisible,\n      multiple,\n      filteredValue,\n      filterValue,\n      filters,\n      handleConfirm,\n      handleReset,\n      handleSelect,\n      isActive,\n      t,\n      showFilterPanel,\n      hideFilterPanel,\n      popperPaneRef,\n      tooltip,\n      Effect,\n    }\n  },\n})\n</script>\n"],"names":["ElPopper"],"mappings":"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"}
+{"version":3,"file":"filter-panel.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/table/src/filter-panel.vue"],"sourcesContent":["<template>\n  <el-popper\n    ref=\"tooltip\"\n    v-model:visible=\"tooltipVisible\"\n    :offset=\"0\"\n    :placement=\"placement\"\n    :show-arrow=\"false\"\n    :stop-popper-mouse-event=\"false\"\n    :effect=\"Effect.LIGHT\"\n    pure\n    manual-mode\n    popper-class=\"el-table-filter\"\n    append-to-body\n  >\n    <template #default>\n      <div v-if=\"multiple\">\n        <div class=\"el-table-filter__content\">\n          <el-scrollbar wrap-class=\"el-table-filter__wrap\">\n            <el-checkbox-group\n              v-model=\"filteredValue\"\n              class=\"el-table-filter__checkbox-group\"\n            >\n              <el-checkbox\n                v-for=\"filter in filters\"\n                :key=\"filter.value\"\n                :label=\"filter.value\"\n              >\n                {{ filter.text }}\n              </el-checkbox>\n            </el-checkbox-group>\n          </el-scrollbar>\n        </div>\n        <div class=\"el-table-filter__bottom\">\n          <button\n            :class=\"{ 'is-disabled': filteredValue.length === 0 }\"\n            :disabled=\"filteredValue.length === 0\"\n            type=\"button\"\n            @click=\"handleConfirm\"\n          >\n            {{ t('el.table.confirmFilter') }}\n          </button>\n          <button type=\"button\" @click=\"handleReset\">\n            {{ t('el.table.resetFilter') }}\n          </button>\n        </div>\n      </div>\n      <ul v-else class=\"el-table-filter__list\">\n        <li\n          :class=\"{\n            'is-active': filterValue === undefined || filterValue === null,\n          }\"\n          class=\"el-table-filter__list-item\"\n          @click=\"handleSelect(null)\"\n        >\n          {{ t('el.table.clearFilter') }}\n        </li>\n        <li\n          v-for=\"filter in filters\"\n          :key=\"filter.value\"\n          :class=\"{ 'is-active': isActive(filter) }\"\n          :label=\"filter.value\"\n          class=\"el-table-filter__list-item\"\n          @click=\"handleSelect(filter.value)\"\n        >\n          {{ filter.text }}\n        </li>\n      </ul>\n    </template>\n    <template #trigger>\n      <span\n        v-click-outside:[popperPaneRef]=\"hideFilterPanel\"\n        class=\"el-table__column-filter-trigger el-none-outline\"\n        @click=\"showFilterPanel\"\n      >\n        <el-icon>\n          <arrow-up v-if=\"column.filterOpened\" />\n          <arrow-down v-else />\n        </el-icon>\n      </span>\n    </template>\n  </el-popper>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, computed, getCurrentInstance, watch } from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowDown, ArrowUp } from '@element-plus/icons-vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport { useLocale } from '@element-plus/hooks'\nimport ElPopper, { Effect } from '@element-plus/components/popper'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport type { Placement } from '@element-plus/components/popper'\n\nimport type { WritableComputedRef, PropType } from 'vue'\nimport type { TableColumnCtx } from './table-column/defaults'\nimport type { TableHeader } from './table-header'\nimport type { Store } from './store'\n\nconst { CheckboxGroup: ElCheckboxGroup } = ElCheckbox\n\nexport default defineComponent({\n  name: 'ElTableFilterPanel',\n  components: {\n    ElCheckbox,\n    ElCheckboxGroup,\n    ElScrollbar,\n    ElPopper,\n    ElIcon,\n    ArrowDown,\n    ArrowUp,\n  },\n  directives: { ClickOutside },\n  props: {\n    placement: {\n      type: String as PropType<Placement>,\n      default: 'bottom-start',\n    },\n    store: {\n      type: Object as PropType<Store<unknown>>,\n    },\n    column: {\n      type: Object as PropType<TableColumnCtx<unknown>>,\n    },\n    upDataColumn: {\n      type: Function,\n    },\n  },\n  setup(props) {\n    const instance = getCurrentInstance()\n    const { t } = useLocale()\n    const parent = instance.parent as TableHeader\n    if (!parent.filterPanels.value[props.column.id]) {\n      parent.filterPanels.value[props.column.id] = instance\n    }\n    const tooltipVisible = ref(false)\n    const tooltip = ref(null)\n    const filters = computed(() => {\n      return props.column && props.column.filters\n    })\n    const filterValue = computed({\n      get: () => (props.column.filteredValue || [])[0],\n      set: (value: string) => {\n        if (filteredValue.value) {\n          if (typeof value !== 'undefined' && value !== null) {\n            filteredValue.value.splice(0, 1, value)\n          } else {\n            filteredValue.value.splice(0, 1)\n          }\n        }\n      },\n    })\n    const filteredValue: WritableComputedRef<unknown[]> = computed({\n      get() {\n        if (props.column) {\n          return props.column.filteredValue || []\n        }\n        return []\n      },\n      set(value: unknown[]) {\n        if (props.column) {\n          props.upDataColumn('filteredValue', value)\n        }\n      },\n    })\n    const multiple = computed(() => {\n      if (props.column) {\n        return props.column.filterMultiple\n      }\n      return true\n    })\n    const isActive = (filter) => {\n      return filter.value === filterValue.value\n    }\n    const hidden = () => {\n      tooltipVisible.value = false\n    }\n    const showFilterPanel = (e: MouseEvent) => {\n      e.stopPropagation()\n      tooltipVisible.value = !tooltipVisible.value\n    }\n    const hideFilterPanel = () => {\n      tooltipVisible.value = false\n    }\n    const handleConfirm = () => {\n      confirmFilter(filteredValue.value)\n      hidden()\n    }\n    const handleReset = () => {\n      filteredValue.value = []\n      confirmFilter(filteredValue.value)\n      hidden()\n    }\n    const handleSelect = (_filterValue?: string) => {\n      filterValue.value = _filterValue\n      if (typeof _filterValue !== 'undefined' && _filterValue !== null) {\n        confirmFilter(filteredValue.value)\n      } else {\n        confirmFilter([])\n      }\n      hidden()\n    }\n    const confirmFilter = (filteredValue: unknown[]) => {\n      props.store.commit('filterChange', {\n        column: props.column,\n        values: filteredValue,\n      })\n      props.store.updateAllSelected()\n    }\n    watch(\n      tooltipVisible,\n      (value) => {\n        // todo\n        if (props.column) {\n          props.upDataColumn('filterOpened', value)\n        }\n      },\n      {\n        immediate: true,\n      }\n    )\n\n    const popperPaneRef = computed(() => {\n      return tooltip.value?.popperRef\n    })\n\n    return {\n      tooltipVisible,\n      multiple,\n      filteredValue,\n      filterValue,\n      filters,\n      handleConfirm,\n      handleReset,\n      handleSelect,\n      isActive,\n      t,\n      showFilterPanel,\n      hideFilterPanel,\n      popperPaneRef,\n      tooltip,\n      Effect,\n    }\n  },\n})\n</script>\n"],"names":["ElPopper"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"filter-panel.vue_vue_type_template_id_fde1c940_lang.mjs","sources":["../../../../../../packages/components/table/src/filter-panel.vue?vue&type=template&id=fde1c940&lang.js"],"sourcesContent":["<template>\n  <el-popper\n    ref=\"tooltip\"\n    v-model:visible=\"tooltipVisible\"\n    :offset=\"0\"\n    :placement=\"placement\"\n    :show-arrow=\"false\"\n    :stop-popper-mouse-event=\"false\"\n    :effect=\"Effect.LIGHT\"\n    pure\n    manual-mode\n    popper-class=\"el-table-filter\"\n    append-to-body\n  >\n    <template #default>\n      <div v-if=\"multiple\">\n        <div class=\"el-table-filter__content\">\n          <el-scrollbar wrap-class=\"el-table-filter__wrap\">\n            <el-checkbox-group\n              v-model=\"filteredValue\"\n              class=\"el-table-filter__checkbox-group\"\n            >\n              <el-checkbox\n                v-for=\"filter in filters\"\n                :key=\"filter.value\"\n                :label=\"filter.value\"\n              >\n                {{ filter.text }}\n              </el-checkbox>\n            </el-checkbox-group>\n          </el-scrollbar>\n        </div>\n        <div class=\"el-table-filter__bottom\">\n          <button\n            :class=\"{ 'is-disabled': filteredValue.length === 0 }\"\n            :disabled=\"filteredValue.length === 0\"\n            type=\"button\"\n            @click=\"handleConfirm\"\n          >\n            {{ t('el.table.confirmFilter') }}\n          </button>\n          <button type=\"button\" @click=\"handleReset\">\n            {{ t('el.table.resetFilter') }}\n          </button>\n        </div>\n      </div>\n      <ul v-else class=\"el-table-filter__list\">\n        <li\n          :class=\"{\n            'is-active': filterValue === undefined || filterValue === null,\n          }\"\n          class=\"el-table-filter__list-item\"\n          @click=\"handleSelect(null)\"\n        >\n          {{ t('el.table.clearFilter') }}\n        </li>\n        <li\n          v-for=\"filter in filters\"\n          :key=\"filter.value\"\n          :class=\"{ 'is-active': isActive(filter) }\"\n          :label=\"filter.value\"\n          class=\"el-table-filter__list-item\"\n          @click=\"handleSelect(filter.value)\"\n        >\n          {{ filter.text }}\n        </li>\n      </ul>\n    </template>\n    <template #trigger>\n      <span\n        v-click-outside:[popperPaneRef]=\"hideFilterPanel\"\n        class=\"el-table__column-filter-trigger el-none-outline\"\n        @click=\"showFilterPanel\"\n      >\n        <el-icon>\n          <arrow-up v-if=\"column.filterOpened\" />\n          <arrow-down v-else />\n        </el-icon>\n      </span>\n    </template>\n  </el-popper>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, computed, getCurrentInstance, watch } from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowDown, ArrowUp } from '@element-plus/icons'\nimport { ClickOutside } from '@element-plus/directives'\nimport { useLocale } from '@element-plus/hooks'\nimport ElPopper, { Effect } from '@element-plus/components/popper'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport type { Placement } from '@element-plus/components/popper'\n\nimport type { WritableComputedRef, PropType } from 'vue'\nimport type { TableColumnCtx } from './table-column/defaults'\nimport type { TableHeader } from './table-header'\nimport type { Store } from './store'\n\nconst { CheckboxGroup: ElCheckboxGroup } = ElCheckbox\n\nexport default defineComponent({\n  name: 'ElTableFilterPanel',\n  components: {\n    ElCheckbox,\n    ElCheckboxGroup,\n    ElScrollbar,\n    ElPopper,\n    ElIcon,\n    ArrowDown,\n    ArrowUp,\n  },\n  directives: { ClickOutside },\n  props: {\n    placement: {\n      type: String as PropType<Placement>,\n      default: 'bottom-start',\n    },\n    store: {\n      type: Object as PropType<Store<unknown>>,\n    },\n    column: {\n      type: Object as PropType<TableColumnCtx<unknown>>,\n    },\n    upDataColumn: {\n      type: Function,\n    },\n  },\n  setup(props) {\n    const instance = getCurrentInstance()\n    const { t } = useLocale()\n    const parent = instance.parent as TableHeader\n    if (!parent.filterPanels.value[props.column.id]) {\n      parent.filterPanels.value[props.column.id] = instance\n    }\n    const tooltipVisible = ref(false)\n    const tooltip = ref(null)\n    const filters = computed(() => {\n      return props.column && props.column.filters\n    })\n    const filterValue = computed({\n      get: () => (props.column.filteredValue || [])[0],\n      set: (value: string) => {\n        if (filteredValue.value) {\n          if (typeof value !== 'undefined' && value !== null) {\n            filteredValue.value.splice(0, 1, value)\n          } else {\n            filteredValue.value.splice(0, 1)\n          }\n        }\n      },\n    })\n    const filteredValue: WritableComputedRef<unknown[]> = computed({\n      get() {\n        if (props.column) {\n          return props.column.filteredValue || []\n        }\n        return []\n      },\n      set(value: unknown[]) {\n        if (props.column) {\n          props.upDataColumn('filteredValue', value)\n        }\n      },\n    })\n    const multiple = computed(() => {\n      if (props.column) {\n        return props.column.filterMultiple\n      }\n      return true\n    })\n    const isActive = (filter) => {\n      return filter.value === filterValue.value\n    }\n    const hidden = () => {\n      tooltipVisible.value = false\n    }\n    const showFilterPanel = (e: MouseEvent) => {\n      e.stopPropagation()\n      tooltipVisible.value = !tooltipVisible.value\n    }\n    const hideFilterPanel = () => {\n      tooltipVisible.value = false\n    }\n    const handleConfirm = () => {\n      confirmFilter(filteredValue.value)\n      hidden()\n    }\n    const handleReset = () => {\n      filteredValue.value = []\n      confirmFilter(filteredValue.value)\n      hidden()\n    }\n    const handleSelect = (_filterValue?: string) => {\n      filterValue.value = _filterValue\n      if (typeof _filterValue !== 'undefined' && _filterValue !== null) {\n        confirmFilter(filteredValue.value)\n      } else {\n        confirmFilter([])\n      }\n      hidden()\n    }\n    const confirmFilter = (filteredValue: unknown[]) => {\n      props.store.commit('filterChange', {\n        column: props.column,\n        values: filteredValue,\n      })\n      props.store.updateAllSelected()\n    }\n    watch(\n      tooltipVisible,\n      (value) => {\n        // todo\n        if (props.column) {\n          props.upDataColumn('filterOpened', value)\n        }\n      },\n      {\n        immediate: true,\n      }\n    )\n\n    const popperPaneRef = computed(() => {\n      return tooltip.value?.popperRef\n    })\n\n    return {\n      tooltipVisible,\n      multiple,\n      filteredValue,\n      filterValue,\n      filters,\n      handleConfirm,\n      handleReset,\n      handleSelect,\n      isActive,\n      t,\n      showFilterPanel,\n      hideFilterPanel,\n      popperPaneRef,\n      tooltip,\n      Effect,\n    }\n  },\n})\n</script>\n"],"names":["_createBlock","_createElementBlock","_createElementVNode","_createVNode"],"mappings":";;;qBAgBa,OAAM;qBAgBN,OAAM;;;;EAcF,OAAM;AAAA;;;;;;;;;;;sBA7CrBA;IACE,KAAI;AAAA,IACI,SAAS;8DAAA;IAChB,QAAQ;AAAA,IACR,WAAW;IACX,cAAY;AAAA,IACZ,2BAAyB;AAAA,IACzB,QAAQ,YAAO;AAAA,IAChB,MAAA;AAAA,IACA,eAAA;AAAA,IACA,gBAAa;AAAA,IACb,kBAAA;AAAA;IAEW,iBACT;MAAW,8BAAXC;QACEC,0BAAA;UACEC,uCAAc,cAAW;6BACvB;cAAAA;4BACW;6EAAA;gBACT,OAAM;AAAA;iCAGJ;oCADFF,8CACmB,eAAV;wCADTD;sBAEG,KAAK,OAAO;AAAA,sBACZ,OAAO,OAAO;AAAA;uCAEf;wDAAG,OAAO;;;;;;;;;;;;QAKlBE,0BAAA;UACEA;YACG,uCAAwB,mBAAc;YACtC,UAAU,mBAAc;YACzB,MAAK;AAAA,YACJ,gDAAO;6BAEL;UAELA;YAAQ,MAAK;AAAA,YAAU,gDAAO;6BACzB;;0BAITD,yBAAA;QACEC;UACG;;aAGK;AAAA,UACL,+CAAO;2BAEL;0BAELD,8CACmB,eAAV;8BADTA;YAEG,KAAK,OAAO;AAAA,YACZ,sCAAsB,cAAS,WAE1B;AAAA,YADL,OAAO,OAAO;AAAA,YAEd,qBAAO,kBAAa,OAAO;AAAA,6BAEzB,OAAO;;;;IAIL,iBACT;qBAAAC;QAEE,OAAM;AAAA,QACL,gDAAO;;QAERC;2BACE;YAAgB,YAAO,6BAAvBH,8DACAA;;;;;mCAN+B,sBAAjB;;;;;;;;;"}
+{"version":3,"file":"filter-panel.vue_vue_type_template_id_fde1c940_lang.mjs","sources":["../../../../../../packages/components/table/src/filter-panel.vue?vue&type=template&id=fde1c940&lang.js"],"sourcesContent":["<template>\n  <el-popper\n    ref=\"tooltip\"\n    v-model:visible=\"tooltipVisible\"\n    :offset=\"0\"\n    :placement=\"placement\"\n    :show-arrow=\"false\"\n    :stop-popper-mouse-event=\"false\"\n    :effect=\"Effect.LIGHT\"\n    pure\n    manual-mode\n    popper-class=\"el-table-filter\"\n    append-to-body\n  >\n    <template #default>\n      <div v-if=\"multiple\">\n        <div class=\"el-table-filter__content\">\n          <el-scrollbar wrap-class=\"el-table-filter__wrap\">\n            <el-checkbox-group\n              v-model=\"filteredValue\"\n              class=\"el-table-filter__checkbox-group\"\n            >\n              <el-checkbox\n                v-for=\"filter in filters\"\n                :key=\"filter.value\"\n                :label=\"filter.value\"\n              >\n                {{ filter.text }}\n              </el-checkbox>\n            </el-checkbox-group>\n          </el-scrollbar>\n        </div>\n        <div class=\"el-table-filter__bottom\">\n          <button\n            :class=\"{ 'is-disabled': filteredValue.length === 0 }\"\n            :disabled=\"filteredValue.length === 0\"\n            type=\"button\"\n            @click=\"handleConfirm\"\n          >\n            {{ t('el.table.confirmFilter') }}\n          </button>\n          <button type=\"button\" @click=\"handleReset\">\n            {{ t('el.table.resetFilter') }}\n          </button>\n        </div>\n      </div>\n      <ul v-else class=\"el-table-filter__list\">\n        <li\n          :class=\"{\n            'is-active': filterValue === undefined || filterValue === null,\n          }\"\n          class=\"el-table-filter__list-item\"\n          @click=\"handleSelect(null)\"\n        >\n          {{ t('el.table.clearFilter') }}\n        </li>\n        <li\n          v-for=\"filter in filters\"\n          :key=\"filter.value\"\n          :class=\"{ 'is-active': isActive(filter) }\"\n          :label=\"filter.value\"\n          class=\"el-table-filter__list-item\"\n          @click=\"handleSelect(filter.value)\"\n        >\n          {{ filter.text }}\n        </li>\n      </ul>\n    </template>\n    <template #trigger>\n      <span\n        v-click-outside:[popperPaneRef]=\"hideFilterPanel\"\n        class=\"el-table__column-filter-trigger el-none-outline\"\n        @click=\"showFilterPanel\"\n      >\n        <el-icon>\n          <arrow-up v-if=\"column.filterOpened\" />\n          <arrow-down v-else />\n        </el-icon>\n      </span>\n    </template>\n  </el-popper>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref, computed, getCurrentInstance, watch } from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { ArrowDown, ArrowUp } from '@element-plus/icons-vue'\nimport { ClickOutside } from '@element-plus/directives'\nimport { useLocale } from '@element-plus/hooks'\nimport ElPopper, { Effect } from '@element-plus/components/popper'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport type { Placement } from '@element-plus/components/popper'\n\nimport type { WritableComputedRef, PropType } from 'vue'\nimport type { TableColumnCtx } from './table-column/defaults'\nimport type { TableHeader } from './table-header'\nimport type { Store } from './store'\n\nconst { CheckboxGroup: ElCheckboxGroup } = ElCheckbox\n\nexport default defineComponent({\n  name: 'ElTableFilterPanel',\n  components: {\n    ElCheckbox,\n    ElCheckboxGroup,\n    ElScrollbar,\n    ElPopper,\n    ElIcon,\n    ArrowDown,\n    ArrowUp,\n  },\n  directives: { ClickOutside },\n  props: {\n    placement: {\n      type: String as PropType<Placement>,\n      default: 'bottom-start',\n    },\n    store: {\n      type: Object as PropType<Store<unknown>>,\n    },\n    column: {\n      type: Object as PropType<TableColumnCtx<unknown>>,\n    },\n    upDataColumn: {\n      type: Function,\n    },\n  },\n  setup(props) {\n    const instance = getCurrentInstance()\n    const { t } = useLocale()\n    const parent = instance.parent as TableHeader\n    if (!parent.filterPanels.value[props.column.id]) {\n      parent.filterPanels.value[props.column.id] = instance\n    }\n    const tooltipVisible = ref(false)\n    const tooltip = ref(null)\n    const filters = computed(() => {\n      return props.column && props.column.filters\n    })\n    const filterValue = computed({\n      get: () => (props.column.filteredValue || [])[0],\n      set: (value: string) => {\n        if (filteredValue.value) {\n          if (typeof value !== 'undefined' && value !== null) {\n            filteredValue.value.splice(0, 1, value)\n          } else {\n            filteredValue.value.splice(0, 1)\n          }\n        }\n      },\n    })\n    const filteredValue: WritableComputedRef<unknown[]> = computed({\n      get() {\n        if (props.column) {\n          return props.column.filteredValue || []\n        }\n        return []\n      },\n      set(value: unknown[]) {\n        if (props.column) {\n          props.upDataColumn('filteredValue', value)\n        }\n      },\n    })\n    const multiple = computed(() => {\n      if (props.column) {\n        return props.column.filterMultiple\n      }\n      return true\n    })\n    const isActive = (filter) => {\n      return filter.value === filterValue.value\n    }\n    const hidden = () => {\n      tooltipVisible.value = false\n    }\n    const showFilterPanel = (e: MouseEvent) => {\n      e.stopPropagation()\n      tooltipVisible.value = !tooltipVisible.value\n    }\n    const hideFilterPanel = () => {\n      tooltipVisible.value = false\n    }\n    const handleConfirm = () => {\n      confirmFilter(filteredValue.value)\n      hidden()\n    }\n    const handleReset = () => {\n      filteredValue.value = []\n      confirmFilter(filteredValue.value)\n      hidden()\n    }\n    const handleSelect = (_filterValue?: string) => {\n      filterValue.value = _filterValue\n      if (typeof _filterValue !== 'undefined' && _filterValue !== null) {\n        confirmFilter(filteredValue.value)\n      } else {\n        confirmFilter([])\n      }\n      hidden()\n    }\n    const confirmFilter = (filteredValue: unknown[]) => {\n      props.store.commit('filterChange', {\n        column: props.column,\n        values: filteredValue,\n      })\n      props.store.updateAllSelected()\n    }\n    watch(\n      tooltipVisible,\n      (value) => {\n        // todo\n        if (props.column) {\n          props.upDataColumn('filterOpened', value)\n        }\n      },\n      {\n        immediate: true,\n      }\n    )\n\n    const popperPaneRef = computed(() => {\n      return tooltip.value?.popperRef\n    })\n\n    return {\n      tooltipVisible,\n      multiple,\n      filteredValue,\n      filterValue,\n      filters,\n      handleConfirm,\n      handleReset,\n      handleSelect,\n      isActive,\n      t,\n      showFilterPanel,\n      hideFilterPanel,\n      popperPaneRef,\n      tooltip,\n      Effect,\n    }\n  },\n})\n</script>\n"],"names":["_createBlock","_createElementBlock","_createElementVNode","_createVNode"],"mappings":";;;qBAgBa,OAAM;qBAgBN,OAAM;;;;EAcF,OAAM;AAAA;;;;;;;;;;;sBA7CrBA;IACE,KAAI;AAAA,IACI,SAAS;8DAAA;IAChB,QAAQ;AAAA,IACR,WAAW;IACX,cAAY;AAAA,IACZ,2BAAyB;AAAA,IACzB,QAAQ,YAAO;AAAA,IAChB,MAAA;AAAA,IACA,eAAA;AAAA,IACA,gBAAa;AAAA,IACb,kBAAA;AAAA;IAEW,iBACT;MAAW,8BAAXC;QACEC,0BAAA;UACEC,uCAAc,cAAW;6BACvB;cAAAA;4BACW;6EAAA;gBACT,OAAM;AAAA;iCAGJ;oCADFF,8CACmB,eAAV;wCADTD;sBAEG,KAAK,OAAO;AAAA,sBACZ,OAAO,OAAO;AAAA;uCAEf;wDAAG,OAAO;;;;;;;;;;;;QAKlBE,0BAAA;UACEA;YACG,uCAAwB,mBAAc;YACtC,UAAU,mBAAc;YACzB,MAAK;AAAA,YACJ,gDAAO;6BAEL;UAELA;YAAQ,MAAK;AAAA,YAAU,gDAAO;6BACzB;;0BAITD,yBAAA;QACEC;UACG;;aAGK;AAAA,UACL,+CAAO;2BAEL;0BAELD,8CACmB,eAAV;8BADTA;YAEG,KAAK,OAAO;AAAA,YACZ,sCAAsB,cAAS,WAE1B;AAAA,YADL,OAAO,OAAO;AAAA,YAEd,qBAAO,kBAAa,OAAO;AAAA,6BAEzB,OAAO;;;;IAIL,iBACT;qBAAAC;QAEE,OAAM;AAAA,QACL,gDAAO;;QAERC;2BACE;YAAgB,YAAO,6BAAvBH,8DACAA;;;;;mCAN+B,sBAAjB;;;;;;;;;"}

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

@@ -8,7 +8,7 @@ declare function useStyle<T>(props: TableProps<T>, layout: TableLayout<T>, store
     isGroup: import("vue").Ref<boolean>;
     handleMouseLeave: () => void;
     handleHeaderFooterMousewheel: (event: any, data: any) => void;
-    tableSize: import("vue").ComputedRef<any>;
+    tableSize: import("vue").ComputedRef<"" | import("../../../../utils/types").ComponentSize>;
     bodyHeight: import("vue").ComputedRef<{
         height: string;
         'max-height'?: undefined;

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

@@ -1,12 +1,12 @@
 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 { useGlobalConfig } from '../../../../utils/util.mjs';
 import { on, off } from '../../../../utils/dom.mjs';
+import '../../../../hooks/index.mjs';
 import { parseHeight } from '../util.mjs';
+import { useSize } from '../../../../hooks/use-common-props/index.mjs';
 
 function useStyle(props, layout, store, table) {
-  const $ELEMENT = useGlobalConfig();
   const isHidden = ref(false);
   const renderExpanded = ref(null);
   const resizeProxyVisible = ref(false);
@@ -166,9 +166,7 @@ function useStyle(props, layout, store, table) {
       doLayout();
     }
   };
-  const tableSize = computed(() => {
-    return props.size || $ELEMENT.size;
-  });
+  const tableSize = useSize();
   const bodyWidth = computed(() => {
     const { bodyWidth: bodyWidth_, scrollY, gutterWidth } = layout;
     return bodyWidth_.value ? `${bodyWidth_.value - (scrollY.value ? gutterWidth : 0)}px` : "";