d9ae709b-3c27-4b69-b125-b8b80b54f90b

import { Directive, Renderer2, Input, ElementRef, Output, EventEmitter, OnDestroy, NgZone } from '@angular/core';
import { useHostRenderer } from '@tethys/cdk/dom';
import { InputBoolean } from 'ngx-tethys/core';

/**
 * @name thyShow
 */
@Directive({
    selector: '[thyShow]',
    standalone: true
})
export class ThyShowDirective implements OnDestroy {
    @Output() thyShowChange = new EventEmitter();

    private hostRenderer = useHostRenderer();

    private unListenEvent: () => void;

    private unListenDocument() {
        if (this.unListenEvent) {
            this.unListenEvent();
            this.unListenEvent = null;
        }
    }

    @Input()
    @InputBoolean()
    set thyShow(condition: boolean) {
        if (condition) {
            this.hostRenderer.setStyle('display', 'block');
            this.ngZone.runOutsideAngular(() =>
                setTimeout(() => {
                    this.unListenEvent = this.renderer.listen('document', 'click', event => {
                        if (!this.elementRef.nativeElement.contains(event.target)) {
                            if (this.thyShowChange.observers.length) {
                                this.ngZone.run(() => this.thyShowChange.emit(false));
                            }
                            this.unListenDocument();
                        }
                    });
                })
            );
        } else {
            this.hostRenderer.setStyle('display', 'none');
            this.unListenDocument();
        }
    }

    constructor(private elementRef: ElementRef<HTMLElement>, private renderer: Renderer2, private ngZone: NgZone) {}

    ngOnDestroy() {
        this.unListenDocument();
    }
}

1	import { Directive, Renderer2, Input, ElementRef, Output, EventEmitter, OnDestroy, NgZone } from '@angular/core';
2	import { useHostRenderer } from '@tethys/cdk/dom';
3	import { InputBoolean } from 'ngx-tethys/core';
4
5	/**
6	* @name thyShow
7	*/
8	@Directive({	1✔
9	selector: '[thyShow]',
10	standalone: true	×
11	})	×
12	export class ThyShowDirective implements OnDestroy {	×
13	@Output() thyShowChange = new EventEmitter();
14
15	private hostRenderer = useHostRenderer();
16		×
17	private unListenEvent: () => void;	×
18		×
19	private unListenDocument() {	×
20	if (this.unListenEvent) {	×
21	this.unListenEvent();	×
22	this.unListenEvent = null;	×
23	}
24	}	×
25
26	@Input()
27	@InputBoolean()
28	set thyShow(condition: boolean) {
29	if (condition) {
30	this.hostRenderer.setStyle('display', 'block');	×
31	this.ngZone.runOutsideAngular(() =>	×
32	setTimeout(() => {
33	this.unListenEvent = this.renderer.listen('document', 'click', event => {
34	if (!this.elementRef.nativeElement.contains(event.target)) {
35	if (this.thyShowChange.observers.length) {	×
36	this.ngZone.run(() => this.thyShowChange.emit(false));	×
37	}	×
38	this.unListenDocument();	×
39	}	×
40	});
41	})
42	);	×
43	} else {
44	this.hostRenderer.setStyle('display', 'none');	1✔
45	this.unListenDocument();
46	}
47	}
48
49	constructor(private elementRef: ElementRef<HTMLElement>, private renderer: Renderer2, private ngZone: NgZone) {}	1✔
50
51	ngOnDestroy() {
52	this.unListenDocument();
53	}
54	}	1✔

atinc / ngx-tethys / d9ae709b-3c27-4b69-b125-b8b80b54f90b

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