From 9330b908dd9f47a75518df3e66f75a91ecc92665 Mon Sep 17 00:00:00 2001
From: Enrico Messall <enrico.messall@arematics.com>
Date: Fri, 18 Oct 2024 12:30:45 +0200
Subject: [PATCH] fix: primefaces#16578  + Drag and Drop works again  + Still
 wrong: Item shows below list while dragging

---
 src/app/components/listbox/listbox.ts   | 4 ++++
 src/app/components/picklist/picklist.ts | 8 +++++++-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/app/components/listbox/listbox.ts b/src/app/components/listbox/listbox.ts
index 8f18ea8a034..8cc51b26c21 100755
--- a/src/app/components/listbox/listbox.ts
+++ b/src/app/components/listbox/listbox.ts
@@ -48,6 +48,7 @@ import { ListBoxStyle } from './style/listboxstyle';
 import { BlankIcon } from 'primeng/icons/blank';
 import { CheckboxModule } from 'primeng/checkbox';
 import { InputIconModule } from 'primeng/inputicon';
+import {CdkDrag, DragDropModule} from "@angular/cdk/drag-drop";
 
 export const LISTBOX_VALUE_ACCESSOR: any = {
     provide: NG_VALUE_ACCESSOR,
@@ -216,6 +217,8 @@ export const LISTBOX_VALUE_ACCESSOR: any = {
                             </ng-container>
                             <ng-container *ngIf="!isOptionGroup(option)">
                                 <li
+                                    cdkDrag
+                                    [cdkDragData]="option"
                                     pRipple
                                     class="p-listbox-option"
                                     role="option"
@@ -1602,6 +1605,7 @@ export class Listbox extends BaseComponent implements AfterContentInit, OnInit,
         InputTextModule,
         BlankIcon,
         FormsModule,
+        DragDropModule
     ],
     exports: [Listbox, SharedModule, ScrollerModule],
     declarations: [Listbox],
diff --git a/src/app/components/picklist/picklist.ts b/src/app/components/picklist/picklist.ts
index e7d7d66af74..8f37401f469 100755
--- a/src/app/components/picklist/picklist.ts
+++ b/src/app/components/picklist/picklist.ts
@@ -140,6 +140,9 @@ import { FormsModule } from '@angular/forms';
                 [attr.data-pc-group-section]="'listWrapper'"
             >
                 <p-listbox
+                    cdkDropList
+                    [cdkDropListData]="source"
+                    (cdkDropListDropped)="onDrop($event, SOURCE_LIST)"
                     #sourcelist
                     [multiple]="true"
                     [options]="source"
@@ -260,6 +263,9 @@ import { FormsModule } from '@angular/forms';
                 [attr.data-pc-group-section]="'listwrapper'"
             >
                 <p-listbox
+                    cdkDropList
+                    [cdkDropListData]="target"
+                    (cdkDropListDropped)="onDrop($event, TARGET_LIST)"
                     #targetlist
                     [multiple]="true"
                     [options]="target"
@@ -1804,7 +1810,7 @@ export class PickList extends BaseComponent implements AfterViewChecked, AfterCo
                         flex-direction: row;
                     }
 
-                  
+
                 }`;
 
                 this.renderer.setProperty(this.styleElement, 'innerHTML', innerHTML);