From 39b1259c1a80a419c2296c95f31bc9ce12b98938 Mon Sep 17 00:00:00 2001
From: Vineeth Prakash <gudipallivineethprakash@karunya.edu.in>
Date: Sat, 9 Jul 2022 12:26:45 +0530
Subject: [PATCH 01/20] Replaced p-chkbox-* to p-checkbox-*

---
 src/app/showcase/components/checkbox/checkboxdemo.html    | 8 ++++----
 .../showcase/components/radiobutton/radiobuttondemo.html  | 2 +-
 .../components/tristatecheckbox/tristatecheckboxdemo.html | 6 +++---
 3 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/app/showcase/components/checkbox/checkboxdemo.html b/src/app/showcase/components/checkbox/checkboxdemo.html
index f309b8c71cd..8978ba44444 100755
--- a/src/app/showcase/components/checkbox/checkboxdemo.html
+++ b/src/app/showcase/components/checkbox/checkboxdemo.html
@@ -280,19 +280,19 @@ <h5>Styling</h5>
                     </thead>
                     <tbody>
                         <tr>
-                            <td>p-chkbox</td>
+                            <td>p-checkbox</td>
                             <td>Container element</td>
                         </tr>
                         <tr>
-                            <td>p-chkbox-box</td>
+                            <td>p-checkbox-box</td>
                             <td>Container of icon.</td>
                         </tr>
                         <tr>
-                            <td>p-chkbox-icon</td>
+                            <td>p-checkbox-icon</td>
                             <td>Icon element.</td>
                         </tr>
                         <tr>
-                            <td>p-chkbox-label</td>
+                            <td>p-checkbox-label</td>
                             <td>Label element.</td>
                         </tr>
                         <tr>
diff --git a/src/app/showcase/components/radiobutton/radiobuttondemo.html b/src/app/showcase/components/radiobutton/radiobuttondemo.html
index e3d80911436..90573b81509 100755
--- a/src/app/showcase/components/radiobutton/radiobuttondemo.html
+++ b/src/app/showcase/components/radiobutton/radiobuttondemo.html
@@ -235,7 +235,7 @@ <h5>Styling</h5>
                             <td>Icon element.</td>
                         </tr>
                         <tr>
-                            <td>p-chkbox-label</td>
+                            <td>p-checkbox-label</td>
                             <td>Label element.</td>
                         </tr>
                         <tr>
diff --git a/src/app/showcase/components/tristatecheckbox/tristatecheckboxdemo.html b/src/app/showcase/components/tristatecheckbox/tristatecheckboxdemo.html
index 7ad7b2b0381..96ca46e0ef9 100755
--- a/src/app/showcase/components/tristatecheckbox/tristatecheckboxdemo.html
+++ b/src/app/showcase/components/tristatecheckbox/tristatecheckboxdemo.html
@@ -158,7 +158,7 @@ <h5>Styling</h5>
                     </thead>
                     <tbody>
                         <tr>
-                            <td>p-chkbox</td>
+                            <td>p-checkbox</td>
                             <td>Container element</td>
                         </tr>
                         <tr>
@@ -166,11 +166,11 @@ <h5>Styling</h5>
                             <td>Container element</td>
                         </tr>
                         <tr>
-                            <td>p-chkbox-box</td>
+                            <td>p-checkbox-box</td>
                             <td>Container of icon.</td>
                         </tr>
                         <tr>
-                            <td>p-chkbox-icon</td>
+                            <td>p-checkbox-icon</td>
                             <td>Icon element.</td>
                         </tr>
                     </tbody>

From 762a74bbfd73cbb261f26b3ac9025615b83e352e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?KISTERS=5CBenjamin=20Sch=C3=B6n?=
 <84901454+Kisters-BS@users.noreply.github.com>
Date: Wed, 20 Jul 2022 10:27:29 +0200
Subject: [PATCH 02/20] Fix issue links

---
 CHANGELOG.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index e9f0573df6f..7efb74f9a7e 100755
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -12,7 +12,7 @@
 - p-calendar is hidden while in a p-panel [\#11685](https://github.com/primefaces/primeng/issues/11685)
 - Badge: Whitespaces are added before & after string [\#11627](https://github.com/primefaces/primeng/issues/11627)
 - P-Tree: Duplicated render [\#11669](https://github.com/primefaces/primeng/issues/11669)
-- The scrollTo method is not working as expected on Scroller API [\#11669](https://github.com/primefaces/primeng/issues/11669)
+- The scrollTo method is not working as expected on Scroller API [\#11675](https://github.com/primefaces/primeng/issues/11675)
 - Dropdown: Options grouping feature is not working [\#11672](https://github.com/primefaces/primeng/issues/11672)
 
 ## [14.0.0-rc.1](https://github.com/primefaces/primeng/tree/14.0.0-rc.1) (2022-06-29)
@@ -42,7 +42,7 @@
 
 **Fixed bugs:**
 - Dropdown method "show" not working [\#11648](https://github.com/primefaces/primeng/issues/11648)
-- Scrolling in a t-table that implements virtual scrolling and lazy loading bugs out the header of the t-table [\#11617](https://github.com/primefaces/primeng/issues/11617)
+- Scrolling in a t-table that implements virtual scrolling and lazy loading bugs out the header of the t-table [\#10630](https://github.com/primefaces/primeng/issues/10630)
 - Dropdown | ng-dirty issue when options are set by a service call [\#11634](https://github.com/primefaces/primeng/issues/11634)
 - Dialog bottom has no border radius when footer does not exist [\#11626](https://github.com/primefaces/primeng/issues/11626)
 - AutoComplete showClear is not working when dropdown is enabled [\#11592](https://github.com/primefaces/primeng/issues/11592)

From e2edd8744c6475889875efedf28c0c83a3844eb3 Mon Sep 17 00:00:00 2001
From: Cagatay Civici <cagatay.civici@gmail.com>
Date: Thu, 11 Aug 2022 15:38:46 +0300
Subject: [PATCH 03/20] Fixed test

---
 src/app/components/inputmask/inputmask.spec.ts | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/app/components/inputmask/inputmask.spec.ts b/src/app/components/inputmask/inputmask.spec.ts
index 5266299d4b9..446266cea20 100755
--- a/src/app/components/inputmask/inputmask.spec.ts
+++ b/src/app/components/inputmask/inputmask.spec.ts
@@ -53,7 +53,6 @@ describe('InputMask', () => {
         inputmask.size = 5;
         inputmask.tabindex = "1";
         inputmask.required = true;
-        inputmask.autoFocus = true;
         inputmask.title = "TheTitle";
         fixture.detectChanges();
 
@@ -66,7 +65,6 @@ describe('InputMask', () => {
         expect(inputMaskEl.nativeElement.size).toEqual(5);
         expect(inputMaskEl.nativeElement.tabIndex).toEqual(1);
         expect(inputMaskEl.nativeElement.required).toBeTruthy();
-        expect(inputMaskEl.nativeElement.autofocus).toBeTruthy();
         expect(inputMaskEl.nativeElement.title).toEqual("TheTitle");
     });
 

From 964caad8984344db48b9d07dbd78e5638e6a18cb Mon Sep 17 00:00:00 2001
From: quran <guustavc@hotmail.com>
Date: Wed, 17 Aug 2022 11:30:49 +0200
Subject: [PATCH 04/20] Disappears correctly when removing files

---
 src/app/components/fileupload/fileupload.ts | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/app/components/fileupload/fileupload.ts b/src/app/components/fileupload/fileupload.ts
index 1aa90cb2329..572aeb50a2d 100755
--- a/src/app/components/fileupload/fileupload.ts
+++ b/src/app/components/fileupload/fileupload.ts
@@ -441,6 +441,7 @@ export class FileUpload implements AfterViewInit,AfterContentInit,OnInit,OnDestr
         this.clearInputElement();
         this.onRemove.emit({originalEvent: event, file: this.files[index]});
         this.files.splice(index, 1);
+        this.checkFileLimit();
     }
 
     isFileLimitExceeded() {
@@ -462,6 +463,8 @@ export class FileUpload implements AfterViewInit,AfterContentInit,OnInit,OnDestr
                 summary: this.invalidFileLimitMessageSummary.replace('{0}', this.fileLimit.toString()),
                 detail: this.invalidFileLimitMessageDetail.replace('{0}', this.fileLimit.toString())
             });
+        } else {
+            this.msgs = [];
         }
     }
 

From 5cfd9f9136814611809ba6597d9905e56d00de06 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=87etin?=
 <69278826+cetincakiroglu@users.noreply.github.com>
Date: Fri, 19 Aug 2022 12:25:16 +0300
Subject: [PATCH 05/20] Fixed #11841 - pColumnFilter | Filter is applied by
 adding a new constraint

---
 src/app/components/table/table.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/app/components/table/table.ts b/src/app/components/table/table.ts
index a6dea4102bf..c30f781571d 100755
--- a/src/app/components/table/table.ts
+++ b/src/app/components/table/table.ts
@@ -4612,7 +4612,6 @@ export class ColumnFilter implements AfterContentInit {
 
     addConstraint() {
         (<FilterMetadata[]> this.dt.filters[this.field]).push({value: null, matchMode: this.getDefaultMatchMode(), operator: this.getDefaultOperator()});
-        this.dt._filter();
     }
 
     removeConstraint(filterMeta: FilterMetadata) {

From 57fc2ca2480933308cfa64a1427d98988dd33bd0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=87etin?=
 <69278826+cetincakiroglu@users.noreply.github.com>
Date: Fri, 19 Aug 2022 12:32:15 +0300
Subject: [PATCH 06/20] Fixed #11843 - Table | LazyLoad emits before onPage
 event

---
 src/app/components/table/table.ts | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/app/components/table/table.ts b/src/app/components/table/table.ts
index c30f781571d..8723f9c8fda 100755
--- a/src/app/components/table/table.ts
+++ b/src/app/components/table/table.ts
@@ -865,15 +865,15 @@ export class Table implements OnInit, AfterViewInit, AfterContentInit, Blockable
         this.first = event.first;
         this.rows = event.rows;
 
-        if (this.lazy) {
-            this.onLazyLoad.emit(this.createLazyLoadMetadata());
-        }
-
         this.onPage.emit({
             first: this.first,
             rows: this.rows
         });
 
+        if (this.lazy) {
+            this.onLazyLoad.emit(this.createLazyLoadMetadata());
+        }
+
         this.firstChange.emit(this.first);
         this.rowsChange.emit(this.rows);
         this.tableService.onValueChange(this.value);

From 34770f43abe10088d6521d4f071d7d0704a842ca Mon Sep 17 00:00:00 2001
From: Egor Volvachev <axe.onegaimy@gmail.com>
Date: Sat, 20 Aug 2022 18:37:32 +0300
Subject: [PATCH 07/20] fix(primeng/dropdown): fix clear button logic for empty
 string value

Fixes #11836.
---
 src/app/components/dropdown/dropdown.ts | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/app/components/dropdown/dropdown.ts b/src/app/components/dropdown/dropdown.ts
index cf6c55e0ae5..028bf53239f 100755
--- a/src/app/components/dropdown/dropdown.ts
+++ b/src/app/components/dropdown/dropdown.ts
@@ -82,7 +82,7 @@ export class DropdownItem {
             <span [ngClass]="{'p-dropdown-label p-inputtext p-placeholder':true,'p-dropdown-label-empty': (placeholder == null || placeholder.length === 0)}" *ngIf="!editable && (label == null)">{{placeholder||'empty'}}</span>
             <input #editableInput type="text" [attr.maxlength]="maxlength" class="p-dropdown-label p-inputtext" *ngIf="editable" [disabled]="disabled" [attr.placeholder]="placeholder"
                 aria-haspopup="listbox" [attr.aria-expanded]="overlayVisible" (click)="onEditableInputClick()" (input)="onEditableInputChange($event)" (focus)="onEditableInputFocus($event)" (blur)="onInputBlur($event)">
-            <i class="p-dropdown-clear-icon pi pi-times" (click)="clear($event)" *ngIf="value != null && showClear && !disabled"></i>
+            <i class="p-dropdown-clear-icon pi pi-times" (click)="clear($event)" *ngIf="isVisibleClearIcon"></i>
             <div class="p-dropdown-trigger" role="button" aria-label="dropdown trigger" aria-haspopup="listbox" [attr.aria-expanded]="overlayVisible">
                 <span class="p-dropdown-trigger-icon" [ngClass]="dropdownIcon"></span>
             </div>
@@ -536,6 +536,10 @@ export class Dropdown implements OnInit,AfterViewInit,AfterContentInit,AfterView
         return this.value || this.value != null || this.value != undefined;
     }
 
+    get isVisibleClearIcon(): boolean {
+        return (this.value != null && this.value !== '') && this.showClear && !this.disabled;
+    }
+
     updateEditableLabel(): void {
         if (this.editableInputViewChild && this.editableInputViewChild.nativeElement) {
             this.editableInputViewChild.nativeElement.value = (this.selectedOption ? this.getOptionLabel(this.selectedOption) : this.value||'');

From 7b04f0594cecd6de502db980485c5fd525f636e6 Mon Sep 17 00:00:00 2001
From: Egor Volvachev <axe.onegaimy@gmail.com>
Date: Sat, 20 Aug 2022 19:45:45 +0300
Subject: [PATCH 08/20] fix(primeng/editor): fix quill editor inside dialog

Fixes #11814.
---
 src/app/components/editor/editor.ts | 146 ++++++++++++++++++----------
 1 file changed, 94 insertions(+), 52 deletions(-)

diff --git a/src/app/components/editor/editor.ts b/src/app/components/editor/editor.ts
index 66414bb8074..93b31294061 100755
--- a/src/app/components/editor/editor.ts
+++ b/src/app/components/editor/editor.ts
@@ -1,9 +1,26 @@
-import {NgModule,Component,ElementRef,AfterViewInit,Input,Output,EventEmitter,ContentChild,forwardRef,ChangeDetectionStrategy, ViewEncapsulation, ContentChildren, QueryList, AfterContentInit, TemplateRef} from '@angular/core';
+import {
+    NgModule,
+    Component,
+    ElementRef,
+    AfterViewInit,
+    Input,
+    Output,
+    EventEmitter,
+    ContentChild,
+    forwardRef,
+    ChangeDetectionStrategy,
+    ViewEncapsulation,
+    ContentChildren,
+    QueryList,
+    AfterContentInit,
+    TemplateRef,
+    AfterViewChecked
+} from '@angular/core';
 import {CommonModule} from '@angular/common';
 import {SharedModule,Header, PrimeTemplate} from 'primeng/api'
 import {DomHandler} from 'primeng/dom';
 import {NG_VALUE_ACCESSOR, ControlValueAccessor} from '@angular/forms';
-import Quill from "quill";
+import Quill from 'quill';
 
 export const EDITOR_VALUE_ACCESSOR: any = {
   provide: NG_VALUE_ACCESSOR,
@@ -71,7 +88,7 @@ export const EDITOR_VALUE_ACCESSOR: any = {
         'class': 'p-element'
     }
 })
-export class Editor implements AfterViewInit,AfterContentInit,ControlValueAccessor {
+export class Editor implements AfterViewInit,AfterViewChecked,AfterContentInit,ControlValueAccessor {
 
     @Output() onTextChange: EventEmitter<any> = new EventEmitter();
 
@@ -111,14 +128,78 @@ export class Editor implements AfterViewInit,AfterContentInit,ControlValueAccess
 
     headerTemplate: TemplateRef<any>;
 
+    private quillElements: {editorElement: HTMLElement, toolbarElement: HTMLElement} | null = null;
+
     constructor(public el: ElementRef) {}
 
-    ngAfterViewInit() {
-        let editorElement = DomHandler.findSingle(this.el.nativeElement ,'div.p-editor-content');
-        let toolbarElement = DomHandler.findSingle(this.el.nativeElement ,'div.p-editor-toolbar');
+    ngAfterViewInit(): void {
+        this.initQuillElements();
+
+        if (this.quillElements?.editorElement?.isConnected) {
+            this.initQuillEditor();
+        }
+    }
+    
+    ngAfterViewChecked(): void {
+        if (!this.quill && this.quillElements?.editorElement?.isConnected) {
+            this.initQuillEditor();
+        }
+    }
+
+    ngAfterContentInit() {
+        this.templates.forEach((item) => {
+            switch(item.getType()) {
+                case 'header':
+                    this.headerTemplate = item.template;
+                break;
+            }
+        });
+    }
+
+    writeValue(value: any) : void {
+        this.value = value;
+
+        if (this.quill) {
+            if (value)
+                this.quill.setContents(this.quill.clipboard.convert(value));
+            else
+                this.quill.setText('');
+        }
+    }
+
+    registerOnChange(fn: Function): void {
+        this.onModelChange = fn;
+    }
+
+    registerOnTouched(fn: Function): void {
+        this.onModelTouched = fn;
+    }
+
+    getQuill() {
+        return this.quill;
+    }
+
+    @Input() get readonly(): boolean {
+        return this._readonly;
+    }
+
+    set readonly(val:boolean) {
+        this._readonly = val;
+
+        if (this.quill) {
+            if (this._readonly)
+                this.quill.disable();
+            else
+                this.quill.enable();
+        }
+    }
+
+    private initQuillEditor(): void {
+        this.initQuillElements();
+
+        const { toolbarElement, editorElement } = this.quillElements;
         let defaultModule  = {toolbar: toolbarElement};
         let modules = this.modules ? {...defaultModule, ...this.modules} : defaultModule;
-
         this.quill = new Quill(editorElement, {
             modules: modules,
             placeholder: this.placeholder,
@@ -167,51 +248,12 @@ export class Editor implements AfterViewInit,AfterContentInit,ControlValueAccess
         });
     }
 
-    ngAfterContentInit() {
-        this.templates.forEach((item) => {
-            switch(item.getType()) {
-                case 'header':
-                    this.headerTemplate = item.template;
-                break;
-            }
-        });
-    }
-
-    writeValue(value: any) : void {
-        this.value = value;
-
-        if (this.quill) {
-            if (value)
-                this.quill.setContents(this.quill.clipboard.convert(value));
-            else
-                this.quill.setText('');
-        }
-    }
-
-    registerOnChange(fn: Function): void {
-        this.onModelChange = fn;
-    }
-
-    registerOnTouched(fn: Function): void {
-        this.onModelTouched = fn;
-    }
-
-    getQuill() {
-        return this.quill;
-    }
-
-    @Input() get readonly(): boolean {
-        return this._readonly;
-    }
-
-    set readonly(val:boolean) {
-        this._readonly = val;
-
-        if (this.quill) {
-            if (this._readonly)
-                this.quill.disable();
-            else
-                this.quill.enable();
+    private initQuillElements(): void {
+        if (!this.quillElements) {
+            this.quillElements = {
+                editorElement: DomHandler.findSingle(this.el.nativeElement ,'div.p-editor-content'),
+                toolbarElement: DomHandler.findSingle(this.el.nativeElement ,'div.p-editor-toolbar')
+            };
         }
     }
 }

From 8c9acaa5fbe590ebbf2c3c260e5a3d050602b06c Mon Sep 17 00:00:00 2001
From: Cagatay Civici <cagatay.civici@gmail.com>
Date: Mon, 22 Aug 2022 19:41:17 +0300
Subject: [PATCH 09/20] Fixed email

---
 src/app/showcase/components/uikit/uikit.component.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/showcase/components/uikit/uikit.component.html b/src/app/showcase/components/uikit/uikit.component.html
index 5c57f1da58c..17d1f2614a2 100755
--- a/src/app/showcase/components/uikit/uikit.component.html
+++ b/src/app/showcase/components/uikit/uikit.component.html
@@ -211,7 +211,7 @@
                             </li>
                         </ul>
                         <hr class="mb-3 mx-0 border-top-1 border-none surface-border" />
-                        <a href="mailto:contact@primetek:com.tr" pRipple class="bg-bluegray-500 text-white hover:bg-bluegray-400 p-3 w-full border-round text-center transition-colors transition-duration-300 font-bold">Contact Us</a>
+                        <a href="mailto:contact@primetek.com.tr" pRipple class="bg-bluegray-500 text-white hover:bg-bluegray-400 p-3 w-full border-round text-center transition-colors transition-duration-300 font-bold">Contact Us</a>
                     </div>
                 </div>
             </div>

From 684c4598328c797a0ea31e3ac64a2537a9c5ea08 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=87etin?=
 <69278826+cetincakiroglu@users.noreply.github.com>
Date: Tue, 23 Aug 2022 14:40:48 +0300
Subject: [PATCH 10/20] Fixed #11855 - TabView | remove unnecessary background
 color

---
 src/assets/components/themes/lara-dark-blue/theme.css    | 1 -
 src/assets/components/themes/lara-dark-indigo/theme.css  | 1 -
 src/assets/components/themes/lara-dark-purple/theme.css  | 1 -
 src/assets/components/themes/lara-dark-teal/theme.css    | 1 -
 src/assets/components/themes/lara-light-blue/theme.css   | 1 -
 src/assets/components/themes/lara-light-indigo/theme.css | 1 -
 src/assets/components/themes/lara-light-purple/theme.css | 1 -
 src/assets/components/themes/lara-light-teal/theme.css   | 1 -
 8 files changed, 8 deletions(-)

diff --git a/src/assets/components/themes/lara-dark-blue/theme.css b/src/assets/components/themes/lara-dark-blue/theme.css
index 3cddbcc8f05..e22eeace4fa 100644
--- a/src/assets/components/themes/lara-dark-blue/theme.css
+++ b/src/assets/components/themes/lara-dark-blue/theme.css
@@ -6191,7 +6191,6 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   position: absolute;
   bottom: 0;
   height: 2px;
-  background-color: #93C5FD;
   transition: 500ms cubic-bezier(0.35, 0, 0.25, 1);
 }
 
diff --git a/src/assets/components/themes/lara-dark-indigo/theme.css b/src/assets/components/themes/lara-dark-indigo/theme.css
index 781217cb5cd..3be684ffad3 100644
--- a/src/assets/components/themes/lara-dark-indigo/theme.css
+++ b/src/assets/components/themes/lara-dark-indigo/theme.css
@@ -6191,7 +6191,6 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   position: absolute;
   bottom: 0;
   height: 2px;
-  background-color: #A5B4FC;
   transition: 500ms cubic-bezier(0.35, 0, 0.25, 1);
 }
 
diff --git a/src/assets/components/themes/lara-dark-purple/theme.css b/src/assets/components/themes/lara-dark-purple/theme.css
index 29ec3d618fe..b1a29817386 100644
--- a/src/assets/components/themes/lara-dark-purple/theme.css
+++ b/src/assets/components/themes/lara-dark-purple/theme.css
@@ -6191,7 +6191,6 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   position: absolute;
   bottom: 0;
   height: 2px;
-  background-color: #C4B5FD;
   transition: 500ms cubic-bezier(0.35, 0, 0.25, 1);
 }
 
diff --git a/src/assets/components/themes/lara-dark-teal/theme.css b/src/assets/components/themes/lara-dark-teal/theme.css
index 087cb5be8fa..372318e6b71 100644
--- a/src/assets/components/themes/lara-dark-teal/theme.css
+++ b/src/assets/components/themes/lara-dark-teal/theme.css
@@ -6191,7 +6191,6 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   position: absolute;
   bottom: 0;
   height: 2px;
-  background-color: #5EEAD4;
   transition: 500ms cubic-bezier(0.35, 0, 0.25, 1);
 }
 
diff --git a/src/assets/components/themes/lara-light-blue/theme.css b/src/assets/components/themes/lara-light-blue/theme.css
index 28a5bdb61fb..3cf062267a2 100644
--- a/src/assets/components/themes/lara-light-blue/theme.css
+++ b/src/assets/components/themes/lara-light-blue/theme.css
@@ -6191,7 +6191,6 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   position: absolute;
   bottom: 0;
   height: 2px;
-  background-color: #3B82F6;
   transition: 500ms cubic-bezier(0.35, 0, 0.25, 1);
 }
 
diff --git a/src/assets/components/themes/lara-light-indigo/theme.css b/src/assets/components/themes/lara-light-indigo/theme.css
index f4cfe0dc29a..a0ed36aac27 100644
--- a/src/assets/components/themes/lara-light-indigo/theme.css
+++ b/src/assets/components/themes/lara-light-indigo/theme.css
@@ -6191,7 +6191,6 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   position: absolute;
   bottom: 0;
   height: 2px;
-  background-color: #6366F1;
   transition: 500ms cubic-bezier(0.35, 0, 0.25, 1);
 }
 
diff --git a/src/assets/components/themes/lara-light-purple/theme.css b/src/assets/components/themes/lara-light-purple/theme.css
index ff1cf18a584..20b3b4c67da 100644
--- a/src/assets/components/themes/lara-light-purple/theme.css
+++ b/src/assets/components/themes/lara-light-purple/theme.css
@@ -6191,7 +6191,6 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   position: absolute;
   bottom: 0;
   height: 2px;
-  background-color: #8B5CF6;
   transition: 500ms cubic-bezier(0.35, 0, 0.25, 1);
 }
 
diff --git a/src/assets/components/themes/lara-light-teal/theme.css b/src/assets/components/themes/lara-light-teal/theme.css
index a88168cfc24..b58ab5de92d 100644
--- a/src/assets/components/themes/lara-light-teal/theme.css
+++ b/src/assets/components/themes/lara-light-teal/theme.css
@@ -6191,7 +6191,6 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   position: absolute;
   bottom: 0;
   height: 2px;
-  background-color: #14B8A6;
   transition: 500ms cubic-bezier(0.35, 0, 0.25, 1);
 }
 

From daa4785d417adf98364f66ff017e55c2bc533fea Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=87etin?=
 <69278826+cetincakiroglu@users.noreply.github.com>
Date: Tue, 23 Aug 2022 15:41:36 +0300
Subject: [PATCH 11/20] Fixed #11848 - Accordion | Remove broken css

---
 src/app/components/accordion/accordion.css | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/src/app/components/accordion/accordion.css b/src/app/components/accordion/accordion.css
index 83a805a2c95..6c507105ce1 100755
--- a/src/app/components/accordion/accordion.css
+++ b/src/app/components/accordion/accordion.css
@@ -15,10 +15,6 @@
     line-height: 1;
 }
 
-.p-accordion-tab-active .p-toggleable-content:not(.ng-animating) {
-    overflow: visible;
-}
-
 .p-accordion .p-toggleable-content{
     overflow: hidden;
 }
\ No newline at end of file

From 2a806f4a79999fa27c66dfa512c473cd85fc80f8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=87etin?=
 <69278826+cetincakiroglu@users.noreply.github.com>
Date: Tue, 23 Aug 2022 16:08:10 +0300
Subject: [PATCH 12/20] Fixed #11858 - Table | Header and Footer have no
 background color with virtualScroller

---
 src/assets/components/themes/arya-blue/theme.css              | 3 ++-
 src/assets/components/themes/arya-green/theme.css             | 3 ++-
 src/assets/components/themes/arya-orange/theme.css            | 3 ++-
 src/assets/components/themes/arya-purple/theme.css            | 3 ++-
 src/assets/components/themes/bootstrap4-dark-blue/theme.css   | 3 ++-
 src/assets/components/themes/bootstrap4-dark-purple/theme.css | 3 ++-
 src/assets/components/themes/bootstrap4-light-blue/theme.css  | 3 ++-
 .../components/themes/bootstrap4-light-purple/theme.css       | 3 ++-
 src/assets/components/themes/fluent-light/theme.css           | 3 ++-
 src/assets/components/themes/lara-dark-blue/theme.css         | 4 ++--
 src/assets/components/themes/lara-dark-indigo/theme.css       | 4 ++--
 src/assets/components/themes/lara-dark-purple/theme.css       | 4 ++--
 src/assets/components/themes/lara-dark-teal/theme.css         | 4 ++--
 src/assets/components/themes/lara-light-blue/theme.css        | 4 ++--
 src/assets/components/themes/lara-light-indigo/theme.css      | 4 ++--
 src/assets/components/themes/lara-light-purple/theme.css      | 4 ++--
 src/assets/components/themes/lara-light-teal/theme.css        | 4 ++--
 src/assets/components/themes/luna-amber/theme.css             | 3 ++-
 src/assets/components/themes/luna-blue/theme.css              | 3 ++-
 src/assets/components/themes/luna-green/theme.css             | 3 ++-
 src/assets/components/themes/luna-pink/theme.css              | 3 ++-
 src/assets/components/themes/md-dark-deeppurple/theme.css     | 3 ++-
 src/assets/components/themes/md-dark-indigo/theme.css         | 3 ++-
 src/assets/components/themes/md-light-deeppurple/theme.css    | 3 ++-
 src/assets/components/themes/md-light-indigo/theme.css        | 3 ++-
 src/assets/components/themes/mdc-dark-deeppurple/theme.css    | 3 ++-
 src/assets/components/themes/mdc-dark-indigo/theme.css        | 3 ++-
 src/assets/components/themes/mdc-light-deeppurple/theme.css   | 3 ++-
 src/assets/components/themes/mdc-light-indigo/theme.css       | 3 ++-
 src/assets/components/themes/nova-accent/theme.css            | 3 ++-
 src/assets/components/themes/nova-alt/theme.css               | 3 ++-
 src/assets/components/themes/nova/theme.css                   | 3 ++-
 src/assets/components/themes/rhea/theme.css                   | 3 ++-
 src/assets/components/themes/saga-blue/theme.css              | 3 ++-
 src/assets/components/themes/saga-green/theme.css             | 3 ++-
 src/assets/components/themes/saga-orange/theme.css            | 3 ++-
 src/assets/components/themes/saga-purple/theme.css            | 3 ++-
 src/assets/components/themes/tailwind-light/theme.css         | 3 ++-
 src/assets/components/themes/vela-blue/theme.css              | 3 ++-
 src/assets/components/themes/vela-green/theme.css             | 3 ++-
 src/assets/components/themes/vela-orange/theme.css            | 3 ++-
 src/assets/components/themes/vela-purple/theme.css            | 3 ++-
 42 files changed, 84 insertions(+), 50 deletions(-)

diff --git a/src/assets/components/themes/arya-blue/theme.css b/src/assets/components/themes/arya-blue/theme.css
index 60753a4c1f6..b7c46f8b96b 100644
--- a/src/assets/components/themes/arya-blue/theme.css
+++ b/src/assets/components/themes/arya-blue/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #1e1e1e;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #1e1e1e;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/arya-green/theme.css b/src/assets/components/themes/arya-green/theme.css
index b2a34a6219b..aa5d92ddb3a 100644
--- a/src/assets/components/themes/arya-green/theme.css
+++ b/src/assets/components/themes/arya-green/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #1e1e1e;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #1e1e1e;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/arya-orange/theme.css b/src/assets/components/themes/arya-orange/theme.css
index 9f21ad1d95d..33f410a48c0 100644
--- a/src/assets/components/themes/arya-orange/theme.css
+++ b/src/assets/components/themes/arya-orange/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #1e1e1e;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #1e1e1e;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/arya-purple/theme.css b/src/assets/components/themes/arya-purple/theme.css
index 42fc8f8a64a..94d8313edb6 100644
--- a/src/assets/components/themes/arya-purple/theme.css
+++ b/src/assets/components/themes/arya-purple/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #1e1e1e;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #1e1e1e;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/bootstrap4-dark-blue/theme.css b/src/assets/components/themes/bootstrap4-dark-blue/theme.css
index 6a876628b9b..f18bbb40822 100644
--- a/src/assets/components/themes/bootstrap4-dark-blue/theme.css
+++ b/src/assets/components/themes/bootstrap4-dark-blue/theme.css
@@ -2838,7 +2838,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #2a323d;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #2a323d;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/bootstrap4-dark-purple/theme.css b/src/assets/components/themes/bootstrap4-dark-purple/theme.css
index 41fc51f3765..45588e91c6a 100644
--- a/src/assets/components/themes/bootstrap4-dark-purple/theme.css
+++ b/src/assets/components/themes/bootstrap4-dark-purple/theme.css
@@ -2838,7 +2838,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #2a323d;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #2a323d;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/bootstrap4-light-blue/theme.css b/src/assets/components/themes/bootstrap4-light-blue/theme.css
index 80eb3ddc0f3..7d6df2c32a1 100644
--- a/src/assets/components/themes/bootstrap4-light-blue/theme.css
+++ b/src/assets/components/themes/bootstrap4-light-blue/theme.css
@@ -2838,7 +2838,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #efefef;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #ffffff;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/bootstrap4-light-purple/theme.css b/src/assets/components/themes/bootstrap4-light-purple/theme.css
index f2e1d670319..daf48ce39c1 100644
--- a/src/assets/components/themes/bootstrap4-light-purple/theme.css
+++ b/src/assets/components/themes/bootstrap4-light-purple/theme.css
@@ -2838,7 +2838,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #efefef;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #ffffff;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/fluent-light/theme.css b/src/assets/components/themes/fluent-light/theme.css
index 7ba15fc102d..88434011062 100644
--- a/src/assets/components/themes/fluent-light/theme.css
+++ b/src/assets/components/themes/fluent-light/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #faf9f8;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #ffffff;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/lara-dark-blue/theme.css b/src/assets/components/themes/lara-dark-blue/theme.css
index 3cddbcc8f05..e2187cfc2eb 100644
--- a/src/assets/components/themes/lara-dark-blue/theme.css
+++ b/src/assets/components/themes/lara-dark-blue/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #071426;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #071426;
 }
 .p-datatable .p-datatable-loading-icon {
@@ -6191,7 +6192,6 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   position: absolute;
   bottom: 0;
   height: 2px;
-  background-color: #93C5FD;
   transition: 500ms cubic-bezier(0.35, 0, 0.25, 1);
 }
 
diff --git a/src/assets/components/themes/lara-dark-indigo/theme.css b/src/assets/components/themes/lara-dark-indigo/theme.css
index 781217cb5cd..438865d75b2 100644
--- a/src/assets/components/themes/lara-dark-indigo/theme.css
+++ b/src/assets/components/themes/lara-dark-indigo/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #071426;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #071426;
 }
 .p-datatable .p-datatable-loading-icon {
@@ -6191,7 +6192,6 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   position: absolute;
   bottom: 0;
   height: 2px;
-  background-color: #A5B4FC;
   transition: 500ms cubic-bezier(0.35, 0, 0.25, 1);
 }
 
diff --git a/src/assets/components/themes/lara-dark-purple/theme.css b/src/assets/components/themes/lara-dark-purple/theme.css
index 29ec3d618fe..57468262980 100644
--- a/src/assets/components/themes/lara-dark-purple/theme.css
+++ b/src/assets/components/themes/lara-dark-purple/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #071426;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #071426;
 }
 .p-datatable .p-datatable-loading-icon {
@@ -6191,7 +6192,6 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   position: absolute;
   bottom: 0;
   height: 2px;
-  background-color: #C4B5FD;
   transition: 500ms cubic-bezier(0.35, 0, 0.25, 1);
 }
 
diff --git a/src/assets/components/themes/lara-dark-teal/theme.css b/src/assets/components/themes/lara-dark-teal/theme.css
index 087cb5be8fa..2d89915eab9 100644
--- a/src/assets/components/themes/lara-dark-teal/theme.css
+++ b/src/assets/components/themes/lara-dark-teal/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #071426;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #071426;
 }
 .p-datatable .p-datatable-loading-icon {
@@ -6191,7 +6192,6 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   position: absolute;
   bottom: 0;
   height: 2px;
-  background-color: #5EEAD4;
   transition: 500ms cubic-bezier(0.35, 0, 0.25, 1);
 }
 
diff --git a/src/assets/components/themes/lara-light-blue/theme.css b/src/assets/components/themes/lara-light-blue/theme.css
index 28a5bdb61fb..c02e0b4a1a4 100644
--- a/src/assets/components/themes/lara-light-blue/theme.css
+++ b/src/assets/components/themes/lara-light-blue/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #f8f9fa;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #f8f9fa;
 }
 .p-datatable .p-datatable-loading-icon {
@@ -6191,7 +6192,6 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   position: absolute;
   bottom: 0;
   height: 2px;
-  background-color: #3B82F6;
   transition: 500ms cubic-bezier(0.35, 0, 0.25, 1);
 }
 
diff --git a/src/assets/components/themes/lara-light-indigo/theme.css b/src/assets/components/themes/lara-light-indigo/theme.css
index f4cfe0dc29a..827a21ee3cb 100644
--- a/src/assets/components/themes/lara-light-indigo/theme.css
+++ b/src/assets/components/themes/lara-light-indigo/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #f8f9fa;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #f8f9fa;
 }
 .p-datatable .p-datatable-loading-icon {
@@ -6191,7 +6192,6 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   position: absolute;
   bottom: 0;
   height: 2px;
-  background-color: #6366F1;
   transition: 500ms cubic-bezier(0.35, 0, 0.25, 1);
 }
 
diff --git a/src/assets/components/themes/lara-light-purple/theme.css b/src/assets/components/themes/lara-light-purple/theme.css
index ff1cf18a584..1550120afa8 100644
--- a/src/assets/components/themes/lara-light-purple/theme.css
+++ b/src/assets/components/themes/lara-light-purple/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #f8f9fa;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #f8f9fa;
 }
 .p-datatable .p-datatable-loading-icon {
@@ -6191,7 +6192,6 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   position: absolute;
   bottom: 0;
   height: 2px;
-  background-color: #8B5CF6;
   transition: 500ms cubic-bezier(0.35, 0, 0.25, 1);
 }
 
diff --git a/src/assets/components/themes/lara-light-teal/theme.css b/src/assets/components/themes/lara-light-teal/theme.css
index a88168cfc24..ee9bac1e331 100644
--- a/src/assets/components/themes/lara-light-teal/theme.css
+++ b/src/assets/components/themes/lara-light-teal/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #f8f9fa;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #f8f9fa;
 }
 .p-datatable .p-datatable-loading-icon {
@@ -6191,7 +6192,6 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   position: absolute;
   bottom: 0;
   height: 2px;
-  background-color: #14B8A6;
   transition: 500ms cubic-bezier(0.35, 0, 0.25, 1);
 }
 
diff --git a/src/assets/components/themes/luna-amber/theme.css b/src/assets/components/themes/luna-amber/theme.css
index 1eae24c1eb2..14c8b96450f 100644
--- a/src/assets/components/themes/luna-amber/theme.css
+++ b/src/assets/components/themes/luna-amber/theme.css
@@ -2838,7 +2838,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #191919;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #252525;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/luna-blue/theme.css b/src/assets/components/themes/luna-blue/theme.css
index 705859516e3..a8306c4111b 100644
--- a/src/assets/components/themes/luna-blue/theme.css
+++ b/src/assets/components/themes/luna-blue/theme.css
@@ -2838,7 +2838,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #191919;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #252525;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/luna-green/theme.css b/src/assets/components/themes/luna-green/theme.css
index 578785e2fc5..281fa82a820 100644
--- a/src/assets/components/themes/luna-green/theme.css
+++ b/src/assets/components/themes/luna-green/theme.css
@@ -2838,7 +2838,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #191919;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #252525;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/luna-pink/theme.css b/src/assets/components/themes/luna-pink/theme.css
index e70df073f47..b0a1920006d 100644
--- a/src/assets/components/themes/luna-pink/theme.css
+++ b/src/assets/components/themes/luna-pink/theme.css
@@ -2838,7 +2838,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #191919;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #252525;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/md-dark-deeppurple/theme.css b/src/assets/components/themes/md-dark-deeppurple/theme.css
index 90676a39e50..c9315698816 100644
--- a/src/assets/components/themes/md-dark-deeppurple/theme.css
+++ b/src/assets/components/themes/md-dark-deeppurple/theme.css
@@ -2850,7 +2850,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #1e1e1e;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #1e1e1e;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/md-dark-indigo/theme.css b/src/assets/components/themes/md-dark-indigo/theme.css
index c07c9581382..95046bc1164 100644
--- a/src/assets/components/themes/md-dark-indigo/theme.css
+++ b/src/assets/components/themes/md-dark-indigo/theme.css
@@ -2850,7 +2850,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #1e1e1e;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #1e1e1e;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/md-light-deeppurple/theme.css b/src/assets/components/themes/md-light-deeppurple/theme.css
index c6972b8efeb..313c0143a1e 100644
--- a/src/assets/components/themes/md-light-deeppurple/theme.css
+++ b/src/assets/components/themes/md-light-deeppurple/theme.css
@@ -2850,7 +2850,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #ffffff;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #ffffff;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/md-light-indigo/theme.css b/src/assets/components/themes/md-light-indigo/theme.css
index 08d3df5f7d8..82b361e716d 100644
--- a/src/assets/components/themes/md-light-indigo/theme.css
+++ b/src/assets/components/themes/md-light-indigo/theme.css
@@ -2850,7 +2850,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #ffffff;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #ffffff;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/mdc-dark-deeppurple/theme.css b/src/assets/components/themes/mdc-dark-deeppurple/theme.css
index 8e95a85bef8..dadd3af64e8 100644
--- a/src/assets/components/themes/mdc-dark-deeppurple/theme.css
+++ b/src/assets/components/themes/mdc-dark-deeppurple/theme.css
@@ -2850,7 +2850,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #1e1e1e;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #1e1e1e;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/mdc-dark-indigo/theme.css b/src/assets/components/themes/mdc-dark-indigo/theme.css
index 00d43621349..ba50bce099f 100644
--- a/src/assets/components/themes/mdc-dark-indigo/theme.css
+++ b/src/assets/components/themes/mdc-dark-indigo/theme.css
@@ -2850,7 +2850,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #1e1e1e;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #1e1e1e;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/mdc-light-deeppurple/theme.css b/src/assets/components/themes/mdc-light-deeppurple/theme.css
index 4ea5bcc77b2..14d60365a75 100644
--- a/src/assets/components/themes/mdc-light-deeppurple/theme.css
+++ b/src/assets/components/themes/mdc-light-deeppurple/theme.css
@@ -2850,7 +2850,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #ffffff;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #ffffff;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/mdc-light-indigo/theme.css b/src/assets/components/themes/mdc-light-indigo/theme.css
index dc770d35f10..89803f21350 100644
--- a/src/assets/components/themes/mdc-light-indigo/theme.css
+++ b/src/assets/components/themes/mdc-light-indigo/theme.css
@@ -2850,7 +2850,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #ffffff;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #ffffff;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/nova-accent/theme.css b/src/assets/components/themes/nova-accent/theme.css
index 4ff94c92fd1..ceb96279c29 100644
--- a/src/assets/components/themes/nova-accent/theme.css
+++ b/src/assets/components/themes/nova-accent/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #007ad9;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #f4f4f4;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/nova-alt/theme.css b/src/assets/components/themes/nova-alt/theme.css
index f85154cc927..51fecf8f00c 100644
--- a/src/assets/components/themes/nova-alt/theme.css
+++ b/src/assets/components/themes/nova-alt/theme.css
@@ -2838,7 +2838,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #333333;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #f4f4f4;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/nova/theme.css b/src/assets/components/themes/nova/theme.css
index 01019f2c229..fec49a90162 100644
--- a/src/assets/components/themes/nova/theme.css
+++ b/src/assets/components/themes/nova/theme.css
@@ -2838,7 +2838,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #f4f4f4;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #f4f4f4;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/rhea/theme.css b/src/assets/components/themes/rhea/theme.css
index a40a5fbe5e9..2187c3f819a 100644
--- a/src/assets/components/themes/rhea/theme.css
+++ b/src/assets/components/themes/rhea/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #7B95A3;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #ffffff;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/saga-blue/theme.css b/src/assets/components/themes/saga-blue/theme.css
index 0d112222237..5ba1efe8754 100644
--- a/src/assets/components/themes/saga-blue/theme.css
+++ b/src/assets/components/themes/saga-blue/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #f8f9fa;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #f8f9fa;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/saga-green/theme.css b/src/assets/components/themes/saga-green/theme.css
index d92aeb572d0..536d8847e6a 100644
--- a/src/assets/components/themes/saga-green/theme.css
+++ b/src/assets/components/themes/saga-green/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #f8f9fa;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #f8f9fa;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/saga-orange/theme.css b/src/assets/components/themes/saga-orange/theme.css
index 9bfffa6b46a..db131959cfd 100644
--- a/src/assets/components/themes/saga-orange/theme.css
+++ b/src/assets/components/themes/saga-orange/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #f8f9fa;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #f8f9fa;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/saga-purple/theme.css b/src/assets/components/themes/saga-purple/theme.css
index b75ae0deb9d..32ba45cd01a 100644
--- a/src/assets/components/themes/saga-purple/theme.css
+++ b/src/assets/components/themes/saga-purple/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #f8f9fa;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #f8f9fa;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/tailwind-light/theme.css b/src/assets/components/themes/tailwind-light/theme.css
index 3d0894dd2cc..a1b5cc3a6f7 100644
--- a/src/assets/components/themes/tailwind-light/theme.css
+++ b/src/assets/components/themes/tailwind-light/theme.css
@@ -2861,7 +2861,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #fafafa;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #fafafa;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/vela-blue/theme.css b/src/assets/components/themes/vela-blue/theme.css
index 85a781ebd1d..f993f674f7d 100644
--- a/src/assets/components/themes/vela-blue/theme.css
+++ b/src/assets/components/themes/vela-blue/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #1f2d40;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #1f2d40;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/vela-green/theme.css b/src/assets/components/themes/vela-green/theme.css
index c2f14da37f2..fea10f281c1 100644
--- a/src/assets/components/themes/vela-green/theme.css
+++ b/src/assets/components/themes/vela-green/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #1f2d40;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #1f2d40;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/vela-orange/theme.css b/src/assets/components/themes/vela-orange/theme.css
index a6492655e20..7f18a51b7fa 100644
--- a/src/assets/components/themes/vela-orange/theme.css
+++ b/src/assets/components/themes/vela-orange/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #1f2d40;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #1f2d40;
 }
 .p-datatable .p-datatable-loading-icon {
diff --git a/src/assets/components/themes/vela-purple/theme.css b/src/assets/components/themes/vela-purple/theme.css
index 5e8475d2675..36a2b763776 100644
--- a/src/assets/components/themes/vela-purple/theme.css
+++ b/src/assets/components/themes/vela-purple/theme.css
@@ -2826,7 +2826,8 @@ p-treeselect.p-treeselect-clearable .p-treeselect-clear-icon {
   background: #1f2d40;
 }
 .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
-.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot {
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot, .p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-thead,
+.p-datatable.p-datatable-scrollable > .p-datatable-wrapper > .p-scroller-viewport > .p-scroller > .p-datatable-table > .p-datatable-tfoot {
   background-color: #1f2d40;
 }
 .p-datatable .p-datatable-loading-icon {

From 196d41d7a1216b5482c95917d32a91deb2488299 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=87etin?=
 <69278826+cetincakiroglu@users.noreply.github.com>
Date: Wed, 24 Aug 2022 10:15:24 +0300
Subject: [PATCH 13/20] Fixed #11839 - AutoComplete | onHide event firing on
 destroy

---
 src/app/components/autocomplete/autocomplete.ts | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/app/components/autocomplete/autocomplete.ts b/src/app/components/autocomplete/autocomplete.ts
index 1cd6c8141f5..430fc4caf78 100755
--- a/src/app/components/autocomplete/autocomplete.ts
+++ b/src/app/components/autocomplete/autocomplete.ts
@@ -1019,8 +1019,10 @@ export class AutoComplete implements AfterViewChecked,AfterContentInit,OnDestroy
         this.unbindDocumentClickListener();
         this.unbindDocumentResizeListener();
         this.unbindScrollListener();
-        this.overlay = null;
-        this.onHide.emit();
+        if (this.overlay) {
+            this.overlay = null;
+            this.onHide.emit();
+        }
     }
 
     ngOnDestroy() {

From c7f9102f9d82ab505f5c3ddfa6b11d61a0e96a99 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=87etin?=
 <69278826+cetincakiroglu@users.noreply.github.com>
Date: Wed, 24 Aug 2022 11:24:16 +0300
Subject: [PATCH 14/20] Refactor

---
 src/app/components/editor/editor.ts | 19 +------------------
 1 file changed, 1 insertion(+), 18 deletions(-)

diff --git a/src/app/components/editor/editor.ts b/src/app/components/editor/editor.ts
index 93b31294061..f3d1ac2ea45 100755
--- a/src/app/components/editor/editor.ts
+++ b/src/app/components/editor/editor.ts
@@ -1,21 +1,4 @@
-import {
-    NgModule,
-    Component,
-    ElementRef,
-    AfterViewInit,
-    Input,
-    Output,
-    EventEmitter,
-    ContentChild,
-    forwardRef,
-    ChangeDetectionStrategy,
-    ViewEncapsulation,
-    ContentChildren,
-    QueryList,
-    AfterContentInit,
-    TemplateRef,
-    AfterViewChecked
-} from '@angular/core';
+import {NgModule,Component,ElementRef,AfterViewInit,Input,Output,EventEmitter,ContentChild,forwardRef,ChangeDetectionStrategy,ViewEncapsulation,ContentChildren,QueryList,AfterContentInit,TemplateRef,AfterViewChecked} from '@angular/core';
 import {CommonModule} from '@angular/common';
 import {SharedModule,Header, PrimeTemplate} from 'primeng/api'
 import {DomHandler} from 'primeng/dom';

From 20c81eb242cdbca00e7884e039c7d34378f9157a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=87etin?=
 <69278826+cetincakiroglu@users.noreply.github.com>
Date: Wed, 24 Aug 2022 11:50:25 +0300
Subject: [PATCH 15/20] Fixed #11861 - RadioButton | can't get the value from
 onClick event

---
 src/app/components/radiobutton/radiobutton.ts                | 2 +-
 src/app/showcase/components/radiobutton/radiobuttondemo.html | 4 +++-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/app/components/radiobutton/radiobutton.ts b/src/app/components/radiobutton/radiobutton.ts
index e7ead265d15..a2ccc303ad4 100755
--- a/src/app/components/radiobutton/radiobutton.ts
+++ b/src/app/components/radiobutton/radiobutton.ts
@@ -135,7 +135,7 @@ export class RadioButton implements ControlValueAccessor, OnInit, OnDestroy {
             this.checked = true;
             this.onModelChange(this.value);
             this.registry.select(this);
-            this.onClick.emit(event);
+            this.onClick.emit({originalEvent: event, value: this.value});
         }
     }
 
diff --git a/src/app/showcase/components/radiobutton/radiobuttondemo.html b/src/app/showcase/components/radiobutton/radiobuttondemo.html
index 90573b81509..6feec98769b 100755
--- a/src/app/showcase/components/radiobutton/radiobuttondemo.html
+++ b/src/app/showcase/components/radiobutton/radiobuttondemo.html
@@ -174,7 +174,9 @@ <h5>Events</h5>
                     <tbody>
                         <tr>
                             <td>onClick</td>
-                            <td>event: Click event</td>
+                            <td>event.originalEvent: Click event<br>
+                                event.value: Value of the radio button
+                            </td>
                             <td>Callback to invoke on radio button click.</td>
                         </tr>
                         <tr>

From 943ec5e1997225530dc5ee8f167fbf38d08b589a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=87etin?=
 <69278826+cetincakiroglu@users.noreply.github.com>
Date: Wed, 24 Aug 2022 14:50:44 +0300
Subject: [PATCH 16/20] Fixed #11761 - TreeSelect | style and type attribute of
 TreeNode API doesn't work

---
 src/app/components/api/treenode.ts          |  1 +
 src/app/components/tree/tree.ts             | 15 +++++++--------
 src/app/components/treeselect/treeselect.ts | 17 +++++++++++++----
 3 files changed, 21 insertions(+), 12 deletions(-)

diff --git a/src/app/components/api/treenode.ts b/src/app/components/api/treenode.ts
index 4e73817f5c4..fe16caab89f 100755
--- a/src/app/components/api/treenode.ts
+++ b/src/app/components/api/treenode.ts
@@ -10,6 +10,7 @@ export interface TreeNode<T = any> {
     type?: string;
     parent?: TreeNode<T>;
     partialSelected?: boolean;
+    style?: string;
     styleClass?: string;
     draggable?: boolean;
     droppable?: boolean;
diff --git a/src/app/components/tree/tree.ts b/src/app/components/tree/tree.ts
index b77350108b5..b38840840d8 100755
--- a/src/app/components/tree/tree.ts
+++ b/src/app/components/tree/tree.ts
@@ -19,7 +19,7 @@ import {Scroller, ScrollerModule, ScrollerOptions} from 'primeng/scroller';
         <ng-template [ngIf]="node">
             <li *ngIf="tree.droppableNodes" class="p-treenode-droppoint" [ngClass]="{'p-treenode-droppoint-active':draghoverPrev}"
             (drop)="onDropPoint($event,-1)" (dragover)="onDropPointDragOver($event)" (dragenter)="onDropPointDragEnter($event,-1)" (dragleave)="onDropPointDragLeave($event)"></li>
-            <li *ngIf="!tree.horizontal" [ngClass]="['p-treenode',node.styleClass||'', isLeaf() ? 'p-treenode-leaf': '']" [ngStyle]="{'height': itemSize + 'px'}">
+            <li *ngIf="!tree.horizontal" [ngClass]="['p-treenode',node.styleClass||'', isLeaf() ? 'p-treenode-leaf': '']" [ngStyle]="{'height': itemSize + 'px'}" [style]="node.style">
                 <div class="p-treenode-content" [style.paddingLeft]="(level * indentation)  + 'rem'" (click)="onNodeClick($event)" (contextmenu)="onNodeRightClick($event)" (touchend)="onNodeTouchEnd()"
                     (drop)="onDropNode($event)" (dragover)="onDropNodeDragOver($event)" (dragenter)="onDropNodeDragEnter($event)" (dragleave)="onDropNodeDragLeave($event)"
                     [draggable]="tree.draggableNodes" (dragstart)="onDragStart($event)" (dragend)="onDragStop($event)" [attr.tabindex]="0"
@@ -130,7 +130,6 @@ export class UITreeNode implements OnInit {
 
     ngOnInit() {
         this.node.parent = this.parentNode;
-
         if (this.parentNode) {
             this.tree.syncNodeOption(this.node, this.tree.value, 'parent', this.tree.getNodeWithKey(this.parentNode.key, this.tree.value));
         }
@@ -652,6 +651,8 @@ export class Tree implements OnInit,AfterContentInit,OnChanges,OnDestroy,Blockab
 
     @Input() indentation: number = 1.5;
 
+    @Input() _templateMap: any;
+
     @Input() trackBy: Function = (index: number, item: any) => item;
 
     @Output() selectionChange: EventEmitter<any> = new EventEmitter();
@@ -704,8 +705,6 @@ export class Tree implements OnInit,AfterContentInit,OnChanges,OnDestroy,Blockab
 
     emptyMessageTemplate: TemplateRef<any>;
 
-    public templateMap: any;
-
     public nodeTouched: boolean;
 
     public dragNodeTree: Tree;
@@ -765,7 +764,7 @@ export class Tree implements OnInit,AfterContentInit,OnChanges,OnDestroy,Blockab
 
     ngAfterContentInit() {
         if (this.templates.length) {
-            this.templateMap = {};
+            this._templateMap = {};
         }
 
         this.templates.forEach((item) => {
@@ -787,7 +786,7 @@ export class Tree implements OnInit,AfterContentInit,OnChanges,OnDestroy,Blockab
                 break;
 
                 default:
-                    this.templateMap[item.name] = item.template;
+                    this._templateMap[item.name] = item.template;
                 break;
             }
         });
@@ -1091,8 +1090,8 @@ export class Tree implements OnInit,AfterContentInit,OnChanges,OnDestroy,Blockab
     }
 
     getTemplateForNode(node: TreeNode): TemplateRef<any> {
-        if (this.templateMap)
-            return node.type ? this.templateMap[node.type] : this.templateMap['default'];
+        if (this._templateMap)
+            return node.type ? this._templateMap[node.type] : this._templateMap['default'];
         else
             return null;
     }
diff --git a/src/app/components/treeselect/treeselect.ts b/src/app/components/treeselect/treeselect.ts
index 419c7a7aa1d..81db278f5c6 100755
--- a/src/app/components/treeselect/treeselect.ts
+++ b/src/app/components/treeselect/treeselect.ts
@@ -61,7 +61,7 @@ export const TREESELECT_VALUE_ACCESSOR: any = {
             <div class="p-treeselect-items-wrapper" [ngStyle]="{'max-height': scrollHeight}">
                 <p-tree #tree [value]="options" [propagateSelectionDown]="propagateSelectionDown" [propagateSelectionUp]="propagateSelectionUp" [selectionMode]="selectionMode" (selectionChange)="onSelectionChange($event)" [selection]="value"
                     [metaKeySelection]="metaKeySelection" (onNodeExpand)="nodeExpand($event)" (onNodeCollapse)="nodeCollapse($event)"
-                    (onNodeSelect)="onSelect($event)" [emptyMessage]="emptyMessage" (onNodeUnselect)="onUnselect($event)" [filterBy]="filterBy" [filterMode]="filterMode" [filterPlaceholder]="filterPlaceholder" [filterLocale]="filterLocale" [filterInputAutoFocus]="filterInputAutoFocus" [filteredNodes]="filteredNodes">
+                    (onNodeSelect)="onSelect($event)" [emptyMessage]="emptyMessage" (onNodeUnselect)="onUnselect($event)" [filterBy]="filterBy" [filterMode]="filterMode" [filterPlaceholder]="filterPlaceholder" [filterLocale]="filterLocale" [filterInputAutoFocus]="filterInputAutoFocus" [filteredNodes]="filteredNodes" [_templateMap]="templateMap">
                         <ng-container *ngIf="emptyTemplate">
                             <ng-template pTemplate="empty">
                                 <ng-container *ngTemplateOutlet="emptyTemplate;"></ng-container>
@@ -174,7 +174,7 @@ export class TreeSelect implements AfterContentInit {
 
     @Output() onHide: EventEmitter<any> = new EventEmitter();
 
-	  @Output() onClear: EventEmitter<any> = new EventEmitter();
+    @Output() onClear: EventEmitter<any> = new EventEmitter();
 
     @Output() onFilter: EventEmitter<any> = new EventEmitter();
 
@@ -210,6 +210,8 @@ export class TreeSelect implements AfterContentInit {
 
     outsideClickListener: any;
 
+    public templateMap: any;
+
     scrollHandler: any;
 
     resizeListener: any;
@@ -227,6 +229,10 @@ export class TreeSelect implements AfterContentInit {
     }
 
     ngAfterContentInit() {
+        if (this.templates.length) {
+            this.templateMap = {};
+        }
+
         this.templates.forEach((item) => {
             switch(item.getType()) {
                 case 'value':
@@ -246,8 +252,11 @@ export class TreeSelect implements AfterContentInit {
                 break;
 
                 default:
-                    this.valueTemplate = item.template;
-                break;
+                    if(item.name)
+                        this.templateMap[item.name] = item.template;
+                    else
+                        this.valueTemplate = item.template; //TODO: @deprecated Used "value" template instead
+                    break;
             }
         });
     }

From a53116dcab012391818abe91d456249ae2806b45 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=87etin?=
 <69278826+cetincakiroglu@users.noreply.github.com>
Date: Wed, 24 Aug 2022 16:36:13 +0300
Subject: [PATCH 17/20] Set new version

---
 src/app/components/package.json          | 2 +-
 src/app/showcase/app.footer.component.ts | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/app/components/package.json b/src/app/components/package.json
index 00157afe73e..b1b62d396f9 100644
--- a/src/app/components/package.json
+++ b/src/app/components/package.json
@@ -1,6 +1,6 @@
 {
     "name": "primeng",
-    "version": "14.0.1",
+    "version": "14.0.2",
     "repository": {
       "type": "git",
       "url": "https://github.com/primefaces/primeng"
diff --git a/src/app/showcase/app.footer.component.ts b/src/app/showcase/app.footer.component.ts
index 86a4976d824..96e6f28692d 100644
--- a/src/app/showcase/app.footer.component.ts
+++ b/src/app/showcase/app.footer.component.ts
@@ -5,7 +5,7 @@ import {Component} from '@angular/core';
     template: `
         <div class="layout-footer">
             <div class="layout-footer-left">
-                <span>PrimeNG 14.0.1 by </span>
+                <span>PrimeNG 14.0.2 by </span>
                 <a href="https://www.primetek.com.tr">PrimeTek</a>
             </div>
 

From 34d3ab2c6641c4cb423d90d80c4c257d85b761ea Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=87etin?=
 <69278826+cetincakiroglu@users.noreply.github.com>
Date: Wed, 24 Aug 2022 16:56:51 +0300
Subject: [PATCH 18/20] Update Changelog

---
 CHANGELOG.md | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 740319878ac..b648623efb0 100755
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,24 @@
 # Changelog
 
+## [14.0.2](https://github.com/primefaces/primeng/tree/14.0.2) (2022-08-24)
+
+[Full Changelog](https://github.com/primefaces/primeng/compare/14.0.1...14.0.2)
+
+**Fixed bugs:**
+- Table Sticky Footer doesn't work with VirtualScroll on DataTable [\#11819](https://github.com/primefaces/primeng/issues/11819)
+- Table | ColumnFilter overlay not closing after clicked an input element inside the container [\#11822](https://github.com/primefaces/primeng/issues/11822)
+- pColumnFilter | Filter is applied by adding a new constraint [\#11841](https://github.com/primefaces/primeng/issues/11841)
+- Table | LazyLoad emits before onPage event [\#11843](https://github.com/primefaces/primeng/issues/11843)
+- Accordion Panel within an Accordion Panel is broken [\#11848](https://github.com/primefaces/primeng/issues/11848)
+- TabView | inkbar does not work correctly [\#11855](https://github.com/primefaces/primeng/issues/11855)
+- Table | Header and Footer have no background color with virtualScroller [\#11858](https://github.com/primefaces/primeng/issues/11858)
+- p-autoComplete : onHide firing on destroy [\#11839](https://github.com/primefaces/primeng/issues/11839)
+- Dropdown: Allow empty string while not showing clear button [\#11836](https://github.com/primefaces/primeng/issues/11836)
+- Editor: Not displaying content correctly in dialog [\#11814](https://github.com/primefaces/primeng/issues/11814)
+- FileUpload | The error message does not disappear correctly when removing file(s), to match your file limit [\#11799](https://github.com/primefaces/primeng/issues/11799)
+- TreeSelect: style and type attribute of TreeNode API doesn't work [\#11761](https://github.com/primefaces/primeng/issues/11761)
+- p-radioButton: can't get the value from onClick event [\#11861](https://github.com/primefaces/primeng/issues/11861)
+
 ## [14.0.1](https://github.com/primefaces/primeng/tree/14.0.1) (2022-08-11)
 
 [Full Changelog](https://github.com/primefaces/primeng/compare/14.0.0...14.0.1)

From ec128caa7cd36bf65b9739a8cf583c83d5efb192 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=87etin?=
 <69278826+cetincakiroglu@users.noreply.github.com>
Date: Wed, 24 Aug 2022 16:57:14 +0300
Subject: [PATCH 19/20] Update versions.json

---
 src/versions.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/versions.json b/src/versions.json
index 8ce1cac3b60..302992a5dfe 100644
--- a/src/versions.json
+++ b/src/versions.json
@@ -1,7 +1,7 @@
 {
     "versions": [
         {
-            "version": "v14.0.1",
+            "version": "v14.0.2",
             "url": "https://www.primefaces.org/primeng"
         },
         {

From 085a6040181e6a2c4091c56ff7b9be79111dbb71 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=87etin?=
 <69278826+cetincakiroglu@users.noreply.github.com>
Date: Wed, 24 Aug 2022 16:57:25 +0300
Subject: [PATCH 20/20] New iteration

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 8906fcac888..1ba6732f0d2 100755
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "primeng",
-  "version": "14.0.2-SNAPSHOT",
+  "version": "14.0.3-SNAPSHOT",
   "license": "MIT",
   "scripts": {
     "ng": "ng",