survey-creator-core 2.0.0 → 2.0.2

package/fesm/survey-creator-core.js

@@ -1,12 +1,12 @@
 /*!
- * SurveyJS Creator v2.0.0
+ * SurveyJS Creator v2.0.2
  * (c) 2015-2025 Devsoft Baltic OÜ - http://surveyjs.io/
  * Github: https://github.com/surveyjs/survey-creator
  * License: https://surveyjs.io/Licenses#SurveyCreator
  */
 
 import * as Survey from 'survey-core';
-import { surveyLocalization, Serializer, SurveyModel, Helpers, QuestionFactory, CustomWidgetCollection, defaultCss, settings as settings$1, MatrixDropdownColumn, ItemValue, JsonError, property, Base, Action, ComputedUpdater, ActionContainer, propertyArray, AdaptiveActionContainer, AnimationBoolean, CssClassBuilder, DragOrClickHelper, ElementFactory, ComponentCollection, JsonObject, ListModel, EventBase, createDropdownActionModel, surveyCss, defaultThemeName, ConditionsParser, SurveyTrigger, QuestionMatrixDropdownModelBase, QuestionPanelDynamicModel, ConditionRunner, ExpressionRunner, FunctionFactory, QuestionButtonGroupModel, QuestionTextBase, DragDropCore, PageModel, DragTypeOverMeEnum, getIconNameFromProxy, prepareElementForVerticalAnimation, cleanHtmlElementAfterAnimation, LocalizableString, QuestionCommentModel, createPopupModelWithListModel, defaultActionBarCss, createDropdownActionModelAdvanced, PopupModel, getActionDropdownButtonTarget, AnimationGroup, activateLazyRenderingChecks, CharacterCounter, QuestionImagePickerModel, QuestionMultipleTextModel, QuestionMatrixDropdownModel, QuestionMatrixDynamicModel, QuestionMatrixModel, QuestionSelectBase, MultipleTextItemModel, addIconsToThemeSet, SvgRegistry, hasLicense, slk, Notifier, SvgThemeSets, IsTouch, SurveyElement, Question, PanelModel, DragDropChoices, chooseFiles, classesToSelector, PanelModelBase, QuestionHtmlModel, QuestionNonValue, QuestionTextModel, QuestionFileModel, QuestionRatingModel, renamedIcons, JsonObjectProperty, checkLibraryVersion } from 'survey-core';
+import { surveyLocalization, Serializer, SurveyModel, Helpers, QuestionFactory, CustomWidgetCollection, defaultCss, settings as settings$1, MatrixDropdownColumn, ItemValue, JsonError, property, Base, Action, ComputedUpdater, ActionContainer, propertyArray, AdaptiveActionContainer, AnimationBoolean, CssClassBuilder, DragOrClickHelper, ElementFactory, ComponentCollection, JsonObject, ListModel, EventBase, createDropdownActionModel, surveyCss, defaultThemeName, ConditionsParser, SurveyTrigger, QuestionMatrixDropdownModelBase, QuestionPanelDynamicModel, ConditionRunner, ExpressionRunner, FunctionFactory, QuestionButtonGroupModel, QuestionTextBase, LocalizableString, PageModel, QuestionCommentModel, createPopupModelWithListModel, defaultActionBarCss, createDropdownActionModelAdvanced, PopupModel, getActionDropdownButtonTarget, prepareElementForVerticalAnimation, cleanHtmlElementAfterAnimation, DragDropCore, getIconNameFromProxy, AnimationGroup, activateLazyRenderingChecks, CharacterCounter, QuestionImagePickerModel, QuestionMultipleTextModel, QuestionMatrixDropdownModel, QuestionMatrixDynamicModel, QuestionMatrixModel, QuestionSelectBase, MultipleTextItemModel, addIconsToThemeSet, SvgRegistry, hasLicense, slk, Notifier, SvgThemeSets, IsTouch, SurveyElement, Question, PanelModel, DragDropChoices, chooseFiles, classesToSelector, PanelModelBase, QuestionHtmlModel, QuestionNonValue, QuestionTextModel, QuestionFileModel, QuestionRatingModel, renamedIcons, JsonObjectProperty, checkLibraryVersion } from 'survey-core';
 
 // Uncomment the line below if you create a custom dictionary
 // import { editorLocalization } from "survey-creator-core";
@@ -2220,6 +2220,10 @@ class EditorLocalization {
         return (locale ? this.getLocaleStrings(locale) : this.getDefaultStrings()) || this.getDefaultStrings();
     }
     getLocaleStrings(loc) {
+        if (!loc)
+            loc = this.defaultLocale;
+        if (loc === "en")
+            return defaultStrings;
         return this.locales[loc];
     }
     setupLocale(loc, strings) {
@@ -2293,6 +2297,9 @@ surveyLocalization.onGetExternalString = (name, locale) => {
 function getLocString(strName, locale = null) {
     return editorLocalization.getString(strName, locale);
 }
+function getLocaleStrings(loc) {
+    return editorLocalization.getLocaleStrings(loc);
+}
 var defaultStrings = enStrings;
 function setupLocale(localeConfig) {
     editorLocalization.setupLocale(localeConfig.localeCode, localeConfig.strings);
@@ -3584,22 +3591,6 @@ function getNextValue(prefix, values, isText) {
     }
     return isText ? "" : prefix + 1;
 }
-function propertyExists(obj, propertyName) {
-    let result = true;
-    if (!!obj && typeof obj.getType === "function") {
-        const property = Serializer.findProperty(obj.getType(), propertyName);
-        result = !!property;
-    }
-    return result;
-}
-function isPropertyVisible(obj, propertyName) {
-    let result = true;
-    if (!!obj && typeof obj.getType === "function") {
-        const property = Serializer.findProperty(obj.getType(), propertyName);
-        result = !property || property.visible;
-    }
-    return result;
-}
 function getQuestionFromObj(obj) {
     return (obj instanceof MatrixDropdownColumn) ? obj.templateQuestion : obj;
 }
@@ -3762,23 +3753,12 @@ class SurveyHelper {
         }
         return result;
     }
-    static isPropertyVisible(obj, property, options = null, showMode = null, parentObj = null, parentProperty = null) {
-        if (!property || !property.visible)
-            return false;
-        if (!!showMode && !!property.showMode && showMode !== property.showMode)
-            return false;
-        if (!!property.isVisible &&
-            !!obj.getLayoutType &&
-            !property["isVisible"](obj.getLayoutType(), null))
+    static isPropertyVisible(obj, prop, options = null, showMode = null, parentObj = null, parentProperty = null) {
+        if (!prop || !prop.visible)
             return false;
-        var canShow = !!options
-            ? (object, property) => {
-                return options.onCanShowPropertyCallback(object, property, showMode, parentObj, parentProperty);
-            }
-            : null;
-        if (!!canShow && !canShow(obj, property))
+        if (!!showMode && !!prop.showMode && showMode !== prop.showMode && prop.locationInTable !== "both")
             return false;
-        return true;
+        return !options || options.onCanShowPropertyCallback(obj, prop, showMode, parentObj, parentProperty);
     }
     static isNeedScrollIntoView(el, scrollIfElementBiggerThanContainer = false) {
         if (!el || !el.scrollIntoView)
@@ -12792,6 +12772,38 @@ class SurveyQuestionEditorDefinition {
 }
 SurveyQuestionEditorDefinition.definition = defaultProperties;
 
+const pgTabIcons = {
+    "appearance": "icon-pg-appearance-24x24",
+    "background": "icon-pg-background-24x24",
+    "columns": "icon-pg-columns-24x24",
+    "logic": "icon-pg-conditions-24x24",
+    "data": "icon-pg-data-24x24",
+    "design": "icon-pg-design-24x24",
+    "general": "icon-pg-general-24x24",
+    "header": "icon-pg-header-24x24",
+    "language": "icon-pg-language-24x24",
+    "layout": "icon-pg-design-24x24",
+    "logo": "icon-pg-logo-24x24",
+    "navigation": "icon-pg-navigation-24x24",
+    "pages": "icon-pg-pages-24x24",
+    "question": "icon-pg-questiondesign-24x24",
+    "questionSettings": "icon-pg-questiondesign-24x24",
+    "timer": "icon-pg-quiz-24x24",
+    "rows": "icon-pg-rows-24x24",
+    "specific": "icon-pg-specific-24x24",
+    "showOnCompleted": "icon-pg-thankyyoupage-24x24",
+    "themes": "icon-pg-themes-24x24",
+    "totals": "icon-pg-totals-24x24",
+    "validation": "icon-pg-validation-24x24",
+    "cells": "icon-pg-specific-24x24",
+    "items": "icon-pg-specific-24x24",
+    "mask": "icon-pg-specific-24x24",
+    "rateValues": "icon-pg-specific-24x24",
+    "choices": "icon-pg-specific-24x24",
+    "choicesByUrl": "icon-pg-webservice-24x24",
+    "undefined": "icon-pg-undefined-24x24",
+};
+
 class SurveyQuestionEditorPropertyDefinition {
     get name() {
         return !!this.property ? this.property.name : "";
@@ -13050,6 +13062,7 @@ class SurveyQuestionProperties {
         }
         var res = new SurveyQuestionEditorTabDefinition();
         res.name = tabName;
+        res.iconName = pgTabIcons[tabName] || pgTabIcons["undefined"];
         if (tabName == settings.propertyGrid.generalTabName) {
             res.index = -1;
         }
@@ -13188,7 +13201,7 @@ class SurveyQuestionProperties {
         const isColumn = this.isColumnObj;
         for (var i = 0; i < this.properties.length; i++) {
             const prop = this.properties[i];
-            if (this.isJSONPropertyVisible(prop) && !usedProperties[prop.name] && (!isFormMode || prop.showMode === "form" || isColumn && prop.availableInMatrixColumn)) {
+            if (this.isJSONPropertyVisible(prop) && !usedProperties[prop.name] && (!isFormMode || prop.locationInTable === "both" || prop.showMode === "form" || isColumn && prop.availableInMatrixColumn)) {
                 res.push(prop);
             }
         }
@@ -13573,6 +13586,15 @@ class PropertyGridTitleActionsCreator {
             options.titleActions = actions;
         }
     }
+    onValueChanged(obj, property, question) {
+        const editor = PropertyGridEditorCollection.getEditor(property);
+        if (!!editor && !!editor.createPropertyEditorSetup && !!editor.isPropertyEditorSetupEnabled) {
+            const act = question.getTitleToolbar().getActionById("property-grid-setup");
+            if (!!act) {
+                act.enabled = editor.isPropertyEditorSetupEnabled(obj, property, question, this.options);
+            }
+        }
+    }
     createClearValueAction(editor, property, question, enabled) {
         return {
             id: "property-grid-clear",
@@ -13639,6 +13661,7 @@ class PropertyGridTitleActionsCreator {
         return question.descriptionLocation != "hidden" ? "icon-description-hide" : "icon-description";
     }
 }
+Serializer.addProperty("panelbase", { name: "iconName", visible: false });
 class PropertyJSONGenerator {
     static isPropertyReadOnly(prop, options, obj, parentObj, parentProperty) {
         var res = prop.readOnly;
@@ -13737,8 +13760,8 @@ class PropertyJSONGenerator {
             this.options.onPropertyEditorCreatedCallback(this.obj, prop, q);
         }
     }
-    getVisibilityOnEvent(prop, showMode = "") {
-        return this.options.onCanShowPropertyCallback(this.obj, prop, showMode, this.parentObj, this.parentProperty);
+    getVisibilityOnEvent(prop) {
+        return this.options.onCanShowPropertyCallback(this.obj, prop, undefined, this.parentObj, this.parentProperty);
     }
     isPropertyReadOnly(prop) {
         return PropertyJSONGenerator.isPropertyReadOnly(prop, this.options, this.obj, this.parentObj, this.parentProperty);
@@ -13811,7 +13834,7 @@ class PropertyJSONGenerator {
         return json;
     }
     createPanelProps(tab, context, isChild = false) {
-        var panel = this.createPanelJSON(tab.name, tab.title, isChild);
+        var panel = this.createPanelJSON(tab.name, tab.title, tab.iconName, isChild);
         for (var i = 0; i < tab.properties.length; i++) {
             var propDef = tab.properties[i];
             var propJSON = this.createQuestionJSON(this.obj, propDef.property, propDef.title, false, context);
@@ -13843,10 +13866,11 @@ class PropertyJSONGenerator {
         json.titleLocation = "left";
         json.minWidth = "50px";
     }
-    createPanelJSON(category, title, isChild) {
+    createPanelJSON(category, title, iconName, isChild) {
         const res = {
             type: "panel",
             name: category,
+            iconName: iconName,
             title: this.getPanelTitle(category, title),
             elements: []
         };
@@ -13856,10 +13880,8 @@ class PropertyJSONGenerator {
         return res;
     }
     createQuestionJSON(obj, prop, title, isColumn = false, context) {
-        var isVisible = this.isPropertyVisible(prop, isColumn ? "list" : "");
-        if (!isVisible && isColumn)
-            return null;
-        var json = PropertyGridEditorCollection.getJSON(obj, prop, this.options, context, this.propertyGridDefinition);
+        //if(isColumn && !SurveyHelper.isPropertyVisible(this.obj, prop, undefined, isColumn ? "list" : "")) return null;
+        const json = PropertyGridEditorCollection.getJSON(obj, prop, this.options, context, this.propertyGridDefinition);
         if (!json)
             return null;
         json.name = prop.name;
@@ -13912,11 +13934,6 @@ class PropertyJSONGenerator {
         }
         return json;
     }
-    isPropertyVisible(prop, showMode) {
-        if (!prop.visible)
-            return false;
-        return !showMode || !prop.showMode || showMode == prop.showMode;
-    }
     getPanelTitle(name, title) {
         if (!!title)
             return title;
@@ -14466,6 +14483,8 @@ class PropertyGridModel {
         const cellQuestion = options.row.getQuestionByName(options.columnName);
         if (!!cellQuestion) {
             this.changeDependedProperties(cellQuestion, (name) => { return options.row.getQuestionByName(name); }, (name) => { return options.row.getValue(name); });
+            const matrix = options.question;
+            this.titleActionsCreator.onValueChanged(matrix.obj, matrix.property, matrix);
         }
         PropertyGridEditorCollection.onMatrixCellValueChanged(this.obj, options.question.property, options);
     }
@@ -14513,9 +14532,6 @@ class PropertyGridEditor {
         const surveyPropertyEditor = editor.createPropertyEditorSetup(obj, property, question, options);
         if (!surveyPropertyEditor)
             return null;
-        if (property.type !== "condition") {
-            surveyPropertyEditor.editSurvey.css = defaultCss;
-        }
         if (question.isReadOnly) {
             surveyPropertyEditor.editSurvey.mode = "display";
         }
@@ -15570,483 +15586,6 @@ __decorate([
     property({ defaultValue: "icon" })
 ], MenuButton.prototype, "contentType", void 0);
 
-function calculateIsEdge(dropTargetNode, clientY) {
-    const rect = dropTargetNode.getBoundingClientRect();
-    return clientY - rect.top <= DragDropSurveyElements.edgeHeight || rect.bottom - clientY <= DragDropSurveyElements.edgeHeight;
-}
-function calculateIsSide(dropTargetNode, clientX) {
-    const rect = dropTargetNode.getBoundingClientRect();
-    return clientX - rect.left <= DragDropSurveyElements.edgeHeight || rect.right - clientX <= DragDropSurveyElements.edgeHeight;
-}
-function calculateDragOverLocation(clientX, clientY, rect, direction = null) {
-    const tg = rect.height / rect.width;
-    const dx = clientX - rect.x;
-    const dy = clientY - rect.y;
-    if (direction == "top-bottom") {
-        if (dy >= rect.height / 2) {
-            return DragTypeOverMeEnum.Bottom;
-        }
-        else {
-            return DragTypeOverMeEnum.Top;
-        }
-    }
-    if (direction == "left-right") {
-        if (dx >= rect.width / 2) {
-            return DragTypeOverMeEnum.Right;
-        }
-        else {
-            return DragTypeOverMeEnum.Left;
-        }
-    }
-    if (dy >= tg * dx) {
-        if (dy >= -tg * dx + rect.height) {
-            return DragTypeOverMeEnum.Bottom;
-        }
-        else {
-            return DragTypeOverMeEnum.Left;
-        }
-    }
-    else {
-        if (dy >= -tg * dx + rect.height) {
-            return DragTypeOverMeEnum.Right;
-        }
-        else {
-            return DragTypeOverMeEnum.Top;
-        }
-    }
-}
-function isPanelDynamic(element) {
-    return element instanceof QuestionPanelDynamicModel;
-}
-class DragDropSurveyElements extends DragDropCore {
-    constructor() {
-        super(...arguments);
-        this.insideContainer = null;
-        this.prevIsEdge = null;
-        // protected ghostSurveyElement: IElement = null;
-        this.dragOverIndicatorElement = null;
-        this.isDraggedElementSelected = false;
-        this.doBanDropHere = () => {
-            this.removeDragOverMarker(this.dragOverIndicatorElement);
-            this.removeDragOverMarker(this.dropTarget);
-        };
-        this.doDrop = () => {
-            var _a;
-            if (!this.dropTarget)
-                return;
-            const page = this.parentElement;
-            const dragged = this.draggedElement;
-            const src = this.draggedElement;
-            if (dragged.isPage && dragged instanceof PageModel) {
-                const survey = dragged.survey;
-                const indexOfDraggedPage = survey.pages.indexOf(dragged);
-                survey.pages.splice(indexOfDraggedPage, 1);
-                const indexOfDropTarget = survey.pages.indexOf(this.dropTarget) + (this.dragOverLocation === DragTypeOverMeEnum.Top ? 0 : 1);
-                survey.pages.splice(indexOfDropTarget, 0, dragged);
-                if (indexOfDraggedPage !== indexOfDropTarget) {
-                    dragged["draggedFrom"] = indexOfDraggedPage < indexOfDropTarget ? indexOfDraggedPage : indexOfDraggedPage + 1;
-                }
-                return dragged;
-            }
-            const convertLocation = () => {
-                switch (this.dragOverLocation) {
-                    case 4: return "top";
-                    case 5: return "right";
-                    case 6: return "bottom";
-                    case 7: return "left";
-                    default: return "bottom";
-                }
-            };
-            const srcContainer = src.parent || src.page;
-            if (!!srcContainer) {
-                page.survey.startMovingQuestion();
-                srcContainer.removeElement(src);
-            }
-            let dest = ((_a = this.dragOverIndicatorElement) === null || _a === void 0 ? void 0 : _a.isPanel) ? this.dragOverIndicatorElement : this.dropTarget;
-            if (isPanelDynamic(dest) && this.insideContainer)
-                dest = dest.template;
-            if (dest.isPage && dest.elements.length > 0 && !this.insideContainer)
-                return;
-            const isTargetIsContainer = dest.isPanel || dest.isPage;
-            if (isTargetIsContainer && this.insideContainer) {
-                dest.insertElement(src);
-            }
-            else {
-                const destParent = dest.parent || dest.page;
-                if (destParent)
-                    destParent.insertElement(src, dest, convertLocation());
-            }
-            page.survey.stopMovingQuestion();
-            return dragged;
-        };
-    }
-    get draggedElementType() {
-        if (!!this.draggedElement && this.draggedElement.isPage) {
-            return "survey-page";
-        }
-        return "survey-element";
-    }
-    get maxNestedPanels() { return this.onGetMaxNestedPanels ? this.onGetMaxNestedPanels() : -1; }
-    // private isRight: boolean;
-    // protected prevIsRight: boolean;
-    startDragToolboxItem(event, draggedElementJson, toolboxItemModel) {
-        const draggedElement = this.createElementFromJson(draggedElementJson);
-        draggedElement.toolboxItemTitle = toolboxItemModel.title;
-        draggedElement.toolboxItemIconName = toolboxItemModel.iconName;
-        this.startDrag(event, draggedElement);
-    }
-    startDragSurveyElement(event, draggedElement, isElementSelected) {
-        this.isDraggedElementSelected = isElementSelected;
-        this.startDrag(event, draggedElement);
-    }
-    getShortcutText(draggedElement) {
-        return draggedElement.toolboxItemTitle || super.getShortcutText(draggedElement);
-    }
-    createDraggedElementShortcut(text, draggedElementNode, event) {
-        const draggedElementShortcut = document.createElement("div");
-        draggedElementShortcut.style.display = "flex";
-        const textSpan = document.createElement("span");
-        textSpan.className = "svc-dragged-element-shortcut__text";
-        textSpan.innerText = text;
-        if (this.draggedElement.toolboxItemIconName) {
-            draggedElementShortcut.appendChild(this.createDraggedElementIcon());
-        }
-        draggedElementShortcut.appendChild(textSpan);
-        draggedElementShortcut.className = this.getDraggedElementClass();
-        return draggedElementShortcut;
-    }
-    createDraggedElementIcon() {
-        const span = document.createElement("span");
-        span.className = "svc-dragged-element-shortcut__icon";
-        const iconName = getIconNameFromProxy(this.draggedElement.toolboxItemIconName);
-        const svgString = `<svg class="sv-svg-icon" role="img"><use xlink:href="#${iconName}"></use></svg>`;
-        span.innerHTML = svgString;
-        return span;
-    }
-    getDraggedElementClass() {
-        let result = "svc-dragged-element-shortcut";
-        if (!!this.draggedElement.toolboxItemIconName)
-            result += " svc-dragged-element-shortcut--has-icon";
-        if (this.isDraggedElementSelected)
-            result += " svc-dragged-element-shortcut--selected";
-        return result;
-    }
-    createElementFromJson(json) {
-        const element = this.createNewElement(json);
-        if (element["setSurveyImpl"]) {
-            element["setSurveyImpl"](this.survey);
-        }
-        else {
-            element["setData"](this.survey);
-        }
-        element.renderWidth = "100%";
-        return element;
-    }
-    createNewElement(json) {
-        var newElement = Serializer.createClass(json["type"]);
-        new JsonObject().toObject(json, newElement);
-        return newElement;
-    }
-    findDropTargetNodeByDragOverNode(dragOverNode) {
-        const ghostRow = dragOverNode.closest(".svc-row--ghost");
-        if (!!ghostRow) {
-            const ghostDataAttrSelector = "[data-sv-drop-target-survey-element='sv-drag-drop-ghost-survey-element-name']";
-            const ghostNode = dragOverNode.closest(ghostDataAttrSelector) || dragOverNode.querySelector(ghostDataAttrSelector);
-            if (!!ghostNode) {
-                return ghostNode;
-            }
-        }
-        const dropTargetNode = dragOverNode.closest(this.dropTargetDataAttributeName);
-        return dropTargetNode;
-    }
-    getDropTargetByDataAttributeValue(dataAttributeValue, dropTargetNode, event) {
-        const oldDragOverIndicatorElement = this.dragOverIndicatorElement;
-        if (!dataAttributeValue) {
-            // panel dynamic
-            const nearestDropTargetElement = dropTargetNode.parentElement.closest(this.dropTargetDataAttributeName);
-            dataAttributeValue = this.getDataAttributeValueByNode(nearestDropTargetElement);
-        }
-        if (!dataAttributeValue) {
-            throw new Error("Can't find drop target survey element name");
-        }
-        if (dataAttributeValue === DragDropSurveyElements.ghostSurveyElementName) {
-            return this.prevDropTarget;
-        }
-        // drop to new page
-        if (dataAttributeValue === "newGhostPage") {
-            return DragDropSurveyElements.newGhostPage;
-        }
-        // drop to page
-        let page = this.survey.getPageByName(dataAttributeValue);
-        if (page) {
-            return page;
-        }
-        // drop to question or panel
-        let dropTarget;
-        let dragOverElement;
-        this.survey.pages.forEach((page) => {
-            const question = page.getElementByName(dataAttributeValue);
-            if (question) {
-                dropTarget = question;
-                dragOverElement = question;
-            }
-        });
-        // drop to matrix detail panel
-        if ((dropTarget.getType() === "matrixdropdown" || dropTarget.getType() === "matrixdynamic") && dropTarget.detailPanelMode !== "none" && this.insideContainer) {
-            dropTarget = dropTarget.detailPanel;
-        }
-        // drop to question
-        //question inside paneldymanic
-        if (!dropTarget.page) {
-            const nearestDropTargetPageElement = dropTargetNode.parentElement.closest("[data-sv-drop-target-page]");
-            dataAttributeValue = nearestDropTargetPageElement.dataset.svDropTargetPage;
-            let page = this.survey.getPageByName(dataAttributeValue);
-            dropTarget.__page = page;
-        }
-        this.dragOverIndicatorElement = dragOverElement;
-        if (this.dragOverIndicatorElement != oldDragOverIndicatorElement) {
-            this.removeDragOverMarker(oldDragOverIndicatorElement);
-        }
-        return dropTarget;
-        // EO drop to question or panel
-    }
-    isDropTargetValid(dropTarget, dropTargetNode, dragOverLocation = DragTypeOverMeEnum.Top) {
-        if (!dropTarget)
-            return false;
-        if (dropTarget === this.draggedElement)
-            return false;
-        if (this.draggedElement.getType() === "paneldynamic" && dropTarget === this.draggedElement.template) {
-            return false;
-        }
-        if (this.maxNestedPanels >= 0 && this.draggedElement.isPanel) {
-            const pnl = this.draggedElement;
-            if (pnl.deepNested === undefined) {
-                pnl.deepNested = this.getMaximumNestedPanelCount(pnl, 0);
-            }
-            let len = SurveyHelper.getElementDeepLength(dropTarget);
-            if (dragOverLocation !== DragTypeOverMeEnum.InsideEmptyPanel && dropTarget.isPanel)
-                len--;
-            if (this.maxNestedPanels < len + pnl.deepNested)
-                return false;
-        }
-        if (DragDropSurveyElements.restrictDragQuestionBetweenPages &&
-            this.shouldRestricDragQuestionBetweenPages(dropTarget)) {
-            return false;
-        }
-        return true;
-    }
-    getMaximumNestedPanelCount(panel, deep) {
-        let max = deep;
-        panel.elements.forEach(el => {
-            if (el.isPanel) {
-                const pDeep = this.getMaximumNestedPanelCount(el, deep + 1);
-                if (pDeep > max) {
-                    max = pDeep;
-                }
-            }
-        });
-        return max;
-    }
-    shouldRestricDragQuestionBetweenPages(dropTarget) {
-        const oldPage = this.draggedElement["page"];
-        const newPage = dropTarget.isPage ? dropTarget : dropTarget["page"];
-        // if oldPage === null then it is drop from the toolbox
-        return oldPage && oldPage !== newPage;
-    }
-    findDeepestDropTargetChild(parent) {
-        const selector = this.dropTargetDataAttributeName;
-        let result = parent;
-        while (!!parent) {
-            result = parent;
-            parent = parent.querySelector(selector);
-        }
-        return result;
-    }
-    isAllowDragOver(dropTarget, dragOverLocation) {
-        if (!this.survey || this.survey.onDragDropAllow.isEmpty)
-            return true;
-        const allowOptions = {
-            allow: true,
-            parent: this.parentElement,
-            source: this.draggedElement,
-            toElement: dropTarget,
-            draggedElement: this.draggedElement,
-            fromElement: this.draggedElement.parent,
-            target: dropTarget,
-            insertAfter: undefined,
-            insertBefore: undefined,
-            allowDropNextToAnother: true
-        };
-        if (dragOverLocation === DragTypeOverMeEnum.Bottom || dragOverLocation === DragTypeOverMeEnum.Right) {
-            allowOptions.insertAfter = dropTarget;
-        }
-        if (dragOverLocation === DragTypeOverMeEnum.Top || dragOverLocation === DragTypeOverMeEnum.Left) {
-            allowOptions.insertBefore = dropTarget;
-        }
-        this.survey.onDragDropAllow.fire(this.survey, allowOptions);
-        if (!allowOptions.allowDropNextToAnother) {
-            if (dragOverLocation === DragTypeOverMeEnum.Left) {
-                this.dragOverLocation = DragTypeOverMeEnum.Top;
-            }
-            if (dragOverLocation === DragTypeOverMeEnum.Right) {
-                this.dragOverLocation = DragTypeOverMeEnum.Bottom;
-            }
-        }
-        return allowOptions.allow;
-    }
-    dragOverCore(dropTarget, dragOverLocation) {
-        const oldDragOverIndicatorElement = this.dragOverIndicatorElement;
-        const oldDropTarget = this.dropTarget;
-        if (this.isSameElement(dropTarget)) {
-            this.allowDropHere = false;
-            return;
-        }
-        this.dropTarget = dropTarget;
-        this.dragOverLocation = dragOverLocation;
-        this.parentElement = this.dropTarget.isPage
-            ? this.dropTarget
-            : (this.dropTarget.page || this.dropTarget.__page);
-        if (!this.isAllowDragOver(dropTarget, dragOverLocation)) {
-            this.allowDropHere = false;
-            return;
-        }
-        if (dragOverLocation == DragTypeOverMeEnum.InsideEmptyPanel) {
-            this.dragOverIndicatorElement = this.dropTarget;
-            this.dragOverIndicatorElement.dragTypeOverMe = DragTypeOverMeEnum.InsideEmptyPanel;
-        }
-        else {
-            const row = this.parentElement.dragDropFindRow(this.dropTarget);
-            if (!!row && row.elements.length > 1 && (this.dragOverLocation === DragTypeOverMeEnum.Top || this.dragOverLocation === DragTypeOverMeEnum.Bottom)) {
-                row.dragTypeOverMe = this.dragOverLocation;
-                this.dragOverIndicatorElement = row;
-            }
-            else {
-                this.dropTarget.dragTypeOverMe = this.dragOverLocation;
-                this.dragOverIndicatorElement = this.dropTarget;
-            }
-        }
-        if (this.dragOverIndicatorElement != oldDragOverIndicatorElement)
-            this.removeDragOverMarker(oldDragOverIndicatorElement);
-        if (this.dropTarget != oldDropTarget)
-            this.removeDragOverMarker(oldDropTarget);
-    }
-    isSameElement(target) {
-        while (!!target) {
-            if (target === this.draggedElement)
-                return true;
-            target = target.parent;
-        }
-        return false;
-    }
-    isDragInsideItself(dragOverNodes) {
-        let result = false;
-        dragOverNodes.forEach((node) => {
-            if (node.classList.contains("svc-question__content--dragged")) {
-                result = true;
-            }
-        });
-        return result;
-    }
-    dragOver(event) {
-        const dropTargetNode = this.findDropTargetNodeFromPoint(event.clientX, event.clientY);
-        if (!dropTargetNode) {
-            this.banDropHere();
-            return;
-        }
-        if (document && document.elementsFromPoint && this.isDragInsideItself(document.elementsFromPoint(event.clientX, event.clientY))) {
-            this.banDropHere();
-            return null;
-        }
-        const oldInsideContainer = this.insideContainer;
-        this.insideContainer = !calculateIsEdge(dropTargetNode, event.clientY) && !calculateIsSide(dropTargetNode, event.clientX);
-        const dropTarget = this.getDropTargetByNode(dropTargetNode, event);
-        if (!!oldInsideContainer != !!this.insideContainer)
-            dropTarget.dragTypeOverMe = null;
-        const dropTargetRect = dropTargetNode.getBoundingClientRect();
-        const calcDirection = !settings.dragDrop.allowDragToTheSameLine || (!!this.draggedElement && this.draggedElement.isPage) ? "top-bottom" : null;
-        let dragOverLocation = calculateDragOverLocation(event.clientX, event.clientY, dropTargetRect, calcDirection);
-        if (!this.draggedElement.isPage && dropTarget && ((dropTarget.isPanel || dropTarget.isPage) && dropTarget.elements.length === 0 || isPanelDynamic(dropTarget) && dropTarget.template.elements.length == 0)) {
-            if (dropTarget.isPage || this.insideContainer) {
-                dragOverLocation = DragTypeOverMeEnum.InsideEmptyPanel;
-            }
-        }
-        const options = {
-            survey: this.survey,
-            draggedSurveyElement: this.draggedElement,
-            dragOverSurveyElement: dropTarget,
-            clientX: event.clientX,
-            clientY: event.clientY,
-            dragOverRect: dropTargetRect,
-            insideContainer: this.insideContainer,
-            dragOverLocation
-        };
-        if (this.onDragOverLocationCalculating) {
-            this.onDragOverLocationCalculating(options);
-            dragOverLocation = options.dragOverLocation;
-            this.insideContainer = options.insideContainer;
-        }
-        const isDropTargetValid = this.isDropTargetValid(dropTarget, dropTargetNode, dragOverLocation);
-        if (!isDropTargetValid) {
-            this.banDropHere();
-            return;
-        }
-        this.allowDropHere = true;
-        this.dragOverCore(dropTarget, dragOverLocation);
-    }
-    onStartDrag() {
-        // this.ghostSurveyElement = this.createGhostSurveyElement();
-        this.draggedElement.isDragMe = true;
-    }
-    moveElementInPanel(panel, src, target, targetIndex) {
-        var srcIndex = src.parent.elements.indexOf(src);
-        if (targetIndex > srcIndex) {
-            targetIndex--;
-        }
-        if (src === target && srcIndex === targetIndex) {
-            return;
-        }
-        panel.removeElement(src);
-        panel.addElement(target, targetIndex);
-    }
-    removeDragOverMarker(dropTarget) {
-        if (!!dropTarget) {
-            dropTarget.dragTypeOverMe = null;
-        }
-    }
-    clear() {
-        this.insideContainer = null;
-        this.removeDragOverMarker(this.prevDropTarget);
-        this.removeDragOverMarker(this.dropTarget);
-        this.removeDragOverMarker(this.dragOverIndicatorElement);
-        if (!!this.draggedElement) {
-            this.draggedElement.isDragMe = false;
-        }
-        super.clear();
-    }
-    getTargetParent(dropTarget) {
-        let targetParent = dropTarget.isPage || dropTarget.isPanel ? dropTarget : dropTarget.parent;
-        if (dropTarget.getType() === "paneldynamic") {
-            targetParent = dropTarget.templateValue;
-        }
-        return targetParent;
-    }
-    getTargetRow(dropTarget) {
-        const targetParent = this.getTargetParent(dropTarget);
-        let targetRow;
-        targetParent.rows.forEach((row) => {
-            if (row.elements.indexOf(dropTarget) !== -1) {
-                targetRow = row;
-            }
-        });
-        return targetRow;
-    }
-}
-DragDropSurveyElements.newGhostPage = null;
-DragDropSurveyElements.restrictDragQuestionBetweenPages = false;
-DragDropSurveyElements.edgeHeight = 30;
-DragDropSurveyElements.nestedPanelDepth = -1;
-DragDropSurveyElements.ghostSurveyElementName = "sv-drag-drop-ghost-survey-element-name"; // before renaming use globa search (we have also css selectors)
-
 class SurveyElementActionContainer extends AdaptiveActionContainer {
     needToShrink(item, shrinkTypeConverterAction) {
         return (item.innerItem.location == "start" && shrinkTypeConverterAction || item.innerItem.location != "start");
@@ -16104,498 +15643,26 @@ class SurveyElementActionContainer extends AdaptiveActionContainer {
             this.setModeForActions(true);
             return;
         }
-        this.visibleActions.forEach((item) => {
-            if (item.id == "convertTo") {
-                item.mode = "small";
-                return;
-            }
-            if (item.id == "convertInputType") {
-                item.mode = "removed";
-                return;
-            }
-            item.mode = "popup";
-        });
-        this.dotsItem.visible = true;
-        this.hiddenItemsListModel.setItems(items.filter(i => i.mode == "popup").map(i => i.innerItem));
-    }
-}
-class SurveyElementAdornerBase extends Base {
-    get dragInsideCollapsedContainer() {
-        return this.collapsed && this.creator.dragDropSurveyElements.insideContainer;
-    }
-    getAnimatedElement() {
-        return null;
-    }
-    getInnerAnimatedElements() {
-        return [];
-    }
-    getCollapsingCssClassName() {
-        return "svc-question--leave";
-    }
-    getExpandingCssClassName() {
-        return "svc-question--enter";
-    }
-    get hoverDelay() {
-        return this.creator.pageHoverDelay;
-    }
-    hover(e, element) {
-        const processedFlagName = "__svc_question_processed";
-        if (!e[processedFlagName] && e.type === "mouseover") {
-            if (!this.hoverTimeout) {
-                this.hoverTimeout = setTimeout(() => {
-                    this.isHovered = true;
-                    this.hoverTimeout = undefined;
-                }, this.hoverDelay);
-            }
-            e[processedFlagName] = true;
-        }
-        else {
-            clearTimeout(this.hoverTimeout);
-            this.hoverTimeout = undefined;
-            this.isHovered = false;
-        }
-    }
-    getExpandCollapseAnimationOptions() {
-        const beforeRunAnimation = (el, animatingClassName) => {
-            prepareElementForVerticalAnimation(el);
-            const innerAnimatedElements = this.getInnerAnimatedElements();
-            innerAnimatedElements.forEach((elem) => {
-                prepareElementForVerticalAnimation(elem);
-            });
-            innerAnimatedElements.forEach((elem) => {
-                elem.classList.add(animatingClassName);
+        if (this.visibleActions.length > 1) {
+            this.visibleActions.forEach((item) => {
+                if (item.id == "convertTo") {
+                    item.mode = "small";
+                    return;
+                }
+                if (item.id == "convertInputType") {
+                    item.mode = "removed";
+                    return;
+                }
+                item.mode = "popup";
             });
-        };
-        const afterRunAnimation = (el, animatingClassName) => {
-            this.expandCollapseAnimationRunning = false;
-            if (this.surveyElement) {
-                cleanHtmlElementAfterAnimation(el);
-                const innerAnimatedElements = this.getInnerAnimatedElements();
-                innerAnimatedElements.forEach((elem) => {
-                    cleanHtmlElementAfterAnimation(elem);
-                });
-                innerAnimatedElements.forEach((elem) => {
-                    elem.classList.remove(animatingClassName);
-                });
-            }
-        };
-        return {
-            getRerenderEvent: () => this.onElementRerendered,
-            getEnterOptions: () => {
-                const className = this.getExpandingCssClassName();
-                return {
-                    cssClass: className,
-                    onBeforeRunAnimation: (el) => {
-                        beforeRunAnimation(el, className);
-                    },
-                    onAfterRunAnimation: (el) => {
-                        afterRunAnimation(el, className);
-                    },
-                };
-            },
-            getLeaveOptions: () => {
-                const className = this.getCollapsingCssClassName();
-                return {
-                    cssClass: className,
-                    onBeforeRunAnimation: (el) => {
-                        beforeRunAnimation(el, className);
-                    },
-                    onAfterRunAnimation: (el) => {
-                        afterRunAnimation(el, className);
-                    },
-                };
-            },
-            getAnimatedElement: () => this.getAnimatedElement(),
-            isAnimationEnabled: () => this.animationAllowed
-        };
-    }
-    set renderedCollapsed(val) {
-        if (this.animationAllowed && val !== this.renderedCollapsed)
-            this.expandCollapseAnimationRunning = true;
-        this.animationCollapsed.sync(!val);
-    }
-    get renderedCollapsed() {
-        return !!this._renderedCollapsed;
-    }
-    createTopActionContainer() {
-        const actionContainer = new ActionContainer();
-        actionContainer.sizeMode = "small";
-        if (this.creator.expandCollapseButtonVisibility != "never") {
-            actionContainer.setItems([this.expandCollapseAction]);
-            actionContainer.cssClasses = {
-                root: "svc-survey-element-top-toolbar sv-action-bar",
-                item: "svc-survey-element-top-toolbar__item",
-                itemIcon: "svc-survey-element-toolbar-item__icon",
-                itemTitle: "svc-survey-element-toolbar-item__title",
-                itemTitleWithIcon: "svc-survey-element-toolbar-item__title--with-icon",
-            };
-        }
-        return actionContainer;
-    }
-    createActionContainer() {
-        const actionContainer = new SurveyElementActionContainer();
-        actionContainer.dotsItem.popupModel.horizontalPosition = "center";
-        return actionContainer;
-    }
-    get canExpandOnDrag() {
-        return this.surveyElement.isPanel || this.surveyElement.isPage || isPanelDynamic(this.surveyElement);
-    }
-    dragIn() {
-        if (!this.draggedIn) {
-            if (this.canExpandOnDrag && this.collapsed) {
-                this.draggedIn = true;
-                this.dragCollapsedTimer = setTimeout(() => {
-                    this.expandWithDragIn();
-                }, this.creator.expandOnDragTimeOut);
-            }
-        }
-    }
-    expandWithDragIn() {
-        this.collapsed = false;
-        this.dragCollapsedTimer = undefined;
-    }
-    dragOut() {
-        if (this.draggedIn) {
-            clearTimeout(this.dragCollapsedTimer);
-            this.draggedIn = false;
-        }
-    }
-    allowExpandCollapseByDblClick(element) {
-        return true;
-    }
-    dblclick(event) {
-        if (this.allowExpandCollapseByDblClick(event.target)) {
-            if (this.allowExpandCollapse)
-                this.collapsed = !this.collapsed;
-        }
-        event.stopPropagation();
-    }
-    get element() {
-        return this.surveyElement;
-    }
-    constructor(creator, surveyElement) {
-        super();
-        this.creator = creator;
-        this.animationCollapsed = new AnimationBoolean(this.getExpandCollapseAnimationOptions(), (val) => {
-            this._renderedCollapsed = !val;
-        }, () => !this.renderedCollapsed);
-        this.draggedIn = false;
-        this.sidebarFlyoutModeChangedFunc = (_, options) => {
-            if (options.name === "flyoutMode") {
-                this.updateActionsProperties();
-            }
-        };
-        this.creatorOnLocaleChanged = (_, options) => {
-            if (this.surveyElement) {
-                this.updateActionsContainer(this.surveyElement);
-                this.updateActionsProperties();
-            }
-        };
-        this.actionVisibilityCache = {};
-        this.expandCollapseAction = this.getExpandCollapseAction();
-        this.attachToUI(surveyElement);
-    }
-    get isActionContainerCreated() {
-        return !!this.actionContainerValue;
-    }
-    get actionContainer() {
-        if (!this.actionContainerValue) {
-            this.actionContainerValue = this.createActionContainer();
-            if (this.surveyElement) {
-                this.updateActionsContainer(this.surveyElement);
-                this.updateActionsVisibility(false);
-            }
-        }
-        return this.actionContainerValue;
-    }
-    get topActionContainer() {
-        if (!this.topActionContainerValue) {
-            this.topActionContainerValue = this.createTopActionContainer();
-            if (this.surveyElement) {
-                this.updateActionsVisibility(true);
-            }
-        }
-        return this.topActionContainerValue;
-    }
-    static GetAdorner(surveyElement) {
-        return surveyElement.getPropertyValue(SurveyElementAdornerBase.AdornerValueName);
-    }
-    static RestoreStateFor(surveyElement) {
-        const adorner = SurveyElementAdornerBase.GetAdorner(surveyElement);
-        if (!!adorner) {
-            adorner.restoreState();
-        }
-    }
-    restoreState() {
-        var _a;
-        if (!!this.surveyElement) {
-            const state = (_a = this.creator.designerStateManager) === null || _a === void 0 ? void 0 : _a.getElementState(this.surveyElement);
-            this.collapsed = state.collapsed;
-        }
-        if (!this.surveyElement || this.surveyElement.isInteractiveDesignElement) {
-            this.needToRenderContent = !this.collapsed;
-        }
-    }
-    detachElement(surveyElement) {
-        if (surveyElement) {
-            surveyElement.setPropertyValue(SurveyElementAdornerBase.AdornerValueName, null);
-            surveyElement.unRegisterFunctionOnPropertyValueChanged("isSelectedInDesigner", "questionSelected");
-            this.cleanActionsContainer();
-        }
-    }
-    attachElement(surveyElement) {
-        var _a, _b;
-        if (surveyElement) {
-            (_b = (_a = this.creator) === null || _a === void 0 ? void 0 : _a.designerStateManager) === null || _b === void 0 ? void 0 : _b.initForElement(surveyElement);
-            surveyElement.registerFunctionOnPropertyValueChanged("isSelectedInDesigner", (newValue) => {
-                this.onElementSelectedChanged(newValue);
-            }, "questionSelected");
-            this.restoreState();
-            this.updateActionsContainer(surveyElement);
-            this.updateActionsProperties();
-            surveyElement.setPropertyValue(SurveyElementAdornerBase.AdornerValueName, this);
-        }
-    }
-    setSurveyElement(surveyElement) {
-        this.detachOnlyMyElement();
-        this.surveyElement = surveyElement;
-        this.attachElement(this.surveyElement);
-    }
-    checkActionProperties() {
-        if (this.creator.isElementSelected(this.surveyElement)) {
-            this.updateActionsProperties();
-        }
-    }
-    attachToUI(surveyElement, rootElement) {
-        if (!!rootElement) {
-            this.rootElement = rootElement;
-        }
-        if (this.surveyElement != surveyElement) {
-            this.setSurveyElement(surveyElement);
-            this.creator.onLocaleChanded.add(this.creatorOnLocaleChanged);
-            this.creator.sidebar.onPropertyChanged.add(this.sidebarFlyoutModeChangedFunc);
-            this.creator.expandCollapseManager.add(this);
-        }
-    }
-    detachOnlyMyElement() {
-        if (this.surveyElement && this.surveyElement.getPropertyValue(SurveyElementAdornerBase.AdornerValueName) === this && !this.surveyElement.isDisposed) {
-            this.detachElement(this.surveyElement);
-        }
-    }
-    detachFromUI() {
-        this.rootElement = undefined;
-        this.detachOnlyMyElement();
-        this.surveyElement = undefined;
-        this.creator.onLocaleChanded.remove(this.creatorOnLocaleChanged);
-        this.creator.sidebar.onPropertyChanged.remove(this.sidebarFlyoutModeChangedFunc);
-        this.creator.expandCollapseManager.remove(this);
-    }
-    dispose() {
-        this.detachFromUI();
-        this.disposeActions(this.actionContainerValue);
-        this.disposeActions(this.topActionContainerValue);
-        super.dispose();
-        this.sidebarFlyoutModeChangedFunc = undefined;
-        this.animationCollapsed = undefined;
-    }
-    disposeActions(container) {
-        if (!!container && !container.isDisposed) {
-            container.dispose();
-        }
-    }
-    onElementSelectedChanged(isSelected) {
-        if (!isSelected)
-            return;
-        this.updateActionsProperties();
-    }
-    getExpandCollapseAction() {
-        const collapseIcon = "icon-collapsepanel-16x16";
-        const expandIcon = "icon-expandpanel-16x16";
-        return {
-            id: "collapse",
-            css: "sv-action-bar-item--collapse",
-            locTooltipName: new ComputedUpdater(() => this.collapsed ? "ed.expandTooltip" : "ed.collapseTooltip"),
-            iconName: new ComputedUpdater(() => this.collapsed ? expandIcon : collapseIcon),
-            iconSize: "auto",
-            action: () => {
-                this.collapsed = !this.collapsed;
-            }
-        };
-    }
-    cleanActionsContainer() {
-        const container = this.actionContainerValue;
-        if (!container)
-            return;
-        const actions = container.actions;
-        container.setItems([]);
-        actions.forEach(action => action.dispose && action.dispose());
-    }
-    updateActionsContainer(surveyElement) {
-        if (!this.actionContainerValue)
-            return;
-        const actions = [];
-        this.buildActions(actions);
-        this.creator.onElementMenuItemsChanged(surveyElement, actions);
-        this.actionContainerValue.setItems(actions);
-    }
-    updateActionsProperties() {
-        if (this.isDisposed)
-            return;
-        this.updateActionsPropertiesCore();
-    }
-    updateActionsPropertiesCore() {
-        this.updateElementAllowOptions(this.creator.getElementAllowOperations(this.surveyElement), this.isOperationsAllow());
-    }
-    getAllowDragging(options) {
-        return options.allowDragging;
-    }
-    getAllowExpandCollapse(options) {
-        return this.creator.expandCollapseButtonVisibility != "never" && (options.allowExpandCollapse == undefined || !!options.allowExpandCollapse);
-    }
-    updateElementAllowOptions(options, operationsAllow) {
-        this.allowDragging = operationsAllow && this.getAllowDragging(options);
-        this.allowExpandCollapse = this.getAllowExpandCollapse(options);
-        this.allowEditOption = (options.allowEdit == undefined || !!options.allowEdit);
-        this.updateActionVisibility("delete", operationsAllow && options.allowDelete);
-        this.updateActionVisibility("duplicate", operationsAllow && options.allowCopy);
-        this.updateActionVisibility("collapse", this.allowExpandCollapse);
-        if (options.allowShowSettings === undefined) {
-            const settingsVisibility = (options.allowEdit !== undefined) ? (operationsAllow && options.allowEdit) : this.creator.sidebar.flyoutMode;
-            this.updateActionVisibility("settings", settingsVisibility);
-        }
-        else {
-            this.updateActionVisibility("settings", options.allowShowSettings);
-        }
-        this.setShowAddQuestionButton(options.allowEdit !== false);
-    }
-    isOperationsAllow() {
-        return !this.creator.readOnly;
-    }
-    updateActionVisibility(id, isVisible) {
-        var _a, _b;
-        var action = ((_a = this.actionContainerValue) === null || _a === void 0 ? void 0 : _a.getActionById(id)) || ((_b = this.topActionContainerValue) === null || _b === void 0 ? void 0 : _b.getActionById(id));
-        if (!action) {
-            this.actionVisibilityCache[id] = isVisible;
+            this.dotsItem.visible = true;
         }
         else {
-            if (action.visible !== isVisible) {
-                action.visible = isVisible;
-            }
+            this.visibleActions.forEach(i => i.mode = "small");
         }
-    }
-    updateActionsVisibility(isTop) {
-        for (var key in this.actionVisibilityCache) {
-            this.updateActionVisibility(key, this.actionVisibilityCache[key]);
-        }
-    }
-    getActionById(id) {
-        return this.actionContainer.getActionById(id) || this.topActionContainer.getActionById(id);
-    }
-    buildActions(items) {
-        items.push(new Action({
-            id: "duplicate",
-            iconName: "icon-duplicate_16x16",
-            css: "svc-action-bar-item--right",
-            title: this.creator.getLocString("survey.duplicate"),
-            visibleIndex: 10,
-            iconSize: "auto",
-            action: () => this.duplicate(),
-            onFocus: (isMouse, event) => this.disableActionFocusing(isMouse, event)
-        }));
-        items.push(new Action({
-            id: "settings",
-            iconName: "icon-settings_16x16",
-            css: "svc-action-bar-item--right",
-            title: this.creator.getLocString("ed.settings"),
-            locTooltipName: "ed.settingsTooltip",
-            visibleIndex: 20,
-            iconSize: "auto",
-            action: () => {
-                this.creator.setShowSidebar(true, true);
-                if (!this.creator.isMobileView) {
-                    this.creator.sidebar.executeOnExpand(() => {
-                        this.creator.propertyGrid.getAllQuestions()[0].focus();
-                    });
-                }
-            }
-        }));
-        items.push(new Action({
-            id: "delete",
-            iconName: "icon-delete_16x16",
-            css: "svc-action-bar-item--right",
-            //needSeparator: items.length > 0,
-            title: this.creator.getLocString("pe.delete"),
-            visibleIndex: 30,
-            iconSize: "auto",
-            action: () => {
-                this.delete();
-            },
-            onFocus: (isMouse, event) => this.disableActionFocusing(isMouse, event)
-        }));
-    }
-    disableActionFocusing(isMouse, event) {
-        this.isDisableSelecting = isMouse;
-    }
-    canSelectElement() {
-        const res = !this.isDisableSelecting;
-        this.isDisableSelecting = false;
-        return res;
-    }
-    get allowEdit() {
-        return !!this.creator && !this.creator.readOnly && this.allowEditOption;
-    }
-    get showAddQuestionButton() {
-        return this.getPropertyValue("showAddQuestionButton");
-    }
-    setShowAddQuestionButton(val) {
-        this.setPropertyValue("showAddQuestionButton", val && this.allowEdit && !!this.creator && this.creator.showAddQuestionButton);
-    }
-    duplicate() { }
-    delete() {
-        this.creator.deleteElement(this.surveyElement);
-    }
-    getCss() {
-        return new CssClassBuilder().append("svc-hovered svc-hovered-ready", this.isHovered).toString();
+        this.hiddenItemsListModel.setItems(items.filter(i => i.mode == "popup").map(i => i.innerItem));
     }
 }
-SurveyElementAdornerBase.AdornerValueName = "__sjs_creator_adorner";
-__decorate([
-    property({ defaultValue: true })
-], SurveyElementAdornerBase.prototype, "allowDragging", void 0);
-__decorate([
-    property({ defaultValue: false })
-], SurveyElementAdornerBase.prototype, "expandCollapseAnimationRunning", void 0);
-__decorate([
-    property({ defaultValue: true })
-], SurveyElementAdornerBase.prototype, "needToRenderContent", void 0);
-__decorate([
-    property({ defaultValue: true })
-], SurveyElementAdornerBase.prototype, "allowExpandCollapse", void 0);
-__decorate([
-    property({
-        onSet: (val, target) => {
-            target.renderedCollapsed = val;
-            if (!val)
-                target.needToRenderContent = true;
-            if (target.creator.designerStateManager && !target.creator.designerStateManager.isSuspended && target.surveyElement) {
-                target.creator.designerStateManager.getElementState(target.surveyElement).collapsed = val;
-            }
-            setTimeout(() => {
-                target.creator.survey.pages.forEach(p => p.ensureRowsVisibility());
-                target.creator.survey.getAllPanels().forEach(p => p.ensureRowsVisibility());
-            }, 50);
-        }
-    })
-], SurveyElementAdornerBase.prototype, "collapsed", void 0);
-__decorate([
-    property()
-], SurveyElementAdornerBase.prototype, "_renderedCollapsed", void 0);
-__decorate([
-    property()
-], SurveyElementAdornerBase.prototype, "isAnimationRunningCollapsed", void 0);
-__decorate([
-    property({ defaultValue: false })
-], SurveyElementAdornerBase.prototype, "isHovered", void 0);
 
 let isLocaleEnableIfExecuting;
 function localeEnableIf(params) {
@@ -16990,8 +16057,7 @@ class TranslationGroup extends TranslationItemBase {
             return;
         var properties = this.getLocalizedProperties(this.obj);
         for (var i = 0; i < properties.length; i++) {
-            var property = properties[i];
-            var item = this.createTranslationItem(this.obj, properties[i]);
+            const item = this.createTranslationItem(this.obj, properties[i]);
             if (!!item) {
                 this.itemValues.push(item);
             }
@@ -17090,10 +16156,10 @@ class TranslationGroup extends TranslationItemBase {
     }
     createTranslationItem(obj, property) {
         var _a;
-        const defaultValue = this.getDefaultValue(obj, property);
         const locStr = obj[property.serializationProperty];
         if (!locStr)
             return null;
+        const defaultValue = this.getDefaultValue(obj, property);
         if (!this.showAllStrings && !defaultValue && locStr.isEmpty)
             return null;
         const editLocale = (_a = this.translation) === null || _a === void 0 ? void 0 : _a.getEditLocale();
@@ -17108,9 +16174,7 @@ class TranslationGroup extends TranslationItemBase {
             property.isLocalizable &&
             !!property.serializationProperty) {
             var locStr = obj[property.serializationProperty];
-            if (!!locStr &&
-                !obj.isPage && !obj.isPanel &&
-                (!!locStr.onGetTextCallback || locStr["onRenderedHtmlCallback"]))
+            if (!!locStr && !obj.isPage && !obj.isPanel && !!locStr.onGetTextCallback)
                 return obj["name"];
         }
         return "";
@@ -21426,7 +20490,7 @@ class TabLogicPlugin {
 
 class UndoRedoController extends Base {
     onSurveyPropertyValueChangedCallback(name, oldValue, newValue, sender, arrayChanges) {
-        if (!this.undoRedoManager || !this.undoRedoManager.isCorrectProperty(sender, name)) {
+        if (this.ignoreChanges || !this.undoRedoManager || !this.undoRedoManager.isCorrectProperty(sender, name)) {
             return;
         }
         const canUndoRedoMerge = this.undoRedoManager.tryMergeTransaction(sender, name, newValue);
@@ -22049,7 +21113,9 @@ class PropertyGridViewModel extends Base {
         let titleName = this.getTitle();
         this.selectedElementName = titleName;
         this.objectSelectionAction.tooltip = titleName;
-        this.objectSelectionAction.title = this.propertyGridModel.showOneCategoryInPropertyGrid ? "" : titleName;
+        if (!this.propertyGridModel.showOneCategoryInPropertyGrid) {
+            this.objectSelectionAction.title = titleName;
+        }
     }
     getTitle() {
         var obj = this.getSelectedObj();
@@ -22108,114 +21174,1180 @@ class PropertyGridViewModel extends Base {
                 this.objectSelectionAction.pressed = true;
             }
         });
-        this.objectSelectionAction = new MenuButton({
-            id: "svd-grid-object-selector",
-            title: this.selectedElementName,
-            css: "sv-action--object-selector",
-            component: "sv-action-bar-item-dropdown",
-            disableHide: true,
-            pressed: false,
-            action: () => {
-                selectorModel.show(this.selectionController.creator.survey, this.propertyGridModel.obj, (obj) => {
-                    this.selectionController.selectFromAction(obj, "name");
-                    this.selectorPopupModel.hide();
-                });
-                this.selectorPopupModel.show();
-                selectorModel.list.scrollToSelectedItem();
-            },
-            popupModel: this.selectorPopupModel
-        });
-        this.objectSelectionAction.contentType = "text-description-vertical";
+        this.objectSelectionAction = new MenuButton({
+            id: "svd-grid-object-selector",
+            title: this.selectedElementName,
+            css: "sv-action--object-selector",
+            component: "sv-action-bar-item-dropdown",
+            disableHide: true,
+            pressed: false,
+            action: () => {
+                selectorModel.show(this.selectionController.creator.survey, this.propertyGridModel.obj, (obj) => {
+                    this.selectionController.selectFromAction(obj, "name");
+                    this.selectorPopupModel.hide();
+                });
+                this.selectorPopupModel.show();
+                selectorModel.list.scrollToSelectedItem();
+            },
+            popupModel: this.selectorPopupModel
+        });
+        this.objectSelectionAction.contentType = "text-description-vertical";
+    }
+    dispose() {
+        this.searchManager.dispose();
+        this.nextSelectionAction.dispose();
+        this.prevSelectionAction.dispose();
+        this.objectSelectionAction.dispose();
+        this.selectorPopupModel.dispose();
+        super.dispose();
+    }
+}
+__decorate([
+    property()
+], PropertyGridViewModel.prototype, "hasPrev", void 0);
+__decorate([
+    property()
+], PropertyGridViewModel.prototype, "hasNext", void 0);
+__decorate([
+    property()
+], PropertyGridViewModel.prototype, "selectedElementName", void 0);
+__decorate([
+    property({
+        onSet: (newValue, target) => {
+            target.searchManager.isVisible = newValue;
+        }
+    })
+], PropertyGridViewModel.prototype, "searchEnabled", void 0);
+__decorate([
+    property()
+], PropertyGridViewModel.prototype, "showPlaceholder", void 0);
+
+class PagesController extends Base {
+    constructor(creator) {
+        super();
+        this.creator = creator;
+        this.onPagesChanged = this.addEvent();
+        this.onCurrentPageChanged = this.addEvent();
+        this.currentPageChangedFunc = (sender, options) => {
+            this.page2Display = this.survey.currentPage;
+            this.onCurrentPageChanged.fire(this, {});
+        };
+        this.onSurveyChanged();
+    }
+    get survey() {
+        return this.creator.survey;
+    }
+    get pages() {
+        return this.survey.pages;
+    }
+    get currentPage() {
+        return this.survey.currentPage;
+    }
+    set currentPage(value) {
+        this.survey.currentPage = value;
+        this.page2Display = value;
+    }
+    selectPage(value) {
+        this.currentPage = value;
+        this.creator.selectElement(value);
+    }
+    getDisplayName(page) {
+        if (!page)
+            return "";
+        return this.creator.getObjectDisplayName(page, "page-selector");
+    }
+    raisePagesChanged() {
+        this.page2Display = this.survey.currentPage;
+        this.onPagesChanged.fire(this, {});
+    }
+    onSurveyChanged() {
+        this.removeFunctions();
+        this.surveyValue = this.creator.survey;
+        if (!this.surveyValue)
+            return;
+        this.raisePagesChanged();
+        this.page2Display = this.survey.currentPage;
+        this.surveyValue.onCurrentPageChanged.add(this.currentPageChangedFunc);
+    }
+    dispose() {
+        super.dispose();
+        this.removeFunctions();
+    }
+    removeFunctions() {
+        if (!!this.surveyValue && !this.surveyValue.isDisposed) {
+            this.surveyValue.onCurrentPageChanged.remove(this.currentPageChangedFunc);
+        }
+    }
+}
+__decorate([
+    property()
+], PagesController.prototype, "page2Display", void 0);
+
+class SurveyElementAdornerBase extends Base {
+    getAnimatedElement() {
+        return null;
+    }
+    getInnerAnimatedElements() {
+        return [];
+    }
+    getCollapsingCssClassName() {
+        return "svc-question--leave";
+    }
+    getExpandingCssClassName() {
+        return "svc-question--enter";
+    }
+    get hoverDelay() {
+        return this.creator.pageHoverDelay;
+    }
+    hover(e, element) {
+        const processedFlagName = "__svc_question_processed";
+        if (!e[processedFlagName] && e.type === "mouseover") {
+            if (!this.hoverTimeout) {
+                this.hoverTimeout = setTimeout(() => {
+                    this.isHovered = true;
+                    this.hoverTimeout = undefined;
+                }, this.hoverDelay);
+            }
+            e[processedFlagName] = true;
+        }
+        else {
+            clearTimeout(this.hoverTimeout);
+            this.hoverTimeout = undefined;
+            this.isHovered = false;
+        }
+    }
+    getExpandCollapseAnimationOptions() {
+        const beforeRunAnimation = (el, animatingClassName) => {
+            prepareElementForVerticalAnimation(el);
+            const innerAnimatedElements = this.getInnerAnimatedElements();
+            innerAnimatedElements.forEach((elem) => {
+                prepareElementForVerticalAnimation(elem);
+            });
+            innerAnimatedElements.forEach((elem) => {
+                elem.classList.add(animatingClassName);
+            });
+        };
+        const afterRunAnimation = (el, animatingClassName) => {
+            this.expandCollapseAnimationRunning = false;
+            if (this.surveyElement) {
+                cleanHtmlElementAfterAnimation(el);
+                const innerAnimatedElements = this.getInnerAnimatedElements();
+                innerAnimatedElements.forEach((elem) => {
+                    cleanHtmlElementAfterAnimation(elem);
+                });
+                innerAnimatedElements.forEach((elem) => {
+                    elem.classList.remove(animatingClassName);
+                });
+            }
+        };
+        return {
+            getRerenderEvent: () => this.onElementRerendered,
+            getEnterOptions: () => {
+                const className = this.getExpandingCssClassName();
+                return {
+                    cssClass: className,
+                    onBeforeRunAnimation: (el) => {
+                        beforeRunAnimation(el, className);
+                    },
+                    onAfterRunAnimation: (el) => {
+                        afterRunAnimation(el, className);
+                    },
+                };
+            },
+            getLeaveOptions: () => {
+                const className = this.getCollapsingCssClassName();
+                return {
+                    cssClass: className,
+                    onBeforeRunAnimation: (el) => {
+                        beforeRunAnimation(el, className);
+                    },
+                    onAfterRunAnimation: (el) => {
+                        afterRunAnimation(el, className);
+                    },
+                };
+            },
+            getAnimatedElement: () => this.getAnimatedElement(),
+            isAnimationEnabled: () => this.animationAllowed
+        };
+    }
+    set renderedCollapsed(val) {
+        if (this.animationAllowed && val !== this.renderedCollapsed)
+            this.expandCollapseAnimationRunning = true;
+        this.animationCollapsed.sync(!val);
+    }
+    get renderedCollapsed() {
+        return !!this._renderedCollapsed;
+    }
+    createTopActionContainer() {
+        const actionContainer = new ActionContainer();
+        actionContainer.sizeMode = "small";
+        if (this.creator.expandCollapseButtonVisibility != "never") {
+            actionContainer.setItems([this.expandCollapseAction]);
+            actionContainer.cssClasses = {
+                root: "svc-survey-element-top-toolbar sv-action-bar",
+                item: "svc-survey-element-top-toolbar__item",
+                itemIcon: "svc-survey-element-toolbar-item__icon",
+                itemTitle: "svc-survey-element-toolbar-item__title",
+                itemTitleWithIcon: "svc-survey-element-toolbar-item__title--with-icon",
+            };
+        }
+        return actionContainer;
+    }
+    createActionContainer() {
+        const actionContainer = new SurveyElementActionContainer();
+        actionContainer.dotsItem.popupModel.horizontalPosition = "center";
+        return actionContainer;
+    }
+    get canExpandOnDrag() {
+        return this.surveyElement.isPanel || this.surveyElement.isPage || this.surveyElement instanceof QuestionPanelDynamicModel;
+    }
+    dragIn() {
+        if (!this.draggedIn) {
+            if (this.canExpandOnDrag && this.collapsed) {
+                this.draggedIn = true;
+                this.dragCollapsedTimer = setTimeout(() => {
+                    this.expandWithDragIn();
+                }, this.creator.expandOnDragTimeOut);
+            }
+        }
+    }
+    expandWithDragIn() {
+        this.collapsed = false;
+        this.dragCollapsedTimer = undefined;
+    }
+    dragOut() {
+        if (this.draggedIn) {
+            clearTimeout(this.dragCollapsedTimer);
+            this.draggedIn = false;
+        }
+    }
+    allowExpandCollapseByDblClick(element) {
+        return true;
+    }
+    dblclick(event) {
+        if (this.allowExpandCollapseByDblClick(event.target)) {
+            if (this.allowExpandCollapse)
+                this.collapsed = !this.collapsed;
+        }
+        event.stopPropagation();
+    }
+    get element() {
+        return this.surveyElement;
+    }
+    constructor(creator, surveyElement) {
+        super();
+        this.creator = creator;
+        this.animationCollapsed = new AnimationBoolean(this.getExpandCollapseAnimationOptions(), (val) => {
+            this._renderedCollapsed = !val;
+        }, () => !this.renderedCollapsed);
+        this.draggedIn = false;
+        this.sidebarFlyoutModeChangedFunc = (_, options) => {
+            if (options.name === "flyoutMode") {
+                this.updateActionsProperties();
+            }
+        };
+        this.creatorOnLocaleChanged = (_, options) => {
+            if (this.surveyElement) {
+                this.updateActionsContainer(this.surveyElement);
+                this.updateActionsProperties();
+            }
+        };
+        this.actionVisibilityCache = {};
+        this.expandCollapseAction = this.getExpandCollapseAction();
+        this.attachToUI(surveyElement);
+    }
+    get isActionContainerCreated() {
+        return !!this.actionContainerValue;
+    }
+    get actionContainer() {
+        if (!this.actionContainerValue) {
+            this.actionContainerValue = this.createActionContainer();
+            if (this.surveyElement) {
+                this.updateActionsContainer(this.surveyElement);
+                this.updateActionsVisibility(false);
+            }
+        }
+        return this.actionContainerValue;
+    }
+    get topActionContainer() {
+        if (!this.topActionContainerValue) {
+            this.topActionContainerValue = this.createTopActionContainer();
+            if (this.surveyElement) {
+                this.updateActionsVisibility(true);
+            }
+        }
+        return this.topActionContainerValue;
+    }
+    static GetAdorner(surveyElement) {
+        return surveyElement.getPropertyValue(SurveyElementAdornerBase.AdornerValueName);
+    }
+    static RestoreStateFor(surveyElement) {
+        const adorner = SurveyElementAdornerBase.GetAdorner(surveyElement);
+        if (!!adorner) {
+            adorner.restoreState();
+        }
+    }
+    restoreState() {
+        var _a;
+        if (!!this.surveyElement) {
+            this.collapsed = (_a = this.creator.designerStateManager) === null || _a === void 0 ? void 0 : _a.getElementCollapsed(this.surveyElement);
+        }
+        if (!this.surveyElement || this.surveyElement.isInteractiveDesignElement) {
+            this.needToRenderContent = !this.collapsed;
+        }
+    }
+    detachElement(surveyElement) {
+        if (surveyElement) {
+            surveyElement.setPropertyValue(SurveyElementAdornerBase.AdornerValueName, null);
+            surveyElement.unRegisterFunctionOnPropertyValueChanged("isSelectedInDesigner", "questionSelected");
+            this.cleanActionsContainer();
+        }
+    }
+    attachElement(surveyElement) {
+        var _a, _b;
+        if (surveyElement) {
+            (_b = (_a = this.creator) === null || _a === void 0 ? void 0 : _a.designerStateManager) === null || _b === void 0 ? void 0 : _b.initForElement(surveyElement);
+            surveyElement.registerFunctionOnPropertyValueChanged("isSelectedInDesigner", (newValue) => {
+                this.onElementSelectedChanged(newValue);
+            }, "questionSelected");
+            this.restoreState();
+            this.updateActionsContainer(surveyElement);
+            this.updateActionsProperties();
+            surveyElement.setPropertyValue(SurveyElementAdornerBase.AdornerValueName, this);
+        }
+    }
+    setSurveyElement(surveyElement) {
+        this.detachOnlyMyElement();
+        this.surveyElement = surveyElement;
+        this.attachElement(this.surveyElement);
+    }
+    checkActionProperties() {
+        if (this.creator.isElementSelected(this.surveyElement)) {
+            this.updateActionsProperties();
+        }
+    }
+    attachToUI(surveyElement, rootElement) {
+        if (!!rootElement) {
+            this.rootElement = rootElement;
+        }
+        if (this.surveyElement != surveyElement) {
+            this.setSurveyElement(surveyElement);
+            this.creator.onLocaleChanded.add(this.creatorOnLocaleChanged);
+            this.creator.sidebar.onPropertyChanged.add(this.sidebarFlyoutModeChangedFunc);
+        }
+    }
+    detachOnlyMyElement() {
+        if (this.surveyElement && this.surveyElement.getPropertyValue(SurveyElementAdornerBase.AdornerValueName) === this && !this.surveyElement.isDisposed) {
+            this.detachElement(this.surveyElement);
+        }
+    }
+    detachFromUI() {
+        this.rootElement = undefined;
+        this.detachOnlyMyElement();
+        this.surveyElement = undefined;
+        this.creator.onLocaleChanded.remove(this.creatorOnLocaleChanged);
+        this.creator.sidebar.onPropertyChanged.remove(this.sidebarFlyoutModeChangedFunc);
+    }
+    dispose() {
+        this.detachFromUI();
+        this.disposeActions(this.actionContainerValue);
+        this.disposeActions(this.topActionContainerValue);
+        super.dispose();
+        this.sidebarFlyoutModeChangedFunc = undefined;
+        this.animationCollapsed = undefined;
+    }
+    disposeActions(container) {
+        if (!!container && !container.isDisposed) {
+            container.dispose();
+        }
+    }
+    onElementSelectedChanged(isSelected) {
+        if (!isSelected)
+            return;
+        this.updateActionsProperties();
+    }
+    getExpandCollapseAction() {
+        const collapseIcon = "icon-collapsepanel-16x16";
+        const expandIcon = "icon-expandpanel-16x16";
+        return {
+            id: "collapse",
+            css: "sv-action-bar-item--collapse",
+            locTooltipName: new ComputedUpdater(() => this.collapsed ? "ed.expandTooltip" : "ed.collapseTooltip"),
+            iconName: new ComputedUpdater(() => this.collapsed ? expandIcon : collapseIcon),
+            iconSize: "auto",
+            action: () => {
+                this.collapsed = !this.collapsed;
+            }
+        };
+    }
+    cleanActionsContainer() {
+        const container = this.actionContainerValue;
+        if (!container)
+            return;
+        const actions = container.actions;
+        container.setItems([]);
+        actions.forEach(action => action.dispose && action.dispose());
+    }
+    updateActionsContainer(surveyElement) {
+        if (!this.actionContainerValue)
+            return;
+        const actions = [];
+        this.buildActions(actions);
+        this.creator.onElementMenuItemsChanged(surveyElement, actions);
+        this.actionContainerValue.setItems(actions);
+    }
+    updateActionsProperties() {
+        if (this.isDisposed)
+            return;
+        this.updateActionsPropertiesCore();
+    }
+    updateActionsPropertiesCore() {
+        this.updateElementAllowOptions(this.creator.getElementAllowOperations(this.surveyElement), this.isOperationsAllow());
+    }
+    getAllowDragging(options) {
+        return options.allowDragging;
+    }
+    getAllowExpandCollapse(options) {
+        return this.creator.expandCollapseButtonVisibility != "never" && (options.allowExpandCollapse == undefined || !!options.allowExpandCollapse);
+    }
+    updateElementAllowOptions(options, operationsAllow) {
+        this.allowDragging = operationsAllow && this.getAllowDragging(options);
+        this.allowExpandCollapse = this.getAllowExpandCollapse(options);
+        this.allowEditOption = (options.allowEdit == undefined || !!options.allowEdit);
+        this.updateActionVisibility("delete", operationsAllow && options.allowDelete);
+        this.updateActionVisibility("duplicate", operationsAllow && options.allowCopy);
+        this.updateActionVisibility("collapse", this.allowExpandCollapse);
+        if (options.allowShowSettings === undefined) {
+            const settingsVisibility = (options.allowEdit !== undefined) ? (operationsAllow && options.allowEdit) : this.creator.sidebar.flyoutMode;
+            this.updateActionVisibility("settings", settingsVisibility);
+        }
+        else {
+            this.updateActionVisibility("settings", options.allowShowSettings);
+        }
+        this.setShowAddQuestionButton(options.allowEdit !== false);
+    }
+    isOperationsAllow() {
+        return !this.creator.readOnly;
+    }
+    updateActionVisibility(id, isVisible) {
+        var _a, _b;
+        var action = ((_a = this.actionContainerValue) === null || _a === void 0 ? void 0 : _a.getActionById(id)) || ((_b = this.topActionContainerValue) === null || _b === void 0 ? void 0 : _b.getActionById(id));
+        if (!action) {
+            this.actionVisibilityCache[id] = isVisible;
+        }
+        else {
+            if (action.visible !== isVisible) {
+                action.visible = isVisible;
+            }
+        }
+    }
+    updateActionsVisibility(isTop) {
+        for (var key in this.actionVisibilityCache) {
+            this.updateActionVisibility(key, this.actionVisibilityCache[key]);
+        }
+    }
+    getActionById(id) {
+        return this.actionContainer.getActionById(id) || this.topActionContainer.getActionById(id);
+    }
+    buildActions(items) {
+        items.push(new Action({
+            id: "duplicate",
+            iconName: "icon-duplicate_16x16",
+            css: "svc-action-bar-item--right",
+            title: this.creator.getLocString("survey.duplicate"),
+            visibleIndex: 10,
+            iconSize: "auto",
+            action: () => this.duplicate(),
+            onFocus: (isMouse, event) => this.disableActionFocusing(isMouse, event)
+        }));
+        items.push(new Action({
+            id: "settings",
+            iconName: "icon-settings_16x16",
+            css: "svc-action-bar-item--right",
+            title: this.creator.getLocString("ed.settings"),
+            locTooltipName: "ed.settingsTooltip",
+            visibleIndex: 20,
+            iconSize: "auto",
+            action: () => {
+                this.creator.setShowSidebar(true, true);
+                if (!this.creator.isMobileView) {
+                    this.creator.sidebar.executeOnExpand(() => {
+                        this.creator.propertyGrid.getAllQuestions()[0].focus();
+                    });
+                }
+            }
+        }));
+        items.push(new Action({
+            id: "delete",
+            iconName: "icon-delete_16x16",
+            css: "svc-action-bar-item--right",
+            //needSeparator: items.length > 0,
+            title: this.creator.getLocString("pe.delete"),
+            visibleIndex: 30,
+            iconSize: "auto",
+            action: () => {
+                this.delete();
+            },
+            onFocus: (isMouse, event) => this.disableActionFocusing(isMouse, event)
+        }));
+    }
+    disableActionFocusing(isMouse, event) {
+        this.isDisableSelecting = isMouse;
+    }
+    canSelectElement() {
+        const res = !this.isDisableSelecting;
+        this.isDisableSelecting = false;
+        return res;
+    }
+    get allowEdit() {
+        return !!this.creator && !this.creator.readOnly && this.allowEditOption;
+    }
+    get showAddQuestionButton() {
+        return this.getPropertyValue("showAddQuestionButton");
+    }
+    setShowAddQuestionButton(val) {
+        this.setPropertyValue("showAddQuestionButton", val && this.allowEdit && !!this.creator && this.creator.showAddQuestionButton);
+    }
+    duplicate() { }
+    delete() {
+        this.creator.deleteElement(this.surveyElement);
+    }
+    getCss() {
+        return new CssClassBuilder().append("svc-hovered svc-hovered-ready", this.isHovered).toString();
+    }
+}
+SurveyElementAdornerBase.AdornerValueName = "__sjs_creator_adorner";
+__decorate([
+    property({ defaultValue: true })
+], SurveyElementAdornerBase.prototype, "allowDragging", void 0);
+__decorate([
+    property({ defaultValue: false })
+], SurveyElementAdornerBase.prototype, "expandCollapseAnimationRunning", void 0);
+__decorate([
+    property({ defaultValue: null })
+], SurveyElementAdornerBase.prototype, "dropIndicatorPosition", void 0);
+__decorate([
+    property({ defaultValue: false })
+], SurveyElementAdornerBase.prototype, "isBeingDragged", void 0);
+__decorate([
+    property({ defaultValue: true })
+], SurveyElementAdornerBase.prototype, "needToRenderContent", void 0);
+__decorate([
+    property({ defaultValue: true })
+], SurveyElementAdornerBase.prototype, "allowExpandCollapse", void 0);
+__decorate([
+    property({
+        onSet: (val, target) => {
+            target.renderedCollapsed = val;
+            if (!val)
+                target.needToRenderContent = true;
+            if (target.creator.designerStateManager && target.surveyElement) {
+                target.creator.designerStateManager.setElementCollapsed(target.surveyElement, val);
+            }
+            setTimeout(() => {
+                target.creator.survey.pages.forEach(p => p.ensureRowsVisibility());
+                target.creator.survey.getAllPanels().forEach(p => p.ensureRowsVisibility());
+            }, 50);
+        }
+    })
+], SurveyElementAdornerBase.prototype, "collapsed", void 0);
+__decorate([
+    property()
+], SurveyElementAdornerBase.prototype, "_renderedCollapsed", void 0);
+__decorate([
+    property()
+], SurveyElementAdornerBase.prototype, "isAnimationRunningCollapsed", void 0);
+__decorate([
+    property({ defaultValue: false })
+], SurveyElementAdornerBase.prototype, "isHovered", void 0);
+
+var DropIndicatorPosition;
+(function (DropIndicatorPosition) {
+    DropIndicatorPosition["Inside"] = "inside";
+    DropIndicatorPosition["Top"] = "top";
+    DropIndicatorPosition["Bottom"] = "bottom";
+    DropIndicatorPosition["Right"] = "right";
+    DropIndicatorPosition["Left"] = "left";
+})(DropIndicatorPosition || (DropIndicatorPosition = {}));
+var ElType;
+(function (ElType) {
+    ElType["Page"] = "page";
+    ElType["Panel"] = "panel";
+    ElType["Question"] = "question";
+    ElType["DynamicPanel"] = "dynamic-panel";
+    ElType["EmptySurvey"] = "empty-survey";
+})(ElType || (ElType = {}));
+
+function calculateIsEdge(dropTargetNode, clientY) {
+    const rect = dropTargetNode.getBoundingClientRect();
+    return clientY - rect.top <= DragDropSurveyElements.edgeHeight || rect.bottom - clientY <= DragDropSurveyElements.edgeHeight;
+}
+function calculateIsSide(dropTargetNode, clientX) {
+    const rect = dropTargetNode.getBoundingClientRect();
+    return clientX - rect.left <= DragDropSurveyElements.edgeHeight || rect.right - clientX <= DragDropSurveyElements.edgeHeight;
+}
+function calculateDragOverLocation(clientX, clientY, rect, direction = null) {
+    const tg = rect.height / rect.width;
+    const dx = clientX - rect.x;
+    const dy = clientY - rect.y;
+    if (direction == "top-bottom") {
+        if (dy >= rect.height / 2) {
+            return DropIndicatorPosition.Bottom;
+        }
+        else {
+            return DropIndicatorPosition.Top;
+        }
+    }
+    if (direction == "left-right") {
+        if (dx >= rect.width / 2) {
+            return DropIndicatorPosition.Right;
+        }
+        else {
+            return DropIndicatorPosition.Left;
+        }
+    }
+    if (dy >= tg * dx) {
+        if (dy >= -tg * dx + rect.height) {
+            return DropIndicatorPosition.Bottom;
+        }
+        else {
+            return DropIndicatorPosition.Left;
+        }
+    }
+    else {
+        if (dy >= -tg * dx + rect.height) {
+            return DropIndicatorPosition.Right;
+        }
+        else {
+            return DropIndicatorPosition.Top;
+        }
+    }
+}
+class DragDropSurveyElements extends DragDropCore {
+    constructor() {
+        super(...arguments);
+        this.insideElement = null;
+        this.prevIsEdge = null;
+        // protected ghostSurveyElement: IElement = null;
+        this.dragOverIndicatorElement = null;
+        this.isDraggedElementSelected = false;
+        this.doBanDropHere = () => {
+            this.removeDragOverMarker(this.dragOverIndicatorElement);
+            this.removeDragOverMarker(this.dropTarget);
+        };
+        this.doDrop = () => {
+            var _a;
+            if (!this.dropTarget)
+                return;
+            if (!this.dragOverLocation)
+                return;
+            const page = this.parentElement;
+            const dragged = this.draggedElement;
+            const src = this.draggedElement;
+            if (dragged.isPage && dragged instanceof PageModel) {
+                const survey = dragged.survey;
+                survey.startMovingPage();
+                const indexOfDraggedPage = survey.pages.indexOf(dragged);
+                survey.pages.splice(indexOfDraggedPage, 1);
+                const indexOfDropTarget = survey.pages.indexOf(this.dropTarget) + (this.dragOverLocation === DropIndicatorPosition.Top ? 0 : 1);
+                survey.pages.splice(indexOfDropTarget, 0, dragged);
+                survey.stopMovingPage();
+                if (indexOfDraggedPage !== indexOfDropTarget) {
+                    dragged["draggedFrom"] = indexOfDraggedPage < indexOfDropTarget ? indexOfDraggedPage : indexOfDraggedPage + 1;
+                }
+                return dragged;
+            }
+            const convertLocation = () => {
+                switch (this.dragOverLocation) {
+                    case "top": return "top";
+                    case "bottom": return "bottom";
+                    case "right": return "right";
+                    case "left": return "left";
+                    default: return "bottom";
+                }
+            };
+            const srcContainer = src.parent || src.page;
+            if (!!srcContainer) {
+                page.survey.startMovingQuestion();
+                srcContainer.removeElement(src);
+            }
+            let dest = ((_a = this.dragOverIndicatorElement) === null || _a === void 0 ? void 0 : _a.isPanel) ? this.dragOverIndicatorElement : this.dropTarget;
+            if (this.dragOverLocation === DropIndicatorPosition.Inside) {
+                if (this.isPanelDynamic(dest))
+                    dest = dest.template;
+                dest.insertElement(src);
+            }
+            else {
+                const destParent = dest.parent || dest.page;
+                if (destParent)
+                    destParent.insertElement(src, dest, convertLocation());
+            }
+            page.survey.stopMovingQuestion();
+            return dragged;
+        };
+    }
+    get draggedElementAdorner() {
+        if (!this.draggedElement)
+            return null;
+        return SurveyElementAdornerBase.GetAdorner(this.draggedElement);
+    }
+    get dropTargetAdorner() {
+        if (!this.dropTarget)
+            return null;
+        return SurveyElementAdornerBase.GetAdorner(this.dropTarget);
+    }
+    get draggedElementType() {
+        if (!!this.draggedElement && this.draggedElement.isPage) {
+            return "survey-page";
+        }
+        return "survey-element";
+    }
+    get maxNestedPanels() { return this.onGetMaxNestedPanels ? this.onGetMaxNestedPanels() : -1; }
+    // private isRight: boolean;
+    // protected prevIsRight: boolean;
+    startDragToolboxItem(event, draggedElementJson, toolboxItemModel) {
+        const draggedElement = this.createElementFromJson(draggedElementJson);
+        draggedElement.toolboxItemTitle = toolboxItemModel.title;
+        draggedElement.toolboxItemIconName = toolboxItemModel.iconName;
+        this.startDrag(event, draggedElement);
+    }
+    startDragSurveyElement(event, draggedElement, isElementSelected) {
+        this.isDraggedElementSelected = isElementSelected;
+        this.startDrag(event, draggedElement);
+    }
+    getShortcutText(draggedElement) {
+        if (draggedElement.isPage)
+            return draggedElement.name;
+        return draggedElement.toolboxItemTitle || super.getShortcutText(draggedElement);
+    }
+    createDraggedElementShortcut(text, draggedElementNode, event) {
+        const draggedElementShortcut = document.createElement("div");
+        draggedElementShortcut.style.display = "flex";
+        const textSpan = document.createElement("span");
+        textSpan.className = "svc-dragged-element-shortcut__text";
+        textSpan.innerText = text;
+        if (this.draggedElement.toolboxItemIconName) {
+            draggedElementShortcut.appendChild(this.createDraggedElementIcon());
+        }
+        draggedElementShortcut.appendChild(textSpan);
+        draggedElementShortcut.className = this.getDraggedElementClass();
+        return draggedElementShortcut;
+    }
+    createDraggedElementIcon() {
+        const span = document.createElement("span");
+        span.className = "svc-dragged-element-shortcut__icon";
+        const iconName = getIconNameFromProxy(this.draggedElement.toolboxItemIconName);
+        const svgString = `<svg class="sv-svg-icon" role="img"><use xlink:href="#${iconName}"></use></svg>`;
+        span.innerHTML = svgString;
+        return span;
+    }
+    getDraggedElementClass() {
+        let result = "svc-dragged-element-shortcut";
+        if (!!this.draggedElement.toolboxItemIconName)
+            result += " svc-dragged-element-shortcut--has-icon";
+        if (this.isDraggedElementSelected)
+            result += " svc-dragged-element-shortcut--selected";
+        return result;
+    }
+    createElementFromJson(json) {
+        const element = this.createNewElement(json);
+        if (element["setSurveyImpl"]) {
+            element["setSurveyImpl"](this.survey);
+        }
+        else {
+            element["setData"](this.survey);
+        }
+        element.renderWidth = "100%";
+        return element;
+    }
+    createNewElement(json) {
+        var newElement = Serializer.createClass(json["type"]);
+        new JsonObject().toObject(json, newElement);
+        return newElement;
+    }
+    isPanelDynamic(element) {
+        return element instanceof QuestionPanelDynamicModel;
+    }
+    findDropTargetNodeByDragOverNode(dragOverNode) {
+        const ghostRow = dragOverNode.closest(".svc-row--ghost");
+        if (!!ghostRow) {
+            const ghostDataAttrSelector = "[data-sv-drop-target-survey-element='sv-drag-drop-ghost-survey-element-name']";
+            const ghostNode = dragOverNode.closest(ghostDataAttrSelector) || dragOverNode.querySelector(ghostDataAttrSelector);
+            if (!!ghostNode) {
+                return ghostNode;
+            }
+        }
+        const dropTargetNode = dragOverNode.closest(this.dropTargetDataAttributeName);
+        return dropTargetNode;
+    }
+    getDropTargetByDataAttributeValue(dataAttributeValue, dropTargetNode, event) {
+        const oldDragOverIndicatorElement = this.dragOverIndicatorElement;
+        if (!dataAttributeValue) {
+            // panel dynamic
+            const nearestDropTargetElement = dropTargetNode.parentElement.closest(this.dropTargetDataAttributeName);
+            dataAttributeValue = this.getDataAttributeValueByNode(nearestDropTargetElement);
+        }
+        if (!dataAttributeValue) {
+            throw new Error("Can't find drop target survey element name");
+        }
+        if (dataAttributeValue === DragDropSurveyElements.ghostSurveyElementName) {
+            return this.prevDropTarget;
+        }
+        // drop to new page
+        if (dataAttributeValue === "newGhostPage") {
+            return DragDropSurveyElements.newGhostPage;
+        }
+        // drop to page
+        let page = this.survey.getPageByName(dataAttributeValue);
+        if (page) {
+            return page;
+        }
+        // drop to question or panel
+        let dropTarget;
+        let dragOverElement;
+        this.survey.pages.forEach((page) => {
+            const question = page.getElementByName(dataAttributeValue);
+            if (question) {
+                dropTarget = question;
+                dragOverElement = question;
+            }
+        });
+        // drop to matrix detail panel
+        if ((dropTarget.getType() === "matrixdropdown" || dropTarget.getType() === "matrixdynamic") && dropTarget.detailPanelMode !== "none" && this.insideElement) {
+            dropTarget = dropTarget.detailPanel;
+        }
+        // drop to question
+        //question inside paneldymanic
+        if (!dropTarget.page) {
+            const nearestDropTargetPageElement = dropTargetNode.parentElement.closest("[data-sv-drop-target-page]");
+            dataAttributeValue = nearestDropTargetPageElement.dataset.svDropTargetPage;
+            let page = this.survey.getPageByName(dataAttributeValue);
+            dropTarget.__page = page;
+        }
+        this.dragOverIndicatorElement = dragOverElement;
+        if (this.dragOverIndicatorElement != oldDragOverIndicatorElement) {
+            this.removeDragOverMarker(oldDragOverIndicatorElement);
+        }
+        return dropTarget;
+        // EO drop to question or panel
+    }
+    isDropTargetValid(dropTarget, dropTargetNode, dragOverLocation = DropIndicatorPosition.Top) {
+        if (!dropTarget)
+            return false;
+        if (dropTarget === this.draggedElement)
+            return false;
+        if (this.draggedElement.getType() === "paneldynamic" && dropTarget === this.draggedElement.template) {
+            return false;
+        }
+        if (this.maxNestedPanels >= 0 && this.draggedElement.isPanel) {
+            const pnl = this.draggedElement;
+            if (pnl.deepNested === undefined) {
+                pnl.deepNested = this.getMaximumNestedPanelCount(pnl, 0);
+            }
+            let len = SurveyHelper.getElementDeepLength(dropTarget);
+            if (dragOverLocation !== DropIndicatorPosition.Inside && dropTarget.isPanel)
+                len--;
+            if (this.maxNestedPanels < len + pnl.deepNested)
+                return false;
+        }
+        if (DragDropSurveyElements.restrictDragQuestionBetweenPages &&
+            this.shouldRestricDragQuestionBetweenPages(dropTarget)) {
+            return false;
+        }
+        return true;
+    }
+    getMaximumNestedPanelCount(panel, deep) {
+        let max = deep;
+        panel.elements.forEach(el => {
+            if (el.isPanel) {
+                const pDeep = this.getMaximumNestedPanelCount(el, deep + 1);
+                if (pDeep > max) {
+                    max = pDeep;
+                }
+            }
+        });
+        return max;
     }
-    dispose() {
-        this.searchManager.dispose();
-        this.nextSelectionAction.dispose();
-        this.prevSelectionAction.dispose();
-        this.objectSelectionAction.dispose();
-        this.selectorPopupModel.dispose();
-        super.dispose();
+    shouldRestricDragQuestionBetweenPages(dropTarget) {
+        const oldPage = this.draggedElement["page"];
+        const newPage = dropTarget.isPage ? dropTarget : dropTarget["page"];
+        // if oldPage === null then it is drop from the toolbox
+        return oldPage && oldPage !== newPage;
     }
-}
-__decorate([
-    property()
-], PropertyGridViewModel.prototype, "hasPrev", void 0);
-__decorate([
-    property()
-], PropertyGridViewModel.prototype, "hasNext", void 0);
-__decorate([
-    property()
-], PropertyGridViewModel.prototype, "selectedElementName", void 0);
-__decorate([
-    property({
-        onSet: (newValue, target) => {
-            target.searchManager.isVisible = newValue;
+    findDeepestDropTargetChild(parent) {
+        const selector = this.dropTargetDataAttributeName;
+        let result = parent;
+        while (!!parent) {
+            result = parent;
+            parent = parent.querySelector(selector);
         }
-    })
-], PropertyGridViewModel.prototype, "searchEnabled", void 0);
-__decorate([
-    property()
-], PropertyGridViewModel.prototype, "showPlaceholder", void 0);
-
-class PagesController extends Base {
-    constructor(creator) {
-        super();
-        this.creator = creator;
-        this.onPagesChanged = this.addEvent();
-        this.onCurrentPageChanged = this.addEvent();
-        this.currentPageChangedFunc = (sender, options) => {
-            this.page2Display = this.survey.currentPage;
-            this.onCurrentPageChanged.fire(this, {});
+        return result;
+    }
+    isAllowDragOver(dropTarget, dragOverLocation) {
+        if (!this.survey || this.survey.onDragDropAllow.isEmpty)
+            return true;
+        const allowOptions = {
+            allow: true,
+            parent: this.parentElement,
+            source: this.draggedElement,
+            toElement: dropTarget,
+            draggedElement: this.draggedElement,
+            fromElement: this.draggedElement.parent,
+            target: dropTarget,
+            insertAfter: undefined,
+            insertBefore: undefined,
+            allowDropNextToAnother: true
         };
-        this.onSurveyChanged();
+        if (dragOverLocation === DropIndicatorPosition.Bottom || dragOverLocation === DropIndicatorPosition.Right) {
+            allowOptions.insertAfter = dropTarget;
+        }
+        if (dragOverLocation === DropIndicatorPosition.Top || dragOverLocation === DropIndicatorPosition.Left) {
+            allowOptions.insertBefore = dropTarget;
+        }
+        this.survey.onDragDropAllow.fire(this.survey, allowOptions);
+        if (!allowOptions.allowDropNextToAnother) {
+            if (dragOverLocation === DropIndicatorPosition.Left) {
+                this.dragOverLocation = DropIndicatorPosition.Top;
+            }
+            if (dragOverLocation === DropIndicatorPosition.Right) {
+                this.dragOverLocation = DropIndicatorPosition.Bottom;
+            }
+        }
+        return allowOptions.allow;
     }
-    get survey() {
-        return this.creator.survey;
+    dragOverCore(dropTarget, dragOverLocation) {
+        const oldDragOverIndicatorElement = this.dragOverIndicatorElement;
+        const oldDropTarget = this.dropTarget;
+        if (this.isSameElement(dropTarget)) {
+            this.allowDropHere = false;
+            return;
+        }
+        this.dropTarget = dropTarget;
+        this.dragOverLocation = dragOverLocation;
+        this.parentElement = this.dropTarget.isPage
+            ? this.dropTarget
+            : (this.dropTarget.page || this.dropTarget.__page);
+        if (!this.isAllowDragOver(dropTarget, dragOverLocation)) {
+            this.allowDropHere = false;
+            return;
+        }
+        if (dragOverLocation == DropIndicatorPosition.Inside) {
+            this.dragOverIndicatorElement = this.dropTarget;
+            this.dropTargetAdorner.dropIndicatorPosition = DropIndicatorPosition.Inside;
+        }
+        else {
+            const row = this.dragDropFindRow(this.dropTarget, this.parentElement);
+            if (!!row && row.elements.length > 1 && (this.dragOverLocation === DropIndicatorPosition.Top || this.dragOverLocation === DropIndicatorPosition.Bottom)) {
+                this.dragOverIndicatorElement = row;
+                const adorner = SurveyElementAdornerBase.GetAdorner(row);
+                if (adorner) {
+                    adorner.dropIndicatorPosition = this.dragOverLocation;
+                }
+            }
+            else {
+                this.dragOverIndicatorElement = this.dropTarget;
+                if (this.draggedElement.isPage) {
+                    if (this.dragOverLocation === DropIndicatorPosition.Top || this.dragOverLocation === DropIndicatorPosition.Bottom) {
+                        this.dropTargetAdorner.dropIndicatorPosition = this.dragOverLocation;
+                    }
+                    else {
+                        this.dropTargetAdorner.dropIndicatorPosition = this.dragOverLocation;
+                    }
+                }
+                else {
+                    this.dropTargetAdorner.dropIndicatorPosition = this.dragOverLocation;
+                }
+            }
+        }
+        if (this.dragOverIndicatorElement != oldDragOverIndicatorElement)
+            this.removeDragOverMarker(oldDragOverIndicatorElement);
+        if (this.dropTarget != oldDropTarget)
+            this.removeDragOverMarker(oldDropTarget);
     }
-    get pages() {
-        return this.survey.pages;
+    dragDropFindRow(findElement, panel) {
+        if (!findElement || findElement.isPage)
+            return null;
+        var element = findElement;
+        var rows = panel.rows;
+        for (var i = 0; i < rows.length; i++) {
+            if (rows[i].elements.indexOf(element) > -1)
+                return rows[i];
+        }
+        for (var i = 0; i < panel.elements.length; i++) {
+            var pnl = panel.elements[i].getPanel();
+            if (!pnl)
+                continue;
+            var row = this.dragDropFindRow(element, pnl);
+            if (!!row)
+                return row;
+        }
+        return null;
     }
-    get currentPage() {
-        return this.survey.currentPage;
+    isSameElement(target) {
+        while (!!target) {
+            if (target === this.draggedElement)
+                return true;
+            target = target.parent;
+        }
+        return false;
     }
-    set currentPage(value) {
-        this.survey.currentPage = value;
-        this.page2Display = value;
+    isDragInsideItself(dragOverNodes) {
+        let result = false;
+        dragOverNodes.forEach((node) => {
+            if (node.classList.contains("svc-question__content--dragged")) {
+                result = true;
+            }
+        });
+        return result;
     }
-    selectPage(value) {
-        this.currentPage = value;
-        this.creator.selectElement(value);
+    getDragDropElementType(element) {
+        if (element.isPage)
+            return ElType.Page;
+        if (element.isPanel)
+            return ElType.Panel;
+        if (element instanceof QuestionPanelDynamicModel)
+            return ElType.DynamicPanel;
+        return ElType.Question;
     }
-    getDisplayName(page) {
-        if (!page)
-            return "";
-        return this.creator.getObjectDisplayName(page, "page-selector");
+    dragOver(event) {
+        const dropTargetNode = this.findDropTargetNodeFromPoint(event.clientX, event.clientY);
+        if (!dropTargetNode) {
+            this.banDropHere();
+            return;
+        }
+        if (document && document.elementsFromPoint && this.isDragInsideItself(document.elementsFromPoint(event.clientX, event.clientY))) {
+            this.banDropHere();
+            return null;
+        }
+        const oldinsideElement = this.insideElement;
+        this.insideElement = !calculateIsEdge(dropTargetNode, event.clientY) && !calculateIsSide(dropTargetNode, event.clientX);
+        const dropTarget = this.getDropTargetByNode(dropTargetNode, event);
+        const dropTargetAdorner = SurveyElementAdornerBase.GetAdorner(dropTarget);
+        if (!!oldinsideElement != !!this.insideElement) {
+            dropTargetAdorner.dropIndicatorPosition = null;
+        }
+        const dropTargetRect = dropTargetNode.getBoundingClientRect();
+        const calcDirection = !settings.dragDrop.allowDragToTheSameLine || (!!this.draggedElement && this.draggedElement.isPage) ? "top-bottom" : null;
+        let dragOverLocation = calculateDragOverLocation(event.clientX, event.clientY, dropTargetRect, calcDirection);
+        if (!this.draggedElement.isPage && dropTarget && ((dropTarget.isPanel || dropTarget.isPage) && dropTarget.elements.length === 0 || this.isPanelDynamic(dropTarget) && dropTarget.template.elements.length == 0)) {
+            if (dropTarget.isPage || this.insideElement) {
+                dragOverLocation = DropIndicatorPosition.Inside;
+            }
+        }
+        if (!this.draggedElement.isPage && dropTarget.isPage && dropTargetAdorner.collapsed) {
+            dragOverLocation = DropIndicatorPosition.Inside;
+        }
+        if ((dropTarget.isPanel || this.isPanelDynamic(dropTarget)) && this.insideElement && dropTargetAdorner.collapsed) {
+            dragOverLocation = DropIndicatorPosition.Inside;
+        }
+        if (!this.draggedElement.isPage && dropTarget.isPage && dropTarget.elements.length !== 0 && !dropTargetAdorner.collapsed) {
+            dragOverLocation = null;
+        }
+        // const dropTargetType = this.getDragDropElementType(dropTarget);
+        // const draggedElementType = this.getDragDropElementType(this.draggedElement);
+        // switch (dropTargetType) {
+        //   case ElType.Page: {
+        //     console.log("dropTargetType", dropTargetType);
+        //     break;
+        //   }
+        //   case ElType.Panel: {
+        //     console.log("dropTargetType", dropTargetType);
+        //     break;
+        //   }
+        //   case ElType.DynamicPanel: {
+        //     console.log("dropTargetType", dropTargetType);
+        //     break;
+        //   }
+        //   case ElType.Question: {
+        //     console.log("dropTargetType", dropTargetType);
+        //     break;
+        //   }
+        //   // case ElType.EmptySurvey: {
+        //   //   console.log("dropTargetType", dropTargetType);
+        //   //   break;
+        //   // }
+        // }
+        const options = {
+            survey: this.survey,
+            draggedSurveyElement: this.draggedElement,
+            dragOverSurveyElement: dropTarget,
+            clientX: event.clientX,
+            clientY: event.clientY,
+            dragOverRect: dropTargetRect,
+            insideElement: this.insideElement,
+            dragOverLocation
+        };
+        if (this.onDragOverLocationCalculating) {
+            this.onDragOverLocationCalculating(options);
+            dragOverLocation = options.dragOverLocation;
+            this.insideElement = options.insideElement;
+        }
+        const isDropTargetValid = this.isDropTargetValid(dropTarget, dropTargetNode, dragOverLocation);
+        if (!isDropTargetValid) {
+            this.banDropHere();
+            return;
+        }
+        this.allowDropHere = true;
+        this.dragOverCore(dropTarget, dragOverLocation);
     }
-    raisePagesChanged() {
-        this.page2Display = this.survey.currentPage;
-        this.onPagesChanged.fire(this, {});
+    onStartDrag() {
+        // this.ghostSurveyElement = this.createGhostSurveyElement();
+        if (this.draggedElementAdorner) {
+            this.draggedElementAdorner.isBeingDragged = true;
+        }
     }
-    onSurveyChanged() {
-        this.removeFunctions();
-        this.surveyValue = this.creator.survey;
-        if (!this.surveyValue)
+    moveElementInPanel(panel, src, target, targetIndex) {
+        var srcIndex = src.parent.elements.indexOf(src);
+        if (targetIndex > srcIndex) {
+            targetIndex--;
+        }
+        if (src === target && srcIndex === targetIndex) {
             return;
-        this.raisePagesChanged();
-        this.page2Display = this.survey.currentPage;
-        this.surveyValue.onCurrentPageChanged.add(this.currentPageChangedFunc);
+        }
+        panel.removeElement(src);
+        panel.addElement(target, targetIndex);
     }
-    dispose() {
-        super.dispose();
-        this.removeFunctions();
+    removeDragOverMarker(dropTarget) {
+        if (dropTarget) {
+            const adorner = SurveyElementAdornerBase.GetAdorner(dropTarget);
+            if (adorner) {
+                adorner.dropIndicatorPosition = null;
+            }
+        }
     }
-    removeFunctions() {
-        if (!!this.surveyValue && !this.surveyValue.isDisposed) {
-            this.surveyValue.onCurrentPageChanged.remove(this.currentPageChangedFunc);
+    clear() {
+        this.insideElement = null;
+        this.removeDragOverMarker(this.prevDropTarget);
+        this.removeDragOverMarker(this.dropTarget);
+        this.removeDragOverMarker(this.dragOverIndicatorElement);
+        if (this.draggedElement && this.draggedElementAdorner) {
+            this.draggedElementAdorner.isBeingDragged = false;
+        }
+        super.clear();
+    }
+    getTargetParent(dropTarget) {
+        let targetParent = dropTarget.isPage || dropTarget.isPanel ? dropTarget : dropTarget.parent;
+        if (dropTarget.getType() === "paneldynamic") {
+            targetParent = dropTarget.templateValue;
         }
+        return targetParent;
+    }
+    getTargetRow(dropTarget) {
+        const targetParent = this.getTargetParent(dropTarget);
+        let targetRow;
+        targetParent.rows.forEach((row) => {
+            if (row.elements.indexOf(dropTarget) !== -1) {
+                targetRow = row;
+            }
+        });
+        return targetRow;
     }
 }
-__decorate([
-    property()
-], PagesController.prototype, "page2Display", void 0);
+DragDropSurveyElements.newGhostPage = null;
+DragDropSurveyElements.restrictDragQuestionBetweenPages = false;
+DragDropSurveyElements.edgeHeight = 30;
+DragDropSurveyElements.nestedPanelDepth = -1;
+DragDropSurveyElements.ghostSurveyElementName = "sv-drag-drop-ghost-survey-element-name"; // before renaming use globa search (we have also css selectors)
 
 const designTabSurveyThemeJSON = {
     "cssVariables": {
@@ -22732,6 +22864,14 @@ class DesignerStateManager {
             stateMap[newName] = new ElementState();
         }, "designerStateManager");
     }
+    getElementCollapsed(element) {
+        return this.getElementState(element).collapsed;
+    }
+    setElementCollapsed(element, isCollapsed) {
+        if (this.isSuspended)
+            return;
+        this.getElementState(element).collapsed = isCollapsed;
+    }
     getElementState(element) {
         return this.createElementState(element, true);
     }
@@ -22761,38 +22901,6 @@ class DesignerStateManager {
     }
 }
 
-const pgTabIcons = {
-    "appearance": "icon-pg-appearance-24x24",
-    "background": "icon-pg-background-24x24",
-    "columns": "icon-pg-columns-24x24",
-    "logic": "icon-pg-conditions-24x24",
-    "data": "icon-pg-data-24x24",
-    "design": "icon-pg-design-24x24",
-    "general": "icon-pg-general-24x24",
-    "header": "icon-pg-header-24x24",
-    "language": "icon-pg-language-24x24",
-    "layout": "icon-pg-design-24x24",
-    "logo": "icon-pg-logo-24x24",
-    "navigation": "icon-pg-navigation-24x24",
-    "pages": "icon-pg-pages-24x24",
-    "question": "icon-pg-questiondesign-24x24",
-    "questionSettings": "icon-pg-questiondesign-24x24",
-    "timer": "icon-pg-quiz-24x24",
-    "rows": "icon-pg-rows-24x24",
-    "specific": "icon-pg-specific-24x24",
-    "showOnCompleted": "icon-pg-thankyyoupage-24x24",
-    "themes": "icon-pg-themes-24x24",
-    "totals": "icon-pg-totals-24x24",
-    "validation": "icon-pg-validation-24x24",
-    "cells": "icon-pg-specific-24x24",
-    "items": "icon-pg-specific-24x24",
-    "mask": "icon-pg-specific-24x24",
-    "rateValues": "icon-pg-specific-24x24",
-    "choices": "icon-pg-specific-24x24",
-    "choicesByUrl": "icon-pg-webservice-24x24",
-    "undefined": "icon-pg-undefined-24x24",
-};
-
 const creatorThemeModelProperties = {
     "creatortheme": {
         properties: [
@@ -22878,7 +22986,7 @@ class DomDocumentHelper {
 }
 class CreatorStylesManager {
     static findSheet(styleSheetId) {
-        if (typeof document === "undefined")
+        if (!DomDocumentHelper.isAvailable())
             return null;
         for (let i = 0; i < document.styleSheets.length; i++) {
             if (!!document.styleSheets[i].ownerNode && document.styleSheets[i].ownerNode["id"] === styleSheetId) {
@@ -22888,6 +22996,8 @@ class CreatorStylesManager {
         return null;
     }
     static createSheet(styleSheetId) {
+        if (!DomDocumentHelper.isAvailable())
+            return null;
         let style = DomDocumentHelper.createElement("style");
         style.id = styleSheetId;
         style.appendChild(new Text(""));
@@ -22900,13 +23010,15 @@ class CreatorStylesManager {
             if (!sheet) {
                 sheet = CreatorStylesManager.createSheet(CreatorStylesManager.SurveyJSCreatorStylesSheetId);
             }
-            if (Object.keys(rules).length) {
-                rules.forEach((rule) => {
-                    try {
-                        sheet.insertRule(`${rule.selector} { ${rule.styles} }`, 0);
-                    }
-                    catch (e) { }
-                });
+            if (sheet) {
+                if (Object.keys(rules).length) {
+                    rules.forEach((rule) => {
+                        try {
+                            sheet.insertRule(`${rule.selector} { ${rule.styles} }`, 0);
+                        }
+                        catch (e) { }
+                    });
+                }
             }
         }
     }
@@ -23628,7 +23740,7 @@ class TabDesignerPlugin {
             const action = new MenuButton({
                 id: p.name,
                 tooltip: p.title,
-                iconName: pgTabIcons[p.name] || pgTabIcons["undefined"],
+                iconName: p["iconName"],
                 iconSize: "auto",
                 active: this.activePageIsPropertyGrid && p.name === this.propertyGrid.survey.currentPage.name,
                 pressed: false,
@@ -23669,7 +23781,6 @@ class TabDesignerPlugin {
         this.creator.sidebar.sideAreaComponentData = undefined;
         this.creator.sidebar.onPropertyChanged.clear();
         this.creator.sidebar.header.reset();
-        this.creator.expandCollapseManager.clear();
         return true;
     }
     onDesignerSurveyPropertyChanged(obj, propName) {
@@ -24593,6 +24704,9 @@ class StringEditorViewModelBase extends Base {
         this.blurredByEscape = false;
         this.focusedProgram = false;
         this.characterCounter = new CharacterCounter();
+        this.onLocaleChanged = () => {
+            this.resetPropertyValue("placeholderValue");
+        };
         this.activate = () => {
             const element = this.getEditorElement();
             if (element && element.offsetParent != null) {
@@ -24605,6 +24719,7 @@ class StringEditorViewModelBase extends Base {
         this.justFocused = false;
         this.locString = locString;
         this.checkMarkdownToTextConversion(this.locString.owner, this.locString.name);
+        this.addCreatorEvents();
     }
     afterRender() {
         if (this.connector.focusOnEditor) {
@@ -24614,20 +24729,33 @@ class StringEditorViewModelBase extends Base {
     }
     detachFromUI() {
         var _a;
+        this.removeCreatorEvents();
         (_a = this.connector) === null || _a === void 0 ? void 0 : _a.onDoActivate.remove(this.activate);
         this.getEditorElement = undefined;
         this.blurEditor = undefined;
     }
     dispose() {
+        var _a;
+        (_a = this.creator) === null || _a === void 0 ? void 0 : _a.onLocaleChanded.remove(this.onLocaleChanged);
         super.dispose();
         this.detachFromUI();
     }
+    addCreatorEvents() {
+        var _a;
+        (_a = this.creator) === null || _a === void 0 ? void 0 : _a.onLocaleChanded.add(this.onLocaleChanged);
+    }
+    removeCreatorEvents() {
+        var _a;
+        (_a = this.creator) === null || _a === void 0 ? void 0 : _a.onLocaleChanded.remove(this.onLocaleChanged);
+    }
     setLocString(locString) {
         var _a;
+        this.removeCreatorEvents();
         (_a = this.connector) === null || _a === void 0 ? void 0 : _a.onDoActivate.remove(this.activate);
         this.locString = locString;
         this.connector = StringEditorConnector.get(locString);
         this.connector.onDoActivate.add(this.activate);
+        this.addCreatorEvents();
     }
     checkConstraints(event) {
         if (!this.compostionInProgress && this.maxLength > 0 && event.keyCode >= 32) {
@@ -25443,7 +25571,7 @@ class ThemeTabPlugin {
                 const action = new MenuButton({
                     id: p.name,
                     tooltip: p.title,
-                    iconName: pgTabIcons[p.name] || pgTabIcons["undefined"],
+                    iconName: p["iconName"],
                     iconSize: "auto",
                     active: p.name === this.propertyGrid.survey.currentPage.name,
                     pressed: false,
@@ -25967,7 +26095,6 @@ class ExpandCollapseManager {
     constructor(creator) {
         this.creator = creator;
         this._lockQuestions = false;
-        this.adorners = [];
     }
     expandCollapseElements(reason, isCollapsed, elements = null) {
         this.updateCollapsed(elements || this.getCollapsableElements(), isCollapsed, reason);
@@ -25983,38 +26110,26 @@ class ExpandCollapseManager {
             .concat(this.creator.survey.getAllPanels())
             .concat(this.creator.survey.getAllQuestions());
     }
+    sortElements(elements) {
+        return [].concat(elements).sort((el, el2) => {
+            const a = el.isPage ? 2 : el.isPanel ? 1 : 0;
+            const b = el2.isPage ? 2 : el2.isPanel ? 1 : 0;
+            return a - b;
+        });
+    }
     updateCollapsed(elements, value, reason) {
-        const canToSaveToStateManager = this.creator.designerStateManager && !this.creator.designerStateManager.isSuspended;
-        elements.forEach(element => {
+        this.sortElements(elements).forEach(element => {
+            var _a;
             if (element.isQuestion && this._lockQuestions)
                 return;
-            if (canToSaveToStateManager) {
-                this.creator.designerStateManager.getElementState(element).collapsed =
-                    this.creator.getElementExpandCollapseState(element, reason, value);
+            const collapsed = this.creator.getElementExpandCollapseState(element, reason, value);
+            (_a = this.creator.designerStateManager) === null || _a === void 0 ? void 0 : _a.setElementCollapsed(element, collapsed);
+            const adorner = SurveyElementAdornerBase.GetAdorner(element);
+            if (adorner && adorner.allowExpandCollapse) {
+                const newState = this.creator.getElementExpandCollapseState(element, reason, value);
+                adorner.collapsed = newState;
             }
         });
-        for (let i = this.adorners.length - 1; i >= 0; i--) {
-            const element = this.adorners[i].element;
-            if (element.isQuestion && this._lockQuestions)
-                continue;
-            if (elements.indexOf(element) == -1)
-                continue;
-            if (this.adorners[i].allowExpandCollapse) {
-                let newState = canToSaveToStateManager ?
-                    this.creator.designerStateManager.getElementState(element).collapsed :
-                    this.creator.getElementExpandCollapseState(element, reason, value);
-                this.adorners[i].collapsed = newState;
-            }
-        }
-    }
-    add(adorner) {
-        this.adorners.push(adorner);
-    }
-    remove(adorner) {
-        this.adorners.splice(this.adorners.indexOf(adorner), 1);
-    }
-    clear() {
-        this.adorners.length = 0;
     }
 }
 
@@ -26051,6 +26166,9 @@ class TabbedMenuContainer extends AdaptiveActionContainer {
         this.creator = creator;
         this.dotsItem.popupModel.horizontalPosition = "center";
         this.dotsItem.popupModel.cssClass += " svc-tabbed-menu-item__popup svc-creator-popup";
+        this.dotsItem.css += " svc-tabbed-menu-dots";
+        this.dotsItem.innerCss += " svc-tabbed-menu-dots__item";
+        this.dotsItem.iconSize = "auto";
         this.hiddenItemsListModel.cssClasses = listComponentCss;
         this.minVisibleItemsCount = 1;
     }
@@ -26084,6 +26202,210 @@ class TabbedMenuContainer extends AdaptiveActionContainer {
     }
 }
 
+function doMachineStringsTranslation(survey, creatorOptions, locales) {
+    locales.forEach(loc => {
+        const locStrs = getUnlocalizedStrings(survey);
+        if (locStrs.length > 0) {
+            const locStrsHash = {};
+            const defaultStrs = new Array();
+            locStrs.forEach(locStr => {
+                let text = locStr.getLocaleText("");
+                if (!text && locStr.onGetTextCallback) {
+                    text = locStr.onGetTextCallback("");
+                    if (isTextNonTranslated(text)) {
+                        text = undefined;
+                    }
+                }
+                if (!!text) {
+                    if (!locStrsHash[text]) {
+                        locStrsHash[text] = [];
+                        defaultStrs.push(text);
+                    }
+                    locStrsHash[text].push(locStr);
+                }
+            });
+            creatorOptions.doMachineTranslation(surveyLocalization.defaultLocale, loc, defaultStrs, (translated) => {
+                if (!!translated && translated.length === defaultStrs.length) {
+                    creatorOptions.startUndoRedoTransaction("Translate to " + loc);
+                    for (let i = 0; i < defaultStrs.length; i++) {
+                        locStrsHash[defaultStrs[i]].forEach(locStr => locStr.setLocaleText(loc, translated[i]));
+                    }
+                    creatorOptions.stopUndoRedoTransaction();
+                }
+            });
+        }
+    });
+}
+function getUnlocalizedStrings(survey, creatorOptions, loc) {
+    const res = new Array();
+    const options = {
+        canShowProperty: (reason, obj, property, locStr, isShowing, defaultValue) => {
+            return isShowing && (!locStr || !(locStr === null || locStr === void 0 ? void 0 : locStr.isEmpty)) || !!defaultValue;
+        },
+        onAddLocalizedString: (obj, property, locStr, translatedObj) => {
+            res.push(locStr);
+        },
+        onCreateNewTranslateObj: (obj, property, translateObj) => {
+            return undefined;
+        }
+    };
+    collectStringsByObj(survey, options, undefined);
+    return res;
+}
+function collectStringsByObj(obj, options, translateObj) {
+    if (isItemValueArray(obj)) {
+        createItemValuesLocale(obj, options, translateObj);
+        return;
+    }
+    if (!obj || !obj.getType)
+        return;
+    let properties = getLocalizedProperties(obj, options);
+    for (let i = 0; i < properties.length; i++) {
+        addLocalizationItem(obj, options, properties[i], translateObj);
+    }
+    properties = getArrayProperties(obj);
+    for (var i = 0; i < properties.length; i++) {
+        var property = properties[i];
+        var value = obj[property.name];
+        //If ItemValue array?
+        if (isItemValueArray(value)) {
+            if (canShowProperty("itemvalue-array", options, obj, property, Array.isArray(value) && value.length > 0)) {
+                createGroup(options, obj[property.name], property, translateObj);
+            }
+        }
+        else {
+            for (let i = 0; i < value.length; i++) {
+                createGroup(options, value[i], property, translateObj);
+            }
+        }
+    }
+    createMatrixCellsGroup(options, obj, translateObj);
+}
+function isItemValueArray(val) {
+    return (!!val &&
+        Array.isArray(val) &&
+        val.length > 0 &&
+        !!val[0] &&
+        !!val[0]["getType"] &&
+        !!val[0]["setData"] &&
+        !!val[0]["setLocText"]);
+}
+function addLocalizationItem(obj, options, property, translateObj) {
+    const locStr = getLocalizableStr(obj, property);
+    if (!locStr)
+        return;
+    const defaultValue = getDefaultValue(obj, property);
+    if (canShowProperty("add-locsr", options, obj, property, !locStr.isEmpty, defaultValue)) {
+        options.onAddLocalizedString(obj, property, locStr, translateObj);
+    }
+}
+function createItemValuesLocale(obj, options, translateObj) {
+    for (let i = 0; i < obj.length; i++) {
+        const val = obj[i];
+        addPropertiesForItemValue(val, options, translateObj);
+    }
+}
+function addPropertiesForItemValue(itemValue, options, translateObj) {
+    const locProperties = getLocalizedProperties(itemValue, options, false);
+    for (let i = 0; i < locProperties.length; i++) {
+        const prop = locProperties[i];
+        const isText = prop.name === "text";
+        const reason = isText ? "itemvalue-text" : "itemvalue-customprop";
+        const defValue = isText ? itemValue.value : undefined;
+        const canshow = canShowProperty(reason, options, itemValue, prop, true, defValue);
+        if (!canshow && isText)
+            break;
+        if (canshow) {
+            options.onAddLocalizedString(itemValue, prop, getLocalizableStr(itemValue, prop), translateObj);
+        }
+    }
+}
+function getLocalizedProperties(obj, options, checkIsShowing = true) {
+    const res = new Array();
+    const properties = Serializer.getPropertiesByObj(obj);
+    for (let i = 0; i < properties.length; i++) {
+        const property = properties[i];
+        if (property.readOnly || !property.visible || !property.isSerializable || !property.isLocalizable)
+            continue;
+        const isShowing = ["url", "file"].indexOf(property.type) < 0;
+        if (!checkIsShowing || canShowProperty("get-property", options, obj, property, isShowing)) {
+            res.push(property);
+        }
+    }
+    return res;
+}
+function getArrayProperties(obj) {
+    var res = new Array();
+    var properties = Serializer.getPropertiesByObj(obj);
+    for (var i = 0; i < properties.length; i++) {
+        var property = properties[i];
+        if (property.isSerializable === false)
+            continue;
+        var value = obj[property.name];
+        if (!!value && Array.isArray(value) && value.length > 0) {
+            res.push(property);
+        }
+    }
+    return res;
+}
+function getLocalizableStr(obj, prop) {
+    return obj[prop.serializationProperty];
+}
+function createGroup(options, obj, property, translateObj) {
+    if (!!obj && (obj.getType || Array.isArray(obj))) {
+        translateObj = options.onCreateNewTranslateObj(obj, property, translateObj);
+        collectStringsByObj(obj, options, translateObj);
+    }
+}
+function canShowProperty(reason, options, obj, property, isShowing, defaultValue) {
+    if (options.canShowProperty) {
+        return options.canShowProperty(reason, obj, property, getLocalizableStr(obj, property), isShowing, defaultValue);
+    }
+    return isShowing;
+}
+function createMatrixCellsGroup(options, obj, translateObj) {
+    Serializer.getPropertiesByObj(obj).forEach(prop => {
+        if (prop.type === "cells" && canShowProperty("matrix-cell", options, obj, prop, true)) {
+            createMatrixCellsGroupCore(options, obj, prop, translateObj);
+        }
+    });
+}
+function createMatrixCellsGroupCore(options, obj, prop, translateObj) {
+    const cells = obj[prop.name];
+    if (cells.isEmpty)
+        return;
+    const matrix = obj;
+    translateObj = options.onCreateNewTranslateObj(obj, prop, translateObj);
+    const defaultName = settings$1.matrix.defaultRowName;
+    const rows = [defaultName];
+    matrix.rows.forEach(row => rows.push(row.value));
+    rows.forEach(val => {
+        matrix.columns.forEach(col => {
+            const locStr = cells.getCellDisplayLocText(val, col);
+            if (!!locStr) {
+                options.onAddLocalizedString(obj, prop, locStr, translateObj);
+            }
+        });
+    });
+}
+function getDefaultValue(obj, prop) {
+    const locStr = getLocalizableStr(obj, prop);
+    if (!locStr)
+        return "";
+    if (prop.name == "title") {
+        if (!!locStr && !obj.isPage && !obj.isPanel && !!locStr.onGetTextCallback)
+            return obj["name"];
+    }
+    return "";
+}
+function isTextNonTranslated(text) {
+    if (!text)
+        return true;
+    if (Helpers.isNumber(text))
+        return true;
+    return text.length < 2;
+}
+
 var iconsV1Data = {
 	"actual-size-24x24": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\"><path d=\"M10 6C7.79 6 6 7.79 6 10C6 12.21 7.79 14 10 14C12.21 14 14 12.21 14 10C14 7.79 12.21 6 10 6ZM10 12C8.9 12 8 11.1 8 10C8 8.9 8.9 8 10 8C11.1 8 12 8.9 12 10C12 11.1 11.1 12 10 12ZM22.71 21.29L17.03 15.61C18.26 14.07 19 12.12 19 10C19 5.04 14.96 1 10 1C5.04 1 1 5.04 1 10C1 14.96 5.04 19 10 19C12.12 19 14.07 18.26 15.61 17.03L21.29 22.71L22.7 21.3L22.71 21.29ZM3 10C3 6.14 6.14 3 10 3C13.86 3 17 6.14 17 10C17 13.86 13.86 17 10 17C6.14 17 3 13.86 3 10Z\"></path></svg>",
 	"add-16x16": "<svg viewBox=\"0 0 16 16\" xmlns=\"http://www.w3.org/2000/svg\"><g clip-path=\"url(#clip0_554_309816)\"><path d=\"M9 7H12V9H9V12H7V9H4V7H7V4H9V7ZM16 8C16 12.4 12.4 16 8 16C3.6 16 0 12.4 0 8C0 3.6 3.6 0 8 0C12.4 0 16 3.6 16 8ZM14 8C14 4.7 11.3 2 8 2C4.7 2 2 4.7 2 8C2 11.3 4.7 14 8 14C11.3 14 14 11.3 14 8Z\"></path></g><defs><clipPath id=\"clip0_554_309816\"><rect width=\"16\" height=\"16\" fill=\"white\"></rect></clipPath></defs></svg>",
@@ -27230,6 +27552,10 @@ class SurveyCreatorModel extends Base {
         this.onHtmlToMarkdown = this.addCreatorEvent();
         /**
          * An event that is raised when Survey Creator obtains the expand/collapse state of a survey element on the design surface. Handle this event to set a required state.
+         *
+         * For information on event handler parameters, refer to descriptions within the interface.
+         *
+         * [View Demo](https://surveyjs.io/survey-creator/examples/expand-and-collapse-survey-elements/ (linkStyle))
          * @see [ICreatorOptions.collapseQuestions](https://surveyjs.io/survey-creator/documentation/api-reference/icreatoroptions#collapseQuestions)
          * @see [ICreatorOptions.collapsePanels](https://surveyjs.io/survey-creator/documentation/api-reference/icreatoroptions#collapsePanels)
          * @see [ICreatorOptions.collapsePages](https://surveyjs.io/survey-creator/documentation/api-reference/icreatoroptions#collapsePages)
@@ -27508,7 +27834,6 @@ class SurveyCreatorModel extends Base {
          *
          * For information on event handler parameters, refer to descriptions within the interface.
          *
-         *
          * Within the event handler, you need to pass translation strings and locale information to the translation service API. The service should return an array of translated strings that you need to pass to the `options.callback` function. The following code shows how to integrate the Microsoft Translator service into Survey Creator:
          *
          * ```js
@@ -27554,6 +27879,7 @@ class SurveyCreatorModel extends Base {
          * ```
          *
          * > Survey Creator does not include a machine translation service out of the box. Our component only provides a UI for calling the service API.
+         * @see startMachineTranslationTo
          */
         this.onMachineTranslate = this.addCreatorEvent();
         /**
@@ -27624,6 +27950,9 @@ class SurveyCreatorModel extends Base {
          * An event that is raised when users change a property in a [Survey Creator theme](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#creatorTheme).
          */
         this.onCreatorThemePropertyChanged = this.addCreatorEvent();
+        /**
+         * An event that is raised when users select a [Survey Creator theme](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#creatorTheme) from the drop-down list of UI themes.
+         */
         this.onCreatorThemeSelected = this.addCreatorEvent();
         // /**
         //  * You need to set this property to true if you want to use tabs instead of accordion in the popup element's editor.
@@ -27864,6 +28193,13 @@ class SurveyCreatorModel extends Base {
          * Default value: `false`
          */
         this.collapseOnDrag = false;
+        /**
+         * Specifies whether to clear translations to other languages when a source language translation is changed.
+         *
+         * Default value: `false`
+         * @see showTranslationTab
+         */
+        this.clearTranslationsOnSourceTextChange = false;
         if (!!options2 ||
             typeof this.options === "string" ||
             this.options instanceof String) {
@@ -28894,9 +29230,52 @@ class SurveyCreatorModel extends Base {
             options.value = options.newValue;
             this.onAfterPropertyChanged.fire(this, options);
         }
+        this.clearLocalizationStrings(options.target, options.name);
         options.type = "PROPERTY_CHANGED";
         this.setModified(options);
     }
+    clearLocalizationStrings(el, name) {
+        if (this.clearTranslationsOnSourceTextChange) {
+            const loc = this.survey.locale;
+            if (!!loc && loc !== surveyLocalization.defaultLocale)
+                return;
+            if ((el.isQuestion || Serializer.isDescendantOf(el.getType(), "matrixdropdowncolumn")) && name === "name") {
+                this.clearNonDefaultLocalesInStrByValue(el.locTitle);
+            }
+            else {
+                if (Serializer.isDescendantOf(el.getType(), "itemvalue") && name === "value") {
+                    this.clearNonDefaultLocalesInStrByValue(el.locText);
+                }
+                else {
+                    const prop = Serializer.findProperty(el.getType(), name);
+                    if (prop && prop.isLocalizable && prop.serializationProperty) {
+                        const locStr = el[prop.serializationProperty];
+                        this.clearNonDefaultLocalesInStr(locStr);
+                    }
+                }
+            }
+        }
+    }
+    clearNonDefaultLocalesInStrByValue(locStr) {
+        if (!locStr.isEmpty && !locStr.getLocaleText("")) {
+            this.clearNonDefaultLocalesInStr(locStr);
+        }
+    }
+    clearNonDefaultLocalesInStr(locStr) {
+        if (locStr) {
+            const ctrl = this.undoRedoController;
+            if (ctrl)
+                ctrl.ignoreChanges = true;
+            const locs = locStr.getLocales();
+            locs.forEach(l => {
+                if (l !== surveyLocalization.defaultLocale && l !== "default") {
+                    locStr.setLocaleText(l, "");
+                }
+            });
+            if (ctrl)
+                ctrl.ignoreChanges = false;
+        }
+    }
     notifySurveyItemMoved(options) {
         options.type = "ELEMENT_REORDERED";
         this.setModified(options);
@@ -29326,7 +29705,7 @@ class SurveyCreatorModel extends Base {
         this.currentFocusTimeout = setTimeout(() => {
             this.currentFocusInterval = setInterval(() => {
                 var _a, _b;
-                const el = document.getElementById(selEl.id);
+                let el = this.getHtmlElementForScroll(selEl);
                 if (!!selEl && (focus || startEdit && (!selEl.hasTitle || selEl.isPanel))) {
                     if (!el || this.rootElement.getAnimations({ subtree: true }).filter((animation => animation.effect.getComputedTiming().activeDuration !== Infinity && (animation.pending || animation.playState !== "finished")))[0])
                         return;
@@ -29343,7 +29722,7 @@ class SurveyCreatorModel extends Base {
                                 SurveyHelper.scrollIntoViewIfNeeded((_b = el.parentElement) !== null && _b !== void 0 ? _b : el, () => { return scrollIntoViewOptions; }, true);
                             }
                         }
-                        if (!propertyName && el.parentElement) {
+                        if (!propertyName && el.parentElement && selEl.getType() !== "matrixdropdowncolumn") {
                             let elToFocus = (typeof (focus) === "string") ? el.parentElement.querySelector(focus) : el.parentElement;
                             elToFocus && elToFocus.focus({ preventScroll: true });
                         }
@@ -29358,10 +29737,17 @@ class SurveyCreatorModel extends Base {
             }, 1);
         }, 100);
     }
+    getHtmlElementForScroll(element) {
+        const id = element.getType() === "matrixdropdowncolumn" ? element.colOwner.id : element.id;
+        return document.getElementById(id);
+    }
     getSelectedSurveyElement() {
         var sel = this.selectedElement;
         if (!sel || sel.getType() == "survey")
             return null;
+        if (this.selectedElement.getType() === "matrixdropdowncolumn") {
+            return this.selectedElement;
+        }
         return sel.isInteractiveDesignElement && sel.id ? sel : null;
     }
     onSelectingElement(val) {
@@ -29375,6 +29761,8 @@ class SurveyCreatorModel extends Base {
     }
     /**
      * Opens [Survey Creator theme](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#creatorTheme) settings in Property Grid. Applies only if [`propertyGridNavigationMode`](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#propertyGridNavigationMode) is `"buttons"`.
+     *
+     * [View Demo](https://surveyjs.io/survey-creator/examples/dynamic-ui-customization/ (linkStyle))
      * @see closeCreatorThemeSettings
      * @see showCreatorThemeSettings
      */
@@ -29971,6 +30359,17 @@ class SurveyCreatorModel extends Base {
             this.onMachineTranslate.fire(this, { fromLocale: fromLocale, toLocale: toLocale, strings: strings, callback: callback });
         }
     }
+    /**
+     * Starts the translation of survey strings from the default language to one or more specified languages using a machine translation service, such as Google Translate or Microsoft Translator.
+     *
+     * This method only launches the operation by raising the [`onMachineTranslate`](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#onMachineTranslate) event. Handle this event to perform the actual translation.
+     * @param locales An array of locale codes that correspond to target languages, for example, `[ "de", "fr" ]`.
+     */
+    startMachineTranslationTo(locales) {
+        if (!this.getHasMachineTranslation())
+            return;
+        doMachineStringsTranslation(this.survey, this, locales);
+    }
     doAutoSave() {
         const saveFunc = () => this.doSave();
         if (this.autoSaveDelay <= 0) {
@@ -30335,6 +30734,8 @@ class SurveyCreatorModel extends Base {
     }
     /**
      * Applies a specified UI theme to Survey Creator.
+     *
+     * [View Demo](https://surveyjs.io/survey-creator/examples/dynamic-ui-customization/ (linkStyle))
      * @param theme An `ICreatorTheme` object with theme settings.
      * @see creatorTheme
      * @see showCreatorThemeSettings
@@ -31139,18 +31540,6 @@ __decorate([
 ], PageNavigatorViewModel.prototype, "visibleItemsCount", void 0);
 
 class PageAdorner extends SurveyElementAdornerBase {
-    updateDragTypeOverMe() {
-        var _a;
-        if (!this.isDisposed) {
-            this.dragTypeOverMe = (_a = this.page) === null || _a === void 0 ? void 0 : _a.dragTypeOverMe;
-        }
-    }
-    updateIsDragMe() {
-        var _a;
-        if (!this.isDisposed) {
-            this.isDragMe = (_a = this.page) === null || _a === void 0 ? void 0 : _a.isDragMe;
-        }
-    }
     updateShowPlaceholder(visibleRows) {
         this.showPlaceholder = !this.isGhost && (visibleRows || this.page.visibleRows).length === 0;
     }
@@ -31206,15 +31595,12 @@ class PageAdorner extends SurveyElementAdornerBase {
     updateActionVisibility(id, isVisible) {
         super.updateActionVisibility(id, !this.isGhost && isVisible);
     }
-    get dragInsideCollapsedContainer() {
-        return this.collapsed;
-    }
     getAllowExpandCollapse(options) {
         return !this.isGhost && super.getAllowExpandCollapse(options);
     }
     attachElement(surveyElement) {
         super.attachElement(surveyElement);
-        this.dragTypeOverMe = null;
+        this.dropIndicatorPosition = null;
         if (!!surveyElement) {
             surveyElement["surveyChangedCallback"] = () => {
                 this.isPageLive = !!surveyElement.survey;
@@ -31222,12 +31608,6 @@ class PageAdorner extends SurveyElementAdornerBase {
             if (this.isGhost) {
                 this.addGhostPageSubsribes(surveyElement);
             }
-            surveyElement.registerFunctionOnPropertiesValueChanged(["dragTypeOverMe"], () => {
-                this.updateDragTypeOverMe();
-            }, "dragOver");
-            surveyElement.registerFunctionOnPropertiesValueChanged(["isDragMe"], () => {
-                this.updateIsDragMe();
-            }, "dragOver");
             surveyElement.registerFunctionOnPropertiesValueChanged(["visibleRows"], (newValue) => {
                 this.updateShowPlaceholder(newValue);
             }, "updatePlaceholder");
@@ -31236,8 +31616,6 @@ class PageAdorner extends SurveyElementAdornerBase {
             surveyElement.updateCustomWidgets();
             surveyElement.setWasShown(true);
             this.checkActionProperties();
-            this.dragTypeOverMe = surveyElement.dragTypeOverMe;
-            this.isDragMe = surveyElement.isDragMe;
             if (this.creator.pageEditMode !== "single") {
                 surveyElement.locTitle.placeholder = () => { return surveyElement.isStartPage ? "pe.startPageTitlePlaceholder" : "pe.pageTitlePlaceholder"; };
                 surveyElement.locDescription.placeholder = "pe.pageDescriptionPlaceholder";
@@ -31249,14 +31627,13 @@ class PageAdorner extends SurveyElementAdornerBase {
             delete surveyElement.locTitle.placeholder;
             delete surveyElement.locDescription.placeholder;
             surveyElement.unRegisterFunctionOnPropertiesValueChanged(["elements"], "updatePlaceholder");
-            surveyElement.unRegisterFunctionOnPropertiesValueChanged(["dragTypeOverMe", "isDragMe"], "dragOver");
             surveyElement.unRegisterFunctionOnPropertiesValueChanged(["title", "description"], "add_ghost");
             surveyElement.unRegisterFunctionOnPropertiesValueChanged(["visibleRows"], "updatePlaceholder");
             surveyElement["surveyChangedCallback"] = undefined;
         }
         super.detachElement(surveyElement);
         if (!this.isDisposed) {
-            this.dragTypeOverMe = null;
+            this.dropIndicatorPosition = null;
         }
     }
     onElementSelectedChanged(isSelected) {
@@ -31305,7 +31682,6 @@ class PageAdorner extends SurveyElementAdornerBase {
         container.sizeMode = "small";
         container.cssClasses = this.containerCssClasses();
         container.dotsItem.iconSize = "auto";
-        container.dotsItem.cssClasses.itemIcon += " svc-page-toolbar-item__icon";
         return container;
     }
     createTopActionContainer() {
@@ -31353,53 +31729,32 @@ class PageAdorner extends SurveyElementAdornerBase {
         event.cancelBubble = true;
     }
     get css() {
-        let result = super.getCss();
-        if (this.dragDropHelper.draggedElement && this.dragDropHelper.draggedElement.isPage) {
-            if (this.dragTypeOverMe === DragTypeOverMeEnum.Top) {
-                result += " svc-question__content--drag-over-top";
-            }
-            if (this.dragTypeOverMe === DragTypeOverMeEnum.Bottom) {
-                result += " svc-question__content--drag-over-bottom";
-            }
+        const isShowAddQuestionButton = !!this.creator && !this.creator.showAddQuestionButton;
+        const isGhostEmpty = this.isGhost && this.creator.survey.pages.length > 0;
+        const isInsideCollapsed = this.dropIndicatorPosition === DropIndicatorPosition.Inside && this.collapsed;
+        let result = new CssClassBuilder()
+            .append(super.getCss())
+            .append("svc-page__content--dragged", this.isBeingDragged)
+            .append("svc-question__content--drag-over-top", this.dropIndicatorPosition === DropIndicatorPosition.Top)
+            .append("svc-question__content--drag-over-bottom", this.dropIndicatorPosition === DropIndicatorPosition.Bottom)
+            .append("svc-page__content--collapsed-drag-over-inside", isInsideCollapsed)
+            .append("svc-question__content--drag-over-inside", this.dropIndicatorPosition === DropIndicatorPosition.Inside && this.showPlaceholder)
+            .append("svc-page--drag-over-empty", this.dropIndicatorPosition === DropIndicatorPosition.Inside && !!isGhostEmpty)
+            .append("svc-page--drag-over-empty-no-add-button", this.dropIndicatorPosition === DropIndicatorPosition.Inside && !!isGhostEmpty && isShowAddQuestionButton)
+            .append("svc-page__content--collapse-" + this.creator.expandCollapseButtonVisibility, this.allowExpandCollapse || !!this.page["isGhost"])
+            .append("svc-page__content--collapsed", (this.allowExpandCollapse || !!this.page["isGhost"]) && (this.renderedCollapsed || !!this.page["isGhost"]))
+            .append("svc-page__content--animation-running", (this.allowExpandCollapse || !!this.page["isGhost"]) && (this.expandCollapseAnimationRunning))
+            .append("svc-page__content--new", !!this.isGhost)
+            .append("svc-page__content--selected", !this.isGhost && !!this.creator.isElementSelected(this.page))
+            .append("svc-page__content--no-header", !this.isGhost && settings$1.designMode.showEmptyTitles === false)
+            .toString();
+        if (isInsideCollapsed) {
+            this.dragIn();
         }
         else {
-            if (!!this.dragTypeOverMe && this.showPlaceholder) {
-                result = "svc-question__content--drag-over-inside";
-            }
-            else if (!!this.dragTypeOverMe && this.page.elements.length === 0 && this.creator.survey.pages.length > 0) {
-                result = "svc-page--drag-over-empty";
-                if (!!this.creator && !this.creator.showAddQuestionButton) {
-                    result += " svc-page--drag-over-empty-no-add-button";
-                }
-            }
-            if (!!this.dragTypeOverMe && this.collapsed) {
-                this.dragIn();
-                result += " svc-page__content--collapsed-drag-over-inside";
-            }
-            else {
-                this.dragOut();
-            }
-        }
-        if (this.allowExpandCollapse || this.page["isGhost"]) {
-            result += (" svc-page__content--collapse-" + this.creator.expandCollapseButtonVisibility);
-            if (this.renderedCollapsed || this.page["isGhost"])
-                result += (" svc-page__content--collapsed");
-            if (this.expandCollapseAnimationRunning)
-                result += (" svc-page__content--animation-running");
-        }
-        if (this.isDragMe) {
-            result += " svc-page__content--dragged";
-        }
-        if (this.isGhost) {
-            return result + " svc-page__content--new";
-        }
-        if (this.creator.isElementSelected(this.page)) {
-            result += " svc-page__content--selected";
-        }
-        if (settings$1.designMode.showEmptyTitles === false) {
-            result += " svc-page__content--no-header";
+            this.dragOut();
         }
-        return result.trim();
+        return result;
     }
     hoverStopper(event, element) {
         event["__svc_question_processed"] = true;
@@ -31479,12 +31834,6 @@ __decorate([
 __decorate([
     property({ defaultValue: "" })
 ], PageAdorner.prototype, "currentAddQuestionType", void 0);
-__decorate([
-    property({ defaultValue: null })
-], PageAdorner.prototype, "dragTypeOverMe", void 0);
-__decorate([
-    property({ defaultValue: false })
-], PageAdorner.prototype, "isDragMe", void 0);
 __decorate([
     property({
         onSet(val, target, prevVal) {
@@ -31505,42 +31854,32 @@ class RowViewModel extends Base {
         this.creator = creator;
         this.row = row;
         this.templateData = templateData;
-        this.rowDragTypeOverMeChanged = (s, o) => {
-            if (o.name == "dragTypeOverMe")
-                this.dragTypeOverMe = o.newValue;
-        };
-        this.dragTypeOverMe = this.row.dragTypeOverMe;
+        if (this.row) {
+            this.row.setPropertyValue(SurveyElementAdornerBase.AdornerValueName, this);
+        }
     }
     subscribeElementChanges() {
-        this.row.onPropertyChanged.add(this.rowDragTypeOverMeChanged);
+        this.row.setPropertyValue(SurveyElementAdornerBase.AdornerValueName, this);
     }
     unsubscribeElementChanges() {
-        this.row.onPropertyChanged.remove(this.rowDragTypeOverMeChanged);
+        this.row.setPropertyValue(SurveyElementAdornerBase.AdornerValueName, null);
     }
     get cssClasses() {
-        let result = "svc-row";
-        let ghostClass = " svc-row--ghost";
-        if (this.row.elements.length === 1 &&
-            this.row.elements[0].name === "sv-drag-drop-ghost-survey-element-name") {
-            result += ghostClass;
-        }
-        if (this.dragTypeOverMe === DragTypeOverMeEnum.Top) {
-            result += " svc-row--drag-over-top";
-        }
-        if (this.dragTypeOverMe === DragTypeOverMeEnum.Bottom) {
-            result += " svc-row--drag-over-bottom";
-        }
-        return result;
+        return new CssClassBuilder()
+            .append("svc-row")
+            .append("svc-row--ghost", this.row.elements.length === 1 && this.row.elements[0].name === "sv-drag-drop-ghost-survey-element-name")
+            .append("svc-row--drag-over-top", this.dropIndicatorPosition === DropIndicatorPosition.Top)
+            .append("svc-row--drag-over-bottom", this.dropIndicatorPosition === DropIndicatorPosition.Bottom)
+            .toString();
     }
     dispose() {
         super.dispose();
         this.unsubscribeElementChanges();
-        this.rowDragTypeOverMeChanged = undefined;
     }
 }
 __decorate([
-    property()
-], RowViewModel.prototype, "dragTypeOverMe", void 0);
+    property({ defaultValue: null })
+], RowViewModel.prototype, "dropIndicatorPosition", void 0);
 
 class QuestionAdornerViewModel extends SurveyElementAdornerBase {
     constructor(creator, surveyElement, templateData) {
@@ -31599,57 +31938,34 @@ class QuestionAdornerViewModel extends SurveyElementAdornerBase {
             .append("svc-question__adorner--collapse-" + this.creator.expandCollapseButtonVisibility, true).toString();
     }
     css() {
+        const isInsideCollapsed = this.dropIndicatorPosition === DropIndicatorPosition.Inside && this.collapsed;
         if (!this.surveyElement.isInteractiveDesignElement)
             return "";
-        let result = "svc-question__content";
-        result += typeof this.surveyElement.getType === "function" ? (" svc-question__content--" + this.surveyElement.getType()) : "";
-        if (this.creator.isElementSelected(this.surveyElement)) {
-            result += " svc-question__content--selected";
-        }
-        if (this.isEmptyElement) {
-            result += " svc-question__content--empty";
-        }
-        if (this.isEmptyTemplate) {
-            result += " svc-question__content--empty-template";
-        }
-        if (this.renderedCollapsed) {
-            result += " svc-question__content--collapsed";
-        }
-        if (!this.surveyElement.hasTitle || (!this.surveyElement.isPanel && this.surveyElement.getTitleLocation() === "hidden")) {
-            result += " svc-question__content--title-hidden";
-        }
-        if (this.surveyElement.hasTitleOnBottom) {
-            result += " svc-question__content--title-bottom";
-        }
-        if (this.isDragMe) {
-            result += " svc-question__content--dragged";
-        }
-        if (!!this.dragTypeOverMe && (this.canExpandOnDrag) && this.dragInsideCollapsedContainer) {
+        if (isInsideCollapsed) {
             this.dragIn();
-            result += " svc-question__content--collapsed-drag-over-inside";
         }
         else {
             this.dragOut();
         }
-        if (this.dragTypeOverMe === DragTypeOverMeEnum.InsideEmptyPanel) {
-            result += " svc-question__content--drag-over-inside";
-        }
-        if (!this.dragInsideCollapsedContainer) {
-            if (this.dragTypeOverMe === DragTypeOverMeEnum.Left) {
-                result += " svc-question__content--drag-over-left";
-            }
-            if (this.dragTypeOverMe === DragTypeOverMeEnum.Right) {
-                result += " svc-question__content--drag-over-right";
-            }
-            if (this.dragTypeOverMe === DragTypeOverMeEnum.Top) {
-                result += " svc-question__content--drag-over-top";
-            }
-            if (this.dragTypeOverMe === DragTypeOverMeEnum.Bottom) {
-                result += " svc-question__content--drag-over-bottom";
-            }
-            if (this.creator) {
-                result = this.creator.getElementAddornerCssCallback(this.surveyElement, result);
-            }
+        let result = new CssClassBuilder()
+            .append("svc-question__content")
+            .append("svc-question__content--" + this.surveyElement.getType(), typeof this.surveyElement.getType === "function")
+            .append("svc-question__content--selected", !!this.creator.isElementSelected(this.surveyElement))
+            .append("svc-question__content--empty", this.isEmptyElement)
+            .append("svc-question__content--empty-template", this.isEmptyTemplate)
+            .append("svc-question__content--collapsed", this.renderedCollapsed)
+            .append("svc-question__content--title-hidden", !this.surveyElement.hasTitle || (!this.surveyElement.isPanel && this.surveyElement.getTitleLocation() === "hidden"))
+            .append("svc-question__content--title-bottom", !!this.surveyElement.hasTitleOnBottom)
+            .append("svc-question__content--dragged", this.isBeingDragged)
+            .append("svc-question__content--collapsed-drag-over-inside", isInsideCollapsed)
+            .append("svc-question__content--drag-over-inside", this.dropIndicatorPosition === DropIndicatorPosition.Inside && !this.collapsed)
+            .append("svc-question__content--drag-over-top", this.dropIndicatorPosition === DropIndicatorPosition.Top)
+            .append("svc-question__content--drag-over-bottom", this.dropIndicatorPosition === DropIndicatorPosition.Bottom)
+            .append("svc-question__content--drag-over-right", this.dropIndicatorPosition === DropIndicatorPosition.Right)
+            .append("svc-question__content--drag-over-left", this.dropIndicatorPosition === DropIndicatorPosition.Left)
+            .toString();
+        if (!isInsideCollapsed && this.creator) {
+            result = this.creator.getElementAddornerCssCallback(this.surveyElement, result);
         }
         return result;
     }
@@ -31686,15 +32002,9 @@ class QuestionAdornerViewModel extends SurveyElementAdornerBase {
     }
     expandWithDragIn() {
         super.expandWithDragIn();
-        this.element.dragTypeOverMe = null;
+        this.dropIndicatorPosition = null;
         this.creator.dragDropSurveyElements.dropTarget = null;
     }
-    get isDragMe() {
-        return this.surveyElement.isDragMe;
-    }
-    get dragTypeOverMe() {
-        return this.element.dragTypeOverMe;
-    }
     get isBannerShowing() {
         return this.isUsingCarryForward || this.isUsingRestfull || this.isMessagePanelVisible;
     }
@@ -31816,7 +32126,6 @@ class QuestionAdornerViewModel extends SurveyElementAdornerBase {
         actionContainer.sizeMode = "small";
         actionContainer.cssClasses = defaultCssClasses;
         actionContainer.dotsItem.css += " svc-survey-element-toolbar__dots-item";
-        actionContainer.dotsItem.innerCss += " svc-survey-element-toolbar__item";
         return actionContainer;
     }
     updateActionsPropertiesCore() {
@@ -32041,20 +32350,25 @@ class QuestionAdornerViewModel extends SurveyElementAdornerBase {
         let selectedAction;
         let selectedSubaction = undefined;
         let selectedSubactions = undefined;
+        const toolboxItemToAction = (item, needSeparator = false) => {
+            return this.creator.createIActionBarItemByClass(item, needSeparator, (questionType, json) => { this.convertQuestion(questionType, json, defaultJsons); });
+        };
         availableItems.forEach((item) => {
             var _a;
             const needSeparator = lastItem && item.category != lastItem.category;
-            const action = this.creator.createIActionBarItemByClass(item, needSeparator, (questionType, json) => { this.convertQuestion(questionType, json, defaultJsons); });
+            const action = toolboxItemToAction(item, needSeparator);
             if (this.toolboxItemIsCorresponded(item, !!selectedAction)) {
                 selectedAction = action;
-                selectedSubactions = item.items;
+                if (item.items) {
+                    selectedSubactions = item.items.map(subitem => toolboxItemToAction(subitem));
+                }
             }
             if (((_a = item.items) === null || _a === void 0 ? void 0 : _a.length) > 0 && this.creator.toolbox.showSubitems) {
                 const subactions = [];
                 let selectedSubactionLocal = undefined;
                 let allChildsAreCompatibleToParent = false;
                 item.items.forEach(subitem => {
-                    const subaction = this.creator.createIActionBarItemByClass(subitem, false, (questionType, json) => { this.convertQuestion(questionType, json, defaultJsons); });
+                    const subaction = toolboxItemToAction(subitem);
                     if (this.toolboxItemIsCorresponded(subitem, !!selectedAction))
                         selectedSubactionLocal = subitem;
                     if (this.jsonsAreCompatible(item.json, subitem.json))
@@ -32062,7 +32376,7 @@ class QuestionAdornerViewModel extends SurveyElementAdornerBase {
                     subactions.push(subaction);
                 });
                 if (!allChildsAreCompatibleToParent && subactions.length > 0) {
-                    const defaultSubaction = this.creator.createIActionBarItemByClass(item, false, (questionType, json) => { this.convertQuestion(questionType, json, defaultJsons); });
+                    const defaultSubaction = toolboxItemToAction(item);
                     defaultSubaction.id = action.id + "-default";
                     defaultSubaction.iconName = undefined;
                     defaultSubaction.markerIconName = undefined;
@@ -32224,9 +32538,8 @@ class QuestionAdornerViewModel extends SurveyElementAdornerBase {
             items.push(inputTypeConverter);
         }
         items[items.length - 1].css += " svc-dropdown-action--convertTo-last";
-        if (typeof element["isRequired"] !== "undefined" &&
-            propertyExists(element, "isRequired") &&
-            isPropertyVisible(element, "isRequired")) {
+        if (typeof element["isRequired"] !== "undefined" && !!element.getType
+            && SurveyHelper.isPropertyVisible(element, Serializer.findProperty(element.getType(), "isRequired"), this.creator)) {
             items.push(this.createRequiredAction());
         }
     }
@@ -32963,7 +33276,8 @@ class MatrixCellWrapperViewModel extends Base {
             componentName: "svc-question-editor-content",
             data: {
                 survey: editSurvey.survey,
-                creator: this.creator
+                creator: this.creator,
+                style: designTabSurveyThemeJSON.cssVariables
             },
             onApply: () => {
                 editSurvey.apply();
@@ -33321,7 +33635,6 @@ QuestionFactory.Instance.registerQuestion("linkvalue", (name) => {
 class ScrollViewModel {
     constructor() {
         this._lockScroll = false;
-        //this.dragTypeOverMe = this.row.dragTypeOverMe;
     }
     setRootElement(element) {
         this._containerElementValue = element === null || element === void 0 ? void 0 : element.querySelector(".svc-scroll__scroller");
@@ -34118,15 +34431,16 @@ class FastEntryEditorBase extends PropertyEditorSetupValue {
     collectNames(item, type, separatorCounter) {
         let text = "";
         this.names.forEach((name) => {
+            let str = undefined;
             if (type === "itemvalues") {
                 if (name == "value")
                     return;
-                var str = name == "text" ? item.pureText : item[name];
+                str = name == "text" ? item.pureText : item[name];
             }
             else {
-                var str = item[name];
+                str = item[name];
             }
-            if (!!str) {
+            if (!Helpers.isValueEmpty(str)) {
                 for (var i = 0; i < separatorCounter; i++) {
                     text += ItemValue.Separator;
                 }
@@ -34167,9 +34481,9 @@ class FastEntryEditor extends FastEntryEditorBase {
             if (item) {
                 item.text = src[i].text;
                 names.forEach((name) => {
-                    if (name == "value" || name == "text")
-                        return;
-                    dest[i][name] = src[i][name];
+                    if (name !== "value") {
+                        item[name] = src[i][name];
+                    }
                 });
                 src.splice(i, 1, item);
             }
@@ -34224,16 +34538,12 @@ class PropertyGridEditorMatrix extends PropertyGridEditor {
         if (cellQuestion.getType() === "text" && !!objType) {
             if (propertyName === "text" && objType === "itemvalue") {
                 cellQuestion.placeholder = new ComputedUpdater(() => {
-                    if (!!rowObj.value)
-                        return rowObj.value.toString();
-                    return rowObj.text;
+                    return rowObj.locText.getPlaceholder();
                 });
             }
             if (propertyName === "title" && (objType === "matrixdropdowncolumn" || objType === "multipletextitem")) {
                 cellQuestion.placeholder = new ComputedUpdater(() => {
-                    if (!!rowObj.name)
-                        return rowObj.name;
-                    return rowObj.title;
+                    return rowObj.locTitle.getPlaceholder();
                 });
             }
         }
@@ -34391,10 +34701,9 @@ class PropertyGridEditorMatrix extends PropertyGridEditor {
         if (!!prop && !!prop.className) {
             var properties = Serializer.getProperties(prop.className);
             for (var i = 0; i < properties.length; i++) {
-                if (!this.isPropertyShownInList(properties[i])) {
-                    continue;
+                if (SurveyHelper.isPropertyVisible(undefined, properties[i], undefined, "list")) {
+                    res.push(properties[i].name);
                 }
-                res.push(properties[i].name);
             }
         }
         return res.length > 0 ? res : this.getDefaulColumnNames();
@@ -34402,9 +34711,6 @@ class PropertyGridEditorMatrix extends PropertyGridEditor {
     getDefaulColumnNames() {
         return [];
     }
-    isPropertyShownInList(prop) {
-        return prop.visible && prop.showMode !== "form";
-    }
     getObjTypeName() {
         return "";
     }
@@ -34759,7 +35065,7 @@ class PropertyGridEditorMatrixPages extends PropertyGridEditorMatrix {
         return "name";
     }
     getBaseValue(prop) {
-        return "page";
+        return editorLocalization.getString("ed.newPageName");
     }
     getAllowRowDragDrop(prop) { return true; }
 }
@@ -35016,14 +35322,14 @@ class PropertyGridEditorBindings extends PropertyGridEditor {
     onCreated(obj, question, prop, options) {
         question.contentPanel.fromJSON({ elements: this.getQuestions(obj, options) });
         question.valueFromDataCallback = (value) => {
-            if (!value && obj.bindings.getNames().length > 0) {
-                const result = {};
-                for (const bindingName of obj.bindings.getNames()) {
-                    result[bindingName] = obj.bindings.getValueNameByPropertyName(bindingName);
+            const keys = obj.bindings.getNames();
+            const result = {};
+            if (keys.length > 0) {
+                for (const key of keys) {
+                    result[key] = !!value ? value[key] : obj.bindings.getValueNameByPropertyName(key);
                 }
-                return result;
             }
-            return value;
+            return result;
         };
     }
     getQuestions(obj, options) {
@@ -35717,8 +36023,8 @@ class CreatorPreset extends CreatorPresetBase {
 }
 
 let Version;
-Version = `${"2.0.0"}`;
-checkLibraryVersion(`${"2.0.0"}`, "survey-creator-core");
+Version = `${"2.0.2"}`;
+checkLibraryVersion(`${"2.0.2"}`, "survey-creator-core");
 
-export { AceJsonEditorModel, ColorCalculator, CreatorAction, CreatorBase, CreatorEvent, CreatorPreset, CreatorPresetBase, CreatorPresetPropertyGrid, CreatorPresetPropertyGridDefinition, CreatorPresetTabs, CreatorPresetToolbox, CreatorPresetToolboxConfigurator, CreatorPresetToolboxDefinition, CreatorResponsivityManager, CreatorThemeModel, CreatorThemes, DEFAULT_MONITOR_DPI, DefaultFonts, DragDropSurveyElements, EditorLocalization, EmptySurveyCreatorOptions, FooterToolbarActionContainer, HEXToRGB, HSBToRGB, HueColorCalculator, ImageItemValueWrapperViewModel, ItemValueWrapperViewModel, JsonDuplicateNameError, JsonEditorBaseModel, LogicEvent, LogoImageViewModel, MatrixCellWrapperEditSurvey, MatrixCellWrapperViewModel, MenuButton, ObjType, ObjectSelector, ObjectSelectorItem, ObjectSelectorModel, PageAdorner, PageNavigatorViewModel, PagesController, PredefinedBackgroundColors, PredefinedColors, PredefinedCreatorThemes, PredefinedThemes, PropertyEditorSetupValue, PropertyGridCellsEditor, PropertyGridEditor, PropertyGridEditorBackgroundCornerRadius, PropertyGridEditorBindings, PropertyGridEditorBoolean, PropertyGridEditorCollection, PropertyGridEditorColor, PropertyGridEditorColorWithAlpha, PropertyGridEditorCondition, PropertyGridEditorDateTime, PropertyGridEditorDropdown, PropertyGridEditorExpression, PropertyGridEditorFontSettings, PropertyGridEditorHtml, PropertyGridEditorImageSize, PropertyGridEditorMatrix, PropertyGridEditorMatrixCalculatedValues, PropertyGridEditorMatrixColumns, PropertyGridEditorMatrixHtmlConditions, PropertyGridEditorMatrixItemValues, PropertyGridEditorMatrixLayoutColumns, PropertyGridEditorMatrixMultipleTypes, PropertyGridEditorMatrixMutlipleTextItems, PropertyGridEditorMatrixPages, PropertyGridEditorMatrixRateValues, PropertyGridEditorMatrixTriggers, PropertyGridEditorMatrixUrlConditions, PropertyGridEditorMatrixValidators, PropertyGridEditorNumber, PropertyGridEditorPage, PropertyGridEditorQuestion, PropertyGridEditorQuestionCarryForward, PropertyGridEditorQuestionHeader, PropertyGridEditorQuestionMaskSettings, PropertyGridEditorQuestionRestfull, PropertyGridEditorQuestionSelectBase, PropertyGridEditorQuestionValue, PropertyGridEditorSet, PropertyGridEditorShadowEffects, PropertyGridEditorSpinEdit, PropertyGridEditorString, PropertyGridEditorStringArray, PropertyGridEditorStringBase, PropertyGridEditorSwitchToggle, PropertyGridEditorText, PropertyGridEditorUndefinedBoolean, PropertyGridLinkEditor, PropertyGridModel, PropertyGridPanelValueEditor, PropertyGridRowValueEditor, PropertyGridTitleActionsCreator, PropertyGridTriggerValueEditor, PropertyGridTriggerValueInLogicEditor, PropertyGridValueEditor, PropertyGridValueEditorBase, PropertyGridViewModel, PropertyJSONGenerator, QuestionAdornerViewModel, QuestionColorModel, QuestionCommentWithResetModel, QuestionConvertMode, QuestionConverter, QuestionDropdownAdornerViewModel, QuestionEmbeddedSurveyModel, QuestionFileEditorModel, QuestionImageAdornerViewModel, QuestionLinkValueModel, QuestionRatingAdornerViewModel, QuestionSpinEditorModel, QuestionTextWithResetModel, QuestionToolbox, QuestionToolboxCategory, QuestionToolboxItem, RGBToHSB, ResetValueAdorner, ResizeManager, RowViewModel, ScrollViewModel, SearchManager, SearchManagerPropertyGrid, SearchManagerToolbox, SidebarHeaderModel, SidebarModel, SidebarPageModel, StringEditorConnector, StringEditorViewModelBase, StringItemsNavigatorBase, SurveyCreatorModel, SurveyHelper, SurveyJSON5, SurveyLogic, SurveyLogicUI, SurveyQuestionEditorDefinition, SurveyQuestionEditorPropertyDefinition, SurveyQuestionEditorTabDefinition, SurveyQuestionProperties, SurveyResultsItemModel, SurveyResultsModel, SurveySimulatorModel, SurveyTextWorker, SurveyTextWorkerError, SurveyTextWorkerJsonError, SurveyTextWorkerParserError, Switcher, TabControlModel, TabDesignerPlugin, TabDesignerViewModel, TabJsonEditorAcePlugin, TabJsonEditorBasePlugin, TabJsonEditorTextareaPlugin, TabLogicPlugin, TabTestPlugin, TabTranslationPlugin, TabbedMenuContainer, TabbedMenuItem, TestSurveyTabViewModel, TextareaJsonEditorModel, ThemeModelEditorDefinition, ThemeTabPlugin, ThemeTabViewModel, Themes, ToolbarActionContainer, ToolboxToolViewModel, Transaction, Translation, TranslationEditor, TranslationForEditor, TranslationGroup, TranslationItem, TranslationItemBase, TranslationItemString, UndoRedoAction, UndoRedoArrayAction, UndoRedoManager, UndoRedoPlugin, Version, assign, assignDefaultClasses, backgroundCornerRadiusFromCssVariable, backgroundCornerRadiusToCssVariable, calculateDragOverLocation, calculateIsEdge, calculateIsSide, capitalize, clearNewLines, colorsAreEqual, convertRgbaToString, copyCssClasses, copyObject, createBoxShadow, createBoxShadowReset, createColor, createExportCSVAction, createImportCSVAction, creatorThemeModelEditorDefinition, creatorThemeModelPropertyGridDefinition, defaultCreatorThemesOrder, defaultPropertyGridDefinition, defaultStrings, defaultThemesOrder, editableStringRendererName, editorLocalization, enStrings, findParentNode, focusFirstControl, fontsettingsFromCssVariable, fontsettingsToCssVariable, getAcceptedTypesByContentMode, getElementWrapperComponentData, getElementWrapperComponentName, getFirstNonTextElement, getItemValueWrapperComponentData, getItemValueWrapperComponentName, getLocString, getNextItemText, getNextItemValue, getNextValue, getNodesFromKoComponentInfo, getOS, getPredefinedBackgoundColorsChoices, getPredefinedColorsItemValues, getQuestionContentWrapperComponentName, getQuestionFromObj, getRGBaChannelValues, iconsV1, iconsV2, ignoreUndoRedo, imageMimeTypes, ingectAlpha, initLogicOperator, initialSettingsAllowShowEmptyTitleInDesignMode, initializeDesignTimeSurveyModel, isPanelDynamic, isPropertyVisible, isStringEditable, isTextInput, listComponentCss, editorLocalization as localization, logicCss, notShortCircuitAnd, parseBoxShadow, parseColor, parseRgbaFromString, propertyExists, propertyGridCss, registerAdorner, registerCreatorTheme, registerSurveyTheme, removeAdorners, roundTo2Decimals, saveToFileHandler, scrollElementIntoView, select, setSurveyJSONForPropertyGrid, settings, setupLocale, simulatorDevices, svgBundle, themeModelPropertyGridDefinition, toggleHovered, translationCss, trimBoxShadowValue, trimEmptyFields, undoRedoTransaction, updateBackgroundCornerRadiusJSON, updateFontSettingsJSON, updateShadowEffectsJSON, updatecoloralphaJSON, wrapTextByCurlyBraces };
+export { AceJsonEditorModel, ColorCalculator, CreatorAction, CreatorBase, CreatorEvent, CreatorPreset, CreatorPresetBase, CreatorPresetPropertyGrid, CreatorPresetPropertyGridDefinition, CreatorPresetTabs, CreatorPresetToolbox, CreatorPresetToolboxConfigurator, CreatorPresetToolboxDefinition, CreatorResponsivityManager, CreatorThemeModel, CreatorThemes, DEFAULT_MONITOR_DPI, DefaultFonts, DragDropSurveyElements, EditorLocalization, EmptySurveyCreatorOptions, FooterToolbarActionContainer, HEXToRGB, HSBToRGB, HueColorCalculator, ImageItemValueWrapperViewModel, ItemValueWrapperViewModel, JsonDuplicateNameError, JsonEditorBaseModel, LogicEvent, LogoImageViewModel, MatrixCellWrapperEditSurvey, MatrixCellWrapperViewModel, MenuButton, ObjType, ObjectSelector, ObjectSelectorItem, ObjectSelectorModel, PageAdorner, PageNavigatorViewModel, PagesController, PredefinedBackgroundColors, PredefinedColors, PredefinedCreatorThemes, PredefinedThemes, PropertyEditorSetupValue, PropertyGridCellsEditor, PropertyGridEditor, PropertyGridEditorBackgroundCornerRadius, PropertyGridEditorBindings, PropertyGridEditorBoolean, PropertyGridEditorCollection, PropertyGridEditorColor, PropertyGridEditorColorWithAlpha, PropertyGridEditorCondition, PropertyGridEditorDateTime, PropertyGridEditorDropdown, PropertyGridEditorExpression, PropertyGridEditorFontSettings, PropertyGridEditorHtml, PropertyGridEditorImageSize, PropertyGridEditorMatrix, PropertyGridEditorMatrixCalculatedValues, PropertyGridEditorMatrixColumns, PropertyGridEditorMatrixHtmlConditions, PropertyGridEditorMatrixItemValues, PropertyGridEditorMatrixLayoutColumns, PropertyGridEditorMatrixMultipleTypes, PropertyGridEditorMatrixMutlipleTextItems, PropertyGridEditorMatrixPages, PropertyGridEditorMatrixRateValues, PropertyGridEditorMatrixTriggers, PropertyGridEditorMatrixUrlConditions, PropertyGridEditorMatrixValidators, PropertyGridEditorNumber, PropertyGridEditorPage, PropertyGridEditorQuestion, PropertyGridEditorQuestionCarryForward, PropertyGridEditorQuestionHeader, PropertyGridEditorQuestionMaskSettings, PropertyGridEditorQuestionRestfull, PropertyGridEditorQuestionSelectBase, PropertyGridEditorQuestionValue, PropertyGridEditorSet, PropertyGridEditorShadowEffects, PropertyGridEditorSpinEdit, PropertyGridEditorString, PropertyGridEditorStringArray, PropertyGridEditorStringBase, PropertyGridEditorSwitchToggle, PropertyGridEditorText, PropertyGridEditorUndefinedBoolean, PropertyGridLinkEditor, PropertyGridModel, PropertyGridPanelValueEditor, PropertyGridRowValueEditor, PropertyGridTitleActionsCreator, PropertyGridTriggerValueEditor, PropertyGridTriggerValueInLogicEditor, PropertyGridValueEditor, PropertyGridValueEditorBase, PropertyGridViewModel, PropertyJSONGenerator, QuestionAdornerViewModel, QuestionColorModel, QuestionCommentWithResetModel, QuestionConvertMode, QuestionConverter, QuestionDropdownAdornerViewModel, QuestionEmbeddedSurveyModel, QuestionFileEditorModel, QuestionImageAdornerViewModel, QuestionLinkValueModel, QuestionRatingAdornerViewModel, QuestionSpinEditorModel, QuestionTextWithResetModel, QuestionToolbox, QuestionToolboxCategory, QuestionToolboxItem, RGBToHSB, ResetValueAdorner, ResizeManager, RowViewModel, ScrollViewModel, SearchManager, SearchManagerPropertyGrid, SearchManagerToolbox, SidebarHeaderModel, SidebarModel, SidebarPageModel, StringEditorConnector, StringEditorViewModelBase, StringItemsNavigatorBase, SurveyCreatorModel, SurveyHelper, SurveyJSON5, SurveyLogic, SurveyLogicUI, SurveyQuestionEditorDefinition, SurveyQuestionEditorPropertyDefinition, SurveyQuestionEditorTabDefinition, SurveyQuestionProperties, SurveyResultsItemModel, SurveyResultsModel, SurveySimulatorModel, SurveyTextWorker, SurveyTextWorkerError, SurveyTextWorkerJsonError, SurveyTextWorkerParserError, Switcher, TabControlModel, TabDesignerPlugin, TabDesignerViewModel, TabJsonEditorAcePlugin, TabJsonEditorBasePlugin, TabJsonEditorTextareaPlugin, TabLogicPlugin, TabTestPlugin, TabTranslationPlugin, TabbedMenuContainer, TabbedMenuItem, TestSurveyTabViewModel, TextareaJsonEditorModel, ThemeModelEditorDefinition, ThemeTabPlugin, ThemeTabViewModel, Themes, ToolbarActionContainer, ToolboxToolViewModel, Transaction, Translation, TranslationEditor, TranslationForEditor, TranslationGroup, TranslationItem, TranslationItemBase, TranslationItemString, UndoRedoAction, UndoRedoArrayAction, UndoRedoManager, UndoRedoPlugin, Version, assign, assignDefaultClasses, backgroundCornerRadiusFromCssVariable, backgroundCornerRadiusToCssVariable, calculateDragOverLocation, calculateIsEdge, calculateIsSide, capitalize, clearNewLines, colorsAreEqual, convertRgbaToString, copyCssClasses, copyObject, createBoxShadow, createBoxShadowReset, createColor, createExportCSVAction, createImportCSVAction, creatorThemeModelEditorDefinition, creatorThemeModelPropertyGridDefinition, defaultCreatorThemesOrder, defaultPropertyGridDefinition, defaultStrings, defaultThemesOrder, editableStringRendererName, editorLocalization, enStrings, findParentNode, focusFirstControl, fontsettingsFromCssVariable, fontsettingsToCssVariable, getAcceptedTypesByContentMode, getElementWrapperComponentData, getElementWrapperComponentName, getFirstNonTextElement, getItemValueWrapperComponentData, getItemValueWrapperComponentName, getLocString, getLocaleStrings, getNextItemText, getNextItemValue, getNextValue, getNodesFromKoComponentInfo, getOS, getPredefinedBackgoundColorsChoices, getPredefinedColorsItemValues, getQuestionContentWrapperComponentName, getQuestionFromObj, getRGBaChannelValues, iconsV1, iconsV2, ignoreUndoRedo, imageMimeTypes, ingectAlpha, initLogicOperator, initialSettingsAllowShowEmptyTitleInDesignMode, initializeDesignTimeSurveyModel, isStringEditable, isTextInput, listComponentCss, editorLocalization as localization, logicCss, notShortCircuitAnd, parseBoxShadow, parseColor, parseRgbaFromString, propertyGridCss, registerAdorner, registerCreatorTheme, registerSurveyTheme, removeAdorners, roundTo2Decimals, saveToFileHandler, scrollElementIntoView, select, setSurveyJSONForPropertyGrid, settings, setupLocale, simulatorDevices, svgBundle, themeModelPropertyGridDefinition, toggleHovered, translationCss, trimBoxShadowValue, trimEmptyFields, undoRedoTransaction, updateBackgroundCornerRadiusJSON, updateFontSettingsJSON, updateShadowEffectsJSON, updatecoloralphaJSON, wrapTextByCurlyBraces };
 //# sourceMappingURL=survey-creator-core.js.map