diff --git a/.changeset/bound-aggregated-cell-components.md b/.changeset/bound-aggregated-cell-components.md new file mode 100644 index 0000000000..60c714665c --- /dev/null +++ b/.changeset/bound-aggregated-cell-components.md @@ -0,0 +1,12 @@ +--- +'@tanstack/angular-table': patch +'@tanstack/lit-table': patch +'@tanstack/octane-table': patch +'@tanstack/preact-table': patch +'@tanstack/react-table': patch +'@tanstack/solid-table': patch +'@tanstack/svelte-table': patch +'@tanstack/vue-table': patch +--- + +Type `aggregatedCell` against bound `cellComponents` in `createAppColumnHelper`, matching `cell`. diff --git a/packages/angular-table/src/helpers/createTableHook.ts b/packages/angular-table/src/helpers/createTableHook.ts index 3c6bcd7cf6..9a98f043fe 100644 --- a/packages/angular-table/src/helpers/createTableHook.ts +++ b/packages/angular-table/src/helpers/createTableHook.ts @@ -85,7 +85,8 @@ export type AppColumnDefTemplate = string | ((props: TProps) => any) /** - * Enhanced column definition base with pre-bound components in cell/header/footer contexts. + * Enhanced column definition base with pre-bound components in + * cell/aggregatedCell/header/footer contexts. */ export type AppColumnDefBase< TFeatures extends TableFeatures, @@ -95,11 +96,14 @@ export type AppColumnDefBase< THeaderComponents extends Record, > = Omit< IdentifiedColumnDef, - 'cell' | 'header' | 'footer' + 'cell' | 'aggregatedCell' | 'header' | 'footer' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > @@ -118,11 +122,14 @@ export type AppDisplayColumnDef< THeaderComponents extends Record, > = Omit< DisplayColumnDef, - 'cell' | 'header' | 'footer' + 'cell' | 'aggregatedCell' | 'header' | 'footer' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > @@ -141,11 +148,14 @@ export type AppGroupColumnDef< THeaderComponents extends Record, > = Omit< GroupColumnDef, - 'cell' | 'header' | 'footer' | 'columns' + 'cell' | 'aggregatedCell' | 'header' | 'footer' | 'columns' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > diff --git a/packages/lit-table/src/createTableHook.ts b/packages/lit-table/src/createTableHook.ts index 358a94ab23..3104287b4e 100644 --- a/packages/lit-table/src/createTableHook.ts +++ b/packages/lit-table/src/createTableHook.ts @@ -92,7 +92,8 @@ export type AppColumnDefTemplate = string | ((props: TProps) => any) /** - * Enhanced column definition base with pre-bound components in cell/header/footer contexts. + * Enhanced column definition base with pre-bound components in + * cell/aggregatedCell/header/footer contexts. */ export type AppColumnDefBase< TFeatures extends TableFeatures, @@ -102,11 +103,14 @@ export type AppColumnDefBase< THeaderComponents extends Record>, > = Omit< IdentifiedColumnDef, - 'cell' | 'header' | 'footer' + 'cell' | 'aggregatedCell' | 'header' | 'footer' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > @@ -125,11 +129,14 @@ export type AppDisplayColumnDef< THeaderComponents extends Record>, > = Omit< DisplayColumnDef, - 'cell' | 'header' | 'footer' + 'cell' | 'aggregatedCell' | 'header' | 'footer' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > @@ -148,11 +155,14 @@ export type AppGroupColumnDef< THeaderComponents extends Record>, > = Omit< GroupColumnDef, - 'cell' | 'header' | 'footer' | 'columns' + 'cell' | 'aggregatedCell' | 'header' | 'footer' | 'columns' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > diff --git a/packages/octane-table/src/types.ts b/packages/octane-table/src/types.ts index abd05b4e7a..14352be0d4 100644 --- a/packages/octane-table/src/types.ts +++ b/packages/octane-table/src/types.ts @@ -377,7 +377,7 @@ export type AppColumnDefTemplate = /** * Enhanced column definition base with pre-bound components in - * cell/header/footer contexts. + * cell/aggregatedCell/header/footer contexts. */ export type AppColumnDefBase< TFeatures extends TableFeatures, @@ -387,11 +387,14 @@ export type AppColumnDefBase< THeaderComponents extends Record, > = Omit< IdentifiedColumnDef, - 'cell' | 'header' | 'footer' + 'cell' | 'aggregatedCell' | 'header' | 'footer' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > @@ -410,11 +413,14 @@ export type AppDisplayColumnDef< THeaderComponents extends Record, > = Omit< DisplayColumnDef, - 'cell' | 'header' | 'footer' + 'cell' | 'aggregatedCell' | 'header' | 'footer' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > @@ -433,11 +439,14 @@ export type AppGroupColumnDef< THeaderComponents extends Record, > = Omit< GroupColumnDef, - 'cell' | 'header' | 'footer' | 'columns' + 'cell' | 'aggregatedCell' | 'header' | 'footer' | 'columns' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > diff --git a/packages/preact-table/src/createTableHook.tsx b/packages/preact-table/src/createTableHook.tsx index 1702aa9b18..d959758055 100644 --- a/packages/preact-table/src/createTableHook.tsx +++ b/packages/preact-table/src/createTableHook.tsx @@ -84,7 +84,8 @@ export type AppColumnDefTemplate = string | ((props: TProps) => any) /** - * Enhanced column definition base with pre-bound components in cell/header/footer contexts. + * Enhanced column definition base with pre-bound components in + * cell/aggregatedCell/header/footer contexts. */ export type AppColumnDefBase< TFeatures extends TableFeatures, @@ -94,11 +95,14 @@ export type AppColumnDefBase< THeaderComponents extends Record>, > = Omit< IdentifiedColumnDef, - 'cell' | 'header' | 'footer' + 'cell' | 'aggregatedCell' | 'header' | 'footer' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > @@ -117,11 +121,14 @@ export type AppDisplayColumnDef< THeaderComponents extends Record>, > = Omit< DisplayColumnDef, - 'cell' | 'header' | 'footer' + 'cell' | 'aggregatedCell' | 'header' | 'footer' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > @@ -140,11 +147,14 @@ export type AppGroupColumnDef< THeaderComponents extends Record>, > = Omit< GroupColumnDef, - 'cell' | 'header' | 'footer' | 'columns' + 'cell' | 'aggregatedCell' | 'header' | 'footer' | 'columns' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > diff --git a/packages/react-table/src/createTableHook.tsx b/packages/react-table/src/createTableHook.tsx index cceefdb70a..12040603b6 100644 --- a/packages/react-table/src/createTableHook.tsx +++ b/packages/react-table/src/createTableHook.tsx @@ -87,7 +87,8 @@ export type AppColumnDefTemplate = string | ((props: TProps) => any) /** - * Enhanced column definition base with pre-bound components in cell/header/footer contexts. + * Enhanced column definition base with pre-bound components in + * cell/aggregatedCell/header/footer contexts. */ export type AppColumnDefBase< TFeatures extends TableFeatures, @@ -97,11 +98,14 @@ export type AppColumnDefBase< THeaderComponents extends Record>, > = Omit< IdentifiedColumnDef, - 'cell' | 'header' | 'footer' + 'cell' | 'aggregatedCell' | 'header' | 'footer' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > @@ -120,11 +124,14 @@ export type AppDisplayColumnDef< THeaderComponents extends Record>, > = Omit< DisplayColumnDef, - 'cell' | 'header' | 'footer' + 'cell' | 'aggregatedCell' | 'header' | 'footer' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > @@ -143,11 +150,14 @@ export type AppGroupColumnDef< THeaderComponents extends Record>, > = Omit< GroupColumnDef, - 'cell' | 'header' | 'footer' | 'columns' + 'cell' | 'aggregatedCell' | 'header' | 'footer' | 'columns' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > diff --git a/packages/react-table/tests/createAppColumnHelper.test-d.tsx b/packages/react-table/tests/createAppColumnHelper.test-d.tsx new file mode 100644 index 0000000000..e53435feda --- /dev/null +++ b/packages/react-table/tests/createAppColumnHelper.test-d.tsx @@ -0,0 +1,57 @@ +// Type-level tests for `createAppColumnHelper`, checked by `test:types` (tsc). +// Not executed by vitest (the `.test-d.` name is excluded from its run glob). + +import * as React from 'react' +import { rowAggregationFeature, tableFeatures } from '@tanstack/table-core' +import { createTableHook, createTableHookContexts } from '../src' + +type Person = { + id: string + name: string +} + +const features = tableFeatures({ + rowAggregationFeature, +}) +const contexts = createTableHookContexts() + +function NameCell() { + const cell = contexts.useCellContext() + + return {cell.getValue().toUpperCase()} +} + +const appTable = createTableHook({ + features, + tableContext: contexts.tableContext, + cellContext: contexts.cellContext, + headerContext: contexts.headerContext, + cellComponents: { NameCell }, +}) +const columnHelper = appTable.createAppColumnHelper() + +columnHelper.accessor('name', { + id: 'name', + // The bound `cellComponents` are available on the cell context here... + cell: ({ cell }) => , + // ...and must be equally available on the aggregatedCell context. + aggregatedCell: ({ cell }) => , +}) + +columnHelper.display({ + id: 'display', + cell: ({ cell }) => , + aggregatedCell: ({ cell }) => , +}) + +columnHelper.group({ + id: 'group', + aggregatedCell: ({ cell }) => , + columns: [], +}) + +columnHelper.accessor('name', { + id: 'guard', + // @ts-expect-error a component that was not registered is not bound + aggregatedCell: ({ cell }) => , +}) diff --git a/packages/solid-table/src/createTableHook.tsx b/packages/solid-table/src/createTableHook.tsx index 3ba4f71320..53e9dba99c 100644 --- a/packages/solid-table/src/createTableHook.tsx +++ b/packages/solid-table/src/createTableHook.tsx @@ -79,7 +79,8 @@ export type AppColumnDefTemplate = string | ((props: TProps) => any) /** - * Enhanced column definition base with pre-bound components in cell/header/footer contexts. + * Enhanced column definition base with pre-bound components in + * cell/aggregatedCell/header/footer contexts. */ export type AppColumnDefBase< TFeatures extends TableFeatures, @@ -89,11 +90,14 @@ export type AppColumnDefBase< THeaderComponents extends Record>, > = Omit< IdentifiedColumnDef, - 'cell' | 'header' | 'footer' + 'cell' | 'aggregatedCell' | 'header' | 'footer' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > @@ -112,11 +116,14 @@ export type AppDisplayColumnDef< THeaderComponents extends Record>, > = Omit< DisplayColumnDef, - 'cell' | 'header' | 'footer' + 'cell' | 'aggregatedCell' | 'header' | 'footer' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > @@ -135,11 +142,14 @@ export type AppGroupColumnDef< THeaderComponents extends Record>, > = Omit< GroupColumnDef, - 'cell' | 'header' | 'footer' | 'columns' + 'cell' | 'aggregatedCell' | 'header' | 'footer' | 'columns' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > diff --git a/packages/svelte-table/src/createTableHook.svelte.ts b/packages/svelte-table/src/createTableHook.svelte.ts index a3f282f235..5666023e9e 100644 --- a/packages/svelte-table/src/createTableHook.svelte.ts +++ b/packages/svelte-table/src/createTableHook.svelte.ts @@ -88,7 +88,8 @@ export type AppColumnDefTemplate = string | ((props: TProps) => any) /** - * Enhanced column definition base with pre-bound components in cell/header/footer contexts. + * Enhanced column definition base with pre-bound components in + * cell/aggregatedCell/header/footer contexts. */ export type AppColumnDefBase< TFeatures extends TableFeatures, @@ -98,11 +99,14 @@ export type AppColumnDefBase< THeaderComponents extends Record>, > = Omit< IdentifiedColumnDef, - 'cell' | 'header' | 'footer' + 'cell' | 'aggregatedCell' | 'header' | 'footer' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > @@ -121,11 +125,14 @@ export type AppDisplayColumnDef< THeaderComponents extends Record>, > = Omit< DisplayColumnDef, - 'cell' | 'header' | 'footer' + 'cell' | 'aggregatedCell' | 'header' | 'footer' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > @@ -144,11 +151,14 @@ export type AppGroupColumnDef< THeaderComponents extends Record>, > = Omit< GroupColumnDef, - 'cell' | 'header' | 'footer' | 'columns' + 'cell' | 'aggregatedCell' | 'header' | 'footer' | 'columns' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > diff --git a/packages/vue-table/src/createTableHook.ts b/packages/vue-table/src/createTableHook.ts index 96281a9a78..156c32a009 100644 --- a/packages/vue-table/src/createTableHook.ts +++ b/packages/vue-table/src/createTableHook.ts @@ -68,11 +68,14 @@ export type AppColumnDefBase< THeaderComponents extends Record>, > = Omit< IdentifiedColumnDef, - 'cell' | 'header' | 'footer' + 'cell' | 'aggregatedCell' | 'header' | 'footer' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > @@ -88,11 +91,14 @@ export type AppDisplayColumnDef< THeaderComponents extends Record>, > = Omit< DisplayColumnDef, - 'cell' | 'header' | 'footer' + 'cell' | 'aggregatedCell' | 'header' | 'footer' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext > @@ -108,11 +114,14 @@ export type AppGroupColumnDef< THeaderComponents extends Record>, > = Omit< GroupColumnDef, - 'cell' | 'header' | 'footer' | 'columns' + 'cell' | 'aggregatedCell' | 'header' | 'footer' | 'columns' > & { cell?: AppColumnDefTemplate< AppCellContext > + aggregatedCell?: AppColumnDefTemplate< + AppCellContext + > header?: AppColumnDefTemplate< AppHeaderContext >