diff --git a/examples/erp/genseki/collections/posts.client.tsx b/examples/erp/genseki/collections/posts.client.tsx index 2eed4836..bfaa64fc 100644 --- a/examples/erp/genseki/collections/posts.client.tsx +++ b/examples/erp/genseki/collections/posts.client.tsx @@ -109,6 +109,9 @@ export const columns = [ columnHelper.accessor('author.name', { header: 'Author Name', cell: (info) => info.getValue(), + meta: { + thClassName: 'bg-orange-700', + }, }), columnHelper.accessor('author.email', { header: 'Author Email', diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts index 52694bbd..ce252114 100644 --- a/packages/react/src/index.ts +++ b/packages/react/src/index.ts @@ -1,3 +1,4 @@ export * from './auth' export * from './core' export * from './react' +export type * from './types/tanstack.d.ts' diff --git a/packages/react/src/react/components/primitives/tanstack-table.tsx b/packages/react/src/react/components/primitives/tanstack-table.tsx index 9d8fdaf7..2df3760e 100644 --- a/packages/react/src/react/components/primitives/tanstack-table.tsx +++ b/packages/react/src/react/components/primitives/tanstack-table.tsx @@ -98,7 +98,8 @@ export function TanstackTable({ className={clsx( 'focus-visible:ring-focus ring-inset', header.colSpan > 1 && 'border-bluegray-300 border-b', - classNames?.tableHead + classNames?.tableHead, + header.column.columnDef.meta?.thClassName )} onClick={ canSort && children ? header.column.getToggleSortingHandler() : undefined diff --git a/packages/react/src/types/tanstack.d.ts b/packages/react/src/types/tanstack.d.ts new file mode 100644 index 00000000..c0553d76 --- /dev/null +++ b/packages/react/src/types/tanstack.d.ts @@ -0,0 +1,8 @@ +/* eslint-disable @typescript-eslint/no-unused-vars */ +import '@tanstack/react-table' + +declare module '@tanstack/react-table' { + interface ColumnMeta { + thClassName?: string + } +}