68ef226c-f83e-44c1-b8ed-e420a83c5d84

Committed 28 May 2025 10:31AM UTC coverage: 10.352% (-80.0%) from 90.316%

Build # 68ef226c-f83e-44c1-b8ed-e420a83c5d84

Build Type

Pull #3460

circleci

Committed by

pubuzhixing8

Commit Message

chore: xxx

Pull Request Pull Request #3460: refactor(icon): migrate signal input #TINFR-1476

Run Details

132 of 6823 branches covered (1.93%)

Branch coverage included in aggregate %.

10 of 14 new or added lines in 1 file covered. (71.43%)

11648 existing lines in 344 files now uncovered.

2078 of 14525 relevant lines covered (14.31%)

6.69 hits per line

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

15.38

/src/divider/divider.component.ts

import { Component, TemplateRef, ViewEncapsulation, OnInit, ChangeDetectionStrategy, input, effect, Signal, computed } from '@angular/core';
import { useHostRenderer } from '@tethys/cdk/dom';
import { NgTemplateOutlet } from '@angular/common';
import { coerceBooleanProperty } from 'ngx-tethys/util';

export type ThyDividerStyle = 'solid' | 'dashed';

export type ThyDividerTextDirection = 'left' | 'right' | 'center';

export type ThyDividerColor = 'lighter' | 'light' | 'danger' | 'primary' | 'success' | 'warning' | string;

/**
 * 分割线
 * @name thy-divider
 */
@Component({
    preserveWhitespaces: false,
    encapsulation: ViewEncapsulation.None,
    selector: 'thy-divider',
    template: `
        @if (templateContent()) {
            <div class="thy-divider-inner-template">
                <ng-template *ngTemplateOutlet="templateContent()"></ng-template>
            </div>
        }

        @if (textContent()) {
            <span class="thy-divider-inner-text">{{ textContent() }}</span>
        }
    `,
    host: {
        '[class.thy-divider]': `true`,
        '[class.thy-divider-horizontal]': `!thyVertical()`,
        '[class.thy-divider-vertical]': `thyVertical()`,
        '[class.thy-divider-with-content]': `textContent || templateContent`,
        '[class.thy-divider-with-content-left]': `(textContent || templateContent) && thyTextDirection() === 'left'`,
        '[class.thy-divider-with-content-right]': `(textContent || templateContent) && thyTextDirection() === 'right'`,
        '[class.thy-divider-with-content-center]': `(textContent || templateContent) && thyTextDirection() === 'center'`,
        '[class.thy-divider-solid]': `thyStyle() === 'solid'`,
        '[class.thy-divider-dashed]': `thyStyle() === 'dashed'`,
        '[class.thy-divider-deeper]': `!!thyDeeper()`
    },
    changeDetection: ChangeDetectionStrategy.OnPush,
    imports: [NgTemplateOutlet]
})
export class ThyDivider implements OnInit {
    private hostRenderer = useHostRenderer();

    /**
     * 是否垂直方向
     */
    readonly thyVertical = input(false, { transform: coerceBooleanProperty });

    /**
     * 分割线的风格
     * @type solid(实线) | dashed(虚线)
     */
    readonly thyStyle = input<ThyDividerStyle>('solid');

    /**
     * 分割线的颜色，默认 #eee，light 为 #ddd，primary 主色，success 成功色，warning 警告色，danger 危险色
     * @type 'lighter' | 'light' | 'danger' | 'primary' | 'success' | 'warning' | string
     */
    readonly thyColor = input<ThyDividerColor>('default');

    /**
     * 中间文本内容，支持文字和模板
     */
    readonly thyText = input<string | TemplateRef<HTMLElement>>();

    readonly templateContent: Signal<TemplateRef<HTMLElement>> = computed(() => {
        const text = this.thyText();
        if (text instanceof TemplateRef) {
            return text;
        }
    });

    readonly textContent: Signal<string> = computed(() => {
        const text = this.thyText();
        if (typeof text === 'string') {
            return text;
        }
    });

    /**
     * 中间内容的方向
     * @type left | right | center
     */
    readonly thyTextDirection = input<ThyDividerTextDirection>('center');

    /**
     * 颜色加深，已经废弃，请使用 thyColor="light" 代替
     * @deprecated
     */
    readonly thyDeeper = input(false, { transform: coerceBooleanProperty });

    constructor() {
        effect(() => {
            this.setColor();
        });
    }

    ngOnInit(): void {}

    setColor() {
        this.hostRenderer.updateClass([`thy-divider-${this.thyColor()}`]);
    }
}

1	import { Component, TemplateRef, ViewEncapsulation, OnInit, ChangeDetectionStrategy, input, effect, Signal, computed } from '@angular/core';
2	import { useHostRenderer } from '@tethys/cdk/dom';
3	import { NgTemplateOutlet } from '@angular/common';
4	import { coerceBooleanProperty } from 'ngx-tethys/util';
5
6	export type ThyDividerStyle = 'solid' \| 'dashed';
7
8	export type ThyDividerTextDirection = 'left' \| 'right' \| 'center';
9
10	export type ThyDividerColor = 'lighter' \| 'light' \| 'danger' \| 'primary' \| 'success' \| 'warning' \| string;
11		1✔
12	/**
UNCOV 13	* 分割线	×
UNCOV 14	* @name thy-divider	×
UNCOV 15	*/	×
UNCOV 16	@Component({	×
UNCOV 17	preserveWhitespaces: false,	×
UNCOV 18	encapsulation: ViewEncapsulation.None,	×
UNCOV 19	selector: 'thy-divider',	×
UNCOV 20	template: `	×
UNCOV 21	@if (templateContent()) {	×
22	<div class="thy-divider-inner-template">
23	<ng-template *ngTemplateOutlet="templateContent()"></ng-template>
UNCOV 24	</div>	×
UNCOV 25	}	×
UNCOV 26		×
UNCOV 27	@if (textContent()) {	×
28	<span class="thy-divider-inner-text">{{ textContent() }}</span>
29	}
UNCOV 30	`,	×
UNCOV 31	host: {	×
UNCOV 32	'[class.thy-divider]': `true`,	×
UNCOV 33	'[class.thy-divider-horizontal]': `!thyVertical()`,	×
34	'[class.thy-divider-vertical]': `thyVertical()`,
35	'[class.thy-divider-with-content]': `textContent \|\| templateContent`,
36	'[class.thy-divider-with-content-left]': `(textContent \|\| templateContent) && thyTextDirection() === 'left'`,
37	'[class.thy-divider-with-content-right]': `(textContent \|\| templateContent) && thyTextDirection() === 'right'`,
UNCOV 38	'[class.thy-divider-with-content-center]': `(textContent \|\| templateContent) && thyTextDirection() === 'center'`,	×
39	'[class.thy-divider-solid]': `thyStyle() === 'solid'`,
40	'[class.thy-divider-dashed]': `thyStyle() === 'dashed'`,	1✔
41	'[class.thy-divider-deeper]': `!!thyDeeper()`	1✔
42	},
43	changeDetection: ChangeDetectionStrategy.OnPush,
44	imports: [NgTemplateOutlet]
45	})
46	export class ThyDivider implements OnInit {
47	private hostRenderer = useHostRenderer();
48
49	/**
50	* 是否垂直方向	1✔
51	*/
52	readonly thyVertical = input(false, { transform: coerceBooleanProperty });
53
54	/**
55	* 分割线的风格
56	* @type solid(实线) \| dashed(虚线)
57	*/
58	readonly thyStyle = input<ThyDividerStyle>('solid');
59
60	/**
61	* 分割线的颜色，默认 #eee，light 为 #ddd，primary 主色，success 成功色，warning 警告色，danger 危险色
62	* @type 'lighter' \| 'light' \| 'danger' \| 'primary' \| 'success' \| 'warning' \| string
63	*/
64	readonly thyColor = input<ThyDividerColor>('default');
65
66	/**
67	* 中间文本内容，支持文字和模板
68	*/
69	readonly thyText = input<string \| TemplateRef<HTMLElement>>();
70
71	readonly templateContent: Signal<TemplateRef<HTMLElement>> = computed(() => {
72	const text = this.thyText();
73	if (text instanceof TemplateRef) {
74	return text;
75	}
76	});
77
78	readonly textContent: Signal<string> = computed(() => {
79	const text = this.thyText();
80	if (typeof text === 'string') {
81	return text;
82	}
83	});
84
85	/**
86	* 中间内容的方向
87	* @type left \| right \| center
88	*/
89	readonly thyTextDirection = input<ThyDividerTextDirection>('center');
90
91	/**
92	* 颜色加深，已经废弃，请使用 thyColor="light" 代替
93	* @deprecated
94	*/
95	readonly thyDeeper = input(false, { transform: coerceBooleanProperty });
96
97	constructor() {
98	effect(() => {
99	this.setColor();
100	});
101	}
102
103	ngOnInit(): void {}
104
105	setColor() {
106	this.hostRenderer.updateClass([`thy-divider-${this.thyColor()}`]);
107	}
108	}

atinc / ngx-tethys / 68ef226c-f83e-44c1-b8ed-e420a83c5d84

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