c0ef8457-a839-451f-8b72-80fd73106231

Committed 02 Apr 2024 02:27PM UTC coverage: 90.524% (-0.06%) from 90.585%

Build # c0ef8457-a839-451f-8b72-80fd73106231

Build Type

Pull #3062

circleci

Committed by

minlovehua

Commit Message

refactor(all): use the transform attribute of @Input() instead of @InputBoolean() and @InputNumber()

Pull Request Pull Request #3062: refactor(all): use the transform attribute of @input() instead of @InputBoolean() and @InputNumber()

Run Details

4987 of 6108 branches covered (81.65%)

Branch coverage included in aggregate %.

217 of 223 new or added lines in 82 files covered. (97.31%)

202 existing lines in 53 files now uncovered.

12246 of 12929 relevant lines covered (94.72%)

1055.59 hits per line

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

87.23

/src/tooltip/tooltip.directive.ts

import { FocusMonitor } from '@angular/cdk/a11y';
import { Platform } from '@angular/cdk/platform';
import {
    Directive,
    ElementRef,
    Input,
    NgZone,
    OnDestroy,
    OnInit,
    ViewContainerRef,
    booleanAttribute,
    numberAttribute
} from '@angular/core';
import { ThyOverlayDirectiveBase, ThyOverlayTrigger, ThyPlacement } from 'ngx-tethys/core';
import { SafeAny } from 'ngx-tethys/types';
import { isString } from 'ngx-tethys/util';
import { ThyTooltipContent } from './interface';
import { ThyTooltipRef } from './tooltip-ref';
import { ThyTooltipService } from './tooltip.service';

/**
 * @name thyTooltip
 */
@Directive({
    selector: '[thyTooltip],[thy-tooltip]',
    exportAs: 'thyTooltip',
    standalone: true
})
export class ThyTooltipDirective extends ThyOverlayDirectiveBase implements OnInit, OnDestroy {
    touchendHideDelay = 1500;

    protected isAutoCloseOnMobileTouch: boolean = true;

    private tooltipClass: string | string[];

    private tooltipRef: ThyTooltipRef;

    private _content: ThyTooltipContent;

    get content() {
        return this._content;
    }

    /**
     * 提示消息，可以是文本，也可以是一个模板
     * @type string | TemplateRef<T>
     */
    @Input('thyTooltip') set content(value: ThyTooltipContent) {
        // If the content is not a string (e.g. number), convert it to a string and trim it.
        this._content = value && isString(value) ? `${value}`.trim() : value;
        if (!this._content && this.tooltipRef?.isTooltipVisible()) {
            this.tooltipRef.hide(0);
        } else {
            this.tooltipRef?.updateTooltipContent(value, this.data);
        }
    }

    /**
     * 指定提示的位置
     * @type ThyPlacement
     */
    @Input('thyTooltipPlacement') placement: ThyPlacement = 'top';

    /**
     * 提示内容自定义样式
     */
    @Input('thyTooltipClass')
    set thyTooltipClass(value: string | string[]) {
        this.tooltipClass = value;
        this.tooltipRef?.setTooltipClass(this.tooltipClass);
    }

    /**
     * 显示提示内容延迟毫秒
     */
    @Input({ alias: 'thyTooltipShowDelay', transform: numberAttribute }) showDelay: number;

    /**
     * 隐藏提示内容延迟毫秒
     */
    @Input({ alias: 'thyTooltipHideDelay', transform: numberAttribute }) hideDelay: number;

    _trigger: ThyOverlayTrigger = 'hover';

    /**
     * 触发提示方式
     * <br/>`hover` 鼠标移入，显示提示；鼠标移出，隐藏提示；显示提示时，滚动页面，会隐藏提示。
     * <br/>`focus` 元素获取焦点，显示提示；元素失去焦点，隐藏提示；显示元素时，滚动页面，提示会跟随聚焦源一起移动。
     * <br/>`click` 点击元素，显示提示；点击backdrop，隐藏提示；显示提示时，页面的滚动行为会被阻止。
     *
     * @type hover | focus | click
     */
    @Input('thyTooltipTrigger') set thyTooltipTrigger(value: ThyOverlayTrigger) {
        this.trigger = value;
    }

    /**
     * 设置是否禁用提示
     * @default false
     */
    @Input({ alias: 'thyTooltipDisabled', transform: booleanAttribute })
    set thyTooltipDisabled(value: boolean) {
        this.disabled = value;
        // If tooltip is disabled, hide immediately.
        if (this.disabled) {
            this.hide(0);
        }
    }

    /**
     * 传入 template 时，需要注入给 template 的上下文数据
     */
    @Input('thyTooltipTemplateContext') data: SafeAny;

    /**
     * 偏移量
     */
    @Input({ alias: 'thyTooltipOffset', transform: numberAttribute }) tooltipOffset: number;

    /**
     * hover 触发方式下 鼠标移入Tooltip是否固定 Tooltip
     * @default false
     */
    @Input({ alias: 'thyTooltipPin', transform: booleanAttribute })
    set tooltipPin(value: boolean) {
        this.overlayPin = value;
    }

    constructor(
        elementRef: ElementRef<HTMLElement>,
        ngZone: NgZone,
        platform: Platform,
        focusMonitor: FocusMonitor,
        private viewContainerRef: ViewContainerRef,
        private thyTooltipService: ThyTooltipService
    ) {
        super(elementRef, platform, focusMonitor, ngZone);
    }

    ngOnInit() {
        this.initialize();
    }

    /** Shows the tooltip after the delay in ms, defaults to tooltip-delay-show 200ms */
    show(delay: number = this.showDelay): void {
        if (this.disabled) {
            return;
        }
        if (!this.tooltipRef) {
            this.tooltipRef = this.thyTooltipService.create(this.elementRef, {
                viewContainerRef: this.viewContainerRef,
                placement: this.placement,
                contentClass: this.tooltipClass,
                offset: this.tooltipOffset,
                tooltipPin: this.tooltipPin,
                hasBackdrop: this.trigger === 'click'
            });
        }
        this.tooltipRef.show(this.content, this.data, delay);
    }

    /** Hides the tooltip after the delay in ms, defaults to tooltip-delay-hide 100ms */
    hide(delay: number = this.hideDelay): void {
        this.tooltipRef?.hide(delay);
    }

    ngOnDestroy() {
        this.tooltipRef?.dispose();
    }
}

1	import { FocusMonitor } from '@angular/cdk/a11y';
2	import { Platform } from '@angular/cdk/platform';
3	import {
4	Directive,
5	ElementRef,
6	Input,
7	NgZone,
8	OnDestroy,
9	OnInit,
10	ViewContainerRef,
11	booleanAttribute,	1✔
12	numberAttribute
13	} from '@angular/core';	32✔
14	import { ThyOverlayDirectiveBase, ThyOverlayTrigger, ThyPlacement } from 'ngx-tethys/core';
15	import { SafeAny } from 'ngx-tethys/types';
16	import { isString } from 'ngx-tethys/util';
17	import { ThyTooltipContent } from './interface';	2,540✔
18	import { ThyTooltipRef } from './tooltip-ref';	2,540!
UNCOV 19	import { ThyTooltipService } from './tooltip.service';	×
20
21	/**
22	* @name thyTooltip	2,540✔
23	*/
24	@Directive({
25	selector: '[thyTooltip],[thy-tooltip]',
UNCOV 26	exportAs: 'thyTooltip',	×
UNCOV 27	standalone: true	×
28	})
29	export class ThyTooltipDirective extends ThyOverlayDirectiveBase implements OnInit, OnDestroy {
UNCOV 30	touchendHideDelay = 1500;	×
31
32	protected isAutoCloseOnMobileTouch: boolean = true;
33		1,213✔
34	private tooltipClass: string \| string[];
35		1,213✔
36	private tooltipRef: ThyTooltipRef;	1,147✔
37
38	private _content: ThyTooltipContent;
39
40	get content() {	×
41	return this._content;
42	}
43		1,452✔
44	/**	1,452✔
45	* 提示消息，可以是文本，也可以是一个模板	1,452✔
46	* @type string \| TemplateRef<T>	1,452✔
47	*/	1,452✔
48	@Input('thyTooltip') set content(value: ThyTooltipContent) {	1,452✔
49	// If the content is not a string (e.g. number), convert it to a string and trim it.	1,452✔
50	this._content = value && isString(value) ? `${value}`.trim() : value;
51	if (!this._content && this.tooltipRef?.isTooltipVisible()) {
52	this.tooltipRef.hide(0);	1,452✔
53	} else {
54	this.tooltipRef?.updateTooltipContent(value, this.data);
55	}	16✔
56	}	31✔
57		3✔
58	/**
59	* 指定提示的位置	28✔
60	* @type ThyPlacement	24✔
61	*/
62	@Input('thyTooltipPlacement') placement: ThyPlacement = 'top';
63
64	/**
65	* 提示内容自定义样式
66	*/
67	@Input('thyTooltipClass')
68	set thyTooltipClass(value: string \| string[]) {
69	this.tooltipClass = value;	28✔
70	this.tooltipRef?.setTooltipClass(this.tooltipClass);
71	}
72		1,109✔
73	/**	2,259✔
74	* 显示提示内容延迟毫秒
75	*/
76	@Input({ alias: 'thyTooltipShowDelay', transform: numberAttribute }) showDelay: number;	1,453✔
77
78	/**	1✔
79	* 隐藏提示内容延迟毫秒
80	*/
81	@Input({ alias: 'thyTooltipHideDelay', transform: numberAttribute }) hideDelay: number;
82
83	_trigger: ThyOverlayTrigger = 'hover';
84
85	/**
86	* 触发提示方式	1✔
87	* <br/>`hover` 鼠标移入，显示提示；鼠标移出，隐藏提示；显示提示时，滚动页面，会隐藏提示。
88	* <br/>`focus` 元素获取焦点，显示提示；元素失去焦点，隐藏提示；显示元素时，滚动页面，提示会跟随聚焦源一起移动。
89	* <br/>`click` 点击元素，显示提示；点击backdrop，隐藏提示；显示提示时，页面的滚动行为会被阻止。
90	*
91	* @type hover \| focus \| click
92	*/
93	@Input('thyTooltipTrigger') set thyTooltipTrigger(value: ThyOverlayTrigger) {
94	this.trigger = value;
95	}
96
97	/**
98	* 设置是否禁用提示
99	* @default false	1✔
100	*/
101	@Input({ alias: 'thyTooltipDisabled', transform: booleanAttribute })
102	set thyTooltipDisabled(value: boolean) {
103	this.disabled = value;
104	// If tooltip is disabled, hide immediately.
105	if (this.disabled) {
106	this.hide(0);
107	}
108	}
109
110	/**
111	* 传入 template 时，需要注入给 template 的上下文数据
112	*/
113	@Input('thyTooltipTemplateContext') data: SafeAny;
114
115	/**
116	* 偏移量
117	*/
118	@Input({ alias: 'thyTooltipOffset', transform: numberAttribute }) tooltipOffset: number;
119
120	/**
121	* hover 触发方式下鼠标移入Tooltip是否固定 Tooltip
122	* @default false
123	*/
124	@Input({ alias: 'thyTooltipPin', transform: booleanAttribute })
125	set tooltipPin(value: boolean) {
126	this.overlayPin = value;
127	}
128
129	constructor(
130	elementRef: ElementRef<HTMLElement>,
131	ngZone: NgZone,
132	platform: Platform,
133	focusMonitor: FocusMonitor,
134	private viewContainerRef: ViewContainerRef,
135	private thyTooltipService: ThyTooltipService
136	) {
137	super(elementRef, platform, focusMonitor, ngZone);
138	}
139
140	ngOnInit() {
141	this.initialize();
142	}
143
144	/** Shows the tooltip after the delay in ms, defaults to tooltip-delay-show 200ms */
145	show(delay: number = this.showDelay): void {
146	if (this.disabled) {
147	return;
148	}
149	if (!this.tooltipRef) {
150	this.tooltipRef = this.thyTooltipService.create(this.elementRef, {
151	viewContainerRef: this.viewContainerRef,
152	placement: this.placement,
153	contentClass: this.tooltipClass,
154	offset: this.tooltipOffset,
155	tooltipPin: this.tooltipPin,
156	hasBackdrop: this.trigger === 'click'
157	});
158	}
159	this.tooltipRef.show(this.content, this.data, delay);
160	}
161
162	/** Hides the tooltip after the delay in ms, defaults to tooltip-delay-hide 100ms */
163	hide(delay: number = this.hideDelay): void {
164	this.tooltipRef?.hide(delay);
165	}
166
167	ngOnDestroy() {
168	this.tooltipRef?.dispose();
169	}
170	}

atinc / ngx-tethys / c0ef8457-a839-451f-8b72-80fd73106231

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