diff --git a/packages/survey-creator-angular/src/tabs/designer/designer.component.html b/packages/survey-creator-angular/src/tabs/designer/designer.component.html
index 670fefb34c..764532a2d4 100644
--- a/packages/survey-creator-angular/src/tabs/designer/designer.component.html
+++ b/packages/survey-creator-angular/src/tabs/designer/designer.component.html
@@ -5,7 +5,7 @@
     </ng-container>
   </div>
   <div class="svc-tab-designer" [class]="model.getRootCss()" (click)="model.clickDesigner()">
-    <sv-scroll>
+    <sv-scroll [onInnerHeightChanged]="model.setHasScroll">
       <div class="svc-tab-designer_content">
         <ng-container *ngIf="model.showPlaceholder">
           <div *ngIf="creator.showHeaderInEmptySurvey && creator.allowEditSurveyTitle" class="svc-designer-header">
diff --git a/packages/survey-creator-core/src/components/survey-element-adorner-base.ts b/packages/survey-creator-core/src/components/survey-element-adorner-base.ts
index fde14f8bd4..6ea5a7de07 100644
--- a/packages/survey-creator-core/src/components/survey-element-adorner-base.ts
+++ b/packages/survey-creator-core/src/components/survey-element-adorner-base.ts
@@ -16,6 +16,16 @@ import { DropIndicatorPosition } from "../drag-drop-enums";
 import { cleanHtmlElementAfterAnimation, prepareElementForVerticalAnimation } from "survey-core";
 import { SurveyElementActionContainer } from "./action-container-view-model";
 
+function getOffsetTop(element: HTMLElement, offsetParent: HTMLElement): number {
+  let offsetTop = element.offsetTop;
+  let parent = element.offsetParent as HTMLElement;
+  while(parent && parent !== offsetParent) {
+    offsetTop += parent.offsetTop;
+    parent = parent.offsetParent as HTMLElement;
+  }
+  return offsetTop;
+}
+
 function debounce(func, delay) {
   let timeout;
   return function (...args) {
@@ -36,6 +46,29 @@ const updateRowsVisibility = debounce((target: SurveyElementAdornerBase) => {
 }, 50);
 
 export class SurveyElementAdornerBase<T extends SurveyElement = SurveyElement> extends Base {
+  private initialElementOffsetTop = 0;
+  private initialContainerScrollTop = 0;
+  public saveRelativePosition() {
+    if (!!this.rootElement) {
+      const container = this.rootElement.closest<HTMLElement>(".sv-scroll__container");
+      if (!!container) {
+        this.initialElementOffsetTop = getOffsetTop(this.rootElement, container);
+        this.initialContainerScrollTop = container.parentElement.scrollTop;
+      }
+    }
+  }
+  public restoreRelativePosition() {
+    if (!!this.rootElement) {
+      const container = this.rootElement.closest<HTMLElement>(".sv-scroll__container");
+      if (!!container) {
+        setTimeout(() => {
+          const currentOffsetTop = getOffsetTop(this.rootElement, container);
+          const deltaTop = currentOffsetTop - this.initialElementOffsetTop;
+          container.parentElement.scrollTop = this.initialContainerScrollTop + deltaTop;
+        }, 10);
+      }
+    }
+  }
   public static AdornerValueName = "__sjs_creator_adorner";
   protected expandCollapseAction: IAction;
   @property({ defaultValue: true }) allowDragging: boolean;
@@ -217,6 +250,32 @@ export class SurveyElementAdornerBase<T extends SurveyElement = SurveyElement> e
     }
   }
 
+  public dragEnter() {
+    if (this.hasDragLeft) {
+      clearTimeout(this.dragCollapsedTimer);
+      this.hasDragLeft = false;
+    }
+  }
+  private hasDragLeft = false;
+  public dragLeave() {
+    if (!this.creator.collapseOnDragLeft) {
+      return;
+    }
+    if (!this.hasDragLeft) {
+      if (this.canExpandOnDrag && !this.collapsed) {
+        this.hasDragLeft = true;
+        this.dragCollapsedTimer = setTimeout(() => {
+          this.collapseWithDragLeave();
+        }, this.creator.expandOnDragTimeOut);
+      }
+    }
+  }
+  protected collapseWithDragLeave() {
+    this.collapsed = true;
+    this.dragCollapsedTimer = undefined;
+    this.hasDragLeft = false;
+  }
+
   protected allowExpandCollapseByDblClick(element: any) {
     return true;
   }
diff --git a/packages/survey-creator-core/src/components/tabs/designer.ts b/packages/survey-creator-core/src/components/tabs/designer.ts
index 1e5cd3853d..9277d8c801 100644
--- a/packages/survey-creator-core/src/components/tabs/designer.ts
+++ b/packages/survey-creator-core/src/components/tabs/designer.ts
@@ -427,4 +427,8 @@ export class TabDesignerViewModel extends Base {
     rootCss += " svc-tab-designer--" + this.creator.pageEditMode + "-mode";
     return rootCss;
   }
+
+  public setHasScroll = (hasScroll: boolean) => {
+    this.creator.hasScroll = hasScroll;
+  };
 }
\ No newline at end of file
diff --git a/packages/survey-creator-core/src/creator-base.ts b/packages/survey-creator-core/src/creator-base.ts
index fa0dedc99f..db76680ffc 100644
--- a/packages/survey-creator-core/src/creator-base.ts
+++ b/packages/survey-creator-core/src/creator-base.ts
@@ -44,7 +44,7 @@ import { ICreatorOptions } from "./creator-options";
 import { Translation } from "../src/components/tabs/translation";
 import { StringEditorConnector } from "./components/string-editor";
 import { ThemeTabPlugin } from "./components/tabs/theme-plugin";
-import { DragDropSurveyElements } from "./dragdrop-survey-elements";
+import { DragDropSurveyElements, getPathToRootPageElement } from "./dragdrop-survey-elements";
 import { PageAdorner } from "./components/page";
 import {
   ElementDeletingEvent, PropertyGetReadOnlyEvent, ElementGetDisplayNameEvent, ElementAllowOperationsEvent,
@@ -2325,9 +2325,12 @@ export class SurveyCreatorModel extends Base
     this.dragDropSurveyElements.onDragStart.add((sender, options) => {
       const element = sender.draggedElement;
       isDraggedFromToolbox = !element.parent && !element.isPage;
-      if (!!element && (element.isPage || this.collapseOnDrag)) {
+      if (!!element && !isDraggedFromToolbox && (element.isPage || (this.collapseOnDrag !== false && this.collapseOnDrag !== "none"))) {
         this.designerStateManager?.suspend();
-        this.collapseAllPagesOnDragStart(element);
+        const adorner = SurveyElementAdornerBase.GetAdorner(element);
+        adorner?.saveRelativePosition();
+        this.collapseElementsOnDragStart(element);
+        adorner?.restoreRelativePosition();
       }
       this.onDragStart.fire(this, options);
       this.startUndoRedoTransaction("drag drop");
@@ -2347,20 +2350,31 @@ export class SurveyCreatorModel extends Base
       }
     });
     this.dragDropSurveyElements.onDragClear.add((sender, options) => {
-      isDraggedFromToolbox = false;
       this.stopUndoRedoTransaction();
-      if (!!options.draggedElement && (options.draggedElement.isPage || this.collapseOnDrag)) {
-        this.designerStateManager?.release();
-        this.restoreElementsState();
+      if (!!options.draggedElement && !isDraggedFromToolbox && (options.draggedElement.isPage || (this.collapseOnDrag !== false && this.collapseOnDrag !== "none"))) {
+        setTimeout(() => {
+          const adorner = SurveyElementAdornerBase.GetAdorner(options.draggedElement);
+          adorner?.saveRelativePosition();
+          this.designerStateManager?.release();
+          this.restoreElementsStateOnDragEnd();
+          adorner?.restoreRelativePosition();
+        }, 0);
       }
+      isDraggedFromToolbox = false;
       this.onDragClear.fire(this, options);
     });
   }
   public get designerStateManager() {
     return (this.getPlugin("designer") as TabDesignerPlugin)?.designerStateManager;
   }
-  public collapseAllPagesOnDragStart(element: SurveyElement): void {
-    this.expandCollapseManager.expandCollapseElements("drag-start", true, this.survey.pages.filter(p => !element || element.isPage || p !== (element as any).page));
+  public hasScroll: boolean = false;
+  public collapseElementsOnDragStart(element: SurveyElement): void {
+    if (element.isPage || this.collapseOnDrag === "pages") {
+      this.expandCollapseManager.expandCollapseElements("drag-start", true, this.survey.pages.filter(p => !element || element.isPage || p !== (element as any).page));
+    } else if (this.collapseOnDrag === true || this.collapseOnDrag === "all" || this.collapseOnDrag === "adaptive" && this.hasScroll) {
+      const exeptions = getPathToRootPageElement(element);
+      this.collapseAll(exeptions, true);
+    }
   }
   public getElementExpandCollapseState(element: Question | PageModel | PanelModel, reason: ElementGetExpandCollapseStateEventReason, defaultValue: boolean): boolean {
     if (this.expandCollapseButtonVisibility == "never") return false;
@@ -2388,16 +2402,12 @@ export class SurveyCreatorModel extends Base
     }
     SurveyElementAdornerBase.RestoreStateFor(element);
   }
-  public restoreElementsState(): void {
-    this.survey.pages.forEach(element => {
-      if (element["draggedFrom"] !== undefined) {
-        const adorner = SurveyElementAdornerBase.GetAdorner(element);
-        adorner?.blockAnimations();
-        this.restoreState(element);
-        adorner?.releaseAnimations();
-      } else {
-        this.restoreState(element);
-      }
+  public restoreElementsStateOnDragEnd(): void {
+    this.expandCollapseManager?.getCollapsableElements().forEach(element => {
+      const adorner = SurveyElementAdornerBase.GetAdorner(element);
+      adorner?.blockAnimations();
+      this.restoreState(element);
+      adorner?.releaseAnimations();
     });
   }
   private initDragDropChoices() {
@@ -4586,16 +4596,16 @@ export class SurveyCreatorModel extends Base
    * @see expandAll
    * @see collapseElement
    */
-  public collapseAll() {
-    this.expandCollapseManager.expandCollapseElements(null, true);
+  public collapseAll(exceptions?: SurveyElement[], blockAnimations = false) {
+    this.expandCollapseManager.expandCollapseElements(null, true, undefined, exceptions, blockAnimations);
   }
   /**
    * Expands all survey elements on the design surface.
    * @see collapseAll
    * @see expandElement
    */
-  public expandAll() {
-    this.expandCollapseManager.expandCollapseElements(null, false);
+  public expandAll(exceptions?: SurveyElement[], blockAnimations = false) {
+    this.expandCollapseManager.expandCollapseElements(null, false, undefined, exceptions, blockAnimations);
   }
   /**
    * Collapses an individual survey element on the design surface.
@@ -4721,7 +4731,8 @@ export class SurveyCreatorModel extends Base
    *
    * Default value: `false`
    */
-  public collapseOnDrag: boolean = false;
+  public collapseOnDrag: true | false | "none" | "pages" | "all" | "adaptive" = false;
+  public collapseOnDragLeft: boolean = false;
   /**
    * Specifies whether to clear translations to other languages when a source language translation is changed.
    *
diff --git a/packages/survey-creator-core/src/dragdrop-survey-elements.ts b/packages/survey-creator-core/src/dragdrop-survey-elements.ts
index 5870bdbf23..511056ce76 100644
--- a/packages/survey-creator-core/src/dragdrop-survey-elements.ts
+++ b/packages/survey-creator-core/src/dragdrop-survey-elements.ts
@@ -50,6 +50,27 @@ export function calculateDragOverLocation(clientX: number, clientY: number, rect
   }
 }
 
+export function getPathToRootPageElement(element: ISurveyElement) {
+  let path = [];
+  let target: any = element;
+  let lastTarget = element;
+  while(!!target) {
+    if (target.isInteractiveDesignElement) {
+      path.push(target);
+      lastTarget = target;
+    }
+    let parent = target.parent || target.parentQuestion;
+    if (!parent && target.data && target.data.data && target.data.data.getType && target.data.data.getType() === "matrixdropdown") {
+      parent = target.data.data;
+    }
+    target = parent;
+  }
+  if (!lastTarget.isPage) {
+    path.push((element as any).page || (element as any).__page); // TODO: remove __page
+  }
+  return path;
+}
+
 export class DragDropSurveyElements extends DragDropCore<any> {
   public static newGhostPage: PageModel = null;
   public static restrictDragQuestionBetweenPages: boolean = false;
@@ -343,6 +364,44 @@ export class DragDropSurveyElements extends DragDropCore<any> {
     }
     return allowOptions.allow;
   }
+  public prevDropTargetPath: ISurveyElement[] = [];
+  updatePathToDragOver(dropTarget: ISurveyElement, prevDropTarget: ISurveyElement) {
+    if (!dropTarget) {
+      this.leaveDragOverElements(this.prevDropTargetPath);
+      this.prevDropTargetPath = [];
+      return;
+    }
+    if (dropTarget !== prevDropTarget) {
+      let dropTargetPath = getPathToRootPageElement(dropTarget);
+      dropTargetPath = dropTargetPath.reverse();
+      for (let i = 0; i < this.prevDropTargetPath.length && i < dropTargetPath.length; i++) {
+        if (this.prevDropTargetPath[i] !== dropTargetPath[i]) {
+          this.leaveDragOverElements(this.prevDropTargetPath.slice(i));
+          this.enterDragOverElements(dropTargetPath.slice(i));
+          break;
+        }
+      }
+      this.prevDropTargetPath = dropTargetPath;
+    }
+  }
+  private leaveDragOverElements(elements: ISurveyElement[]) {
+    elements && elements.forEach((element) => {
+      const adorner = SurveyElementAdornerBase.GetAdorner(element as any);
+      if (adorner) {
+        adorner.dropIndicatorPosition = null;
+        adorner.dragLeave();
+      }
+    });
+  }
+  private enterDragOverElements(elements: ISurveyElement[]) {
+    elements && elements.forEach((element) => {
+      const adorner = SurveyElementAdornerBase.GetAdorner(element as any);
+      if (adorner) {
+        adorner.dragEnter();
+      }
+    });
+  }
+
   public dragOverCore(dropTarget: ISurveyElement, dragOverLocation: DropIndicatorPosition): void {
     const oldDragOverIndicatorElement = this.dragOverIndicatorElement;
     const oldDropTarget = this.dropTarget;
@@ -351,6 +410,8 @@ export class DragDropSurveyElements extends DragDropCore<any> {
       return;
     }
     this.dropTarget = dropTarget;
+    this.updatePathToDragOver(dropTarget, oldDropTarget);
+    // this.updatePathToDragOver(null, null);
     this.dragOverLocation = dragOverLocation;
 
     this.parentElement = this.dropTarget.isPage
diff --git a/packages/survey-creator-core/src/expand-collapse-manager.ts b/packages/survey-creator-core/src/expand-collapse-manager.ts
index 8e3d9f905e..8df1301940 100644
--- a/packages/survey-creator-core/src/expand-collapse-manager.ts
+++ b/packages/survey-creator-core/src/expand-collapse-manager.ts
@@ -13,8 +13,8 @@ export class ExpandCollapseManager {
   constructor(private creator: CreatorBase) {
   }
 
-  public expandCollapseElements(reason: ElementGetExpandCollapseStateEventReason, isCollapsed: boolean, elements: SurveyElement[] = null) {
-    this.updateCollapsed(elements || this.getCollapsableElements(), isCollapsed, reason);
+  public expandCollapseElements(reason: ElementGetExpandCollapseStateEventReason, isCollapsed: boolean, elements: SurveyElement[] = null, exceptions?: SurveyElement[], blockAnimations = false) {
+    this.updateCollapsed(elements || this.getCollapsableElements(), isCollapsed, reason, exceptions, blockAnimations);
   }
   public clearExpandChoicesStates() {
     this.expandChoicesStates = {};
@@ -78,7 +78,7 @@ export class ExpandCollapseManager {
   public lockQuestions(locked: boolean) {
     this._lockQuestions = locked;
   }
-  private getCollapsableElements() {
+  public getCollapsableElements() {
     return (this.creator.survey.pages as SurveyElement[])
       .concat(this.creator.survey.getAllPanels() as unknown as SurveyElement[])
       .concat(this.creator.survey.getAllQuestions() as SurveyElement[]);
@@ -90,15 +90,18 @@ export class ExpandCollapseManager {
       return a - b;
     });
   }
-  private updateCollapsed(elements: SurveyElement[], value: boolean, reason: ElementGetExpandCollapseStateEventReason) {
+  private updateCollapsed(elements: SurveyElement[], value: boolean, reason: ElementGetExpandCollapseStateEventReason, exceptions?: SurveyElement[], blockAnimations = false) {
     this.sortElements(elements).forEach(element => {
       if (element.isQuestion && this._lockQuestions) return;
+      if (exceptions && exceptions.indexOf(element) > -1) return;
       const collapsed = this.creator.getElementExpandCollapseState(element as Question | PageModel | PanelModel, reason, value);
       this.creator.designerStateManager?.setElementCollapsed(element, collapsed);
       const adorner = SurveyElementAdornerBase.GetAdorner(element);
       if (adorner && adorner.allowExpandCollapse) {
         const newState = this.creator.getElementExpandCollapseState(element as Question | PageModel | PanelModel, reason, value);
+        blockAnimations && adorner.blockAnimations();
         adorner.collapsed = newState;
+        blockAnimations && adorner.releaseAnimations();
       }
     });
   }
diff --git a/packages/survey-creator-core/tests/dragdrop-elements.tests.ts b/packages/survey-creator-core/tests/dragdrop-elements.tests.ts
index 13a842094a..c3fd24d48d 100644
--- a/packages/survey-creator-core/tests/dragdrop-elements.tests.ts
+++ b/packages/survey-creator-core/tests/dragdrop-elements.tests.ts
@@ -1,4 +1,4 @@
-import { PanelModel, Question, QuestionPanelDynamicModel, QuestionTextModel, SurveyModel } from "survey-core";
+import { PanelModel, Question, QuestionMatrixDropdownModel, QuestionPanelDynamicModel, QuestionTextModel, SurveyModel } from "survey-core";
 import { DragDropSurveyElements, calculateDragOverLocation, calculateIsEdge, calculateIsSide } from "../src/dragdrop-survey-elements";
 import { DropIndicatorPosition } from "../src/drag-drop-enums";
 import { CreatorTester } from "./creator-tester";
@@ -1785,6 +1785,186 @@ test("drag drop move page shouldn't raise survey onPageAdded", () => {
   expect(pageAddedCounter).toBe(0);
 });
 
+test("collapse pages on element drag start", async () => {
+  const json = {
+    "pages": [
+      { "name": "page1", "elements": [{ "type": "text", "name": "q1" }] },
+      { "name": "page2", "elements": [{ "type": "text", "name": "q2" }] },
+      { "name": "page3", "elements": [{ "type": "text", "name": "q3" }] },
+    ]
+  };
+  const creator = new CreatorTester();
+  creator.collapseOnDrag = true;
+  creator.JSON = json;
+  const survey = creator.survey;
+  const [p1, p2, p3] = survey.pages;
+  const [q1, q2, q3] = survey.getAllQuestions();
+  const pa = survey.pages.map(p => new PageAdorner(creator, p));
+  const qa = survey.getAllQuestions().map(q => new QuestionAdornerViewModel(creator, q, null as any));
+
+  const ddHelper: any = creator.dragDropSurveyElements;
+  ddHelper.parentElement = p3;
+  ddHelper.draggedElement = q3;
+
+  ddHelper["createDraggedElementShortcut"] = () => { };
+  ddHelper.dragInit(null, ddHelper.draggedElement, ddHelper.parentElement, document.createElement("div"));
+
+  expect(pa[0].collapsed).toBeTruthy();
+  expect(pa[1].collapsed).toBeTruthy();
+  expect(pa[2].collapsed).toBeFalsy();
+
+  const promise = new Promise<void>((resolve) => {
+    setTimeout(() => {
+      resolve();
+    }, 10);
+  });
+  ddHelper.clear();
+  await promise;
+
+  expect(pa[0].collapsed).toBeFalsy();
+  expect(pa[1].collapsed).toBeFalsy();
+  expect(pa[2].collapsed).toBeFalsy();
+});
+
+test("collapse all containers except parent on element drag start", async () => {
+  const json = {
+    "pages": [
+      { "name": "page1", "elements": [{ "type": "panel", "name": "panel1" }, { "type": "panel", "name": "panel2", "elements": [{ "type": "text", "name": "q1" }] }] },
+      { "name": "page2", "elements": [{ "type": "text", "name": "q2" }] },
+      { "name": "page3", "elements": [{ "type": "panel", "name": "panel3" }, { "type": "panel", "name": "panel4", "elements": [{ "type": "text", "name": "q3" }] }] },
+    ]
+  };
+  const creator = new CreatorTester();
+  creator.collapseOnDrag = true;
+  creator.JSON = json;
+  const survey = creator.survey;
+  const [p1, p2, p3] = survey.pages;
+  const [pn1, pn2, pn3, pn4] = survey.getAllPanels();
+  const [q1, q2, q3] = survey.getAllQuestions();
+  const pa = survey.pages.map(p => new PageAdorner(creator, p));
+  const pna = survey.getAllPanels().map(p => new QuestionAdornerViewModel(creator, p as any, null as any));
+  const qa = survey.getAllQuestions().map(q => new QuestionAdornerViewModel(creator, q, null as any));
+
+  const ddHelper: any = creator.dragDropSurveyElements;
+  ddHelper.parentElement = p3;
+  ddHelper.draggedElement = q3;
+
+  ddHelper["createDraggedElementShortcut"] = async () => { };
+  ddHelper.dragInit(null, ddHelper.draggedElement, ddHelper.parentElement, document.createElement("div"));
+
+  expect(pa[0].collapsed).toBeTruthy();
+  expect(pna[0].collapsed).toBeTruthy();
+  expect(pna[1].collapsed).toBeTruthy();
+  expect(pa[1].collapsed).toBeTruthy();
+  expect(pa[2].collapsed).toBeFalsy();
+  expect(pna[2].collapsed).toBeTruthy();
+  expect(pna[3].collapsed).toBeFalsy();
+
+  const promise = new Promise<void>((resolve) => {
+    setTimeout(() => {
+      resolve();
+    }, 10);
+  });
+  ddHelper.clear();
+  await promise;
+
+  expect(pa[0].collapsed).toBeFalsy();
+  expect(pna[0].collapsed).toBeFalsy();
+  expect(pna[1].collapsed).toBeFalsy();
+  expect(pa[1].collapsed).toBeFalsy();
+  expect(pa[2].collapsed).toBeFalsy();
+  expect(pna[2].collapsed).toBeFalsy();
+  expect(pna[3].collapsed).toBeFalsy();
+});
+
+test("updatePathToDragOver", () => {
+  const json = {
+    "pages": [
+      {
+        "name": "page1",
+        "elements": [{ "type": "text", "name": "question1" }]
+      },
+      {
+        "name": "page2",
+        "elements": [
+          {
+            "type": "panel",
+            "name": "panel1",
+            "elements": [{ "type": "text", "name": "question2" }]
+          }
+        ]
+      },
+      {
+        "name": "page3",
+        "elements": [
+          {
+            "type": "paneldynamic",
+            "name": "question3",
+            "templateElements": [{ "type": "text", "name": "question4" }]
+          }
+        ]
+      },
+      {
+        "name": "page4",
+        "elements": [
+          {
+            "type": "matrixdropdown",
+            "name": "question5",
+            "columns": [{ "name": "Column 1" }, { "name": "Column 2" }, { "name": "Column 3" }],
+            "detailElements": [{ "type": "text", "name": "question6" }],
+            "detailPanelMode": "underRow",
+            "choices": [1, 2, 3],
+            "rows": ["Row 1", "Row 2"]
+          }
+        ]
+      },
+      {
+        "name": "page5",
+        "elements": [
+          {
+            "type": "panel",
+            "name": "panel2",
+            "elements": [
+              {
+                "type": "paneldynamic",
+                "name": "question7",
+                "templateElements": [
+                  {
+                    "type": "panel",
+                    "name": "panel3",
+                    "elements": [{ "type": "text", "name": "question8" }]
+                  }
+                ]
+              }
+            ]
+          }
+        ]
+      }
+    ]
+  };
+  const creator = new CreatorTester();
+  creator.JSON = json;
+  const survey = creator.survey;
+  const ddHelper: any = creator.dragDropSurveyElements;
+
+  ddHelper.updatePathToDragOver(survey.findQuestionByName("question1"), null);
+  expect(ddHelper.prevDropTargetPath.map(e => e.name)).toStrictEqual(["page1", "question1"]);
+
+  ddHelper.updatePathToDragOver(survey.findQuestionByName("question2"), null);
+  expect(ddHelper.prevDropTargetPath.map(e => e.name)).toStrictEqual(["page2", "panel1", "question2"]);
+
+  ddHelper.updatePathToDragOver((survey.findQuestionByName("question3") as QuestionPanelDynamicModel).template.elements[0], null);
+  expect(ddHelper.prevDropTargetPath.map(e => e.name)).toStrictEqual(["page3", "question3", "question4"]);
+
+  const matrix = survey.findQuestionByName("question5") as QuestionMatrixDropdownModel;
+  matrix.visibleRows[0].showDetailPanel();
+  ddHelper.updatePathToDragOver(matrix.visibleRows[0].detailPanel.elements[0], null);
+  expect(ddHelper.prevDropTargetPath.map(e => e.name)).toStrictEqual(["page4", "question5", "question6"]);
+
+  ddHelper.updatePathToDragOver(((survey.findQuestionByName("question7") as QuestionPanelDynamicModel).template.elements[0] as PanelModel).elements[0], null);
+  expect(ddHelper.prevDropTargetPath.map(e => e.name)).toStrictEqual(["page5", "panel2", "question7", "panel3", "question8"]);
+});
+
 test("SurveyElements: isDropTargetValid && forbiddenNestedElements", () => {
   const creator = new CreatorTester();
   creator.JSON = {
diff --git a/packages/survey-creator-core/tests/dragdrop.tests.ts b/packages/survey-creator-core/tests/dragdrop.tests.ts
index f28e8459f7..769d33acbd 100644
--- a/packages/survey-creator-core/tests/dragdrop.tests.ts
+++ b/packages/survey-creator-core/tests/dragdrop.tests.ts
@@ -989,7 +989,7 @@ test("Drag Drop Question with Multiline (StartWithNewLine === false)", () => {
   expect(page.rows[0].elements[2].name).toBe("q3"); // "r1 q3 check");
 });
 
-test("onModified is raised when frop from toolbox", (): any => {
+test("onModified is raised when drop from toolbox", (): any => {
   const creator = new CreatorTester();
   creator.JSON = {
     "pages": [
diff --git a/packages/survey-creator-core/tests/question-adorner.tests.ts b/packages/survey-creator-core/tests/question-adorner.tests.ts
index 3d168cee71..cccdef5701 100644
--- a/packages/survey-creator-core/tests/question-adorner.tests.ts
+++ b/packages/survey-creator-core/tests/question-adorner.tests.ts
@@ -1242,14 +1242,14 @@ test("Don't reset collapased state for moved question", () => {
   const page1 = creator.survey.pages[0];
   const page2 = creator.survey.pages[1];
   let pageAdorner = new PageAdorner(creator, page1);
-  creator.collapseAllPagesOnDragStart(page1);
+  creator.collapseElementsOnDragStart(page1);
   expect(pageAdorner.collapsed).toBeTruthy();
   creator.designerStateManager.suspend();
   creator.survey.pages.splice(0, 1);
   creator.survey.pages.splice(1, 0, page1);
   pageAdorner = new PageAdorner(creator, page1);
   creator.designerStateManager.release();
-  creator.restoreElementsState();
+  creator.restoreElementsStateOnDragEnd();
   expect(pageAdorner.collapsed).toBeTruthy();
 });
 
diff --git a/packages/survey-creator-core/tests/tabs/designer.test.ts b/packages/survey-creator-core/tests/tabs/designer.test.ts
index 01cebaf6ac..217f6d0dac 100644
--- a/packages/survey-creator-core/tests/tabs/designer.test.ts
+++ b/packages/survey-creator-core/tests/tabs/designer.test.ts
@@ -598,17 +598,17 @@ test("expand/collapse event - loading", () => {
   expect(questionAdorner.collapsed).toBeTruthy();
   expect(panelAdorner.collapsed).toBeFalsy();
 
-  creator.collapseAllPagesOnDragStart(creator.survey.pages[0]);
+  creator.collapseElementsOnDragStart(creator.survey.pages[0]);
   expect(page1Adorner.collapsed).toBeTruthy();
   expect(page2Adorner.collapsed).toBeFalsy();
   expect(questionAdorner.collapsed).toBeTruthy();
   expect(panelAdorner.collapsed).toBeFalsy();
 
-  creator.restoreElementsState();
+  creator.restoreElementsStateOnDragEnd();
   expect(page1Adorner.collapsed).toBeFalsy();
   expect(page2Adorner.collapsed).toBeFalsy();
   expect(questionAdorner.collapsed).toBeTruthy();
-  expect(panelAdorner.collapsed).toBeFalsy();
+  expect(panelAdorner.collapsed).toBeTruthy();
 });
 
 test("expand/collapse properties - loading", () => {
diff --git a/packages/survey-creator-react/src/tabs/Designer.tsx b/packages/survey-creator-react/src/tabs/Designer.tsx
index eac66f0ac0..a173526a3e 100644
--- a/packages/survey-creator-react/src/tabs/Designer.tsx
+++ b/packages/survey-creator-react/src/tabs/Designer.tsx
@@ -84,7 +84,7 @@ export class TabDesignerComponent extends SurveyElementBase<ITabDesignerComponen
           {this.model.isToolboxVisible ? ReactElementFactory.Instance.createElement("svc-toolbox", { model: this.creator }) : null}
         </div>
         <div className={designerTabClassName} onClick={() => this.model.clickDesigner()}>
-          <Scroll>
+          <Scroll onInnerHeightChanged={(hasScroll: boolean) => this.creator.hasScroll = hasScroll}>
             <div className="svc-tab-designer_content">
               {this.model.showPlaceholder ? this.renderPlaceHolder() : this.renderTabContent()}
             </div>
diff --git a/packages/survey-creator-vue/src/tabs/designer/Designer.vue b/packages/survey-creator-vue/src/tabs/designer/Designer.vue
index ec8a69821e..a1360419b2 100644
--- a/packages/survey-creator-vue/src/tabs/designer/Designer.vue
+++ b/packages/survey-creator-vue/src/tabs/designer/Designer.vue
@@ -11,7 +11,7 @@
     :class="model.getRootCss()"
     @click="model.clickDesigner"
   >
-    <SvComponent :is="'sv-scroll'">
+    <SvComponent :is="'sv-scroll'" :onInnerHeightChanged="model.setHasScroll">
       <div class="svc-tab-designer_content">
         <template v-if="model.showPlaceholder">
           <div