Unifies all-day event element tag

Removes the `swp-allday-event` custom element, using `swp-event` for all-day events instead. All-day events are now distinguished by their parent `swp-allday-container`. Simplifies element management and CSS selectors.

src/elements/SwpEventElement.ts

@@ -225,7 +225,7 @@ export class SwpEventElement extends BaseEventElement {
 }
 
 /**
- * All-day event element (swp-allday-event)
+ * All-day event element (now using unified swp-event tag)
  */
 export class SwpAllDayEventElement extends BaseEventElement {
   private columnIndex: number;
@@ -239,7 +239,7 @@ export class SwpAllDayEventElement extends BaseEventElement {
   }
 
   protected createElement(): HTMLElement {
-    return document.createElement('swp-allday-event');
+    return document.createElement('swp-event');
   }
 
   /**
@@ -295,7 +295,7 @@ export class SwpAllDayEventElement extends BaseEventElement {
     const finalColumnSpan = targetDate ? 1 : columnSpan;
 
     // Find occupied rows in the spanned columns using computedStyle
-    const existingEvents = document.querySelectorAll('swp-allday-event');
+    const existingEvents = document.querySelectorAll('swp-allday-container swp-event');
     const occupiedRows = new Set<number>();
     
     console.log('🔍 SwpAllDayEventElement: Checking grid row for new event', {

src/managers/AllDayManager.ts

@@ -84,7 +84,7 @@ export class AllDayManager {
       if (!isAllDayEvent) return;
 
       const eventId = draggedElement.dataset.eventId;
-      const dragClone = document.querySelector(`swp-allday-container swp-allday-event[data-event-id="clone-${eventId}"]`);
+      const dragClone = document.querySelector(`swp-allday-container swp-event[data-event-id="clone-${eventId}"]`);
       if (dragClone) {
         this.handleDragMove(dragClone as HTMLElement, mousePosition);
       }
@@ -101,8 +101,8 @@ export class AllDayManager {
         eventId: eventId,
         finalPosition
       });
+const dragClone = document.querySelector(`swp-allday-container swp-event[data-event-id="clone-${eventId}"]`);
 
-      const dragClone = document.querySelector(`swp-allday-container swp-allday-event[data-event-id="clone-${eventId}"]`);
 
       console.log('🎯 AllDayManager: Ending drag for all-day event', { eventId });
       this.handleDragEnd(draggedElement, dragClone as HTMLElement, finalPosition.column);
@@ -191,8 +191,8 @@ export class AllDayManager {
   public checkAndAnimateAllDayHeight(): void {
     const container = this.getAllDayContainer();
     if (!container) return;
+const allDayEvents = container.querySelectorAll('swp-event');
 
-    const allDayEvents = container.querySelectorAll('swp-allday-event');
 
     // Calculate required rows - 0 if no events (will collapse)
     let maxRows = 0;
@@ -339,7 +339,7 @@ export class AllDayManager {
     };
 
     // Check if all-day clone already exists for this event ID
-    const existingAllDayEvent = document.querySelector(`swp-allday-container swp-allday-event[data-event-id="${eventId}"]`);
+    const existingAllDayEvent = document.querySelector(`swp-allday-container swp-event[data-event-id="${eventId}"]`);
     if (existingAllDayEvent) {
       // All-day event already exists, just ensure clone is hidden
       const dragClone = document.querySelector(`swp-event[data-event-id="clone-${eventId}"]`);

src/managers/DragDropManager.ts

@@ -42,7 +42,7 @@ export class DragDropManager {
   private initialMousePosition: Position = { x: 0, y: 0 };
 
   // Drag state
-  private draggedElement: HTMLElement  | null = null ;
+  private draggedElement!: HTMLElement | null;
   private currentColumn: string | null = null;
   private isDragStarted = false;
 
@@ -134,7 +134,7 @@ export class DragDropManager {
     let eventElement = target;
 
     while (eventElement && eventElement.tagName !== 'SWP-EVENTS-LAYER') {
-      if (eventElement.tagName === 'SWP-EVENT' || eventElement.tagName === 'SWP-ALLDAY-EVENT') {
+      if (eventElement.tagName === 'SWP-EVENT') {
         break;
       }
       eventElement = eventElement.parentElement as HTMLElement;

src/renderers/AllDayEventRenderer.ts

@@ -60,7 +60,7 @@ export class AllDayEventRenderer {
     const container = this.getContainer();
     if (!container) return;
 
-    const eventElement = container.querySelector(`swp-allday-event[data-event-id="${eventId}"]`);
+    const eventElement = container.querySelector(`swp-event[data-event-id="${eventId}"]`);
     if (eventElement) {
       eventElement.remove();
     }

wwwroot/css/calendar-layout-css.css

@@ -299,7 +299,7 @@ swp-allday-column {
 }
 
 /* All-day events in containers */
-swp-allday-event {
+swp-allday-container swp-event {
   height: 22px; /* Fixed height for consistent stacking */
   background: #ff9800; /* Default orange background */
   display: flex;
@@ -317,7 +317,7 @@ swp-allday-event {
   border-left: 3px solid rgba(0, 0, 0, 0.2);
 }
 
-swp-allday-event:last-child {
+swp-allday-container swp-event:last-child {
   margin-bottom: 0;
 }