diff --git a/functionalTests/designer/surface.ts b/functionalTests/designer/surface.ts index a435d972e3..0ea1735c20 100644 --- a/functionalTests/designer/surface.ts +++ b/functionalTests/designer/surface.ts @@ -395,4 +395,25 @@ test("Check page adorner state is restored after shrink and stretch", async (t) await t.expect(Selector(".svc-page__content-actions #duplicate .svc-page-toolbar-item__title--with-icon").visible).notOk(); await t.resizeWindow(1920, 1080); await t.expect(Selector(".svc-page__content-actions #duplicate .svc-page-toolbar-item__title--with-icon").visible).ok(); +}); +test("Popup position", async (t) => { + const setCreatorTop = ClientFunction((top) => { + const el = document.querySelector(".svc-creator") as HTMLElement; + el.style.marginTop = top; + }); + await setCreatorTop("200px"); + + await t.resizeWindow(1400, 900); + await setJSON({ + "elements": [ + { + "type": "text", + "name": "q1" + } + ] + }); + await t.click('button[title="Survey settings"]'); + await t.click('[data-name="locale"]'); + await t.expect(ClientFunction(() => { return document.querySelector('[data-name="locale"] .sv-popup__container')?.getBoundingClientRect().top; })()).gte(200); + await setCreatorTop(""); }); \ No newline at end of file diff --git a/packages/survey-creator-angular/src/side-bar/side-bar-property-grid-header.component.html b/packages/survey-creator-angular/src/side-bar/side-bar-property-grid-header.component.html index c71dda8669..6bf5520a2e 100644 --- a/packages/survey-creator-angular/src/side-bar/side-bar-property-grid-header.component.html +++ b/packages/survey-creator-angular/src/side-bar/side-bar-property-grid-header.component.html @@ -8,7 +8,7 @@ {{model.tooltip}} - + diff --git a/packages/survey-creator-angular/src/toolbox/toolbox-item-group.component.html b/packages/survey-creator-angular/src/toolbox/toolbox-item-group.component.html index 2d4de261d2..c27ac45fdf 100644 --- a/packages/survey-creator-angular/src/toolbox/toolbox-item-group.component.html +++ b/packages/survey-creator-angular/src/toolbox/toolbox-item-group.component.html @@ -3,6 +3,6 @@
- +
\ 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 440fbdf9ad..d606ce0243 100644 --- a/packages/survey-creator-core/src/creator-base.ts +++ b/packages/survey-creator-core/src/creator-base.ts @@ -2292,6 +2292,10 @@ export class SurveyCreatorModel extends Base if (reason === "test" || reason === "theme") { this.onPreviewSurveyCreated.fire(this, { survey: survey }); } + + survey.onPopupVisibleChanged.add((_, options) => { + if (!options.popup.getAreaCallback) options.popup.getAreaCallback = () => { return this.rootElement; }; + }); return survey; } private getSurveyInstanceCreatedArea(reason: string): string { @@ -3745,6 +3749,7 @@ export class SurveyCreatorModel extends Base horizontalPosition: "center", displayMode: this.isTouch ? "overlay" : "popup" }); + newAction.popupModel.getTargetCallback = undefined; return newAction; } diff --git a/packages/survey-creator-core/src/custom-questions/question-color.ts b/packages/survey-creator-core/src/custom-questions/question-color.ts index cafc78e7b3..e09d5e1c65 100644 --- a/packages/survey-creator-core/src/custom-questions/question-color.ts +++ b/packages/survey-creator-core/src/custom-questions/question-color.ts @@ -142,6 +142,7 @@ export class QuestionColorModel extends QuestionTextModel { popupModel.displayMode = IsTouch ? "overlay" : "popup"; popupModel.setWidthByTarget = true; popupModel.positionMode = "fixed"; + popupModel.getTargetCallback = undefined; listModel.isItemSelected = (itemValue: ItemValue) => itemValue.value == this.value; return action; } diff --git a/packages/survey-creator-core/src/property-grid/property-grid-view-model.ts b/packages/survey-creator-core/src/property-grid/property-grid-view-model.ts index e5b3cedaee..317f8bcc47 100644 --- a/packages/survey-creator-core/src/property-grid/property-grid-view-model.ts +++ b/packages/survey-creator-core/src/property-grid/property-grid-view-model.ts @@ -1,4 +1,4 @@ -import { Base, SurveyModel, property, PopupModel, Action, CssClassBuilder } from "survey-core"; +import { Base, SurveyModel, property, PopupModel, Action, CssClassBuilder, getActionDropdownButtonTarget } from "survey-core"; import { PropertyGridModel } from "./index"; import { SelectionHistory } from "../selection-history"; import { SurveyHelper } from "../survey-helper"; @@ -149,6 +149,7 @@ export class PropertyGridViewModel extends Base { ); this.selectorPopupModel.cssClass += " svc-object-selector"; this.selectorPopupModel.displayMode = this.creator.isTouch ? "overlay" : "popup"; + this.selectorPopupModel.getTargetCallback = getActionDropdownButtonTarget; this.selectorPopupModel.registerPropertyChangedHandlers(["isVisible"], () => { if (!this.selectorPopupModel.isVisible) { this.objectSelectionAction.pressed = false; diff --git a/packages/survey-creator-core/src/toolbox.ts b/packages/survey-creator-core/src/toolbox.ts index 2203290749..c97b581f54 100644 --- a/packages/survey-creator-core/src/toolbox.ts +++ b/packages/survey-creator-core/src/toolbox.ts @@ -254,6 +254,7 @@ export class QuestionToolboxItem extends Action implements IQuestionToolboxItem if (!items || items.length < 1) return; this.setSubItems({ items: items }); + this.popupModel.getAreaCallback = this.getArea; this.component = QuestionToolbox.defaultItemGroupComponent; } /** diff --git a/packages/survey-creator-knockout/src/side-bar/side-bar-property-grid-header.html b/packages/survey-creator-knockout/src/side-bar/side-bar-property-grid-header.html index 083e7fd8d0..e6a26e0aa7 100644 --- a/packages/survey-creator-knockout/src/side-bar/side-bar-property-grid-header.html +++ b/packages/survey-creator-knockout/src/side-bar/side-bar-property-grid-header.html @@ -8,7 +8,7 @@ - + \ No newline at end of file diff --git a/packages/survey-creator-knockout/src/toolbox/toolbox-item-group.html b/packages/survey-creator-knockout/src/toolbox/toolbox-item-group.html index 5815db3a91..3cf816c845 100644 --- a/packages/survey-creator-knockout/src/toolbox/toolbox-item-group.html +++ b/packages/survey-creator-knockout/src/toolbox/toolbox-item-group.html @@ -3,5 +3,5 @@
- +
\ No newline at end of file diff --git a/packages/survey-creator-react/src/side-bar/SideBarPropertyGridHeader.tsx b/packages/survey-creator-react/src/side-bar/SideBarPropertyGridHeader.tsx index feb3cbb5ba..04bc418b08 100644 --- a/packages/survey-creator-react/src/side-bar/SideBarPropertyGridHeader.tsx +++ b/packages/survey-creator-react/src/side-bar/SideBarPropertyGridHeader.tsx @@ -31,7 +31,7 @@ class SideBarPropertyGridHeader extends SurveyElementBase
{button} - +
diff --git a/packages/survey-creator-react/src/toolbox/ToolboxItemGroup.tsx b/packages/survey-creator-react/src/toolbox/ToolboxItemGroup.tsx index db00fd055c..0cafcbe99b 100644 --- a/packages/survey-creator-react/src/toolbox/ToolboxItemGroup.tsx +++ b/packages/survey-creator-react/src/toolbox/ToolboxItemGroup.tsx @@ -38,7 +38,7 @@ export class SurveyCreatorToolboxItemGroup extends CreatorModelElement this.model.onMouseLeave(this.item, event)} > - + ; } diff --git a/packages/survey-creator-vue/src/side-bar/SideBarPropertyGridHeader.vue b/packages/survey-creator-vue/src/side-bar/SideBarPropertyGridHeader.vue index ef0ed29cf0..37947d788d 100644 --- a/packages/survey-creator-vue/src/side-bar/SideBarPropertyGridHeader.vue +++ b/packages/survey-creator-vue/src/side-bar/SideBarPropertyGridHeader.vue @@ -14,7 +14,7 @@ {{ model.tooltip }} - + diff --git a/packages/survey-creator-vue/src/toolbox/ToolboxItemGroup.vue b/packages/survey-creator-vue/src/toolbox/ToolboxItemGroup.vue index 47639a8e59..e8f96ec39d 100644 --- a/packages/survey-creator-vue/src/toolbox/ToolboxItemGroup.vue +++ b/packages/survey-creator-vue/src/toolbox/ToolboxItemGroup.vue @@ -11,7 +11,6 @@ @@ -19,7 +18,6 @@ import { SvComponent } from "survey-vue3-ui"; import type { SurveyCreatorModel, - IQuestionToolboxItem, ToolboxToolViewModel, QuestionToolboxItem, } from "survey-creator-core";