@tanstack/angular-table 8.21.3 → 8.21.4

package/src/flex-render.ts

@@ -15,6 +15,7 @@ import {
   Type,
   ViewContainerRef,
 } from '@angular/core'
+import { memo } from '@tanstack/table-core'
 import { FlexRenderComponentProps } from './flex-render/context'
 import { FlexRenderFlags } from './flex-render/flags'
 import {
@@ -27,9 +28,9 @@ import {
   FlexRenderTemplateView,
   type FlexRenderTypedContent,
   FlexRenderView,
+  FlexRenderViewAllowedType,
   mapToFlexRenderTypedContent,
 } from './flex-render/view'
-import { memo } from '@tanstack/table-core'
 
 export {
   injectFlexRenderContext,
@@ -72,7 +73,10 @@ export class FlexRenderDirective<TProps extends NonNullable<unknown>>
   injector: Injector = inject(Injector)
 
   renderFlags = FlexRenderFlags.ViewFirstRender
-  renderView: FlexRenderView<any> | null = null
+  renderView: FlexRenderView<
+    FlexRenderViewAllowedType,
+    FlexRenderTypedContent
+  > | null = null
 
   readonly #latestContent = () => {
     const { content, props } = this
@@ -83,17 +87,17 @@ export class FlexRenderDirective<TProps extends NonNullable<unknown>>
 
   #getContentValue = memo(
     () => [this.#latestContent(), this.props, this.content],
-    latestContent => {
+    (latestContent) => {
       return mapToFlexRenderTypedContent(latestContent)
     },
-    { key: 'flexRenderContentValue', debug: () => false }
+    { key: 'flexRenderContentValue', debug: () => false },
   )
 
   constructor(
     @Inject(ViewContainerRef)
     private readonly viewContainerRef: ViewContainerRef,
     @Inject(TemplateRef)
-    private readonly templateRef: TemplateRef<any>
+    private readonly templateRef: TemplateRef<any>,
   ) {}
 
   ngOnChanges(changes: SimpleChanges) {
@@ -121,11 +125,14 @@ export class FlexRenderDirective<TProps extends NonNullable<unknown>>
     if (latestContent.kind === 'null' || !this.renderView) {
       this.renderFlags |= FlexRenderFlags.ContentChanged
     } else {
-      this.renderView.content = latestContent
-      const { kind: previousKind } = this.renderView.previousContent
-      if (latestContent.kind !== previousKind) {
+      const { kind: currentKind } = this.renderView.content
+      if (
+        latestContent.kind !== currentKind ||
+        !this.renderView.eq(latestContent)
+      ) {
         this.renderFlags |= FlexRenderFlags.ContentChanged
       }
+      this.renderView.content = latestContent
     }
     this.update()
   }
@@ -190,7 +197,7 @@ export class FlexRenderDirective<TProps extends NonNullable<unknown>>
           // so we'll try to check for updates into ngDoCheck
           this.#changeDetectorRef.markForCheck()
         },
-        { injector: this.viewContainerRef.injector }
+        { injector: this.viewContainerRef.injector },
       )
     }
   }
@@ -204,8 +211,8 @@ export class FlexRenderDirective<TProps extends NonNullable<unknown>>
   }
 
   #renderViewByContent(
-    content: FlexRenderTypedContent
-  ): FlexRenderView<any> | null {
+    content: FlexRenderTypedContent,
+  ): FlexRenderView<FlexRenderViewAllowedType, FlexRenderTypedContent> | null {
     if (content.kind === 'primitive') {
       return this.#renderStringContent(content)
     } else if (content.kind === 'templateRef') {
@@ -220,7 +227,7 @@ export class FlexRenderDirective<TProps extends NonNullable<unknown>>
   }
 
   #renderStringContent(
-    template: Extract<FlexRenderTypedContent, { kind: 'primitive' }>
+    template: Extract<FlexRenderTypedContent, { kind: 'primitive' }>,
   ): FlexRenderTemplateView {
     const context = () => {
       return typeof this.content === 'string' ||
@@ -237,7 +244,7 @@ export class FlexRenderDirective<TProps extends NonNullable<unknown>>
   }
 
   #renderTemplateRefContent(
-    template: Extract<FlexRenderTypedContent, { kind: 'templateRef' }>
+    template: Extract<FlexRenderTypedContent, { kind: 'templateRef' }>,
   ): FlexRenderTemplateView {
     const latestContext = () => this.props
     const view = this.viewContainerRef.createEmbeddedView(template.content, {
@@ -252,7 +259,7 @@ export class FlexRenderDirective<TProps extends NonNullable<unknown>>
     flexRenderComponent: Extract<
       FlexRenderTypedContent,
       { kind: 'flexRenderComponent' }
-    >
+    >,
   ): FlexRenderComponentView {
     const { inputs, outputs, injector } = flexRenderComponent.content
 
@@ -266,20 +273,20 @@ export class FlexRenderDirective<TProps extends NonNullable<unknown>>
     })
     const view = this.#flexRenderComponentFactory.createComponent(
       flexRenderComponent.content,
-      componentInjector
+      componentInjector,
     )
     return new FlexRenderComponentView(flexRenderComponent, view)
   }
 
   #renderCustomComponent(
-    component: Extract<FlexRenderTypedContent, { kind: 'component' }>
+    component: Extract<FlexRenderTypedContent, { kind: 'component' }>,
   ): FlexRenderComponentView {
     const view = this.#flexRenderComponentFactory.createComponent(
       flexRenderComponent(component.content, {
         inputs: this.props,
         injector: this.injector,
       }),
-      this.injector
+      this.injector,
     )
     return new FlexRenderComponentView(component, view)
   }

package/src/index.ts

@@ -26,7 +26,7 @@ export {
 } from './flex-render/flex-render-component'
 
 export function createAngularTable<TData extends RowData>(
-  options: () => TableOptions<TData>
+  options: () => TableOptions<TData>,
 ): Table<TData> & Signal<Table<TData>> {
   return lazyInit(() => {
     const resolvedOptions = {
@@ -53,7 +53,7 @@ export function createAngularTable<TData extends RowData>(
         ...resolvedOptions,
         ...tableOptions,
         state: { ...tableState, ...tableOptions.state },
-        onStateChange: updater => {
+        onStateChange: (updater) => {
           const value =
             updater instanceof Function ? updater(tableState) : updater
           state.set(value)
@@ -70,7 +70,7 @@ export function createAngularTable<TData extends RowData>(
       },
       {
         equal: () => false,
-      }
+      },
     )
 
     // proxify Table instance to provide ability for consumer to listen to any table state changes

package/src/proxy.ts

@@ -4,7 +4,7 @@ import { type Table } from '@tanstack/table-core'
 type TableSignal<T> = Table<T> & Signal<Table<T>>
 
 export function proxifyTable<T>(
-  tableSignal: Signal<Table<T>>
+  tableSignal: Signal<Table<T>>,
 ): Table<T> & Signal<Table<T>> {
   const internalState = tableSignal as TableSignal<T>