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/elements/SwpEventElement.ts

@@ -101,6 +101,83 @@ export class SwpEventElement extends BaseEventElement {
     return new SwpEventElement(event);
   }
 
+  /**
+   * Create a clone of this SwpEventElement with "clone-" prefix
+   */
+  public createClone(): SwpEventElement {
+    // Clone the underlying DOM element
+    const clonedElement = this.element.cloneNode(true) as HTMLElement;
+    
+    // Create new SwpEventElement instance from the cloned DOM
+    const clonedSwpEvent = SwpEventElement.fromExistingElement(clonedElement);
+    
+    // Apply "clone-" prefix to ID
+    clonedSwpEvent.updateEventId(`clone-${this.event.id}`);
+    
+    // Cache original duration for drag operations
+    const originalDuration = this.getOriginalEventDuration();
+    clonedSwpEvent.element.dataset.originalDuration = originalDuration.toString();
+    
+    // Set height from original element
+    clonedSwpEvent.element.style.height = this.element.style.height || `${this.element.getBoundingClientRect().height}px`;
+    
+    return clonedSwpEvent;
+  }
+
+  /**
+   * Factory method to create SwpEventElement from existing DOM element
+   */
+  public static fromExistingElement(element: HTMLElement): SwpEventElement {
+    // Extract CalendarEvent data from DOM element
+    const event = this.extractCalendarEventFromElement(element);
+    
+    // Create new instance but replace the created element with the existing one
+    const swpEvent = new SwpEventElement(event);
+    swpEvent.element = element;
+    
+    return swpEvent;
+  }
+
+  /**
+   * Update the event ID in both the CalendarEvent and DOM element
+   */
+  private updateEventId(newId: string): void {
+    this.event.id = newId;
+    this.element.dataset.eventId = newId;
+  }
+
+  /**
+   * Extract original event duration from DOM element
+   */
+  private getOriginalEventDuration(): number {
+    const timeElement = this.element.querySelector('swp-event-time');
+    if (timeElement) {
+      const duration = timeElement.getAttribute('data-duration');
+      if (duration) {
+        return parseInt(duration);
+      }
+    }
+    return 60; // Fallback
+  }
+
+  /**
+   * Extract CalendarEvent from DOM element
+   */
+  private static extractCalendarEventFromElement(element: HTMLElement): CalendarEvent {
+    return {
+      id: element.dataset.eventId || '',
+      title: element.dataset.title || '',
+      start: new Date(element.dataset.start || ''),
+      end: new Date(element.dataset.end || ''),
+      type: element.dataset.type || 'work',
+      allDay: false,
+      syncStatus: 'synced',
+      metadata: {
+        duration: element.dataset.duration
+      }
+    };
+  }
+
   /**
    * Factory method to convert an all-day HTML element to a timed SwpEventElement
    */