From b2a44952bfaa394a9f7833d83d02d47fb316b72c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mehmet=20=C3=87etin?= <92744169+mehmetcetin01140@users.noreply.github.com> Date: Thu, 11 Jul 2024 09:32:24 +0300 Subject: [PATCH 01/25] Use ngStyle attribute instead of style | Chart --- src/app/components/chart/chart.ts | 25 ++++++++++++++++++++++--- 1 file changed, 22 insertions(+), 3 deletions(-) diff --git a/src/app/components/chart/chart.ts b/src/app/components/chart/chart.ts index 3d34a8ab0d1..fd6842e5ba2 100755 --- a/src/app/components/chart/chart.ts +++ b/src/app/components/chart/chart.ts @@ -8,8 +8,23 @@ import Chart from 'chart.js/auto'; @Component({ selector: 'p-chart', template: ` -
- +
+
`, changeDetection: ChangeDetectionStrategy.OnPush, @@ -92,7 +107,11 @@ export class UIChart implements AfterViewInit, OnDestroy { chart: any; - constructor(@Inject(PLATFORM_ID) private platformId: any, public el: ElementRef, private zone: NgZone) {} + constructor( + @Inject(PLATFORM_ID) private platformId: any, + public el: ElementRef, + private zone: NgZone + ) {} ngAfterViewInit() { this.initChart(); From 9e095e393cac0d4e828fb700eba911ee0e41862f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mehmet=20=C3=87etin?= <92744169+mehmetcetin01140@users.noreply.github.com> Date: Thu, 11 Jul 2024 09:38:33 +0300 Subject: [PATCH 02/25] Use ngStyle attribute instead of style | Dialog --- src/app/components/dialog/dialog.ts | 14 +++++++++++--- 1 file changed, 11 insertions(+), 3 deletions(-) diff --git a/src/app/components/dialog/dialog.ts b/src/app/components/dialog/dialog.ts index aaccf7b1ca8..1bb3cb36fe2 100755 --- a/src/app/components/dialog/dialog.ts +++ b/src/app/components/dialog/dialog.ts @@ -51,7 +51,7 @@ const hideAnimation = animation([animate('{{transition}}', style({ transform: '{
@@ -274,6 +272,14 @@ export class DynamicDialogComponent implements AfterViewInit, OnDestroy { return dynamicDialogCount; } + get containerStyle() { + return { + ...this.config.style, + 'width': this.config.width, + 'height': this.config.height + }; + } + constructor( @Inject(DOCUMENT) private document: Document, @Inject(PLATFORM_ID) private platformId: any, From 80a49b1e079f944593922f194ac81b87dac92d23 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mehmet=20=C3=87etin?= <92744169+mehmetcetin01140@users.noreply.github.com> Date: Thu, 11 Jul 2024 10:09:11 +0300 Subject: [PATCH 04/25] Use ngStyle attribute instead of style | Progressbar --- src/app/components/progressbar/progressbar.ts | 29 +++++++++++++++++-- 1 file changed, 26 insertions(+), 3 deletions(-) diff --git a/src/app/components/progressbar/progressbar.ts b/src/app/components/progressbar/progressbar.ts index 70274c69ddd..ae67e2e999c 100755 --- a/src/app/components/progressbar/progressbar.ts +++ b/src/app/components/progressbar/progressbar.ts @@ -20,14 +20,37 @@ import { QueryList } from '@angular/core'; [attr.data-pc-section]="'root'" [ngClass]="{ 'p-progressbar p-component': true, 'p-progressbar-determinate': mode === 'determinate', 'p-progressbar-indeterminate': mode === 'indeterminate' }" > -
+
-
{{ value }}{{ unit }}
+
+ {{ value }}{{ unit }} +
-
+
`, From c5285eaf0f06bcada21a792751015e287481f640 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mehmet=20=C3=87etin?= <92744169+mehmetcetin01140@users.noreply.github.com> Date: Thu, 11 Jul 2024 10:41:53 +0300 Subject: [PATCH 05/25] Use ngStyle attribute instead of style | Table --- src/app/components/table/table.ts | 144 +++++++++++++++++++++++++----- 1 file changed, 122 insertions(+), 22 deletions(-) diff --git a/src/app/components/table/table.ts b/src/app/components/table/table.ts index 5945d7bb5cd..1b807503617 100644 --- a/src/app/components/table/table.ts +++ b/src/app/components/table/table.ts @@ -309,12 +309,33 @@ export class TableService {
- -
- +
@@ -1166,7 +1181,12 @@ export class Tree implements OnInit, AfterContentInit, OnChanges, OnDestroy, Blo public dragStopSubscription: Subscription | undefined | null; - constructor(public el: ElementRef, @Optional() public dragDropService: TreeDragDropService, public config: PrimeNGConfig, private cd: ChangeDetectorRef) {} + constructor( + public el: ElementRef, + @Optional() public dragDropService: TreeDragDropService, + public config: PrimeNGConfig, + private cd: ChangeDetectorRef + ) {} ngOnInit() { if (this.droppableNodes) { From 019f8bca0b278ca107557f9c2bc78bfa886b729b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mehmet=20=C3=87etin?= <92744169+mehmetcetin01140@users.noreply.github.com> Date: Thu, 11 Jul 2024 11:12:02 +0300 Subject: [PATCH 07/25] Use ngStyle attribute instead of style | TreeTable --- src/app/components/treetable/treetable.ts | 93 +++++++++++++++++++---- 1 file changed, 77 insertions(+), 16 deletions(-) diff --git a/src/app/components/treetable/treetable.ts b/src/app/components/treetable/treetable.ts index 36b758c73b1..b3dd6546e10 100755 --- a/src/app/components/treetable/treetable.ts +++ b/src/app/components/treetable/treetable.ts @@ -2263,7 +2263,11 @@ export class TTBody { subscription: Subscription; - constructor(public tt: TreeTable, public treeTableService: TreeTableService, public cd: ChangeDetectorRef) { + constructor( + public tt: TreeTable, + public treeTableService: TreeTableService, + public cd: ChangeDetectorRef + ) { this.subscription = this.tt.tableService.uiUpdateSource$.subscribe(() => { if (this.tt.virtualScroll) { this.cd.detectChanges(); @@ -2404,7 +2408,13 @@ export class TTScrollableView implements AfterViewInit, OnDestroy { } } - constructor(@Inject(PLATFORM_ID) private platformId: any, private renderer: Renderer2, public tt: TreeTable, public el: ElementRef, public zone: NgZone) {} + constructor( + @Inject(PLATFORM_ID) private platformId: any, + private renderer: Renderer2, + public tt: TreeTable, + public el: ElementRef, + public zone: NgZone + ) {} ngAfterViewInit() { if (isPlatformBrowser(this.platformId)) { @@ -2657,7 +2667,10 @@ export class TTSortIcon implements OnInit, OnDestroy { sortOrder: number | undefined; - constructor(public tt: TreeTable, public cd: ChangeDetectorRef) { + constructor( + public tt: TreeTable, + public cd: ChangeDetectorRef + ) { this.subscription = this.tt.tableService.sortSource$.subscribe((sortMeta) => { this.updateSortState(); this.cd.markForCheck(); @@ -2705,7 +2718,14 @@ export class TTResizableColumn implements AfterViewInit, OnDestroy { documentMouseUpListener: VoidListener; - constructor(@Inject(DOCUMENT) private document: Document, @Inject(PLATFORM_ID) private platformId: any, private renderer: Renderer2, public tt: TreeTable, public el: ElementRef, public zone: NgZone) {} + constructor( + @Inject(DOCUMENT) private document: Document, + @Inject(PLATFORM_ID) private platformId: any, + private renderer: Renderer2, + public tt: TreeTable, + public el: ElementRef, + public zone: NgZone + ) {} ngAfterViewInit() { if (isPlatformBrowser(this.platformId)) { @@ -2788,7 +2808,14 @@ export class TTReorderableColumn implements AfterViewInit, OnDestroy { mouseDownListener: VoidListener; - constructor(@Inject(DOCUMENT) private document: Document, @Inject(PLATFORM_ID) private platformId: any, private renderer: Renderer2, public tt: TreeTable, public el: ElementRef, public zone: NgZone) {} + constructor( + @Inject(DOCUMENT) private document: Document, + @Inject(PLATFORM_ID) private platformId: any, + private renderer: Renderer2, + public tt: TreeTable, + public el: ElementRef, + public zone: NgZone + ) {} ngAfterViewInit() { if (this.isEnabled()) { @@ -2887,7 +2914,10 @@ export class TTSelectableRow implements OnInit, OnDestroy { subscription: Subscription | undefined; - constructor(public tt: TreeTable, public tableService: TreeTableService) { + constructor( + public tt: TreeTable, + public tableService: TreeTableService + ) { if (this.isEnabled()) { this.subscription = this.tt.tableService.selectionSource$.subscribe(() => { this.selected = this.tt.isSelected(this.rowNode.node); @@ -2970,7 +3000,10 @@ export class TTSelectableRowDblClick implements OnInit, OnDestroy { subscription: Subscription | undefined; - constructor(public tt: TreeTable, public tableService: TreeTableService) { + constructor( + public tt: TreeTable, + public tableService: TreeTableService + ) { if (this.isEnabled()) { this.subscription = this.tt.tableService.selectionSource$.subscribe(() => { this.selected = this.tt.isSelected(this.rowNode.node); @@ -3022,7 +3055,11 @@ export class TTContextMenuRow { subscription: Subscription | undefined; - constructor(public tt: TreeTable, public tableService: TreeTableService, private el: ElementRef) { + constructor( + public tt: TreeTable, + public tableService: TreeTableService, + private el: ElementRef + ) { if (this.isEnabled()) { this.subscription = this.tt.tableService.contextMenuSource$.subscribe((node) => { this.selected = this.tt.equals(this.rowNode.node, node); @@ -3092,7 +3129,11 @@ export class TTCheckbox { subscription: Subscription | undefined; - constructor(public tt: TreeTable, public tableService: TreeTableService, public cd: ChangeDetectorRef) { + constructor( + public tt: TreeTable, + public tableService: TreeTableService, + public cd: ChangeDetectorRef + ) { this.subscription = this.tt.tableService.selectionSource$.subscribe(() => { if (this.tt.selectionKeys) { this.checked = this.tt.isNodeSelected(this.rowNode.node); @@ -3186,7 +3227,11 @@ export class TTHeaderCheckbox { valueChangeSubscription: Subscription; - constructor(public tt: TreeTable, public tableService: TreeTableService, private cd: ChangeDetectorRef) { + constructor( + public tt: TreeTable, + public tableService: TreeTableService, + private cd: ChangeDetectorRef + ) { this.valueChangeSubscription = this.tt.tableService.uiUpdateSource$.subscribe(() => { this.checked = this.updateCheckedState(); }); @@ -3274,7 +3319,11 @@ export class TTEditableColumn implements AfterViewInit { @Input({ transform: booleanAttribute }) ttEditableColumnDisabled: boolean | undefined; - constructor(public tt: TreeTable, public el: ElementRef, public zone: NgZone) {} + constructor( + public tt: TreeTable, + public el: ElementRef, + public zone: NgZone + ) {} ngAfterViewInit() { if (this.isEnabled()) { @@ -3449,7 +3498,10 @@ export class TreeTableCellEditor implements AfterContentInit { outputTemplate: Nullable>; - constructor(public tt: TreeTable, public editableColumn: TTEditableColumn) {} + constructor( + public tt: TreeTable, + public editableColumn: TTEditableColumn + ) {} ngAfterContentInit() { (this.templates as QueryList).forEach((item) => { @@ -3493,7 +3545,11 @@ export class TTRow { @Input('ttRow') rowNode: any; - constructor(public tt: TreeTable, public el: ElementRef, public zone: NgZone) {} + constructor( + public tt: TreeTable, + public el: ElementRef, + public zone: NgZone + ) {} @HostListener('keydown', ['$event']) onKeyDown(event: KeyboardEvent) { @@ -3671,8 +3727,10 @@ export class TTRow { (click)="onClick($event)" tabindex="-1" pRipple - [style.visibility]="rowNode.node.leaf === false || (rowNode.node.children && rowNode.node.children.length) ? 'visible' : 'hidden'" - [style.marginLeft]="rowNode.level * 16 + 'px'" + [ngStyle]="{ + visibility: rowNode.node.leaf === false || (rowNode.node.children && rowNode.node.children.length) ? 'visible' : 'hidden', + 'margin-left': rowNode.level * 16 + 'px' + }" [attr.data-pc-section]="'rowtoggler'" [attr.data-pc-group-section]="'rowactionbutton'" [attr.aria-label]="toggleButtonAriaLabel" @@ -3692,7 +3750,10 @@ export class TTRow { export class TreeTableToggler { @Input() rowNode: any; - constructor(public tt: TreeTable, private config: PrimeNGConfig) {} + constructor( + public tt: TreeTable, + private config: PrimeNGConfig + ) {} get toggleButtonAriaLabel() { return this.config.translation ? (this.rowNode.expanded ? this.config.translation.aria.collapseRow : this.config.translation.aria.expandRow) : undefined; From 93598fc966c7fa47a7eebd773271b4943ceddf1c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mehmet=20=C3=87etin?= <92744169+mehmetcetin01140@users.noreply.github.com> Date: Thu, 11 Jul 2024 11:14:42 +0300 Subject: [PATCH 08/25] Use ngStyle attribute instead of style | Accordion --- src/app/components/accordion/accordion.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/app/components/accordion/accordion.ts b/src/app/components/accordion/accordion.ts index 7b46b274d8e..140c529e14a 100755 --- a/src/app/components/accordion/accordion.ts +++ b/src/app/components/accordion/accordion.ts @@ -40,7 +40,7 @@ import { UniqueComponentId } from 'primeng/utils';
Date: Thu, 11 Jul 2024 11:22:17 +0300 Subject: [PATCH 09/25] Use ngStyle attribute instead of style | AutoComplete --- src/app/components/autocomplete/autocomplete.ts | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/src/app/components/autocomplete/autocomplete.ts b/src/app/components/autocomplete/autocomplete.ts index da00d7b009a..21c479145b6 100755 --- a/src/app/components/autocomplete/autocomplete.ts +++ b/src/app/components/autocomplete/autocomplete.ts @@ -194,7 +194,7 @@ export const AUTOCOMPLETE_VALUE_ACCESSOR: any = { (onAnimationStart)="onOverlayAnimationStart($event)" (onHide)="hide()" > -
+
Date: Thu, 11 Jul 2024 11:39:11 +0300 Subject: [PATCH 10/25] Use ngStyle attribute instead of style | ContextMenu --- src/app/components/contextmenu/contextmenu.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/app/components/contextmenu/contextmenu.ts b/src/app/components/contextmenu/contextmenu.ts index 963b9f9182f..616d1205004 100755 --- a/src/app/components/contextmenu/contextmenu.ts +++ b/src/app/components/contextmenu/contextmenu.ts @@ -62,7 +62,7 @@ import { ObjectUtils, UniqueComponentId, ZIndexUtils } from 'primeng/utils';
  • Date: Thu, 11 Jul 2024 11:49:38 +0300 Subject: [PATCH 11/25] Use ngStyle attribute instead of style | Dropdown --- src/app/components/dropdown/dropdown.ts | 18 +++++++++++++++--- 1 file changed, 15 insertions(+), 3 deletions(-) diff --git a/src/app/components/dropdown/dropdown.ts b/src/app/components/dropdown/dropdown.ts index 235e27a01cc..9ef7f9b9916 100755 --- a/src/app/components/dropdown/dropdown.ts +++ b/src/app/components/dropdown/dropdown.ts @@ -268,7 +268,12 @@ export class DropdownItem {
    • -
    +
    -
      +
      • @@ -1012,7 +1017,14 @@ export class Dropdown implements OnInit, AfterViewInit, AfterContentInit, AfterV editableInputValue = computed(() => this.getOptionLabel(this.selectedOption) || this.modelValue() || ''); - constructor(public el: ElementRef, public renderer: Renderer2, public cd: ChangeDetectorRef, public zone: NgZone, public filterService: FilterService, public config: PrimeNGConfig) { + constructor( + public el: ElementRef, + public renderer: Renderer2, + public cd: ChangeDetectorRef, + public zone: NgZone, + public filterService: FilterService, + public config: PrimeNGConfig + ) { effect(() => { const modelValue = this.modelValue(); const visibleOptions = this.visibleOptions(); From 4f5af0daa0e7b7f740527459399a6e4b68a8c6f4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mehmet=20=C3=87etin?= <92744169+mehmetcetin01140@users.noreply.github.com> Date: Thu, 11 Jul 2024 12:01:15 +0300 Subject: [PATCH 12/25] Use ngStyle attribute instead of style | Listbox --- src/app/components/listbox/listbox.ts | 19 ++++++++++++++++--- 1 file changed, 16 insertions(+), 3 deletions(-) diff --git a/src/app/components/listbox/listbox.ts b/src/app/components/listbox/listbox.ts index 545cf4d73f9..6bc8eaeef3f 100755 --- a/src/app/components/listbox/listbox.ts +++ b/src/app/components/listbox/listbox.ts @@ -117,7 +117,14 @@ export const LISTBOX_VALUE_ACCESSOR: any = {
    -
    +
    Date: Thu, 11 Jul 2024 12:09:06 +0300 Subject: [PATCH 13/25] Use ngStyle attribute instead of style | MegaMenu --- src/app/components/megamenu/megamenu.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/app/components/megamenu/megamenu.ts b/src/app/components/megamenu/megamenu.ts index fe320732195..4fe9fa9f5de 100755 --- a/src/app/components/megamenu/megamenu.ts +++ b/src/app/components/megamenu/megamenu.ts @@ -57,7 +57,7 @@ import { ObjectUtils, UniqueComponentId } from 'primeng/utils';
  • Date: Thu, 11 Jul 2024 12:11:43 +0300 Subject: [PATCH 14/25] Use ngStyle attribute instead of style | Menubar --- src/app/components/menubar/menubar.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/app/components/menubar/menubar.ts b/src/app/components/menubar/menubar.ts index a169503ff41..29e99334286 100755 --- a/src/app/components/menubar/menubar.ts +++ b/src/app/components/menubar/menubar.ts @@ -73,7 +73,7 @@ export class MenubarService {
  • Date: Thu, 11 Jul 2024 12:18:38 +0300 Subject: [PATCH 15/25] Use ngStyle attribute instead of style | multiselect --- src/app/components/multiselect/multiselect.ts | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/src/app/components/multiselect/multiselect.ts b/src/app/components/multiselect/multiselect.ts index a6cf3d381a4..5bc73ae2e21 100755 --- a/src/app/components/multiselect/multiselect.ts +++ b/src/app/components/multiselect/multiselect.ts @@ -25,7 +25,6 @@ import { Renderer2, Signal, signal, - SimpleChanges, TemplateRef, ViewChild, ViewEncapsulation @@ -346,7 +345,7 @@ export class MultiSelectItem {
    • -
    +
    -
    - -