survey-creator-core 1.12.2 → 1.12.4

package/survey-creator-core.js

@@ -1,5 +1,5 @@
 /*!
- * SurveyJS Creator v1.12.2
+ * SurveyJS Creator v1.12.4
  * (c) 2015-2024 Devsoft Baltic OÜ - http://surveyjs.io/
  * Github: https://github.com/surveyjs/survey-creator
  * License: https://surveyjs.io/Licenses#SurveyCreator
@@ -470,6 +470,19 @@ __webpack_require__.r(__webpack_exports__);
 // extracted by mini-css-extract-plugin
 
 
+/***/ }),
+
+/***/ "./src/custom-questions/boolean-switch.scss":
+/*!**************************************************!*\
+  !*** ./src/custom-questions/boolean-switch.scss ***!
+  \**************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+// extracted by mini-css-extract-plugin
+
+
 /***/ }),
 
 /***/ "./src/property-grid-theme/property-grid.scss":
@@ -1815,6 +1828,7 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
+
 var SurveyElementActionContainer = /** @class */ (function (_super) {
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__extends)(SurveyElementActionContainer, _super);
     function SurveyElementActionContainer() {
@@ -1896,6 +1910,9 @@ var SurveyElementAdornerBase = /** @class */ (function (_super) {
         _this = _super.call(this) || this;
         _this.creator = creator;
         _this.surveyElement = surveyElement;
+        _this.animationCollapsed = new survey_core__WEBPACK_IMPORTED_MODULE_1__.AnimationBoolean(_this.getExpandCollapseAnimationOptions(), function (val) {
+            _this._renderedCollapsed = !val;
+        }, function () { return !_this.renderedCollapsed; });
         _this.draggedIn = false;
         _this.designerStateManager = (_a = creator.getPlugin("designer")) === null || _a === void 0 ? void 0 : _a.designerStateManager;
         (_b = _this.designerStateManager) === null || _b === void 0 ? void 0 : _b.initForElement(surveyElement);
@@ -1926,12 +1943,7 @@ var SurveyElementAdornerBase = /** @class */ (function (_super) {
         _this.creator.sidebar.onPropertyChanged.add(_this.sidebarFlyoutModeChangedFunc);
         _this.setShowAddQuestionButton(true);
         _this.expandCollapseAction.visible = _this.allowExpandCollapse;
-        _this.creator.onSurfaceToolbarActionExecuted.add(function (_, options) {
-            if (options.action.id == "collapseAll")
-                _this.collapsed = true;
-            if (options.action.id == "expandAll")
-                _this.collapsed = false;
-        });
+        _this.creator.expandCollapseManager.add(_this);
         return _this;
     }
     Object.defineProperty(SurveyElementAdornerBase.prototype, "dragInsideCollapsedContainer", {
@@ -1941,6 +1953,101 @@ var SurveyElementAdornerBase = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    SurveyElementAdornerBase.prototype.getAnimatedElement = function () {
+        return null;
+    };
+    SurveyElementAdornerBase.prototype.getInnerAnimatedElements = function () {
+        return [];
+    };
+    SurveyElementAdornerBase.prototype.getCollapsingCssClassName = function () {
+        return "svc-question--leave";
+    };
+    SurveyElementAdornerBase.prototype.getExpandingCssClassName = function () {
+        return "svc-question--enter";
+    };
+    SurveyElementAdornerBase.prototype.hover = function (e, element) {
+        var _this = this;
+        var processedFlagName = "__svc_question_processed";
+        if (!e[processedFlagName] && e.type === "mouseover") {
+            if (!this.hoverTimeout) {
+                this.hoverTimeout = setTimeout(function () {
+                    _this.isHovered = true;
+                    _this.hoverTimeout = undefined;
+                }, this.creator.pageHoverDelay);
+            }
+            e[processedFlagName] = true;
+        }
+        else {
+            clearTimeout(this.hoverTimeout);
+            this.hoverTimeout = undefined;
+            this.isHovered = false;
+        }
+    };
+    SurveyElementAdornerBase.prototype.getExpandCollapseAnimationOptions = function () {
+        var _this = this;
+        var beforeRunAnimation = function (el, animatingClassName) {
+            (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.prepareElementForVerticalAnimation)(el);
+            var innerAnimatedElements = _this.getInnerAnimatedElements();
+            innerAnimatedElements.forEach(function (elem) {
+                (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.prepareElementForVerticalAnimation)(elem);
+            });
+            innerAnimatedElements.forEach(function (elem) {
+                elem.classList.add(animatingClassName);
+            });
+        };
+        var afterRunAnimation = function (el, animatingClassName) {
+            _this.expandCollapseAnimationRunning = false;
+            (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.cleanHtmlElementAfterAnimation)(el);
+            var innerAnimatedElements = _this.getInnerAnimatedElements();
+            innerAnimatedElements.forEach(function (elem) {
+                (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.cleanHtmlElementAfterAnimation)(elem);
+            });
+            innerAnimatedElements.forEach(function (elem) {
+                elem.classList.remove(animatingClassName);
+            });
+        };
+        return {
+            getRerenderEvent: function () { return _this.onElementRerendered; },
+            getEnterOptions: function () {
+                var className = _this.getExpandingCssClassName();
+                return {
+                    cssClass: className,
+                    onBeforeRunAnimation: function (el) {
+                        beforeRunAnimation(el, className);
+                    },
+                    onAfterRunAnimation: function (el) {
+                        afterRunAnimation(el, className);
+                    },
+                };
+            },
+            getLeaveOptions: function () {
+                var className = _this.getCollapsingCssClassName();
+                return {
+                    cssClass: className,
+                    onBeforeRunAnimation: function (el) {
+                        beforeRunAnimation(el, className);
+                    },
+                    onAfterRunAnimation: function (el) {
+                        afterRunAnimation(el, className);
+                    },
+                };
+            },
+            getAnimatedElement: function () { return _this.getAnimatedElement(); },
+            isAnimationEnabled: function () { return _this.animationAllowed; }
+        };
+    };
+    Object.defineProperty(SurveyElementAdornerBase.prototype, "renderedCollapsed", {
+        get: function () {
+            return !!this._renderedCollapsed;
+        },
+        set: function (val) {
+            if (this.animationAllowed)
+                this.expandCollapseAnimationRunning = true;
+            this.animationCollapsed.sync(!val);
+        },
+        enumerable: false,
+        configurable: true
+    });
     SurveyElementAdornerBase.prototype.createActionContainer = function () {
         var actionContainer = new SurveyElementActionContainer();
         actionContainer.dotsItem.iconSize = 16;
@@ -2011,7 +2118,9 @@ var SurveyElementAdornerBase = /** @class */ (function (_super) {
     };
     SurveyElementAdornerBase.prototype.dispose = function () {
         _super.prototype.dispose.call(this);
+        this.rootElement = undefined;
         this.detachElement(this.surveyElement);
+        this.creator.expandCollapseManager.remove(this);
         if (!this.actionContainer.isDisposed) {
             this.actionContainer.dispose();
         }
@@ -2029,9 +2138,12 @@ var SurveyElementAdornerBase = /** @class */ (function (_super) {
             return;
         this.updateElementAllowOptions(this.creator.getElementAllowOperations(this.surveyElement), this.isOperationsAllow());
     };
+    SurveyElementAdornerBase.prototype.getAllowExpandCollapse = function (options) {
+        return this.creator.expandCollapseButtonVisibility != "never" && (options.allowExpandCollapse == undefined || !!options.allowExpandCollapse);
+    };
     SurveyElementAdornerBase.prototype.updateElementAllowOptions = function (options, operationsAllow) {
         this.allowDragging = operationsAllow && options.allowDragging;
-        this.allowExpandCollapse = this.creator.expandCollapseButtonVisibility != "never" && (options.allowExpandCollapse == undefined || !!options.allowExpandCollapse);
+        this.allowExpandCollapse = this.getAllowExpandCollapse(options);
         this.allowEditOption = (options.allowEdit == undefined || !!options.allowEdit);
         this.updateActionVisibility("delete", operationsAllow && options.allowDelete);
         this.updateActionVisibility("duplicate", operationsAllow && options.allowCopy);
@@ -2133,9 +2245,15 @@ var SurveyElementAdornerBase = /** @class */ (function (_super) {
     SurveyElementAdornerBase.prototype.delete = function () {
         this.creator.deleteElement(this.surveyElement);
     };
+    SurveyElementAdornerBase.prototype.getCss = function () {
+        return new survey_core__WEBPACK_IMPORTED_MODULE_1__.CssClassBuilder().append("svc-hovered svc-hovered-ready", this.isHovered).toString();
+    };
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)({ defaultValue: true })
     ], SurveyElementAdornerBase.prototype, "allowDragging", void 0);
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)({ defaultValue: false })
+    ], SurveyElementAdornerBase.prototype, "expandCollapseAnimationRunning", void 0);
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)({ defaultValue: true })
     ], SurveyElementAdornerBase.prototype, "allowExpandCollapse", void 0);
@@ -2155,7 +2273,13 @@ var SurveyElementAdornerBase = /** @class */ (function (_super) {
     ], SurveyElementAdornerBase.prototype, "collapsed", void 0);
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
-    ], SurveyElementAdornerBase.prototype, "renderedCollapsed", void 0);
+    ], SurveyElementAdornerBase.prototype, "_renderedCollapsed", void 0);
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
+    ], SurveyElementAdornerBase.prototype, "isAnimationRunningCollapsed", void 0);
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)({ defaultValue: false })
+    ], SurveyElementAdornerBase.prototype, "isHovered", void 0);
     return SurveyElementAdornerBase;
 }(survey_core__WEBPACK_IMPORTED_MODULE_1__.Base));
 
@@ -3464,11 +3588,9 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! survey-core */ "survey-core");
 /* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(survey_core__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _action_container_view_model__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./action-container-view-model */ "./src/components/action-container-view-model.ts");
-/* harmony import */ var _utils_utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../utils/utils */ "./src/utils/utils.ts");
-/* harmony import */ var _editorLocalization__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../editorLocalization */ "./src/editorLocalization.ts");
-/* harmony import */ var _survey_helper__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../survey-helper */ "./src/survey-helper.ts");
-/* harmony import */ var _creator_settings__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../creator-settings */ "./src/creator-settings.ts");
-
+/* harmony import */ var _editorLocalization__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../editorLocalization */ "./src/editorLocalization.ts");
+/* harmony import */ var _survey_helper__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../survey-helper */ "./src/survey-helper.ts");
+/* harmony import */ var _creator_settings__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../creator-settings */ "./src/creator-settings.ts");
 
 
 
@@ -3486,7 +3608,7 @@ var PageAdorner = /** @class */ (function (_super) {
             if (_this.isGhost) {
                 var addedPage = !!_this.creator.addPage(currentPage, selectCurrentPage, function () {
                     currentPage.unRegisterFunctionOnPropertiesValueChanged(["title", "description"], "add_ghost");
-                    currentPage.name = _survey_helper__WEBPACK_IMPORTED_MODULE_5__.SurveyHelper.getNewPageName(_this.creator.survey.pages);
+                    currentPage.name = _survey_helper__WEBPACK_IMPORTED_MODULE_4__.SurveyHelper.getNewPageName(_this.creator.survey.pages);
                     return true;
                 });
                 if (addedPage) {
@@ -3501,7 +3623,7 @@ var PageAdorner = /** @class */ (function (_super) {
             _this.creator.addNewQuestionInPage(function (type) {
                 _this.addGhostPage(false);
                 _this.creator.survey.currentPage = _this.page;
-            }, null, type || _this.currentAddQuestionType || _creator_settings__WEBPACK_IMPORTED_MODULE_6__.settings.designer.defaultAddQuestionType);
+            }, null, type || _this.currentAddQuestionType || _creator_settings__WEBPACK_IMPORTED_MODULE_5__.settings.designer.defaultAddQuestionType);
         };
         _this.actionContainer.sizeMode = "small";
         if (_this.isGhost)
@@ -3533,6 +3655,9 @@ var PageAdorner = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    PageAdorner.prototype.getAllowExpandCollapse = function (options) {
+        return !this.isGhost && _super.prototype.getAllowExpandCollapse.call(this, options);
+    };
     PageAdorner.prototype.attachElement = function (surveyElement) {
         var _this = this;
         _super.prototype.attachElement.call(this, surveyElement);
@@ -3580,8 +3705,8 @@ var PageAdorner = /** @class */ (function (_super) {
         if (isSelected && this.creator.pageEditMode === "bypage") {
             this.setSurveyElement(this.creator.selectedElement);
         }
-        if (isSelected && !!this.onPageSelectedCallback) {
-            this.onPageSelectedCallback();
+        if (isSelected) {
+            this.onPageSelected();
         }
     };
     PageAdorner.prototype.patchPageForDragDrop = function (page, addGhostPage) {
@@ -3611,8 +3736,8 @@ var PageAdorner = /** @class */ (function (_super) {
     Object.defineProperty(PageAdorner.prototype, "placeholderText", {
         get: function () {
             if (this.creator.isMobileView)
-                return (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_4__.getLocString)("ed.pagePlaceHolderMobile");
-            return (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_4__.getLocString)("ed.pagePlaceHolder");
+                return (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_3__.getLocString)("ed.pagePlaceHolderMobile");
+            return (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_3__.getLocString)("ed.pagePlaceHolder");
         },
         enumerable: false,
         configurable: true
@@ -3637,9 +3762,7 @@ var PageAdorner = /** @class */ (function (_super) {
         if (!model.isGhost) {
             if (model.creator.pageEditMode !== "single") {
                 model.creator.selectElement(model.page, undefined, false);
-                if (!!this.onPageSelectedCallback) {
-                    this.onPageSelectedCallback();
-                }
+                this.onPageSelected();
             }
             else {
                 model.creator.selectElement(model.creator.survey, undefined, false);
@@ -3650,7 +3773,7 @@ var PageAdorner = /** @class */ (function (_super) {
     };
     Object.defineProperty(PageAdorner.prototype, "css", {
         get: function () {
-            var result = "";
+            var result = _super.prototype.getCss.call(this);
             if (!!this.dragTypeOverMe && this.showPlaceholder) {
                 result = "svc-question__content--drag-over-inside";
             }
@@ -3667,23 +3790,24 @@ var PageAdorner = /** @class */ (function (_super) {
             else {
                 this.dragOut();
             }
+            if (this.allowExpandCollapse) {
+                result += (" svc-page__content--collapse-" + this.creator.expandCollapseButtonVisibility);
+                if (this.renderedCollapsed)
+                    result += (" svc-page__content--collapsed");
+                if (this.expandCollapseAnimationRunning)
+                    result += (" svc-page__content--animation-running");
+            }
             if (this.isGhost) {
                 return result + " svc-page__content--new";
             }
             if (this.creator.isElementSelected(this.page)) {
                 result += " svc-page__content--selected";
             }
-            result += (" svc-page__content--collapse-" + this.creator.expandCollapseButtonVisibility);
-            if (this.renderedCollapsed)
-                result += (" svc-page__content--collapsed");
             return result.trim();
         },
         enumerable: false,
         configurable: true
     });
-    PageAdorner.prototype.hover = function (event, element) {
-        (0,_utils_utils__WEBPACK_IMPORTED_MODULE_3__.toggleHovered)(event, element, this.creator.pageHoverDelay);
-    };
     PageAdorner.prototype.hoverStopper = function (event, element) {
         event["__svc_question_processed"] = true;
     };
@@ -3727,6 +3851,26 @@ var PageAdorner = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    PageAdorner.prototype.getAnimatedElement = function () {
+        var _a;
+        var cssClasses = this.surveyElement.cssClasses.page;
+        if (cssClasses === null || cssClasses === void 0 ? void 0 : cssClasses.description) {
+            return (_a = this.rootElement) === null || _a === void 0 ? void 0 : _a.querySelector(":scope ".concat((0,survey_core__WEBPACK_IMPORTED_MODULE_1__.classesToSelector)(cssClasses.description)));
+        }
+        return null;
+    };
+    PageAdorner.prototype.getInnerAnimatedElements = function () {
+        var _a;
+        var cssClasses = this.surveyElement.cssClasses;
+        if (cssClasses.pageRow)
+            return [].slice.call((_a = this.rootElement) === null || _a === void 0 ? void 0 : _a.querySelectorAll(":scope .svc-page__footer, :scope ".concat((0,survey_core__WEBPACK_IMPORTED_MODULE_1__.classesToSelector)(this.surveyElement.cssRoot), " > .svc-row")));
+        return null;
+    };
+    PageAdorner.prototype.onPageSelected = function () {
+        if (this.rootElement) {
+            _survey_helper__WEBPACK_IMPORTED_MODULE_4__.SurveyHelper.scrollIntoViewIfNeeded(this.rootElement);
+        }
+    };
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)({ defaultValue: false })
     ], PageAdorner.prototype, "isSelected", void 0);
@@ -3878,9 +4022,8 @@ __webpack_require__.r(__webpack_exports__);
 __webpack_require__(/*! ./question-image.scss */ "./src/components/question-image.scss");
 var QuestionImageAdornerViewModel = /** @class */ (function (_super) {
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__extends)(QuestionImageAdornerViewModel, _super);
-    function QuestionImageAdornerViewModel(creator, surveyElement, templateData, questionRoot) {
+    function QuestionImageAdornerViewModel(creator, surveyElement, templateData) {
         var _this = _super.call(this, creator, surveyElement, templateData) || this;
-        _this.questionRoot = questionRoot;
         _this.imageLinkValueChangedHandler = function () {
             _this.isEmptyImageLink = !_this.question.imageLink;
             _this.filePresentationModel.value = null;
@@ -3917,7 +4060,7 @@ var QuestionImageAdornerViewModel = /** @class */ (function (_super) {
         });
     };
     QuestionImageAdornerViewModel.prototype.chooseFile = function (model) {
-        var fileInput = model.questionRoot.getElementsByClassName("svc-choose-file-input")[0];
+        var fileInput = model.rootElement.getElementsByClassName("svc-choose-file-input")[0];
         var context = { element: model.question, elementType: model.question.getType(), propertyName: "imageLink" };
         model.creator.chooseFiles(fileInput, function (files) {
             model.isUploading = true;
@@ -3964,6 +4107,15 @@ var QuestionImageAdornerViewModel = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    QuestionImageAdornerViewModel.prototype.getAnimatedElement = function () {
+        if (this.isEmptyImageLink) {
+            var cssClasses = this.filePresentationModel.cssClasses;
+            if (cssClasses.root) {
+                return this.surveyElement.getWrapperElement().querySelector(":scope ".concat((0,survey_core__WEBPACK_IMPORTED_MODULE_1__.classesToSelector)(cssClasses.root)));
+            }
+        }
+        return _super.prototype.getAnimatedElement.call(this);
+    };
     QuestionImageAdornerViewModel.prototype.css = function () {
         return new survey_core__WEBPACK_IMPORTED_MODULE_1__.CssClassBuilder()
             .append(_super.prototype.css.call(this))
@@ -3973,7 +4125,6 @@ var QuestionImageAdornerViewModel = /** @class */ (function (_super) {
         this.surveyElement.unRegisterFunctionOnPropertyValueChanged("imageLink", "imageLinkValueChanged");
         this.surveyElement.locImageLink.onStringChanged.remove(this.imageLinkValueChangedHandler);
         _super.prototype.dispose.call(this);
-        this.questionRoot = undefined;
     };
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)({ defaultValue: false })
@@ -4212,7 +4363,6 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _action_container_view_model__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./action-container-view-model */ "./src/components/action-container-view-model.ts");
 /* harmony import */ var _creator_settings__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../creator-settings */ "./src/creator-settings.ts");
 /* harmony import */ var _string_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./string-editor */ "./src/components/string-editor.ts");
-/* harmony import */ var _toolbox__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../toolbox */ "./src/toolbox.ts");
 
 
 
@@ -4222,7 +4372,6 @@ __webpack_require__.r(__webpack_exports__);
 __webpack_require__(/*! ./question.scss */ "./src/components/question.scss");
 
 
-
 var QuestionAdornerViewModel = /** @class */ (function (_super) {
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__extends)(QuestionAdornerViewModel, _super);
     function QuestionAdornerViewModel(creator, surveyElement, templateData) {
@@ -4285,6 +4434,10 @@ var QuestionAdornerViewModel = /** @class */ (function (_super) {
     QuestionAdornerViewModel.prototype.rootCss = function () {
         var isStartWithNewLine = this.surveyElement.isQuestion && !this.surveyElement.startWithNewLine;
         return new survey_core__WEBPACK_IMPORTED_MODULE_1__.CssClassBuilder()
+            .append(_super.prototype.getCss.call(this))
+            .append("svc-question__adorner")
+            .append("svc-question__adorner--selected", !!this.creator.isElementSelected(this.surveyElement))
+            .append("svc-question__adorner--collapsed", this.renderedCollapsed)
             .append("svc-question__adorner--start-with-new-line", isStartWithNewLine)
             .append("svc-question__adorner--collapse-" + this.creator.expandCollapseButtonVisibility, true).toString();
     };
@@ -4305,6 +4458,12 @@ var QuestionAdornerViewModel = /** @class */ (function (_super) {
         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";
         }
@@ -4337,6 +4496,41 @@ var QuestionAdornerViewModel = /** @class */ (function (_super) {
         }
         return result;
     };
+    Object.defineProperty(QuestionAdornerViewModel.prototype, "isTitleLeft", {
+        get: function () {
+            return (!this.surveyElement.isPanel && this.surveyElement.getTitleLocation() === "left");
+        },
+        enumerable: false,
+        configurable: true
+    });
+    QuestionAdornerViewModel.prototype.getAnimatedElement = function () {
+        var _a, _b;
+        var cssClasses = this.surveyElement.isPanel ? this.surveyElement.cssClasses.panel : this.surveyElement.cssClasses;
+        var cssContent = cssClasses.content;
+        if (this.surveyElement.isDescendantOf("rating")) {
+            cssContent = "svc-rating-question-content";
+        }
+        if (this.isTitleLeft) {
+            return (_a = this.rootElement) === null || _a === void 0 ? void 0 : _a.querySelector(":scope ".concat((0,survey_core__WEBPACK_IMPORTED_MODULE_1__.classesToSelector)(this.surveyElement.getRootCss())));
+        }
+        if (cssContent) {
+            return (_b = this.rootElement) === null || _b === void 0 ? void 0 : _b.querySelector(":scope ".concat((0,survey_core__WEBPACK_IMPORTED_MODULE_1__.classesToSelector)(cssContent)));
+        }
+        return null;
+    };
+    QuestionAdornerViewModel.prototype.getInnerAnimatedElements = function () {
+        var _a;
+        var cssRoot = this.surveyElement.isPanel ? this.surveyElement.getContainerCss() : this.surveyElement.getRootCss();
+        var cssDescription = this.surveyElement.cssDescription;
+        var selectorArray = [
+            ":scope > .svc-question__content > *:not(.svc-question__drag-area):not(".concat((0,survey_core__WEBPACK_IMPORTED_MODULE_1__.classesToSelector)(cssRoot), ")"),
+        ];
+        if (!this.isTitleLeft && cssDescription)
+            selectorArray.push(":scope ".concat((0,survey_core__WEBPACK_IMPORTED_MODULE_1__.classesToSelector)(cssDescription)));
+        var res = [].slice.call((_a = this.rootElement) === null || _a === void 0 ? void 0 : _a.querySelectorAll(selectorArray.join(",")));
+        res.push(this.rootElement);
+        return res;
+    };
     QuestionAdornerViewModel.prototype.expandWithDragIn = function () {
         _super.prototype.expandWithDragIn.call(this);
         this.element.dragTypeOverMe = null;
@@ -4389,7 +4583,7 @@ var QuestionAdornerViewModel = /** @class */ (function (_super) {
     });
     Object.defineProperty(QuestionAdornerViewModel.prototype, "cssCollapsedHiddenHeader", {
         get: function () {
-            return this.element.cssHeader + " svc-question__header--hidden";
+            return this.element.cssHeader + " svc-element__header--hidden";
         },
         enumerable: false,
         configurable: true
@@ -4465,8 +4659,7 @@ var QuestionAdornerViewModel = /** @class */ (function (_super) {
         if (!this.surveyElement.isInteractiveDesignElement) {
             return;
         }
-        //this.updateActionsProperties();
-        (0,_utils_utils__WEBPACK_IMPORTED_MODULE_4__.toggleHovered)(event, element, this.creator.pageHoverDelay);
+        _super.prototype.hover.call(this, event, element);
     };
     QuestionAdornerViewModel.prototype.updateActionsProperties = function () {
         if (this.isDisposed)
@@ -4519,6 +4712,13 @@ var QuestionAdornerViewModel = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(QuestionAdornerViewModel.prototype, "showHiddenTitle", {
+        get: function () {
+            return (!this.element.hasTitle || this.isTitleLeft) && this.element.isInteractiveDesignElement;
+        },
+        enumerable: false,
+        configurable: true
+    });
     Object.defineProperty(QuestionAdornerViewModel.prototype, "placeholderText", {
         get: function () {
             if (this.surveyElement instanceof survey_core__WEBPACK_IMPORTED_MODULE_1__.QuestionHtmlModel) {
@@ -4573,20 +4773,11 @@ var QuestionAdornerViewModel = /** @class */ (function (_super) {
     };
     QuestionAdornerViewModel.prototype.buildDefaultJsonMap = function (availableItems) {
         var defaultJsons = {};
-        function cleanDefaultsFromJson(type, toolboxItem) {
-            var question = survey_core__WEBPACK_IMPORTED_MODULE_1__.QuestionFactory.Instance.createQuestion(type, "question");
-            if (!question)
-                return toolboxItem.json;
-            question.fromJSON(toolboxItem.json);
-            var json = question.toJSON();
-            delete json.name;
-            return json;
-        }
         function addItemJson(toolboxItem) {
             var _a;
             var type = ((_a = toolboxItem.json) === null || _a === void 0 ? void 0 : _a.type) || toolboxItem.id;
             if (toolboxItem.json) {
-                var json = cleanDefaultsFromJson(type, toolboxItem);
+                var json = toolboxItem.json;
                 if (!defaultJsons[type])
                     defaultJsons[type] = [];
                 defaultJsons[type].push(json);
@@ -4600,38 +4791,42 @@ var QuestionAdornerViewModel = /** @class */ (function (_super) {
         });
         return defaultJsons;
     };
-    QuestionAdornerViewModel.prototype.getConvertToTypesActions = function (parentAction) {
+    QuestionAdornerViewModel.prototype.convertQuestion = function (questionType, json, defaultJsons) {
+        var _this = this;
+        var type = (json === null || json === void 0 ? void 0 : json.type) || questionType;
+        var newJson = {};
+        (defaultJsons[type] || []).forEach(function (djson) {
+            if (_this.jsonIsCorresponded(djson)) {
+                newJson = (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__assign)({}, json);
+                var objJson_1 = _this.element.toJSON();
+                var cleanJson_1 = _this.cleanDefaultsFromJson(type, djson);
+                Object.keys(djson).forEach(function (p) {
+                    if (p != "type" && !newJson[p])
+                        newJson[p] = undefined;
+                });
+                Object.keys(json || {}).forEach(function (p) {
+                    if (p != "type" && !(!objJson_1[p] || cleanJson_1[p]))
+                        newJson[p] = undefined;
+                });
+            }
+        });
+        this.creator.convertCurrentQuestion(type, newJson);
+    };
+    QuestionAdornerViewModel.prototype.getConvertToTypesActions = function () {
         var _this = this;
         var availableItems = this.getConvertToTypes();
         var defaultJsons = this.buildDefaultJsonMap(availableItems);
-        var res = [];
+        var newItems = [];
         var lastItem = null;
         availableItems.forEach(function (item) {
             var needSeparator = lastItem && item.category != lastItem.category;
             var action = _this.creator.createIActionBarItemByClass(item, needSeparator, function (questionType, json) {
-                var type = (json === null || json === void 0 ? void 0 : json.type) || questionType;
-                var newJson = {};
-                (defaultJsons[type] || []).forEach(function (djson) {
-                    if (_this.jsonIsCorresponded(djson)) {
-                        newJson = (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__assign)({}, json);
-                        var objJson_1 = _this.element.toJSON();
-                        Object.keys(djson).forEach(function (p) {
-                            if (p != "type" && !newJson[p])
-                                newJson[p] = undefined;
-                        });
-                        Object.keys(json).forEach(function (p) {
-                            if (p != "type" && !(!objJson_1[p] || djson[p]))
-                                newJson[p] = undefined;
-                        });
-                    }
-                });
-                _this.creator.convertCurrentQuestion(type, newJson);
-                parentAction === null || parentAction === void 0 ? void 0 : parentAction.hidePopup();
+                _this.convertQuestion(questionType, json, defaultJsons);
             });
             lastItem = item;
-            res.push(action);
+            newItems.push(action);
         });
-        return res;
+        return newItems;
     };
     Object.defineProperty(QuestionAdornerViewModel.prototype, "currentType", {
         get: function () {
@@ -4657,32 +4852,7 @@ var QuestionAdornerViewModel = /** @class */ (function (_super) {
             actionData: actionData,
             items: actions,
             updateListModel: function (listModel) {
-                var newItems = _this.getConvertToTypesActions(newAction);
-                listModel.setItems(newItems);
-                listModel.selectedItem = _this.getSelectedItem(newItems, _this.currentType);
-                newItems.forEach(function (action) {
-                    var _a;
-                    var toolboxItem = _this.creator.toolbox.getItemByName(action.id);
-                    if (((_a = action.items) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-                        var selectedSubItem_1 = undefined;
-                        action.items.forEach(function (item) {
-                            var elementType = _this.element.getType();
-                            var toolboxSubitem = toolboxItem.getSubitemByName(item.id);
-                            var json = toolboxSubitem.json || {};
-                            if (item.id == elementType || json.type == elementType) {
-                                if (!listModel.selectedItem)
-                                    selectedSubItem_1 = item;
-                                if (_this.jsonIsCorresponded(json))
-                                    selectedSubItem_1 = item;
-                            }
-                        });
-                        if (selectedSubItem_1) {
-                            var _listModel = action.popupModel.contentComponentData.model;
-                            _listModel.selectedItem = selectedSubItem_1;
-                            listModel.selectedItem = action;
-                        }
-                    }
-                });
+                _this.updateQuestionTypeOrSubtypeListModel(listModel, false);
             }
         });
         newAction.iconName = new survey_core__WEBPACK_IMPORTED_MODULE_1__.ComputedUpdater(function () {
@@ -4698,61 +4868,127 @@ var QuestionAdornerViewModel = /** @class */ (function (_super) {
         newAction.disableHide = true;
         return newAction;
     };
-    QuestionAdornerViewModel.prototype.jsonIsCorresponded = function (json) {
+    QuestionAdornerViewModel.prototype.jsonsAreCompatible = function (objJson, json) {
+        var _this = this;
         var jsonIsCorresponded = true;
-        var objJson = this.element.toJSON();
         Object.keys(json).forEach(function (p) {
-            if (p != "type" && !survey_core__WEBPACK_IMPORTED_MODULE_1__.Helpers.isTwoValueEquals(json[p], objJson[p]))
+            var propertyValue = objJson[p] === undefined ? _this.element.getDefaultPropertyValue(p) : objJson[p];
+            if (p != "type" && !survey_core__WEBPACK_IMPORTED_MODULE_1__.Helpers.isTwoValueEquals(json[p], propertyValue))
                 jsonIsCorresponded = false;
         });
         return jsonIsCorresponded;
     };
+    QuestionAdornerViewModel.prototype.jsonIsCorresponded = function (json) {
+        return this.jsonsAreCompatible(this.element.toJSON(), json);
+    };
+    QuestionAdornerViewModel.prototype.toolboxItemIsCorresponded = function (toolboxItem, someItemSelectedAlready) {
+        var elementType = this.element.getType();
+        var json = toolboxItem.json;
+        if (toolboxItem.id == elementType || toolboxItem.json.type == elementType) {
+            return !someItemSelectedAlready || this.jsonIsCorresponded(json);
+        }
+    };
+    QuestionAdornerViewModel.prototype.cleanDefaultsFromJson = function (type, toolboxItemJson) {
+        var question = survey_core__WEBPACK_IMPORTED_MODULE_1__.QuestionFactory.Instance.createQuestion(type, "question");
+        if (!question)
+            return toolboxItemJson;
+        question.fromJSON(toolboxItemJson);
+        var json = question.toJSON();
+        json["type"] = type;
+        delete json.name;
+        return json;
+    };
+    QuestionAdornerViewModel.prototype.updateQuestionTypeOrSubtypeListModel = function (listModel, subtypeOnly) {
+        var _this = this;
+        var _a;
+        var availableItems = this.getConvertToTypes();
+        var defaultJsons = this.buildDefaultJsonMap(availableItems);
+        var newItems = [];
+        var lastItem;
+        var selectedAction;
+        var selectedSubaction = undefined;
+        var selectedSubactions = undefined;
+        availableItems.forEach(function (item) {
+            var _a;
+            var needSeparator = lastItem && item.category != lastItem.category;
+            var action = _this.creator.createIActionBarItemByClass(item, needSeparator, function (questionType, json) { _this.convertQuestion(questionType, json, defaultJsons); });
+            if (_this.toolboxItemIsCorresponded(item, !!selectedAction)) {
+                selectedAction = action;
+                selectedSubactions = item.items;
+            }
+            if (((_a = item.items) === null || _a === void 0 ? void 0 : _a.length) > 0 && _this.creator.toolbox.showSubitems) {
+                var subactions_1 = [];
+                var selectedSubactionLocal_1 = undefined;
+                var allChildsAreCompatibleToParent_1 = false;
+                item.items.forEach(function (subitem) {
+                    var subaction = _this.creator.createIActionBarItemByClass(subitem, false, function (questionType, json) { _this.convertQuestion(questionType, json, defaultJsons); });
+                    if (_this.toolboxItemIsCorresponded(subitem, !!selectedAction))
+                        selectedSubactionLocal_1 = subitem;
+                    if (_this.jsonsAreCompatible(item.json, subitem.json))
+                        allChildsAreCompatibleToParent_1 = true;
+                    subactions_1.push(subaction);
+                });
+                if (!allChildsAreCompatibleToParent_1 && subactions_1.length > 0) {
+                    var defaultSubaction = _this.creator.createIActionBarItemByClass(item, false, function (questionType, json) { _this.convertQuestion(questionType, json, defaultJsons); });
+                    defaultSubaction.id = action.id + "-default";
+                    defaultSubaction.iconName = undefined;
+                    defaultSubaction.markerIconName = undefined;
+                    defaultSubaction.items = [];
+                    defaultSubaction.component = undefined;
+                    subactions_1.unshift(defaultSubaction);
+                    if (selectedAction == action && !selectedSubactionLocal_1)
+                        selectedSubactionLocal_1 = defaultSubaction;
+                }
+                action.setSubItems({ items: subactions_1 });
+                if (selectedSubactionLocal_1) {
+                    selectedAction = action;
+                    selectedSubaction = selectedSubactionLocal_1;
+                    selectedSubactions = subactions_1;
+                }
+            }
+            lastItem = item;
+            newItems.push(action);
+        });
+        if (subtypeOnly) {
+            if (selectedSubactions) {
+                listModel.setItems(selectedSubactions);
+                listModel.selectedItem = selectedSubaction;
+                return !!selectedSubactions;
+            }
+        }
+        else {
+            var _listModel = (_a = selectedAction === null || selectedAction === void 0 ? void 0 : selectedAction.popupModel) === null || _a === void 0 ? void 0 : _a.contentComponentData.model;
+            if (_listModel)
+                _listModel.selectedItem = selectedSubaction;
+            listModel.setItems(newItems);
+            listModel.selectedItem = selectedAction;
+        }
+    };
     QuestionAdornerViewModel.prototype.createConvertInputType = function () {
         var _this = this;
-        var questionType = this.surveyElement.getType();
-        if (questionType !== "text" && questionType !== "rating")
+        var listModel = new survey_core__WEBPACK_IMPORTED_MODULE_1__.ListModel([]);
+        this.updateQuestionTypeOrSubtypeListModel(listModel, true);
+        if (listModel.actions.length == 0)
             return null;
-        var toolboxItem = this.creator.toolbox.items.filter(function (item) { return item.id === questionType; })[0];
-        if (!toolboxItem || !toolboxItem.hasSubItems)
-            return null;
-        var propName = _toolbox__WEBPACK_IMPORTED_MODULE_8__.QuestionToolbox.getSubTypePropertyName(questionType);
-        var questionSubType = this.surveyElement.getPropertyValue(propName);
-        var getAvailableTypes = function () {
-            return toolboxItem.items.map(function (item) {
-                return {
-                    id: item.id,
-                    title: item.title,
-                    action: function (item) {
-                        var newValue = _this.getUpdatedPropertyValue(propName, item.id);
-                        _this.surveyElement.setPropertyValue(propName, newValue);
-                    }
-                };
-            });
-        };
         var actionData = {
             id: "convertInputType",
             visibleIndex: 1,
-            title: _editorLocalization__WEBPACK_IMPORTED_MODULE_2__.editorLocalization.getPropertyValueInEditor(propName, questionSubType),
+            title: "SUBTYPE",
             disableShrink: true,
             iconName: "icon-chevron_16x16"
         };
         var newAction = this.createDropdownModel({
             actionData: actionData,
-            items: getAvailableTypes(),
+            items: [],
             updateListModel: function (listModel) {
-                var newItems = getAvailableTypes();
-                listModel.setItems(newItems);
-                listModel.selectedItem = _this.getSelectedItem(newItems, _this.surveyElement.getPropertyValue(propName));
+                _this.updateQuestionTypeOrSubtypeListModel(listModel, true);
             }
         });
-        this.surveyElement.registerFunctionOnPropertyValueChanged(propName, function () {
-            var item = _this.getSelectedItem(getAvailableTypes(), _this.surveyElement.getPropertyValue(propName));
-            if (!item)
-                return;
+        this.surveyElement.registerFunctionOnPropertiesValueChanged(["inputType", "rateType"], function () {
             var popup = newAction.popupModel;
             var list = popup.contentComponentData.model;
-            list.selectedItem = item;
-            newAction.title = item.title;
+            _this.updateQuestionTypeOrSubtypeListModel(list, true);
+            newAction.title = list.selectedItem.title;
         }, "inputTypeAdorner");
         newAction.removePriority = 1;
         return newAction;
@@ -4784,6 +5020,10 @@ var QuestionAdornerViewModel = /** @class */ (function (_super) {
                 options.updateListModel(listModel);
             },
         });
+        var listModel = newAction.popupModel.contentComponentData.model;
+        options.updateListModel(listModel);
+        if (listModel.selectedItem)
+            newAction.title = listModel.selectedItem.title;
         newAction.popupModel.displayMode = this.creator.isTouch ? "overlay" : "popup";
         newAction.data.locOwner = this.creator;
         return newAction;
@@ -5135,6 +5375,68 @@ var RowViewModel = /** @class */ (function (_super) {
 
 
 
+/***/ }),
+
+/***/ "./src/components/side-bar/side-bar-header-model.ts":
+/*!**********************************************************!*\
+  !*** ./src/components/side-bar/side-bar-header-model.ts ***!
+  \**********************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   SidebarHeaderModel: () => (/* binding */ SidebarHeaderModel)
+/* harmony export */ });
+/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "./src/entries/helpers.ts");
+/* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! survey-core */ "survey-core");
+/* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(survey_core__WEBPACK_IMPORTED_MODULE_1__);
+
+
+var SidebarHeaderModel = /** @class */ (function (_super) {
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__extends)(SidebarHeaderModel, _super);
+    function SidebarHeaderModel() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.toolbar = new survey_core__WEBPACK_IMPORTED_MODULE_1__.AdaptiveActionContainer();
+        return _this;
+    }
+    Object.defineProperty(SidebarHeaderModel.prototype, "component", {
+        get: function () {
+            return this.componentName || "svc-side-bar-default-header";
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(SidebarHeaderModel.prototype, "componentModel", {
+        get: function () {
+            return this.componentData || this;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    SidebarHeaderModel.prototype.reset = function () {
+        this.title = "";
+        this.subTitle = "";
+        this.componentName = "";
+        this.componentData = undefined;
+    };
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
+    ], SidebarHeaderModel.prototype, "title", void 0);
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
+    ], SidebarHeaderModel.prototype, "subTitle", void 0);
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
+    ], SidebarHeaderModel.prototype, "componentData", void 0);
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
+    ], SidebarHeaderModel.prototype, "componentName", void 0);
+    return SidebarHeaderModel;
+}(survey_core__WEBPACK_IMPORTED_MODULE_1__.Base));
+
+
+
 /***/ }),
 
 /***/ "./src/components/side-bar/side-bar-model.ts":
@@ -5153,8 +5455,10 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(survey_core__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _editorLocalization__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../editorLocalization */ "./src/editorLocalization.ts");
 /* harmony import */ var _side_bar_page_model__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./side-bar-page-model */ "./src/components/side-bar/side-bar-page-model.ts");
-/* harmony import */ var _utils_resizer__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../utils/resizer */ "./src/utils/resizer.ts");
-/* harmony import */ var _utils_utils__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../utils/utils */ "./src/utils/utils.ts");
+/* harmony import */ var _side_bar_header_model__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./side-bar-header-model */ "./src/components/side-bar/side-bar-header-model.ts");
+/* harmony import */ var _utils_resizer__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../utils/resizer */ "./src/utils/resizer.ts");
+/* harmony import */ var _utils_utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../utils/utils */ "./src/utils/utils.ts");
+
 
 
 
@@ -5166,7 +5470,7 @@ var SidebarModel = /** @class */ (function (_super) {
     function SidebarModel(creator) {
         var _this = _super.call(this) || this;
         _this.creator = creator;
-        _this.toolbar = new survey_core__WEBPACK_IMPORTED_MODULE_1__.AdaptiveActionContainer();
+        _this.header = new _side_bar_header_model__WEBPACK_IMPORTED_MODULE_4__.SidebarHeaderModel();
         _this.allowFlyoutMode = true;
         _this.visibilityAnimation = new survey_core__WEBPACK_IMPORTED_MODULE_1__.AnimationBoolean(_this.getAnimationOptions(), function (val) {
             _this.renderedIsVisible = val;
@@ -5188,13 +5492,6 @@ var SidebarModel = /** @class */ (function (_super) {
         _this.createActions();
         return _this;
     }
-    Object.defineProperty(SidebarModel.prototype, "activePageModel", {
-        get: function () {
-            return this._activePage;
-        },
-        enumerable: false,
-        configurable: true
-    });
     SidebarModel.prototype.getAnimationOptions = function () {
         var _this = this;
         var onBeforeRunAnimation = function (el) {
@@ -5262,7 +5559,7 @@ var SidebarModel = /** @class */ (function (_super) {
             locTitleName: "ed.hidePanel",
             showTitle: false,
             visible: new survey_core__WEBPACK_IMPORTED_MODULE_1__.ComputedUpdater(function () {
-                return (0,_utils_utils__WEBPACK_IMPORTED_MODULE_5__.notShortCircuitAnd)(!(0,_utils_utils__WEBPACK_IMPORTED_MODULE_5__.notShortCircuitAnd)(!_this.creator.allowCollapseSidebar, !_this.flyoutMode), _this.visible, !_this.hideSideBarVisibilityControlActions);
+                return (0,_utils_utils__WEBPACK_IMPORTED_MODULE_6__.notShortCircuitAnd)(!(0,_utils_utils__WEBPACK_IMPORTED_MODULE_6__.notShortCircuitAnd)(!_this.creator.allowCollapseSidebar, !_this.flyoutMode), _this.visible, !_this.hideSideBarVisibilityControlActions);
             }),
             action: function () {
                 _this.collapseSidebar();
@@ -5275,7 +5572,7 @@ var SidebarModel = /** @class */ (function (_super) {
                 }
             }
         });
-        this.toolbar.actions.push(this._collapseAction);
+        this.header.toolbar.actions.push(this._collapseAction);
         if (this.creator.allowCollapseSidebar) {
             this._expandAction = new survey_core__WEBPACK_IMPORTED_MODULE_1__.Action({
                 id: "svd-grid-expand",
@@ -5291,7 +5588,7 @@ var SidebarModel = /** @class */ (function (_super) {
                 },
                 locTitleName: "ed.showPanel",
                 visible: new survey_core__WEBPACK_IMPORTED_MODULE_1__.ComputedUpdater(function () {
-                    return (0,_utils_utils__WEBPACK_IMPORTED_MODULE_5__.notShortCircuitAnd)(_this.hasVisiblePages, !_this.visible, !_this.hideSideBarVisibilityControlActions);
+                    return (0,_utils_utils__WEBPACK_IMPORTED_MODULE_6__.notShortCircuitAnd)(_this.hasVisiblePages, !_this.visible, !_this.hideSideBarVisibilityControlActions);
                 }),
                 showTitle: false
             });
@@ -5307,7 +5604,7 @@ var SidebarModel = /** @class */ (function (_super) {
         this.pages.forEach(function (page) { return page.visible = false; });
         this._activePage = newPage;
         if (this._activePage) {
-            this.headerText = this._activePage.caption;
+            this.header.title = this._activePage.caption;
             this._activePage.visible = true;
         }
     };
@@ -5325,7 +5622,7 @@ var SidebarModel = /** @class */ (function (_super) {
         var page = new _side_bar_page_model__WEBPACK_IMPORTED_MODULE_3__.SidebarPageModel(id, this, componentName, model);
         this.pages.push(page);
         if (!!buildActions) {
-            (buildActions() || []).forEach(function (action) { return _this.toolbar.actions.push(action); });
+            (buildActions() || []).forEach(function (action) { return _this.header.toolbar.actions.push(action); });
         }
         return page;
     };
@@ -5343,7 +5640,7 @@ var SidebarModel = /** @class */ (function (_super) {
     };
     SidebarModel.prototype.initResizeManager = function (container) {
         var _a;
-        this.resizeManager = new _utils_resizer__WEBPACK_IMPORTED_MODULE_4__.ResizeManager(container, this.getCurrentHandles());
+        this.resizeManager = new _utils_resizer__WEBPACK_IMPORTED_MODULE_5__.ResizeManager(container, this.getCurrentHandles());
         this.rootElement = (_a = container === null || container === void 0 ? void 0 : container.parentElement) === null || _a === void 0 ? void 0 : _a.parentElement;
     };
     SidebarModel.prototype.resetResizeManager = function () {
@@ -5356,9 +5653,6 @@ var SidebarModel = /** @class */ (function (_super) {
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.propertyArray)()
     ], SidebarModel.prototype, "pages", void 0);
-    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
-        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
-    ], SidebarModel.prototype, "headerText", void 0);
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)({ defaultValue: true })
     ], SidebarModel.prototype, "_visible", void 0);
@@ -5393,12 +5687,6 @@ var SidebarModel = /** @class */ (function (_super) {
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
     ], SidebarModel.prototype, "sideAreaComponentData", void 0);
-    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
-        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
-    ], SidebarModel.prototype, "headerComponentName", void 0);
-    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
-        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
-    ], SidebarModel.prototype, "headerComponentData", void 0);
     return SidebarModel;
 }(survey_core__WEBPACK_IMPORTED_MODULE_1__.Base));
 
@@ -5433,11 +5721,7 @@ var SidebarPageModel = /** @class */ (function (_super) {
         return _this;
     }
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
-        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)({
-            onSet: function (newVal, target) {
-                target.sidePanel.headerText = target.caption;
-            }
-        })
+        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
     ], SidebarPageModel.prototype, "caption", void 0);
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)({
@@ -5548,8 +5832,9 @@ __webpack_require__.r(__webpack_exports__);
 __webpack_require__(/*! ./simulator.scss */ "./src/components/simulator.scss");
 var SurveySimulatorModel = /** @class */ (function (_super) {
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__extends)(SurveySimulatorModel, _super);
-    function SurveySimulatorModel() {
+    function SurveySimulatorModel(surveyProvider) {
         var _this_1 = _super.call(this) || this;
+        _this_1.surveyProvider = surveyProvider;
         _this_1.activateZoom = function () {
             document.addEventListener("keydown", _this_1.listenTryToZoom);
             document.addEventListener("wheel", _this_1.listenTryToZoomWithWheel, { passive: false });
@@ -5592,8 +5877,11 @@ var SurveySimulatorModel = /** @class */ (function (_super) {
         // }
     }
     SurveySimulatorModel.prototype.surveyChanged = function () {
+        var _this_1 = this;
         var _this = this;
         this.survey.onOpenDropdownMenu.add(function (_, options) {
+            if (_this_1.surveyProvider.isTouch)
+                return;
             var device = simulatorDevices[_this.activeDevice];
             options.menuType = device.deviceType === "desktop" ? "dropdown" : (device.deviceType == "tablet" ? "popup" : "overlay");
         });
@@ -6820,16 +7108,16 @@ var TabDesignerPlugin = /** @class */ (function () {
     };
     TabDesignerPlugin.prototype.updateHeaderComponent = function () {
         if (this.showOneCategoryInPropertyGrid && this.activePageIsPropertyGrid) {
-            this.creator.sidebar.headerComponentName = "svc-side-bar-property-grid-header";
-            this.creator.sidebar.headerComponentData = this.propertyGridViewModel.objectSelectionAction;
+            this.creator.sidebar.header.componentName = "svc-side-bar-property-grid-header";
+            this.creator.sidebar.header.componentData = this.propertyGridViewModel.objectSelectionAction;
         }
         else if (this.showOneCategoryInPropertyGrid && this.creator.sidebar.activePage === this.propertyGridPlaceholderPage.id) {
-            this.creator.sidebar.headerComponentName = "svc-side-bar-property-grid-placeholder-header";
-            this.creator.sidebar.headerComponentData = this.propertyGridPlaceholderPage;
+            this.creator.sidebar.header.componentName = "svc-side-bar-header";
+            this.creator.sidebar.header.componentData = this.creator.sidebar.header;
         }
         else {
-            this.creator.sidebar.headerComponentName = "";
-            this.creator.sidebar.headerComponentData = undefined;
+            this.creator.sidebar.header.componentName = "";
+            this.creator.sidebar.header.componentData = undefined;
         }
     };
     TabDesignerPlugin.prototype.updateActivePage = function () {
@@ -6913,8 +7201,7 @@ var TabDesignerPlugin = /** @class */ (function () {
         this.creator.sidebar.hideSideBarVisibilityControlActions = false;
         this.creator.sidebar.sideAreaComponentName = undefined;
         this.creator.sidebar.sideAreaComponentData = undefined;
-        this.creator.sidebar.headerComponentName = undefined;
-        this.creator.sidebar.headerComponentData = undefined;
+        this.creator.sidebar.header.reset();
         return true;
     };
     TabDesignerPlugin.prototype.onDesignerSurveyPropertyChanged = function (obj, propName) {
@@ -7253,6 +7540,24 @@ var TabDesignerViewModel = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(TabDesignerViewModel.prototype, "placeholderTitleText", {
+        get: function () {
+            if (this.creator.isMobileView)
+                return (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)("ed.surveyPlaceholderTitleMobile");
+            return (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)("ed.surveyPlaceholderTitle");
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(TabDesignerViewModel.prototype, "placeholderDescriptionText", {
+        get: function () {
+            if (this.creator.isMobileView)
+                return (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)("ed.surveyPlaceholderDescriptionMobile");
+            return (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)("ed.surveyPlaceholderDescription");
+        },
+        enumerable: false,
+        configurable: true
+    });
     Object.defineProperty(TabDesignerViewModel.prototype, "hasToolbar", {
         get: function () {
             return this.creator.expandCollapseButtonVisibility != "never";
@@ -7551,6 +7856,18 @@ survey_core__WEBPACK_IMPORTED_MODULE_1__.Serializer.addClass("header", [
             }
         }
     },
+    {
+        type: "spinedit",
+        name: "mobileHeight",
+        visibleIf: function (obj) { return obj.headerView === "advanced"; },
+        default: 0,
+        onPropertyEditorUpdate: function (obj, editor) {
+            if (!!editor) {
+                editor.unit = "px";
+                editor.min = 0;
+            }
+        }
+    },
     {
         type: "buttongroup",
         name: "inheritWidthFrom",
@@ -11625,6 +11942,24 @@ var SurveyLogicUI = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(SurveyLogicUI.prototype, "placeholderTitleText", {
+        get: function () {
+            if (this.options.isMobileView)
+                return (0,_logic_types__WEBPACK_IMPORTED_MODULE_5__.getLogicString)("logicPlaceholderTitleMobile");
+            return (0,_logic_types__WEBPACK_IMPORTED_MODULE_5__.getLogicString)("logicPlaceholderTitle");
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(SurveyLogicUI.prototype, "placeholderDescriptionText", {
+        get: function () {
+            if (this.options.isMobileView)
+                return (0,_logic_types__WEBPACK_IMPORTED_MODULE_5__.getLogicString)("logicPlaceholderDescriptionMobile");
+            return (0,_logic_types__WEBPACK_IMPORTED_MODULE_5__.getLogicString)("logicPlaceholderDescription");
+        },
+        enumerable: false,
+        configurable: true
+    });
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
     ], SurveyLogicUI.prototype, "itemsSurveyValue", void 0);
@@ -12196,7 +12531,7 @@ var PreviewViewModel = /** @class */ (function (_super) {
         _this.startThemeClasses = startThemeClasses;
         _this.enableInvisiblePages = true;
         _this.pages = new survey_core__WEBPACK_IMPORTED_MODULE_2__.ActionContainer();
-        _this.simulator = new _simulator__WEBPACK_IMPORTED_MODULE_1__.SurveySimulatorModel();
+        _this.simulator = new _simulator__WEBPACK_IMPORTED_MODULE_1__.SurveySimulatorModel(surveyProvider);
         return _this;
     }
     Object.defineProperty(PreviewViewModel.prototype, "activeLanguage", {
@@ -12499,6 +12834,24 @@ var PreviewViewModel = /** @class */ (function (_super) {
         var isNextEnabled = this.survey && this.survey.visiblePages.indexOf(this.activePage) !== this.survey.visiblePages.length - 1;
         this.nextPageAction.enabled = isNextEnabled;
     };
+    Object.defineProperty(PreviewViewModel.prototype, "placeholderTitleText", {
+        get: function () {
+            if (this.isMobileView)
+                return (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_3__.getLocString)("ed.previewPlaceholderTitleMobile");
+            return (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_3__.getLocString)("ed.previewPlaceholderTitle");
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(PreviewViewModel.prototype, "placeholderDescriptionText", {
+        get: function () {
+            if (this.isMobileView)
+                return (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_3__.getLocString)("ed.previewPlaceholderDescriptionMobile");
+            return (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_3__.getLocString)("ed.previewPlaceholderDescription");
+        },
+        enumerable: false,
+        configurable: true
+    });
     PreviewViewModel.prototype.onScroll = function () {
         this.survey.onScroll();
         return true;
@@ -12715,7 +13068,7 @@ var TabTestPlugin = /** @class */ (function () {
                 iconName: "icon-device-desktop",
                 mode: "small",
                 visible: new survey_core__WEBPACK_IMPORTED_MODULE_1__.ComputedUpdater(function () {
-                    return (0,_utils_utils__WEBPACK_IMPORTED_MODULE_0__.notShortCircuitAnd)(_this.creator.activeTab === "test", _this.creator.showSimulatorInTestSurveyTab);
+                    return (0,_utils_utils__WEBPACK_IMPORTED_MODULE_0__.notShortCircuitAnd)(_this.creator.activeTab === "test", _this.creator.showSimulatorInTestSurveyTab, !_this.creator.isTouch);
                 }),
             }, {
                 items: deviceSelectorItems,
@@ -12732,7 +13085,7 @@ var TabTestPlugin = /** @class */ (function () {
                 iconName: "icon-device-rotate",
                 mode: "small",
                 visible: new survey_core__WEBPACK_IMPORTED_MODULE_1__.ComputedUpdater(function () {
-                    return (0,_utils_utils__WEBPACK_IMPORTED_MODULE_0__.notShortCircuitAnd)(_this.creator.activeTab === "test", _this.creator.showSimulatorInTestSurveyTab);
+                    return (0,_utils_utils__WEBPACK_IMPORTED_MODULE_0__.notShortCircuitAnd)(_this.creator.activeTab === "test", _this.creator.showSimulatorInTestSurveyTab, !_this.creator.isTouch);
                 }),
                 action: function () {
                     _this.model.simulator.landscape = !_this.model.simulator.landscape;
@@ -13385,6 +13738,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   createBoxShadow: () => (/* binding */ createBoxShadow),
 /* harmony export */   createBoxShadowReset: () => (/* binding */ createBoxShadowReset),
 /* harmony export */   parseBoxShadow: () => (/* binding */ parseBoxShadow),
+/* harmony export */   trimBoxShadowValue: () => (/* binding */ trimBoxShadowValue),
 /* harmony export */   updateShadowEffectsJSON: () => (/* binding */ updateShadowEffectsJSON)
 /* harmony export */ });
 /* harmony import */ var _editorLocalization__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../editorLocalization */ "./src/editorLocalization.ts");
@@ -13459,7 +13813,16 @@ if (!survey_core__WEBPACK_IMPORTED_MODULE_1__.ComponentCollection.Instance.getCu
                     return [{}];
                 return typeof value == "string" ? parseBoxShadow(value) : value;
             };
-            question.valueToDataCallback = function (value) { return !!value ? (typeof value == "string" ? value : createBoxShadow(Array.isArray(value) ? value : [value])) : ""; };
+            question.valueToDataCallback = function (value) {
+                if (!value)
+                    return "";
+                if (typeof value == "string") {
+                    return value;
+                }
+                else {
+                    return createBoxShadow(Array.isArray(value) ? value : [value]);
+                }
+            };
             question.contentQuestion.panels.forEach(function (p) { return p.questions.forEach(function (q) { return q.allowRootStyle = false; }); });
         },
     });
@@ -13510,6 +13873,11 @@ function parseBoxShadow(value) {
         return res;
     });
 }
+function trimBoxShadowValue(value) {
+    if (!value)
+        return value;
+    return value.replace(/\)\,\s/g, "),");
+}
 
 
 /***/ }),
@@ -13549,6 +13917,7 @@ var themeModelProperties = {
             { name: "fontSize", tab: "appearancefont" },
             { name: "scale", tab: "appearanceother" },
             { name: "cornerRadius", tab: "appearanceother" },
+            { name: "advancedMode", tab: "appearanceadvancedmode" },
             { name: "pageTitle", tab: "appearancepage" },
             { name: "pageDescription", tab: "appearancepage" },
             { name: "questionPanel", tab: "appearancequestion" },
@@ -13568,6 +13937,7 @@ var themeModelProperties = {
             { name: "appearancecolor", parent: "appearance", index: 100 },
             { name: "appearancefont", parent: "appearance", index: 200 },
             { name: "appearanceother", parent: "appearance", index: 300 },
+            { name: "appearanceadvancedmode", parent: "appearance", index: 350 },
             { name: "appearanceprimarycolor", parent: "appearance", index: 400 },
             { name: "appearancepage", parent: "appearance", index: 500 },
             { name: "appearancequestion", parent: "appearance", index: 600 },
@@ -13582,6 +13952,7 @@ var themeModelProperties = {
             { name: "surveyTitle" },
             { name: "surveyDescription" },
             { name: "height", tab: "layout" },
+            { name: "mobileHeight", tab: "layout" },
             { name: "inheritWidthFrom", tab: "layout" },
             { name: "textAreaWidth", tab: "layout" },
             { name: "backgroundColorSwitch", tab: "background" },
@@ -14263,8 +14634,18 @@ survey_core__WEBPACK_IMPORTED_MODULE_1__.Serializer.addClass("theme", [
                 editor.min = 0;
             }
         }
-    },
-    {
+    }, {
+        name: "advancedMode",
+        type: "switchToggle",
+        isSerializable: false,
+        default: false,
+        onPropertyEditorUpdate: function (obj, editor) {
+            if (!!editor) {
+                editor.titleLocation = "hidden";
+                editor.renderAs = "switch";
+            }
+        }
+    }, {
         type: "spinedit",
         isSerializable: false,
         name: "fontSize",
@@ -14427,6 +14808,9 @@ survey_core__WEBPACK_IMPORTED_MODULE_1__.Serializer.addProperties("theme", [{
     }, {
         type: "shadoweffects",
         name: "--sjs-shadow-small",
+        onSetValue: function (obj, value) {
+            obj.setPropertyValue("--sjs-shadow-small", (0,_theme_custom_questions_shadow_effects__WEBPACK_IMPORTED_MODULE_7__.trimBoxShadowValue)(value));
+        },
     }, {
         type: "font",
         name: "questionTitle",
@@ -14447,6 +14831,9 @@ survey_core__WEBPACK_IMPORTED_MODULE_1__.Serializer.addProperties("theme", [{
     {
         type: "shadoweffects",
         name: "--sjs-shadow-inner",
+        onSetValue: function (obj, value) {
+            obj.setPropertyValue("--sjs-shadow-inner", (0,_theme_custom_questions_shadow_effects__WEBPACK_IMPORTED_MODULE_7__.trimBoxShadowValue)(value));
+        },
     }, {
         type: "font",
         name: "editorFont",
@@ -14489,10 +14876,34 @@ survey_core__WEBPACK_IMPORTED_MODULE_1__.Serializer.addProperties("theme", [{
     { name: "--sjs-secondary-backcolor-semi-light", visible: false },
     { name: "--sjs-secondary-forecolor", visible: false },
     { name: "--sjs-secondary-forecolor-light", visible: false },
-    { name: "--sjs-shadow-small-reset", visible: false },
-    { name: "--sjs-shadow-medium", visible: false },
-    { name: "--sjs-shadow-large", visible: false },
-    { name: "--sjs-shadow-inner-reset", visible: false },
+    {
+        name: "--sjs-shadow-small-reset",
+        visible: false,
+        onSetValue: function (obj, value) {
+            obj.setPropertyValue("--sjs-shadow-small-reset", (0,_theme_custom_questions_shadow_effects__WEBPACK_IMPORTED_MODULE_7__.trimBoxShadowValue)(value));
+        },
+    },
+    {
+        name: "--sjs-shadow-medium",
+        visible: false,
+        onSetValue: function (obj, value) {
+            obj.setPropertyValue("--sjs-shadow-medium", (0,_theme_custom_questions_shadow_effects__WEBPACK_IMPORTED_MODULE_7__.trimBoxShadowValue)(value));
+        },
+    },
+    {
+        name: "--sjs-shadow-large",
+        visible: false,
+        onSetValue: function (obj, value) {
+            obj.setPropertyValue("--sjs-shadow-large", (0,_theme_custom_questions_shadow_effects__WEBPACK_IMPORTED_MODULE_7__.trimBoxShadowValue)(value));
+        },
+    },
+    {
+        name: "--sjs-shadow-inner-reset",
+        visible: false,
+        onSetValue: function (obj, value) {
+            obj.setPropertyValue("--sjs-shadow-inner-reset", (0,_theme_custom_questions_shadow_effects__WEBPACK_IMPORTED_MODULE_7__.trimBoxShadowValue)(value));
+        },
+    },
     { name: "--sjs-border-light", visible: false },
     { name: "--sjs-border-default", visible: false },
     { name: "--sjs-border-inside", visible: false },
@@ -14634,24 +15045,22 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   ThemeTabPlugin: () => (/* binding */ ThemeTabPlugin)
 /* harmony export */ });
-/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "./src/entries/helpers.ts");
-/* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! survey-core */ "survey-core");
-/* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(survey_core__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var _creator_settings__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../creator-settings */ "./src/creator-settings.ts");
-/* harmony import */ var _editorLocalization__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../editorLocalization */ "./src/editorLocalization.ts");
-/* harmony import */ var _theme_builder__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./theme-builder */ "./src/components/tabs/theme-builder.ts");
-/* harmony import */ var _themes__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./themes */ "./src/components/tabs/themes.ts");
-/* harmony import */ var _utils_utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../utils/utils */ "./src/utils/utils.ts");
-/* harmony import */ var _property_grid__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../property-grid */ "./src/property-grid/index.ts");
-/* harmony import */ var _property_grid_property_grid_view_model__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../property-grid/property-grid-view-model */ "./src/property-grid/property-grid-view-model.ts");
-/* harmony import */ var _theme_model__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./theme-model */ "./src/components/tabs/theme-model.ts");
-/* harmony import */ var _switcher_switcher__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../switcher/switcher */ "./src/components/switcher/switcher.ts");
-/* harmony import */ var _theme_model_definition__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./theme-model-definition */ "./src/components/tabs/theme-model-definition.ts");
-/* harmony import */ var _property_grid_theme_property_grid__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../property-grid-theme/property-grid */ "./src/property-grid-theme/property-grid.ts");
-/* harmony import */ var _side_bar_tab_control_model__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../side-bar/tab-control-model */ "./src/components/side-bar/tab-control-model.ts");
-/* harmony import */ var _property_grid_icons__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../property-grid/icons */ "./src/property-grid/icons.ts");
-/* harmony import */ var _utils_actions__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../utils/actions */ "./src/utils/actions.ts");
-
+/* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! survey-core */ "survey-core");
+/* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(survey_core__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _creator_settings__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../creator-settings */ "./src/creator-settings.ts");
+/* harmony import */ var _editorLocalization__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../editorLocalization */ "./src/editorLocalization.ts");
+/* harmony import */ var _theme_builder__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./theme-builder */ "./src/components/tabs/theme-builder.ts");
+/* harmony import */ var _themes__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./themes */ "./src/components/tabs/themes.ts");
+/* harmony import */ var _utils_utils__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../utils/utils */ "./src/utils/utils.ts");
+/* harmony import */ var _property_grid__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../property-grid */ "./src/property-grid/index.ts");
+/* harmony import */ var _property_grid_property_grid_view_model__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../property-grid/property-grid-view-model */ "./src/property-grid/property-grid-view-model.ts");
+/* harmony import */ var _theme_model__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./theme-model */ "./src/components/tabs/theme-model.ts");
+/* harmony import */ var _switcher_switcher__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../switcher/switcher */ "./src/components/switcher/switcher.ts");
+/* harmony import */ var _theme_model_definition__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./theme-model-definition */ "./src/components/tabs/theme-model-definition.ts");
+/* harmony import */ var _property_grid_theme_property_grid__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../property-grid-theme/property-grid */ "./src/property-grid-theme/property-grid.ts");
+/* harmony import */ var _side_bar_tab_control_model__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../side-bar/tab-control-model */ "./src/components/side-bar/tab-control-model.ts");
+/* harmony import */ var _property_grid_icons__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../property-grid/icons */ "./src/property-grid/icons.ts");
+/* harmony import */ var _utils_actions__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../utils/actions */ "./src/utils/actions.ts");
 
 
 
@@ -14690,15 +15099,16 @@ var ThemeTabPlugin = /** @class */ (function () {
         var _this = this;
         this.creator = creator;
         this.allowModifyTheme = true;
-        this.simulatorCssClasses = survey_core__WEBPACK_IMPORTED_MODULE_1__.surveyCss[survey_core__WEBPACK_IMPORTED_MODULE_1__.defaultV2ThemeName];
-        this._availableThemes = [].concat(_themes__WEBPACK_IMPORTED_MODULE_5__.PredefinedThemes);
+        this.simulatorCssClasses = survey_core__WEBPACK_IMPORTED_MODULE_0__.surveyCss[survey_core__WEBPACK_IMPORTED_MODULE_0__.defaultV2ThemeName];
+        this._availableThemes = [].concat(_themes__WEBPACK_IMPORTED_MODULE_4__.PredefinedThemes);
         this._showOneCategoryInPropertyGrid = false;
+        this._advancedModeValue = false;
         this.creatorPropertyChanged = function (sender, options) {
             if (options.name === "isMobileView") {
                 _this.updateVisibilityOfPropertyGridGroups();
             }
         };
-        this.saveToFileHandler = _utils_utils__WEBPACK_IMPORTED_MODULE_6__.saveToFileHandler;
+        this.saveToFileHandler = _utils_utils__WEBPACK_IMPORTED_MODULE_5__.saveToFileHandler;
         this.autoSaveTimerId = null;
         /**
          * An event that is raised when users select a UI theme from a drop-down list, choose a dark or light color palette, and switch between regular and panelless theme modifications.
@@ -14713,7 +15123,7 @@ var ThemeTabPlugin = /** @class */ (function () {
          * @see addTheme
          * @see removeTheme
          */
-        this.onThemeSelected = new survey_core__WEBPACK_IMPORTED_MODULE_1__.EventBase();
+        this.onThemeSelected = new survey_core__WEBPACK_IMPORTED_MODULE_0__.EventBase();
         /**
          * An event that is raised when the value of a property or CSS variable in a theme JSON schema has changed.
          *
@@ -14726,7 +15136,7 @@ var ThemeTabPlugin = /** @class */ (function () {
          * - `options.value`: `any`\
          * A new value of the property or CSS variable.
          */
-        this.onThemePropertyChanged = new survey_core__WEBPACK_IMPORTED_MODULE_1__.EventBase();
+        this.onThemePropertyChanged = new survey_core__WEBPACK_IMPORTED_MODULE_0__.EventBase();
         /**
          * An event that you can use to switch the current theme to read-only mode.
          *
@@ -14739,17 +15149,17 @@ var ThemeTabPlugin = /** @class */ (function () {
          * - `options.allow`: `boolean`\
          * A Boolean property that you can set to `false` if you want to disallow theme modifications.
          */
-        this.onAllowModifyTheme = new survey_core__WEBPACK_IMPORTED_MODULE_1__.EventBase();
+        this.onAllowModifyTheme = new survey_core__WEBPACK_IMPORTED_MODULE_0__.EventBase();
         creator.addPluginTab("theme", this);
-        this.simulatorCssClasses = survey_core__WEBPACK_IMPORTED_MODULE_1__.surveyCss[survey_core__WEBPACK_IMPORTED_MODULE_1__.defaultV2ThemeName];
-        this.tabControlModel = new _side_bar_tab_control_model__WEBPACK_IMPORTED_MODULE_13__.TabControlModel(this.creator.sidebar);
+        this.simulatorCssClasses = survey_core__WEBPACK_IMPORTED_MODULE_0__.surveyCss[survey_core__WEBPACK_IMPORTED_MODULE_0__.defaultV2ThemeName];
+        this.tabControlModel = new _side_bar_tab_control_model__WEBPACK_IMPORTED_MODULE_12__.TabControlModel(this.creator.sidebar);
         this.createActions().forEach(function (action) { return creator.toolbar.actions.push(action); });
-        this.propertyGrid = new _property_grid__WEBPACK_IMPORTED_MODULE_7__.PropertyGridModel(undefined, creator, _theme_model_definition__WEBPACK_IMPORTED_MODULE_11__.themeModelPropertyGridDefinition);
+        this.propertyGrid = new _property_grid__WEBPACK_IMPORTED_MODULE_6__.PropertyGridModel(undefined, creator, _theme_model_definition__WEBPACK_IMPORTED_MODULE_10__.themeModelPropertyGridDefinition);
         this.propertyGrid.surveyInstanceCreatedArea = "theme-tab:property-grid";
-        var propertyGridViewModel = new _property_grid_property_grid_view_model__WEBPACK_IMPORTED_MODULE_8__.PropertyGridViewModel(this.propertyGrid, creator);
+        var propertyGridViewModel = new _property_grid_property_grid_view_model__WEBPACK_IMPORTED_MODULE_7__.PropertyGridViewModel(this.propertyGrid, creator);
         this.propertyGridTab = this.creator.sidebar.addPage("theme", "svc-property-grid", propertyGridViewModel);
-        this.propertyGridTab.caption = _editorLocalization__WEBPACK_IMPORTED_MODULE_3__.editorLocalization.getString("ed.themePropertyGridTitle");
-        this.themeModel = new _theme_model__WEBPACK_IMPORTED_MODULE_9__.ThemeModel();
+        this.propertyGridTab.caption = _editorLocalization__WEBPACK_IMPORTED_MODULE_2__.editorLocalization.getString("ed.themePropertyGridTitle");
+        this.themeModel = new _theme_model__WEBPACK_IMPORTED_MODULE_8__.ThemeModel();
         creator.registerShortcut("undo_theme", {
             name: "undo",
             affectedTab: "theme",
@@ -14784,6 +15194,7 @@ var ThemeTabPlugin = /** @class */ (function () {
             if (this._showOneCategoryInPropertyGrid !== newValue) {
                 this._showOneCategoryInPropertyGrid = newValue;
                 this.creator.sidebar.hideSideBarVisibilityControlActions = newValue;
+                this.updateAdvancedModeQuestion();
                 this.propertyGrid.showOneCategoryInPropertyGrid = newValue;
                 this.propertyGrid["setObj"](this.creator.selectedElement);
                 if (this.creator.activeTab === "theme") {
@@ -14794,35 +15205,44 @@ var ThemeTabPlugin = /** @class */ (function () {
         enumerable: false,
         configurable: true
     });
+    ThemeTabPlugin.prototype.updateAdvancedModeQuestion = function () {
+        var advancedModeQuestion = this.propertyGrid.survey.getQuestionByName("advancedMode");
+        if (advancedModeQuestion) {
+            advancedModeQuestion.visible = this.showOneCategoryInPropertyGrid;
+            advancedModeQuestion.value = this._advancedModeValue;
+        }
+    };
     ThemeTabPlugin.prototype.createVisibleUpdater = function () {
         var _this = this;
-        return new survey_core__WEBPACK_IMPORTED_MODULE_1__.ComputedUpdater(function () { return _this.creator.activeTab === "theme"; });
+        return new survey_core__WEBPACK_IMPORTED_MODULE_0__.ComputedUpdater(function () { return _this.creator.activeTab === "theme"; });
     };
     ThemeTabPlugin.prototype.createAppearanceAdvancedModeAction = function () {
         var _this = this;
-        var advancedMode = new _switcher_switcher__WEBPACK_IMPORTED_MODULE_10__.Switcher({
+        var advancedMode = new _switcher_switcher__WEBPACK_IMPORTED_MODULE_9__.Switcher({
             id: "advancedMode",
             component: "svc-switcher",
             ariaRole: "checkbox",
             css: "sv-theme-group_title-action",
-            title: (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_3__.getLocString)("theme.advancedMode"),
+            title: (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)("theme.advancedMode"),
             visible: !this.creator.isMobileView,
             action: function () {
                 advancedMode.checked = !advancedMode.checked;
-                _this.propertyGrid.survey.setVariable("advancedmode", advancedMode.checked);
+                if (!!_this.propertyGrid.survey.getQuestionByName("advancedMode")) {
+                    _this.propertyGrid.survey.getQuestionByName("advancedMode").value = advancedMode.checked;
+                }
             }
         });
-        advancedMode.checked = !!this.propertyGrid.survey.getVariable("advancedmode");
+        advancedMode.checked = this._advancedModeValue;
         this.advancedModeSwitcher = advancedMode;
     };
     ThemeTabPlugin.prototype.addSubGroupTitle = function (panel, titleId) {
         if (!!panel.getQuestionByName(titleId))
             return;
-        var question = survey_core__WEBPACK_IMPORTED_MODULE_1__.Serializer.createClass("html");
+        var question = survey_core__WEBPACK_IMPORTED_MODULE_0__.Serializer.createClass("html");
         question.fromJSON({
             name: titleId,
-            visibleIf: "{advancedmode} = true",
-            html: "<div class='spg-theme-group-caption'>".concat((0,_editorLocalization__WEBPACK_IMPORTED_MODULE_3__.getLocString)(titleId), "</div>")
+            visibleIf: "{advancedMode} = true",
+            html: "<div class='spg-theme-group-caption'>".concat((0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)(titleId), "</div>")
         });
         panel.addElement(question);
     };
@@ -14855,8 +15275,8 @@ var ThemeTabPlugin = /** @class */ (function () {
     };
     ThemeTabPlugin.prototype.getPredefinedColorsItemValues = function () {
         var _this = this;
-        return Object.keys(_themes__WEBPACK_IMPORTED_MODULE_5__.PredefinedColors[this.themeModel.colorPalette]).map(function (colorName) {
-            return new survey_core__WEBPACK_IMPORTED_MODULE_1__.ItemValue(_themes__WEBPACK_IMPORTED_MODULE_5__.PredefinedColors[_this.themeModel.colorPalette][colorName], (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_3__.getLocString)("theme.colors." + colorName));
+        return Object.keys(_themes__WEBPACK_IMPORTED_MODULE_4__.PredefinedColors[this.themeModel.colorPalette]).map(function (colorName) {
+            return new survey_core__WEBPACK_IMPORTED_MODULE_0__.ItemValue(_themes__WEBPACK_IMPORTED_MODULE_4__.PredefinedColors[_this.themeModel.colorPalette][colorName], (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)("theme.colors." + colorName));
         });
     };
     ThemeTabPlugin.prototype.updatePropertyGridColorEditorWithPredefinedColors = function () {
@@ -14914,7 +15334,7 @@ var ThemeTabPlugin = /** @class */ (function () {
     ThemeTabPlugin.prototype.setVisibleIf = function (panelName, visibilityValue) {
         var panel = this.propertyGrid.survey.getPanelByName(panelName);
         if (!!panel) {
-            panel.visibleIf = "{advancedmode} = ".concat(visibilityValue);
+            panel.visibleIf = "{advancedMode} = ".concat(visibilityValue);
         }
     };
     ThemeTabPlugin.prototype.updateTabControl = function () {
@@ -14922,20 +15342,19 @@ var ThemeTabPlugin = /** @class */ (function () {
             this.updateTabControlActions();
             this.creator.sidebar.sideAreaComponentName = "svc-tab-control";
             this.creator.sidebar.sideAreaComponentData = this.tabControlModel;
-            this.creator.sidebar.headerComponentName = "svc-side-bar-property-grid-placeholder-header";
-            this.creator.sidebar.headerComponentData = this.propertyGridTab;
+            this.creator.sidebar.header.componentName = "svc-side-bar-header";
+            this.creator.sidebar.header.componentData = this.creator.sidebar.header;
         }
         else {
             this.creator.sidebar.sideAreaComponentName = "";
             this.creator.sidebar.sideAreaComponentData = undefined;
-            this.creator.sidebar.headerComponentName = "";
-            this.creator.sidebar.headerComponentData = undefined;
+            this.creator.sidebar.header.componentName = "";
+            this.creator.sidebar.header.componentData = undefined;
         }
     };
     ThemeTabPlugin.prototype.activate = function () {
         var _this = this;
-        var _a;
-        this.model = new _theme_builder__WEBPACK_IMPORTED_MODULE_4__.ThemeTabViewModel(this.creator, this.simulatorCssClasses);
+        this.model = new _theme_builder__WEBPACK_IMPORTED_MODULE_3__.ThemeTabViewModel(this.creator, this.simulatorCssClasses);
         this.themeModel.initialize(this.creator.theme, this.creator.survey);
         this.creator.sidebar.hideSideBarVisibilityControlActions = this.showOneCategoryInPropertyGrid;
         this.update();
@@ -14945,8 +15364,8 @@ var ThemeTabPlugin = /** @class */ (function () {
         this.propertyGrid.survey.getAllQuestions().forEach(function (q) { return q.readOnly = false; });
         this.onAvailableThemesChanged(this.availableThemes);
         this.updateAllowModifyTheme();
-        this.propertyGrid.survey.setVariable("advancedmode", !!((_a = this.advancedModeSwitcher) === null || _a === void 0 ? void 0 : _a.checked));
-        var themeBuilderCss = (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__assign)({}, _property_grid_theme_property_grid__WEBPACK_IMPORTED_MODULE_12__.propertyGridCss);
+        this.updateAdvancedModeQuestion();
+        var themeBuilderCss = JSON.parse(JSON.stringify(_property_grid_theme_property_grid__WEBPACK_IMPORTED_MODULE_11__.propertyGridCss));
         themeBuilderCss.root += " spg-theme-builder-root";
         if (this.showOneCategoryInPropertyGrid) {
             themeBuilderCss.root += " spg-root--one-category";
@@ -14963,7 +15382,7 @@ var ThemeTabPlugin = /** @class */ (function () {
         this.propertyGrid.survey.onOpenFileChooser.add(function (_, options) {
             var _a, _b;
             var context = {};
-            (0,_utils_utils__WEBPACK_IMPORTED_MODULE_6__.assign)(context, options.context, { element: _this.themeModel, elementType: "theme" });
+            (0,_utils_utils__WEBPACK_IMPORTED_MODULE_5__.assign)(context, options.context, { element: _this.themeModel, elementType: "theme" });
             if (options.element) {
                 var question = options.element;
                 context.propertyName = question.name;
@@ -14975,7 +15394,7 @@ var ThemeTabPlugin = /** @class */ (function () {
             _this.creator.chooseFiles(options.input, options.callback, context);
         });
         this.propertyGrid.survey.onUpdatePanelCssClasses.add(function (sender, options) {
-            var _a, _b;
+            var _a, _b, _c;
             if (options.panel.hasParent) {
                 var parent_1 = ((_a = options.panel.parent) !== null && _a !== void 0 ? _a : options.panel.parentQuestion);
                 if (!parent_1 || parent_1.hasParent && !(parent_1.name === "settings" || ((_b = parent_1.parentQuestion) === null || _b === void 0 ? void 0 : _b.name) === "settings")) {
@@ -14987,6 +15406,16 @@ var ThemeTabPlugin = /** @class */ (function () {
                     options.cssClasses.panel.content = "spg-nested-panel__content";
                 }
             }
+            else if (_this.showOneCategoryInPropertyGrid && ((_c = options.panel.parent) === null || _c === void 0 ? void 0 : _c.isPage)) {
+                options.cssClasses.panel.container = "spg-panel-by-page";
+                options.cssClasses.panel.content = "spg-panel-by-page__content";
+                if (options.panel.name === "appearanceother") {
+                    options.cssClasses.panel.container += " spg-panel--hidden-border";
+                }
+                if (options.panel.name === "appearanceadvancedmode") {
+                    options.cssClasses.panel.container += " spg-panel--hidden-border spg-panel--padding";
+                }
+            }
         });
         this.updatePropertyGridEditorsAvailability();
         this.updateVisibilityOfPropertyGridGroups();
@@ -15000,15 +15429,16 @@ var ThemeTabPlugin = /** @class */ (function () {
         var _this = this;
         if (this.showOneCategoryInPropertyGrid) {
             var pgTabs_1 = this.propertyGrid.survey.pages.map(function (p) {
-                var action = new _utils_actions__WEBPACK_IMPORTED_MODULE_15__.MenuButton({
+                var action = new _utils_actions__WEBPACK_IMPORTED_MODULE_14__.MenuButton({
                     id: p.name,
-                    locTooltipName: (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_3__.getLocString)("pe.tabs." + p.name),
-                    iconName: _property_grid_icons__WEBPACK_IMPORTED_MODULE_14__.pgTabIcons[p.name] || _property_grid_icons__WEBPACK_IMPORTED_MODULE_14__.pgTabIcons["undefined"],
+                    locTooltipName: (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)("pe.tabs." + p.name),
+                    iconName: _property_grid_icons__WEBPACK_IMPORTED_MODULE_13__.pgTabIcons[p.name] || _property_grid_icons__WEBPACK_IMPORTED_MODULE_13__.pgTabIcons["undefined"],
                     active: p.name === _this.propertyGrid.survey.currentPage.name,
                     pressed: false,
                     action: function () {
                         _this.creator.sidebar.expandSidebar();
                         _this.propertyGrid.survey.currentPage = p;
+                        _this.creator.sidebar.header.subTitle = p.title;
                         pgTabs_1.forEach(function (i) { return i.active = false; });
                         action.active = true;
                     }
@@ -15016,6 +15446,7 @@ var ThemeTabPlugin = /** @class */ (function () {
                 return action;
             });
             this.tabControlModel.topToolbar.setItems(pgTabs_1);
+            this.creator.sidebar.header.subTitle = this.propertyGrid.survey.currentPage.title;
         }
     };
     ThemeTabPlugin.prototype.update = function () {
@@ -15048,7 +15479,7 @@ var ThemeTabPlugin = /** @class */ (function () {
         });
         this.themeModel.onThemeSelected.add(function (sender, options) {
             _this.syncTheme(options.theme);
-            _this.resetTheme.enabled = (0,_theme_model__WEBPACK_IMPORTED_MODULE_9__.getThemeFullName)(sender.defaultSessionTheme) !== (0,_theme_model__WEBPACK_IMPORTED_MODULE_9__.getThemeFullName)(options.theme);
+            _this.resetTheme.enabled = (0,_theme_model__WEBPACK_IMPORTED_MODULE_8__.getThemeFullName)(sender.defaultSessionTheme) !== (0,_theme_model__WEBPACK_IMPORTED_MODULE_8__.getThemeFullName)(options.theme);
             _this.saveThemeAction.enabled = true;
             _this.onThemeSelected.fire(_this, options);
             if (_this.creator.isAutoSave) {
@@ -15077,7 +15508,7 @@ var ThemeTabPlugin = /** @class */ (function () {
         this.themeModel.onAllowModifyTheme.add(function (sender, options) {
             _this.onAllowModifyTheme.fire(_this, options);
         });
-        this.resetTheme.enabled = (0,_theme_model__WEBPACK_IMPORTED_MODULE_9__.getThemeFullName)(this.themeModel.defaultSessionTheme) !== (0,_theme_model__WEBPACK_IMPORTED_MODULE_9__.getThemeFullName)(this.creator.theme) || this.isModified;
+        this.resetTheme.enabled = (0,_theme_model__WEBPACK_IMPORTED_MODULE_8__.getThemeFullName)(this.themeModel.defaultSessionTheme) !== (0,_theme_model__WEBPACK_IMPORTED_MODULE_8__.getThemeFullName)(this.creator.theme) || this.isModified;
         this.updateTabControl();
     };
     ThemeTabPlugin.prototype.updateAllowModifyTheme = function () {
@@ -15091,6 +15522,7 @@ var ThemeTabPlugin = /** @class */ (function () {
         });
     };
     ThemeTabPlugin.prototype.deactivate = function () {
+        var _a;
         if (this.model) {
             this.simulatorCssClasses = this.model.survey.css;
             this.model.onPropertyChanged.clear();
@@ -15102,10 +15534,10 @@ var ThemeTabPlugin = /** @class */ (function () {
             this.model = undefined;
             this.creator.sidebar.hideSideBarVisibilityControlActions = false;
         }
+        this._advancedModeValue = !!((_a = this.propertyGrid.survey.getQuestionByName("advancedMode")) === null || _a === void 0 ? void 0 : _a.value);
         this.creator.sidebar.sideAreaComponentName = undefined;
         this.creator.sidebar.sideAreaComponentData = undefined;
-        this.creator.sidebar.headerComponentName = undefined;
-        this.creator.sidebar.headerComponentData = undefined;
+        this.creator.sidebar.header.reset();
         this.propertyGridTab.visible = false;
         this.testAgainAction.visible = false;
         this.invisibleToggleAction && (this.invisibleToggleAction.visible = false);
@@ -15132,7 +15564,7 @@ var ThemeTabPlugin = /** @class */ (function () {
     ThemeTabPlugin.prototype.createActions = function () {
         var _this = this;
         var items = [];
-        this.designerAction = new survey_core__WEBPACK_IMPORTED_MODULE_1__.Action({
+        this.designerAction = new survey_core__WEBPACK_IMPORTED_MODULE_0__.Action({
             id: "svd-designer",
             iconName: "icon-config",
             action: function () { _this.creator.makeNewViewActive("designer"); },
@@ -15140,20 +15572,20 @@ var ThemeTabPlugin = /** @class */ (function () {
             locTitleName: "ed.designer",
             showTitle: false
         });
-        this.prevPageAction = new survey_core__WEBPACK_IMPORTED_MODULE_1__.Action({
+        this.prevPageAction = new survey_core__WEBPACK_IMPORTED_MODULE_0__.Action({
             id: "prevPage",
             iconName: "icon-arrow-left_16x16",
-            needSeparator: new survey_core__WEBPACK_IMPORTED_MODULE_1__.ComputedUpdater(function () {
+            needSeparator: new survey_core__WEBPACK_IMPORTED_MODULE_0__.ComputedUpdater(function () {
                 return _this.creator.isMobileView;
             }),
             visible: false
         });
-        this.nextPageAction = new survey_core__WEBPACK_IMPORTED_MODULE_1__.Action({
+        this.nextPageAction = new survey_core__WEBPACK_IMPORTED_MODULE_0__.Action({
             id: "nextPage",
             iconName: "icon-arrow-right_16x16",
             visible: false
         });
-        this.previewAction = new survey_core__WEBPACK_IMPORTED_MODULE_1__.Action({
+        this.previewAction = new survey_core__WEBPACK_IMPORTED_MODULE_0__.Action({
             id: "svd-preview",
             iconName: "icon-preview",
             active: true,
@@ -15162,7 +15594,7 @@ var ThemeTabPlugin = /** @class */ (function () {
             showTitle: false,
             action: function () { }
         });
-        this.testAgainAction = new survey_core__WEBPACK_IMPORTED_MODULE_1__.Action({
+        this.testAgainAction = new survey_core__WEBPACK_IMPORTED_MODULE_0__.Action({
             id: "testSurveyAgain",
             visible: false,
             locTitleName: "ed.testSurveyAgain",
@@ -15170,7 +15602,7 @@ var ThemeTabPlugin = /** @class */ (function () {
                 _this.model.testAgain();
             }
         });
-        this.undoAction = new survey_core__WEBPACK_IMPORTED_MODULE_1__.Action({
+        this.undoAction = new survey_core__WEBPACK_IMPORTED_MODULE_0__.Action({
             id: "action-undo-theme",
             iconName: "icon-undo",
             locTitleName: "ed.undo",
@@ -15178,7 +15610,7 @@ var ThemeTabPlugin = /** @class */ (function () {
             visible: this.createVisibleUpdater(),
             action: function () { return _this.undo(); }
         });
-        this.redoAction = new survey_core__WEBPACK_IMPORTED_MODULE_1__.Action({
+        this.redoAction = new survey_core__WEBPACK_IMPORTED_MODULE_0__.Action({
             id: "action-redo-theme",
             iconName: "icon-redo",
             locTitleName: "ed.redo",
@@ -15188,7 +15620,7 @@ var ThemeTabPlugin = /** @class */ (function () {
         });
         items.push(this.undoAction);
         items.push(this.redoAction);
-        this.saveThemeAction = new survey_core__WEBPACK_IMPORTED_MODULE_1__.Action({
+        this.saveThemeAction = new survey_core__WEBPACK_IMPORTED_MODULE_0__.Action({
             id: "svd-save-theme",
             iconName: "icon-save",
             action: function () {
@@ -15197,15 +15629,15 @@ var ThemeTabPlugin = /** @class */ (function () {
             },
             active: false,
             enabled: false,
-            visible: new survey_core__WEBPACK_IMPORTED_MODULE_1__.ComputedUpdater(function () {
-                return (0,_utils_utils__WEBPACK_IMPORTED_MODULE_6__.notShortCircuitAnd)(_this.creator.activeTab === "theme", _this.creator.showSaveButton);
+            visible: new survey_core__WEBPACK_IMPORTED_MODULE_0__.ComputedUpdater(function () {
+                return (0,_utils_utils__WEBPACK_IMPORTED_MODULE_5__.notShortCircuitAnd)(_this.creator.activeTab === "theme", _this.creator.showSaveButton);
             }),
             locTitleName: "ed.saveTheme",
             locTooltipName: "ed.saveThemeTooltip",
             showTitle: false
         });
         items.push(this.saveThemeAction);
-        this.resetTheme = new survey_core__WEBPACK_IMPORTED_MODULE_1__.Action({
+        this.resetTheme = new survey_core__WEBPACK_IMPORTED_MODULE_0__.Action({
             id: "svc-reset-theme",
             iconName: "icon-reset",
             locTitleName: "ed.themeResetButton",
@@ -15213,15 +15645,15 @@ var ThemeTabPlugin = /** @class */ (function () {
             mode: "small",
             visible: this.createVisibleUpdater(),
             action: function () {
-                survey_core__WEBPACK_IMPORTED_MODULE_1__.settings.confirmActionAsync((0,_editorLocalization__WEBPACK_IMPORTED_MODULE_3__.getLocString)("ed.themeResetConfirmation"), function (confirm) {
+                survey_core__WEBPACK_IMPORTED_MODULE_0__.settings.confirmActionAsync((0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)("ed.themeResetConfirmation"), function (confirm) {
                     if (confirm) {
                         _this.themeModel.resetTheme();
                     }
-                }, (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_3__.getLocString)("ed.themeResetConfirmationOk"), _editorLocalization__WEBPACK_IMPORTED_MODULE_3__.editorLocalization.currentLocale);
+                }, (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)("ed.themeResetConfirmationOk"), _editorLocalization__WEBPACK_IMPORTED_MODULE_2__.editorLocalization.currentLocale);
             }
         });
         items.push(this.resetTheme);
-        this.themeSettingsAction = new survey_core__WEBPACK_IMPORTED_MODULE_1__.Action({
+        this.themeSettingsAction = new survey_core__WEBPACK_IMPORTED_MODULE_0__.Action({
             id: "svc-theme-settings",
             iconName: "icon-theme",
             action: function () {
@@ -15230,14 +15662,14 @@ var ThemeTabPlugin = /** @class */ (function () {
                 }
             },
             visible: this.createVisibleUpdater(),
-            active: new survey_core__WEBPACK_IMPORTED_MODULE_1__.ComputedUpdater(function () { return _this.creator.showSidebar; }),
-            pressed: new survey_core__WEBPACK_IMPORTED_MODULE_1__.ComputedUpdater(function () { return _this.creator.showSidebar; }),
+            active: new survey_core__WEBPACK_IMPORTED_MODULE_0__.ComputedUpdater(function () { return _this.creator.showSidebar; }),
+            pressed: new survey_core__WEBPACK_IMPORTED_MODULE_0__.ComputedUpdater(function () { return _this.creator.showSidebar; }),
             locTitleName: "ed.themeSettings",
             locTooltipName: "ed.themeSettingsTooltip",
             showTitle: false
         });
         items.push(this.themeSettingsAction);
-        this.importAction = new survey_core__WEBPACK_IMPORTED_MODULE_1__.Action({
+        this.importAction = new survey_core__WEBPACK_IMPORTED_MODULE_0__.Action({
             id: "svc-theme-import",
             iconName: "icon-load",
             locTitleName: "ed.themeImportButton",
@@ -15264,7 +15696,7 @@ var ThemeTabPlugin = /** @class */ (function () {
             }
         });
         items.push(this.importAction);
-        this.exportAction = new survey_core__WEBPACK_IMPORTED_MODULE_1__.Action({
+        this.exportAction = new survey_core__WEBPACK_IMPORTED_MODULE_0__.Action({
             id: "svc-theme-export",
             iconName: "icon-download",
             locTitleName: "ed.themeExportButton",
@@ -15273,12 +15705,12 @@ var ThemeTabPlugin = /** @class */ (function () {
             mode: "small",
             component: "sv-action-bar-item",
             action: function () {
-                _this.exportToFile(_creator_settings__WEBPACK_IMPORTED_MODULE_2__.settings.themeEditor.exportFileName);
+                _this.exportToFile(_creator_settings__WEBPACK_IMPORTED_MODULE_1__.settings.themeEditor.exportFileName);
             }
         });
         items.push(this.exportAction);
         if (this.creator.showInvisibleElementsInTestSurveyTab) {
-            this.invisibleToggleAction = new survey_core__WEBPACK_IMPORTED_MODULE_1__.Action({
+            this.invisibleToggleAction = new survey_core__WEBPACK_IMPORTED_MODULE_0__.Action({
                 id: "showInvisible",
                 iconName: "icon-invisible-items",
                 mode: "small",
@@ -15287,7 +15719,7 @@ var ThemeTabPlugin = /** @class */ (function () {
                 action: function () {
                     _this.model.showInvisibleElements = !_this.model.showInvisibleElements;
                     _this.invisibleToggleAction.css = _this.model.showInvisibleElements ? "sv-action-bar-item--active" : "";
-                    _this.invisibleToggleAction.title = (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_3__.getLocString)(!_this.model.showInvisibleElements ? "ts.showInvisibleElements" : "ts.hideInvisibleElements");
+                    _this.invisibleToggleAction.title = (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)(!_this.model.showInvisibleElements ? "ts.showInvisibleElements" : "ts.hideInvisibleElements");
                 }
             });
         }
@@ -15393,7 +15825,7 @@ var ThemeTabPlugin = /** @class */ (function () {
     ThemeTabPlugin.prototype.onAvailableThemesChanged = function (availableThemes) {
         var themeChooser = this.propertyGrid.survey.getQuestionByName("themeName");
         if (!!themeChooser) {
-            themeChooser.choices = availableThemes.map(function (theme) { return ({ value: theme, text: (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_3__.getLocString)("theme.names." + theme) }); });
+            themeChooser.choices = availableThemes.map(function (theme) { return ({ value: theme, text: (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)("theme.names." + theme) }); });
             if (availableThemes.indexOf(themeChooser.value) === -1) {
                 this.themeModel.setTheme(this.themeModel.defaultSessionTheme);
             }
@@ -15410,12 +15842,12 @@ var ThemeTabPlugin = /** @class */ (function () {
      */
     ThemeTabPlugin.prototype.addTheme = function (theme, setAsDefault) {
         if (setAsDefault === void 0) { setAsDefault = false; }
-        var fullThemeName = (0,_theme_model__WEBPACK_IMPORTED_MODULE_9__.getThemeFullName)(theme);
-        _themes__WEBPACK_IMPORTED_MODULE_5__.Themes[fullThemeName] = theme;
+        var fullThemeName = (0,_theme_model__WEBPACK_IMPORTED_MODULE_8__.getThemeFullName)(theme);
+        _themes__WEBPACK_IMPORTED_MODULE_4__.Themes[fullThemeName] = theme;
         if (this._availableThemes.indexOf(theme.themeName) === -1) {
             if (setAsDefault) {
                 this.availableThemes = [theme.themeName].concat(this.availableThemes);
-                _theme_model__WEBPACK_IMPORTED_MODULE_9__.ThemeModel.DefaultTheme = theme;
+                _theme_model__WEBPACK_IMPORTED_MODULE_8__.ThemeModel.DefaultTheme = theme;
             }
             else {
                 this.availableThemes = this.availableThemes.concat([theme.themeName]);
@@ -15436,18 +15868,18 @@ var ThemeTabPlugin = /** @class */ (function () {
      */
     ThemeTabPlugin.prototype.removeTheme = function (themeAccessor, includeModifications) {
         if (includeModifications === void 0) { includeModifications = false; }
-        var themeToDelete = typeof themeAccessor === "string" ? _themes__WEBPACK_IMPORTED_MODULE_5__.Themes[themeAccessor] : themeAccessor;
-        var fullThemeName = typeof themeAccessor === "string" ? themeAccessor : (0,_theme_model__WEBPACK_IMPORTED_MODULE_9__.getThemeFullName)(themeToDelete);
+        var themeToDelete = typeof themeAccessor === "string" ? _themes__WEBPACK_IMPORTED_MODULE_4__.Themes[themeAccessor] : themeAccessor;
+        var fullThemeName = typeof themeAccessor === "string" ? themeAccessor : (0,_theme_model__WEBPACK_IMPORTED_MODULE_8__.getThemeFullName)(themeToDelete);
         if (!!themeToDelete) {
-            delete _themes__WEBPACK_IMPORTED_MODULE_5__.Themes[fullThemeName];
-            if (_theme_model__WEBPACK_IMPORTED_MODULE_9__.ThemeModel.DefaultTheme === themeToDelete) {
-                _theme_model__WEBPACK_IMPORTED_MODULE_9__.ThemeModel.DefaultTheme = _themes__WEBPACK_IMPORTED_MODULE_5__.Themes["default-light"] || _themes__WEBPACK_IMPORTED_MODULE_5__.Themes[Object.keys(_themes__WEBPACK_IMPORTED_MODULE_5__.Themes)[0]];
-                this.themeModel.defaultSessionTheme = _theme_model__WEBPACK_IMPORTED_MODULE_9__.ThemeModel.DefaultTheme;
+            delete _themes__WEBPACK_IMPORTED_MODULE_4__.Themes[fullThemeName];
+            if (_theme_model__WEBPACK_IMPORTED_MODULE_8__.ThemeModel.DefaultTheme === themeToDelete) {
+                _theme_model__WEBPACK_IMPORTED_MODULE_8__.ThemeModel.DefaultTheme = _themes__WEBPACK_IMPORTED_MODULE_4__.Themes["default-light"] || _themes__WEBPACK_IMPORTED_MODULE_4__.Themes[Object.keys(_themes__WEBPACK_IMPORTED_MODULE_4__.Themes)[0]];
+                this.themeModel.defaultSessionTheme = _theme_model__WEBPACK_IMPORTED_MODULE_8__.ThemeModel.DefaultTheme;
             }
-            var registeredThemeNames = Object.keys(_themes__WEBPACK_IMPORTED_MODULE_5__.Themes);
+            var registeredThemeNames = Object.keys(_themes__WEBPACK_IMPORTED_MODULE_4__.Themes);
             var themeModifications = registeredThemeNames.filter(function (themeName) { return themeName.indexOf(themeToDelete.themeName + "-") === 0; });
             if (includeModifications && themeModifications.length > 0) {
-                themeModifications.forEach(function (themeModificationFullName) { return delete _themes__WEBPACK_IMPORTED_MODULE_5__.Themes[themeModificationFullName]; });
+                themeModifications.forEach(function (themeModificationFullName) { return delete _themes__WEBPACK_IMPORTED_MODULE_4__.Themes[themeModificationFullName]; });
             }
             if (includeModifications || themeModifications.length === 0) {
                 var themeIndex = this._availableThemes.indexOf(themeToDelete.themeName);
@@ -15475,7 +15907,7 @@ var ThemeTabPlugin = /** @class */ (function () {
         return this.getThemeChanges();
     };
     ThemeTabPlugin.prototype.getThemeChanges = function () {
-        return (0,_theme_model__WEBPACK_IMPORTED_MODULE_9__.getThemeChanges)(this.creator.theme);
+        return (0,_theme_model__WEBPACK_IMPORTED_MODULE_8__.getThemeChanges)(this.creator.theme);
     };
     Object.defineProperty(ThemeTabPlugin.prototype, "isModified", {
         /**
@@ -15493,7 +15925,7 @@ var ThemeTabPlugin = /** @class */ (function () {
         enumerable: false,
         configurable: true
     });
-    ThemeTabPlugin.DefaultTheme = _themes__WEBPACK_IMPORTED_MODULE_5__.Themes["default-light"];
+    ThemeTabPlugin.DefaultTheme = _themes__WEBPACK_IMPORTED_MODULE_4__.Themes["default-light"];
     return ThemeTabPlugin;
 }());
 
@@ -16691,7 +17123,7 @@ var TranslationGroup = /** @class */ (function (_super) {
         matrix.rows.forEach(function (row) { return rows.push({ value: row.value, text: row.text }); });
         rows.forEach(function (row) {
             matrix.columns.forEach(function (col) {
-                var locStr = cells.getCellLocText(row.value, col);
+                var locStr = cells.getCellDisplayLocText(row.value, col);
                 if (!!locStr) {
                     var name_1 = _editorLocalization__WEBPACK_IMPORTED_MODULE_3__.editorLocalization.getPropertyName(row.text, "") + ", " + _editorLocalization__WEBPACK_IMPORTED_MODULE_3__.editorLocalization.getPropertyName(col.title);
                     var item = new TranslationItem(name_1, locStr, "", _this.translation, locStr);
@@ -17436,6 +17868,24 @@ var Translation = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(Translation.prototype, "placeholderTitleText", {
+        get: function () {
+            if (this.options.isMobileView)
+                return (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_3__.getLocString)("ed.translationsPlaceholderTitleMobile");
+            return (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_3__.getLocString)("ed.translationsPlaceholderTitle");
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(Translation.prototype, "placeholderDescriptionText", {
+        get: function () {
+            if (this.options.isMobileView)
+                return (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_3__.getLocString)("ed.translationsPlaceholderDescriptionMobile");
+            return (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_3__.getLocString)("ed.translationsPlaceholderDescription");
+        },
+        enumerable: false,
+        configurable: true
+    });
     Translation.prototype.exportToCSV = function () {
         if (!this.root) {
             this.reset();
@@ -18120,7 +18570,9 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _components_string_editor__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ./components/string-editor */ "./src/components/string-editor.ts");
 /* harmony import */ var _components_tabs_theme_plugin__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ./components/tabs/theme-plugin */ "./src/components/tabs/theme-plugin.ts");
 /* harmony import */ var _survey_elements__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ./survey-elements */ "./src/survey-elements.ts");
-/* harmony import */ var _designTabSurveyThemeJSON__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ./designTabSurveyThemeJSON */ "./src/designTabSurveyThemeJSON.ts");
+/* harmony import */ var _expand_collapse_manager__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ./expand-collapse-manager */ "./src/expand-collapse-manager.ts");
+/* harmony import */ var _designTabSurveyThemeJSON__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ./designTabSurveyThemeJSON */ "./src/designTabSurveyThemeJSON.ts");
+
 
 
 
@@ -18759,6 +19211,7 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
         _this.animationEnabled = false;
         _this.onStateChanged = _this.addCreatorEvent();
         _this.onSurfaceToolbarActionExecuted = _this.addCreatorEvent();
+        _this.expandCollapseManager = new _expand_collapse_manager__WEBPACK_IMPORTED_MODULE_25__.ExpandCollapseManager(_this);
         _this.notifier = new survey_core__WEBPACK_IMPORTED_MODULE_1__.Notifier({
             root: "svc-notifier",
             rootWithButtons: "",
@@ -19984,6 +20437,7 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
         }
         this.existingPages = {};
         var survey = this.createSurvey({}, "designer", undefined, function (survey) {
+            survey.skeletonHeight = 188;
             survey.css = survey_core__WEBPACK_IMPORTED_MODULE_1__.defaultV2Css;
             survey.setIsMobile(!!_this.isMobileView);
             survey.setDesignMode(true);
@@ -20299,7 +20753,7 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
     });
     Object.defineProperty(SurveyCreatorModel.prototype, "designTabSurveyThemeVariables", {
         get: function () {
-            return _designTabSurveyThemeJSON__WEBPACK_IMPORTED_MODULE_25__["default"].cssVariables;
+            return _designTabSurveyThemeJSON__WEBPACK_IMPORTED_MODULE_26__["default"].cssVariables;
         },
         enumerable: false,
         configurable: true
@@ -20330,7 +20784,7 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
         var survey = this.createSurveyCore(json, reason);
         if (reason !== "designer" && reason !== "test" && reason !== "theme") {
             survey.fitToContainer = false;
-            survey.applyTheme(_designTabSurveyThemeJSON__WEBPACK_IMPORTED_MODULE_25__["default"]);
+            survey.applyTheme(_designTabSurveyThemeJSON__WEBPACK_IMPORTED_MODULE_26__["default"]);
             survey.gridLayoutEnabled = false;
         }
         if (reason === "designer" || reason === "modal-question-editor") {
@@ -20890,19 +21344,26 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
             return;
         clearInterval(this.currentFocusInterval);
         clearTimeout(this.currentFocusTimeout);
-        if (this.animationEnabled && this.survey.isLazyRendering) {
-            this.survey.disableLazyRenderingBeforeElement(selEl);
-        }
         this.currentFocusTimeout = setTimeout(function () {
             _this.currentFocusInterval = setInterval(function () {
-                var _a;
+                var _a, _b;
                 var el = document.getElementById(selEl.id);
                 if (!!selEl && (focus || startEdit && (!selEl.hasTitle || selEl.isPanel))) {
                     if (!el || _this.rootElement.getAnimations({ subtree: true }).filter((function (animation) { return animation.effect.getComputedTiming().activeDuration !== Infinity && (animation.pending || animation.playState !== "finished"); }))[0])
                         return;
                     clearInterval(_this.currentFocusInterval);
                     if (!!el) {
-                        _survey_helper__WEBPACK_IMPORTED_MODULE_9__.SurveyHelper.scrollIntoViewIfNeeded((_a = el.parentElement) !== null && _a !== void 0 ? _a : el, function () { return { block: "start", behavior: _this.animationEnabled ? "smooth" : undefined }; }, true);
+                        var isNeedScroll = _survey_helper__WEBPACK_IMPORTED_MODULE_9__.SurveyHelper.isNeedScrollIntoView((_a = el.parentElement) !== null && _a !== void 0 ? _a : el, true);
+                        if (!!isNeedScroll) {
+                            var elementPage = _this.getPageByElement(selEl);
+                            var scrollIntoViewOptions_1 = { block: "start", behavior: _this.animationEnabled ? "smooth" : undefined };
+                            if (!!elementPage) {
+                                _this.survey.scrollElementToTop(selEl, undefined, elementPage, selEl.id, true, scrollIntoViewOptions_1, _this.rootElement);
+                            }
+                            else {
+                                _survey_helper__WEBPACK_IMPORTED_MODULE_9__.SurveyHelper.scrollIntoViewIfNeeded((_b = el.parentElement) !== null && _b !== void 0 ? _b : el, function () { return scrollIntoViewOptions_1; }, true);
+                            }
+                        }
                         if (!propertyName && el.parentElement) {
                             var elToFocus = (typeof (focus) === "string") ? el.parentElement.querySelector(focus) : el.parentElement;
                             elToFocus && elToFocus.focus({ preventScroll: true });
@@ -24087,6 +24548,46 @@ var __spreadArray = function (to, from) {
 };
 
 
+/***/ }),
+
+/***/ "./src/expand-collapse-manager.ts":
+/*!****************************************!*\
+  !*** ./src/expand-collapse-manager.ts ***!
+  \****************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   ExpandCollapseManager: () => (/* binding */ ExpandCollapseManager)
+/* harmony export */ });
+var ExpandCollapseManager = /** @class */ (function () {
+    function ExpandCollapseManager(creator) {
+        var _this = this;
+        this.adorners = [];
+        creator.onSurfaceToolbarActionExecuted.add(function (_, options) {
+            var isCollapseAction = options.action.id == "collapseAll";
+            var isExpandAction = options.action.id == "expandAll";
+            if (isCollapseAction || isExpandAction) {
+                for (var i = _this.adorners.length - 1; i >= 0; i--) {
+                    if (_this.adorners[i].allowExpandCollapse) {
+                        _this.adorners[i].collapsed = isCollapseAction;
+                    }
+                }
+            }
+        });
+    }
+    ExpandCollapseManager.prototype.add = function (adorner) {
+        this.adorners.push(adorner);
+    };
+    ExpandCollapseManager.prototype.remove = function (adorner) {
+        this.adorners.splice(this.adorners.indexOf(adorner), 1);
+    };
+    return ExpandCollapseManager;
+}());
+
+
+
 /***/ }),
 
 /***/ "./src/expressionToDisplayText.ts":
@@ -25246,6 +25747,18 @@ var enStrings = {
         pagePlaceHolder: "The page is empty. Drag an element from the toolbox or click the button below.",
         imagePlaceHolder: "Drag and drop an image here or click the button below and choose an image to upload",
         surveyPlaceHolderMobile: "Click the \"Add Question\" button below to start creating your form.",
+        surveyPlaceholderTitle: "Your form is empty",
+        surveyPlaceholderTitleMobile: "Your form is empty",
+        surveyPlaceholderDescription: "Drag an element from the toolbox or click the button below.",
+        surveyPlaceholderDescriptionMobile: "Drag an element from the toolbox or click the button below.",
+        previewPlaceholderTitle: "No preview",
+        previewPlaceholderTitleMobile: "No preview",
+        previewPlaceholderDescription: "The survey doesn't contain any visible elements.",
+        previewPlaceholderDescriptionMobile: "The survey doesn't contain any visible elements.",
+        translationsPlaceholderTitle: "No strings to translate",
+        translationsPlaceholderTitleMobile: "No strings to translate",
+        translationsPlaceholderDescription: "Add elements to your form or change the strings filter in the toolbar.",
+        translationsPlaceholderDescriptionMobile: "Add elements to your form or change the strings filter in the toolbar.",
         pagePlaceHolderMobile: "Click the \"Add Question\" button below to add a new element to the page.",
         panelPlaceHolderMobile: "Click the \"Add Question\" button below to add a new element to the panel.",
         imagePlaceHolderMobile: "Click the button below and choose an image to upload",
@@ -25258,6 +25771,10 @@ var enStrings = {
         lg: {
             addNewItem: "Add New Rule",
             empty_tab: "Create a rule to customize the flow of the survey.",
+            logicPlaceholderTitle: "No logical rules",
+            logicPlaceholderTitleMobile: "No logical rules",
+            logicPlaceholderDescription: "Create a rule to customize the flow of the survey.",
+            logicPlaceholderDescriptionMobile: "Create a rule to customize the flow of the survey.",
             page_visibilityName: "Show/hide page",
             page_enableName: "Enable/disable page",
             page_requireName: "Make page required",
@@ -25939,6 +26456,7 @@ var enStrings = {
             fontSize: "Survey font size",
             scale: "Survey scale factor",
             cornerRadius: "Corner radius",
+            advancedMode: "Advanced mode",
             pageTitle: "Title font",
             pageDescription: "Description font",
             questionTitle: "Title font",
@@ -26575,6 +27093,7 @@ var enStrings = {
             inheritWidthFrom: "The \"Same as container\" option auto-adjusts the header content area width to fit into the HTML element the survey is placed in.",
             textAreaWidth: "The width of the header area that contains the survey title and description, measured in pixels.",
             overlapEnabled: "Makes the bottom of the header overlaid with the top of the survey.",
+            mobileHeight: "When set to 0, the height is calculated automatically to accommodate the header's content.",
         },
         panellayoutcolumn: {
             effectiveWidth: "Accepts values %.",
@@ -26662,6 +27181,7 @@ var enStrings = {
         imageFit: "Image and thumbnail fit",
         altText: "Alt text",
         height: "Height",
+        mobileHeight: "Height on smartphones",
         penColor: "Pen color",
         backgroundColor: "Background color",
         templateElements: "Template elements",
@@ -30133,6 +30653,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   PropertyGridEditorString: () => (/* binding */ PropertyGridEditorString),
 /* harmony export */   PropertyGridEditorStringArray: () => (/* binding */ PropertyGridEditorStringArray),
 /* harmony export */   PropertyGridEditorStringBase: () => (/* binding */ PropertyGridEditorStringBase),
+/* harmony export */   PropertyGridEditorSwitchToggle: () => (/* binding */ PropertyGridEditorSwitchToggle),
 /* harmony export */   PropertyGridEditorText: () => (/* binding */ PropertyGridEditorText),
 /* harmony export */   PropertyGridEditorUndefinedBoolean: () => (/* binding */ PropertyGridEditorUndefinedBoolean),
 /* harmony export */   PropertyGridLinkEditor: () => (/* binding */ PropertyGridLinkEditor),
@@ -31455,6 +31976,39 @@ var PropertyGridEditorBoolean = /** @class */ (function (_super) {
     return PropertyGridEditorBoolean;
 }(PropertyGridEditor));
 
+var PropertyGridEditorSwitchToggle = /** @class */ (function (_super) {
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__extends)(PropertyGridEditorSwitchToggle, _super);
+    function PropertyGridEditorSwitchToggle() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    PropertyGridEditorSwitchToggle.prototype.fit = function (prop, context) {
+        return prop.type == "switchToggle";
+    };
+    PropertyGridEditorSwitchToggle.prototype.getJSON = function (obj, prop, options) {
+        var res = {
+            type: "boolean",
+            default: false,
+        };
+        var choices = prop.getChoices(obj, function (choices) { });
+        if (Array.isArray(choices) && choices.length >= 2) {
+            var jsonChoices = [];
+            for (var i = 0; i < 2; i++) {
+                var val = choices[i].value || choices[i];
+                jsonChoices.push({ value: val, text: _editorLocalization__WEBPACK_IMPORTED_MODULE_2__.editorLocalization.getPropertyValueInEditor(prop.name, val) });
+            }
+            var defaultValue = prop.getDefaultValue(obj) || jsonChoices[0].value;
+            var indexTrue = defaultValue === choices[1].value ? 1 : 0;
+            var indexFalse = indexTrue === 0 ? 1 : 0;
+            res.valueTrue = jsonChoices[indexTrue].value;
+            res.valueFalse = jsonChoices[indexFalse].value;
+            res.labelTrue = jsonChoices[indexTrue].text;
+            res.labelFalse = jsonChoices[indexFalse].text;
+        }
+        return res;
+    };
+    return PropertyGridEditorSwitchToggle;
+}(PropertyGridEditor));
+
 var PropertyGridEditorUndefinedBoolean = /** @class */ (function (_super) {
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__extends)(PropertyGridEditorUndefinedBoolean, _super);
     function PropertyGridEditorUndefinedBoolean() {
@@ -32124,6 +32678,7 @@ PropertyGridEditorCollection.register(new PropertyGridEditorColor());
 PropertyGridEditorCollection.register(new PropertyGridEditorColorWithAlpha());
 PropertyGridEditorCollection.register(new PropertyGridEditorDateTime());
 PropertyGridEditorCollection.register(new PropertyGridEditorUndefinedBoolean());
+PropertyGridEditorCollection.register(new PropertyGridEditorSwitchToggle());
 survey_core__WEBPACK_IMPORTED_MODULE_1__.QuestionFactory.Instance.registerQuestion("buttongroup", function (name) {
     return new survey_core__WEBPACK_IMPORTED_MODULE_1__.QuestionButtonGroupModel(name);
 }, false);
@@ -36666,7 +37221,7 @@ var SurveyHelper = /** @class */ (function () {
             return false;
         return true;
     };
-    SurveyHelper.scrollIntoViewIfNeeded = function (el, getOptions, scrollIfElementBiggerThanContainer) {
+    SurveyHelper.isNeedScrollIntoView = function (el, scrollIfElementBiggerThanContainer) {
         if (scrollIfElementBiggerThanContainer === void 0) { scrollIfElementBiggerThanContainer = false; }
         if (!el || !el.scrollIntoView)
             return;
@@ -36676,15 +37231,23 @@ var SurveyHelper = /** @class */ (function () {
             return;
         var height = scrollableDiv.clientHeight;
         if (rect.top < scrollableDiv.offsetTop) {
-            el.scrollIntoView(getOptions ? getOptions(true) : true);
+            return "top";
         }
         else {
             var offsetTop = height + scrollableDiv.offsetTop;
             if (rect.bottom > offsetTop && (rect.height < height || scrollIfElementBiggerThanContainer)) {
-                el.scrollIntoView(getOptions ? getOptions(false) : false);
+                return "bottom";
             }
         }
     };
+    SurveyHelper.scrollIntoViewIfNeeded = function (el, getOptions, scrollIfElementBiggerThanContainer) {
+        if (scrollIfElementBiggerThanContainer === void 0) { scrollIfElementBiggerThanContainer = false; }
+        var isNeedScroll = SurveyHelper.isNeedScrollIntoView(el, scrollIfElementBiggerThanContainer);
+        if (!isNeedScroll)
+            return;
+        var isNeedScrollToTop = isNeedScroll === "top";
+        el.scrollIntoView(getOptions ? getOptions(isNeedScrollToTop) : isNeedScrollToTop);
+    };
     SurveyHelper.getScrollableDiv = function (el) {
         while (!!el) {
             if (!!el.id && el.id.indexOf("scrollableDiv") > -1)
@@ -37930,9 +38493,10 @@ var QuestionToolbox = /** @class */ (function (_super) {
         var newItems = property.choices.map(function (ch) {
             var newJson = (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__assign)({}, parentItem.json);
             newJson[propName] = ch;
+            var newId = parentItem.id != ch ? ch : parentItem.id + "-default";
             var innerItem = new QuestionToolboxItem({
-                id: ch,
-                name: ch,
+                id: newId,
+                name: newId,
                 title: _editorLocalization__WEBPACK_IMPORTED_MODULE_2__.editorLocalization.getPropertyValueInEditor(propName, ch),
                 className: QuestionToolboxItem.getItemClassNames() + " svc-toolbox__item-subtype",
                 json: newJson,
@@ -38520,7 +39084,7 @@ var QuestionToolbox = /** @class */ (function (_super) {
         var iconName = json.iconName ? json.iconName : QuestionToolbox.defaultIconName;
         var title = _editorLocalization__WEBPACK_IMPORTED_MODULE_2__.editorLocalization.getString("qt." + json.name);
         if (!title || title == json.name) {
-            title = json.title;
+            title = this.getTitleFromJsonTitle(json.title, json.name);
         }
         if (!title) {
             title = json.name;
@@ -38544,6 +39108,21 @@ var QuestionToolbox = /** @class */ (function (_super) {
         });
         return this.getOrCreateToolboxItem(item);
     };
+    QuestionToolbox.prototype.getTitleFromJsonTitle = function (title, name) {
+        if (!title)
+            return title;
+        if (typeof title === "string")
+            return title;
+        if (typeof title !== "object")
+            return title;
+        for (var key in title) {
+            var loc = _editorLocalization__WEBPACK_IMPORTED_MODULE_2__.editorLocalization.locales[key];
+            if (title[key] && loc && loc.qt) {
+                loc.qt[name] = title[key];
+            }
+        }
+        return _editorLocalization__WEBPACK_IMPORTED_MODULE_2__.editorLocalization.getString("qt." + name);
+    };
     QuestionToolbox.prototype.getQuestionJSON = function (question) {
         var json = new survey_core__WEBPACK_IMPORTED_MODULE_1__.JsonObject().toJsonObject(question);
         json.type = question.getType();
@@ -39671,24 +40250,24 @@ var __webpack_exports__ = {};
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   AceJsonEditorModel: () => (/* reexport safe */ _components_tabs_json_editor_ace__WEBPACK_IMPORTED_MODULE_6__.AceJsonEditorModel),
-/* harmony export */   ColorCalculator: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.ColorCalculator),
+/* harmony export */   ColorCalculator: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.ColorCalculator),
 /* harmony export */   CreatorAction: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.CreatorAction),
 /* harmony export */   CreatorBase: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.CreatorBase),
 /* harmony export */   CreatorEvent: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.CreatorEvent),
-/* harmony export */   CreatorPreset: () => (/* reexport safe */ _presets_presets__WEBPACK_IMPORTED_MODULE_82__.CreatorPreset),
-/* harmony export */   CreatorPresetBase: () => (/* reexport safe */ _presets_presets_base__WEBPACK_IMPORTED_MODULE_81__.CreatorPresetBase),
-/* harmony export */   CreatorPresetPropertyGrid: () => (/* reexport safe */ _presets_presets_properties__WEBPACK_IMPORTED_MODULE_83__.CreatorPresetPropertyGrid),
-/* harmony export */   CreatorPresetPropertyGridDefinition: () => (/* reexport safe */ _presets_presets_properties__WEBPACK_IMPORTED_MODULE_83__.CreatorPresetPropertyGridDefinition),
-/* harmony export */   CreatorPresetTabs: () => (/* reexport safe */ _presets_presets_tabs__WEBPACK_IMPORTED_MODULE_84__.CreatorPresetTabs),
-/* harmony export */   CreatorPresetToolbox: () => (/* reexport safe */ _presets_presets_toolbox__WEBPACK_IMPORTED_MODULE_85__.CreatorPresetToolbox),
-/* harmony export */   CreatorPresetToolboxConfigurator: () => (/* reexport safe */ _presets_presets_toolbox__WEBPACK_IMPORTED_MODULE_85__.CreatorPresetToolboxConfigurator),
-/* harmony export */   CreatorPresetToolboxDefinition: () => (/* reexport safe */ _presets_presets_toolbox__WEBPACK_IMPORTED_MODULE_85__.CreatorPresetToolboxDefinition),
+/* harmony export */   CreatorPreset: () => (/* reexport safe */ _presets_presets__WEBPACK_IMPORTED_MODULE_83__.CreatorPreset),
+/* harmony export */   CreatorPresetBase: () => (/* reexport safe */ _presets_presets_base__WEBPACK_IMPORTED_MODULE_82__.CreatorPresetBase),
+/* harmony export */   CreatorPresetPropertyGrid: () => (/* reexport safe */ _presets_presets_properties__WEBPACK_IMPORTED_MODULE_84__.CreatorPresetPropertyGrid),
+/* harmony export */   CreatorPresetPropertyGridDefinition: () => (/* reexport safe */ _presets_presets_properties__WEBPACK_IMPORTED_MODULE_84__.CreatorPresetPropertyGridDefinition),
+/* harmony export */   CreatorPresetTabs: () => (/* reexport safe */ _presets_presets_tabs__WEBPACK_IMPORTED_MODULE_85__.CreatorPresetTabs),
+/* harmony export */   CreatorPresetToolbox: () => (/* reexport safe */ _presets_presets_toolbox__WEBPACK_IMPORTED_MODULE_86__.CreatorPresetToolbox),
+/* harmony export */   CreatorPresetToolboxConfigurator: () => (/* reexport safe */ _presets_presets_toolbox__WEBPACK_IMPORTED_MODULE_86__.CreatorPresetToolboxConfigurator),
+/* harmony export */   CreatorPresetToolboxDefinition: () => (/* reexport safe */ _presets_presets_toolbox__WEBPACK_IMPORTED_MODULE_86__.CreatorPresetToolboxDefinition),
 /* harmony export */   CreatorResponsivityManager: () => (/* reexport safe */ _creator_responsivity_manager__WEBPACK_IMPORTED_MODULE_5__.CreatorResponsivityManager),
 /* harmony export */   DEFAULT_MONITOR_DPI: () => (/* reexport safe */ _components_simulator__WEBPACK_IMPORTED_MODULE_39__.DEFAULT_MONITOR_DPI),
 /* harmony export */   DefaultFonts: () => (/* reexport safe */ _components_tabs_theme_custom_questions_font_settings__WEBPACK_IMPORTED_MODULE_13__.DefaultFonts),
 /* harmony export */   EditorLocalization: () => (/* reexport safe */ _editorLocalization__WEBPACK_IMPORTED_MODULE_1__.EditorLocalization),
 /* harmony export */   EmptySurveyCreatorOptions: () => (/* reexport safe */ _creator_settings__WEBPACK_IMPORTED_MODULE_2__.EmptySurveyCreatorOptions),
-/* harmony export */   HSBToRGB: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.HSBToRGB),
+/* harmony export */   HSBToRGB: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.HSBToRGB),
 /* harmony export */   ImageItemValueWrapperViewModel: () => (/* reexport safe */ _components_image_item_value__WEBPACK_IMPORTED_MODULE_37__.ImageItemValueWrapperViewModel),
 /* harmony export */   ItemValueWrapperViewModel: () => (/* reexport safe */ _components_item_value__WEBPACK_IMPORTED_MODULE_36__.ItemValueWrapperViewModel),
 /* harmony export */   JsonDuplicateNameError: () => (/* reexport safe */ _textWorker__WEBPACK_IMPORTED_MODULE_65__.JsonDuplicateNameError),
@@ -39697,14 +40276,14 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   LogoImageViewModel: () => (/* reexport safe */ _components_header_logo_image__WEBPACK_IMPORTED_MODULE_41__.LogoImageViewModel),
 /* harmony export */   MatrixCellWrapperEditSurvey: () => (/* reexport safe */ _components_matrix_cell__WEBPACK_IMPORTED_MODULE_38__.MatrixCellWrapperEditSurvey),
 /* harmony export */   MatrixCellWrapperViewModel: () => (/* reexport safe */ _components_matrix_cell__WEBPACK_IMPORTED_MODULE_38__.MatrixCellWrapperViewModel),
-/* harmony export */   MenuButton: () => (/* reexport safe */ _utils_actions__WEBPACK_IMPORTED_MODULE_73__.MenuButton),
-/* harmony export */   ObjType: () => (/* reexport safe */ _survey_helper__WEBPACK_IMPORTED_MODULE_76__.ObjType),
+/* harmony export */   MenuButton: () => (/* reexport safe */ _utils_actions__WEBPACK_IMPORTED_MODULE_74__.MenuButton),
+/* harmony export */   ObjType: () => (/* reexport safe */ _survey_helper__WEBPACK_IMPORTED_MODULE_77__.ObjType),
 /* harmony export */   ObjectSelector: () => (/* reexport safe */ _property_grid_object_selector__WEBPACK_IMPORTED_MODULE_55__.ObjectSelector),
 /* harmony export */   ObjectSelectorItem: () => (/* reexport safe */ _property_grid_object_selector__WEBPACK_IMPORTED_MODULE_55__.ObjectSelectorItem),
 /* harmony export */   ObjectSelectorModel: () => (/* reexport safe */ _property_grid_object_selector__WEBPACK_IMPORTED_MODULE_55__.ObjectSelectorModel),
 /* harmony export */   PageAdorner: () => (/* reexport safe */ _components_page__WEBPACK_IMPORTED_MODULE_30__.PageAdorner),
 /* harmony export */   PageNavigatorViewModel: () => (/* reexport safe */ _components_page_navigator_page_navigator__WEBPACK_IMPORTED_MODULE_29__.PageNavigatorViewModel),
-/* harmony export */   PagesController: () => (/* reexport safe */ _pages_controller__WEBPACK_IMPORTED_MODULE_80__.PagesController),
+/* harmony export */   PagesController: () => (/* reexport safe */ _pages_controller__WEBPACK_IMPORTED_MODULE_81__.PagesController),
 /* harmony export */   PredefinedColors: () => (/* reexport safe */ _components_tabs_themes__WEBPACK_IMPORTED_MODULE_15__.PredefinedColors),
 /* harmony export */   PredefinedThemes: () => (/* reexport safe */ _components_tabs_themes__WEBPACK_IMPORTED_MODULE_15__.PredefinedThemes),
 /* harmony export */   PropertyEditorSetupValue: () => (/* reexport safe */ _property_grid__WEBPACK_IMPORTED_MODULE_50__.PropertyEditorSetupValue),
@@ -39751,6 +40330,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   PropertyGridEditorString: () => (/* reexport safe */ _property_grid__WEBPACK_IMPORTED_MODULE_50__.PropertyGridEditorString),
 /* harmony export */   PropertyGridEditorStringArray: () => (/* reexport safe */ _property_grid__WEBPACK_IMPORTED_MODULE_50__.PropertyGridEditorStringArray),
 /* harmony export */   PropertyGridEditorStringBase: () => (/* reexport safe */ _property_grid__WEBPACK_IMPORTED_MODULE_50__.PropertyGridEditorStringBase),
+/* harmony export */   PropertyGridEditorSwitchToggle: () => (/* reexport safe */ _property_grid__WEBPACK_IMPORTED_MODULE_50__.PropertyGridEditorSwitchToggle),
 /* harmony export */   PropertyGridEditorText: () => (/* reexport safe */ _property_grid__WEBPACK_IMPORTED_MODULE_50__.PropertyGridEditorText),
 /* harmony export */   PropertyGridEditorUndefinedBoolean: () => (/* reexport safe */ _property_grid__WEBPACK_IMPORTED_MODULE_50__.PropertyGridEditorUndefinedBoolean),
 /* harmony export */   PropertyGridLinkEditor: () => (/* reexport safe */ _property_grid__WEBPACK_IMPORTED_MODULE_50__.PropertyGridLinkEditor),
@@ -39780,28 +40360,29 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   QuestionToolbox: () => (/* reexport safe */ _toolbox__WEBPACK_IMPORTED_MODULE_66__.QuestionToolbox),
 /* harmony export */   QuestionToolboxCategory: () => (/* reexport safe */ _toolbox__WEBPACK_IMPORTED_MODULE_66__.QuestionToolboxCategory),
 /* harmony export */   QuestionToolboxItem: () => (/* reexport safe */ _toolbox__WEBPACK_IMPORTED_MODULE_66__.QuestionToolboxItem),
-/* harmony export */   RGBToHSB: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.RGBToHSB),
+/* harmony export */   RGBToHSB: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.RGBToHSB),
 /* harmony export */   ResetValueAdorner: () => (/* reexport safe */ _custom_questions_question_text_with_reset__WEBPACK_IMPORTED_MODULE_49__.ResetValueAdorner),
-/* harmony export */   ResizeManager: () => (/* reexport safe */ _utils_resizer__WEBPACK_IMPORTED_MODULE_77__.ResizeManager),
+/* harmony export */   ResizeManager: () => (/* reexport safe */ _utils_resizer__WEBPACK_IMPORTED_MODULE_78__.ResizeManager),
 /* harmony export */   RowViewModel: () => (/* reexport safe */ _components_row__WEBPACK_IMPORTED_MODULE_31__.RowViewModel),
 /* harmony export */   SearchManager: () => (/* reexport safe */ _property_grid_search_manager__WEBPACK_IMPORTED_MODULE_59__.SearchManager),
 /* harmony export */   SearchManagerPropertyGrid: () => (/* reexport safe */ _property_grid_search_manager__WEBPACK_IMPORTED_MODULE_59__.SearchManagerPropertyGrid),
 /* harmony export */   SearchManagerToolbox: () => (/* reexport safe */ _property_grid_search_manager__WEBPACK_IMPORTED_MODULE_59__.SearchManagerToolbox),
+/* harmony export */   SidebarHeaderModel: () => (/* reexport safe */ _components_side_bar_side_bar_header_model__WEBPACK_IMPORTED_MODULE_68__.SidebarHeaderModel),
 /* harmony export */   SidebarModel: () => (/* reexport safe */ _components_side_bar_side_bar_model__WEBPACK_IMPORTED_MODULE_67__.SidebarModel),
-/* harmony export */   SidebarPageModel: () => (/* reexport safe */ _components_side_bar_side_bar_page_model__WEBPACK_IMPORTED_MODULE_68__.SidebarPageModel),
+/* harmony export */   SidebarPageModel: () => (/* reexport safe */ _components_side_bar_side_bar_page_model__WEBPACK_IMPORTED_MODULE_69__.SidebarPageModel),
 /* harmony export */   StringEditorConnector: () => (/* reexport safe */ _components_string_editor__WEBPACK_IMPORTED_MODULE_42__.StringEditorConnector),
 /* harmony export */   StringEditorViewModelBase: () => (/* reexport safe */ _components_string_editor__WEBPACK_IMPORTED_MODULE_42__.StringEditorViewModelBase),
 /* harmony export */   StringItemsNavigatorBase: () => (/* reexport safe */ _components_string_editor__WEBPACK_IMPORTED_MODULE_42__.StringItemsNavigatorBase),
 /* harmony export */   StylesManager: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.StylesManager),
 /* harmony export */   SurveyCreatorModel: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.SurveyCreatorModel),
-/* harmony export */   SurveyHelper: () => (/* reexport safe */ _survey_helper__WEBPACK_IMPORTED_MODULE_76__.SurveyHelper),
+/* harmony export */   SurveyHelper: () => (/* reexport safe */ _survey_helper__WEBPACK_IMPORTED_MODULE_77__.SurveyHelper),
 /* harmony export */   SurveyJSON5: () => (/* reexport safe */ _json5__WEBPACK_IMPORTED_MODULE_45__.SurveyJSON5),
 /* harmony export */   SurveyLogic: () => (/* reexport safe */ _components_tabs_logic__WEBPACK_IMPORTED_MODULE_19__.SurveyLogic),
 /* harmony export */   SurveyLogicUI: () => (/* reexport safe */ _components_tabs_logic_ui__WEBPACK_IMPORTED_MODULE_25__.SurveyLogicUI),
-/* harmony export */   SurveyQuestionEditorDefinition: () => (/* reexport safe */ _question_editor_definition__WEBPACK_IMPORTED_MODULE_74__.SurveyQuestionEditorDefinition),
-/* harmony export */   SurveyQuestionEditorPropertyDefinition: () => (/* reexport safe */ _question_editor_properties__WEBPACK_IMPORTED_MODULE_75__.SurveyQuestionEditorPropertyDefinition),
-/* harmony export */   SurveyQuestionEditorTabDefinition: () => (/* reexport safe */ _question_editor_properties__WEBPACK_IMPORTED_MODULE_75__.SurveyQuestionEditorTabDefinition),
-/* harmony export */   SurveyQuestionProperties: () => (/* reexport safe */ _question_editor_properties__WEBPACK_IMPORTED_MODULE_75__.SurveyQuestionProperties),
+/* harmony export */   SurveyQuestionEditorDefinition: () => (/* reexport safe */ _question_editor_definition__WEBPACK_IMPORTED_MODULE_75__.SurveyQuestionEditorDefinition),
+/* harmony export */   SurveyQuestionEditorPropertyDefinition: () => (/* reexport safe */ _question_editor_properties__WEBPACK_IMPORTED_MODULE_76__.SurveyQuestionEditorPropertyDefinition),
+/* harmony export */   SurveyQuestionEditorTabDefinition: () => (/* reexport safe */ _question_editor_properties__WEBPACK_IMPORTED_MODULE_76__.SurveyQuestionEditorTabDefinition),
+/* harmony export */   SurveyQuestionProperties: () => (/* reexport safe */ _question_editor_properties__WEBPACK_IMPORTED_MODULE_76__.SurveyQuestionProperties),
 /* harmony export */   SurveyResultsItemModel: () => (/* reexport safe */ _components_results__WEBPACK_IMPORTED_MODULE_40__.SurveyResultsItemModel),
 /* harmony export */   SurveyResultsModel: () => (/* reexport safe */ _components_results__WEBPACK_IMPORTED_MODULE_40__.SurveyResultsModel),
 /* harmony export */   SurveySimulatorModel: () => (/* reexport safe */ _components_simulator__WEBPACK_IMPORTED_MODULE_39__.SurveySimulatorModel),
@@ -39809,8 +40390,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   SurveyTextWorkerError: () => (/* reexport safe */ _textWorker__WEBPACK_IMPORTED_MODULE_65__.SurveyTextWorkerError),
 /* harmony export */   SurveyTextWorkerJsonError: () => (/* reexport safe */ _textWorker__WEBPACK_IMPORTED_MODULE_65__.SurveyTextWorkerJsonError),
 /* harmony export */   SurveyTextWorkerParserError: () => (/* reexport safe */ _textWorker__WEBPACK_IMPORTED_MODULE_65__.SurveyTextWorkerParserError),
-/* harmony export */   Switcher: () => (/* reexport safe */ _components_switcher_switcher__WEBPACK_IMPORTED_MODULE_70__.Switcher),
-/* harmony export */   TabControlModel: () => (/* reexport safe */ _components_side_bar_tab_control_model__WEBPACK_IMPORTED_MODULE_69__.TabControlModel),
+/* harmony export */   Switcher: () => (/* reexport safe */ _components_switcher_switcher__WEBPACK_IMPORTED_MODULE_71__.Switcher),
+/* harmony export */   TabControlModel: () => (/* reexport safe */ _components_side_bar_tab_control_model__WEBPACK_IMPORTED_MODULE_70__.TabControlModel),
 /* harmony export */   TabDesignerPlugin: () => (/* reexport safe */ _components_tabs_designer_plugin__WEBPACK_IMPORTED_MODULE_24__.TabDesignerPlugin),
 /* harmony export */   TabDesignerViewModel: () => (/* reexport safe */ _components_tabs_designer__WEBPACK_IMPORTED_MODULE_23__.TabDesignerViewModel),
 /* harmony export */   TabJsonEditorAcePlugin: () => (/* reexport safe */ _components_tabs_json_editor_ace__WEBPACK_IMPORTED_MODULE_6__.TabJsonEditorAcePlugin),
@@ -39829,7 +40410,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   Themes: () => (/* reexport safe */ _components_tabs_themes__WEBPACK_IMPORTED_MODULE_15__.Themes),
 /* harmony export */   ToolbarActionContainer: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.ToolbarActionContainer),
 /* harmony export */   ToolboxToolViewModel: () => (/* reexport safe */ _components_toolbox_toolbox_tool__WEBPACK_IMPORTED_MODULE_28__.ToolboxToolViewModel),
-/* harmony export */   Transaction: () => (/* reexport safe */ _plugins_undo_redo_undo_redo_manager__WEBPACK_IMPORTED_MODULE_79__.Transaction),
+/* harmony export */   Transaction: () => (/* reexport safe */ _plugins_undo_redo_undo_redo_manager__WEBPACK_IMPORTED_MODULE_80__.Transaction),
 /* harmony export */   Translation: () => (/* reexport safe */ _components_tabs_translation__WEBPACK_IMPORTED_MODULE_20__.Translation),
 /* harmony export */   TranslationEditor: () => (/* reexport safe */ _components_tabs_translation__WEBPACK_IMPORTED_MODULE_20__.TranslationEditor),
 /* harmony export */   TranslationForEditor: () => (/* reexport safe */ _components_tabs_translation__WEBPACK_IMPORTED_MODULE_20__.TranslationForEditor),
@@ -39837,84 +40418,85 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   TranslationItem: () => (/* reexport safe */ _components_tabs_translation__WEBPACK_IMPORTED_MODULE_20__.TranslationItem),
 /* harmony export */   TranslationItemBase: () => (/* reexport safe */ _components_tabs_translation__WEBPACK_IMPORTED_MODULE_20__.TranslationItemBase),
 /* harmony export */   TranslationItemString: () => (/* reexport safe */ _components_tabs_translation__WEBPACK_IMPORTED_MODULE_20__.TranslationItemString),
-/* harmony export */   UndoRedoAction: () => (/* reexport safe */ _plugins_undo_redo_undo_redo_manager__WEBPACK_IMPORTED_MODULE_79__.UndoRedoAction),
-/* harmony export */   UndoRedoArrayAction: () => (/* reexport safe */ _plugins_undo_redo_undo_redo_manager__WEBPACK_IMPORTED_MODULE_79__.UndoRedoArrayAction),
-/* harmony export */   UndoRedoManager: () => (/* reexport safe */ _plugins_undo_redo_undo_redo_manager__WEBPACK_IMPORTED_MODULE_79__.UndoRedoManager),
-/* harmony export */   UndoRedoPlugin: () => (/* reexport safe */ _plugins_undo_redo__WEBPACK_IMPORTED_MODULE_78__.UndoRedoPlugin),
+/* harmony export */   UndoRedoAction: () => (/* reexport safe */ _plugins_undo_redo_undo_redo_manager__WEBPACK_IMPORTED_MODULE_80__.UndoRedoAction),
+/* harmony export */   UndoRedoArrayAction: () => (/* reexport safe */ _plugins_undo_redo_undo_redo_manager__WEBPACK_IMPORTED_MODULE_80__.UndoRedoArrayAction),
+/* harmony export */   UndoRedoManager: () => (/* reexport safe */ _plugins_undo_redo_undo_redo_manager__WEBPACK_IMPORTED_MODULE_80__.UndoRedoManager),
+/* harmony export */   UndoRedoPlugin: () => (/* reexport safe */ _plugins_undo_redo__WEBPACK_IMPORTED_MODULE_79__.UndoRedoPlugin),
 /* harmony export */   Version: () => (/* binding */ Version),
-/* harmony export */   assign: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.assign),
-/* harmony export */   assignDefaultV2Classes: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.assignDefaultV2Classes),
+/* harmony export */   assign: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.assign),
+/* harmony export */   assignDefaultV2Classes: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.assignDefaultV2Classes),
 /* harmony export */   backgroundCornerRadiusFromCssVariable: () => (/* reexport safe */ _components_tabs_theme_custom_questions_background_corner_radius__WEBPACK_IMPORTED_MODULE_14__.backgroundCornerRadiusFromCssVariable),
 /* harmony export */   backgroundCornerRadiusToCssVariable: () => (/* reexport safe */ _components_tabs_theme_custom_questions_background_corner_radius__WEBPACK_IMPORTED_MODULE_14__.backgroundCornerRadiusToCssVariable),
-/* harmony export */   capitalize: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.capitalize),
-/* harmony export */   clearNewLines: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.clearNewLines),
-/* harmony export */   convertRgbaToString: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.convertRgbaToString),
-/* harmony export */   copyCssClasses: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.copyCssClasses),
-/* harmony export */   copyObject: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.copyObject),
+/* harmony export */   capitalize: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.capitalize),
+/* harmony export */   clearNewLines: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.clearNewLines),
+/* harmony export */   convertRgbaToString: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.convertRgbaToString),
+/* harmony export */   copyCssClasses: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.copyCssClasses),
+/* harmony export */   copyObject: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.copyObject),
 /* harmony export */   createBoxShadow: () => (/* reexport safe */ _components_tabs_theme_custom_questions_shadow_effects__WEBPACK_IMPORTED_MODULE_12__.createBoxShadow),
 /* harmony export */   createBoxShadowReset: () => (/* reexport safe */ _components_tabs_theme_custom_questions_shadow_effects__WEBPACK_IMPORTED_MODULE_12__.createBoxShadowReset),
 /* harmony export */   createColor: () => (/* reexport safe */ _components_tabs_theme_custom_questions_color_alpha__WEBPACK_IMPORTED_MODULE_11__.createColor),
 /* harmony export */   createExportCSVAction: () => (/* reexport safe */ _components_tabs_translation__WEBPACK_IMPORTED_MODULE_20__.createExportCSVAction),
 /* harmony export */   createImportCSVAction: () => (/* reexport safe */ _components_tabs_translation__WEBPACK_IMPORTED_MODULE_20__.createImportCSVAction),
-/* harmony export */   defaultPropertyGridDefinition: () => (/* reexport safe */ _question_editor_definition__WEBPACK_IMPORTED_MODULE_74__.defaultPropertyGridDefinition),
+/* harmony export */   defaultPropertyGridDefinition: () => (/* reexport safe */ _question_editor_definition__WEBPACK_IMPORTED_MODULE_75__.defaultPropertyGridDefinition),
 /* harmony export */   defaultStrings: () => (/* reexport safe */ _editorLocalization__WEBPACK_IMPORTED_MODULE_1__.defaultStrings),
 /* harmony export */   editableStringRendererName: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.editableStringRendererName),
 /* harmony export */   editorLocalization: () => (/* reexport safe */ _editorLocalization__WEBPACK_IMPORTED_MODULE_1__.editorLocalization),
 /* harmony export */   enStrings: () => (/* reexport safe */ _localization_english__WEBPACK_IMPORTED_MODULE_0__.enStrings),
-/* harmony export */   findParentNode: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.findParentNode),
-/* harmony export */   focusFirstControl: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.focusFirstControl),
+/* harmony export */   findParentNode: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.findParentNode),
+/* harmony export */   focusFirstControl: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.focusFirstControl),
 /* harmony export */   fontsettingsFromCssVariable: () => (/* reexport safe */ _components_tabs_theme_custom_questions_font_settings__WEBPACK_IMPORTED_MODULE_13__.fontsettingsFromCssVariable),
 /* harmony export */   fontsettingsToCssVariable: () => (/* reexport safe */ _components_tabs_theme_custom_questions_font_settings__WEBPACK_IMPORTED_MODULE_13__.fontsettingsToCssVariable),
-/* harmony export */   getAcceptedTypesByContentMode: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.getAcceptedTypesByContentMode),
+/* harmony export */   getAcceptedTypesByContentMode: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.getAcceptedTypesByContentMode),
 /* harmony export */   getElementWrapperComponentData: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.getElementWrapperComponentData),
 /* harmony export */   getElementWrapperComponentName: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.getElementWrapperComponentName),
-/* harmony export */   getFirstNonTextElement: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.getFirstNonTextElement),
+/* harmony export */   getFirstNonTextElement: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.getFirstNonTextElement),
 /* harmony export */   getItemValueWrapperComponentData: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.getItemValueWrapperComponentData),
 /* harmony export */   getItemValueWrapperComponentName: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.getItemValueWrapperComponentName),
 /* harmony export */   getLocString: () => (/* reexport safe */ _editorLocalization__WEBPACK_IMPORTED_MODULE_1__.getLocString),
-/* harmony export */   getNextItemText: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.getNextItemText),
-/* harmony export */   getNextItemValue: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.getNextItemValue),
-/* harmony export */   getNextValue: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.getNextValue),
-/* harmony export */   getNodesFromKoComponentInfo: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.getNodesFromKoComponentInfo),
+/* harmony export */   getNextItemText: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.getNextItemText),
+/* harmony export */   getNextItemValue: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.getNextItemValue),
+/* harmony export */   getNextValue: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.getNextValue),
+/* harmony export */   getNodesFromKoComponentInfo: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.getNodesFromKoComponentInfo),
 /* harmony export */   getQuestionContentWrapperComponentName: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.getQuestionContentWrapperComponentName),
-/* harmony export */   getQuestionFromObj: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.getQuestionFromObj),
-/* harmony export */   ignoreUndoRedo: () => (/* reexport safe */ _plugins_undo_redo__WEBPACK_IMPORTED_MODULE_78__.ignoreUndoRedo),
-/* harmony export */   imageMimeTypes: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.imageMimeTypes),
-/* harmony export */   ingectAlpha: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.ingectAlpha),
+/* harmony export */   getQuestionFromObj: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.getQuestionFromObj),
+/* harmony export */   ignoreUndoRedo: () => (/* reexport safe */ _plugins_undo_redo__WEBPACK_IMPORTED_MODULE_79__.ignoreUndoRedo),
+/* harmony export */   imageMimeTypes: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.imageMimeTypes),
+/* harmony export */   ingectAlpha: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.ingectAlpha),
 /* harmony export */   initLogicOperator: () => (/* reexport safe */ _components_tabs_logic__WEBPACK_IMPORTED_MODULE_19__.initLogicOperator),
 /* harmony export */   initialSettingsAllowShowEmptyTitleInDesignMode: () => (/* reexport safe */ _components_tabs_designer__WEBPACK_IMPORTED_MODULE_23__.initialSettingsAllowShowEmptyTitleInDesignMode),
 /* harmony export */   initializeDesignTimeSurveyModel: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.initializeDesignTimeSurveyModel),
-/* harmony export */   isPropertyVisible: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.isPropertyVisible),
+/* harmony export */   isPropertyVisible: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.isPropertyVisible),
 /* harmony export */   isStringEditable: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.isStringEditable),
 /* harmony export */   isTextInput: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.isTextInput),
 /* harmony export */   localization: () => (/* reexport safe */ _editorLocalization__WEBPACK_IMPORTED_MODULE_1__.editorLocalization),
 /* harmony export */   logicCss: () => (/* reexport safe */ _components_tabs_logic_theme__WEBPACK_IMPORTED_MODULE_27__.logicCss),
-/* harmony export */   notShortCircuitAnd: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.notShortCircuitAnd),
+/* harmony export */   notShortCircuitAnd: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.notShortCircuitAnd),
 /* harmony export */   parseBoxShadow: () => (/* reexport safe */ _components_tabs_theme_custom_questions_shadow_effects__WEBPACK_IMPORTED_MODULE_12__.parseBoxShadow),
-/* harmony export */   parseColor: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.parseColor),
-/* harmony export */   parseRgbaFromString: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.parseRgbaFromString),
-/* harmony export */   propertyExists: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.propertyExists),
+/* harmony export */   parseColor: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.parseColor),
+/* harmony export */   parseRgbaFromString: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.parseRgbaFromString),
+/* harmony export */   propertyExists: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.propertyExists),
 /* harmony export */   propertyGridCss: () => (/* reexport safe */ _property_grid_theme_property_grid__WEBPACK_IMPORTED_MODULE_62__.propertyGridCss),
 /* harmony export */   registerAdorner: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.registerAdorner),
 /* harmony export */   removeAdorners: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.removeAdorners),
-/* harmony export */   roundTo2Decimals: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.roundTo2Decimals),
-/* harmony export */   saveToFileHandler: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.saveToFileHandler),
-/* harmony export */   scrollElementIntoView: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.scrollElementIntoView),
-/* harmony export */   select: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.select),
+/* harmony export */   roundTo2Decimals: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.roundTo2Decimals),
+/* harmony export */   saveToFileHandler: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.saveToFileHandler),
+/* harmony export */   scrollElementIntoView: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.scrollElementIntoView),
+/* harmony export */   select: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.select),
 /* harmony export */   setSurveyJSONForPropertyGrid: () => (/* reexport safe */ _property_grid__WEBPACK_IMPORTED_MODULE_50__.setSurveyJSONForPropertyGrid),
 /* harmony export */   settings: () => (/* reexport safe */ _creator_settings__WEBPACK_IMPORTED_MODULE_2__.settings),
 /* harmony export */   simulatorDevices: () => (/* reexport safe */ _components_simulator__WEBPACK_IMPORTED_MODULE_39__.simulatorDevices),
 /* harmony export */   svgBundle: () => (/* reexport safe */ _svgbundle__WEBPACK_IMPORTED_MODULE_64__.svgBundle),
 /* harmony export */   themeModelPropertyGridDefinition: () => (/* reexport safe */ _components_tabs_theme_model_definition__WEBPACK_IMPORTED_MODULE_18__.themeModelPropertyGridDefinition),
-/* harmony export */   toggleHovered: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.toggleHovered),
+/* harmony export */   toggleHovered: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.toggleHovered),
 /* harmony export */   translationCss: () => (/* reexport safe */ _components_tabs_translation_theme__WEBPACK_IMPORTED_MODULE_21__.translationCss),
-/* harmony export */   trimEmptyFields: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.trimEmptyFields),
-/* harmony export */   undoRedoTransaction: () => (/* reexport safe */ _plugins_undo_redo__WEBPACK_IMPORTED_MODULE_78__.undoRedoTransaction),
+/* harmony export */   trimBoxShadowValue: () => (/* reexport safe */ _components_tabs_theme_custom_questions_shadow_effects__WEBPACK_IMPORTED_MODULE_12__.trimBoxShadowValue),
+/* harmony export */   trimEmptyFields: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.trimEmptyFields),
+/* harmony export */   undoRedoTransaction: () => (/* reexport safe */ _plugins_undo_redo__WEBPACK_IMPORTED_MODULE_79__.undoRedoTransaction),
 /* harmony export */   updateBackgroundCornerRadiusJSON: () => (/* reexport safe */ _components_tabs_theme_custom_questions_background_corner_radius__WEBPACK_IMPORTED_MODULE_14__.updateBackgroundCornerRadiusJSON),
 /* harmony export */   updateFontSettingsJSON: () => (/* reexport safe */ _components_tabs_theme_custom_questions_font_settings__WEBPACK_IMPORTED_MODULE_13__.updateFontSettingsJSON),
 /* harmony export */   updateShadowEffectsJSON: () => (/* reexport safe */ _components_tabs_theme_custom_questions_shadow_effects__WEBPACK_IMPORTED_MODULE_12__.updateShadowEffectsJSON),
 /* harmony export */   updatecoloralphaJSON: () => (/* reexport safe */ _components_tabs_theme_custom_questions_color_alpha__WEBPACK_IMPORTED_MODULE_11__.updatecoloralphaJSON),
-/* harmony export */   wrapTextByCurlyBraces: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_72__.wrapTextByCurlyBraces)
+/* harmony export */   wrapTextByCurlyBraces: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_73__.wrapTextByCurlyBraces)
 /* harmony export */ });
 /* harmony import */ var _localization_english__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../localization/english */ "./src/localization/english.ts");
 /* harmony import */ var _editorLocalization__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../editorLocalization */ "./src/editorLocalization.ts");
@@ -39984,28 +40566,29 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _textWorker__WEBPACK_IMPORTED_MODULE_65__ = __webpack_require__(/*! ../textWorker */ "./src/textWorker.ts");
 /* harmony import */ var _toolbox__WEBPACK_IMPORTED_MODULE_66__ = __webpack_require__(/*! ../toolbox */ "./src/toolbox.ts");
 /* harmony import */ var _components_side_bar_side_bar_model__WEBPACK_IMPORTED_MODULE_67__ = __webpack_require__(/*! ../components/side-bar/side-bar-model */ "./src/components/side-bar/side-bar-model.ts");
-/* harmony import */ var _components_side_bar_side_bar_page_model__WEBPACK_IMPORTED_MODULE_68__ = __webpack_require__(/*! ../components/side-bar/side-bar-page-model */ "./src/components/side-bar/side-bar-page-model.ts");
-/* harmony import */ var _components_side_bar_tab_control_model__WEBPACK_IMPORTED_MODULE_69__ = __webpack_require__(/*! ../components/side-bar/tab-control-model */ "./src/components/side-bar/tab-control-model.ts");
-/* harmony import */ var _components_switcher_switcher__WEBPACK_IMPORTED_MODULE_70__ = __webpack_require__(/*! ../components/switcher/switcher */ "./src/components/switcher/switcher.ts");
-/* harmony import */ var _utils_events__WEBPACK_IMPORTED_MODULE_71__ = __webpack_require__(/*! ../utils/events */ "./src/utils/events.ts");
-/* harmony import */ var _utils_utils__WEBPACK_IMPORTED_MODULE_72__ = __webpack_require__(/*! ../utils/utils */ "./src/utils/utils.ts");
-/* harmony import */ var _utils_actions__WEBPACK_IMPORTED_MODULE_73__ = __webpack_require__(/*! ../utils/actions */ "./src/utils/actions.ts");
-/* harmony import */ var _question_editor_definition__WEBPACK_IMPORTED_MODULE_74__ = __webpack_require__(/*! ../question-editor/definition */ "./src/question-editor/definition.ts");
-/* harmony import */ var _question_editor_properties__WEBPACK_IMPORTED_MODULE_75__ = __webpack_require__(/*! ../question-editor/properties */ "./src/question-editor/properties.ts");
-/* harmony import */ var _survey_helper__WEBPACK_IMPORTED_MODULE_76__ = __webpack_require__(/*! ../survey-helper */ "./src/survey-helper.ts");
-/* harmony import */ var _utils_resizer__WEBPACK_IMPORTED_MODULE_77__ = __webpack_require__(/*! ../utils/resizer */ "./src/utils/resizer.ts");
-/* harmony import */ var _plugins_undo_redo__WEBPACK_IMPORTED_MODULE_78__ = __webpack_require__(/*! ../plugins/undo-redo */ "./src/plugins/undo-redo/index.ts");
-/* harmony import */ var _plugins_undo_redo_undo_redo_manager__WEBPACK_IMPORTED_MODULE_79__ = __webpack_require__(/*! ../plugins/undo-redo/undo-redo-manager */ "./src/plugins/undo-redo/undo-redo-manager.ts");
-/* harmony import */ var _pages_controller__WEBPACK_IMPORTED_MODULE_80__ = __webpack_require__(/*! ../pages-controller */ "./src/pages-controller.ts");
-/* harmony import */ var _presets_presets_base__WEBPACK_IMPORTED_MODULE_81__ = __webpack_require__(/*! ../presets/presets-base */ "./src/presets/presets-base.ts");
-/* harmony import */ var _presets_presets__WEBPACK_IMPORTED_MODULE_82__ = __webpack_require__(/*! ../presets/presets */ "./src/presets/presets.ts");
-/* harmony import */ var _presets_presets_properties__WEBPACK_IMPORTED_MODULE_83__ = __webpack_require__(/*! ../presets/presets-properties */ "./src/presets/presets-properties.ts");
-/* harmony import */ var _presets_presets_tabs__WEBPACK_IMPORTED_MODULE_84__ = __webpack_require__(/*! ../presets/presets-tabs */ "./src/presets/presets-tabs.ts");
-/* harmony import */ var _presets_presets_toolbox__WEBPACK_IMPORTED_MODULE_85__ = __webpack_require__(/*! ../presets/presets-toolbox */ "./src/presets/presets-toolbox.ts");
-/* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_86__ = __webpack_require__(/*! survey-core */ "survey-core");
-/* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_86___default = /*#__PURE__*/__webpack_require__.n(survey_core__WEBPACK_IMPORTED_MODULE_86__);
+/* harmony import */ var _components_side_bar_side_bar_header_model__WEBPACK_IMPORTED_MODULE_68__ = __webpack_require__(/*! ../components/side-bar/side-bar-header-model */ "./src/components/side-bar/side-bar-header-model.ts");
+/* harmony import */ var _components_side_bar_side_bar_page_model__WEBPACK_IMPORTED_MODULE_69__ = __webpack_require__(/*! ../components/side-bar/side-bar-page-model */ "./src/components/side-bar/side-bar-page-model.ts");
+/* harmony import */ var _components_side_bar_tab_control_model__WEBPACK_IMPORTED_MODULE_70__ = __webpack_require__(/*! ../components/side-bar/tab-control-model */ "./src/components/side-bar/tab-control-model.ts");
+/* harmony import */ var _components_switcher_switcher__WEBPACK_IMPORTED_MODULE_71__ = __webpack_require__(/*! ../components/switcher/switcher */ "./src/components/switcher/switcher.ts");
+/* harmony import */ var _utils_events__WEBPACK_IMPORTED_MODULE_72__ = __webpack_require__(/*! ../utils/events */ "./src/utils/events.ts");
+/* harmony import */ var _utils_utils__WEBPACK_IMPORTED_MODULE_73__ = __webpack_require__(/*! ../utils/utils */ "./src/utils/utils.ts");
+/* harmony import */ var _utils_actions__WEBPACK_IMPORTED_MODULE_74__ = __webpack_require__(/*! ../utils/actions */ "./src/utils/actions.ts");
+/* harmony import */ var _question_editor_definition__WEBPACK_IMPORTED_MODULE_75__ = __webpack_require__(/*! ../question-editor/definition */ "./src/question-editor/definition.ts");
+/* harmony import */ var _question_editor_properties__WEBPACK_IMPORTED_MODULE_76__ = __webpack_require__(/*! ../question-editor/properties */ "./src/question-editor/properties.ts");
+/* harmony import */ var _survey_helper__WEBPACK_IMPORTED_MODULE_77__ = __webpack_require__(/*! ../survey-helper */ "./src/survey-helper.ts");
+/* harmony import */ var _utils_resizer__WEBPACK_IMPORTED_MODULE_78__ = __webpack_require__(/*! ../utils/resizer */ "./src/utils/resizer.ts");
+/* harmony import */ var _plugins_undo_redo__WEBPACK_IMPORTED_MODULE_79__ = __webpack_require__(/*! ../plugins/undo-redo */ "./src/plugins/undo-redo/index.ts");
+/* harmony import */ var _plugins_undo_redo_undo_redo_manager__WEBPACK_IMPORTED_MODULE_80__ = __webpack_require__(/*! ../plugins/undo-redo/undo-redo-manager */ "./src/plugins/undo-redo/undo-redo-manager.ts");
+/* harmony import */ var _pages_controller__WEBPACK_IMPORTED_MODULE_81__ = __webpack_require__(/*! ../pages-controller */ "./src/pages-controller.ts");
+/* harmony import */ var _presets_presets_base__WEBPACK_IMPORTED_MODULE_82__ = __webpack_require__(/*! ../presets/presets-base */ "./src/presets/presets-base.ts");
+/* harmony import */ var _presets_presets__WEBPACK_IMPORTED_MODULE_83__ = __webpack_require__(/*! ../presets/presets */ "./src/presets/presets.ts");
+/* harmony import */ var _presets_presets_properties__WEBPACK_IMPORTED_MODULE_84__ = __webpack_require__(/*! ../presets/presets-properties */ "./src/presets/presets-properties.ts");
+/* harmony import */ var _presets_presets_tabs__WEBPACK_IMPORTED_MODULE_85__ = __webpack_require__(/*! ../presets/presets-tabs */ "./src/presets/presets-tabs.ts");
+/* harmony import */ var _presets_presets_toolbox__WEBPACK_IMPORTED_MODULE_86__ = __webpack_require__(/*! ../presets/presets-toolbox */ "./src/presets/presets-toolbox.ts");
+/* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_87__ = __webpack_require__(/*! survey-core */ "survey-core");
+/* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_87___default = /*#__PURE__*/__webpack_require__.n(survey_core__WEBPACK_IMPORTED_MODULE_87__);
 var Version;
-Version = "".concat("1.12.2");
+Version = "".concat("1.12.4");
 //should be loaded before other styles for easier override 
 __webpack_require__(/*! ../utils/context-button.scss */ "./src/utils/context-button.scss");
 
@@ -40095,6 +40678,7 @@ __webpack_require__(/*! ../utils/context-button.scss */ "./src/utils/context-but
 
 
 
+
 
 
 __webpack_require__(/*! ../components/property-panel/property-panel-item.scss */ "./src/components/property-panel/property-panel-item.scss");
@@ -40109,9 +40693,10 @@ __webpack_require__(/*! ../components/side-bar/tab-control.scss */ "./src/compon
 __webpack_require__(/*! ../property-grid-theme/property-grid.scss */ "./src/property-grid-theme/property-grid.scss");
 __webpack_require__(/*! ../utils/design.scss */ "./src/utils/design.scss");
 __webpack_require__(/*! ../utils/layout.scss */ "./src/utils/layout.scss");
+__webpack_require__(/*! ../custom-questions/boolean-switch.scss */ "./src/custom-questions/boolean-switch.scss");
 
-survey_core__WEBPACK_IMPORTED_MODULE_86__.settings.supportCreatorV2 = true;
-(0,survey_core__WEBPACK_IMPORTED_MODULE_86__.checkLibraryVersion)("".concat("1.12.2"), "survey-creator-core");
+survey_core__WEBPACK_IMPORTED_MODULE_87__.settings.supportCreatorV2 = true;
+(0,survey_core__WEBPACK_IMPORTED_MODULE_87__.checkLibraryVersion)("".concat("1.12.4"), "survey-creator-core");
 
 })();