13331632524

Committed 14 Feb 2025 02:51PM CUT coverage: 22.015% (-69.6%) from 91.622%

Build # 13331632524

Build Type

Pull #15372

github

Committed by

web-flow

Commit Message

Merge d52d57714 into bcb78ae0a

Pull Request Pull Request #15372: chore(*): test ci passing

Run Details

1990 of 15592 branches covered (12.76%)

431 of 964 new or added lines in 18 files covered. (44.71%)

19956 existing lines in 307 files now uncovered.

6452 of 29307 relevant lines covered (22.02%)

249.17 hits per line

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

18.52

/projects/igniteui-angular/src/lib/date-range-picker/date-range-picker-inputs.common.ts

import { Component, ContentChild, Pipe, PipeTransform, Directive } from '@angular/core';
import { NgControl } from '@angular/forms';
import { IgxInputDirective, IgxInputState } from '../input-group/public_api';
import { IgxInputGroupComponent } from '../input-group/input-group.component';
import { IgxInputGroupBase } from '../input-group/input-group.common';
import { DateTimeUtil } from '../date-common/util/date-time.util';
import { IgxDateTimeEditorDirective } from '../directives/date-time-editor/public_api';
import { isDate } from '../core/utils';
import { IgxIconComponent } from '../icon/icon.component';
import { IgxSuffixDirective } from '../directives/suffix/suffix.directive';
import { IgxButtonDirective } from '../directives/button/button.directive';
import { IgxPrefixDirective } from '../directives/prefix/prefix.directive';
import { NgIf, NgTemplateOutlet, NgClass, NgSwitch, NgSwitchCase, NgSwitchDefault } from '@angular/common';

/** Represents a range between two dates. */
export interface DateRange {
    start: Date | string;
    end: Date | string;
}

/** @hidden @internal */
@Pipe({
    name: 'dateRange',
    standalone: true
})
export class DateRangePickerFormatPipe implements PipeTransform {
    public transform(values: DateRange, appliedFormat?: string,
        locale?: string, formatter?: (_: DateRange) => string): string {
        if (!values || !values.start && !values.end) {
            return '';
        }
        if (formatter) {
            return formatter(values);
        }
        let { start, end } = values;
        if (!isDate(start)) {
            start = DateTimeUtil.parseIsoDate(start);
        }
        if (!isDate(end)) {
            end = DateTimeUtil.parseIsoDate(end);
        }
        const startDate = appliedFormat ? DateTimeUtil.formatDate(start, appliedFormat, locale || 'en') : start?.toLocaleDateString();
        const endDate = appliedFormat ? DateTimeUtil.formatDate(end, appliedFormat, locale || 'en') : end?.toLocaleDateString();
        let formatted;
        if (start) {
            formatted = `${startDate} - `;
            if (end) {
                formatted += endDate;
            }
        }

        return formatted ? formatted : '';
    }
}

/** @hidden @internal */
@Component({
    template: ``,
    selector: `igx-date-range-base`,
    providers: [{ provide: IgxInputGroupBase, useExisting: IgxDateRangeInputsBaseComponent }],
    standalone: true
})
export class IgxDateRangeInputsBaseComponent extends IgxInputGroupComponent {
    @ContentChild(IgxDateTimeEditorDirective)
    public dateTimeEditor: IgxDateTimeEditorDirective;

    @ContentChild(IgxInputDirective)
    public inputDirective: IgxInputDirective;

    @ContentChild(NgControl)
    protected ngControl: NgControl;

    /** @hidden @internal */
    public get nativeElement() {
        return this.element.nativeElement;
    }

    /** @hidden @internal */
    public setFocus(): void {
        this.input.focus();
    }

    /** @hidden @internal */
    public updateInputValue(value: Date) {
        if (this.ngControl) {
            this.ngControl.control.setValue(value);
        } else {
            this.dateTimeEditor.value = value;
        }
    }

    /** @hidden @internal */
    public updateInputValidity(state: IgxInputState) {
        this.inputDirective.valid = state;
    }
}

/**
 * Defines the start input for a date range picker
 *
 * @igxModule IgxDateRangePickerModule
 *
 * @igxTheme igx-input-group-theme, igx-calendar-theme, igx-date-range-picker-theme
 *
 * @igxKeywords date, range, date range, date picker
 *
 * @igxGroup scheduling
 *
 * @remarks
 * When templating, start input has to be templated separately
 *
 * @example
 * ```html
 * <igx-date-range-picker mode="dropdown">
 *      <igx-date-range-start>
 *          <input igxInput igxDateTimeEditor type="text">
 *      </igx-date-range-start>
 *      ...
 * </igx-date-range-picker>
 * ```
 */
@Component({
    selector: 'igx-date-range-start',
    templateUrl: '../input-group/input-group.component.html',
    providers: [
        { provide: IgxInputGroupBase, useExisting: IgxDateRangeStartComponent },
        { provide: IgxDateRangeInputsBaseComponent, useExisting: IgxDateRangeStartComponent }
    ],
    imports: [NgIf, NgTemplateOutlet, IgxPrefixDirective, IgxButtonDirective, NgClass, IgxSuffixDirective, IgxIconComponent, NgSwitch, NgSwitchCase, NgSwitchDefault]
})
export class IgxDateRangeStartComponent extends IgxDateRangeInputsBaseComponent { }

/**
 * Defines the end input for a date range picker
 *
 * @igxModule IgxDateRangePickerModule
 *
 * @igxTheme igx-input-group-theme, igx-calendar-theme, igx-date-range-picker-theme
 *
 * @igxKeywords date, range, date range, date picker
 *
 * @igxGroup scheduling
 *
 * @remarks
 * When templating, end input has to be template separately
 *
 * @example
 * ```html
 * <igx-date-range-picker mode="dropdown">
 *      ...
 *      <igx-date-range-end>
 *          <input igxInput igxDateTimeEditor type="text">
 *      </igx-date-range-end>
 * </igx-date-range-picker>
 * ```
 */
@Component({
    selector: 'igx-date-range-end',
    templateUrl: '../input-group/input-group.component.html',
    providers: [
        { provide: IgxInputGroupBase, useExisting: IgxDateRangeEndComponent },
        { provide: IgxDateRangeInputsBaseComponent, useExisting: IgxDateRangeEndComponent }
    ],
    imports: [NgIf, NgTemplateOutlet, IgxPrefixDirective, IgxButtonDirective, NgClass, IgxSuffixDirective, IgxIconComponent, NgSwitch, NgSwitchCase, NgSwitchDefault]
})
export class IgxDateRangeEndComponent extends IgxDateRangeInputsBaseComponent { }

/**
 * Replaces the default separator `to` with the provided value
 *
 * @igxModule IgxDateRangePickerModule
 *
 * @igxTheme igx-date-range-picker-theme
 *
 * @igxKeywords date, range, date range, date picker
 *
 * @igxGroup scheduling
 *
 * @example
 * ```html
 * <igx-date-range-picker>
 *      <igx-date-range-start>
 *          <input igxInput igxDateTimeEditor type="text">
 *      </igx-date-range-start>
 *
 *      <ng-template igxDateRangeSeparator>-</ng-template>
 *
 *      <igx-date-range-end>
 *          <input igxInput igxDateTimeEditor type="text">
 *      </igx-date-range-end>
 *      ...
 * </igx-date-range-picker>
 * ```
 */
@Directive({
    selector: '[igxDateRangeSeparator]',
    standalone: true
})
export class IgxDateRangeSeparatorDirective { }

1	import { Component, ContentChild, Pipe, PipeTransform, Directive } from '@angular/core';
2	import { NgControl } from '@angular/forms';
3	import { IgxInputDirective, IgxInputState } from '../input-group/public_api';
4	import { IgxInputGroupComponent } from '../input-group/input-group.component';
5	import { IgxInputGroupBase } from '../input-group/input-group.common';
6	import { DateTimeUtil } from '../date-common/util/date-time.util';
7	import { IgxDateTimeEditorDirective } from '../directives/date-time-editor/public_api';
8	import { isDate } from '../core/utils';
9	import { IgxIconComponent } from '../icon/icon.component';
10	import { IgxSuffixDirective } from '../directives/suffix/suffix.directive';
11	import { IgxButtonDirective } from '../directives/button/button.directive';
12	import { IgxPrefixDirective } from '../directives/prefix/prefix.directive';
13	import { NgIf, NgTemplateOutlet, NgClass, NgSwitch, NgSwitchCase, NgSwitchDefault } from '@angular/common';
14
15	/** Represents a range between two dates. */
16	export interface DateRange {
17	start: Date \| string;
18	end: Date \| string;
19	}
20
21	/** @hidden @internal */
22	@Pipe({
23	name: 'dateRange',
24	standalone: true
25	})
26	export class DateRangePickerFormatPipe implements PipeTransform {	2✔
27	public transform(values: DateRange, appliedFormat?: string,
28	locale?: string, formatter?: (_: DateRange) => string): string {
UNCOV 29	if (!values \|\| !values.start && !values.end) {	×
UNCOV 30	return '';	×
31	}
UNCOV 32	if (formatter) {	×
UNCOV 33	return formatter(values);	×
34	}
UNCOV 35	let { start, end } = values;	×
UNCOV 36	if (!isDate(start)) {	×
37	start = DateTimeUtil.parseIsoDate(start);	×
38	}
UNCOV 39	if (!isDate(end)) {	×
40	end = DateTimeUtil.parseIsoDate(end);	×
41	}
UNCOV 42	const startDate = appliedFormat ? DateTimeUtil.formatDate(start, appliedFormat, locale \|\| 'en') : start?.toLocaleDateString();	×
UNCOV 43	const endDate = appliedFormat ? DateTimeUtil.formatDate(end, appliedFormat, locale \|\| 'en') : end?.toLocaleDateString();	×
44	let formatted;
UNCOV 45	if (start) {	×
UNCOV 46	formatted = `${startDate} - `;	×
UNCOV 47	if (end) {	×
UNCOV 48	formatted += endDate;	×
49	}
50	}
51
UNCOV 52	return formatted ? formatted : '';	×
53	}
54	}
55
56	/** @hidden @internal */
57	@Component({
58	template: ``,
59	selector: `igx-date-range-base`,
60	providers: [{ provide: IgxInputGroupBase, useExisting: IgxDateRangeInputsBaseComponent }],
61	standalone: true
62	})
63	export class IgxDateRangeInputsBaseComponent extends IgxInputGroupComponent {	2✔
64	@ContentChild(IgxDateTimeEditorDirective)
65	public dateTimeEditor: IgxDateTimeEditorDirective;
66
67	@ContentChild(IgxInputDirective)
68	public inputDirective: IgxInputDirective;
69
70	@ContentChild(NgControl)
71	protected ngControl: NgControl;
72
73	/** @hidden @internal */
74	public get nativeElement() {
75	return this.element.nativeElement;	×
76	}
77
78	/** @hidden @internal */
79	public setFocus(): void {
UNCOV 80	this.input.focus();	×
81	}
82
83	/** @hidden @internal */
84	public updateInputValue(value: Date) {
UNCOV 85	if (this.ngControl) {	×
UNCOV 86	this.ngControl.control.setValue(value);	×
87	} else {
UNCOV 88	this.dateTimeEditor.value = value;	×
89	}
90	}
91
92	/** @hidden @internal */
93	public updateInputValidity(state: IgxInputState) {
UNCOV 94	this.inputDirective.valid = state;	×
95	}
96	}
97
98	/**
99	* Defines the start input for a date range picker
100	*
101	* @igxModule IgxDateRangePickerModule
102	*
103	* @igxTheme igx-input-group-theme, igx-calendar-theme, igx-date-range-picker-theme
104	*
105	* @igxKeywords date, range, date range, date picker
106	*
107	* @igxGroup scheduling
108	*
109	* @remarks
110	* When templating, start input has to be templated separately
111	*
112	* @example
113	* ```html
114	* <igx-date-range-picker mode="dropdown">
115	* <igx-date-range-start>
116	* <input igxInput igxDateTimeEditor type="text">
117	* </igx-date-range-start>
118	* ...
119	* </igx-date-range-picker>
120	* ```
121	*/
122	@Component({
123	selector: 'igx-date-range-start',
124	templateUrl: '../input-group/input-group.component.html',
125	providers: [
126	{ provide: IgxInputGroupBase, useExisting: IgxDateRangeStartComponent },
127	{ provide: IgxDateRangeInputsBaseComponent, useExisting: IgxDateRangeStartComponent }
128	],
129	imports: [NgIf, NgTemplateOutlet, IgxPrefixDirective, IgxButtonDirective, NgClass, IgxSuffixDirective, IgxIconComponent, NgSwitch, NgSwitchCase, NgSwitchDefault]
130	})
131	export class IgxDateRangeStartComponent extends IgxDateRangeInputsBaseComponent { }	2✔
132
133	/**
134	* Defines the end input for a date range picker
135	*
136	* @igxModule IgxDateRangePickerModule
137	*
138	* @igxTheme igx-input-group-theme, igx-calendar-theme, igx-date-range-picker-theme
139	*
140	* @igxKeywords date, range, date range, date picker
141	*
142	* @igxGroup scheduling
143	*
144	* @remarks
145	* When templating, end input has to be template separately
146	*
147	* @example
148	* ```html
149	* <igx-date-range-picker mode="dropdown">
150	* ...
151	* <igx-date-range-end>
152	* <input igxInput igxDateTimeEditor type="text">
153	* </igx-date-range-end>
154	* </igx-date-range-picker>
155	* ```
156	*/
157	@Component({
158	selector: 'igx-date-range-end',
159	templateUrl: '../input-group/input-group.component.html',
160	providers: [
161	{ provide: IgxInputGroupBase, useExisting: IgxDateRangeEndComponent },
162	{ provide: IgxDateRangeInputsBaseComponent, useExisting: IgxDateRangeEndComponent }
163	],
164	imports: [NgIf, NgTemplateOutlet, IgxPrefixDirective, IgxButtonDirective, NgClass, IgxSuffixDirective, IgxIconComponent, NgSwitch, NgSwitchCase, NgSwitchDefault]
165	})
166	export class IgxDateRangeEndComponent extends IgxDateRangeInputsBaseComponent { }	2✔
167
168	/**
169	* Replaces the default separator `to` with the provided value
170	*
171	* @igxModule IgxDateRangePickerModule
172	*
173	* @igxTheme igx-date-range-picker-theme
174	*
175	* @igxKeywords date, range, date range, date picker
176	*
177	* @igxGroup scheduling
178	*
179	* @example
180	* ```html
181	* <igx-date-range-picker>
182	* <igx-date-range-start>
183	* <input igxInput igxDateTimeEditor type="text">
184	* </igx-date-range-start>
185	*
186	* <ng-template igxDateRangeSeparator>-</ng-template>
187	*
188	* <igx-date-range-end>
189	* <input igxInput igxDateTimeEditor type="text">
190	* </igx-date-range-end>
191	* ...
192	* </igx-date-range-picker>
193	* ```
194	*/
195	@Directive({
196	selector: '[igxDateRangeSeparator]',
197	standalone: true
198	})
199	export class IgxDateRangeSeparatorDirective { }	2✔

IgniteUI / igniteui-angular / 13331632524

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