Interface: TableComponents<Data, Context>
Customize the TableVirtuoso rendering by passing a set of custom components.
Type parameters
Name | Type |
---|---|
Data | unknown |
Context | unknown |
Properties
Table
• Optional
Table: ComponentType
<TableProps
& { context?
: Context
}>
Set to customize the wrapping table
element.
TableHead
• Optional
TableHead: ComponentType
<Pick
<DetailedHTMLProps
<HTMLAttributes
<HTMLTableSectionElement
>, HTMLTableSectionElement
>, "style"
| "children"
> & { context?
: Context
} & RefAttributes
<HTMLTableSectionElement
>>
Set to render a fixed header at the top of the table (thead
). use [[fixedHeaderContent]] to set the contents
TableFoot
• Optional
TableFoot: ComponentType
<Pick
<DetailedHTMLProps
<HTMLAttributes
<HTMLTableSectionElement
>, HTMLTableSectionElement
>, "style"
| "children"
> & { context?
: Context
} & RefAttributes
<HTMLTableSectionElement
>>
Set to render a fixed footer at the bottom of the table (tfoot
). use [[fixedFooterContent]] to set the contents
TableRow
• Optional
TableRow: ComponentType
<Pick
<DetailedHTMLProps
<HTMLAttributes
<HTMLDivElement
>, HTMLDivElement
>, "style"
| "children"
> & { data-index
: number
; data-item-index
: number
; data-item-group-index?
: number
; data-known-size
: number
; item
: Data
} & { context?
: Context
}>
Set to customize the item wrapping element. Default is tr
.
Scroller
• Optional
Scroller: ComponentType
<Pick
<DetailedHTMLProps
<HTMLAttributes
<HTMLDivElement
>, HTMLDivElement
>, "style"
| "children"
| "tabIndex"
> & { data-testid?
: string
; data-virtuoso-scroller?
: boolean
} & RefAttributes
<HTMLDivElement
> & { context?
: Context
}>
Set to customize the outermost scrollable element. This should not be necessary in general, as the component passes its HTML attribute props to it.
TableBody
• Optional
TableBody: ComponentType
<Pick
<DetailedHTMLProps
<HTMLAttributes
<HTMLTableSectionElement
>, HTMLTableSectionElement
>, "className"
| "style"
| "children"
> & { data-testid
: string
} & RefAttributes
<HTMLTableSectionElement
> & { context?
: Context
}>
Set to customize the items wrapper. Default is tbody
.
EmptyPlaceholder
• Optional
EmptyPlaceholder: ComponentType
<{ context?
: Context
}>
Set to render a custom UI when the list is empty.
ScrollSeekPlaceholder
• Optional
ScrollSeekPlaceholder: ComponentType
<ScrollSeekPlaceholderProps
& { context?
: Context
}>
Set to render an item placeholder when the user scrolls fast. See the scrollSeek
property for more details.
FillerRow
• Optional
FillerRow: ComponentType
<FillerRowProps
& { context?
: Context
}>
Set to render an empty item placeholder.