npm - element-plus - Versions diffs - 2.13.6 → 2.13.7 - Mend

element-plus 2.13.6 → 2.13.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (870) hide show

package/lib/components/table/src/table.vue_vue_type_script_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"table.vue_vue_type_script_lang.js","names":[],"sources":["../../../../../../packages/components/table/src/table.vue"],"sourcesContent":["<template>\n <div\n ref=\"tableWrapper\"\n :class=\"[\n {\n [ns.m('fit')]: fit,\n [ns.m('striped')]: stripe,\n [ns.m('border')]: border \|\| isGroup,\n [ns.m('hidden')]: isHidden,\n [ns.m('group')]: isGroup,\n [ns.m('fluid-height')]: maxHeight,\n [ns.m('scrollable-x')]: layout.scrollX.value,\n [ns.m('scrollable-y')]: layout.scrollY.value,\n [ns.m('enable-row-hover')]: !store.states.isComplex.value,\n [ns.m('enable-row-transition')]:\n (store.states.data.value \|\| []).length !== 0 &&\n (store.states.data.value \|\| []).length < 100,\n 'has-footer': showSummary,\n },\n ns.m(tableSize),\n className,\n ns.b(),\n ns.m(`layout-${tableLayout}`),\n ]\"\n :style=\"style\"\n :data-prefix=\"ns.namespace.value\"\n @mouseleave=\"handleMouseLeave\"\n >\n <div ref=\"tableInnerWrapper\" :class=\"ns.e('inner-wrapper')\">\n <div ref=\"hiddenColumns\" class=\"hidden-columns\">\n <slot />\n </div>\n <div\n v-if=\"showHeader && tableLayout === 'fixed'\"\n ref=\"headerWrapper\"\n v-mousewheel=\"handleHeaderFooterMousewheel\"\n :class=\"ns.e('header-wrapper')\"\n >\n <table\n ref=\"tableHeader\"\n :class=\"ns.e('header')\"\n :style=\"tableBodyStyles\"\n border=\"0\"\n cellpadding=\"0\"\n cellspacing=\"0\"\n >\n <hColgroup\n :columns=\"store.states.columns.value\"\n :table-layout=\"tableLayout\"\n />\n <table-header\n ref=\"tableHeaderRef\"\n :border=\"border\"\n :default-sort=\"defaultSort\"\n :store=\"store\"\n :append-filter-panel-to=\"appendFilterPanelTo\"\n :allow-drag-last-column=\"allowDragLastColumn\"\n @set-drag-visible=\"setDragVisible\"\n />\n </table>\n </div>\n <div ref=\"bodyWrapper\" :class=\"ns.e('body-wrapper')\">\n <el-scrollbar\n ref=\"scrollBarRef\"\n :view-style=\"scrollbarViewStyle\"\n :wrap-style=\"scrollbarStyle\"\n :always=\"scrollbarAlwaysOn\"\n :tabindex=\"scrollbarTabindex\"\n :native=\"nativeScrollbar\"\n @scroll=\"$emit('scroll', $event)\"\n >\n <table\n ref=\"tableBody\"\n :class=\"ns.e('body')\"\n cellspacing=\"0\"\n cellpadding=\"0\"\n border=\"0\"\n :style=\"{\n width: bodyWidth,\n tableLayout,\n }\"\n >\n <hColgroup\n :columns=\"store.states.columns.value\"\n :table-layout=\"tableLayout\"\n />\n <table-header\n v-if=\"showHeader && tableLayout === 'auto'\"\n ref=\"tableHeaderRef\"\n :class=\"ns.e('body-header')\"\n :border=\"border\"\n :default-sort=\"defaultSort\"\n :store=\"store\"\n :append-filter-panel-to=\"appendFilterPanelTo\"\n @set-drag-visible=\"setDragVisible\"\n />\n <table-body\n :context=\"context\"\n :highlight=\"highlightCurrentRow\"\n :row-class-name=\"rowClassName\"\n :tooltip-effect=\"computedTooltipEffect\"\n :tooltip-options=\"computedTooltipOptions\"\n :row-style=\"rowStyle\"\n :store=\"store\"\n :stripe=\"stripe\"\n />\n <table-footer\n v-if=\"showSummary && tableLayout === 'auto'\"\n :class=\"ns.e('body-footer')\"\n :border=\"border\"\n :default-sort=\"defaultSort\"\n :store=\"store\"\n :sum-text=\"computedSumText\"\n :summary-method=\"summaryMethod\"\n />\n </table>\n <div\n v-if=\"isEmpty\"\n ref=\"emptyBlock\"\n :style=\"emptyBlockStyle\"\n :class=\"ns.e('empty-block')\"\n >\n <span :class=\"ns.e('empty-text')\">\n <slot name=\"empty\">{{ computedEmptyText }}</slot>\n </span>\n </div>\n <div\n v-if=\"$slots.append\"\n ref=\"appendWrapper\"\n :class=\"ns.e('append-wrapper')\"\n >\n <slot name=\"append\" />\n </div>\n </el-scrollbar>\n </div>\n <div\n v-if=\"showSummary && tableLayout === 'fixed'\"\n v-show=\"!isEmpty\"\n ref=\"footerWrapper\"\n v-mousewheel=\"handleHeaderFooterMousewheel\"\n :class=\"ns.e('footer-wrapper')\"\n >\n <table\n :class=\"ns.e('footer')\"\n cellspacing=\"0\"\n cellpadding=\"0\"\n border=\"0\"\n :style=\"tableBodyStyles\"\n >\n <hColgroup\n :columns=\"store.states.columns.value\"\n :table-layout=\"tableLayout\"\n />\n <table-footer\n :border=\"border\"\n :default-sort=\"defaultSort\"\n :store=\"store\"\n :sum-text=\"computedSumText\"\n :summary-method=\"summaryMethod\"\n />\n </table>\n </div>\n <div v-if=\"border \|\| isGroup\" :class=\"ns.e('border-left-patch')\" />\n </div>\n <div\n v-show=\"resizeProxyVisible\"\n ref=\"resizeProxy\"\n :class=\"ns.e('column-resize-proxy')\"\n />\n </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n computed,\n defineComponent,\n getCurrentInstance,\n onBeforeUnmount,\n provide,\n} from 'vue'\nimport { debounce } from 'lodash-unified'\nimport { Mousewheel } from '@element-plus/directives'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { useGlobalConfig } from '@element-plus/components/config-provider'\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 { convertToRows } from './table-header/utils-helper'\nimport useStyle from './table/style-helper'\nimport useKeyRender from './table/key-render-helper'\nimport defaultProps from './table/defaults'\nimport { TABLE_INJECTION_KEY } from './tokens'\nimport { hColgroup } from './h-helper'\nimport { useScrollbar } from './composables/use-scrollbar'\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 hColgroup,\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 'scroll',\n ],\n setup(props) {\n type Row = (typeof props.data)[number]\n const { t } = useLocale()\n const ns = useNamespace('table')\n const globalConfig = useGlobalConfig('table')\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 getSelectionRows,\n toggleRowSelection,\n clearSelection,\n clearFilter,\n toggleAllSelection,\n toggleRowExpansion,\n clearSort,\n sort,\n updateKeyChildren,\n } = useUtils<Row>(store)\n const {\n isHidden,\n renderExpanded,\n setDragVisible,\n isGroup,\n handleMouseLeave,\n handleHeaderFooterMousewheel,\n tableSize,\n emptyBlockStyle,\n resizeProxyVisible,\n bodyWidth,\n resizeState,\n doLayout,\n tableBodyStyles,\n tableLayout,\n scrollbarViewStyle,\n scrollbarStyle,\n } = useStyle<Row>(props, layout, store, table)\n\n const { scrollBarRef, scrollTo, setScrollLeft, setScrollTop } =\n useScrollbar()\n\n const debouncedUpdateLayout = debounce(doLayout, 50)\n\n const tableId = `${ns.namespace.value}-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 const computedTooltipEffect = computed(\n () => props.tooltipEffect ?? globalConfig.value?.tooltipEffect\n )\n\n const computedTooltipOptions = computed(\n () => props.tooltipOptions ?? globalConfig.value?.tooltipOptions\n )\n\n const columns = computed(() => {\n return convertToRows(store.states.originColumns.value)[0]\n })\n\n useKeyRender(table)\n\n onBeforeUnmount(() => {\n debouncedUpdateLayout.cancel()\n })\n\n return {\n ns,\n layout,\n store,\n columns,\n handleHeaderFooterMousewheel,\n handleMouseLeave,\n tableId,\n tableSize,\n isHidden,\n isEmpty,\n renderExpanded,\n resizeProxyVisible,\n resizeState,\n isGroup,\n bodyWidth,\n tableBodyStyles,\n emptyBlockStyle,\n debouncedUpdateLayout,\n /\n @description used in single selection Table, set a certain row selected. If called without any parameter, it will clear selection\n /\n setCurrentRow,\n /\n @description returns the currently selected rows\n /\n getSelectionRows,\n /\n @description used in multiple selection Table, toggle if a certain row is selected. With the second parameter, you can directly set if this row is selected\n /\n toggleRowSelection,\n /\n @description used in multiple selection Table, clear user selection\n /\n clearSelection,\n /\n @description clear filters of the columns whose `columnKey` are passed in. If no params, clear all filters\n /\n clearFilter,\n /\n @description used in multiple selection Table, toggle select all and deselect all\n /\n toggleAllSelection,\n /\n @description used in expandable Table or tree Table, toggle if a certain row is expanded. With the second parameter, you can directly set if this row is expanded or collapsed\n /\n toggleRowExpansion,\n /\n @description clear sorting, restore data to the original order\n /\n clearSort,\n /\n @description refresh the layout of Table. When the visibility of Table changes, you may need to call this method to get a correct layout\n /\n doLayout,\n /\n @description sort Table manually. Property `prop` is used to set sort column, property `order` is used to set sort order\n /\n sort,\n /\n @description used in lazy Table, must set `rowKey`, update key children\n /\n updateKeyChildren,\n t,\n setDragVisible,\n context: table,\n computedSumText,\n computedEmptyText,\n computedTooltipEffect,\n computedTooltipOptions,\n tableLayout,\n scrollbarViewStyle,\n scrollbarStyle,\n scrollBarRef,\n /\n @description scrolls to a particular set of coordinates\n /\n scrollTo,\n /\n @description set horizontal scroll position\n /\n setScrollLeft,\n /\n @description set vertical scroll position\n /\n setScrollTop,\n /\n @description whether to allow drag the last column\n */\n allowDragLastColumn: props.allowDragLastColumn,\n }\n },\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAyMA,IAAI,cAAc;AAClB,sEAA+B;CAC7B,MAAM;CACN,YAAY,EACV,qCACD;CACD,YAAY;EACV;EACA;EACA;EACA;EACA;EACD;CACD,OAAO;CACP,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,MAAM,OAAO;EAEX,MAAM,EAAE,MAAM,yBAAU;EACxB,MAAM,KAAK,6BAAa,QAAO;EAC/B,MAAM,eAAe,0CAAgB,QAAO;EAC5C,MAAM,qCAA2B;AACjC,mBAAQ,oCAAqB,MAAK;EAClC,MAAM,QAAQ,2BAAiB,OAAO,MAAK;AAC3C,QAAM,QAAQ;EACd,MAAM,SAAS,IAAI,6BAAiB;GAClC,OAAO,MAAM;GACb;GACA,KAAK,MAAM;GACX,YAAY,MAAM;GACnB,CAAA;AACD,QAAM,SAAS;EAEf,MAAM,mCAA0B,MAAM,OAAO,KAAK,SAAS,EAAE,EAAE,WAAW,EAAC;;;;EAK3E,MAAM,EACJ,eACA,kBACA,oBACA,gBACA,aACA,oBACA,oBACA,WACA,MACA,sBACE,+BAAc,MAAK;EACvB,MAAM,EACJ,UACA,gBACA,gBACA,SACA,kBACA,8BACA,WACA,iBACA,oBACA,WACA,aACA,UACA,iBACA,aACA,oBACA,mBACE,6BAAc,OAAO,QAAQ,OAAO,MAAK;EAE7C,MAAM,EAAE,cAAc,UAAU,eAAe,iBAC7C,oCAAa;EAEf,MAAM,qDAAiC,UAAU,GAAE;EAEnD,MAAM,UAAU,GAAG,GAAG,UAAU,MAAM,SAAS;AAC/C,QAAM,UAAU;AAChB,QAAM,QAAQ;GACZ;GACA;GACA;GACA;GACF;EACA,MAAM,0CACE,MAAM,WAAW,EAAE,mBAAkB,CAC7C;EAEA,MAAM,4CAAmC;AACvC,UAAO,MAAM,aAAa,EAAE,qBAAoB;IACjD;EAED,MAAM,gDACE,MAAM,iBAAiB,aAAa,OAAO,cACnD;EAEA,MAAM,iDACE,MAAM,kBAAkB,aAAa,OAAO,eACpD;EAEA,MAAM,kCAAyB;AAC7B,UAAO,mCAAc,MAAM,OAAO,cAAc,MAAM,CAAC;IACxD;AAED,oCAAa,MAAK;AAElB,iCAAsB;AACpB,yBAAsB,QAAO;IAC9B;AAED,SAAO;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GAIA;GAIA;GAIA;GAIA;GAIA;GAIA;GAIA;GAIA;GAIA;GAIA;GAIA;GACA;GACA;GACA,SAAS;GACT;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GAIA;GAIA;GAIA;GAIA,qBAAqB,MAAM;GAC7B;;CAEH,CAAA"}
1	+ {"version":3,"file":"table.vue_vue_type_script_lang.js","names":[],"sources":["../../../../../../packages/components/table/src/table.vue"],"sourcesContent":["<template>\n <div\n ref=\"tableWrapper\"\n :class=\"[\n {\n [ns.m('fit')]: fit,\n [ns.m('striped')]: stripe,\n [ns.m('border')]: border \|\| isGroup,\n [ns.m('hidden')]: isHidden,\n [ns.m('group')]: isGroup,\n [ns.m('fluid-height')]: maxHeight,\n [ns.m('scrollable-x')]: layout.scrollX.value,\n [ns.m('scrollable-y')]: layout.scrollY.value,\n [ns.m('enable-row-hover')]: !store.states.isComplex.value,\n [ns.m('enable-row-transition')]:\n (store.states.data.value \|\| []).length !== 0 &&\n (store.states.data.value \|\| []).length < 100,\n 'has-footer': showSummary,\n },\n ns.m(tableSize),\n className,\n ns.b(),\n ns.m(`layout-${tableLayout}`),\n ]\"\n :style=\"style\"\n :data-prefix=\"ns.namespace.value\"\n @mouseleave=\"handleMouseLeave\"\n >\n <div ref=\"tableInnerWrapper\" :class=\"ns.e('inner-wrapper')\">\n <div ref=\"hiddenColumns\" class=\"hidden-columns\">\n <slot />\n </div>\n <div\n v-if=\"showHeader && tableLayout === 'fixed'\"\n ref=\"headerWrapper\"\n v-mousewheel=\"handleHeaderFooterMousewheel\"\n :class=\"ns.e('header-wrapper')\"\n >\n <table\n ref=\"tableHeader\"\n :class=\"ns.e('header')\"\n :style=\"tableBodyStyles\"\n border=\"0\"\n cellpadding=\"0\"\n cellspacing=\"0\"\n >\n <hColgroup\n :columns=\"store.states.columns.value\"\n :table-layout=\"tableLayout\"\n />\n <table-header\n ref=\"tableHeaderRef\"\n :border=\"border\"\n :default-sort=\"defaultSort\"\n :store=\"store\"\n :append-filter-panel-to=\"appendFilterPanelTo\"\n :allow-drag-last-column=\"allowDragLastColumn\"\n @set-drag-visible=\"setDragVisible\"\n />\n </table>\n </div>\n <div ref=\"bodyWrapper\" :class=\"ns.e('body-wrapper')\">\n <el-scrollbar\n ref=\"scrollBarRef\"\n :view-style=\"scrollbarViewStyle\"\n :wrap-style=\"scrollbarStyle\"\n :always=\"scrollbarAlwaysOn\"\n :tabindex=\"scrollbarTabindex\"\n :native=\"nativeScrollbar\"\n @scroll=\"$emit('scroll', $event)\"\n >\n <table\n ref=\"tableBody\"\n :class=\"ns.e('body')\"\n cellspacing=\"0\"\n cellpadding=\"0\"\n border=\"0\"\n :style=\"{\n width: bodyWidth,\n tableLayout,\n }\"\n >\n <hColgroup\n :columns=\"store.states.columns.value\"\n :table-layout=\"tableLayout\"\n />\n <table-header\n v-if=\"showHeader && tableLayout === 'auto'\"\n ref=\"tableHeaderRef\"\n :class=\"ns.e('body-header')\"\n :border=\"border\"\n :default-sort=\"defaultSort\"\n :store=\"store\"\n :append-filter-panel-to=\"appendFilterPanelTo\"\n @set-drag-visible=\"setDragVisible\"\n />\n <table-body\n :context=\"context\"\n :highlight=\"highlightCurrentRow\"\n :row-class-name=\"rowClassName\"\n :tooltip-effect=\"computedTooltipEffect\"\n :tooltip-options=\"computedTooltipOptions\"\n :row-style=\"rowStyle\"\n :store=\"store\"\n :stripe=\"stripe\"\n />\n <table-footer\n v-if=\"showSummary && tableLayout === 'auto'\"\n :class=\"ns.e('body-footer')\"\n :border=\"border\"\n :default-sort=\"defaultSort\"\n :store=\"store\"\n :sum-text=\"computedSumText\"\n :summary-method=\"summaryMethod\"\n />\n </table>\n <div\n v-if=\"isEmpty\"\n ref=\"emptyBlock\"\n :style=\"emptyBlockStyle\"\n :class=\"ns.e('empty-block')\"\n >\n <span :class=\"ns.e('empty-text')\">\n <slot name=\"empty\">{{ computedEmptyText }}</slot>\n </span>\n </div>\n <div\n v-if=\"$slots.append\"\n ref=\"appendWrapper\"\n :class=\"ns.e('append-wrapper')\"\n >\n <slot name=\"append\" />\n </div>\n </el-scrollbar>\n </div>\n <div\n v-if=\"showSummary && tableLayout === 'fixed'\"\n v-show=\"!isEmpty\"\n ref=\"footerWrapper\"\n v-mousewheel=\"handleHeaderFooterMousewheel\"\n :class=\"ns.e('footer-wrapper')\"\n >\n <table\n :class=\"ns.e('footer')\"\n cellspacing=\"0\"\n cellpadding=\"0\"\n border=\"0\"\n :style=\"tableBodyStyles\"\n >\n <hColgroup\n :columns=\"store.states.columns.value\"\n :table-layout=\"tableLayout\"\n />\n <table-footer\n :border=\"border\"\n :default-sort=\"defaultSort\"\n :store=\"store\"\n :sum-text=\"computedSumText\"\n :summary-method=\"summaryMethod\"\n />\n </table>\n </div>\n <div v-if=\"border \|\| isGroup\" :class=\"ns.e('border-left-patch')\" />\n </div>\n <div\n v-show=\"resizeProxyVisible\"\n ref=\"resizeProxy\"\n :class=\"ns.e('column-resize-proxy')\"\n />\n </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n computed,\n defineComponent,\n getCurrentInstance,\n onBeforeUnmount,\n provide,\n} from 'vue'\nimport { debounce } from 'lodash-unified'\nimport { Mousewheel } from '@element-plus/directives'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { useGlobalConfig } from '@element-plus/components/config-provider'\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 { convertToRows } from './table-header/utils-helper'\nimport useStyle from './table/style-helper'\nimport useKeyRender from './table/key-render-helper'\nimport defaultProps from './table/defaults'\nimport { TABLE_INJECTION_KEY } from './tokens'\nimport { hColgroup } from './h-helper'\nimport { useScrollbar } from './composables/use-scrollbar'\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 hColgroup,\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 'scroll',\n ],\n setup(props) {\n type Row = (typeof props.data)[number]\n const { t } = useLocale()\n const ns = useNamespace('table')\n const globalConfig = useGlobalConfig('table')\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 getSelectionRows,\n toggleRowSelection,\n clearSelection,\n clearFilter,\n toggleAllSelection,\n toggleRowExpansion,\n clearSort,\n sort,\n updateKeyChildren,\n } = useUtils<Row>(store)\n const {\n isHidden,\n renderExpanded,\n setDragVisible,\n isGroup,\n handleMouseLeave,\n handleHeaderFooterMousewheel,\n tableSize,\n emptyBlockStyle,\n resizeProxyVisible,\n bodyWidth,\n resizeState,\n doLayout,\n tableBodyStyles,\n tableLayout,\n scrollbarViewStyle,\n scrollbarStyle,\n } = useStyle<Row>(props, layout, store, table)\n\n const { scrollBarRef, scrollTo, setScrollLeft, setScrollTop } =\n useScrollbar()\n\n const debouncedUpdateLayout = debounce(doLayout, 50)\n\n const tableId = `${ns.namespace.value}-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 const computedTooltipEffect = computed(\n () => props.tooltipEffect ?? globalConfig.value?.tooltipEffect\n )\n\n const computedTooltipOptions = computed(\n () => props.tooltipOptions ?? globalConfig.value?.tooltipOptions\n )\n\n const columns = computed(() => {\n return convertToRows(store.states.originColumns.value)[0]\n })\n\n useKeyRender(table)\n\n onBeforeUnmount(() => {\n debouncedUpdateLayout.cancel()\n })\n\n return {\n ns,\n layout,\n store,\n columns,\n handleHeaderFooterMousewheel,\n handleMouseLeave,\n tableId,\n tableSize,\n isHidden,\n isEmpty,\n renderExpanded,\n resizeProxyVisible,\n resizeState,\n isGroup,\n bodyWidth,\n tableBodyStyles,\n emptyBlockStyle,\n debouncedUpdateLayout,\n /\n @description used in single selection Table, set a certain row selected. If called without any parameter, it will clear selection\n /\n setCurrentRow,\n /\n @description returns the currently selected rows\n /\n getSelectionRows,\n /\n @description used in multiple selection Table, toggle if a certain row is selected. With the second parameter, you can directly set if this row is selected\n /\n toggleRowSelection,\n /\n @description used in multiple selection Table, clear user selection\n /\n clearSelection,\n /\n @description clear filters of the columns whose `columnKey` are passed in. If no params, clear all filters\n /\n clearFilter,\n /\n @description used in multiple selection Table, toggle select all and deselect all\n /\n toggleAllSelection,\n /\n @description used in expandable Table or tree Table, toggle if a certain row is expanded. With the second parameter, you can directly set if this row is expanded or collapsed\n /\n toggleRowExpansion,\n /\n @description clear sorting, restore data to the original order\n /\n clearSort,\n /\n @description refresh the layout of Table. When the visibility of Table changes, you may need to call this method to get a correct layout\n /\n doLayout,\n /\n @description sort Table manually. Property `prop` is used to set sort column, property `order` is used to set sort order\n /\n sort,\n /\n @description used in lazy Table, must set `rowKey`, update key children\n /\n updateKeyChildren,\n t,\n setDragVisible,\n context: table,\n computedSumText,\n computedEmptyText,\n computedTooltipEffect,\n computedTooltipOptions,\n tableLayout,\n scrollbarViewStyle,\n scrollbarStyle,\n scrollBarRef,\n /\n @description scrolls to a particular set of coordinates\n /\n scrollTo,\n /\n @description set horizontal scroll position\n /\n setScrollLeft,\n /\n @description set vertical scroll position\n /\n setScrollTop,\n /\n @description whether to allow drag the last column\n */\n allowDragLastColumn: props.allowDragLastColumn,\n }\n },\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAyMA,IAAI,cAAc;AAClB,sEAA+B;CAC7B,MAAM;CACN,YAAY,EACV,mCACD;CACD,YAAY;EACV;EACA;EACA;EACA;EACA;EACD;CACD,OAAO;CACP,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,MAAM,OAAO;EAEX,MAAM,EAAE,MAAM,2BAAU;EACxB,MAAM,KAAK,6BAAa,QAAO;EAC/B,MAAM,eAAe,0CAAgB,QAAO;EAC5C,MAAM,qCAA2B;AACjC,mBAAQ,oCAAqB,MAAK;EAClC,MAAM,QAAQ,2BAAiB,OAAO,MAAK;AAC3C,QAAM,QAAQ;EACd,MAAM,SAAS,IAAI,6BAAiB;GAClC,OAAO,MAAM;GACb;GACA,KAAK,MAAM;GACX,YAAY,MAAM;GACnB,CAAA;AACD,QAAM,SAAS;EAEf,MAAM,mCAA0B,MAAM,OAAO,KAAK,SAAS,EAAE,EAAE,WAAW,EAAC;;;;EAK3E,MAAM,EACJ,eACA,kBACA,oBACA,gBACA,aACA,oBACA,oBACA,WACA,MACA,sBACE,+BAAc,MAAK;EACvB,MAAM,EACJ,UACA,gBACA,gBACA,SACA,kBACA,8BACA,WACA,iBACA,oBACA,WACA,aACA,UACA,iBACA,aACA,oBACA,mBACE,6BAAc,OAAO,QAAQ,OAAO,MAAK;EAE7C,MAAM,EAAE,cAAc,UAAU,eAAe,iBAC7C,oCAAa;EAEf,MAAM,qDAAiC,UAAU,GAAE;EAEnD,MAAM,UAAU,GAAG,GAAG,UAAU,MAAM,SAAS;AAC/C,QAAM,UAAU;AAChB,QAAM,QAAQ;GACZ;GACA;GACA;GACA;GACF;EACA,MAAM,0CACE,MAAM,WAAW,EAAE,mBAAkB,CAC7C;EAEA,MAAM,4CAAmC;AACvC,UAAO,MAAM,aAAa,EAAE,qBAAoB;IACjD;EAED,MAAM,gDACE,MAAM,iBAAiB,aAAa,OAAO,cACnD;EAEA,MAAM,iDACE,MAAM,kBAAkB,aAAa,OAAO,eACpD;EAEA,MAAM,kCAAyB;AAC7B,UAAO,mCAAc,MAAM,OAAO,cAAc,MAAM,CAAC;IACxD;AAED,oCAAa,MAAK;AAElB,iCAAsB;AACpB,yBAAsB,QAAO;IAC9B;AAED,SAAO;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GAIA;GAIA;GAIA;GAIA;GAIA;GAIA;GAIA;GAIA;GAIA;GAIA;GAIA;GACA;GACA;GACA,SAAS;GACT;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GAIA;GAIA;GAIA;GAIA,qBAAqB,MAAM;GAC7B;;CAEH,CAAA"}

package/lib/components/table-v2/src/components/header.d.ts CHANGED Viewed

@@ -89,8 +89,8 @@ declare const TableV2Header: vue.DefineComponent<vue.ExtractPropTypes<{
     __epPropKey: true;
   };
 }>> & Readonly<{}>, {
-  readonly rowHeight: number;
   readonly headerHeight: EpPropMergeType<(new (...args: any[]) => number | number[]) | (() => number | number[]) | (((new (...args: any[]) => number | number[]) | (() => number | number[])) | null)[], unknown, unknown>;
+  readonly rowHeight: number;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 type TableV2HeaderInstance = InstanceType<typeof TableV2Header> & {
   /**

package/lib/components/table-v2/src/components/index.d.ts CHANGED Viewed

@@ -2,7 +2,7 @@ import { TableV2Cell } from "./cell.js";
 import { HeaderCell } from "./header-cell.js";
 import { TableV2HeaderRow, TableV2HeaderRowCellRendererParams, TableV2HeaderRowRendererParams } from "./header-row.js";
 import { TableV2Header, TableV2HeaderInstance, TableV2HeaderRendererParams } from "./header.js";
-import { TableV2Row, TableV2RowCellRenderParam } from "./row.js";
+import { TableV2Row, TableV2RowCellRenderParam, TableV2RowSlotProps } from "./row.js";
 import { SortIcon } from "./sort-icon.js";
 import { ExpandIcon } from "./expand-icon.js";
-export { ExpandIcon, TableV2Header as Header, HeaderCell, TableV2HeaderRow as HeaderRow, TableV2Row as Row, SortIcon, TableV2Cell as TableCell, type TableV2HeaderInstance, type TableV2HeaderRendererParams, type TableV2HeaderRowCellRendererParams, type TableV2HeaderRowRendererParams, type TableV2RowCellRenderParam };
+export { ExpandIcon, TableV2Header as Header, HeaderCell, TableV2HeaderRow as HeaderRow, TableV2Row as Row, SortIcon, TableV2Cell as TableCell, type TableV2HeaderInstance, type TableV2HeaderRendererParams, type TableV2HeaderRowCellRendererParams, type TableV2HeaderRowRendererParams, type TableV2RowCellRenderParam, type TableV2RowSlotProps };

package/lib/components/table-v2/src/components/row.d.ts CHANGED Viewed

@@ -4,7 +4,7 @@ import { KeyType } from "../types.js";
 import { AnyColumn } from "../common.js";
 import { RowEventHandlers, RowExpandHandler, RowHeightChangeHandler, RowHoverHandler, TableV2RowProps } from "../row.js";
 import * as vue from "vue";
-import { CSSProperties } from "vue";
+import { CSSProperties, VNode } from "vue";
 import * as vue_jsx_runtime0 from "vue/jsx-runtime";
 //#region ../../packages/components/table-v2/src/components/row.d.ts
@@ -143,9 +143,9 @@ declare const TableV2Row: vue.DefineComponent<vue.ExtractPropTypes<{
     __epPropKey: true;
   };
 }>> & Readonly<{}>, {
+  readonly rowKey: EpPropMergeType<(new (...args: any[]) => string | number | symbol) | (() => KeyType) | (((new (...args: any[]) => string | number | symbol) | (() => KeyType)) | null)[], unknown, unknown>;
   readonly estimatedRowHeight: number;
   readonly isScrolling: boolean;
-  readonly rowKey: EpPropMergeType<(new (...args: any[]) => string | number | symbol) | (() => KeyType) | (((new (...args: any[]) => string | number | symbol) | (() => KeyType)) | null)[], unknown, unknown>;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 type TableV2RowCellRenderParam = {
   column: TableV2RowProps['columns'][number];
@@ -162,5 +162,14 @@ type TableV2RowCellRenderParam = {
     onExpand: (expand: boolean) => void;
   };
 };
+type TableV2RowSlotProps = {
+  cells: VNode[];
+  columns: TableV2RowProps['columns'];
+  depth: number;
+  style: TableV2RowProps['style'];
+  rowData: any;
+  rowIndex: number;
+  isScrolling: boolean;
+};
 //#endregion
-export { TableV2Row, TableV2RowCellRenderParam };
+export { TableV2Row, TableV2RowCellRenderParam, TableV2RowSlotProps };

package/lib/components/table-v2/src/components/row.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"row.js","names":["computed","defineComponent","inject","nextTick","onMounted","ref","unref","mergeProps","_mergeProps","createVNode","_createVNode","isArray","isFunction","isNumber","tableV2RowProps","TableV2InjectionKey","placeholderSign","useTableRow","props","isScrolling","measured","rowRef","measurable","estimatedRowHeight","rowIndex","doMeasure","isInit","$rowRef","columns","onRowHeightChange","rowKey","style","height","getBoundingClientRect","value","Number","parseInt","firstColumn","isPlaceholder","fixed","eventHandlers","rowData","onRowHover","handlers","rowEventHandlers","Object","entries","forEach","eventName","handler","event","name","hovered","existedHandler","onExpand","expanded","onRowExpand","COMPONENT_NAME","TableV2Row","setup","expose","slots","attrs","columnsStyles","expandColumnKey","depth","ColumnCells","map","column","columnIndex","expandable","children","length","key","cell","expandIconProps","undefined","row","cells","node","exceptHeightStyle","_measured","class"],"sources":["../../../../../../../packages/components/table-v2/src/components/row.tsx"],"sourcesContent":["import {\n computed,\n defineComponent,\n inject,\n nextTick,\n onMounted,\n ref,\n unref,\n} from 'vue'\nimport { isArray, isFunction, isNumber } from '@element-plus/utils'\nimport { tableV2RowProps } from '../row'\nimport { TableV2InjectionKey } from '../tokens'\nimport { placeholderSign } from '../private'\n\nimport type { CSSProperties, RendererElement, RendererNode, VNode } from 'vue'\nimport type { RowEventHandlers, TableV2RowProps } from '../row'\n\ntype CustomizedCellsType = VNode<\n RendererNode,\n RendererElement,\n {\n [key: string]: any\n }\n>[]\n\ntype DefaultCellsType = VNode<\n RendererNode,\n RendererElement,\n {\n [key: string]: any\n }\n>[][]\n\ntype ColumnCellsType = DefaultCellsType \| CustomizedCellsType\n\nconst useTableRow = (props: TableV2RowProps) => {\n const { isScrolling } = inject(TableV2InjectionKey)!\n\n const measured = ref(false)\n const rowRef = ref<HTMLElement>()\n const measurable = computed(() => {\n return isNumber(props.estimatedRowHeight) && props.rowIndex >= 0\n })\n\n const doMeasure = (isInit = false) => {\n const $rowRef = unref(rowRef)\n if (!$rowRef) return\n const { columns, onRowHeightChange, rowKey, rowIndex, style } = props\n const { height } = $rowRef.getBoundingClientRect()\n measured.value = true\n\n nextTick(() => {\n if (isInit \|\| height !== Number.parseInt(style!.height as string)) {\n const firstColumn = columns[0]\n const isPlaceholder = firstColumn?.placeholderSign === placeholderSign\n onRowHeightChange?.(\n { rowKey, height, rowIndex },\n firstColumn && !isPlaceholder && firstColumn.fixed\n )\n }\n })\n }\n\n const eventHandlers = computed(() => {\n const { rowData, rowIndex, rowKey, onRowHover } = props\n const handlers = props.rowEventHandlers \|\| ({} as RowEventHandlers)\n const eventHandlers = {} as {\n [key in keyof RowEventHandlers]: (e: Event) => void\n }\n\n Object.entries(handlers).forEach(([eventName, handler]) => {\n if (isFunction(handler)) {\n eventHandlers[eventName as keyof RowEventHandlers] = (event: Event) => {\n handler({\n event,\n rowData,\n rowIndex,\n rowKey,\n })\n }\n }\n })\n\n if (onRowHover) {\n ;(\n [\n { name: 'onMouseleave', hovered: false },\n { name: 'onMouseenter', hovered: true },\n ] as const\n ).forEach(({ name, hovered }) => {\n const existedHandler = eventHandlers[name]\n eventHandlers[name] = ((event: MouseEvent) => {\n onRowHover({\n event,\n hovered,\n rowData,\n rowIndex,\n rowKey,\n })\n\n existedHandler?.(event)\n }) as any\n })\n }\n return eventHandlers\n })\n\n const onExpand = (expanded: boolean) => {\n const { onRowExpand, rowData, rowIndex, rowKey } = props\n\n onRowExpand?.({\n expanded,\n rowData,\n rowIndex,\n rowKey,\n })\n }\n\n onMounted(() => {\n if (unref(measurable)) {\n doMeasure(true)\n }\n })\n\n return { isScrolling, measurable, measured, rowRef, eventHandlers, onExpand }\n}\n\nconst COMPONENT_NAME = 'ElTableV2TableRow'\n\nconst TableV2Row = defineComponent({\n name: COMPONENT_NAME,\n props: tableV2RowProps,\n setup(props, { expose, slots, attrs }) {\n const {\n eventHandlers,\n isScrolling,\n measurable,\n measured,\n rowRef,\n\n onExpand,\n } = useTableRow(props)\n\n expose({\n /*\n @description manually dispatching expand action on row.\n */\n onExpand,\n })\n\n return () => {\n const {\n columns,\n columnsStyles,\n expandColumnKey,\n depth,\n rowData,\n rowIndex,\n style,\n } = props\n\n let ColumnCells: ColumnCellsType = columns.map((column, columnIndex) => {\n const expandable =\n isArray(rowData.children) &&\n rowData.children.length > 0 &&\n column.key === expandColumnKey\n\n return slots.cell!({\n column,\n columns,\n columnIndex,\n depth,\n style: columnsStyles[column.key!],\n rowData,\n rowIndex,\n isScrolling: unref(isScrolling),\n expandIconProps: expandable\n ? {\n rowData,\n rowIndex,\n onExpand,\n }\n : undefined,\n })\n })\n\n if (slots.row) {\n ColumnCells = slots.row({\n cells: ColumnCells.map((node) => {\n if (isArray(node) && node.length === 1) {\n return node[0]\n }\n return node\n }),\n style,\n columns,\n depth,\n rowData,\n rowIndex,\n isScrolling: unref(isScrolling),\n })\n }\n\n if (unref(measurable)) {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const { height, ...exceptHeightStyle } = style \|\| {}\n const _measured = unref(measured)\n return (\n <div\n ref={rowRef}\n class={props.class}\n style={_measured ? style : exceptHeightStyle}\n role=\"row\"\n {...attrs}\n {...unref(eventHandlers)}\n >\n {ColumnCells}\n </div>\n )\n }\n\n return (\n <div\n {...attrs}\n ref={rowRef}\n class={props.class}\n style={style}\n role=\"row\"\n {...unref(eventHandlers)}\n >\n {ColumnCells}\n </div>\n )\n }\n },\n})\n\nexport default TableV2Row\n\nexport type TableV2RowCellRenderParam = {\n column: TableV2RowProps['columns'][number]\n columns: TableV2RowProps['columns']\n columnIndex: number\n depth: number\n style: CSSProperties\n rowData: any\n rowIndex: number\n isScrolling: boolean\n expandIconProps?: {\n rowData: any\n rowIndex: number\n onExpand: (expand: boolean) => void\n }\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"row.js","names":["computed","defineComponent","inject","nextTick","onMounted","ref","unref","mergeProps","_mergeProps","createVNode","_createVNode","isArray","isFunction","isNumber","tableV2RowProps","TableV2InjectionKey","placeholderSign","useTableRow","props","isScrolling","measured","rowRef","measurable","estimatedRowHeight","rowIndex","doMeasure","isInit","$rowRef","columns","onRowHeightChange","rowKey","style","height","getBoundingClientRect","value","Number","parseInt","firstColumn","isPlaceholder","fixed","eventHandlers","rowData","onRowHover","handlers","rowEventHandlers","Object","entries","forEach","eventName","handler","event","name","hovered","existedHandler","onExpand","expanded","onRowExpand","COMPONENT_NAME","TableV2Row","setup","expose","slots","attrs","columnsStyles","expandColumnKey","depth","ColumnCells","map","column","columnIndex","expandable","children","length","key","cell","expandIconProps","undefined","row","cells","node","exceptHeightStyle","_measured","class"],"sources":["../../../../../../../packages/components/table-v2/src/components/row.tsx"],"sourcesContent":["import {\n computed,\n defineComponent,\n inject,\n nextTick,\n onMounted,\n ref,\n unref,\n} from 'vue'\nimport { isArray, isFunction, isNumber } from '@element-plus/utils'\nimport { tableV2RowProps } from '../row'\nimport { TableV2InjectionKey } from '../tokens'\nimport { placeholderSign } from '../private'\n\nimport type { CSSProperties, RendererElement, RendererNode, VNode } from 'vue'\nimport type { RowEventHandlers, TableV2RowProps } from '../row'\n\ntype CustomizedCellsType = VNode<\n RendererNode,\n RendererElement,\n {\n [key: string]: any\n }\n>[]\n\ntype DefaultCellsType = VNode<\n RendererNode,\n RendererElement,\n {\n [key: string]: any\n }\n>[][]\n\ntype ColumnCellsType = DefaultCellsType \| CustomizedCellsType\n\nconst useTableRow = (props: TableV2RowProps) => {\n const { isScrolling } = inject(TableV2InjectionKey)!\n\n const measured = ref(false)\n const rowRef = ref<HTMLElement>()\n const measurable = computed(() => {\n return isNumber(props.estimatedRowHeight) && props.rowIndex >= 0\n })\n\n const doMeasure = (isInit = false) => {\n const $rowRef = unref(rowRef)\n if (!$rowRef) return\n const { columns, onRowHeightChange, rowKey, rowIndex, style } = props\n const { height } = $rowRef.getBoundingClientRect()\n measured.value = true\n\n nextTick(() => {\n if (isInit \|\| height !== Number.parseInt(style!.height as string)) {\n const firstColumn = columns[0]\n const isPlaceholder = firstColumn?.placeholderSign === placeholderSign\n onRowHeightChange?.(\n { rowKey, height, rowIndex },\n firstColumn && !isPlaceholder && firstColumn.fixed\n )\n }\n })\n }\n\n const eventHandlers = computed(() => {\n const { rowData, rowIndex, rowKey, onRowHover } = props\n const handlers = props.rowEventHandlers \|\| ({} as RowEventHandlers)\n const eventHandlers = {} as {\n [key in keyof RowEventHandlers]: (e: Event) => void\n }\n\n Object.entries(handlers).forEach(([eventName, handler]) => {\n if (isFunction(handler)) {\n eventHandlers[eventName as keyof RowEventHandlers] = (event: Event) => {\n handler({\n event,\n rowData,\n rowIndex,\n rowKey,\n })\n }\n }\n })\n\n if (onRowHover) {\n ;(\n [\n { name: 'onMouseleave', hovered: false },\n { name: 'onMouseenter', hovered: true },\n ] as const\n ).forEach(({ name, hovered }) => {\n const existedHandler = eventHandlers[name]\n eventHandlers[name] = ((event: MouseEvent) => {\n onRowHover({\n event,\n hovered,\n rowData,\n rowIndex,\n rowKey,\n })\n\n existedHandler?.(event)\n }) as any\n })\n }\n return eventHandlers\n })\n\n const onExpand = (expanded: boolean) => {\n const { onRowExpand, rowData, rowIndex, rowKey } = props\n\n onRowExpand?.({\n expanded,\n rowData,\n rowIndex,\n rowKey,\n })\n }\n\n onMounted(() => {\n if (unref(measurable)) {\n doMeasure(true)\n }\n })\n\n return { isScrolling, measurable, measured, rowRef, eventHandlers, onExpand }\n}\n\nconst COMPONENT_NAME = 'ElTableV2TableRow'\n\nconst TableV2Row = defineComponent({\n name: COMPONENT_NAME,\n props: tableV2RowProps,\n setup(props, { expose, slots, attrs }) {\n const {\n eventHandlers,\n isScrolling,\n measurable,\n measured,\n rowRef,\n\n onExpand,\n } = useTableRow(props)\n\n expose({\n /*\n @description manually dispatching expand action on row.\n */\n onExpand,\n })\n\n return () => {\n const {\n columns,\n columnsStyles,\n expandColumnKey,\n depth,\n rowData,\n rowIndex,\n style,\n } = props\n\n let ColumnCells: ColumnCellsType = columns.map((column, columnIndex) => {\n const expandable =\n isArray(rowData.children) &&\n rowData.children.length > 0 &&\n column.key === expandColumnKey\n\n return slots.cell!({\n column,\n columns,\n columnIndex,\n depth,\n style: columnsStyles[column.key!],\n rowData,\n rowIndex,\n isScrolling: unref(isScrolling),\n expandIconProps: expandable\n ? {\n rowData,\n rowIndex,\n onExpand,\n }\n : undefined,\n })\n })\n\n if (slots.row) {\n ColumnCells = slots.row({\n cells: ColumnCells.map((node) => {\n if (isArray(node) && node.length === 1) {\n return node[0]\n }\n return node\n }),\n style,\n columns,\n depth,\n rowData,\n rowIndex,\n isScrolling: unref(isScrolling),\n })\n }\n\n if (unref(measurable)) {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const { height, ...exceptHeightStyle } = style \|\| {}\n const _measured = unref(measured)\n return (\n <div\n ref={rowRef}\n class={props.class}\n style={_measured ? style : exceptHeightStyle}\n role=\"row\"\n {...attrs}\n {...unref(eventHandlers)}\n >\n {ColumnCells}\n </div>\n )\n }\n\n return (\n <div\n {...attrs}\n ref={rowRef}\n class={props.class}\n style={style}\n role=\"row\"\n {...unref(eventHandlers)}\n >\n {ColumnCells}\n </div>\n )\n }\n },\n})\n\nexport default TableV2Row\n\nexport type TableV2RowCellRenderParam = {\n column: TableV2RowProps['columns'][number]\n columns: TableV2RowProps['columns']\n columnIndex: number\n depth: number\n style: CSSProperties\n rowData: any\n rowIndex: number\n isScrolling: boolean\n expandIconProps?: {\n rowData: any\n rowIndex: number\n onExpand: (expand: boolean) => void\n }\n}\n\nexport type TableV2RowSlotProps = {\n cells: VNode[]\n columns: TableV2RowProps['columns']\n depth: number\n style: TableV2RowProps['style']\n rowData: any\n rowIndex: number\n isScrolling: boolean\n}\n"],"mappings":"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"}

package/lib/components/table-v2/src/table-grid.d.ts CHANGED Viewed

@@ -201,12 +201,12 @@ declare const TableGrid: vue.DefineComponent<vue.ExtractPropTypes<{
   };
 }>> & Readonly<{}>, {
   readonly scrollbarAlwaysOn: boolean;
+  readonly rowKey: EpPropMergeType<(new (...args: any[]) => string | number | symbol) | (() => KeyType) | (((new (...args: any[]) => string | number | symbol) | (() => KeyType)) | null)[], unknown, unknown>;
+  readonly headerHeight: EpPropMergeType<(new (...args: any[]) => number | number[]) | (() => number | number[]) | (((new (...args: any[]) => number | number[]) | (() => number | number[])) | null)[], unknown, unknown>;
   readonly estimatedRowHeight: number;
   readonly useIsScrolling: boolean;
   readonly scrollbarStartGap: number;
   readonly scrollbarEndGap: number;
-  readonly rowKey: EpPropMergeType<(new (...args: any[]) => string | number | symbol) | (() => KeyType) | (((new (...args: any[]) => string | number | symbol) | (() => KeyType)) | null)[], unknown, unknown>;
-  readonly headerHeight: EpPropMergeType<(new (...args: any[]) => number | number[]) | (() => number | number[]) | (((new (...args: any[]) => number | number[]) | (() => number | number[])) | null)[], unknown, unknown>;
   readonly cache: number;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 type TableGridInstance = InstanceType<typeof TableGrid> & UnwrapRef<{

package/lib/components/table-v2/src/table-v2.d.ts CHANGED Viewed

@@ -2,18 +2,30 @@ import { EpPropFinalized, EpPropMergeType } from "../../../utils/vue/props/types
 import "../../../utils/index.js";
 import { Alignment } from "../../virtual-list/src/types.js";
 import { SortOrder } from "./constants.js";
-import { DataGetter, KeyType, SortBy, SortState } from "./types.js";
+import { DataGetter, KeyType, SortBy, SortState, TableV2CustomizedHeaderSlotParam } from "./types.js";
 import { AnyColumn } from "./common.js";
 import { RowEventHandlers, RowExpandHandler } from "./row.js";
 import { onRowRenderedParams } from "./grid.js";
 import { ColumnSortHandler, ExpandedRowsChangeHandler, ExtraCellPropGetter, HeaderClassNameGetter, RowClassNameGetter } from "./table.js";
 import "./composables/use-scrollbar.js";
+import { TableV2HeaderRowCellRendererParams } from "./components/header-row.js";
+import { TableV2RowCellRenderParam, TableV2RowSlotProps } from "./components/row.js";
+import "./components/index.js";
 import "../../../index.js";
 import * as vue from "vue";
-import { CSSProperties } from "vue";
+import { CSSProperties, SlotsType } from "vue";
 import * as vue_jsx_runtime0 from "vue/jsx-runtime";
 //#region ../../packages/components/table-v2/src/table-v2.d.ts
+type TableV2Slots = {
+  row?: (props: TableV2RowSlotProps) => any;
+  cell?: (props: TableV2RowCellRenderParam) => any;
+  header?: (props: TableV2CustomizedHeaderSlotParam) => any;
+  'header-cell'?: (props: TableV2HeaderRowCellRendererParams) => any;
+  footer?: () => any;
+  empty?: () => any;
+  overlay?: () => any;
+};
 declare const TableV2: vue.DefineComponent<vue.ExtractPropTypes<{
   readonly cache: EpPropFinalized<NumberConstructor, never, never, 2, false>;
   readonly estimatedRowHeight: {
@@ -317,22 +329,22 @@ declare const TableV2: vue.DefineComponent<vue.ExtractPropTypes<{
 }>> & Readonly<{}>, {
   readonly fixed: boolean;
   readonly scrollbarAlwaysOn: boolean;
+  readonly rowKey: EpPropMergeType<(new (...args: any[]) => string | number | symbol) | (() => KeyType) | (((new (...args: any[]) => string | number | symbol) | (() => KeyType)) | null)[], unknown, unknown>;
+  readonly headerHeight: EpPropMergeType<(new (...args: any[]) => number | number[]) | (() => number | number[]) | (((new (...args: any[]) => number | number[]) | (() => number | number[])) | null)[], unknown, unknown>;
+  readonly sortBy: SortBy;
   readonly estimatedRowHeight: number;
   readonly useIsScrolling: boolean;
   readonly rowHeight: number;
   readonly hScrollbarSize: number;
   readonly vScrollbarSize: number;
-  readonly rowKey: EpPropMergeType<(new (...args: any[]) => string | number | symbol) | (() => KeyType) | (((new (...args: any[]) => string | number | symbol) | (() => KeyType)) | null)[], unknown, unknown>;
-  readonly headerHeight: EpPropMergeType<(new (...args: any[]) => number | number[]) | (() => number | number[]) | (((new (...args: any[]) => number | number[]) | (() => number | number[])) | null)[], unknown, unknown>;
   readonly cache: number;
   readonly footerHeight: number;
   readonly indentSize: number;
   readonly iconSize: number;
-  readonly sortBy: SortBy;
   readonly sortState: SortState;
   readonly expandedRowKeys: KeyType[];
   readonly defaultExpandedRowKeys: KeyType[];
-}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+}, SlotsType<TableV2Slots>, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 type TableV2Instance = InstanceType<typeof TableV2> & {
   /**
    * @description scroll to a given position

package/lib/components/table-v2/src/table-v2.js CHANGED Viewed

@@ -23,6 +23,7 @@ function _isSlot(s) {
 const TableV2 = /* @__PURE__ */ (0, vue.defineComponent)({
 	name: "ElTableV2",
 	props: require_table.tableV2Props,
+	slots: Object,
 	setup(props, { slots, expose }) {
 		const ns = require_index$1.useNamespace("table-v2");
 		const { t } = require_index.useLocale();

package/lib/components/table-v2/src/table-v2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"table-v2.js","names":["defineComponent","provide","unref","mergeProps","_mergeProps","isVNode","_isVNode","createVNode","_createVNode","useLocale","useNamespace","useTable","TableV2InjectionKey","tableV2Props","MainTable","LeftTable","RightTable","Row","Cell","Header","HeaderCell","Footer","Empty","Overlay","_isSlot","s","Object","prototype","toString","call","COMPONENT_NAME","TableV2","name","props","setup","slots","expose","ns","t","columnsStyles","fixedColumnsOnLeft","fixedColumnsOnRight","mainColumns","mainTableHeight","fixedTableHeight","leftTableWidth","rightTableWidth","data","depthMap","expandedRowKeys","hasFixedColumns","mainTableRef","leftTableRef","rightTableRef","isDynamic","isResetting","isScrolling","bodyWidth","emptyStyle","rootStyle","footerHeight","showEmpty","scrollTo","scrollToLeft","scrollToTop","scrollToRow","getRowHeight","onColumnSorted","onRowHeightChange","onRowHovered","onRowExpanded","onRowsRendered","onScroll","onVerticalScroll","cache","cellProps","estimatedRowHeight","expandColumnKey","fixedData","headerHeight","headerClass","headerProps","headerCellProps","sortBy","sortState","rowHeight","rowClass","rowEventHandlers","rowKey","rowProps","scrollbarAlwaysOn","indentSize","iconSize","useIsScrolling","vScrollbarSize","width","_data","mainTableProps","class","e","columns","headerWidth","height","scrollbarStartGap","scrollbarEndGap","leftColumnsWidth","_fixedTableHeight","leftTableProps","rightColumnsWidth","rightTableProps","style","cssVarName","_columnsStyles","tableRowProps","tableCellProps","tableHeaderProps","tableHeaderCellProps","tableSlots","row","cell","_slot","column","key","default","header","_slot2","rootKls","b","is","footerProps","footer","empty","overlay"],"sources":["../../../../../../packages/components/table-v2/src/table-v2.tsx"],"sourcesContent":["import { defineComponent, provide, unref } from 'vue'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { useTable } from './use-table'\nimport { TableV2InjectionKey } from './tokens'\nimport { tableV2Props } from './table'\n// renderers\nimport MainTable from './renderers/main-table'\nimport LeftTable from './renderers/left-table'\nimport RightTable from './renderers/right-table'\nimport Row from './renderers/row'\nimport Cell from './renderers/cell'\nimport Header from './renderers/header'\nimport HeaderCell from './renderers/header-cell'\nimport Footer from './renderers/footer'\nimport Empty from './renderers/empty'\nimport Overlay from './renderers/overlay'\n\nimport type { CSSProperties } from 'vue'\nimport type { TableGridRowSlotParams } from './table-grid'\nimport type { ScrollStrategy } from './composables/use-scrollbar'\nimport type {\n TableV2HeaderRendererParams,\n TableV2HeaderRowCellRendererParams,\n TableV2RowCellRenderParam,\n} from './components'\nimport type { KeyType } from './types'\n\nconst COMPONENT_NAME = 'ElTableV2'\n\nconst TableV2 = defineComponent({\n name: COMPONENT_NAME,\n props: tableV2Props,\n setup(props, { slots, expose }) {\n const ns = useNamespace('table-v2')\n const { t } = useLocale()\n\n const {\n columnsStyles,\n fixedColumnsOnLeft,\n fixedColumnsOnRight,\n mainColumns,\n mainTableHeight,\n fixedTableHeight,\n leftTableWidth,\n rightTableWidth,\n data,\n depthMap,\n expandedRowKeys,\n hasFixedColumns,\n mainTableRef,\n leftTableRef,\n rightTableRef,\n isDynamic,\n isResetting,\n isScrolling,\n\n bodyWidth,\n emptyStyle,\n rootStyle,\n footerHeight,\n\n showEmpty,\n\n // exposes\n scrollTo,\n scrollToLeft,\n scrollToTop,\n scrollToRow,\n\n getRowHeight,\n onColumnSorted,\n onRowHeightChange,\n onRowHovered,\n onRowExpanded,\n onRowsRendered,\n onScroll,\n onVerticalScroll,\n } = useTable(props)\n\n expose({\n /*\n @description scroll to a given position\n * @params params {{ scrollLeft?: number, scrollTop?: number }} where to scroll to.\n /\n scrollTo,\n /\n @description scroll to a given position horizontally\n * @params scrollLeft {Number} where to scroll to.\n /\n scrollToLeft,\n /\n @description scroll to a given position vertically\n * @params scrollTop { Number } where to scroll to.\n /\n scrollToTop,\n /\n @description scroll to a given row\n * @params row {Number} which row to scroll to\n * @params @optional strategy {ScrollStrategy} use what strategy to scroll to\n /\n scrollToRow,\n })\n\n provide(TableV2InjectionKey, {\n ns,\n isResetting,\n isScrolling,\n })\n\n return () => {\n const {\n cache,\n cellProps,\n estimatedRowHeight,\n expandColumnKey,\n fixedData,\n headerHeight,\n headerClass,\n headerProps,\n headerCellProps,\n sortBy,\n sortState,\n rowHeight,\n rowClass,\n rowEventHandlers,\n rowKey,\n rowProps,\n scrollbarAlwaysOn,\n indentSize,\n iconSize,\n useIsScrolling,\n vScrollbarSize,\n width,\n } = props\n\n const _data = unref(data)\n\n const mainTableProps = {\n cache,\n class: ns.e('main'),\n columns: unref(mainColumns),\n data: _data,\n fixedData,\n estimatedRowHeight,\n bodyWidth: unref(bodyWidth),\n headerHeight,\n headerWidth: unref(bodyWidth),\n height: unref(mainTableHeight),\n mainTableRef,\n rowKey,\n rowHeight,\n scrollbarAlwaysOn,\n scrollbarStartGap: 2,\n scrollbarEndGap: vScrollbarSize,\n useIsScrolling,\n width,\n getRowHeight,\n onRowsRendered,\n onScroll,\n }\n\n const leftColumnsWidth = unref(leftTableWidth)\n const _fixedTableHeight = unref(fixedTableHeight)\n\n const leftTableProps = {\n cache,\n class: ns.e('left'),\n columns: unref(fixedColumnsOnLeft),\n data: _data,\n fixedData,\n estimatedRowHeight,\n leftTableRef,\n rowHeight,\n bodyWidth: leftColumnsWidth,\n headerWidth: leftColumnsWidth,\n headerHeight,\n height: _fixedTableHeight,\n rowKey,\n scrollbarAlwaysOn,\n scrollbarStartGap: 2,\n scrollbarEndGap: vScrollbarSize,\n useIsScrolling,\n width: leftColumnsWidth,\n getRowHeight,\n onScroll: onVerticalScroll,\n }\n\n const rightColumnsWidth = unref(rightTableWidth)\n\n const rightTableProps = {\n cache,\n class: ns.e('right'),\n columns: unref(fixedColumnsOnRight),\n data: _data,\n fixedData,\n estimatedRowHeight,\n rightTableRef,\n rowHeight,\n bodyWidth: rightColumnsWidth,\n headerWidth: rightColumnsWidth,\n headerHeight,\n height: _fixedTableHeight,\n rowKey,\n scrollbarAlwaysOn,\n scrollbarStartGap: 2,\n scrollbarEndGap: vScrollbarSize,\n width: rightColumnsWidth,\n style: `${ns.cssVarName(\n 'table-scrollbar-size'\n )}: ${vScrollbarSize}px` as unknown as CSSProperties,\n useIsScrolling,\n getRowHeight,\n onScroll: onVerticalScroll,\n }\n const _columnsStyles = unref(columnsStyles)\n\n const tableRowProps = {\n ns,\n depthMap: unref(depthMap),\n columnsStyles: _columnsStyles,\n expandColumnKey,\n expandedRowKeys: unref(expandedRowKeys),\n estimatedRowHeight,\n hasFixedColumns: unref(hasFixedColumns),\n rowProps,\n rowClass,\n rowKey,\n rowEventHandlers,\n onRowHovered,\n onRowExpanded,\n onRowHeightChange,\n }\n\n const tableCellProps = {\n cellProps,\n expandColumnKey,\n indentSize,\n iconSize,\n rowKey,\n expandedRowKeys: unref(expandedRowKeys),\n ns,\n t,\n }\n\n const tableHeaderProps = {\n ns,\n headerClass,\n headerProps,\n columnsStyles: _columnsStyles,\n }\n\n const tableHeaderCellProps = {\n ns,\n t,\n\n sortBy,\n sortState,\n headerCellProps,\n onColumnSorted,\n }\n\n const tableSlots = {\n row: (props: TableGridRowSlotParams) => (\n <Row {...props} {...tableRowProps}>\n {{\n row: slots.row,\n cell: (props: TableV2RowCellRenderParam) =>\n slots.cell ? (\n <Cell\n {...props}\n {...tableCellProps}\n style={_columnsStyles[props.column.key as KeyType]}\n >\n {slots.cell(props)}\n </Cell>\n ) : (\n <Cell\n {...props}\n {...tableCellProps}\n style={_columnsStyles[props.column.key as KeyType]}\n />\n ),\n }}\n </Row>\n ),\n header: (props: TableV2HeaderRendererParams) => (\n <Header {...props} {...tableHeaderProps}>\n {{\n header: slots.header,\n cell: (props: TableV2HeaderRowCellRendererParams) =>\n slots['header-cell'] ? (\n <HeaderCell\n {...props}\n {...tableHeaderCellProps}\n style={_columnsStyles[props.column.key as KeyType]}\n >\n {slots['header-cell'](props)}\n </HeaderCell>\n ) : (\n <HeaderCell\n {...props}\n {...tableHeaderCellProps}\n style={_columnsStyles[props.column.key as KeyType]}\n />\n ),\n }}\n </Header>\n ),\n }\n\n const rootKls = [\n props.class,\n ns.b(),\n ns.e('root'),\n ns.is('dynamic', unref(isDynamic)),\n ]\n\n const footerProps = {\n class: ns.e('footer'),\n style: unref(footerHeight),\n }\n\n return (\n <div class={rootKls} style={unref(rootStyle)}>\n <MainTable {...mainTableProps}>{tableSlots}</MainTable>\n <LeftTable {...leftTableProps}>{tableSlots}</LeftTable>\n <RightTable {...rightTableProps}>{tableSlots}</RightTable>\n {slots.footer && (\n <Footer {...footerProps}>{{ default: slots.footer }}</Footer>\n )}\n {unref(showEmpty) && (\n <Empty class={ns.e('empty')} style={unref(emptyStyle)}>\n {{ default: slots.empty }}\n </Empty>\n )}\n {slots.overlay && (\n <Overlay class={ns.e('overlay')}>\n {{ default: slots.overlay }}\n </Overlay>\n )}\n </div>\n )\n }\n },\n})\n\nexport default TableV2\n\nexport type TableV2Instance = InstanceType<typeof TableV2> & {\n /\n @description scroll to a given position\n * @params params {{ scrollLeft?: number, scrollTop?: number }} where to scroll to.\n /\n scrollTo: (param: { scrollLeft?: number; scrollTop?: number }) => void\n /\n @description scroll to a given position horizontally\n * @params scrollLeft {Number} where to scroll to.\n /\n scrollToLeft: (scrollLeft: number) => void\n /\n @description scroll to a given position vertically\n * @params scrollTop { Number } where to scroll to.\n /\n scrollToTop: (scrollTop: number) => void\n /\n @description scroll to a given row\n * @params row {Number} which row to scroll to\n * @params strategy {ScrollStrategy} use what strategy to scroll to\n */\n scrollToRow(row: number, strategy?: ScrollStrategy): void\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"table-v2.js","names":["defineComponent","provide","unref","mergeProps","_mergeProps","isVNode","_isVNode","createVNode","_createVNode","useLocale","useNamespace","useTable","TableV2InjectionKey","tableV2Props","MainTable","LeftTable","RightTable","Row","Cell","Header","HeaderCell","Footer","Empty","Overlay","_isSlot","s","Object","prototype","toString","call","COMPONENT_NAME","TableV2","name","props","slots","setup","expose","ns","t","columnsStyles","fixedColumnsOnLeft","fixedColumnsOnRight","mainColumns","mainTableHeight","fixedTableHeight","leftTableWidth","rightTableWidth","data","depthMap","expandedRowKeys","hasFixedColumns","mainTableRef","leftTableRef","rightTableRef","isDynamic","isResetting","isScrolling","bodyWidth","emptyStyle","rootStyle","footerHeight","showEmpty","scrollTo","scrollToLeft","scrollToTop","scrollToRow","getRowHeight","onColumnSorted","onRowHeightChange","onRowHovered","onRowExpanded","onRowsRendered","onScroll","onVerticalScroll","cache","cellProps","estimatedRowHeight","expandColumnKey","fixedData","headerHeight","headerClass","headerProps","headerCellProps","sortBy","sortState","rowHeight","rowClass","rowEventHandlers","rowKey","rowProps","scrollbarAlwaysOn","indentSize","iconSize","useIsScrolling","vScrollbarSize","width","_data","mainTableProps","class","e","columns","headerWidth","height","scrollbarStartGap","scrollbarEndGap","leftColumnsWidth","_fixedTableHeight","leftTableProps","rightColumnsWidth","rightTableProps","style","cssVarName","_columnsStyles","tableRowProps","tableCellProps","tableHeaderProps","tableHeaderCellProps","tableSlots","row","cell","_slot","column","key","default","header","_slot2","rootKls","b","is","footerProps","footer","empty","overlay"],"sources":["../../../../../../packages/components/table-v2/src/table-v2.tsx"],"sourcesContent":["import { defineComponent, provide, unref } from 'vue'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { useTable } from './use-table'\nimport { TableV2InjectionKey } from './tokens'\nimport { tableV2Props } from './table'\n// renderers\nimport MainTable from './renderers/main-table'\nimport LeftTable from './renderers/left-table'\nimport RightTable from './renderers/right-table'\nimport Row from './renderers/row'\nimport Cell from './renderers/cell'\nimport Header from './renderers/header'\nimport HeaderCell from './renderers/header-cell'\nimport Footer from './renderers/footer'\nimport Empty from './renderers/empty'\nimport Overlay from './renderers/overlay'\n\nimport type { CSSProperties, SlotsType } from 'vue'\nimport type { TableGridRowSlotParams } from './table-grid'\nimport type { ScrollStrategy } from './composables/use-scrollbar'\nimport type {\n TableV2HeaderRendererParams,\n TableV2HeaderRowCellRendererParams,\n TableV2RowCellRenderParam,\n TableV2RowSlotProps,\n} from './components'\nimport type { KeyType, TableV2CustomizedHeaderSlotParam } from './types'\n\ntype TableV2Slots = {\n row?: (props: TableV2RowSlotProps) => any\n cell?: (props: TableV2RowCellRenderParam) => any\n header?: (props: TableV2CustomizedHeaderSlotParam) => any\n 'header-cell'?: (props: TableV2HeaderRowCellRendererParams) => any\n footer?: () => any\n empty?: () => any\n overlay?: () => any\n}\n\nconst COMPONENT_NAME = 'ElTableV2'\n\nconst TableV2 = defineComponent({\n name: COMPONENT_NAME,\n props: tableV2Props,\n slots: Object as SlotsType<TableV2Slots>,\n setup(props, { slots, expose }) {\n const ns = useNamespace('table-v2')\n const { t } = useLocale()\n\n const {\n columnsStyles,\n fixedColumnsOnLeft,\n fixedColumnsOnRight,\n mainColumns,\n mainTableHeight,\n fixedTableHeight,\n leftTableWidth,\n rightTableWidth,\n data,\n depthMap,\n expandedRowKeys,\n hasFixedColumns,\n mainTableRef,\n leftTableRef,\n rightTableRef,\n isDynamic,\n isResetting,\n isScrolling,\n\n bodyWidth,\n emptyStyle,\n rootStyle,\n footerHeight,\n\n showEmpty,\n\n // exposes\n scrollTo,\n scrollToLeft,\n scrollToTop,\n scrollToRow,\n\n getRowHeight,\n onColumnSorted,\n onRowHeightChange,\n onRowHovered,\n onRowExpanded,\n onRowsRendered,\n onScroll,\n onVerticalScroll,\n } = useTable(props)\n\n expose({\n /*\n @description scroll to a given position\n * @params params {{ scrollLeft?: number, scrollTop?: number }} where to scroll to.\n /\n scrollTo,\n /\n @description scroll to a given position horizontally\n * @params scrollLeft {Number} where to scroll to.\n /\n scrollToLeft,\n /\n @description scroll to a given position vertically\n * @params scrollTop { Number } where to scroll to.\n /\n scrollToTop,\n /\n @description scroll to a given row\n * @params row {Number} which row to scroll to\n * @params @optional strategy {ScrollStrategy} use what strategy to scroll to\n /\n scrollToRow,\n })\n\n provide(TableV2InjectionKey, {\n ns,\n isResetting,\n isScrolling,\n })\n\n return () => {\n const {\n cache,\n cellProps,\n estimatedRowHeight,\n expandColumnKey,\n fixedData,\n headerHeight,\n headerClass,\n headerProps,\n headerCellProps,\n sortBy,\n sortState,\n rowHeight,\n rowClass,\n rowEventHandlers,\n rowKey,\n rowProps,\n scrollbarAlwaysOn,\n indentSize,\n iconSize,\n useIsScrolling,\n vScrollbarSize,\n width,\n } = props\n\n const _data = unref(data)\n\n const mainTableProps = {\n cache,\n class: ns.e('main'),\n columns: unref(mainColumns),\n data: _data,\n fixedData,\n estimatedRowHeight,\n bodyWidth: unref(bodyWidth),\n headerHeight,\n headerWidth: unref(bodyWidth),\n height: unref(mainTableHeight),\n mainTableRef,\n rowKey,\n rowHeight,\n scrollbarAlwaysOn,\n scrollbarStartGap: 2,\n scrollbarEndGap: vScrollbarSize,\n useIsScrolling,\n width,\n getRowHeight,\n onRowsRendered,\n onScroll,\n }\n\n const leftColumnsWidth = unref(leftTableWidth)\n const _fixedTableHeight = unref(fixedTableHeight)\n\n const leftTableProps = {\n cache,\n class: ns.e('left'),\n columns: unref(fixedColumnsOnLeft),\n data: _data,\n fixedData,\n estimatedRowHeight,\n leftTableRef,\n rowHeight,\n bodyWidth: leftColumnsWidth,\n headerWidth: leftColumnsWidth,\n headerHeight,\n height: _fixedTableHeight,\n rowKey,\n scrollbarAlwaysOn,\n scrollbarStartGap: 2,\n scrollbarEndGap: vScrollbarSize,\n useIsScrolling,\n width: leftColumnsWidth,\n getRowHeight,\n onScroll: onVerticalScroll,\n }\n\n const rightColumnsWidth = unref(rightTableWidth)\n\n const rightTableProps = {\n cache,\n class: ns.e('right'),\n columns: unref(fixedColumnsOnRight),\n data: _data,\n fixedData,\n estimatedRowHeight,\n rightTableRef,\n rowHeight,\n bodyWidth: rightColumnsWidth,\n headerWidth: rightColumnsWidth,\n headerHeight,\n height: _fixedTableHeight,\n rowKey,\n scrollbarAlwaysOn,\n scrollbarStartGap: 2,\n scrollbarEndGap: vScrollbarSize,\n width: rightColumnsWidth,\n style: `${ns.cssVarName(\n 'table-scrollbar-size'\n )}: ${vScrollbarSize}px` as unknown as CSSProperties,\n useIsScrolling,\n getRowHeight,\n onScroll: onVerticalScroll,\n }\n const _columnsStyles = unref(columnsStyles)\n\n const tableRowProps = {\n ns,\n depthMap: unref(depthMap),\n columnsStyles: _columnsStyles,\n expandColumnKey,\n expandedRowKeys: unref(expandedRowKeys),\n estimatedRowHeight,\n hasFixedColumns: unref(hasFixedColumns),\n rowProps,\n rowClass,\n rowKey,\n rowEventHandlers,\n onRowHovered,\n onRowExpanded,\n onRowHeightChange,\n }\n\n const tableCellProps = {\n cellProps,\n expandColumnKey,\n indentSize,\n iconSize,\n rowKey,\n expandedRowKeys: unref(expandedRowKeys),\n ns,\n t,\n }\n\n const tableHeaderProps = {\n ns,\n headerClass,\n headerProps,\n columnsStyles: _columnsStyles,\n }\n\n const tableHeaderCellProps = {\n ns,\n t,\n\n sortBy,\n sortState,\n headerCellProps,\n onColumnSorted,\n }\n\n const tableSlots = {\n row: (props: TableGridRowSlotParams) => (\n <Row {...props} {...tableRowProps}>\n {{\n row: slots.row,\n cell: (props: TableV2RowCellRenderParam) =>\n slots.cell ? (\n <Cell\n {...props}\n {...tableCellProps}\n style={_columnsStyles[props.column.key as KeyType]}\n >\n {slots.cell(props)}\n </Cell>\n ) : (\n <Cell\n {...props}\n {...tableCellProps}\n style={_columnsStyles[props.column.key as KeyType]}\n />\n ),\n }}\n </Row>\n ),\n header: (props: TableV2HeaderRendererParams) => (\n <Header {...props} {...tableHeaderProps}>\n {{\n header: slots.header,\n cell: (props: TableV2HeaderRowCellRendererParams) =>\n slots['header-cell'] ? (\n <HeaderCell\n {...props}\n {...tableHeaderCellProps}\n style={_columnsStyles[props.column.key as KeyType]}\n >\n {slots['header-cell'](props)}\n </HeaderCell>\n ) : (\n <HeaderCell\n {...props}\n {...tableHeaderCellProps}\n style={_columnsStyles[props.column.key as KeyType]}\n />\n ),\n }}\n </Header>\n ),\n }\n\n const rootKls = [\n props.class,\n ns.b(),\n ns.e('root'),\n ns.is('dynamic', unref(isDynamic)),\n ]\n\n const footerProps = {\n class: ns.e('footer'),\n style: unref(footerHeight),\n }\n\n return (\n <div class={rootKls} style={unref(rootStyle)}>\n <MainTable {...mainTableProps}>{tableSlots}</MainTable>\n <LeftTable {...leftTableProps}>{tableSlots}</LeftTable>\n <RightTable {...rightTableProps}>{tableSlots}</RightTable>\n {slots.footer && (\n <Footer {...footerProps}>{{ default: slots.footer }}</Footer>\n )}\n {unref(showEmpty) && (\n <Empty class={ns.e('empty')} style={unref(emptyStyle)}>\n {{ default: slots.empty }}\n </Empty>\n )}\n {slots.overlay && (\n <Overlay class={ns.e('overlay')}>\n {{ default: slots.overlay }}\n </Overlay>\n )}\n </div>\n )\n }\n },\n})\n\nexport default TableV2\n\nexport type TableV2Instance = InstanceType<typeof TableV2> & {\n /\n @description scroll to a given position\n * @params params {{ scrollLeft?: number, scrollTop?: number }} where to scroll to.\n /\n scrollTo: (param: { scrollLeft?: number; scrollTop?: number }) => void\n /\n @description scroll to a given position horizontally\n * @params scrollLeft {Number} where to scroll to.\n /\n scrollToLeft: (scrollLeft: number) => void\n /\n @description scroll to a given position vertically\n * @params scrollTop { Number } where to scroll to.\n /\n scrollToTop: (scrollTop: number) => void\n /\n @description scroll to a given row\n * @params row {Number} which row to scroll to\n * @params strategy {ScrollStrategy} use what strategy to scroll to\n */\n scrollToRow(row: number, strategy?: ScrollStrategy): void\n}\n"],"mappings":"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"}

package/lib/components/tabs/src/tab-bar.vue.d.ts CHANGED Viewed

@@ -5,7 +5,7 @@ import { CSSProperties } from "vue";
 //#region ../../packages/components/tabs/src/tab-bar.vue.d.ts
 declare const __VLS_export: vue.DefineComponent<TabBarProps, {
-  /** @description tab root html element */ref: vue.Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>; /** @description method to manually update tab bar style */
+  /** @description tab root html element */ref: vue.Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>; /** @description method to manually update tab bar style, return the updated style */
   update: () => CSSProperties;
 }, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<TabBarProps> & Readonly<{}>, {
   tabs: TabsPaneContext[];

package/lib/components/tabs/src/tab-bar.vue_vue_type_script_setup_true_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tab-bar.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../../packages/components/tabs/src/tab-bar.vue"],"sourcesContent":["<template>\n <div\n v-if=\"renderActiveBar\"\n ref=\"barRef\"\n :class=\"[ns.e('active-bar'), ns.is(rootTabs!.props.tabPosition)]\"\n :style=\"barStyle\"\n />\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, nextTick, onBeforeUnmount, ref, watch } from 'vue'\nimport { useResizeObserver } from '@vueuse/core'\nimport { capitalize, isUndefined, throwError } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { tabsRootContextKey } from './constants'\n\nimport type { TabBarProps } from './tab-bar'\nimport type { CSSProperties } from 'vue'\n\nconst COMPONENT_NAME = 'ElTabBar'\ndefineOptions({\n name: COMPONENT_NAME,\n})\nconst props = withDefaults(defineProps<TabBarProps>(), {\n tabs: () => [],\n tabRefs: () => ({}),\n})\n\nconst rootTabs = inject(tabsRootContextKey)\nif (!rootTabs) throwError(COMPONENT_NAME, '<el-tabs><el-tab-bar /></el-tabs>')\n\nconst ns = useNamespace('tabs')\n\nconst barRef = ref<HTMLDivElement>()\nconst barStyle = ref<CSSProperties>()\n/*\n when defaultValue is not set, the bar is always shown.\n \n when defaultValue is set, the bar will be hidden until style is calculated\n * to avoid the bar showing in the wrong position on initial render.\n /\nconst renderActiveBar = computed(\n () =>\n isUndefined(rootTabs.props.defaultValue) \|\|\n Boolean(barStyle.value?.transform)\n)\n\nconst getBarStyle = (): CSSProperties => {\n let offset = 0\n let tabSize = 0\n\n const sizeName = ['top', 'bottom'].includes(rootTabs.props.tabPosition)\n ? 'width'\n : 'height'\n const sizeDir = sizeName === 'width' ? 'x' : 'y'\n const position = sizeDir === 'x' ? 'left' : 'top'\n\n props.tabs.every((tab) => {\n if (isUndefined(tab.paneName)) return false\n const $el = props.tabRefs[tab.paneName]\n if (!$el) return false\n\n if (!tab.active) {\n return true\n }\n\n offset = $el[`offset${capitalize(position)}`]\n tabSize = $el[`client${capitalize(sizeName)}`]\n\n const tabStyles = window.getComputedStyle($el)\n\n if (sizeName === 'width') {\n tabSize -=\n Number.parseFloat(tabStyles.paddingLeft) +\n Number.parseFloat(tabStyles.paddingRight)\n offset += Number.parseFloat(tabStyles.paddingLeft)\n }\n return false\n })\n\n return {\n [sizeName]: `${tabSize}px`,\n transform: `translate${capitalize(sizeDir)}(${offset}px)`,\n }\n}\n\nconst update = () => (barStyle.value = getBarStyle())\n\nconst tabObservers = [] as ReturnType<typeof useResizeObserver>[]\nconst observerTabs = () => {\n tabObservers.forEach((observer) => observer.stop())\n tabObservers.length = 0\n\n Object.values(props.tabRefs).forEach((tab) => {\n tabObservers.push(useResizeObserver(tab, update))\n })\n}\n\nwatch(\n () => props.tabs,\n async () => {\n await nextTick()\n update()\n\n observerTabs()\n },\n { immediate: true }\n)\nconst barObserver = useResizeObserver(barRef, () => update())\n\nonBeforeUnmount(() => {\n tabObservers.forEach((observer) => observer.stop())\n tabObservers.length = 0\n barObserver.stop()\n})\n\ndefineExpose({\n /* @description tab root html element /\n ref: barRef,\n /* @description method to manually update tab bar style */\n update,\n})\n</script>\n"],"mappings":";;;;;;;;;;;AAmBA,MAAM,iBAAiB;;;;;;EAIvB,MAAM,QAAQ;EAKd,MAAM,2BAAkB,qCAAkB;AAC1C,MAAI,CAAC,SAAU,0BAAW,gBAAgB,oCAAmC;EAE7E,MAAM,KAAK,2BAAa,OAAM;EAE9B,MAAM,uBAA6B;EACnC,MAAM,yBAA8B;;;;;;;EAOpC,MAAM,0CAEF,0BAAY,SAAS,MAAM,aAAa,IACxC,QAAQ,SAAS,OAAO,UAAS,CACrC;EAEA,MAAM,oBAAmC;GACvC,IAAI,SAAS;GACb,IAAI,UAAU;GAEd,MAAM,WAAW,CAAC,OAAO,SAAS,CAAC,SAAS,SAAS,MAAM,YAAW,GAClE,UACA;GACJ,MAAM,UAAU,aAAa,UAAU,MAAM;GAC7C,MAAM,WAAW,YAAY,MAAM,SAAS;AAE5C,SAAM,KAAK,OAAO,QAAQ;AACxB,QAAI,0BAAY,IAAI,SAAS,CAAE,QAAO;IACtC,MAAM,MAAM,MAAM,QAAQ,IAAI;AAC9B,QAAI,CAAC,IAAK,QAAO;AAEjB,QAAI,CAAC,IAAI,OACP,QAAO;AAGT,aAAS,IAAI,SAAS,2BAAW,SAAS;AAC1C,cAAU,IAAI,SAAS,2BAAW,SAAS;IAE3C,MAAM,YAAY,OAAO,iBAAiB,IAAG;AAE7C,QAAI,aAAa,SAAS;AACxB,gBACE,OAAO,WAAW,UAAU,YAAY,GACxC,OAAO,WAAW,UAAU,aAAY;AAC1C,eAAU,OAAO,WAAW,UAAU,YAAW;;AAEnD,WAAO;KACR;AAED,UAAO;KACJ,WAAW,GAAG,QAAQ;IACvB,WAAW,YAAY,2BAAW,QAAQ,CAAC,GAAG,OAAO;IACvD;;EAGF,MAAM,eAAgB,SAAS,QAAQ,aAAa;EAEpD,MAAM,eAAe,EAAE;EACvB,MAAM,qBAAqB;AACzB,gBAAa,SAAS,aAAa,SAAS,MAAM,CAAA;AAClD,gBAAa,SAAS;AAEtB,UAAO,OAAO,MAAM,QAAQ,CAAC,SAAS,QAAQ;AAC5C,iBAAa,yCAAuB,KAAK,OAAO,CAAA;KACjD;;AAGH,uBACQ,MAAM,MACZ,YAAY;AACV,4BAAe;AACf,WAAO;AAEP,iBAAa;KAEf,EAAE,WAAW,MAAK,CACpB;EACA,MAAM,kDAAgC,cAAc,QAAQ,CAAA;AAE5D,iCAAsB;AACpB,gBAAa,SAAS,aAAa,SAAS,MAAM,CAAA;AAClD,gBAAa,SAAS;AACtB,eAAY,MAAK;IAClB;AAED,WAAa;GAEX,KAAK;GAEL;GACD,CAAA;;UAvHS,gBAAA,2DAIN,OAAA;;aAHI;IAAJ,KAAI;IACH,+BAAK,gBAAG,GAAE,CAAC,EAAC,aAAA,iBAAgB,GAAE,CAAC,kBAAG,SAAQ,CAAE,MAAM,YAAW,CAAA,CAAA;IAC7D,+BAAO,SAAA,MAAQ"}
1	+ {"version":3,"file":"tab-bar.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../../packages/components/tabs/src/tab-bar.vue"],"sourcesContent":["<template>\n <div\n v-if=\"renderActiveBar\"\n ref=\"barRef\"\n :class=\"[ns.e('active-bar'), ns.is(rootTabs!.props.tabPosition)]\"\n :style=\"barStyle\"\n />\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, nextTick, onBeforeUnmount, ref, watch } from 'vue'\nimport { useResizeObserver } from '@vueuse/core'\nimport { capitalize, isUndefined, throwError } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { tabsRootContextKey } from './constants'\n\nimport type { TabBarProps } from './tab-bar'\nimport type { CSSProperties } from 'vue'\n\nconst COMPONENT_NAME = 'ElTabBar'\ndefineOptions({\n name: COMPONENT_NAME,\n})\nconst props = withDefaults(defineProps<TabBarProps>(), {\n tabs: () => [],\n tabRefs: () => ({}),\n})\n\nconst rootTabs = inject(tabsRootContextKey)\nif (!rootTabs) throwError(COMPONENT_NAME, '<el-tabs><el-tab-bar /></el-tabs>')\n\nconst ns = useNamespace('tabs')\n\nconst barRef = ref<HTMLDivElement>()\nconst barStyle = ref<CSSProperties>()\n/*\n when defaultValue is not set, the bar is always shown.\n \n when defaultValue is set, the bar will be hidden until style is calculated\n * to avoid the bar showing in the wrong position on initial render.\n /\nconst renderActiveBar = computed(\n () =>\n isUndefined(rootTabs.props.defaultValue) \|\|\n Boolean(barStyle.value?.transform)\n)\n\nconst getBarStyle = (): CSSProperties => {\n let offset = 0\n let tabSize = 0\n\n const sizeName = ['top', 'bottom'].includes(rootTabs.props.tabPosition)\n ? 'width'\n : 'height'\n const sizeDir = sizeName === 'width' ? 'x' : 'y'\n const position = sizeDir === 'x' ? 'left' : 'top'\n\n props.tabs.every((tab) => {\n if (isUndefined(tab.paneName)) return false\n const $el = props.tabRefs[tab.paneName]\n if (!$el) return false\n\n if (!tab.active) {\n return true\n }\n\n offset = $el[`offset${capitalize(position)}`]\n tabSize = $el[`client${capitalize(sizeName)}`]\n\n const tabStyles = window.getComputedStyle($el)\n\n if (sizeName === 'width') {\n tabSize -=\n Number.parseFloat(tabStyles.paddingLeft) +\n Number.parseFloat(tabStyles.paddingRight)\n offset += Number.parseFloat(tabStyles.paddingLeft)\n }\n return false\n })\n\n return {\n [sizeName]: `${tabSize}px`,\n transform: `translate${capitalize(sizeDir)}(${offset}px)`,\n }\n}\n\nconst update = () => (barStyle.value = getBarStyle())\n\nconst tabObservers = [] as ReturnType<typeof useResizeObserver>[]\nconst observerTabs = () => {\n tabObservers.forEach((observer) => observer.stop())\n tabObservers.length = 0\n\n Object.values(props.tabRefs).forEach((tab) => {\n tabObservers.push(useResizeObserver(tab, update))\n })\n}\n\nwatch(\n () => props.tabs,\n async () => {\n await nextTick()\n update()\n\n observerTabs()\n },\n { immediate: true }\n)\nconst barObserver = useResizeObserver(barRef, () => update())\n\nonBeforeUnmount(() => {\n tabObservers.forEach((observer) => observer.stop())\n tabObservers.length = 0\n barObserver.stop()\n})\n\ndefineExpose({\n /* @description tab root html element /\n ref: barRef,\n /* @description method to manually update tab bar style, return the updated style */\n update,\n})\n</script>\n"],"mappings":";;;;;;;;;;;AAmBA,MAAM,iBAAiB;;;;;;EAIvB,MAAM,QAAQ;EAKd,MAAM,2BAAkB,qCAAkB;AAC1C,MAAI,CAAC,SAAU,0BAAW,gBAAgB,oCAAmC;EAE7E,MAAM,KAAK,2BAAa,OAAM;EAE9B,MAAM,uBAA6B;EACnC,MAAM,yBAA8B;;;;;;;EAOpC,MAAM,0CAEF,0BAAY,SAAS,MAAM,aAAa,IACxC,QAAQ,SAAS,OAAO,UAAS,CACrC;EAEA,MAAM,oBAAmC;GACvC,IAAI,SAAS;GACb,IAAI,UAAU;GAEd,MAAM,WAAW,CAAC,OAAO,SAAS,CAAC,SAAS,SAAS,MAAM,YAAW,GAClE,UACA;GACJ,MAAM,UAAU,aAAa,UAAU,MAAM;GAC7C,MAAM,WAAW,YAAY,MAAM,SAAS;AAE5C,SAAM,KAAK,OAAO,QAAQ;AACxB,QAAI,0BAAY,IAAI,SAAS,CAAE,QAAO;IACtC,MAAM,MAAM,MAAM,QAAQ,IAAI;AAC9B,QAAI,CAAC,IAAK,QAAO;AAEjB,QAAI,CAAC,IAAI,OACP,QAAO;AAGT,aAAS,IAAI,SAAS,2BAAW,SAAS;AAC1C,cAAU,IAAI,SAAS,2BAAW,SAAS;IAE3C,MAAM,YAAY,OAAO,iBAAiB,IAAG;AAE7C,QAAI,aAAa,SAAS;AACxB,gBACE,OAAO,WAAW,UAAU,YAAY,GACxC,OAAO,WAAW,UAAU,aAAY;AAC1C,eAAU,OAAO,WAAW,UAAU,YAAW;;AAEnD,WAAO;KACR;AAED,UAAO;KACJ,WAAW,GAAG,QAAQ;IACvB,WAAW,YAAY,2BAAW,QAAQ,CAAC,GAAG,OAAO;IACvD;;EAGF,MAAM,eAAgB,SAAS,QAAQ,aAAa;EAEpD,MAAM,eAAe,EAAE;EACvB,MAAM,qBAAqB;AACzB,gBAAa,SAAS,aAAa,SAAS,MAAM,CAAA;AAClD,gBAAa,SAAS;AAEtB,UAAO,OAAO,MAAM,QAAQ,CAAC,SAAS,QAAQ;AAC5C,iBAAa,yCAAuB,KAAK,OAAO,CAAA;KACjD;;AAGH,uBACQ,MAAM,MACZ,YAAY;AACV,4BAAe;AACf,WAAO;AAEP,iBAAa;KAEf,EAAE,WAAW,MAAK,CACpB;EACA,MAAM,kDAAgC,cAAc,QAAQ,CAAA;AAE5D,iCAAsB;AACpB,gBAAa,SAAS,aAAa,SAAS,MAAM,CAAA;AAClD,gBAAa,SAAS;AACtB,eAAY,MAAK;IAClB;AAED,WAAa;GAEX,KAAK;GAEL;GACD,CAAA;;UAvHS,gBAAA,2DAIN,OAAA;;aAHI;IAAJ,KAAI;IACH,+BAAK,gBAAG,GAAE,CAAC,EAAC,aAAA,iBAAgB,GAAE,CAAC,kBAAG,SAAQ,CAAE,MAAM,YAAW,CAAA,CAAA;IAC7D,+BAAO,SAAA,MAAQ"}

package/lib/components/tabs/src/tab-bar2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tab-bar2.js","names":[],"sources":["../../../../../../packages/components/tabs/src/tab-bar.vue"],"sourcesContent":["<template>\n <div\n v-if=\"renderActiveBar\"\n ref=\"barRef\"\n :class=\"[ns.e('active-bar'), ns.is(rootTabs!.props.tabPosition)]\"\n :style=\"barStyle\"\n />\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, nextTick, onBeforeUnmount, ref, watch } from 'vue'\nimport { useResizeObserver } from '@vueuse/core'\nimport { capitalize, isUndefined, throwError } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { tabsRootContextKey } from './constants'\n\nimport type { TabBarProps } from './tab-bar'\nimport type { CSSProperties } from 'vue'\n\nconst COMPONENT_NAME = 'ElTabBar'\ndefineOptions({\n name: COMPONENT_NAME,\n})\nconst props = withDefaults(defineProps<TabBarProps>(), {\n tabs: () => [],\n tabRefs: () => ({}),\n})\n\nconst rootTabs = inject(tabsRootContextKey)\nif (!rootTabs) throwError(COMPONENT_NAME, '<el-tabs><el-tab-bar /></el-tabs>')\n\nconst ns = useNamespace('tabs')\n\nconst barRef = ref<HTMLDivElement>()\nconst barStyle = ref<CSSProperties>()\n/*\n when defaultValue is not set, the bar is always shown.\n \n when defaultValue is set, the bar will be hidden until style is calculated\n * to avoid the bar showing in the wrong position on initial render.\n /\nconst renderActiveBar = computed(\n () =>\n isUndefined(rootTabs.props.defaultValue) \|\|\n Boolean(barStyle.value?.transform)\n)\n\nconst getBarStyle = (): CSSProperties => {\n let offset = 0\n let tabSize = 0\n\n const sizeName = ['top', 'bottom'].includes(rootTabs.props.tabPosition)\n ? 'width'\n : 'height'\n const sizeDir = sizeName === 'width' ? 'x' : 'y'\n const position = sizeDir === 'x' ? 'left' : 'top'\n\n props.tabs.every((tab) => {\n if (isUndefined(tab.paneName)) return false\n const $el = props.tabRefs[tab.paneName]\n if (!$el) return false\n\n if (!tab.active) {\n return true\n }\n\n offset = $el[`offset${capitalize(position)}`]\n tabSize = $el[`client${capitalize(sizeName)}`]\n\n const tabStyles = window.getComputedStyle($el)\n\n if (sizeName === 'width') {\n tabSize -=\n Number.parseFloat(tabStyles.paddingLeft) +\n Number.parseFloat(tabStyles.paddingRight)\n offset += Number.parseFloat(tabStyles.paddingLeft)\n }\n return false\n })\n\n return {\n [sizeName]: `${tabSize}px`,\n transform: `translate${capitalize(sizeDir)}(${offset}px)`,\n }\n}\n\nconst update = () => (barStyle.value = getBarStyle())\n\nconst tabObservers = [] as ReturnType<typeof useResizeObserver>[]\nconst observerTabs = () => {\n tabObservers.forEach((observer) => observer.stop())\n tabObservers.length = 0\n\n Object.values(props.tabRefs).forEach((tab) => {\n tabObservers.push(useResizeObserver(tab, update))\n })\n}\n\nwatch(\n () => props.tabs,\n async () => {\n await nextTick()\n update()\n\n observerTabs()\n },\n { immediate: true }\n)\nconst barObserver = useResizeObserver(barRef, () => update())\n\nonBeforeUnmount(() => {\n tabObservers.forEach((observer) => observer.stop())\n tabObservers.length = 0\n barObserver.stop()\n})\n\ndefineExpose({\n /* @description tab root html element /\n ref: barRef,\n /* @description method to manually update tab bar style */\n update,\n})\n</script>\n"],"mappings":""}
1	+ {"version":3,"file":"tab-bar2.js","names":[],"sources":["../../../../../../packages/components/tabs/src/tab-bar.vue"],"sourcesContent":["<template>\n <div\n v-if=\"renderActiveBar\"\n ref=\"barRef\"\n :class=\"[ns.e('active-bar'), ns.is(rootTabs!.props.tabPosition)]\"\n :style=\"barStyle\"\n />\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, nextTick, onBeforeUnmount, ref, watch } from 'vue'\nimport { useResizeObserver } from '@vueuse/core'\nimport { capitalize, isUndefined, throwError } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { tabsRootContextKey } from './constants'\n\nimport type { TabBarProps } from './tab-bar'\nimport type { CSSProperties } from 'vue'\n\nconst COMPONENT_NAME = 'ElTabBar'\ndefineOptions({\n name: COMPONENT_NAME,\n})\nconst props = withDefaults(defineProps<TabBarProps>(), {\n tabs: () => [],\n tabRefs: () => ({}),\n})\n\nconst rootTabs = inject(tabsRootContextKey)\nif (!rootTabs) throwError(COMPONENT_NAME, '<el-tabs><el-tab-bar /></el-tabs>')\n\nconst ns = useNamespace('tabs')\n\nconst barRef = ref<HTMLDivElement>()\nconst barStyle = ref<CSSProperties>()\n/*\n when defaultValue is not set, the bar is always shown.\n \n when defaultValue is set, the bar will be hidden until style is calculated\n * to avoid the bar showing in the wrong position on initial render.\n /\nconst renderActiveBar = computed(\n () =>\n isUndefined(rootTabs.props.defaultValue) \|\|\n Boolean(barStyle.value?.transform)\n)\n\nconst getBarStyle = (): CSSProperties => {\n let offset = 0\n let tabSize = 0\n\n const sizeName = ['top', 'bottom'].includes(rootTabs.props.tabPosition)\n ? 'width'\n : 'height'\n const sizeDir = sizeName === 'width' ? 'x' : 'y'\n const position = sizeDir === 'x' ? 'left' : 'top'\n\n props.tabs.every((tab) => {\n if (isUndefined(tab.paneName)) return false\n const $el = props.tabRefs[tab.paneName]\n if (!$el) return false\n\n if (!tab.active) {\n return true\n }\n\n offset = $el[`offset${capitalize(position)}`]\n tabSize = $el[`client${capitalize(sizeName)}`]\n\n const tabStyles = window.getComputedStyle($el)\n\n if (sizeName === 'width') {\n tabSize -=\n Number.parseFloat(tabStyles.paddingLeft) +\n Number.parseFloat(tabStyles.paddingRight)\n offset += Number.parseFloat(tabStyles.paddingLeft)\n }\n return false\n })\n\n return {\n [sizeName]: `${tabSize}px`,\n transform: `translate${capitalize(sizeDir)}(${offset}px)`,\n }\n}\n\nconst update = () => (barStyle.value = getBarStyle())\n\nconst tabObservers = [] as ReturnType<typeof useResizeObserver>[]\nconst observerTabs = () => {\n tabObservers.forEach((observer) => observer.stop())\n tabObservers.length = 0\n\n Object.values(props.tabRefs).forEach((tab) => {\n tabObservers.push(useResizeObserver(tab, update))\n })\n}\n\nwatch(\n () => props.tabs,\n async () => {\n await nextTick()\n update()\n\n observerTabs()\n },\n { immediate: true }\n)\nconst barObserver = useResizeObserver(barRef, () => update())\n\nonBeforeUnmount(() => {\n tabObservers.forEach((observer) => observer.stop())\n tabObservers.length = 0\n barObserver.stop()\n})\n\ndefineExpose({\n /* @description tab root html element /\n ref: barRef,\n /* @description method to manually update tab bar style, return the updated style */\n update,\n})\n</script>\n"],"mappings":""}

package/lib/components/tabs/src/tab-nav.d.ts CHANGED Viewed

@@ -268,8 +268,8 @@ declare const TabNav: vue.DefineComponent<ExtractPropTypes<{
   }, ev: Event) => any) | undefined;
 }>, {
   readonly type: EpPropMergeType<StringConstructor, "" | "card" | "border-card", unknown>;
-  readonly stretch: boolean;
   readonly tabindex: EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
+  readonly stretch: boolean;
   readonly editable: boolean;
   readonly panes: {
     uid: number;

package/lib/components/tabs/src/tabs.d.ts CHANGED Viewed

@@ -25,7 +25,7 @@ declare const tabsProps: {
     __epPropKey: true;
   };
   readonly editable: BooleanConstructor;
-  readonly tabPosition: EpPropFinalized<StringConstructor, "bottom" | "top" | "right" | "left", unknown, "top", boolean>;
+  readonly tabPosition: EpPropFinalized<StringConstructor, "top" | "bottom" | "left" | "right", unknown, "top", boolean>;
   readonly beforeLeave: EpPropFinalized<(new (...args: any[]) => (newName: TabPaneName, oldName: TabPaneName) => Awaitable<void | boolean>) | (() => (newName: TabPaneName, oldName: TabPaneName) => Awaitable<void | boolean>) | {
     (): (newName: TabPaneName, oldName: TabPaneName) => Awaitable<void | boolean>;
     new (): any;
@@ -67,7 +67,7 @@ declare const Tabs: vue.DefineComponent<ExtractPropTypes<{
     __epPropKey: true;
   };
   readonly editable: BooleanConstructor;
-  readonly tabPosition: EpPropFinalized<StringConstructor, "bottom" | "top" | "right" | "left", unknown, "top", boolean>;
+  readonly tabPosition: EpPropFinalized<StringConstructor, "top" | "bottom" | "left" | "right", unknown, "top", boolean>;
   readonly beforeLeave: EpPropFinalized<(new (...args: any[]) => (newName: TabPaneName, oldName: TabPaneName) => Awaitable<void | boolean>) | (() => (newName: TabPaneName, oldName: TabPaneName) => Awaitable<void | boolean>) | {
     (): (newName: TabPaneName, oldName: TabPaneName) => Awaitable<void | boolean>;
     new (): any;
@@ -103,7 +103,7 @@ declare const Tabs: vue.DefineComponent<ExtractPropTypes<{
     __epPropKey: true;
   };
   readonly editable: BooleanConstructor;
-  readonly tabPosition: EpPropFinalized<StringConstructor, "bottom" | "top" | "right" | "left", unknown, "top", boolean>;
+  readonly tabPosition: EpPropFinalized<StringConstructor, "top" | "bottom" | "left" | "right", unknown, "top", boolean>;
   readonly beforeLeave: EpPropFinalized<(new (...args: any[]) => (newName: TabPaneName, oldName: TabPaneName) => Awaitable<void | boolean>) | (() => (newName: TabPaneName, oldName: TabPaneName) => Awaitable<void | boolean>) | {
     (): (newName: TabPaneName, oldName: TabPaneName) => Awaitable<void | boolean>;
     new (): any;
@@ -141,10 +141,10 @@ declare const Tabs: vue.DefineComponent<ExtractPropTypes<{
 }>, {
   readonly type: EpPropMergeType<StringConstructor, "" | "card" | "border-card", unknown>;
   readonly closable: boolean;
-  readonly stretch: boolean;
   readonly tabindex: EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>;
+  readonly stretch: boolean;
   readonly editable: boolean;
-  readonly tabPosition: EpPropMergeType<StringConstructor, "bottom" | "top" | "right" | "left", unknown>;
+  readonly tabPosition: EpPropMergeType<StringConstructor, "top" | "bottom" | "left" | "right", unknown>;
   readonly beforeLeave: (newName: TabPaneName, oldName: TabPaneName) => Awaitable<void | boolean>;
   readonly addable: boolean;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;

package/lib/components/tag/src/tag.d.ts CHANGED Viewed

@@ -50,7 +50,7 @@ declare const tagProps: {
   readonly hit: BooleanConstructor;
   readonly color: StringConstructor;
   readonly size: {
-    readonly type: vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "large" | "small", unknown>>;
+    readonly type: vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", unknown>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;

package/lib/components/text/src/text.d.ts CHANGED Viewed

@@ -32,7 +32,7 @@ interface TextProps {
  */
 declare const textProps: {
   readonly type: EpPropFinalized<StringConstructor, "" | "info" | "primary" | "success" | "warning" | "danger", unknown, "", boolean>;
-  readonly size: EpPropFinalized<StringConstructor, "" | "default" | "large" | "small", unknown, "", boolean>;
+  readonly size: EpPropFinalized<StringConstructor, "" | "default" | "small" | "large", unknown, "", boolean>;
   readonly truncated: BooleanConstructor;
   readonly lineClamp: {
     readonly type: vue.PropType<EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;