Formatted non-intrusive table

This commit is contained in:
Khalim Conn-Kowlessar 2024-04-13 18:59:38 +01:00
parent cab3eae6ef
commit 295660139b
2 changed files with 16 additions and 12 deletions

View file

@ -46,18 +46,20 @@ export default function FeatureTable<
<TableHeader> <TableHeader>
{table.getHeaderGroups().map((headerGroup) => ( {table.getHeaderGroups().map((headerGroup) => (
<TableRow key={headerGroup.id}> <TableRow key={headerGroup.id}>
{headerGroup.headers.map((header) => { {headerGroup.headers.map((header) => (
return ( <TableHead
<TableHead key={header.id}> key={header.id}
{header.isPlaceholder style={{
? null // Style the header to match the column width, if passed
: flexRender( width: `${header.getSize()}px`,
header.column.columnDef.header, }}
header.getContext() >
)} {flexRender(
</TableHead> header.column.columnDef.header,
); header.getContext()
})} )}
</TableHead>
))}
</TableRow> </TableRow>
))} ))}
</TableHeader> </TableHeader>

View file

@ -47,6 +47,7 @@ export const generalColumns: ColumnDef<GeneralFeature>[] = [
{ {
accessorKey: "feature", accessorKey: "feature",
header: "Feature", header: "Feature",
size: 100,
}, },
{ {
accessorKey: "description", accessorKey: "description",
@ -58,6 +59,7 @@ export const nonInstrusiveColumns: ColumnDef<NonInstrusiveFeature>[] = [
{ {
accessorKey: "title", accessorKey: "title",
header: "Feature", header: "Feature",
size: 100,
}, },
{ {
accessorKey: "note", accessorKey: "note",