@tanstack/angular-table 9.0.0-alpha.21 → 9.0.0-alpha.24

package/dist/fesm2022/tanstack-angular-table.mjs

@@ -1,88 +1,9 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, input, inject, Directive, reflectComponentType, TemplateRef, Type, Injectable, KeyValueDiffers, ChangeDetectorRef, OutputEmitterRef, runInInjectionContext, computed, effect, untracked, Injector, ViewContainerRef, DestroyRef, assertInInjectionContext, signal } from '@angular/core';
+import { InjectionToken, input, inject, Directive, reflectComponentType, Injectable, KeyValueDiffers, ChangeDetectorRef, OutputEmitterRef, TemplateRef, Type, runInInjectionContext, computed, effect, untracked, Injector, ViewContainerRef, DestroyRef, assertInInjectionContext, signal } from '@angular/core';
 import { constructReactivityFeature, constructTable, createColumnHelper } from '@tanstack/table-core';
 export * from '@tanstack/table-core';
 import { injectStore } from '@tanstack/angular-store';
 
-/**
- * Injection token that provides access to the current {@link AngularTable} instance.
- *
- * This token is provided by the {@link TanStackTable} directive.
- */
-const TanStackTableToken = new InjectionToken('[TanStack Table] Table Context');
-/**
- * Provides a TanStack Table instance (`AngularTable`) in Angular DI.
- *
- * The table can be injected by:
- * - any descendant of an element using `[tanStackTable]="..."`
- * - any component instantiated by `*flexRender` when the render props contains `table`
- *
- * @example
- * ```html
- * <div [tanStackTable]="table">
- *   <app-pagination />
- * </div>
- * ```
- *
- * ```ts
- * @Component({
- *   selector: 'app-pagination',
- *   template: `
- *     <button (click)="prev()" [disabled]="!table().getCanPreviousPage()">Prev</button>
- *     <button (click)="next()" [disabled]="!table().getCanNextPage()">Next</button>
- *   `,
- * })
- * export class PaginationComponent {
- *   readonly table = injectTableContext()
- *
- *   prev() {
- *     this.table().previousPage()
- *   }
- *   next() {
- *     this.table().nextPage()
- *   }
- * }
- * ```
- */
-class TanStackTable {
-    /**
-     * The current TanStack Table instance.
-     *
-     * Provided as a required signal input so DI consumers always read the latest value.
-     */
-    table = input.required({ ...(ngDevMode ? { debugName: "table" } : {}), alias: 'tanStackTable' });
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TanStackTable, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.1", type: TanStackTable, isStandalone: true, selector: "[tanStackTable]", inputs: { table: { classPropertyName: "table", publicName: "tanStackTable", isSignal: true, isRequired: true, transformFunction: null } }, providers: [
-            {
-                provide: TanStackTableToken,
-                useFactory: () => inject(TanStackTable).table,
-            },
-        ], exportAs: ["table"], ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TanStackTable, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[tanStackTable]',
-                    exportAs: 'table',
-                    providers: [
-                        {
-                            provide: TanStackTableToken,
-                            useFactory: () => inject(TanStackTable).table,
-                        },
-                    ],
-                }]
-        }], propDecorators: { table: [{ type: i0.Input, args: [{ isSignal: true, alias: "tanStackTable", required: true }] }] } });
-/**
- * Injects the current TanStack Table instance signal.
- *
- * Available when:
- * - there is a nearest `[tanStackTable]` directive in the DI tree, or
- * - the caller is rendered via `*flexRender` with render props containing `table`
- */
-function injectTableContext() {
-    return inject(TanStackTableToken);
-}
-
 /**
  * Injection token that provides access to the current cell.
  *
@@ -132,16 +53,16 @@ class TanStackTableCell {
      *
      * Provided as a required signal input so DI consumers always read the latest value.
      */
-    cell = input.required({ ...(ngDevMode ? { debugName: "cell" } : {}), alias: 'tanStackTableCell' });
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TanStackTableCell, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.1", type: TanStackTableCell, isStandalone: true, selector: "[tanStackTableCell]", inputs: { cell: { classPropertyName: "cell", publicName: "tanStackTableCell", isSignal: true, isRequired: true, transformFunction: null } }, providers: [
+    cell = input.required({ ...(ngDevMode ? { debugName: "cell" } : /* istanbul ignore next */ {}), alias: 'tanStackTableCell' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: TanStackTableCell, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.7", type: TanStackTableCell, isStandalone: true, selector: "[tanStackTableCell]", inputs: { cell: { classPropertyName: "cell", publicName: "tanStackTableCell", isSignal: true, isRequired: true, transformFunction: null } }, providers: [
             {
                 provide: TanStackTableCellToken,
                 useFactory: () => inject(TanStackTableCell).cell,
             },
         ], exportAs: ["cell"], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TanStackTableCell, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: TanStackTableCell, decorators: [{
             type: Directive,
             args: [{
                     selector: '[tanStackTableCell]',
@@ -209,16 +130,16 @@ class TanStackTableHeader {
      *
      * Provided as a required signal input so DI consumers always read the latest value.
      */
-    header = input.required({ ...(ngDevMode ? { debugName: "header" } : {}), alias: 'tanStackTableHeader' });
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TanStackTableHeader, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.1", type: TanStackTableHeader, isStandalone: true, selector: "[tanStackTableHeader]", inputs: { header: { classPropertyName: "header", publicName: "tanStackTableHeader", isSignal: true, isRequired: true, transformFunction: null } }, providers: [
+    header = input.required({ ...(ngDevMode ? { debugName: "header" } : /* istanbul ignore next */ {}), alias: 'tanStackTableHeader' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: TanStackTableHeader, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.7", type: TanStackTableHeader, isStandalone: true, selector: "[tanStackTableHeader]", inputs: { header: { classPropertyName: "header", publicName: "tanStackTableHeader", isSignal: true, isRequired: true, transformFunction: null } }, providers: [
             {
                 provide: TanStackTableHeaderToken,
                 useFactory: () => inject(TanStackTableHeader).header,
             },
         ], exportAs: ["header"], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TanStackTableHeader, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: TanStackTableHeader, decorators: [{
             type: Directive,
             args: [{
                     selector: '[tanStackTableHeader]',
@@ -242,6 +163,85 @@ function injectTableHeaderContext() {
     return inject(TanStackTableHeaderToken);
 }
 
+/**
+ * Injection token that provides access to the current {@link AngularTable} instance.
+ *
+ * This token is provided by the {@link TanStackTable} directive.
+ */
+const TanStackTableToken = new InjectionToken('[TanStack Table] Table Context');
+/**
+ * Provides a TanStack Table instance (`AngularTable`) in Angular DI.
+ *
+ * The table can be injected by:
+ * - any descendant of an element using `[tanStackTable]="..."`
+ * - any component instantiated by `*flexRender` when the render props contains `table`
+ *
+ * @example
+ * ```html
+ * <div [tanStackTable]="table">
+ *   <app-pagination />
+ * </div>
+ * ```
+ *
+ * ```ts
+ * @Component({
+ *   selector: 'app-pagination',
+ *   template: `
+ *     <button (click)="prev()" [disabled]="!table().getCanPreviousPage()">Prev</button>
+ *     <button (click)="next()" [disabled]="!table().getCanNextPage()">Next</button>
+ *   `,
+ * })
+ * export class PaginationComponent {
+ *   readonly table = injectTableContext()
+ *
+ *   prev() {
+ *     this.table().previousPage()
+ *   }
+ *   next() {
+ *     this.table().nextPage()
+ *   }
+ * }
+ * ```
+ */
+class TanStackTable {
+    /**
+     * The current TanStack Table instance.
+     *
+     * Provided as a required signal input so DI consumers always read the latest value.
+     */
+    table = input.required({ ...(ngDevMode ? { debugName: "table" } : /* istanbul ignore next */ {}), alias: 'tanStackTable' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: TanStackTable, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.7", type: TanStackTable, isStandalone: true, selector: "[tanStackTable]", inputs: { table: { classPropertyName: "table", publicName: "tanStackTable", isSignal: true, isRequired: true, transformFunction: null } }, providers: [
+            {
+                provide: TanStackTableToken,
+                useFactory: () => inject(TanStackTable).table,
+            },
+        ], exportAs: ["table"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: TanStackTable, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[tanStackTable]',
+                    exportAs: 'table',
+                    providers: [
+                        {
+                            provide: TanStackTableToken,
+                            useFactory: () => inject(TanStackTable).table,
+                        },
+                    ],
+                }]
+        }], propDecorators: { table: [{ type: i0.Input, args: [{ isSignal: true, alias: "tanStackTable", required: true }] }] } });
+/**
+ * Injects the current TanStack Table instance signal.
+ *
+ * Available when:
+ * - there is a nearest `[tanStackTable]` directive in the DI tree, or
+ * - the caller is rendered via `*flexRender` with render props containing `table`
+ */
+function injectTableContext() {
+    return inject(TanStackTableToken);
+}
+
 const FlexRenderComponentProps = new InjectionToken('[@tanstack/angular-table] Flex render component context props');
 /**
  * Inject the flex render context props.
@@ -354,112 +354,6 @@ class FlexRenderComponentInstance {
     }
 }
 
-function mapToFlexRenderTypedContent(content) {
-    if (content === null || content === undefined) {
-        return { kind: 'null' };
-    }
-    if (typeof content === 'string' || typeof content === 'number') {
-        return { kind: 'primitive', content };
-    }
-    if (content instanceof FlexRenderComponentInstance) {
-        return { kind: 'flexRenderComponent', content };
-    }
-    else if (content instanceof TemplateRef) {
-        return { kind: 'templateRef', content };
-    }
-    else if (content instanceof Type) {
-        return { kind: 'component', content };
-    }
-    else {
-        return { kind: 'primitive', content };
-    }
-}
-class FlexRenderView {
-    view;
-    #previousContent;
-    #content;
-    constructor(initialContent, view) {
-        this.#content = initialContent;
-        this.view = view;
-    }
-    get previousContent() {
-        return this.#previousContent ?? { kind: 'null' };
-    }
-    get content() {
-        return this.#content;
-    }
-    set content(content) {
-        this.#previousContent = this.#content;
-        this.#content = content;
-    }
-}
-class FlexRenderTemplateView extends FlexRenderView {
-    constructor(initialContent, view) {
-        super(initialContent, view);
-    }
-    updateProps(props) {
-        this.view.markForCheck();
-    }
-    dirtyCheck() {
-        // Basically a no-op. When the view is created via EmbeddedViewRef, we don't need to do any manual update
-        // since this type of content has a proxy as a context, then every time the root component is checked for changes,
-        // the property getter will be re-evaluated.
-        //
-        // If in a future we need to manually mark the view as dirty, just uncomment next line
-        // this.view.markForCheck()
-    }
-    unmount() {
-        this.view.destroy();
-    }
-    onDestroy(callback) {
-        this.view.onDestroy(callback);
-    }
-}
-class FlexRenderComponentView extends FlexRenderView {
-    constructor(initialContent, view) {
-        super(initialContent, view);
-    }
-    updateProps(props) {
-        switch (this.content.kind) {
-            case 'component': {
-                this.view.setInputs(props);
-                break;
-            }
-            case 'flexRenderComponent': {
-                // No-op. When FlexRenderFlags.PropsReferenceChanged is set,
-                // FlexRenderComponent will be updated into `dirtyCheck`.
-                break;
-            }
-        }
-    }
-    dirtyCheck() {
-        switch (this.content.kind) {
-            case 'component': {
-                // Component context is currently valuated with the cell context. Since it's reference
-                // shouldn't change, we force mark the component as dirty in order to re-evaluate function invocation in view.
-                // NOTE: this should behave like having a component with ChangeDetectionStrategy.Default
-                this.view.markAsDirty();
-                break;
-            }
-            case 'flexRenderComponent': {
-                // Given context instance will always have a different reference than the previous one,
-                // so instead of recreating the entire view, we will only update the current view
-                if (this.view.eqType(this.content.content)) {
-                    this.view.update(this.content.content);
-                }
-                this.view.markAsDirty();
-                break;
-            }
-        }
-    }
-    unmount() {
-        this.view.componentRef.destroy();
-    }
-    onDestroy(callback) {
-        this.view.componentRef.onDestroy(callback);
-    }
-}
-
 class FlexRenderComponentFactory {
     #viewContainerRef;
     constructor(viewContainerRef) {
@@ -479,10 +373,10 @@ class FlexRenderComponentFactory {
             view.setOutputs(outputs);
         return view;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FlexRenderComponentFactory, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FlexRenderComponentFactory });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: FlexRenderComponentFactory, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: FlexRenderComponentFactory });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FlexRenderComponentFactory, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: FlexRenderComponentFactory, decorators: [{
             type: Injectable
         }], ctorParameters: () => [{ type: i0.ViewContainerRef }] });
 class FlexRenderComponentRef {
@@ -636,6 +530,128 @@ class FlexRenderComponentOutputManager {
     }
 }
 
+function mapToFlexRenderTypedContent(content) {
+    if (content === null || content === undefined) {
+        return { kind: 'null' };
+    }
+    if (typeof content === 'string' || typeof content === 'number') {
+        return { kind: 'primitive', content };
+    }
+    if (content instanceof FlexRenderComponentInstance) {
+        return { kind: 'flexRenderComponent', content };
+    }
+    else if (content instanceof TemplateRef) {
+        return { kind: 'templateRef', content };
+    }
+    else if (content instanceof Type) {
+        return { kind: 'component', content };
+    }
+    else {
+        return { kind: 'primitive', content };
+    }
+}
+class FlexRenderView {
+    view;
+    #previousContent;
+    #content;
+    constructor(initialContent, view) {
+        this.#content = initialContent;
+        this.view = view;
+    }
+    get previousContent() {
+        return this.#previousContent ?? { kind: 'null' };
+    }
+    get content() {
+        return this.#content;
+    }
+    set content(content) {
+        this.#previousContent = this.#content;
+        this.#content = content;
+    }
+}
+class FlexRenderTemplateView extends FlexRenderView {
+    constructor(initialContent, view) {
+        super(initialContent, view);
+    }
+    updateProps(props) {
+        this.view.markForCheck();
+    }
+    dirtyCheck() {
+        // Basically a no-op. When the view is created via EmbeddedViewRef, we don't need to do any manual update
+        // since this type of content has a proxy as a context, then every time the root component is checked for changes,
+        // the property getter will be re-evaluated.
+        //
+        // If in a future we need to manually mark the view as dirty, just uncomment next line
+        // this.view.markForCheck()
+    }
+    unmount() {
+        this.view.destroy();
+    }
+    onDestroy(callback) {
+        this.view.onDestroy(callback);
+    }
+    eq(compare) {
+        return ((this.content.kind === 'primitive' &&
+            compare.kind === 'primitive' &&
+            this.content.content === compare.content) ||
+            (this.content.kind === 'templateRef' &&
+                compare.kind === 'templateRef' &&
+                this.content.content === compare.content));
+    }
+}
+class FlexRenderComponentView extends FlexRenderView {
+    constructor(initialContent, view) {
+        super(initialContent, view);
+    }
+    updateProps(props) {
+        switch (this.content.kind) {
+            case 'component': {
+                this.view.setInputs(props);
+                break;
+            }
+            case 'flexRenderComponent': {
+                // No-op. When FlexRenderFlags.PropsReferenceChanged is set,
+                // FlexRenderComponent will be updated into `dirtyCheck`.
+                break;
+            }
+        }
+    }
+    dirtyCheck() {
+        switch (this.content.kind) {
+            case 'component': {
+                // Component context is currently valuated with the cell context. Since it's reference
+                // shouldn't change, we force mark the component as dirty in order to re-evaluate function invocation in view.
+                // NOTE: this should behave like having a component with ChangeDetectionStrategy.Default
+                this.view.markAsDirty();
+                break;
+            }
+            case 'flexRenderComponent': {
+                // Given context instance will always have a different reference than the previous one,
+                // so instead of recreating the entire view, we will only update the current view
+                if (this.view.eqType(this.content.content)) {
+                    this.view.update(this.content.content);
+                }
+                this.view.markAsDirty();
+                break;
+            }
+        }
+    }
+    unmount() {
+        this.view.componentRef.destroy();
+    }
+    onDestroy(callback) {
+        this.view.componentRef.onDestroy(callback);
+    }
+    eq(compare) {
+        return ((this.content.kind === 'component' &&
+            compare.kind === 'component' &&
+            this.content.content === compare.content) ||
+            (this.content.kind === 'flexRenderComponent' &&
+                compare.kind === 'flexRenderComponent' &&
+                this.content.content.component === compare.content.component));
+    }
+}
+
 /**
  * Internal view renderer used by Angular TanStack Table to implement `flexRender` directives.
  *
@@ -658,11 +674,11 @@ class FlexViewRenderer {
             ? content
             : runInInjectionContext(this.#injector(), () => content(props));
     };
-    #latestContent = computed(() => this.#getLatestContentValue(), ...(ngDevMode ? [{ debugName: "#latestContent" }] : []));
+    #latestContent = computed(() => this.#getLatestContentValue(), ...(ngDevMode ? [{ debugName: "#latestContent" }] : /* istanbul ignore next */ []));
     #getContentValue = computed(() => {
         const latestContent = this.#latestContent();
         return mapToFlexRenderTypedContent(latestContent);
-    }, ...(ngDevMode ? [{ debugName: "#getContentValue" }] : []));
+    }, ...(ngDevMode ? [{ debugName: "#getContentValue" }] : /* istanbul ignore next */ []));
     constructor(options) {
         this.#content = options.content;
         this.#props = options.props;
@@ -752,7 +768,7 @@ class FlexViewRenderer {
                 }
                 this.#renderFlags |= FlexRenderFlags.Dirty;
                 this.#doCheck();
-            }, { ...(ngDevMode ? { debugName: "#currentRenderEffectRef" } : {}), injector: this.#viewContainerRef.injector });
+            }, { ...(ngDevMode ? { debugName: "#currentRenderEffectRef" } : /* istanbul ignore next */ {}), injector: this.#viewContainerRef.injector });
         }
     }
     #shouldRecreateEntireView() {
@@ -766,11 +782,12 @@ class FlexViewRenderer {
             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();
     }
@@ -899,9 +916,9 @@ class FlexViewRenderer {
  * ```
  */
 class FlexRenderCell {
-    cell = input(undefined, { ...(ngDevMode ? { debugName: "cell" } : {}), alias: 'flexRenderCell' });
-    header = input(undefined, { ...(ngDevMode ? { debugName: "header" } : {}), alias: 'flexRenderHeader' });
-    footer = input(undefined, { ...(ngDevMode ? { debugName: "footer" } : {}), alias: 'flexRenderFooter' });
+    cell = input(undefined, { ...(ngDevMode ? { debugName: "cell" } : /* istanbul ignore next */ {}), alias: 'flexRenderCell' });
+    header = input(undefined, { ...(ngDevMode ? { debugName: "header" } : /* istanbul ignore next */ {}), alias: 'flexRenderHeader' });
+    footer = input(undefined, { ...(ngDevMode ? { debugName: "footer" } : /* istanbul ignore next */ {}), alias: 'flexRenderFooter' });
     #renderData = computed(() => {
         const cell = this.cell();
         const header = this.header();
@@ -916,15 +933,15 @@ class FlexRenderCell {
             return [footer.column.columnDef.footer, footer.getContext()];
         }
         return [null, null];
-    }, { ...(ngDevMode ? { debugName: "#renderData" } : {}), equal: (a, b) => {
+    }, { ...(ngDevMode ? { debugName: "#renderData" } : /* istanbul ignore next */ {}), equal: (a, b) => {
             return a[0] === b[0] && a[1] === b[1];
         } });
     #injector = inject(Injector);
     #templateRef = inject(TemplateRef);
     #viewContainerRef = inject(ViewContainerRef);
     constructor() {
-        const content = computed(() => this.#renderData()[0], ...(ngDevMode ? [{ debugName: "content" }] : []));
-        const props = computed(() => this.#renderData()[1], ...(ngDevMode ? [{ debugName: "props" }] : []));
+        const content = computed(() => this.#renderData()[0], ...(ngDevMode ? [{ debugName: "content" }] : /* istanbul ignore next */ []));
+        const props = computed(() => this.#renderData()[1], ...(ngDevMode ? [{ debugName: "props" }] : /* istanbul ignore next */ []));
         const renderer = new FlexViewRenderer({
             content: content,
             props: props,
@@ -937,10 +954,10 @@ class FlexRenderCell {
             renderer.destroy();
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FlexRenderCell, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.1", type: FlexRenderCell, isStandalone: true, selector: "ng-template[flexRenderCell], ng-template[flexRenderFooter], ng-template[flexRenderHeader]", inputs: { cell: { classPropertyName: "cell", publicName: "flexRenderCell", isSignal: true, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "flexRenderHeader", isSignal: true, isRequired: false, transformFunction: null }, footer: { classPropertyName: "footer", publicName: "flexRenderFooter", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: FlexRenderCell, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.7", type: FlexRenderCell, isStandalone: true, selector: "ng-template[flexRenderCell], ng-template[flexRenderFooter], ng-template[flexRenderHeader]", inputs: { cell: { classPropertyName: "cell", publicName: "flexRenderCell", isSignal: true, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "flexRenderHeader", isSignal: true, isRequired: false, transformFunction: null }, footer: { classPropertyName: "footer", publicName: "flexRenderFooter", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FlexRenderCell, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: FlexRenderCell, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ng-template[flexRenderCell], ng-template[flexRenderFooter], ng-template[flexRenderHeader]',
@@ -996,9 +1013,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
  * which the latter is preferred.
  */
 class FlexRenderDirective {
-    content = input(undefined, { ...(ngDevMode ? { debugName: "content" } : {}), alias: 'flexRender' });
-    props = input({}, { ...(ngDevMode ? { debugName: "props" } : {}), alias: 'flexRenderProps' });
-    injector = input(inject(Injector), { ...(ngDevMode ? { debugName: "injector" } : {}), alias: 'flexRenderInjector' });
+    content = input(undefined, { ...(ngDevMode ? { debugName: "content" } : /* istanbul ignore next */ {}), alias: 'flexRender' });
+    props = input({}, { ...(ngDevMode ? { debugName: "props" } : /* istanbul ignore next */ {}), alias: 'flexRenderProps' });
+    injector = input(inject(Injector), { ...(ngDevMode ? { debugName: "injector" } : /* istanbul ignore next */ {}), alias: 'flexRenderInjector' });
     #viewContainerRef = inject(ViewContainerRef);
     #templateRef = inject(TemplateRef);
     constructor() {
@@ -1014,10 +1031,10 @@ class FlexRenderDirective {
             renderer.destroy();
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FlexRenderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.1", type: FlexRenderDirective, isStandalone: true, selector: "ng-template[flexRender]", inputs: { content: { classPropertyName: "content", publicName: "flexRender", isSignal: true, isRequired: false, transformFunction: null }, props: { classPropertyName: "props", publicName: "flexRenderProps", isSignal: true, isRequired: false, transformFunction: null }, injector: { classPropertyName: "injector", publicName: "flexRenderInjector", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: FlexRenderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.7", type: FlexRenderDirective, isStandalone: true, selector: "ng-template[flexRender]", inputs: { content: { classPropertyName: "content", publicName: "flexRender", isSignal: true, isRequired: false, transformFunction: null }, props: { classPropertyName: "props", publicName: "flexRenderProps", isSignal: true, isRequired: false, transformFunction: null }, injector: { classPropertyName: "injector", publicName: "flexRenderInjector", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FlexRenderDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: FlexRenderDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ng-template[flexRender]',
@@ -1125,7 +1142,7 @@ function lazyInit(initializer) {
 function injectTable(options, selector = (state) => state) {
     assertInInjectionContext(injectTable);
     const injector = inject(Injector);
-    const stateNotifier = signal(0, ...(ngDevMode ? [{ debugName: "stateNotifier" }] : []));
+    const stateNotifier = signal(0, ...(ngDevMode ? [{ debugName: "stateNotifier" }] : /* istanbul ignore next */ []));
     const angularReactivityFeature = constructReactivityFeature({
         stateNotifier: () => stateNotifier(),
     });
@@ -1153,7 +1170,7 @@ function injectTable(options, selector = (state) => state) {
                 result.state = tableOptionsValue.state;
             }
             return result;
-        }, ...(ngDevMode ? [{ debugName: "updatedOptions" }] : []));
+        }, ...(ngDevMode ? [{ debugName: "updatedOptions" }] : /* istanbul ignore next */ []));
         effect(() => {
             const newOptions = updatedOptions();
             untracked(() => table.setOptions(newOptions));