Allows dynamic drag clone replacement

Introduces a polymorphic `createClone` method on base event elements to customize clone generation.
Adds a `replaceClone` delegate to drag event payloads, enabling subscribers to dynamically swap the active dragged clone.
This supports scenarios like converting a standard event clone to an all-day event clone when dragging to the all-day header.
This commit is contained in:
Janus C. H. Knudsen 2025-10-04 23:10:09 +02:00
parent 125cd678a3
commit 5fae433afb
5 changed files with 641 additions and 31 deletions

View file

@ -7,7 +7,7 @@ import { IEventBus } from '../types/CalendarTypes';
import { calendarConfig } from '../core/CalendarConfig';
import { PositionUtils } from '../utils/PositionUtils';
import { ColumnBounds, ColumnDetectionUtils } from '../utils/ColumnDetectionUtils';
import { SwpEventElement } from '../elements/SwpEventElement';
import { SwpEventElement, BaseSwpEventElement } from '../elements/SwpEventElement';
import {
DragStartEventPayload,
DragMoveEventPayload,
@ -192,9 +192,9 @@ export class DragDropManager {
// Detect current column
this.currentColumnBounds = ColumnDetectionUtils.getColumnBounds(currentPosition);
// Cast to SwpEventElement and create clone
const originalSwpEvent = this.draggedElement as SwpEventElement;
this.draggedClone = originalSwpEvent.createClone();
// Cast to BaseSwpEventElement and create clone (works for both SwpEventElement and SwpAllDayEventElement)
const originalElement = this.draggedElement as BaseSwpEventElement;
this.draggedClone = originalElement.createClone();
const dragStartPayload: DragStartEventPayload = {
draggedElement: this.draggedElement,
@ -499,15 +499,17 @@ export class DragDropManager {
// Extract CalendarEvent from the dragged clone
const calendarEvent = SwpEventElement.extractCalendarEventFromElement(this.draggedClone);
const allDayElement = SwpAllDayEventElement.fromCalendarEvent(payload.calendarEvent);
const dragMouseEnterPayload: DragMouseEnterHeaderEventPayload = {
targetColumn: targetColumn,
mousePosition: position,
originalElement: this.draggedElement,
draggedClone: this.draggedClone,
calendarEvent: calendarEvent
calendarEvent: calendarEvent,
// Delegate pattern - allows AllDayManager to replace the clone
replaceClone: (newClone: HTMLElement) => {
this.draggedClone = newClone;
}
};
this.eventBus.emit('drag:mouseenter-header', dragMouseEnterPayload);
}