Sha256: d00c6e8e2e82828ab4e7ff63deb5b13c6d9c8c54f356bcfd911355292f765e8d
Contents?: true
Size: 1.5 KB
Versions: 30
Compression:
Stored size: 1.5 KB
Contents
import React, { useContext } from "react"
import { HeaderGroup } from "@tanstack/react-table"
import AdvancedTableContext from "../Context/AdvancedTableContext"
import { TableHeaderCell } from "../Components/TableHeaderCell"
import { DataType } from "../Utilities/types"
type TableHeaderProps = {
children?: React.ReactNode | React.ReactNode[]
enableSorting?: boolean
headerId?: string
sortIcon?: string | string[]
}
export const TableHeader = ({
children,
enableSorting = false,
headerId,
sortIcon = ["arrow-up-short-wide", "arrow-down-short-wide"],
}: TableHeaderProps) => {
const {
enableToggleExpansion,
handleExpandOrCollapse,
loading,
table,
} = useContext(AdvancedTableContext)
return (
<>
<thead>
{/* Get the header groups (only one in this example) */}
{table.getHeaderGroups().map((headerGroup: HeaderGroup<DataType>) => (
<tr key={`${headerGroup.id}-headerGroup`}>
{headerGroup.headers.map(header => (
<TableHeaderCell
enableSorting={enableSorting}
enableToggleExpansion={enableToggleExpansion}
handleExpandOrCollapse={handleExpandOrCollapse}
header={header}
headerChildren={children}
headerId={headerId}
key={`${header.id}-header`}
loading={loading}
sortIcon={sortIcon}
/>
))}
</tr>
))}
</thead>
</>
)
}
Version data entries
30 entries across 30 versions & 1 rubygems