2023-08-28 17:36:23 +08:00
import * as React from 'react' ;
2023-01-07 21:21:52 +08:00
import classNames from 'classnames' ;
2023-10-11 13:55:20 +08:00
import {
INTERNAL_HOOKS ,
type Reference as RcReference ,
type TableProps as RcTableProps ,
} from 'rc-table' ;
2023-04-06 17:16:27 +08:00
import { convertChildrenToColumns } from 'rc-table/lib/hooks/useColumns' ;
2023-01-07 21:21:52 +08:00
import omit from 'rc-util/lib/omit' ;
2023-08-28 17:36:23 +08:00
2023-10-11 13:55:20 +08:00
import useProxyImperativeHandle from '../_util/hooks/useProxyImperativeHandle' ;
2023-04-06 17:16:27 +08:00
import type { Breakpoint } from '../_util/responsiveObserver' ;
import scrollTo from '../_util/scrollTo' ;
2023-07-05 16:54:04 +08:00
import type { AnyObject } from '../_util/type' ;
2023-09-11 17:28:04 +08:00
import { devUseWarning } from '../_util/warning' ;
2023-01-07 21:21:52 +08:00
import type { ConfigConsumerProps } from '../config-provider/context' ;
import { ConfigContext } from '../config-provider/context' ;
2023-01-09 10:04:35 +08:00
import DefaultRenderEmpty from '../config-provider/defaultRenderEmpty' ;
2023-11-17 13:46:41 +08:00
import useCSSVarCls from '../config-provider/hooks/useCSSVarCls' ;
2023-05-12 14:53:47 +08:00
import useSize from '../config-provider/hooks/useSize' ;
2023-08-28 17:36:23 +08:00
import type { SizeType } from '../config-provider/SizeContext' ;
2023-01-07 21:21:52 +08:00
import useBreakpoint from '../grid/hooks/useBreakpoint' ;
import defaultLocale from '../locale/en_US' ;
import Pagination from '../pagination' ;
import type { SpinProps } from '../spin' ;
import Spin from '../spin' ;
2023-08-28 17:36:23 +08:00
import { useToken } from '../theme/internal' ;
2023-01-07 21:21:52 +08:00
import type { TooltipProps } from '../tooltip' ;
import renderExpandIcon from './ExpandIcon' ;
2023-09-13 17:53:54 +08:00
import useContainerWidth from './hooks/useContainerWidth' ;
2023-01-07 21:21:52 +08:00
import type { FilterState } from './hooks/useFilter' ;
import useFilter , { getFilterData } from './hooks/useFilter' ;
import useLazyKVMap from './hooks/useLazyKVMap' ;
import usePagination , { DEFAULT_PAGE_SIZE , getPaginationParam } from './hooks/usePagination' ;
import useSelection from './hooks/useSelection' ;
import type { SortState } from './hooks/useSorter' ;
import useSorter , { getSortData } from './hooks/useSorter' ;
import useTitleColumns from './hooks/useTitleColumns' ;
import type {
2023-08-28 17:36:23 +08:00
ColumnsType ,
2023-01-07 21:21:52 +08:00
ColumnTitleProps ,
ColumnType ,
2023-04-06 17:16:27 +08:00
ExpandableConfig ,
2023-08-28 17:36:23 +08:00
ExpandType ,
2023-01-07 21:21:52 +08:00
FilterValue ,
GetPopupContainer ,
GetRowKey ,
2023-02-22 17:22:50 +08:00
RefInternalTable ,
2023-04-06 17:16:27 +08:00
SorterResult ,
2023-08-28 17:36:23 +08:00
SortOrder ,
2023-01-07 21:21:52 +08:00
TableAction ,
TableCurrentDataSource ,
TableLocale ,
TablePaginationConfig ,
2023-02-22 17:22:50 +08:00
TableRowSelection ,
2023-01-07 21:21:52 +08:00
} from './interface' ;
2023-08-28 17:36:23 +08:00
import RcTable from './RcTable' ;
import RcVirtualTable from './RcTable/VirtualTable' ;
2023-01-07 21:21:52 +08:00
import useStyle from './style' ;
export type { ColumnsType , TablePaginationConfig } ;
const EMPTY_LIST : any [ ] = [ ] ;
interface ChangeEventInfo < RecordType > {
pagination : {
current? : number ;
pageSize? : number ;
total? : number ;
} ;
filters : Record < string , FilterValue | null > ;
sorter : SorterResult < RecordType > | SorterResult < RecordType > [ ] ;
filterStates : FilterState < RecordType > [ ] ;
sorterStates : SortState < RecordType > [ ] ;
2023-03-25 13:59:21 +08:00
resetPagination : ( current? : number , pageSize? : number ) = > void ;
2023-01-07 21:21:52 +08:00
}
/** Same as `TableProps` but we need record parent render times */
export interface InternalTableProps < RecordType > extends TableProps < RecordType > {
_renderTimes : number ;
}
2024-01-11 15:55:58 +08:00
export interface TableProps < RecordType = any >
2023-01-07 21:21:52 +08:00
extends Omit <
RcTableProps < RecordType > ,
| 'transformColumns'
| 'internalHooks'
| 'internalRefs'
| 'data'
| 'columns'
| 'scroll'
| 'emptyText'
> {
dropdownPrefixCls? : string ;
dataSource? : RcTableProps < RecordType > [ 'data' ] ;
columns? : ColumnsType < RecordType > ;
pagination? : false | TablePaginationConfig ;
loading? : boolean | SpinProps ;
size? : SizeType ;
bordered? : boolean ;
locale? : TableLocale ;
2023-01-20 11:03:50 +08:00
rootClassName? : string ;
2023-01-07 21:21:52 +08:00
onChange ? : (
pagination : TablePaginationConfig ,
filters : Record < string , FilterValue | null > ,
sorter : SorterResult < RecordType > | SorterResult < RecordType > [ ] ,
extra : TableCurrentDataSource < RecordType > ,
) = > void ;
rowSelection? : TableRowSelection < RecordType > ;
getPopupContainer? : GetPopupContainer ;
scroll? : RcTableProps < RecordType > [ 'scroll' ] & {
scrollToFirstRowOnChange? : boolean ;
} ;
sortDirections? : SortOrder [ ] ;
showSorterTooltip? : boolean | TooltipProps ;
2023-08-28 17:36:23 +08:00
virtual? : boolean ;
2023-01-07 21:21:52 +08:00
}
2023-07-05 16:54:04 +08:00
const InternalTable = < RecordType extends AnyObject = AnyObject > (
2023-01-07 21:21:52 +08:00
props : InternalTableProps < RecordType > ,
ref : React.MutableRefObject < HTMLDivElement > ,
2023-04-06 17:16:27 +08:00
) = > {
2023-01-07 21:21:52 +08:00
const {
prefixCls : customizePrefixCls ,
className ,
2023-01-20 11:03:50 +08:00
rootClassName ,
2023-01-07 21:21:52 +08:00
style ,
size : customizeSize ,
bordered ,
dropdownPrefixCls : customizeDropdownPrefixCls ,
dataSource ,
pagination ,
rowSelection ,
rowKey = 'key' ,
rowClassName ,
columns ,
children ,
childrenColumnName : legacyChildrenColumnName ,
onChange ,
getPopupContainer ,
loading ,
expandIcon ,
expandable ,
expandedRowRender ,
expandIconColumnIndex ,
indentSize ,
scroll ,
sortDirections ,
locale ,
showSorterTooltip = true ,
2023-08-28 17:36:23 +08:00
virtual ,
2023-01-07 21:21:52 +08:00
} = props ;
2023-09-13 22:07:33 +08:00
const warning = devUseWarning ( 'Table' ) ;
2023-09-11 17:28:04 +08:00
2023-01-07 21:21:52 +08:00
if ( process . env . NODE_ENV !== 'production' ) {
warning (
! ( typeof rowKey === 'function' && rowKey . length > 1 ) ,
2023-09-11 17:28:04 +08:00
'usage' ,
2023-01-07 21:21:52 +08:00
'`index` parameter of `rowKey` function is deprecated. There is no guarantee that it will work as expected.' ,
) ;
}
const baseColumns = React . useMemo (
( ) = > columns || ( convertChildrenToColumns ( children ) as ColumnsType < RecordType > ) ,
[ columns , children ] ,
) ;
const needResponsive = React . useMemo (
( ) = > baseColumns . some ( ( col : ColumnType < RecordType > ) = > col . responsive ) ,
[ baseColumns ] ,
) ;
const screens = useBreakpoint ( needResponsive ) ;
const mergedColumns = React . useMemo ( ( ) = > {
const matched = new Set ( Object . keys ( screens ) . filter ( ( m : Breakpoint ) = > screens [ m ] ) ) ;
return baseColumns . filter (
( c ) = > ! c . responsive || c . responsive . some ( ( r : Breakpoint ) = > matched . has ( r ) ) ,
) ;
} , [ baseColumns , screens ] ) ;
const tableProps : TableProps < RecordType > = omit ( props , [ 'className' , 'style' , 'columns' ] ) ;
const {
locale : contextLocale = defaultLocale ,
direction ,
2023-06-30 20:42:43 +08:00
table ,
2023-01-07 21:21:52 +08:00
renderEmpty ,
getPrefixCls ,
2023-04-06 17:16:27 +08:00
getPopupContainer : getContextPopupContainer ,
2023-01-07 21:21:52 +08:00
} = React . useContext < ConfigConsumerProps > ( ConfigContext ) ;
2023-05-12 14:53:47 +08:00
const mergedSize = useSize ( customizeSize ) ;
2023-01-07 21:21:52 +08:00
const tableLocale : TableLocale = { . . . contextLocale . Table , . . . locale } ;
const rawData : readonly RecordType [ ] = dataSource || EMPTY_LIST ;
const prefixCls = getPrefixCls ( 'table' , customizePrefixCls ) ;
const dropdownPrefixCls = getPrefixCls ( 'dropdown' , customizeDropdownPrefixCls ) ;
2023-12-07 19:21:43 +08:00
const [ , token ] = useToken ( ) ;
const rootCls = useCSSVarCls ( prefixCls ) ;
2023-12-14 14:58:53 +08:00
const [ wrapCSSVar , hashId , cssVarCls ] = useStyle ( prefixCls , rootCls ) ;
2023-12-07 19:21:43 +08:00
2023-01-07 21:21:52 +08:00
const mergedExpandable : ExpandableConfig < RecordType > = {
childrenColumnName : legacyChildrenColumnName ,
expandIconColumnIndex ,
. . . expandable ,
} ;
const { childrenColumnName = 'children' } = mergedExpandable ;
const expandType = React . useMemo < ExpandType > ( ( ) = > {
2023-08-01 01:26:41 +08:00
if ( rawData . some ( ( item ) = > item ? . [ childrenColumnName ] ) ) {
2023-01-07 21:21:52 +08:00
return 'nest' ;
}
if ( expandedRowRender || ( expandable && expandable . expandedRowRender ) ) {
return 'row' ;
}
return null ;
} , [ rawData ] ) ;
const internalRefs = {
body : React.useRef < HTMLDivElement > ( ) ,
} ;
2023-09-13 17:53:54 +08:00
// ============================ Width =============================
const getContainerWidth = useContainerWidth ( prefixCls ) ;
2023-10-11 13:55:20 +08:00
// ============================= Refs =============================
const rootRef = React . useRef < HTMLDivElement > ( null ) ;
const tblRef = React . useRef < RcReference > ( null ) ;
useProxyImperativeHandle ( ref , ( ) = > ( {
. . . tblRef . current ! ,
nativeElement : rootRef.current ! ,
} ) ) ;
2023-01-07 21:21:52 +08:00
// ============================ RowKey ============================
const getRowKey = React . useMemo < GetRowKey < RecordType > > ( ( ) = > {
if ( typeof rowKey === 'function' ) {
return rowKey ;
}
return ( record : RecordType ) = > ( record as any ) ? . [ rowKey as string ] ;
} , [ rowKey ] ) ;
const [ getRecordByKey ] = useLazyKVMap ( rawData , childrenColumnName , getRowKey ) ;
// ============================ Events =============================
const changeEventInfo : Partial < ChangeEventInfo < RecordType > > = { } ;
const triggerOnChange = (
info : Partial < ChangeEventInfo < RecordType > > ,
action : TableAction ,
reset : boolean = false ,
) = > {
const changeInfo = {
. . . changeEventInfo ,
. . . info ,
} ;
if ( reset ) {
2023-03-25 13:59:21 +08:00
changeEventInfo . resetPagination ? . ( ) ;
2023-01-07 21:21:52 +08:00
// Reset event param
2023-03-25 13:59:21 +08:00
if ( changeInfo . pagination ? . current ) {
changeInfo . pagination . current = 1 ;
2023-01-07 21:21:52 +08:00
}
// Trigger pagination events
if ( pagination && pagination . onChange ) {
2023-03-25 13:59:21 +08:00
pagination . onChange ( 1 , changeInfo . pagination ? . pageSize ! ) ;
2023-01-07 21:21:52 +08:00
}
}
if ( scroll && scroll . scrollToFirstRowOnChange !== false && internalRefs . body . current ) {
scrollTo ( 0 , {
getContainer : ( ) = > internalRefs . body . current ! ,
} ) ;
}
onChange ? . ( changeInfo . pagination ! , changeInfo . filters ! , changeInfo . sorter ! , {
currentDataSource : getFilterData (
getSortData ( rawData , changeInfo . sorterStates ! , childrenColumnName ) ,
changeInfo . filterStates ! ,
) ,
action ,
} ) ;
} ;
/ * *
* Controlled state in ` columns ` is not a good idea that makes too many code ( 1000 + line ? ) to read
* state out and then put it back to title render . Move these code into ` hooks ` but still too
* complex . We should provides Table props like ` sorter ` & ` filter ` to handle control in next big
* version .
* /
// ============================ Sorter =============================
const onSorterChange = (
sorter : SorterResult < RecordType > | SorterResult < RecordType > [ ] ,
sorterStates : SortState < RecordType > [ ] ,
) = > {
triggerOnChange (
{
sorter ,
sorterStates ,
} ,
'sort' ,
false ,
) ;
} ;
const [ transformSorterColumns , sortStates , sorterTitleProps , getSorters ] = useSorter < RecordType > ( {
prefixCls ,
mergedColumns ,
onSorterChange ,
sortDirections : sortDirections || [ 'ascend' , 'descend' ] ,
tableLocale ,
showSorterTooltip ,
} ) ;
const sortedData = React . useMemo (
( ) = > getSortData ( rawData , sortStates , childrenColumnName ) ,
[ rawData , sortStates ] ,
) ;
changeEventInfo . sorter = getSorters ( ) ;
changeEventInfo . sorterStates = sortStates ;
// ============================ Filter ============================
const onFilterChange = (
filters : Record < string , FilterValue > ,
filterStates : FilterState < RecordType > [ ] ,
) = > {
triggerOnChange (
{
filters ,
filterStates ,
} ,
'filter' ,
true ,
) ;
} ;
const [ transformFilterColumns , filterStates , filters ] = useFilter < RecordType > ( {
prefixCls ,
locale : tableLocale ,
dropdownPrefixCls ,
mergedColumns ,
onFilterChange ,
2023-02-22 17:22:50 +08:00
getPopupContainer : getPopupContainer || getContextPopupContainer ,
2023-12-07 19:21:43 +08:00
rootClassName : classNames ( rootClassName , rootCls ) ,
2023-01-07 21:21:52 +08:00
} ) ;
const mergedData = getFilterData ( sortedData , filterStates ) ;
changeEventInfo . filters = filters ;
changeEventInfo . filterStates = filterStates ;
// ============================ Column ============================
const columnTitleProps = React . useMemo < ColumnTitleProps < RecordType > > ( ( ) = > {
const mergedFilters : Record < string , FilterValue > = { } ;
Object . keys ( filters ) . forEach ( ( filterKey ) = > {
if ( filters [ filterKey ] !== null ) {
mergedFilters [ filterKey ] = filters [ filterKey ] ! ;
}
} ) ;
return {
. . . sorterTitleProps ,
filters : mergedFilters ,
} ;
} , [ sorterTitleProps , filters ] ) ;
const [ transformTitleColumns ] = useTitleColumns ( columnTitleProps ) ;
// ========================== Pagination ==========================
const onPaginationChange = ( current : number , pageSize : number ) = > {
triggerOnChange (
{
pagination : { . . . changeEventInfo . pagination , current , pageSize } ,
} ,
'paginate' ,
) ;
} ;
const [ mergedPagination , resetPagination ] = usePagination (
mergedData . length ,
onPaginationChange ,
2023-03-03 14:55:46 +08:00
pagination ,
2023-01-07 21:21:52 +08:00
) ;
changeEventInfo . pagination =
2023-01-16 16:31:08 +08:00
pagination === false ? { } : getPaginationParam ( mergedPagination , pagination ) ;
2023-01-07 21:21:52 +08:00
changeEventInfo . resetPagination = resetPagination ;
// ============================= Data =============================
const pageData = React . useMemo < RecordType [ ] > ( ( ) = > {
if ( pagination === false || ! mergedPagination . pageSize ) {
return mergedData ;
}
const { current = 1 , total , pageSize = DEFAULT_PAGE_SIZE } = mergedPagination ;
2023-09-13 22:07:33 +08:00
warning ( current > 0 , 'usage' , '`current` should be positive number.' ) ;
2023-01-07 21:21:52 +08:00
// Dynamic table data
if ( mergedData . length < total ! ) {
if ( mergedData . length > pageSize ) {
warning (
false ,
2023-09-11 17:28:04 +08:00
'usage' ,
2023-01-07 21:21:52 +08:00
'`dataSource` length is less than `pagination.total` but large than `pagination.pageSize`. Please make sure your config correct data with async mode.' ,
) ;
return mergedData . slice ( ( current - 1 ) * pageSize , current * pageSize ) ;
}
return mergedData ;
}
return mergedData . slice ( ( current - 1 ) * pageSize , current * pageSize ) ;
} , [
! ! pagination ,
mergedData ,
mergedPagination && mergedPagination . current ,
mergedPagination && mergedPagination . pageSize ,
mergedPagination && mergedPagination . total ,
] ) ;
// ========================== Selections ==========================
2023-03-03 14:56:12 +08:00
const [ transformSelectionColumns , selectedKeySet ] = useSelection < RecordType > (
{
prefixCls ,
data : mergedData ,
pageData ,
getRowKey ,
getRecordByKey ,
expandType ,
childrenColumnName ,
locale : tableLocale ,
getPopupContainer : getPopupContainer || getContextPopupContainer ,
} ,
rowSelection ,
) ;
2023-01-07 21:21:52 +08:00
const internalRowClassName = ( record : RecordType , index : number , indent : number ) = > {
let mergedRowClassName : string ;
if ( typeof rowClassName === 'function' ) {
mergedRowClassName = classNames ( rowClassName ( record , index , indent ) ) ;
} else {
mergedRowClassName = classNames ( rowClassName ) ;
}
return classNames (
{
[ ` ${ prefixCls } -row-selected ` ] : selectedKeySet . has ( getRowKey ( record , index ) ) ,
} ,
mergedRowClassName ,
) ;
} ;
// ========================== Expandable ==========================
// Pass origin render status into `rc-table`, this can be removed when refactor with `rc-table`
( mergedExpandable as any ) . __PARENT_RENDER_ICON__ = mergedExpandable . expandIcon ;
// Customize expandable icon
mergedExpandable . expandIcon =
mergedExpandable . expandIcon || expandIcon || renderExpandIcon ( tableLocale ! ) ;
// Adjust expand icon index, no overwrite expandIconColumnIndex if set.
if ( expandType === 'nest' && mergedExpandable . expandIconColumnIndex === undefined ) {
mergedExpandable . expandIconColumnIndex = rowSelection ? 1 : 0 ;
} else if ( mergedExpandable . expandIconColumnIndex ! > 0 && rowSelection ) {
mergedExpandable . expandIconColumnIndex ! -= 1 ;
}
// Indent size
if ( typeof mergedExpandable . indentSize !== 'number' ) {
mergedExpandable . indentSize = typeof indentSize === 'number' ? indentSize : 15 ;
}
// ============================ Render ============================
const transformColumns = React . useCallback (
( innerColumns : ColumnsType < RecordType > ) : ColumnsType < RecordType > = >
transformTitleColumns (
transformSelectionColumns ( transformFilterColumns ( transformSorterColumns ( innerColumns ) ) ) ,
) ,
[ transformSorterColumns , transformFilterColumns , transformSelectionColumns ] ,
) ;
let topPaginationNode : React.ReactNode ;
let bottomPaginationNode : React.ReactNode ;
if ( pagination !== false && mergedPagination ? . total ) {
let paginationSize : TablePaginationConfig [ 'size' ] ;
if ( mergedPagination . size ) {
paginationSize = mergedPagination . size ;
} else {
paginationSize = mergedSize === 'small' || mergedSize === 'middle' ? 'small' : undefined ;
}
const renderPagination = ( position : string ) = > (
< Pagination
{ . . . mergedPagination }
className = { classNames (
` ${ prefixCls } -pagination ${ prefixCls } -pagination- ${ position } ` ,
mergedPagination . className ,
) }
size = { paginationSize }
/ >
) ;
const defaultPosition = direction === 'rtl' ? 'left' : 'right' ;
const { position } = mergedPagination ;
if ( position !== null && Array . isArray ( position ) ) {
const topPos = position . find ( ( p ) = > p . includes ( 'top' ) ) ;
const bottomPos = position . find ( ( p ) = > p . includes ( 'bottom' ) ) ;
const isDisable = position . every ( ( p ) = > ` ${ p } ` === 'none' ) ;
if ( ! topPos && ! bottomPos && ! isDisable ) {
bottomPaginationNode = renderPagination ( defaultPosition ) ;
}
if ( topPos ) {
2023-03-25 13:59:21 +08:00
topPaginationNode = renderPagination ( topPos . toLowerCase ( ) . replace ( 'top' , '' ) ) ;
2023-01-07 21:21:52 +08:00
}
if ( bottomPos ) {
2023-03-25 13:59:21 +08:00
bottomPaginationNode = renderPagination ( bottomPos . toLowerCase ( ) . replace ( 'bottom' , '' ) ) ;
2023-01-07 21:21:52 +08:00
}
} else {
bottomPaginationNode = renderPagination ( defaultPosition ) ;
}
}
// >>>>>>>>> Spinning
let spinProps : SpinProps | undefined ;
if ( typeof loading === 'boolean' ) {
spinProps = {
spinning : loading ,
} ;
} else if ( typeof loading === 'object' ) {
spinProps = {
spinning : true ,
. . . loading ,
} ;
}
const wrapperClassNames = classNames (
2023-12-14 14:58:53 +08:00
cssVarCls ,
2023-11-17 13:46:41 +08:00
rootCls ,
2023-01-07 21:21:52 +08:00
` ${ prefixCls } -wrapper ` ,
2023-06-30 20:42:43 +08:00
table ? . className ,
2023-01-07 21:21:52 +08:00
{
[ ` ${ prefixCls } -wrapper-rtl ` ] : direction === 'rtl' ,
} ,
className ,
2023-01-20 11:03:50 +08:00
rootClassName ,
2023-01-07 21:21:52 +08:00
hashId ,
) ;
2023-01-09 10:04:35 +08:00
2023-06-30 20:42:43 +08:00
const mergedStyle : React.CSSProperties = { . . . table ? . style , . . . style } ;
2023-01-09 10:04:35 +08:00
const emptyText = ( locale && locale . emptyText ) || renderEmpty ? . ( 'Table' ) || (
< DefaultRenderEmpty componentName = "Table" / >
) ;
2023-08-28 17:36:23 +08:00
// ========================== Render ==========================
const TableComponent = virtual ? RcVirtualTable : RcTable ;
// >>> Virtual Table props. We set height here since it will affect height collection
const virtualProps : { listItemHeight? : number } = { } ;
const listItemHeight = React . useMemo ( ( ) = > {
const { fontSize , lineHeight , padding , paddingXS , paddingSM } = token ;
const fontHeight = Math . floor ( fontSize * lineHeight ) ;
switch ( mergedSize ) {
case 'large' :
return padding * 2 + fontHeight ;
case 'small' :
return paddingXS * 2 + fontHeight ;
default :
return paddingSM * 2 + fontHeight ;
}
} , [ token , mergedSize ] ) ;
if ( virtual ) {
virtualProps . listItemHeight = listItemHeight ;
}
2023-11-17 13:46:41 +08:00
return wrapCSSVar (
2023-10-11 13:55:20 +08:00
< div ref = { rootRef } className = { wrapperClassNames } style = { mergedStyle } >
2023-01-07 21:21:52 +08:00
< Spin spinning = { false } { ...spinProps } >
{ topPaginationNode }
2023-08-28 17:36:23 +08:00
< TableComponent
{ . . . virtualProps }
2023-01-07 21:21:52 +08:00
{ . . . tableProps }
2023-10-11 13:55:20 +08:00
ref = { tblRef }
2023-01-07 21:21:52 +08:00
columns = { mergedColumns as RcTableProps < RecordType > [ 'columns' ] }
direction = { direction }
expandable = { mergedExpandable }
prefixCls = { prefixCls }
2023-11-22 20:53:48 +08:00
className = { classNames (
{
[ ` ${ prefixCls } -middle ` ] : mergedSize === 'middle' ,
[ ` ${ prefixCls } -small ` ] : mergedSize === 'small' ,
[ ` ${ prefixCls } -bordered ` ] : bordered ,
[ ` ${ prefixCls } -empty ` ] : rawData . length === 0 ,
} ,
2023-12-14 14:58:53 +08:00
cssVarCls ,
2023-11-22 20:53:48 +08:00
rootCls ,
hashId ,
) }
2023-01-07 21:21:52 +08:00
data = { pageData }
rowKey = { getRowKey }
rowClassName = { internalRowClassName }
2023-01-09 10:04:35 +08:00
emptyText = { emptyText }
2023-01-07 21:21:52 +08:00
// Internal
internalHooks = { INTERNAL_HOOKS }
internalRefs = { internalRefs as any }
transformColumns = { transformColumns as RcTableProps < RecordType > [ 'transformColumns' ] }
2023-09-13 17:53:54 +08:00
getContainerWidth = { getContainerWidth }
2023-01-07 21:21:52 +08:00
/ >
{ bottomPaginationNode }
< / Spin >
< / div > ,
) ;
2023-04-06 17:16:27 +08:00
} ;
2023-01-07 21:21:52 +08:00
2024-01-16 14:02:31 +08:00
export default React . forwardRef ( InternalTable ) as RefInternalTable ;