12908449500

Committed 22 Jan 2025 12:42PM CUT coverage: 91.592%. First build

Build # 12908449500

Build Type

Pull #15291

github

Committed by

web-flow

Commit Message

Merge 10331608b into dbe30fc10

Pull Request Pull Request #15291: fix(month-view/year-view): create onMouseDown events

Run Details

12986 of 15224 branches covered (85.3%)

2 of 4 new or added lines in 2 files covered. (50.0%)

26317 of 28733 relevant lines covered (91.59%)

33972.35 hits per line

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

96.0

/projects/igniteui-angular/src/lib/calendar/years-view/years-view.component.ts

import {
    Component,
    Input,
    HostBinding,
    ElementRef,
    Inject,
} from "@angular/core";
import { IgxCalendarYearDirective } from "../calendar.directives";
import { NgFor } from "@angular/common";
import {
    IgxCalendarViewDirective,
    DAY_INTERVAL_TOKEN,
} from "../common/calendar-view.directive";
import { ControlValueAccessor, NG_VALUE_ACCESSOR } from "@angular/forms";
import { CalendarDay } from "../common/model";
import type { DayInterval } from "../common/model";
import { calendarRange } from "../common/helpers";

@Component({
    providers: [
        {
            provide: NG_VALUE_ACCESSOR,
            useExisting: IgxYearsViewComponent,
            multi: true,
        },
        {
            provide: DAY_INTERVAL_TOKEN,
            useValue: "year",
        },
    ],
    selector: "igx-years-view",
    templateUrl: "years-view.component.html",
    standalone: true,
    imports: [NgFor, IgxCalendarYearDirective],
})
export class IgxYearsViewComponent extends IgxCalendarViewDirective implements ControlValueAccessor {
    #standalone = true;

    /**
     * The default css class applied to the component.
     *
     * @hidden
     */
    @HostBinding("class.igx-calendar-view")
    public readonly viewClass = true;

    /**
     * @hidden @internal
     */
    @Input()
        @HostBinding('class.igx-calendar-view--standalone')
        public get standalone() {
        return this.#standalone;
    }

        public set standalone(value: boolean) {
        this.#standalone = value;
    }

    /**
     * @hidden
     */
    private _yearFormat = "numeric";

    /**
     * @hidden
     */
    private _yearsPerPage = 15;

    /**
     * Gets the year format option of the years view.
     * ```typescript
     * let yearFormat = this.yearsView.yearFormat.
     * ```
     */
    @Input()
    public get yearFormat(): any {
        return this._yearFormat;
    }

    /**
     * Sets the year format option of the years view.
     * ```html
     * <igx-years-view [yearFormat]="numeric"></igx-years-view>
     * ```
     *
     * @memberof IgxYearsViewComponent
     */
    public set yearFormat(value: any) {
        this._yearFormat = value;
        this.initFormatter();
    }

    /**
     * Returns an array of date objects which are then used to properly
     * render the years.
     *
     * Used in the template of the component.
     *
     * @hidden @internal
     */
    public get range(): Date[] {
        const year = this.date.getFullYear();
        const start = new CalendarDay({
            year: Math.floor(year / this._yearsPerPage) * this._yearsPerPage,
            month: this.date.getMonth(),
        });
        const end = start.add(this.dayInterval, this._yearsPerPage);

        return Array.from(calendarRange({ start, end, unit: this.dayInterval })).map(
            (m) => m.native,
        );
    }

    constructor(
        public el: ElementRef,
        @Inject(DAY_INTERVAL_TOKEN) dayInterval: DayInterval,
    ) {
        super(dayInterval);
    }

    /**
     * Returns the locale representation of the year in the years view.
     *
     * @hidden
     */
    public formattedYear(value: Date): {long: string, formatted: string} {
        const rawFormatter = new Intl.DateTimeFormat(this.locale, { year: 'numeric' });

        if (this.formatView) {
            return {
                long: rawFormatter.format(value),
                formatted: this._formatter.format(value)
            }
        }

        return {
            long: rawFormatter.format(value),
            formatted: `${value.getFullYear()}`
        }
    }

    /**
     * @hidden
     */
    public yearTracker(_: number, item: Date): string {
        return `${item.getFullYear()}}`;
    }

    /**
     * @hidden
     */
    protected initFormatter() {
        this._formatter = new Intl.DateTimeFormat(this._locale, {
            year: this.yearFormat,
        });
    }

    /**
     * @hidden
     */
    protected onMouseDown() {
        if (this.tabIndex !== -1) {
            this.el.nativeElement.focus();
        }
    }
}

1	import {
2	Component,
3	Input,
4	HostBinding,
5	ElementRef,
6	Inject,
7	} from "@angular/core";
8	import { IgxCalendarYearDirective } from "../calendar.directives";
9	import { NgFor } from "@angular/common";
10	import {
11	IgxCalendarViewDirective,
12	DAY_INTERVAL_TOKEN,
13	} from "../common/calendar-view.directive";
14	import { ControlValueAccessor, NG_VALUE_ACCESSOR } from "@angular/forms";
15	import { CalendarDay } from "../common/model";
16	import type { DayInterval } from "../common/model";
17	import { calendarRange } from "../common/helpers";
18
19	@Component({
20	providers: [
21	{
22	provide: NG_VALUE_ACCESSOR,
23	useExisting: IgxYearsViewComponent,
24	multi: true,
25	},
26	{
27	provide: DAY_INTERVAL_TOKEN,
28	useValue: "year",
29	},
30	],
31	selector: "igx-years-view",
32	templateUrl: "years-view.component.html",
33	standalone: true,
34	imports: [NgFor, IgxCalendarYearDirective],
35	})
36	export class IgxYearsViewComponent extends IgxCalendarViewDirective implements ControlValueAccessor {	2✔
37	#standalone = true;	11✔
38
39	/**
40	* The default css class applied to the component.
41	*
42	* @hidden
43	*/
44	@HostBinding("class.igx-calendar-view")
45	public readonly viewClass = true;	11✔
46
47	/**
48	* @hidden @internal
49	*/
50	@Input()
51	@HostBinding('class.igx-calendar-view--standalone')
52	public get standalone() {
53	return this.#standalone;	50✔
54	}
55
56	public set standalone(value: boolean) {
57	this.#standalone = value;	11✔
58	}
59
60	/**
61	* @hidden
62	*/
63	private _yearFormat = "numeric";	11✔
64
65	/**
66	* @hidden
67	*/
68	private _yearsPerPage = 15;	11✔
69
70	/**
71	* Gets the year format option of the years view.
72	* ```typescript
73	* let yearFormat = this.yearsView.yearFormat.
74	* ```
75	*/
76	@Input()
77	public get yearFormat(): any {
78	return this._yearFormat;	33✔
79	}
80
81	/**
82	* Sets the year format option of the years view.
83	* ```html
84	* <igx-years-view [yearFormat]="numeric"></igx-years-view>
85	* ```
86	*
87	* @memberof IgxYearsViewComponent
88	*/
89	public set yearFormat(value: any) {
90	this._yearFormat = value;	11✔
91	this.initFormatter();	11✔
92	}
93
94	/**
95	* Returns an array of date objects which are then used to properly
96	* render the years.
97	*
98	* Used in the template of the component.
99	*
100	* @hidden @internal
101	*/
102	public get range(): Date[] {
103	const year = this.date.getFullYear();	72✔
104	const start = new CalendarDay({	72✔
105	year: Math.floor(year / this._yearsPerPage) * this._yearsPerPage,
106	month: this.date.getMonth(),
107	});
108	const end = start.add(this.dayInterval, this._yearsPerPage);	72✔
109
110	return Array.from(calendarRange({ start, end, unit: this.dayInterval })).map(	72✔
111	(m) => m.native,	1,080✔
112	);
113	}
114
115	constructor(
116	public el: ElementRef,	11✔
117	@Inject(DAY_INTERVAL_TOKEN) dayInterval: DayInterval,
118	) {
119	super(dayInterval);	11✔
120	}
121
122	/**
123	* Returns the locale representation of the year in the years view.
124	*
125	* @hidden
126	*/
127	public formattedYear(value: Date): {long: string, formatted: string} {
128	const rawFormatter = new Intl.DateTimeFormat(this.locale, { year: 'numeric' });	1,500✔
129
130	if (this.formatView) {	1,500✔
131	return {	90✔
132	long: rawFormatter.format(value),
133	formatted: this._formatter.format(value)
134	}
135	}
136
137	return {	1,410✔
138	long: rawFormatter.format(value),
139	formatted: `${value.getFullYear()}`
140	}
141	}
142
143	/**
144	* @hidden
145	*/
146	public yearTracker(_: number, item: Date): string {
147	return `${item.getFullYear()}}`;	450✔
148	}
149
150	/**
151	* @hidden
152	*/
153	protected initFormatter() {
154	this._formatter = new Intl.DateTimeFormat(this._locale, {	33✔
155	year: this.yearFormat,
156	});
157	}
158
159	/**
160	* @hidden
161	*/
162	protected onMouseDown() {
163	if (this.tabIndex !== -1) {	4!
NEW 164	this.el.nativeElement.focus();	×
165	}
166	}
167	}

IgniteUI / igniteui-angular / 12908449500

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