Merge branch 'master' of github.com:surveyjs/survey-creator into issu…

…e/6494-add-onCreatorThemePropertyChanged-event

functionalTests/designer/question-wrapper.ts

@@ -420,6 +420,30 @@ test("Question adorner - collapse button in differen modes", async (t) => {
   await ClientFunction(() => { window["creator"].expandCollapseButtonVisibility = "never"; })();
 });
 
+test("Question and page collapse button title", async (t) => {
+  await ClientFunction(() => { window["creator"].expandCollapseButtonVisibility = "always"; })();
+  await t.resizeWindow(1920, 1080);
+  const json = {
+    elements: [
+      {
+        type: "text",
+        name: "question1"
+      }
+    ]
+  };
+  await setJSON(json);
+  await t.hover(getToolboxItemByText("Single-Line Input"));
+  const qCollapseButton = Selector(".svc-question__content #collapse button");
+  await t.expect(qCollapseButton.getAttribute("title")).eql("Collapse");
+  await t.click(qCollapseButton);
+  await t.expect(qCollapseButton.getAttribute("title")).eql("Expand");
+
+  const pCollapseButton = Selector(".svc-page__content #collapse button");
+  await t.expect(pCollapseButton.getAttribute("title")).eql("Collapse");
+  await t.click(pCollapseButton);
+  await t.expect(pCollapseButton.getAttribute("title")).eql("Expand");
+});
+
 test("Question adorner - do not render content when initially collapsed", async (t) => {
   const json = {
     elements: [

packages/survey-creator-core/src/components/action-container-view-model.ts

@@ -406,6 +406,7 @@ export class SurveyElementAdornerBase<T extends SurveyElement = SurveyElement> e
     return {
       id: "collapse",
       css: "sv-action-bar-item--collapse",
+      locTooltipName: new ComputedUpdater<string>(() => this.collapsed ? "ed.expandTooltip" : "ed.collapseTooltip") as any,
       iconName: new ComputedUpdater<string>(() => this.collapsed ? expandIcon : collapseIcon) as any,
       iconSize: "auto",
       action: () => {

packages/survey-creator-core/src/components/page.ts

@@ -362,7 +362,7 @@ export class PageAdorner extends SurveyElementAdornerBase<PageModel> {
     const element = <any>this.surveyElement;
     const isElementSelected = this.creator.selectedElement === element;
     this.dragDropHelper.startDragSurveyElement(event, element, isElementSelected);
-    if (!!element && element.isPage && this.creator.collapseOnDrag.pages) {
+    if (!!element && element.isPage && this.creator.collapseOnDrag) {
       this.creator.designerStateManager?.suspend();
       this.creator.collapseAllPagesOnDragStart(element);
     }

packages/survey-creator-core/src/components/question.ts

@@ -399,7 +399,7 @@ export class QuestionAdornerViewModel extends SurveyElementAdornerBase {
     const element = <any>this.surveyElement;
     const isElementSelected = this.creator.selectedElement === element;
     this.dragDropHelper.startDragSurveyElement(event, element, isElementSelected);
-    if (!!element && (element.isPanel && this.creator.collapseOnDrag.panels || !element.isPanel && this.creator.collapseOnDrag.questions)) {
+    if (!!element && this.creator.collapseOnDrag) {
       this.creator.designerStateManager?.suspend();
       this.creator.collapseAllPagesOnDragStart(element);
     }

packages/survey-creator-core/src/creator-base.ts

@@ -38,7 +38,7 @@ import { TabDesignerPlugin } from "./components/tabs/designer-plugin";
 import { UndoRedoController } from "./plugins/undo-redo/undo-redo-controller";
 import { CreatorResponsivityManager } from "./creator-responsivity-manager";
 import { SidebarModel } from "./components/side-bar/side-bar-model";
-import { ICollapseOnDrag, ICreatorOptions } from "./creator-options";
+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";
@@ -2147,11 +2147,7 @@ export class SurveyCreatorModel extends Base
     this.dragDropSurveyElements.onDragClear.add((sender, options) => {
       isDraggedFromToolbox = false;
       this.stopUndoRedoTransaction();
-      if (!!options.draggedElement &&
-        (options.draggedElement.isPage && this.collapseOnDrag.pages ||
-          options.draggedElement.isPanel && this.collapseOnDrag.panels ||
-          !options.draggedElement.isPanel && !options.draggedElement.isPage && this.collapseOnDrag.questions)
-      ) {
+      if (!!options.draggedElement && this.collapseOnDrag) {
         this.designerStateManager?.release();
         this.restoreElementsState();
       }
@@ -4279,46 +4275,12 @@ export class SurveyCreatorModel extends Base
   public set allowDragPages(newValue: boolean) {
     this._allowDragPages = newValue;
   }
-  private _collapseOnDrag: ICollapseOnDrag = {
-    questions: true,
-    panels: true,
-    pages: true
-  };
   /**
-   * Specifies whether questions, panels, and pages on the design surface collapse when users start dragging a survey element.
-   * 
-   * Default value: `{ questions: true, panels: true, pages: true }` (collapse all survey elements)
-   * 
-   * You can disable collapsing of individual survey element types or turn off this feature completely:
+   * Specifies whether to collapse pages on the design surface when users start dragging a survey element.
    * 
-   * ```js
-   * const creatorOptions = {
-   *   // Do not collapse questions
-   *   collapseOnDrag: {
-   *     pages: true,
-   *     panels: true,
-   *     questions: false
-   *   },
-   *   // Do not collapse any survey elements
-   *   collapseOnDrag: false
-   * };
-   * const creator = new SurveyCreatorModel(creatorOptions);
-   * ```
+   * Default value: `true`
    */
-  public get collapseOnDrag(): ICollapseOnDrag {
-    return this._collapseOnDrag;
-  }
-  public set collapseOnDrag(newValue: boolean | ICollapseOnDrag) {
-    if (typeof newValue === "object") {
-      this._collapseOnDrag.pages = !!newValue.pages;
-      this._collapseOnDrag.panels = !!newValue.panels;
-      this._collapseOnDrag.questions = !!newValue.questions;
-    } else {
-      this._collapseOnDrag.pages = !!newValue;
-      this._collapseOnDrag.panels = !!newValue;
-      this._collapseOnDrag.questions = !!newValue;
-    }
-  }
+  public collapseOnDrag: boolean = true;
 }
 
 export class CreatorBase extends SurveyCreatorModel { }

packages/survey-creator-core/src/creator-options.ts

@@ -1,6 +1,3 @@
-export interface ICollapseOnDrag {
-  questions: boolean; panels: boolean; pages: boolean;
-}
 /**
  * Survey Creator configuration. Pass it as an argument to the `SurveyCreator`/`SurveyCreatorModel` constructor:
  *
@@ -415,25 +412,9 @@ export interface ICreatorOptions {
    */
   allowDragPages?: boolean;
   /**
-   * Specifies whether questions, panels, and pages on the design surface collapse when users start dragging a survey element.
-   * 
-   * Default value: `{ questions: true, panels: true, pages: true }` (collapse all survey elements)
-   * 
-   * You can disable collapsing of individual survey element types or turn off this feature completely:
+   * Specifies whether to collapse pages on the design surface when users start dragging a survey element.
    * 
-   * ```js
-   * const creatorOptions = {
-   *   // Do not collapse questions
-   *   collapseOnDrag: {
-   *     pages: true,
-   *     panels: true,
-   *     questions: false
-   *   },
-   *   // Do not collapse any survey elements
-   *   collapseOnDrag: false
-   * };
-   * const creator = new SurveyCreatorModel(creatorOptions);
-   * ```
-   */
-  collapseOnDrag?: boolean | ICollapseOnDrag;
+   * Default value: `true`
+   */
+  collapseOnDrag?: boolean;
 }

packages/survey-creator-core/src/localization/english.ts

@@ -109,6 +109,8 @@ export var enStrings = {
     redo: "Redo",
     undoTooltip: "Undo last change",
     redoTooltip: "Redo the change",
+    expandTooltip: "Expand",
+    collapseTooltip: "Collapse",
     expandAllTooltip: "Expand All",
     collapseAllTooltip: "Collapse All",
     zoomInTooltip: "Zoom In",