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

6.12

/src/color-picker/color-picker-panel.component.ts

import { NgClass, NgStyle, NgTemplateOutlet } from '@angular/common';
import { ChangeDetectionStrategy, Component, inject, input, model, OnInit, Signal, ViewContainerRef } from '@angular/core';
import { injectLocale, ThyColorPickerLocale } from 'ngx-tethys/i18n';
import { ThyIcon } from 'ngx-tethys/icon';
import { ThyPopover, ThyPopoverRef } from 'ngx-tethys/popover';
import { coerceBooleanProperty } from 'ngx-tethys/util';
import { ThyColorPickerCustomPanel } from './color-picker-custom-panel.component';
import { ThyColor } from './helpers/color.class';

/**
 * @internal
 */
@Component({
    selector: 'thy-color-picker-panel',
    templateUrl: './color-picker-panel.component.html',
    changeDetection: ChangeDetectionStrategy.OnPush,
    host: {
        '[class.pt-4]': '!transparentColorSelectable()',
        '[class.thy-color-picker-panel]': 'true'
    },
    imports: [NgClass, NgTemplateOutlet, ThyIcon, NgStyle]
})
export class ThyColorPickerPanel implements OnInit {
    private thyPopover = inject(ThyPopover);
    private viewContainerRef = inject(ViewContainerRef);
    private thyPopoverRef = inject<ThyPopoverRef<ThyColorPickerPanel>>(ThyPopoverRef);
    locale: Signal<ThyColorPickerLocale> = injectLocale('colorPicker');

    readonly color = model<string>();

    readonly colorChange = input<(color: string) => {}>();

    readonly defaultColor = input<string, string>('', {
        transform: (value: string) => {
            return (value && new ThyColor(value).toHexString(true)) || '';
        }
    });

    readonly transparentColorSelectable = input(false, { transform: coerceBooleanProperty });

    readonly defaultColors = input<string[]>();

    recentColors: string[] = [];

    newColor: string;

    customPanelPopoverRef: ThyPopoverRef<ThyColorPickerCustomPanel>;

    ngOnInit(): void {
        const colors = localStorage.getItem('recentColors');
        if (colors) {
            this.recentColors = JSON.parse(colors);
        }
    }

    selectColor(color: string) {
        this.color.set(color);
        this.colorChange()(this.color());
        this.thyPopoverRef.close();
    }

    showMoreColor(event: Event) {
        if (!this.customPanelPopoverRef) {
            this.customPanelPopoverRef = this.thyPopover.open(ThyColorPickerCustomPanel, {
                origin: event.currentTarget as HTMLElement,
                offset: -4,
                placement: 'rightBottom',
                manualClosure: true,
                width: '260px',
                hasBackdrop: false,
                viewContainerRef: this.viewContainerRef,
                originActiveClass: 'thy-color-picker-active',
                initialState: {
                    color: this.color(),
                    pickerColorChange: (value: string) => {
                        this.newColor = value;
                        this.colorChange()(value);
                    }
                }
            });
        }
        this.customPanelPopoverRef?.afterClosed().subscribe(() => {
            if (this.newColor) {
                const index = this.recentColors.findIndex(item => item === this.newColor);
                if (index !== -1) {
                    this.recentColors.splice(index, 1);
                }
                this.recentColors.unshift(this.newColor);
                this.recentColors = this.recentColors.slice(0, 10);
                localStorage.setItem('recentColors', JSON.stringify(this.recentColors));
            }
            this.thyPopoverRef.close();
        });
    }

    getIconColor(item: string) {
        const rgba = new ThyColor(item).rgba;
        const hsp = 0.299 * rgba.red + 0.587 * rgba.green + 0.114 * rgba.blue;
        return hsp > 192 ? 'black' : 'white';
    }
}

1	import { NgClass, NgStyle, NgTemplateOutlet } from '@angular/common';
2	import { ChangeDetectionStrategy, Component, inject, input, model, OnInit, Signal, ViewContainerRef } from '@angular/core';
3	import { injectLocale, ThyColorPickerLocale } from 'ngx-tethys/i18n';
4	import { ThyIcon } from 'ngx-tethys/icon';
5	import { ThyPopover, ThyPopoverRef } from 'ngx-tethys/popover';
6	import { coerceBooleanProperty } from 'ngx-tethys/util';
7	import { ThyColorPickerCustomPanel } from './color-picker-custom-panel.component';
8	import { ThyColor } from './helpers/color.class';
9
10	/**
11	* @internal
12	*/
13	@Component({
14	selector: 'thy-color-picker-panel',
15	templateUrl: './color-picker-panel.component.html',	1✔
16	changeDetection: ChangeDetectionStrategy.OnPush,
UNCOV 17	host: {	×
UNCOV 18	'[class.pt-4]': '!transparentColorSelectable()',	×
UNCOV 19	'[class.thy-color-picker-panel]': 'true'	×
UNCOV 20	},	×
UNCOV 21	imports: [NgClass, NgTemplateOutlet, ThyIcon, NgStyle]	×
UNCOV 22	})	×
UNCOV 23	export class ThyColorPickerPanel implements OnInit {	×
24	private thyPopover = inject(ThyPopover);
UNCOV 25	private viewContainerRef = inject(ViewContainerRef);	×
26	private thyPopoverRef = inject<ThyPopoverRef<ThyColorPickerPanel>>(ThyPopoverRef);
27	locale: Signal<ThyColorPickerLocale> = injectLocale('colorPicker');
UNCOV 28		×
UNCOV 29	readonly color = model<string>();	×
UNCOV 30		×
31	readonly colorChange = input<(color: string) => {}>();
32
UNCOV 33	readonly defaultColor = input<string, string>('', {	×
UNCOV 34	transform: (value: string) => {	×
UNCOV 35	return (value && new ThyColor(value).toHexString(true)) \|\| '';	×
36	}
37	});
38
UNCOV 39	readonly transparentColorSelectable = input(false, { transform: coerceBooleanProperty });	×
UNCOV 40		×
UNCOV 41	readonly defaultColors = input<string[]>();	×
42
43	recentColors: string[] = [];
UNCOV 44		×
UNCOV 45	newColor: string;	×
46
47	customPanelPopoverRef: ThyPopoverRef<ThyColorPickerCustomPanel>;
48
49	ngOnInit(): void {
50	const colors = localStorage.getItem('recentColors');
51	if (colors) {
52	this.recentColors = JSON.parse(colors);
53	}
54	}
55
56	selectColor(color: string) {
57	this.color.set(color);	×
58	this.colorChange()(this.color());	×
59	this.thyPopoverRef.close();
60	}
61
62	showMoreColor(event: Event) {
UNCOV 63	if (!this.customPanelPopoverRef) {	×
UNCOV 64	this.customPanelPopoverRef = this.thyPopover.open(ThyColorPickerCustomPanel, {	×
UNCOV 65	origin: event.currentTarget as HTMLElement,	×
UNCOV 66	offset: -4,	×
UNCOV 67	placement: 'rightBottom',	×
68	manualClosure: true,
UNCOV 69	width: '260px',	×
UNCOV 70	hasBackdrop: false,	×
UNCOV 71	viewContainerRef: this.viewContainerRef,	×
72	originActiveClass: 'thy-color-picker-active',
UNCOV 73	initialState: {	×
74	color: this.color(),
75	pickerColorChange: (value: string) => {
76	this.newColor = value;
UNCOV 77	this.colorChange()(value);	×
UNCOV 78	}	×
UNCOV 79	}	×
80	});
81	}	1✔
82	this.customPanelPopoverRef?.afterClosed().subscribe(() => {
83	if (this.newColor) {
84	const index = this.recentColors.findIndex(item => item === this.newColor);
85	if (index !== -1) {
86	this.recentColors.splice(index, 1);
87	}
88	this.recentColors.unshift(this.newColor);
89	this.recentColors = this.recentColors.slice(0, 10);	1✔
90	localStorage.setItem('recentColors', JSON.stringify(this.recentColors));
91	}
92	this.thyPopoverRef.close();
93	});
94	}
95
96	getIconColor(item: string) {
97	const rgba = new ThyColor(item).rgba;
98	const hsp = 0.299 * rgba.red + 0.587 * rgba.green + 0.114 * rgba.blue;
99	return hsp > 192 ? 'black' : 'white';
100	}
101	}

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