diff --git a/src/v2/features/headerdrawer/HeaderDrawerRenderer.ts b/src/v2/features/headerdrawer/HeaderDrawerRenderer.ts
index 0a0e680..e1ef734 100644
--- a/src/v2/features/headerdrawer/HeaderDrawerRenderer.ts
+++ b/src/v2/features/headerdrawer/HeaderDrawerRenderer.ts
@@ -1,6 +1,7 @@
 import { IEventBus } from '../../types/CalendarTypes';
 import { IGridConfig } from '../../core/IGridConfig';
 import { CoreEvents } from '../../constants/CoreEvents';
+import { HeaderDrawerManager } from '../../core/HeaderDrawerManager';
 import {
   IDragEnterHeaderPayload,
   IDragMoveHeaderPayload,
@@ -20,10 +21,12 @@ export class HeaderDrawerRenderer {
   private currentItem: HTMLElement | null = null;
   private container: HTMLElement | null = null;
   private sourceElement: HTMLElement | null = null;
+  private wasExpandedBeforeDrag = false;
 
   constructor(
     private eventBus: IEventBus,
-    private gridConfig: IGridConfig
+    private gridConfig: IGridConfig,
+    private headerDrawerManager: HeaderDrawerManager
   ) {
     this.setupListeners();
   }
@@ -63,6 +66,12 @@ export class HeaderDrawerRenderer {
     this.container = document.querySelector('swp-header-drawer');
     if (!this.container) return;
 
+    // Remember if drawer was already expanded
+    this.wasExpandedBeforeDrag = this.headerDrawerManager.isExpanded();
+
+    // Expand drawer with animation
+    this.headerDrawerManager.expand();
+
     // Store reference to source element
     this.sourceElement = payload.element;
 
@@ -147,5 +156,10 @@ export class HeaderDrawerRenderer {
       this.sourceElement.style.visibility = '';
       this.sourceElement = null;
     }
+
+    // Collapse drawer if it wasn't expanded before drag
+    if (!this.wasExpandedBeforeDrag) {
+      this.headerDrawerManager.collapse();
+    }
   }
 }