4209e40d-4a53-48f5-b396-81cec1d9cc0f

Committed 15 Apr 2025 10:18AM UTC coverage: 90.175% (+0.001%) from 90.174%

Build # 4209e40d-4a53-48f5-b396-81cec1d9cc0f

Build Type

push

circleci

Committed by

minlovehua

Commit Message

feat: demo

Run Details

5591 of 6865 branches covered (81.44%)

Branch coverage included in aggregate %.

76 of 80 new or added lines in 36 files covered. (95.0%)

67 existing lines in 12 files now uncovered.

13353 of 14143 relevant lines covered (94.41%)

991.7 hits per line

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

89.36

/src/shared/option/option.component.ts

import {
    Component,
    Input,
    TemplateRef,
    ViewChild,
    ChangeDetectionStrategy,
    HostBinding,
    HostListener,
    ElementRef,
    ChangeDetectorRef,
    EventEmitter,
    OnDestroy,
    Output,
    inject
} from '@angular/core';
import { Highlightable } from '@angular/cdk/a11y';
import { SelectOptionBase } from './select-option-base';
import { ENTER, SPACE, coerceBooleanProperty, hasModifierKey } from 'ngx-tethys/util';
import { THY_OPTION_PARENT_COMPONENT } from './option.token';

import { ThyIcon } from 'ngx-tethys/icon';

export class ThyOptionSelectionChangeEvent {
    constructor(
        public option: ThyOption,
        public isUserInput = false
    ) {}
}

export class ThyOptionVisibleChangeEvent {
    option: ThyOption;
}

/**
 * @private
 * @order 20
 */
@Component({
    selector: 'thy-option',
    templateUrl: './option.component.html',
    changeDetection: ChangeDetectionStrategy.OnPush,
    standalone: true,
    imports: [ThyIcon]
})
export class ThyOption extends SelectOptionBase implements OnDestroy, Highlightable {
    element = inject<ElementRef<HTMLElement>>(ElementRef);
    parent = inject(THY_OPTION_PARENT_COMPONENT, { optional: true })!;
    private cdr = inject(ChangeDetectorRef);

    private _selected = false;
    private _hidden = false;
    private _disabled = false;

    @Input() thyValue: any;

    @Input() thyRawValue: any;

    @Input() thyLabelText: string;

    @Input() thyShowOptionCustom: boolean;

    @Input() thySearchKey: string;

    @HostBinding('class.thy-option-item') _isOptionItem = true;

    @ViewChild(TemplateRef, { static: true }) template: TemplateRef<any>;

    @Input({ transform: coerceBooleanProperty })
    @HostBinding(`class.disabled`)
    set thyDisabled(value: boolean) {
        this._disabled = value;
    }

    get thyDisabled(): boolean {
        return this._disabled;
    }

    get disabled(): boolean {
        return this.hidden || this._disabled;
    }

    @HostBinding('class.hidden')
    get hidden(): boolean {
        return this._hidden;
    }

    @HostBinding('attr.tabindex')
    get tabIndex(): string {
        return this.disabled ? '-1' : '0';
    }

    @HostBinding(`class.active`)
    get selected(): boolean {
        return this._selected;
    }

    @Output() readonly selectionChange: EventEmitter<ThyOptionSelectionChangeEvent> = new EventEmitter();
    @Output() readonly visibleChange: EventEmitter<ThyOptionVisibleChangeEvent> = new EventEmitter();

    constructor() {
        super();
    }

    getHostElement(): HTMLElement {
        return this.element.nativeElement;
    }

    @HostListener('click', ['$event'])
    onClick(event: Event) {
        this.selectViaInteraction();
    }

    @HostListener('keydown', ['$event'])
    handleKeydown(event: KeyboardEvent): void {
        if ((event.keyCode === ENTER || event.keyCode === SPACE) && !hasModifierKey(event)) {
            this.selectViaInteraction();
            event.preventDefault();
        }
    }

    selectViaInteraction(): void {
        if (!this.disabled) {
            this._selected = this.parent.isMultiple ? !this._selected : true;
            this.cdr.markForCheck();
            this.emitSelectionChangeEvent(true);
        }
    }

    select(event?: Event): void {
        if (!this.disabled) {
            if (!this._selected) {
                this._selected = true;
                this.emitSelectionChangeEvent();
                this.cdr.markForCheck();
            }
        }
    }

    deselect(): void {
        if (this._selected || this.disabled) {
            this._selected = false;
            this.emitSelectionChangeEvent();
            this.cdr.markForCheck();
        }
    }

    hideOption() {
        if (!this._hidden) {
            this._hidden = true;
            this.visibleChange.emit({ option: this });
            this.cdr.markForCheck();
        }
    }

    showOption() {
        if (this._hidden) {
            this._hidden = false;
            this.visibleChange.emit({ option: this });
            this.cdr.markForCheck();
        }
    }

    matchSearchText(searchText: string): boolean {
        if (this.thySearchKey) {
            if (this.thySearchKey.toLowerCase().indexOf(searchText.toLowerCase()) >= 0) {
                return true;
            } else {
                return false;
            }
        } else {
            if (this.thyLabelText.toLowerCase().indexOf(searchText.toLowerCase()) >= 0) {
                return true;
            } else {
                return false;
            }
        }
    }

    setActiveStyles(): void {
        this.getHostElement().classList.add('hover');
        this.cdr.markForCheck();
    }

    setInactiveStyles(): void {
        this.getHostElement().classList.remove('hover');
        this.cdr.markForCheck();
    }

    getLabel(): string {
        return '';
    }

    private emitSelectionChangeEvent(isUserInput = false): void {
        this.selectionChange.emit(new ThyOptionSelectionChangeEvent(this, isUserInput));
    }

    ngOnDestroy() {}
}

1	import {
2	Component,
3	Input,
4	TemplateRef,
5	ViewChild,
6	ChangeDetectionStrategy,
7	HostBinding,
8	HostListener,
9	ElementRef,	×
10	ChangeDetectorRef,	117✔
11	EventEmitter,	117✔
12	OnDestroy,
13	Output,
14	inject
15	} from '@angular/core';
16	import { Highlightable } from '@angular/cdk/a11y';
17	import { SelectOptionBase } from './select-option-base';
18	import { ENTER, SPACE, coerceBooleanProperty, hasModifierKey } from 'ngx-tethys/util';
19	import { THY_OPTION_PARENT_COMPONENT } from './option.token';
20		1✔
21	import { ThyIcon } from 'ngx-tethys/icon';
22		580✔
23	export class ThyOptionSelectionChangeEvent {
24	constructor(
25	public option: ThyOption,	4,730✔
26	public isUserInput = false
27	) {}
28	}	4,979✔
29
30	export class ThyOptionVisibleChangeEvent {
31	option: ThyOption;	9,975✔
32	}
33
34	/**	4,730✔
35	* @private
36	* @order 20
37	*/	4,911✔
38	@Component({
39	selector: 'thy-option',
40	templateUrl: './option.component.html',	953✔
41	changeDetection: ChangeDetectionStrategy.OnPush,	953✔
42	standalone: true,	953✔
43	imports: [ThyIcon]	953✔
44	})	953✔
45	export class ThyOption extends SelectOptionBase implements OnDestroy, Highlightable {	953✔
46	element = inject<ElementRef<HTMLElement>>(ElementRef);	953✔
47	parent = inject(THY_OPTION_PARENT_COMPONENT, { optional: true })!;	953✔
48	private cdr = inject(ChangeDetectorRef);	953✔
49		953✔
50	private _selected = false;
51	private _hidden = false;
52	private _disabled = false;	166✔
53
54	@Input() thyValue: any;
55		28✔
56	@Input() thyRawValue: any;
57
UNCOV 58	@Input() thyLabelText: string;	×
UNCOV 59		×
UNCOV 60	@Input() thyShowOptionCustom: boolean;	×
61
62	@Input() thySearchKey: string;
63
64	@HostBinding('class.thy-option-item') _isOptionItem = true;	37✔
65		36✔
66	@ViewChild(TemplateRef, { static: true }) template: TemplateRef<any>;	36✔
67		36✔
68	@Input({ transform: coerceBooleanProperty })
69	@HostBinding(`class.disabled`)
70	set thyDisabled(value: boolean) {
71	this._disabled = value;	92✔
72	}	90✔
73		48✔
74	get thyDisabled(): boolean {	48✔
75	return this._disabled;	48✔
76	}
77
78	get disabled(): boolean {
79	return this.hidden \|\| this._disabled;
80	}	35✔
81		30✔
82	@HostBinding('class.hidden')	30✔
83	get hidden(): boolean {	30✔
84	return this._hidden;
85	}
86
87	@HostBinding('attr.tabindex')	40✔
88	get tabIndex(): string {	34✔
89	return this.disabled ? '-1' : '0';	34✔
90	}	34✔
91
92	@HostBinding(`class.active`)
93	get selected(): boolean {
94	return this._selected;	12✔
95	}	7✔
96		7✔
97	@Output() readonly selectionChange: EventEmitter<ThyOptionSelectionChangeEvent> = new EventEmitter();	7✔
98	@Output() readonly visibleChange: EventEmitter<ThyOptionVisibleChangeEvent> = new EventEmitter();
99
100	constructor() {
101	super();	52✔
102	}	8✔
103		1✔
104	getHostElement(): HTMLElement {
105	return this.element.nativeElement;
106	}	7✔
107
108	@HostListener('click', ['$event'])
109	onClick(event: Event) {
110	this.selectViaInteraction();	44✔
111	}	11✔
112
113	@HostListener('keydown', ['$event'])
114	handleKeydown(event: KeyboardEvent): void {	33✔
115	if ((event.keyCode === ENTER \|\| event.keyCode === SPACE) && !hasModifierKey(event)) {
116	this.selectViaInteraction();
117	event.preventDefault();
118	}
119	}	118✔
120		118✔
121	selectViaInteraction(): void {
122	if (!this.disabled) {
123	this._selected = this.parent.isMultiple ? !this._selected : true;	48✔
124	this.cdr.markForCheck();	48✔
125	this.emitSelectionChangeEvent(true);
126	}
UNCOV 127	}	×
128
129	select(event?: Event): void {	78✔
130	if (!this.disabled) {	114✔
131	if (!this._selected) {
132	this._selected = true;
133	this.emitSelectionChangeEvent();	1✔
134	this.cdr.markForCheck();	1✔
135	}
136	}
137	}
138
139	deselect(): void {
140	if (this._selected \|\| this.disabled) {
141	this._selected = false;
142	this.emitSelectionChangeEvent();
143	this.cdr.markForCheck();
144	}
145	}
146
147	hideOption() {
148	if (!this._hidden) {
149	this._hidden = true;
150	this.visibleChange.emit({ option: this });
151	this.cdr.markForCheck();
152	}	1✔
153	}
154
155	showOption() {
156	if (this._hidden) {
157	this._hidden = false;
158	this.visibleChange.emit({ option: this });
159	this.cdr.markForCheck();
160	}
161	}
162
163	matchSearchText(searchText: string): boolean {
164	if (this.thySearchKey) {
165	if (this.thySearchKey.toLowerCase().indexOf(searchText.toLowerCase()) >= 0) {
166	return true;
167	} else {
168	return false;
169	}
170	} else {
171	if (this.thyLabelText.toLowerCase().indexOf(searchText.toLowerCase()) >= 0) {
172	return true;
173	} else {
174	return false;
175	}
176	}
177	}
178
179	setActiveStyles(): void {
180	this.getHostElement().classList.add('hover');
181	this.cdr.markForCheck();
182	}
183
184	setInactiveStyles(): void {
185	this.getHostElement().classList.remove('hover');
186	this.cdr.markForCheck();
187	}
188
189	getLabel(): string {
190	return '';
191	}
192
193	private emitSelectionChangeEvent(isUserInput = false): void {
194	this.selectionChange.emit(new ThyOptionSelectionChangeEvent(this, isUserInput));
195	}
196
197	ngOnDestroy() {}
198	}

atinc / ngx-tethys / 4209e40d-4a53-48f5-b396-81cec1d9cc0f

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