Refactors event drag-drop and cloning logic

Centralizes drag event listener setup in `EventRendererManager` for better separation of concerns.

Introduces factory and cloning methods in `SwpEventElement` to simplify event cloning and data extraction from DOM elements during drag operations.

Enhances `DragDropManager` to pass the actual dragged element for conversion and accurately detect the drop target (day column or header).

Updates `EventRenderer` to expose drag-handling methods publicly, allowing the `EventRendererManager` to delegate event-specific drag operations based on drop target.

src/managers/DragDropManager.ts

@@ -172,8 +172,11 @@ export class DragDropManager {
         const mousePosition = { x: this.lastMousePosition.x, y: this.lastMousePosition.y };
         const column = this.getColumnDateFromX(mousePosition.x);
         
+        // Find the actual dragged element
+        const draggedElement = document.querySelector(`[data-event-id="${this.draggedEventId}"]`) as HTMLElement;
+        
         this.eventBus.emit('drag:convert-to-time_event', {
-          draggedEventId: this.draggedEventId,
+          draggedElement: draggedElement,
           mousePosition: mousePosition,
           column: column
         });
@@ -319,10 +322,14 @@ export class DragDropManager {
         // Use consolidated position calculation
         const positionData = this.calculateDragPosition(finalPosition);
         
+        // Detect drop target (swp-day-column or swp-day-header)
+        const dropTarget = this.detectDropTarget(finalPosition);
+        
         console.log('🎯 DragDropManager: Emitting drag:end', {
           eventId: eventId,
           finalColumn: positionData.column,
           finalY: positionData.snappedY,
+          dropTarget: dropTarget,
           isDragStarted: isDragStarted
         });
         
@@ -330,7 +337,8 @@ export class DragDropManager {
           eventId: eventId,
           finalPosition,
           finalColumn: positionData.column,
-          finalY: positionData.snappedY
+          finalY: positionData.snappedY,
+          target: dropTarget
         });
       } else {
         // This was just a click - emit click event instead
@@ -411,9 +419,6 @@ export class DragDropManager {
     // Sorter efter x-position (fra venstre til højre)
     this.columnBoundsCache.sort((a, b) => a.left - b.left);
     
-    console.log('📏 DragDropManager: Updated column bounds cache', {
-      columns: this.columnBoundsCache.length
-    });
   }
 
   /**
@@ -592,6 +597,28 @@ export class DragDropManager {
     return allDayElement !== null;
   }
 
+  /**
+   * Detect drop target - whether dropped in swp-day-column or swp-day-header
+   */
+  private detectDropTarget(position: Position): 'swp-day-column' | 'swp-day-header' | null {
+    const elementAtPosition = document.elementFromPoint(position.x, position.y);
+    if (!elementAtPosition) return null;
+
+    // Traverse up the DOM tree to find the target container
+    let currentElement = elementAtPosition as HTMLElement;
+    while (currentElement && currentElement !== document.body) {
+      if (currentElement.tagName === 'SWP-DAY-HEADER') {
+        return 'swp-day-header';
+      }
+      if (currentElement.tagName === 'SWP-DAY-COLUMN') {
+        return 'swp-day-column';
+      }
+      currentElement = currentElement.parentElement as HTMLElement;
+    }
+
+    return null;
+  }
+
   /**
    * Clean up all resources and event listeners
    */