28358286454

Committed 29 Jun 2026 08:17AM UTC coverage: 90.127% (-0.05%) from 90.174%

Build # 28358286454

Build Type

Pull #17246

github

Committed by

web-flow

Commit Message

Merge 21687d939 into 07bdcd752

Pull Request Pull Request #17246: fix(pivot-grid): fix date format based on the localization

Coverage Stats

14921 of 17392 branches covered (85.79%)

Branch coverage included in aggregate %.

29 of 32 new or added lines in 4 files covered. (90.63%)

735 existing lines in 76 files now uncovered.

29992 of 32441 relevant lines covered (92.45%)

34632.46 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

93.65

/projects/igniteui-angular/grids/lite/src/grid-lite-column.component.ts

import { booleanAttribute, ChangeDetectionStrategy, Component, contentChild, CUSTOM_ELEMENTS_SCHEMA, Directive, effect, EmbeddedViewRef, inject, input, TemplateRef, ViewContainerRef } from '@angular/core';
import { ColumnConfiguration, ColumnSortConfiguration, IgcCellContext, IgcHeaderContext, Keys, DataType } from 'igniteui-grid-lite';

/** Configuration object for grid columns. */
export type IgxGridLiteColumnConfiguration<T extends object = any> = ColumnConfiguration<T>;

export type IgxGridLiteColumnSortConfiguration<T extends object = any> = ColumnSortConfiguration<T>;


/**
 * Directive providing type information for header template contexts.
 * Use this directive on ng-template elements that render header templates.
 *
 * @example
 * ```html
 * <ng-template igxGridLiteHeader let-column>
 *   <div>{{column.header}}</div>
 * </ng-template>
 * ```
 */
@Directive({ selector: '[igxGridLiteHeader]' })
export class IgxGridLiteHeaderTemplateDirective<T extends object = any> {
    public template = inject<TemplateRef<IgxGridLiteHeaderTemplateContext<T>>>(TemplateRef);

    // eslint-disable-next-line @typescript-eslint/no-unused-vars
    public static ngTemplateContextGuard<T extends object = any>(_: IgxGridLiteHeaderTemplateDirective<T>, ctx: any): ctx is IgxGridLiteHeaderTemplateContext<T> {
        return true;
    }
}

/**
 * Directive providing type information for cell template contexts.
 * Use this directive on ng-template elements that render cell templates.
 *
 * @example
 * ```html
 * <ng-template igxGridLiteCell let-value let-column="column" let-rowIndex="rowIndex" let-data="data">
 *   <div>{{value}}</div>
 * </ng-template>
 * ```
 */
@Directive({ selector: '[igxGridLiteCell]' })
export class IgxGridLiteCellTemplateDirective<T extends object = any> {
    public template = inject<TemplateRef<IgxGridLiteCellTemplateContext<T>>>(TemplateRef);

    // eslint-disable-next-line @typescript-eslint/no-unused-vars
    public static ngTemplateContextGuard<T extends object = any>(_: IgxGridLiteCellTemplateDirective<T>, ctx: unknown): ctx is IgxGridLiteCellTemplateContext<T> {
        return true;
    }
}

@Component({
    selector: 'igx-grid-lite-column',
    changeDetection: ChangeDetectionStrategy.OnPush,
    schemas: [CUSTOM_ELEMENTS_SCHEMA],
    templateUrl: './grid-lite-column.component.html'
})
export class IgxGridLiteColumnComponent<T extends object = any> {

    //#region Internal state

    private readonly _view = inject(ViewContainerRef);

    /** Reference to the embedded view for the header template and its template function. */
    private headerViewRef?: EmbeddedViewRef<IgxGridLiteHeaderTemplateContext<T>>;
    protected headerTemplateFunc?: (ctx: IgcHeaderContext<T>) => Node[];

    /** Reference to the embedded view for the cell template and its template function. */
    private cellViewRefs? = new Map<T, EmbeddedViewRef<IgxGridLiteCellTemplateContext<T>>>();
    protected cellTemplateFunc?: (ctx: IgcCellContext<T>) => Node[];

    /** Template directives used for inline templating */
    private readonly headerTemplateDirective = contentChild(IgxGridLiteHeaderTemplateDirective<T>);
    private readonly cellTemplateDirective = contentChild(IgxGridLiteCellTemplateDirective<T>);

    //#endregion

    //#region Inputs

    /** The field from the data for this column. */
    public readonly field = input<NoInfer<Keys<T>>>();

    /** The data type of the column's values. */
    public readonly dataType = input<DataType>('string');

    /** The header text of the column. */
    public readonly header = input<string>();

    /** The width of the column. */
    public readonly width = input<string>();

    /** Indicates whether the column is hidden. */
    public readonly hidden = input(false, { transform: booleanAttribute });

    /** Indicates whether the column is resizable. */
    public readonly resizable = input(false, { transform: booleanAttribute });

    /** Indicates whether the column is sortable. */
    public readonly sortable = input(false, { transform: booleanAttribute });

    /** Whether sort operations will be case sensitive. */
    public readonly sortingCaseSensitive = input(false, { transform: booleanAttribute });

    /** Sort configuration for the column (e.g., custom comparer). */
    public readonly sortConfiguration = input<IgxGridLiteColumnSortConfiguration<T>>();

    /** Indicates whether the column is filterable. */
    public readonly filterable = input(false, { transform: booleanAttribute });

    /** Whether filter operations will be case sensitive. */
    public readonly filteringCaseSensitive = input(false, { transform: booleanAttribute });

    /** Custom header template for the column. */
    public readonly headerTemplate = input<TemplateRef<IgxGridLiteHeaderTemplateContext<T>>>();

    /** Custom cell template for the column. */
    public readonly cellTemplate = input<TemplateRef<IgxGridLiteCellTemplateContext<T>>>();

    //#endregion

    constructor() {
        effect((onCleanup) => {
            const directive = this.headerTemplateDirective();
            const template = this.headerTemplate() ?? directive?.template;
            if (template) {
                this.headerTemplateFunc = (ctx: IgcHeaderContext<T>) => {
                    if (!this.headerViewRef) {
                        const angularContext = {
                            ...ctx,
                            $implicit: ctx.column
                        }
                        this.headerViewRef = this._view.createEmbeddedView(template, angularContext);
                    }
                    return this.headerViewRef.rootNodes;
                };
            }
            onCleanup(() => {
                if (this.headerViewRef) {
                    this.headerViewRef.destroy();
                    this.headerViewRef = undefined;
                }
            })
        });

        effect((onCleanup) => {
            const directive = this.cellTemplateDirective();
            const template = this.cellTemplate() ?? directive?.template;
            if (template) {
                this.cellTemplateFunc = (ctx: IgcCellContext<T>) => {
                    const oldViewRef = this.cellViewRefs.get(ctx.row.data);
                    const angularContext = {
                        ...ctx,
                        $implicit: ctx.value,
                    } as IgxGridLiteCellTemplateContext<T>;
                    if (!oldViewRef) {
                        const newViewRef = this._view.createEmbeddedView(template, angularContext);
                        this.cellViewRefs.set(ctx.row.data, newViewRef);
                        return newViewRef.rootNodes;
                    }
                    Object.assign(oldViewRef.context, angularContext);
                    return oldViewRef.rootNodes;
                };
            }
            onCleanup(() => {
                this.cellViewRefs.forEach((viewRef) => {
                    viewRef.destroy();
                });
                this.cellViewRefs?.clear();
            });
        });
    }
}

/**
 * Context provided to the header template.
 */
export type IgxGridLiteHeaderTemplateContext<T extends object = any> = IgcHeaderContext<T> & {
    /**
     * The current configuration for the column.
     */
    $implicit: IgcHeaderContext<T>['column'];
}

/**
 * Context provided to the header template.
 */
export type IgxGridLiteCellTemplateContext<T extends object = any> = IgcCellContext<T> & {
    /**
     * The value from the data source for this cell.
     */
    $implicit: IgcCellContext<T>['value'];
};

1	import { booleanAttribute, ChangeDetectionStrategy, Component, contentChild, CUSTOM_ELEMENTS_SCHEMA, Directive, effect, EmbeddedViewRef, inject, input, TemplateRef, ViewContainerRef } from '@angular/core';
2	import { ColumnConfiguration, ColumnSortConfiguration, IgcCellContext, IgcHeaderContext, Keys, DataType } from 'igniteui-grid-lite';
3
4	/** Configuration object for grid columns. */
5	export type IgxGridLiteColumnConfiguration<T extends object = any> = ColumnConfiguration<T>;
6
7	export type IgxGridLiteColumnSortConfiguration<T extends object = any> = ColumnSortConfiguration<T>;
8
9
10	/**
11	* Directive providing type information for header template contexts.
12	* Use this directive on ng-template elements that render header templates.
13	*
14	* @example
15	* ```html
16	* <ng-template igxGridLiteHeader let-column>
17	* <div>{{column.header}}</div>
18	* </ng-template>
19	* ```
20	*/
21	@Directive({ selector: '[igxGridLiteHeader]' })
22	export class IgxGridLiteHeaderTemplateDirective<T extends object = any> {	3✔
23	public template = inject<TemplateRef<IgxGridLiteHeaderTemplateContext<T>>>(TemplateRef);	4✔
24
25	// eslint-disable-next-line @typescript-eslint/no-unused-vars
26	public static ngTemplateContextGuard<T extends object = any>(_: IgxGridLiteHeaderTemplateDirective<T>, ctx: any): ctx is IgxGridLiteHeaderTemplateContext<T> {
UNCOV 27	return true;	×
28	}
29	}
30
31	/**
32	* Directive providing type information for cell template contexts.
33	* Use this directive on ng-template elements that render cell templates.
34	*
35	* @example
36	* ```html
37	* <ng-template igxGridLiteCell let-value let-column="column" let-rowIndex="rowIndex" let-data="data">
38	* <div>{{value}}</div>
39	* </ng-template>
40	* ```
41	*/
42	@Directive({ selector: '[igxGridLiteCell]' })
43	export class IgxGridLiteCellTemplateDirective<T extends object = any> {	3✔
44	public template = inject<TemplateRef<IgxGridLiteCellTemplateContext<T>>>(TemplateRef);	4✔
45
46	// eslint-disable-next-line @typescript-eslint/no-unused-vars
47	public static ngTemplateContextGuard<T extends object = any>(_: IgxGridLiteCellTemplateDirective<T>, ctx: unknown): ctx is IgxGridLiteCellTemplateContext<T> {
UNCOV 48	return true;	×
49	}
50	}
51
52	@Component({
53	selector: 'igx-grid-lite-column',
54	changeDetection: ChangeDetectionStrategy.OnPush,
55	schemas: [CUSTOM_ELEMENTS_SCHEMA],
56	templateUrl: './grid-lite-column.component.html'
57	})
58	export class IgxGridLiteColumnComponent<T extends object = any> {	3✔
59
60	//#region Internal state
61
62	private readonly _view = inject(ViewContainerRef);	20✔
63
64	/** Reference to the embedded view for the header template and its template function. */
65	private headerViewRef?: EmbeddedViewRef<IgxGridLiteHeaderTemplateContext<T>>;
66	protected headerTemplateFunc?: (ctx: IgcHeaderContext<T>) => Node[];
67
68	/** Reference to the embedded view for the cell template and its template function. */
69	private cellViewRefs? = new Map<T, EmbeddedViewRef<IgxGridLiteCellTemplateContext<T>>>();	20✔
70	protected cellTemplateFunc?: (ctx: IgcCellContext<T>) => Node[];
71
72	/** Template directives used for inline templating */
73	private readonly headerTemplateDirective = contentChild(IgxGridLiteHeaderTemplateDirective<T>);	20✔
74	private readonly cellTemplateDirective = contentChild(IgxGridLiteCellTemplateDirective<T>);	20✔
75
76	//#endregion
77
78	//#region Inputs
79
80	/** The field from the data for this column. */
81	public readonly field = input<NoInfer<Keys<T>>>();	20✔
82
83	/** The data type of the column's values. */
84	public readonly dataType = input<DataType>('string');	20✔
85
86	/** The header text of the column. */
87	public readonly header = input<string>();	20✔
88
89	/** The width of the column. */
90	public readonly width = input<string>();	20✔
91
92	/** Indicates whether the column is hidden. */
93	public readonly hidden = input(false, { transform: booleanAttribute });	20✔
94
95	/** Indicates whether the column is resizable. */
96	public readonly resizable = input(false, { transform: booleanAttribute });	20✔
97
98	/** Indicates whether the column is sortable. */
99	public readonly sortable = input(false, { transform: booleanAttribute });	20✔
100
101	/** Whether sort operations will be case sensitive. */
102	public readonly sortingCaseSensitive = input(false, { transform: booleanAttribute });	20✔
103
104	/** Sort configuration for the column (e.g., custom comparer). */
105	public readonly sortConfiguration = input<IgxGridLiteColumnSortConfiguration<T>>();	20✔
106
107	/** Indicates whether the column is filterable. */
108	public readonly filterable = input(false, { transform: booleanAttribute });	20✔
109
110	/** Whether filter operations will be case sensitive. */
111	public readonly filteringCaseSensitive = input(false, { transform: booleanAttribute });	20✔
112
113	/** Custom header template for the column. */
114	public readonly headerTemplate = input<TemplateRef<IgxGridLiteHeaderTemplateContext<T>>>();	20✔
115
116	/** Custom cell template for the column. */
117	public readonly cellTemplate = input<TemplateRef<IgxGridLiteCellTemplateContext<T>>>();	20✔
118
119	//#endregion
120
121	constructor() {
122	effect((onCleanup) => {	20✔
123	const directive = this.headerTemplateDirective();	20✔
124	const template = this.headerTemplate() ?? directive?.template;	20✔
125	if (template) {	20✔
126	this.headerTemplateFunc = (ctx: IgcHeaderContext<T>) => {	4✔
127	if (!this.headerViewRef) {	16✔
128	const angularContext = {	8✔
129	...ctx,
130	$implicit: ctx.column
131	}
132	this.headerViewRef = this._view.createEmbeddedView(template, angularContext);	8✔
133	}
134	return this.headerViewRef.rootNodes;	16✔
135	};
136	}
137	onCleanup(() => {	20✔
138	if (this.headerViewRef) {	20✔
139	this.headerViewRef.destroy();	4✔
140	this.headerViewRef = undefined;	4✔
141	}
142	})
143	});
144
145	effect((onCleanup) => {	20✔
146	const directive = this.cellTemplateDirective();	20✔
147	const template = this.cellTemplate() ?? directive?.template;	20✔
148	if (template) {	20✔
149	this.cellTemplateFunc = (ctx: IgcCellContext<T>) => {	4✔
150	const oldViewRef = this.cellViewRefs.get(ctx.row.data);	32✔
151	const angularContext = {	32✔
152	...ctx,
153	$implicit: ctx.value,
154	} as IgxGridLiteCellTemplateContext<T>;
155	if (!oldViewRef) {	32✔
156	const newViewRef = this._view.createEmbeddedView(template, angularContext);	32✔
157	this.cellViewRefs.set(ctx.row.data, newViewRef);	32✔
158	return newViewRef.rootNodes;	32✔
159	}
UNCOV 160	Object.assign(oldViewRef.context, angularContext);	×
UNCOV 161	return oldViewRef.rootNodes;	×
162	};
163	}
164	onCleanup(() => {	20✔
165	this.cellViewRefs.forEach((viewRef) => {	20✔
166	viewRef.destroy();	32✔
167	});
168	this.cellViewRefs?.clear();	20✔
169	});
170	});
171	}
172	}
173
174	/**
175	* Context provided to the header template.
176	*/
177	export type IgxGridLiteHeaderTemplateContext<T extends object = any> = IgcHeaderContext<T> & {
178	/**
179	* The current configuration for the column.
180	*/
181	$implicit: IgcHeaderContext<T>['column'];
182	}
183
184	/**
185	* Context provided to the header template.
186	*/
187	export type IgxGridLiteCellTemplateContext<T extends object = any> = IgcCellContext<T> & {
188	/**
189	* The value from the data source for this cell.
190	*/
191	$implicit: IgcCellContext<T>['value'];
192	};

IgniteUI / igniteui-angular / 28358286454

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous