@element-plus/nightly 0.0.20220115 → 0.0.20220119

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

@@ -122,6 +122,7 @@ declare const _default: import("vue").DefineComponent<{
         height?: undefined;
         'max-height'?: undefined;
     }>;
+    height: import("vue").ComputedRef<number | undefined>;
     tableBodyStyles: import("vue").ComputedRef<{
         width: string;
     }>;
@@ -129,10 +130,6 @@ declare const _default: import("vue").DefineComponent<{
         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<{
@@ -169,103 +166,65 @@ declare const _default: import("vue").DefineComponent<{
     context: 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;
-    width?: unknown;
-    height?: unknown;
-    maxHeight?: unknown;
-    fit?: unknown;
-    stripe?: unknown;
-    border?: unknown;
-    rowKey?: unknown;
-    showHeader?: unknown;
-    showSummary?: unknown;
-    sumText?: unknown;
-    summaryMethod?: unknown;
-    rowClassName?: unknown;
-    rowStyle?: unknown;
-    cellClassName?: unknown;
-    cellStyle?: unknown;
-    headerRowClassName?: unknown;
-    headerRowStyle?: unknown;
-    headerCellClassName?: unknown;
-    headerCellStyle?: unknown;
-    highlightCurrentRow?: unknown;
-    currentRowKey?: unknown;
-    emptyText?: unknown;
-    expandRowKeys?: unknown;
-    defaultExpandAll?: unknown;
-    defaultSort?: unknown;
-    tooltipEffect?: unknown;
-    spanMethod?: unknown;
-    selectOnIndeterminate?: unknown;
-    indent?: unknown;
-    treeProps?: unknown;
-    lazy?: unknown;
-    load?: unknown;
-    style?: unknown;
-    className?: unknown;
-} & {
-    lazy: boolean;
-    data: any[];
-    style: import("vue").CSSProperties;
-    border: boolean;
-    className: string;
-    fit: boolean;
-    stripe: boolean;
-    treeProps: {
-        hasChildren?: string | undefined;
-        children?: string | undefined;
-    } | undefined;
-    showHeader: boolean;
-    showSummary: boolean;
-    highlightCurrentRow: boolean;
-    defaultExpandAll: boolean;
-    selectOnIndeterminate: boolean;
-    indent: number;
-} & {
-    size?: string | undefined;
-    load?: ((row: any, treeNode: import("./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: {
+}, 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<import("vue").ExtractPropTypes<{
+    data: {
+        type: import("vue").PropType<any[]>;
+        default: () => never[];
+    };
+    size: StringConstructor;
+    width: (StringConstructor | NumberConstructor)[];
+    height: (StringConstructor | NumberConstructor)[];
+    maxHeight: (StringConstructor | NumberConstructor)[];
+    fit: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    stripe: BooleanConstructor;
+    border: BooleanConstructor;
+    rowKey: import("vue").PropType<string | ((row: any) => string) | undefined>;
+    showHeader: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showSummary: BooleanConstructor;
+    sumText: StringConstructor;
+    summaryMethod: import("vue").PropType<import("./table/defaults").SummaryMethod<any> | undefined>;
+    rowClassName: import("vue").PropType<import("./table/defaults").ColumnCls<any> | undefined>;
+    rowStyle: import("vue").PropType<import("./table/defaults").ColumnStyle<any> | undefined>;
+    cellClassName: import("vue").PropType<(string | ((data: {
         row: any;
         rowIndex: number;
         column: import("./table-column/defaults").TableColumnCtx<any>;
         columnIndex: number;
-    }) => string)) | undefined;
-    defaultSort?: import("./table/defaults").Sort | undefined;
-    rowClassName?: import("./table/defaults").ColumnCls<any> | undefined;
-    rowStyle?: import("./table/defaults").ColumnStyle<any> | undefined;
-    tooltipEffect?: string | undefined;
-    summaryMethod?: import("./table/defaults").SummaryMethod<any> | undefined;
-    rowKey?: string | ((row: any) => string) | undefined;
-    cellStyle?: (import("vue").CSSProperties | ((data: {
+    }) => string)) | undefined>;
+    cellStyle: import("vue").PropType<(import("vue").CSSProperties | ((data: {
         row: any;
         rowIndex: number;
         column: import("./table-column/defaults").TableColumnCtx<any>;
         columnIndex: number;
-    }) => import("vue").CSSProperties)) | undefined;
-    headerRowClassName?: import("./table/defaults").ColumnCls<any> | undefined;
-    headerRowStyle?: import("./table/defaults").ColumnStyle<any> | undefined;
-    headerCellClassName?: (string | ((data: {
+    }) => import("vue").CSSProperties)) | undefined>;
+    headerRowClassName: import("vue").PropType<import("./table/defaults").ColumnCls<any> | undefined>;
+    headerRowStyle: import("vue").PropType<import("./table/defaults").ColumnStyle<any> | undefined>;
+    headerCellClassName: import("vue").PropType<(string | ((data: {
         row: any;
         rowIndex: number;
         column: import("./table-column/defaults").TableColumnCtx<any>;
         columnIndex: number;
-    }) => string)) | undefined;
-    headerCellStyle?: (import("vue").CSSProperties | ((data: {
+    }) => string)) | undefined>;
+    headerCellStyle: import("vue").PropType<(import("vue").CSSProperties | ((data: {
         row: any;
         rowIndex: number;
         column: import("./table-column/defaults").TableColumnCtx<any>;
         columnIndex: number;
-    }) => import("vue").CSSProperties)) | undefined;
-    expandRowKeys?: any[] | undefined;
-    spanMethod?: ((data: {
+    }) => import("vue").CSSProperties)) | undefined>;
+    highlightCurrentRow: BooleanConstructor;
+    currentRowKey: (StringConstructor | NumberConstructor)[];
+    emptyText: StringConstructor;
+    expandRowKeys: import("vue").PropType<any[] | undefined>;
+    defaultExpandAll: BooleanConstructor;
+    defaultSort: import("vue").PropType<import("./table/defaults").Sort | undefined>;
+    tooltipEffect: StringConstructor;
+    spanMethod: import("vue").PropType<((data: {
         row: any;
         rowIndex: number;
         column: import("./table-column/defaults").TableColumnCtx<any>;
@@ -273,9 +232,36 @@ declare const _default: import("vue").DefineComponent<{
     }) => number[] | {
         rowspan: number;
         colspan: number;
-    }) | undefined;
-    currentRowKey?: string | number | undefined;
-}> & {
+    }) | undefined>;
+    selectOnIndeterminate: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    indent: {
+        type: NumberConstructor;
+        default: number;
+    };
+    treeProps: {
+        type: import("vue").PropType<{
+            hasChildren?: string | undefined;
+            children?: string | undefined;
+        } | undefined>;
+        default: () => {
+            hasChildren: string;
+            children: string;
+        };
+    };
+    lazy: BooleanConstructor;
+    load: import("vue").PropType<((row: any, treeNode: import("./table/defaults").TreeNode, resolve: (data: any[]) => void) => void) | undefined>;
+    style: {
+        type: import("vue").PropType<import("vue").CSSProperties>;
+        default: () => {};
+    };
+    className: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & {
     onSelect?: ((...args: any[]) => any) | undefined;
     "onExpand-change"?: ((...args: any[]) => any) | undefined;
     "onCurrent-change"?: ((...args: any[]) => any) | undefined;
@@ -298,8 +284,8 @@ declare const _default: import("vue").DefineComponent<{
     lazy: boolean;
     data: any[];
     style: import("vue").CSSProperties;
-    border: boolean;
     className: string;
+    border: boolean;
     fit: boolean;
     stripe: boolean;
     treeProps: {

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

@@ -1,7 +1,8 @@
-import { defineComponent, getCurrentInstance, computed } from 'vue';
+import { defineComponent, getCurrentInstance, provide, computed } from 'vue';
 import debounce from 'lodash/debounce';
 import '../../../directives/index.mjs';
 import '../../../hooks/index.mjs';
+import { ElScrollbar } from '../../scrollbar/index.mjs';
 import { createStore } from './store/helper.mjs';
 import TableLayout from './table-layout.mjs';
 import TableHeader from './table-header/index.mjs';
@@ -10,6 +11,7 @@ import TableFooter from './table-footer/index.mjs';
 import useUtils from './table/utils-helper.mjs';
 import useStyle from './table/style-helper.mjs';
 import defaultProps from './table/defaults.mjs';
+import { TABLE_INJECTION_KEY } from './tokens.mjs';
 import Mousewheel from '../../../directives/mousewheel/index.mjs';
 import { useLocale } from '../../../hooks/use-locale/index.mjs';
 
@@ -22,7 +24,8 @@ var script = defineComponent({
   components: {
     TableHeader,
     TableBody,
-    TableFooter
+    TableFooter,
+    ElScrollbar
   },
   props: defaultProps,
   emits: [
@@ -48,6 +51,7 @@ var script = defineComponent({
   setup(props) {
     const { t } = useLocale();
     const table = getCurrentInstance();
+    provide(TABLE_INJECTION_KEY, table);
     const store = createStore(table, props);
     table.store = store;
     const layout = new TableLayout({
@@ -77,6 +81,7 @@ var script = defineComponent({
       handleHeaderFooterMousewheel,
       tableSize,
       bodyHeight,
+      height,
       emptyBlockStyle,
       handleFixedMousewheel,
       fixedHeight,
@@ -85,8 +90,7 @@ var script = defineComponent({
       bodyWidth,
       resizeState,
       doLayout,
-      tableBodyStyles,
-      borderBottomPatchStyles
+      tableBodyStyles
     } = useStyle(props, layout, store, table);
     const debouncedUpdateLayout = debounce(doLayout, 50);
     const tableId = `el-table_${tableIdSeed++}`;
@@ -116,9 +120,9 @@ var script = defineComponent({
       isGroup,
       bodyWidth,
       bodyHeight,
+      height,
       tableBodyStyles,
       emptyBlockStyle,
-      borderBottomPatchStyles,
       debouncedUpdateLayout,
       handleFixedMousewheel,
       fixedHeight,

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

@@ -1 +1 @@
-{"version":3,"file":"table.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/table/src/table.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"tableWrapper\"\n    :class=\"[\n      {\n        'el-table--fit': fit,\n        'el-table--striped': stripe,\n        'el-table--border': border || isGroup,\n        'el-table--hidden': isHidden,\n        'el-table--group': isGroup,\n        'el-table--fluid-height': maxHeight,\n        'el-table--scrollable-x': layout.scrollX.value,\n        'el-table--scrollable-y': layout.scrollY.value,\n        'el-table--enable-row-hover': !store.states.isComplex.value,\n        'el-table--enable-row-transition':\n          (store.states.data.value || []).length !== 0 &&\n          (store.states.data.value || []).length < 100,\n      },\n      tableSize ? `el-table--${tableSize}` : '',\n      className,\n      'el-table',\n    ]\"\n    :style=\"style\"\n    @mouseleave=\"handleMouseLeave()\"\n  >\n    <div class=\"el-table__inner-wrapper\">\n      <div ref=\"hiddenColumns\" class=\"hidden-columns\">\n        <slot></slot>\n      </div>\n      <div\n        v-if=\"showHeader\"\n        ref=\"headerWrapper\"\n        v-mousewheel=\"handleHeaderFooterMousewheel\"\n        class=\"el-table__header-wrapper\"\n      >\n        <table-header\n          ref=\"tableHeader\"\n          :border=\"border\"\n          :default-sort=\"defaultSort\"\n          :store=\"store\"\n          :style=\"tableBodyStyles\"\n          @set-drag-visible=\"setDragVisible\"\n        />\n      </div>\n      <div ref=\"bodyWrapper\" :style=\"bodyHeight\" class=\"el-table__body-wrapper\">\n        <table-body\n          :context=\"context\"\n          :highlight=\"highlightCurrentRow\"\n          :row-class-name=\"rowClassName\"\n          :tooltip-effect=\"tooltipEffect\"\n          :row-style=\"rowStyle\"\n          :store=\"store\"\n          :stripe=\"stripe\"\n          :style=\"{\n            width: bodyWidth,\n          }\"\n        />\n        <div\n          v-if=\"isEmpty\"\n          ref=\"emptyBlock\"\n          :style=\"emptyBlockStyle\"\n          class=\"el-table__empty-block\"\n        >\n          <span class=\"el-table__empty-text\">\n            <slot name=\"empty\">{{ computedEmptyText }}</slot>\n          </span>\n        </div>\n        <div\n          v-if=\"$slots.append\"\n          ref=\"appendWrapper\"\n          class=\"el-table__append-wrapper\"\n        >\n          <slot name=\"append\"></slot>\n        </div>\n      </div>\n      <div v-if=\"border || isGroup\" class=\"el-table__border-left-patch\"></div>\n      <div\n        v-if=\"layout.scrollX.value && layout.height.value\"\n        class=\"el-table__border-bottom-patch\"\n        :style=\"borderBottomPatchStyles\"\n      ></div>\n    </div>\n    <div\n      v-if=\"showSummary\"\n      v-show=\"!isEmpty\"\n      ref=\"footerWrapper\"\n      v-mousewheel=\"handleHeaderFooterMousewheel\"\n      class=\"el-table__footer-wrapper\"\n    >\n      <table-footer\n        :border=\"border\"\n        :default-sort=\"defaultSort\"\n        :store=\"store\"\n        :style=\"tableBodyStyles\"\n        :sum-text=\"computedSumText\"\n        :summary-method=\"summaryMethod\"\n      />\n    </div>\n    <div\n      v-show=\"resizeProxyVisible\"\n      ref=\"resizeProxy\"\n      class=\"el-table__column-resize-proxy\"\n    ></div>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, getCurrentInstance, computed } from 'vue'\nimport debounce from 'lodash/debounce'\nimport { Mousewheel } from '@element-plus/directives'\nimport { useLocale } from '@element-plus/hooks'\nimport { createStore } from './store/helper'\nimport TableLayout from './table-layout'\nimport TableHeader from './table-header'\nimport TableBody from './table-body'\nimport TableFooter from './table-footer'\nimport useUtils from './table/utils-helper'\nimport useStyle from './table/style-helper'\nimport defaultProps from './table/defaults'\n\nimport type { Table } from './table/defaults'\n\nlet tableIdSeed = 1\nexport default defineComponent({\n  name: 'ElTable',\n  directives: {\n    Mousewheel,\n  },\n  components: {\n    TableHeader,\n    TableBody,\n    TableFooter,\n  },\n  props: defaultProps,\n  emits: [\n    'select',\n    'select-all',\n    'selection-change',\n    'cell-mouse-enter',\n    'cell-mouse-leave',\n    'cell-contextmenu',\n    'cell-click',\n    'cell-dblclick',\n    'row-click',\n    'row-contextmenu',\n    'row-dblclick',\n    'header-click',\n    'header-contextmenu',\n    'sort-change',\n    'filter-change',\n    'current-change',\n    'header-dragend',\n    'expand-change',\n  ],\n  setup(props) {\n    type Row = typeof props.data[number]\n    const { t } = useLocale()\n    const table = getCurrentInstance() as Table<Row>\n    const store = createStore<Row>(table, props)\n    table.store = store\n    const layout = new TableLayout<Row>({\n      store: table.store,\n      table,\n      fit: props.fit,\n      showHeader: props.showHeader,\n    })\n    table.layout = layout\n\n    const isEmpty = computed(() => (store.states.data.value || []).length === 0)\n\n    /**\n     * open functions\n     */\n    const {\n      setCurrentRow,\n      toggleRowSelection,\n      clearSelection,\n      clearFilter,\n      toggleAllSelection,\n      toggleRowExpansion,\n      clearSort,\n      sort,\n    } = useUtils<Row>(store)\n    const {\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    } = useStyle<Row>(props, layout, store, table)\n\n    const debouncedUpdateLayout = debounce(doLayout, 50)\n\n    const tableId = `el-table_${tableIdSeed++}`\n    table.tableId = tableId\n    table.state = {\n      isGroup,\n      resizeState,\n      doLayout,\n      debouncedUpdateLayout,\n    }\n    const computedSumText = computed(\n      () => props.sumText || t('el.table.sumText')\n    )\n\n    const computedEmptyText = computed(() => {\n      return props.emptyText || t('el.table.emptyText')\n    })\n\n    return {\n      layout,\n      store,\n      handleHeaderFooterMousewheel,\n      handleMouseLeave,\n      tableId,\n      tableSize,\n      isHidden,\n      isEmpty,\n      renderExpanded,\n      resizeProxyVisible,\n      resizeState,\n      isGroup,\n      bodyWidth,\n      bodyHeight,\n      tableBodyStyles,\n      emptyBlockStyle,\n      borderBottomPatchStyles,\n      debouncedUpdateLayout,\n      handleFixedMousewheel,\n      fixedHeight,\n      fixedBodyHeight,\n      setCurrentRow,\n      toggleRowSelection,\n      clearSelection,\n      clearFilter,\n      toggleAllSelection,\n      toggleRowExpansion,\n      clearSort,\n      doLayout,\n      sort,\n      t,\n      setDragVisible,\n      context: table,\n      computedSumText,\n      computedEmptyText,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AAsHA,IAAI,WAAW,GAAG,EAAE;;AAEpB,EAAE,MAAM,SAAS;;AAEjB,IAAI,UAAU;AACd,GAAG;EACD,UAAU,EAAE;IACV;IACA,SAAS;;GAEV;OACI,EAAE;OACF,EAAE;IACL,QAAQ;;IAER;IACA;IACA;IACA;IACA,YAAY;IACZ,eAAe;IACf,WAAW;IACX,iBAAiB;IACjB;IACA,cAAc;IACd;IACA,aAAa;IACb;IACA;IACA,gBAAgB;IAChB;;OAEG,CAAC,KAAK,EAAE;IACX,MAAM,EAAE,CAAC,EAAE,GAAG;IACd,MAAM,KAAK,GAAG;;IAEd,KAAK,CAAC,KAAK;IACX,MAAM,MAAM,GAAG,IAAI,WAAW,CAAC;MAC7B,YAAY,CAAC,KAAK;MAClB,KAAK;MACL,KAAK,KAAK,IAAI;MACd,UAAU,EAAE;KACb,CAAC,CAAC;SACE,CAAC,MAAM,GAAG;UACT;;MAEJ,aAAa;;MAEb,cAAc;;MAEd,kBAAkB;;MAElB;UACI;KACL;IACD,MAAM;MACJ,QAAQ;MACR,cAAc;MACd,cAAc;MACd,OAAO;MACP,gBAAgB;MAChB;MACA,SAAS;MACT;MACA,eAAe;MACf;MACA;MACA;MACA;MACA;MACA,WAAW;MACX,QAAQ;MACR;MACA;QACE,QAAQ,CAAC;UACP;UACA,OAAO;SACR,CAAC,OAAO,GAAG;SACX,CAAC,KAAK,GAAG;MACZ,OAAO;MACP,WAAW;MACX,QAAQ;MACR;MACA;IACF,MAAM,eAAe,YAAY,WAAW,CAAC;;MAE3C,OAAO,KAAK,CAAC,SAAS,IAAI,EAAE,oBAAoB,CAAC;;IAEnD,OAAO;MACL,MAAM;MACN,KAAK;MACL;MACA;MACA,OAAO;MACP,SAAS;;MAET,OAAO;MACP,cAAc;;;MAGd,OAAO;MACP,SAAS;;;MAGT;MACA;MACA;MACA,qBAAqB;MACrB,WAAW;MACX;MACA;MACA;MACA;MACA,WAAW;MACX,kBAAkB;MAClB;MACA;MACA,QAAQ;MACR,IAAI;MACJ,CAAC;MACD,cAAc;MACd,OAAO,EAAE,KAAK;MACd,eAAe;MACf,iBAAiB;MACjB;;;;;;"}
+{"version":3,"file":"table.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/table/src/table.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"tableWrapper\"\n    :class=\"[\n      {\n        'el-table--fit': fit,\n        'el-table--striped': stripe,\n        'el-table--border': border || isGroup,\n        'el-table--hidden': isHidden,\n        'el-table--group': isGroup,\n        'el-table--fluid-height': maxHeight,\n        'el-table--scrollable-x': layout.scrollX.value,\n        'el-table--scrollable-y': layout.scrollY.value,\n        'el-table--enable-row-hover': !store.states.isComplex.value,\n        'el-table--enable-row-transition':\n          (store.states.data.value || []).length !== 0 &&\n          (store.states.data.value || []).length < 100,\n        'has-footer': showSummary,\n      },\n      tableSize ? `el-table--${tableSize}` : '',\n      className,\n      'el-table',\n    ]\"\n    :style=\"style\"\n    @mouseleave=\"handleMouseLeave()\"\n  >\n    <div class=\"el-table__inner-wrapper\">\n      <div ref=\"hiddenColumns\" class=\"hidden-columns\">\n        <slot></slot>\n      </div>\n      <div\n        v-if=\"showHeader\"\n        ref=\"headerWrapper\"\n        v-mousewheel=\"handleHeaderFooterMousewheel\"\n        class=\"el-table__header-wrapper\"\n      >\n        <table-header\n          ref=\"tableHeader\"\n          :border=\"border\"\n          :default-sort=\"defaultSort\"\n          :store=\"store\"\n          :style=\"tableBodyStyles\"\n          @set-drag-visible=\"setDragVisible\"\n        />\n      </div>\n      <div ref=\"bodyWrapper\" :style=\"bodyHeight\" class=\"el-table__body-wrapper\">\n        <el-scrollbar ref=\"scrollWrapper\" :height=\"height\">\n          <table-body\n            :context=\"context\"\n            :highlight=\"highlightCurrentRow\"\n            :row-class-name=\"rowClassName\"\n            :tooltip-effect=\"tooltipEffect\"\n            :row-style=\"rowStyle\"\n            :store=\"store\"\n            :stripe=\"stripe\"\n            :style=\"{\n              width: bodyWidth,\n            }\"\n          />\n          <div\n            v-if=\"isEmpty\"\n            ref=\"emptyBlock\"\n            :style=\"emptyBlockStyle\"\n            class=\"el-table__empty-block\"\n          >\n            <span class=\"el-table__empty-text\">\n              <slot name=\"empty\">{{ computedEmptyText }}</slot>\n            </span>\n          </div>\n          <div\n            v-if=\"$slots.append\"\n            ref=\"appendWrapper\"\n            class=\"el-table__append-wrapper\"\n          >\n            <slot name=\"append\"></slot>\n          </div>\n        </el-scrollbar>\n      </div>\n      <div v-if=\"border || isGroup\" class=\"el-table__border-left-patch\"></div>\n    </div>\n    <div\n      v-if=\"showSummary\"\n      v-show=\"!isEmpty\"\n      ref=\"footerWrapper\"\n      v-mousewheel=\"handleHeaderFooterMousewheel\"\n      class=\"el-table__footer-wrapper\"\n    >\n      <table-footer\n        :border=\"border\"\n        :default-sort=\"defaultSort\"\n        :store=\"store\"\n        :style=\"tableBodyStyles\"\n        :sum-text=\"computedSumText\"\n        :summary-method=\"summaryMethod\"\n      />\n    </div>\n    <div\n      v-show=\"resizeProxyVisible\"\n      ref=\"resizeProxy\"\n      class=\"el-table__column-resize-proxy\"\n    ></div>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, getCurrentInstance, computed, provide } from 'vue'\nimport debounce from 'lodash/debounce'\nimport { Mousewheel } from '@element-plus/directives'\nimport { useLocale } from '@element-plus/hooks'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport { createStore } from './store/helper'\nimport TableLayout from './table-layout'\nimport TableHeader from './table-header'\nimport TableBody from './table-body'\nimport TableFooter from './table-footer'\nimport useUtils from './table/utils-helper'\nimport useStyle from './table/style-helper'\nimport defaultProps from './table/defaults'\nimport { TABLE_INJECTION_KEY } from './tokens'\n\nimport type { Table } from './table/defaults'\n\nlet tableIdSeed = 1\nexport default defineComponent({\n  name: 'ElTable',\n  directives: {\n    Mousewheel,\n  },\n  components: {\n    TableHeader,\n    TableBody,\n    TableFooter,\n    ElScrollbar,\n  },\n  props: defaultProps,\n  emits: [\n    'select',\n    'select-all',\n    'selection-change',\n    'cell-mouse-enter',\n    'cell-mouse-leave',\n    'cell-contextmenu',\n    'cell-click',\n    'cell-dblclick',\n    'row-click',\n    'row-contextmenu',\n    'row-dblclick',\n    'header-click',\n    'header-contextmenu',\n    'sort-change',\n    'filter-change',\n    'current-change',\n    'header-dragend',\n    'expand-change',\n  ],\n  setup(props) {\n    type Row = typeof props.data[number]\n    const { t } = useLocale()\n    const table = getCurrentInstance() as Table<Row>\n    provide(TABLE_INJECTION_KEY, table)\n    const store = createStore<Row>(table, props)\n    table.store = store\n    const layout = new TableLayout<Row>({\n      store: table.store,\n      table,\n      fit: props.fit,\n      showHeader: props.showHeader,\n    })\n    table.layout = layout\n\n    const isEmpty = computed(() => (store.states.data.value || []).length === 0)\n\n    /**\n     * open functions\n     */\n    const {\n      setCurrentRow,\n      toggleRowSelection,\n      clearSelection,\n      clearFilter,\n      toggleAllSelection,\n      toggleRowExpansion,\n      clearSort,\n      sort,\n    } = useUtils<Row>(store)\n    const {\n      isHidden,\n      renderExpanded,\n      setDragVisible,\n      isGroup,\n      handleMouseLeave,\n      handleHeaderFooterMousewheel,\n      tableSize,\n      bodyHeight,\n      height,\n      emptyBlockStyle,\n      handleFixedMousewheel,\n      fixedHeight,\n      fixedBodyHeight,\n      resizeProxyVisible,\n      bodyWidth,\n      resizeState,\n      doLayout,\n      tableBodyStyles,\n    } = useStyle<Row>(props, layout, store, table)\n\n    const debouncedUpdateLayout = debounce(doLayout, 50)\n\n    const tableId = `el-table_${tableIdSeed++}`\n    table.tableId = tableId\n    table.state = {\n      isGroup,\n      resizeState,\n      doLayout,\n      debouncedUpdateLayout,\n    }\n    const computedSumText = computed(\n      () => props.sumText || t('el.table.sumText')\n    )\n\n    const computedEmptyText = computed(() => {\n      return props.emptyText || t('el.table.emptyText')\n    })\n\n    return {\n      layout,\n      store,\n      handleHeaderFooterMousewheel,\n      handleMouseLeave,\n      tableId,\n      tableSize,\n      isHidden,\n      isEmpty,\n      renderExpanded,\n      resizeProxyVisible,\n      resizeState,\n      isGroup,\n      bodyWidth,\n      bodyHeight,\n      height,\n      tableBodyStyles,\n      emptyBlockStyle,\n      debouncedUpdateLayout,\n      handleFixedMousewheel,\n      fixedHeight,\n      fixedBodyHeight,\n      setCurrentRow,\n      toggleRowSelection,\n      clearSelection,\n      clearFilter,\n      toggleAllSelection,\n      toggleRowExpansion,\n      clearSort,\n      doLayout,\n      sort,\n      t,\n      setDragVisible,\n      context: table,\n      computedSumText,\n      computedEmptyText,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAsHA,IAAI,WAAW,GAAG,CAAC,CAAC;;AAEpB,EAAE,MAAM,SAAS;;AAEjB,IAAI,UAAU;AACd,GAAG;EACD,UAAU,EAAE;IACV;IACA,SAAS;;IAET;;OAEG,EAAE;OACF,EAAE;IACL,QAAQ;;IAER;IACA;IACA;IACA;IACA,YAAY;IACZ,eAAe;IACf,WAAW;IACX,iBAAiB;IACjB;IACA,cAAc;IACd;IACA,aAAa;IACb;IACA;IACA,gBAAgB;IAChB;;OAEG,CAAC,KAAK,EAAE;IACX,MAAM,EAAE,CAAC,EAAE,GAAG;IACd,MAAM,KAAK,GAAG;;IAEd,MAAM,KAAK;IACX,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC;IACpB,MAAM,MAAM,GAAG,IAAI;MACjB,KAAK,EAAE,KAAK,CAAC,KAAK;MAClB,KAAK;MACL,KAAK,KAAK,IAAI;MACd,UAAU,EAAE;KACb,CAAC,CAAC;SACE,CAAC,MAAM,GAAG;UACT;;MAEJ,aAAa;;MAEb,cAAc;;MAEd,kBAAkB;;MAElB;UACI;KACL;IACD,MAAM;MACJ,QAAQ;MACR,cAAc;MACd,cAAc;MACd,OAAO;MACP,gBAAgB;MAChB;MACA,SAAS;MACT;MACA,MAAM;MACN;MACA;MACA,WAAW;MACX;MACA;MACA,SAAS;MACT,WAAW;MACX,QAAQ;MACR;QACE;UACE;UACA,OAAO,GAAG,CAAC;SACZ,CAAC,OAAO;SACR,CAAC,KAAK,GAAG;MACZ,OAAO;MACP;MACA,QAAQ;MACR;MACA;IACF,MAAM,eAAe,YAAY,WAAW,CAAC;;MAE3C,OAAO,KAAK,CAAC,SAAS,IAAI,EAAE,oBAAoB,CAAC;;IAEnD,OAAO;MACL,MAAM;MACN,KAAK;MACL;MACA;MACA,OAAO;MACP,SAAS;;MAET,OAAO;MACP,cAAc;;;MAGd,OAAO;MACP,SAAS;;;MAGT;MACA;MACA;MACA,qBAAqB;MACrB,WAAW;MACX;MACA;MACA;MACA;MACA,WAAW;MACX,kBAAkB;MAClB;MACA;MACA,QAAQ;MACR,IAAI;MACJ,CAAC;MACD,cAAc;MACd,OAAO,EAAE,KAAK;MACd,eAAe;MACf,iBAAiB;MACjB;;;;;;"}

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

@@ -1,4 +1,4 @@
-import { resolveComponent, resolveDirective, openBlock, createElementBlock, normalizeClass, normalizeStyle, createElementVNode, renderSlot, withDirectives, createVNode, createCommentVNode, createTextVNode, toDisplayString, vShow } from 'vue';
+import { resolveComponent, resolveDirective, openBlock, createElementBlock, normalizeClass, normalizeStyle, createElementVNode, renderSlot, withDirectives, createVNode, createCommentVNode, withCtx, createTextVNode, toDisplayString, vShow } from 'vue';
 
 const _hoisted_1 = { class: "el-table__inner-wrapper" };
 const _hoisted_2 = {
@@ -32,6 +32,7 @@ const _hoisted_8 = {
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_table_header = resolveComponent("table-header");
   const _component_table_body = resolveComponent("table-body");
+  const _component_el_scrollbar = resolveComponent("el-scrollbar");
   const _component_table_footer = resolveComponent("table-footer");
   const _directive_mousewheel = resolveDirective("mousewheel");
   return openBlock(), createElementBlock("div", {
@@ -47,7 +48,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         "el-table--scrollable-x": _ctx.layout.scrollX.value,
         "el-table--scrollable-y": _ctx.layout.scrollY.value,
         "el-table--enable-row-hover": !_ctx.store.states.isComplex.value,
-        "el-table--enable-row-transition": (_ctx.store.states.data.value || []).length !== 0 && (_ctx.store.states.data.value || []).length < 100
+        "el-table--enable-row-transition": (_ctx.store.states.data.value || []).length !== 0 && (_ctx.store.states.data.value || []).length < 100,
+        "has-footer": _ctx.showSummary
       },
       _ctx.tableSize ? `el-table--${_ctx.tableSize}` : "",
       _ctx.className,
@@ -77,40 +79,43 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         style: normalizeStyle(_ctx.bodyHeight),
         class: "el-table__body-wrapper"
       }, [
-        createVNode(_component_table_body, {
-          context: _ctx.context,
-          highlight: _ctx.highlightCurrentRow,
-          "row-class-name": _ctx.rowClassName,
-          "tooltip-effect": _ctx.tooltipEffect,
-          "row-style": _ctx.rowStyle,
-          store: _ctx.store,
-          stripe: _ctx.stripe,
-          style: normalizeStyle({
-            width: _ctx.bodyWidth
-          })
-        }, null, 8, ["context", "highlight", "row-class-name", "tooltip-effect", "row-style", "store", "stripe", "style"]),
-        _ctx.isEmpty ? (openBlock(), createElementBlock("div", {
-          key: 0,
-          ref: "emptyBlock",
-          style: normalizeStyle(_ctx.emptyBlockStyle),
-          class: "el-table__empty-block"
-        }, [
-          createElementVNode("span", _hoisted_4, [
-            renderSlot(_ctx.$slots, "empty", {}, () => [
-              createTextVNode(toDisplayString(_ctx.computedEmptyText), 1)
-            ])
-          ])
-        ], 4)) : createCommentVNode("v-if", true),
-        _ctx.$slots.append ? (openBlock(), createElementBlock("div", _hoisted_5, [
-          renderSlot(_ctx.$slots, "append")
-        ], 512)) : createCommentVNode("v-if", true)
+        createVNode(_component_el_scrollbar, {
+          ref: "scrollWrapper",
+          height: _ctx.height
+        }, {
+          default: withCtx(() => [
+            createVNode(_component_table_body, {
+              context: _ctx.context,
+              highlight: _ctx.highlightCurrentRow,
+              "row-class-name": _ctx.rowClassName,
+              "tooltip-effect": _ctx.tooltipEffect,
+              "row-style": _ctx.rowStyle,
+              store: _ctx.store,
+              stripe: _ctx.stripe,
+              style: normalizeStyle({
+                width: _ctx.bodyWidth
+              })
+            }, null, 8, ["context", "highlight", "row-class-name", "tooltip-effect", "row-style", "store", "stripe", "style"]),
+            _ctx.isEmpty ? (openBlock(), createElementBlock("div", {
+              key: 0,
+              ref: "emptyBlock",
+              style: normalizeStyle(_ctx.emptyBlockStyle),
+              class: "el-table__empty-block"
+            }, [
+              createElementVNode("span", _hoisted_4, [
+                renderSlot(_ctx.$slots, "empty", {}, () => [
+                  createTextVNode(toDisplayString(_ctx.computedEmptyText), 1)
+                ])
+              ])
+            ], 4)) : createCommentVNode("v-if", true),
+            _ctx.$slots.append ? (openBlock(), createElementBlock("div", _hoisted_5, [
+              renderSlot(_ctx.$slots, "append")
+            ], 512)) : createCommentVNode("v-if", true)
+          ]),
+          _: 3
+        }, 8, ["height"])
       ], 4),
-      _ctx.border || _ctx.isGroup ? (openBlock(), createElementBlock("div", _hoisted_6)) : createCommentVNode("v-if", true),
-      _ctx.layout.scrollX.value && _ctx.layout.height.value ? (openBlock(), createElementBlock("div", {
-        key: 2,
-        class: "el-table__border-bottom-patch",
-        style: normalizeStyle(_ctx.borderBottomPatchStyles)
-      }, null, 4)) : createCommentVNode("v-if", true)
+      _ctx.border || _ctx.isGroup ? (openBlock(), createElementBlock("div", _hoisted_6)) : createCommentVNode("v-if", true)
     ]),
     _ctx.showSummary ? withDirectives((openBlock(), createElementBlock("div", _hoisted_7, [
       createVNode(_component_table_footer, {

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

@@ -1 +1 @@
-{"version":3,"file":"table.vue_vue_type_template_id_4a1660ad_lang.mjs","sources":["../../../../../../packages/components/table/src/table.vue?vue&type=template&id=4a1660ad&lang.js"],"sourcesContent":["<template>\n  <div\n    ref=\"tableWrapper\"\n    :class=\"[\n      {\n        'el-table--fit': fit,\n        'el-table--striped': stripe,\n        'el-table--border': border || isGroup,\n        'el-table--hidden': isHidden,\n        'el-table--group': isGroup,\n        'el-table--fluid-height': maxHeight,\n        'el-table--scrollable-x': layout.scrollX.value,\n        'el-table--scrollable-y': layout.scrollY.value,\n        'el-table--enable-row-hover': !store.states.isComplex.value,\n        'el-table--enable-row-transition':\n          (store.states.data.value || []).length !== 0 &&\n          (store.states.data.value || []).length < 100,\n      },\n      tableSize ? `el-table--${tableSize}` : '',\n      className,\n      'el-table',\n    ]\"\n    :style=\"style\"\n    @mouseleave=\"handleMouseLeave()\"\n  >\n    <div class=\"el-table__inner-wrapper\">\n      <div ref=\"hiddenColumns\" class=\"hidden-columns\">\n        <slot></slot>\n      </div>\n      <div\n        v-if=\"showHeader\"\n        ref=\"headerWrapper\"\n        v-mousewheel=\"handleHeaderFooterMousewheel\"\n        class=\"el-table__header-wrapper\"\n      >\n        <table-header\n          ref=\"tableHeader\"\n          :border=\"border\"\n          :default-sort=\"defaultSort\"\n          :store=\"store\"\n          :style=\"tableBodyStyles\"\n          @set-drag-visible=\"setDragVisible\"\n        />\n      </div>\n      <div ref=\"bodyWrapper\" :style=\"bodyHeight\" class=\"el-table__body-wrapper\">\n        <table-body\n          :context=\"context\"\n          :highlight=\"highlightCurrentRow\"\n          :row-class-name=\"rowClassName\"\n          :tooltip-effect=\"tooltipEffect\"\n          :row-style=\"rowStyle\"\n          :store=\"store\"\n          :stripe=\"stripe\"\n          :style=\"{\n            width: bodyWidth,\n          }\"\n        />\n        <div\n          v-if=\"isEmpty\"\n          ref=\"emptyBlock\"\n          :style=\"emptyBlockStyle\"\n          class=\"el-table__empty-block\"\n        >\n          <span class=\"el-table__empty-text\">\n            <slot name=\"empty\">{{ computedEmptyText }}</slot>\n          </span>\n        </div>\n        <div\n          v-if=\"$slots.append\"\n          ref=\"appendWrapper\"\n          class=\"el-table__append-wrapper\"\n        >\n          <slot name=\"append\"></slot>\n        </div>\n      </div>\n      <div v-if=\"border || isGroup\" class=\"el-table__border-left-patch\"></div>\n      <div\n        v-if=\"layout.scrollX.value && layout.height.value\"\n        class=\"el-table__border-bottom-patch\"\n        :style=\"borderBottomPatchStyles\"\n      ></div>\n    </div>\n    <div\n      v-if=\"showSummary\"\n      v-show=\"!isEmpty\"\n      ref=\"footerWrapper\"\n      v-mousewheel=\"handleHeaderFooterMousewheel\"\n      class=\"el-table__footer-wrapper\"\n    >\n      <table-footer\n        :border=\"border\"\n        :default-sort=\"defaultSort\"\n        :store=\"store\"\n        :style=\"tableBodyStyles\"\n        :sum-text=\"computedSumText\"\n        :summary-method=\"summaryMethod\"\n      />\n    </div>\n    <div\n      v-show=\"resizeProxyVisible\"\n      ref=\"resizeProxy\"\n      class=\"el-table__column-resize-proxy\"\n    ></div>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, getCurrentInstance, computed } from 'vue'\nimport debounce from 'lodash/debounce'\nimport { Mousewheel } from '@element-plus/directives'\nimport { useLocale } from '@element-plus/hooks'\nimport { createStore } from './store/helper'\nimport TableLayout from './table-layout'\nimport TableHeader from './table-header'\nimport TableBody from './table-body'\nimport TableFooter from './table-footer'\nimport useUtils from './table/utils-helper'\nimport useStyle from './table/style-helper'\nimport defaultProps from './table/defaults'\n\nimport type { Table } from './table/defaults'\n\nlet tableIdSeed = 1\nexport default defineComponent({\n  name: 'ElTable',\n  directives: {\n    Mousewheel,\n  },\n  components: {\n    TableHeader,\n    TableBody,\n    TableFooter,\n  },\n  props: defaultProps,\n  emits: [\n    'select',\n    'select-all',\n    'selection-change',\n    'cell-mouse-enter',\n    'cell-mouse-leave',\n    'cell-contextmenu',\n    'cell-click',\n    'cell-dblclick',\n    'row-click',\n    'row-contextmenu',\n    'row-dblclick',\n    'header-click',\n    'header-contextmenu',\n    'sort-change',\n    'filter-change',\n    'current-change',\n    'header-dragend',\n    'expand-change',\n  ],\n  setup(props) {\n    type Row = typeof props.data[number]\n    const { t } = useLocale()\n    const table = getCurrentInstance() as Table<Row>\n    const store = createStore<Row>(table, props)\n    table.store = store\n    const layout = new TableLayout<Row>({\n      store: table.store,\n      table,\n      fit: props.fit,\n      showHeader: props.showHeader,\n    })\n    table.layout = layout\n\n    const isEmpty = computed(() => (store.states.data.value || []).length === 0)\n\n    /**\n     * open functions\n     */\n    const {\n      setCurrentRow,\n      toggleRowSelection,\n      clearSelection,\n      clearFilter,\n      toggleAllSelection,\n      toggleRowExpansion,\n      clearSort,\n      sort,\n    } = useUtils<Row>(store)\n    const {\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    } = useStyle<Row>(props, layout, store, table)\n\n    const debouncedUpdateLayout = debounce(doLayout, 50)\n\n    const tableId = `el-table_${tableIdSeed++}`\n    table.tableId = tableId\n    table.state = {\n      isGroup,\n      resizeState,\n      doLayout,\n      debouncedUpdateLayout,\n    }\n    const computedSumText = computed(\n      () => props.sumText || t('el.table.sumText')\n    )\n\n    const computedEmptyText = computed(() => {\n      return props.emptyText || t('el.table.emptyText')\n    })\n\n    return {\n      layout,\n      store,\n      handleHeaderFooterMousewheel,\n      handleMouseLeave,\n      tableId,\n      tableSize,\n      isHidden,\n      isEmpty,\n      renderExpanded,\n      resizeProxyVisible,\n      resizeState,\n      isGroup,\n      bodyWidth,\n      bodyHeight,\n      tableBodyStyles,\n      emptyBlockStyle,\n      borderBottomPatchStyles,\n      debouncedUpdateLayout,\n      handleFixedMousewheel,\n      fixedHeight,\n      fixedBodyHeight,\n      setCurrentRow,\n      toggleRowSelection,\n      clearSelection,\n      clearFilter,\n      toggleAllSelection,\n      toggleRowExpansion,\n      clearSort,\n      doLayout,\n      sort,\n      t,\n      setDragVisible,\n      context: table,\n      computedSumText,\n      computedEmptyText,\n    }\n  },\n})\n</script>\n"],"names":["_normalizeStyle","_createCommentVNode"],"mappings":";;;;;EA0BW,KAAI;EAAgB;;;;EAKvB,KAAI;EAEJ;;;;;EAoCE,KAAI;EACJ;;;;EAK0B;;;;EAU9B,KAAI;EAEJ;;;EAaA,KAAI;EACJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;sBAvEkB;;;iBAMX;;8BAEY;8BACF;;;;;;;;;;8CAKwB;;;;UAEpC,OAAOA;mBACE;;;mCAGU;UACnB,KAAK;UACL;UACA,KAAK;;;;;;;;oCAOE;mBACH;;cAEL;;;;;;;SAKM,YAAOC;;;;;;;mDAOjB;;0BAEsB;;;;mCAEZ,4BAAuB;;;;KAI3B;;;;;;"}
+{"version":3,"file":"table.vue_vue_type_template_id_4a1660ad_lang.mjs","sources":["../../../../../../packages/components/table/src/table.vue?vue&type=template&id=4a1660ad&lang.js"],"sourcesContent":["<template>\n  <div\n    ref=\"tableWrapper\"\n    :class=\"[\n      {\n        'el-table--fit': fit,\n        'el-table--striped': stripe,\n        'el-table--border': border || isGroup,\n        'el-table--hidden': isHidden,\n        'el-table--group': isGroup,\n        'el-table--fluid-height': maxHeight,\n        'el-table--scrollable-x': layout.scrollX.value,\n        'el-table--scrollable-y': layout.scrollY.value,\n        'el-table--enable-row-hover': !store.states.isComplex.value,\n        'el-table--enable-row-transition':\n          (store.states.data.value || []).length !== 0 &&\n          (store.states.data.value || []).length < 100,\n        'has-footer': showSummary,\n      },\n      tableSize ? `el-table--${tableSize}` : '',\n      className,\n      'el-table',\n    ]\"\n    :style=\"style\"\n    @mouseleave=\"handleMouseLeave()\"\n  >\n    <div class=\"el-table__inner-wrapper\">\n      <div ref=\"hiddenColumns\" class=\"hidden-columns\">\n        <slot></slot>\n      </div>\n      <div\n        v-if=\"showHeader\"\n        ref=\"headerWrapper\"\n        v-mousewheel=\"handleHeaderFooterMousewheel\"\n        class=\"el-table__header-wrapper\"\n      >\n        <table-header\n          ref=\"tableHeader\"\n          :border=\"border\"\n          :default-sort=\"defaultSort\"\n          :store=\"store\"\n          :style=\"tableBodyStyles\"\n          @set-drag-visible=\"setDragVisible\"\n        />\n      </div>\n      <div ref=\"bodyWrapper\" :style=\"bodyHeight\" class=\"el-table__body-wrapper\">\n        <el-scrollbar ref=\"scrollWrapper\" :height=\"height\">\n          <table-body\n            :context=\"context\"\n            :highlight=\"highlightCurrentRow\"\n            :row-class-name=\"rowClassName\"\n            :tooltip-effect=\"tooltipEffect\"\n            :row-style=\"rowStyle\"\n            :store=\"store\"\n            :stripe=\"stripe\"\n            :style=\"{\n              width: bodyWidth,\n            }\"\n          />\n          <div\n            v-if=\"isEmpty\"\n            ref=\"emptyBlock\"\n            :style=\"emptyBlockStyle\"\n            class=\"el-table__empty-block\"\n          >\n            <span class=\"el-table__empty-text\">\n              <slot name=\"empty\">{{ computedEmptyText }}</slot>\n            </span>\n          </div>\n          <div\n            v-if=\"$slots.append\"\n            ref=\"appendWrapper\"\n            class=\"el-table__append-wrapper\"\n          >\n            <slot name=\"append\"></slot>\n          </div>\n        </el-scrollbar>\n      </div>\n      <div v-if=\"border || isGroup\" class=\"el-table__border-left-patch\"></div>\n    </div>\n    <div\n      v-if=\"showSummary\"\n      v-show=\"!isEmpty\"\n      ref=\"footerWrapper\"\n      v-mousewheel=\"handleHeaderFooterMousewheel\"\n      class=\"el-table__footer-wrapper\"\n    >\n      <table-footer\n        :border=\"border\"\n        :default-sort=\"defaultSort\"\n        :store=\"store\"\n        :style=\"tableBodyStyles\"\n        :sum-text=\"computedSumText\"\n        :summary-method=\"summaryMethod\"\n      />\n    </div>\n    <div\n      v-show=\"resizeProxyVisible\"\n      ref=\"resizeProxy\"\n      class=\"el-table__column-resize-proxy\"\n    ></div>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, getCurrentInstance, computed, provide } from 'vue'\nimport debounce from 'lodash/debounce'\nimport { Mousewheel } from '@element-plus/directives'\nimport { useLocale } from '@element-plus/hooks'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport { createStore } from './store/helper'\nimport TableLayout from './table-layout'\nimport TableHeader from './table-header'\nimport TableBody from './table-body'\nimport TableFooter from './table-footer'\nimport useUtils from './table/utils-helper'\nimport useStyle from './table/style-helper'\nimport defaultProps from './table/defaults'\nimport { TABLE_INJECTION_KEY } from './tokens'\n\nimport type { Table } from './table/defaults'\n\nlet tableIdSeed = 1\nexport default defineComponent({\n  name: 'ElTable',\n  directives: {\n    Mousewheel,\n  },\n  components: {\n    TableHeader,\n    TableBody,\n    TableFooter,\n    ElScrollbar,\n  },\n  props: defaultProps,\n  emits: [\n    'select',\n    'select-all',\n    'selection-change',\n    'cell-mouse-enter',\n    'cell-mouse-leave',\n    'cell-contextmenu',\n    'cell-click',\n    'cell-dblclick',\n    'row-click',\n    'row-contextmenu',\n    'row-dblclick',\n    'header-click',\n    'header-contextmenu',\n    'sort-change',\n    'filter-change',\n    'current-change',\n    'header-dragend',\n    'expand-change',\n  ],\n  setup(props) {\n    type Row = typeof props.data[number]\n    const { t } = useLocale()\n    const table = getCurrentInstance() as Table<Row>\n    provide(TABLE_INJECTION_KEY, table)\n    const store = createStore<Row>(table, props)\n    table.store = store\n    const layout = new TableLayout<Row>({\n      store: table.store,\n      table,\n      fit: props.fit,\n      showHeader: props.showHeader,\n    })\n    table.layout = layout\n\n    const isEmpty = computed(() => (store.states.data.value || []).length === 0)\n\n    /**\n     * open functions\n     */\n    const {\n      setCurrentRow,\n      toggleRowSelection,\n      clearSelection,\n      clearFilter,\n      toggleAllSelection,\n      toggleRowExpansion,\n      clearSort,\n      sort,\n    } = useUtils<Row>(store)\n    const {\n      isHidden,\n      renderExpanded,\n      setDragVisible,\n      isGroup,\n      handleMouseLeave,\n      handleHeaderFooterMousewheel,\n      tableSize,\n      bodyHeight,\n      height,\n      emptyBlockStyle,\n      handleFixedMousewheel,\n      fixedHeight,\n      fixedBodyHeight,\n      resizeProxyVisible,\n      bodyWidth,\n      resizeState,\n      doLayout,\n      tableBodyStyles,\n    } = useStyle<Row>(props, layout, store, table)\n\n    const debouncedUpdateLayout = debounce(doLayout, 50)\n\n    const tableId = `el-table_${tableIdSeed++}`\n    table.tableId = tableId\n    table.state = {\n      isGroup,\n      resizeState,\n      doLayout,\n      debouncedUpdateLayout,\n    }\n    const computedSumText = computed(\n      () => props.sumText || t('el.table.sumText')\n    )\n\n    const computedEmptyText = computed(() => {\n      return props.emptyText || t('el.table.emptyText')\n    })\n\n    return {\n      layout,\n      store,\n      handleHeaderFooterMousewheel,\n      handleMouseLeave,\n      tableId,\n      tableSize,\n      isHidden,\n      isEmpty,\n      renderExpanded,\n      resizeProxyVisible,\n      resizeState,\n      isGroup,\n      bodyWidth,\n      bodyHeight,\n      height,\n      tableBodyStyles,\n      emptyBlockStyle,\n      debouncedUpdateLayout,\n      handleFixedMousewheel,\n      fixedHeight,\n      fixedBodyHeight,\n      setCurrentRow,\n      toggleRowSelection,\n      clearSelection,\n      clearFilter,\n      toggleAllSelection,\n      toggleRowExpansion,\n      clearSort,\n      doLayout,\n      sort,\n      t,\n      setDragVisible,\n      context: table,\n      computedSumText,\n      computedEmptyText,\n    }\n  },\n})\n</script>\n"],"names":["_normalizeStyle"],"mappings":";;;;;EA2BW,KAAI;EAAgB;;;;EAKvB,KAAI;EAEJ;;;;;EAqCI,KAAI;EACJ;;;;EAMwB;;;;EAK9B,KAAI;EAEJ;;;EAaA,KAAI;EACJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;sBApEkB;;;iBAMX;;8BAEY;8BACF;;;;;;;;;WAKT;;;;;;;;;;cAGD,OAAOA;uBACE;;;uCAGU;cACnB,KAAK;cACL;cACA,KAAK;;;;;;;;wCAOE;uBACH;;kBAEL;;;;;;;;;;;;;;;;;;;;;sCAeR;;;;;;;"}

package/es/components/table/src/tokens.d.ts

@@ -0,0 +1,3 @@
+import type { InjectionKey } from 'vue';
+import type { DefaultRow, Table } from './table/defaults';
+export declare const TABLE_INJECTION_KEY: InjectionKey<Table<DefaultRow>>;

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

@@ -0,0 +1,4 @@
+const TABLE_INJECTION_KEY = Symbol("ElTable");
+
+export { TABLE_INJECTION_KEY };
+//# sourceMappingURL=tokens.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.mjs","sources":["../../../../../../packages/components/table/src/tokens.ts"],"sourcesContent":["import type { InjectionKey } from 'vue'\nimport type { DefaultRow, Table } from './table/defaults'\n\nexport const TABLE_INJECTION_KEY: InjectionKey<Table<DefaultRow>> =\n  Symbol('ElTable')\n"],"names":[],"mappings":"AAAY,MAAC,mBAAmB,GAAG,MAAM,CAAC,SAAS;;;;"}

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

@@ -36,6 +36,4 @@ export declare const isFixedColumn: <T>(index: number, fixed: string | boolean,
 };
 export declare const getFixedColumnsClass: <T>(index: number, fixed: string | boolean, store: any, realColumns?: TableColumnCtx<T>[] | undefined) => string[];
 export declare const getFixedColumnOffset: <T>(index: number, fixed: string | boolean, store: any, realColumns?: TableColumnCtx<T>[] | undefined) => any;
-export declare function getCellStyle<T>(column: TableColumnCtx<T>, cellIndex: number, hasGutter: boolean, gutterWidth: number, store: any): any;
-export declare const ensureRightFixedStyle: (style: any, hasGutter: boolean) => void;
 export declare const ensurePosition: (style: any, key: string) => void;

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

@@ -2,7 +2,6 @@ import { hasOwn } from '@vue/shared';
 import { createPopper } from '@popperjs/core';
 import { PopupManager } from '../../../utils/popup-manager.mjs';
 import { getValueByPath } from '../../../utils/util.mjs';
-import scrollbarWidth from '../../../utils/scrollbar-width.mjs';
 import { off, on } from '../../../utils/dom.mjs';
 
 const getCell = function(event) {
@@ -344,7 +343,7 @@ const getFixedColumnsClass = (index, fixed, store, realColumns) => {
   return classes;
 };
 function getOffset(offset, column) {
-  return offset + (Number.isNaN(column.realWidth) ? Number(column.width) : column.realWidth);
+  return offset + (column.realWidth === null || Number.isNaN(column.realWidth) ? Number(column.width) : column.realWidth);
 }
 const getFixedColumnOffset = (index, fixed, store, realColumns) => {
   const { direction, start = 0 } = isFixedColumn(index, fixed, store, realColumns);
@@ -361,18 +360,6 @@ const getFixedColumnOffset = (index, fixed, store, realColumns) => {
   }
   return styles;
 };
-function getCellStyle(column, cellIndex, hasGutter, gutterWidth, store) {
-  const fixedStyle = getFixedColumnOffset(cellIndex, column.fixed, store);
-  ensureRightFixedStyle(fixedStyle, hasGutter);
-  ensurePosition(fixedStyle, "left");
-  ensurePosition(fixedStyle, "right");
-  return fixedStyle;
-}
-const ensureRightFixedStyle = (style, hasGutter) => {
-  if (hasGutter && style && !Number.isNaN(style.right)) {
-    style.right += scrollbarWidth();
-  }
-};
 const ensurePosition = (style, key) => {
   if (!style)
     return;
@@ -381,5 +368,5 @@ const ensurePosition = (style, key) => {
   }
 };
 
-export { compose, createTablePopper, ensurePosition, ensureRightFixedStyle, getCell, getCellStyle, getColumnByCell, getColumnById, getColumnByKey, getFixedColumnOffset, getFixedColumnsClass, getKeysMap, getRowIdentity, isFixedColumn, mergeOptions, orderBy, parseHeight, parseMinWidth, parseWidth, removePopper, toggleRowStatus, walkTreeNode };
+export { compose, createTablePopper, ensurePosition, getCell, getColumnByCell, getColumnById, getColumnByKey, getFixedColumnOffset, getFixedColumnsClass, getKeysMap, getRowIdentity, isFixedColumn, mergeOptions, orderBy, parseHeight, parseMinWidth, parseWidth, removePopper, toggleRowStatus, walkTreeNode };
 //# sourceMappingURL=util.mjs.map