@tanstack/angular-table 9.0.0-beta.3 → 9.0.0-beta.31

package/src/helpers/createTableHook.ts

@@ -314,16 +314,16 @@ export type CreateTableHookResult<
     THeaderComponents
   >
   injectTableContext: <TData extends RowData = RowData>() => Signal<
-    AngularTable<TFeatures, TData>
+    AngularTable<TFeatures, TData> & TTableComponents
   >
   injectTableHeaderContext: <
     TValue extends CellData = CellData,
     TRowData extends RowData = RowData,
-  >() => Signal<Header<TFeatures, TRowData, TValue>>
+  >() => Signal<Header<TFeatures, TRowData, TValue> & THeaderComponents>
   injectTableCellContext: <
     TValue extends CellData = CellData,
     TRowData extends RowData = RowData,
-  >() => Signal<Cell<TFeatures, TRowData, TValue>>
+  >() => Signal<Cell<TFeatures, TRowData, TValue> & TCellComponents>
   injectFlexRenderHeaderContext: <
     TData extends RowData,
     TValue extends CellData,
@@ -333,10 +333,7 @@ export type CreateTableHookResult<
     TValue extends CellData,
   >() => CellContext<TFeatures, TData, TValue>
   injectAppTable: <TData extends RowData>(
-    tableOptions: () => Omit<
-      TableOptions<TFeatures, TData>,
-      'features' | 'rowModels'
-    >,
+    tableOptions: () => Omit<TableOptions<TFeatures, TData>, 'features'>,
   ) => AppAngularTable<
     TFeatures,
     TData,
@@ -358,7 +355,6 @@ export type CreateTableHookResult<
  * ```ts
  * const { injectAppTable, createAppColumnHelper } = createTableHook({
  *   features,
- *   rowModels: {},
  *   tableComponents: {},
  *   cellComponents: {},
  *   headerComponents: {},
@@ -387,23 +383,46 @@ export function createTableHook<
   THeaderComponents
 > {
   function injectTableContext<TData extends RowData = RowData>(): Signal<
-    AngularTable<TFeatures, TData>
+    AngularTable<TFeatures, TData> & TTableComponents
   > {
-    return _injectTableContext<TFeatures, TData>()
+    // `injectAppTable` Object.assign-es `tableComponents` onto the same table
+    // instance it returns (via `constructTableAPIs`), and that instance is what
+    // gets provided to DI, so this asserts the runtime shape.
+    return _injectTableContext<TFeatures, TData>() as unknown as Signal<
+      AngularTable<TFeatures, TData> & TTableComponents
+    >
   }
 
   function injectTableHeaderContext<
     TValue extends CellData = CellData,
     TRowData extends RowData = RowData,
-  >(): Signal<Header<TFeatures, TRowData, TValue>> {
-    return _injectTableHeaderContext<TFeatures, TRowData, TValue>()
+  >(): Signal<Header<TFeatures, TRowData, TValue> & THeaderComponents> {
+    // `injectAppTable` Object.assign-es `headerComponents` onto the header
+    // prototype (via `assignHeaderPrototype`), so every header instance carries
+    // them. This asserts the runtime shape.
+    return _injectTableHeaderContext<
+      TFeatures,
+      TRowData,
+      TValue
+    >() as unknown as Signal<
+      Header<TFeatures, TRowData, TValue> & THeaderComponents
+    >
   }
 
   function injectTableCellContext<
     TValue extends CellData = CellData,
     TRowData extends RowData = RowData,
-  >(): Signal<Cell<TFeatures, TRowData, TValue>> {
-    return _injectTableCellContext<TFeatures, TRowData, TValue>()
+  >(): Signal<Cell<TFeatures, TRowData, TValue> & TCellComponents> {
+    // `injectAppTable` Object.assign-es `cellComponents` onto the cell prototype
+    // (via `assignCellPrototype`), so every cell instance carries them. This
+    // asserts the runtime shape.
+    return _injectTableCellContext<
+      TFeatures,
+      TRowData,
+      TValue
+    >() as unknown as Signal<
+      Cell<TFeatures, TRowData, TValue> & TCellComponents
+    >
   }
 
   function injectFlexRenderHeaderContext<
@@ -424,10 +443,7 @@ export function createTableHook<
     TData extends RowData,
     TSelected = TableState<TFeatures>,
   >(
-    tableOptions: () => Omit<
-      TableOptions<TFeatures, TData>,
-      'features' | 'rowModels'
-    >,
+    tableOptions: () => Omit<TableOptions<TFeatures, TData>, 'features'>,
   ): AppAngularTable<
     TFeatures,
     TData,
@@ -447,7 +463,7 @@ export function createTableHook<
       return footer as Header<TFeatures, TData, any> & THeaderComponents
     }
 
-    const appTableFeatures: TableFeature<{}> = {
+    const appTableFeatures: TableFeature = {
       constructTableAPIs: (table) => {
         Object.assign(table, tableComponents, { appCell, appHeader, appFooter })
       },
@@ -467,8 +483,14 @@ export function createTableHook<
           ...defaultTableOptions.features,
           appTableFeatures,
         },
-      } as TableOptions<TFeatures, TData>
-    }) as AngularTable<any, any>
+      } as unknown as TableOptions<TFeatures, TData>
+    }) as unknown as AppAngularTable<
+      TFeatures,
+      TData,
+      TTableComponents,
+      TCellComponents,
+      THeaderComponents
+    >
   }
 
   function createAppColumnHelper<TData extends RowData>(): AppColumnHelper<

package/src/helpers/header.ts

@@ -23,7 +23,7 @@ export interface TanStackTableHeaderContext<
  * This token is provided by the {@link TanStackTableHeader} directive.
  */
 export const TanStackTableHeaderToken = new InjectionToken<
-  TanStackTableHeaderContext<any, any, any>['header']
+  TanStackTableHeaderContext<TableFeatures, RowData, CellData>['header']
 >('[TanStack Table] HeaderContext')
 
 /**
@@ -95,5 +95,7 @@ export function injectTableHeaderContext<
   TData extends RowData,
   TValue extends CellData,
 >(): TanStackTableHeaderContext<TFeatures, TData, TValue>['header'] {
-  return inject(TanStackTableHeaderToken)
+  return inject(
+    TanStackTableHeaderToken,
+  ) as unknown as TanStackTableHeaderContext<TFeatures, TData, TValue>['header']
 }

package/src/helpers/table.ts

@@ -9,7 +9,7 @@ import type { Signal } from '@angular/core'
  * This token is provided by the {@link TanStackTable} directive.
  */
 export const TanStackTableToken = new InjectionToken<
-  Signal<AngularTable<any, any>>
+  Signal<AngularTable<TableFeatures, RowData>>
 >('[TanStack Table] Table Context')
 
 /**
@@ -81,5 +81,7 @@ export function injectTableContext<
   TFeatures extends TableFeatures,
   TData extends RowData,
 >(): Signal<AngularTable<TFeatures, TData>> {
-  return inject(TanStackTableToken)
+  return inject(TanStackTableToken) as unknown as Signal<
+    AngularTable<TFeatures, TData>
+  >
 }

package/src/injectTable.ts

@@ -15,7 +15,6 @@ import type {
   Table,
   TableFeatures,
   TableOptions,
-  TableState,
 } from '@tanstack/table-core'
 import type {
   Atom,
@@ -33,70 +32,7 @@ export type SubscribeSource<TValue> =
 export type AngularTable<
   TFeatures extends TableFeatures,
   TData extends RowData,
-> = Table<TFeatures, TData> & {
-  /**
-   * @deprecated Prefer `table.atoms.<slice>.get()` for template/render reads
-   * of a specific state slice, `table.state` for full-state debug snapshots, or
-   * Angular computed values around explicit selectors. `table.store.state` is a
-   * current-value snapshot and is easy to misuse in render code.
-   */
-  readonly store: Table<TFeatures, TData>['store']
-  /**
-   * The current table state exposed as a flat proxy. Prefer
-   * `table.atoms.<slice>.get()` when reading a specific slice.
-   */
-  readonly state: Readonly<TableState<TFeatures>>
-}
-
-function createStateProxy<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
->(table: Table<TFeatures, TData>): Readonly<TableState<TFeatures>> {
-  const getSnapshot = () => {
-    const snapshot = {} as TableState<TFeatures>
-    const stateKeys = Object.keys(table.initialState) as Array<
-      string & keyof TableState<TFeatures>
-    >
-
-    for (const key of stateKeys) {
-      ;(snapshot as Record<string, unknown>)[key] = table.atoms[key].get()
-    }
-
-    return snapshot
-  }
-
-  const target = {} as TableState<TFeatures>
-
-  return new Proxy(target, {
-    get(target, prop, receiver) {
-      if (prop === 'toJSON') {
-        return getSnapshot
-      }
-
-      if (typeof prop === 'string' && prop in table.initialState) {
-        return table.atoms[prop as keyof TableState<TFeatures>]?.get()
-      }
-
-      return Reflect.get(target, prop, receiver)
-    },
-    has(_, prop) {
-      return typeof prop === 'string' && prop in table.initialState
-    },
-    ownKeys() {
-      return Reflect.ownKeys(table.initialState)
-    },
-    getOwnPropertyDescriptor(_, prop) {
-      if (typeof prop !== 'string' || !(prop in table.initialState)) {
-        return undefined
-      }
-
-      return {
-        enumerable: true,
-        configurable: true,
-      }
-    },
-  })
-}
+> = Table<TFeatures, TData>
 
 /**
  * Creates and returns an Angular-reactive table instance.
@@ -166,28 +102,21 @@ export function injectTable<
 
   return ngZone.runOutsideAngular(() =>
     lazyInit(() => {
-      const table = constructTable({
+      // Explicit type arguments skip generic inference from the spread object
+      // (a type-check hot spot); the spread only adds the angular reactivity
+      // binding to `features`.
+      const table = constructTable<TFeatures, TData>({
         ...options(),
         features: {
-          coreReativityFeature: angularReactivity(injector),
+          coreReactivityFeature: angularReactivity(injector),
           ...options().features,
         },
-      }) as AngularTable<TFeatures, TData>
+      })
 
       injector.get(DestroyRef).onDestroy(() => {
         table._reactivity.unmount?.()
       })
 
-      const stateProxy = createStateProxy(table)
-
-      Object.defineProperty(table, 'state', {
-        get() {
-          return stateProxy
-        },
-        configurable: true,
-        enumerable: true,
-      })
-
       let isMount = true
       effect(
         () => {