survey-creator-core 1.12.6 → 1.12.7

package/survey-creator-core.js

@@ -1,19 +1,19 @@
 /*!
- * SurveyJS Creator v1.12.6
+ * SurveyJS Creator v1.12.7
  * (c) 2015-2024 Devsoft Baltic OÜ - http://surveyjs.io/
  * Github: https://github.com/surveyjs/survey-creator
  * License: https://surveyjs.io/Licenses#SurveyCreator
  */
 (function webpackUniversalModuleDefinition(root, factory) {
 	if(typeof exports === 'object' && typeof module === 'object')
-		module.exports = factory(require("survey-core"), require("survey-core/themes"));
+		module.exports = factory(require("survey-core"), require("survey-creator-core/themes"), require("survey-core/themes"));
 	else if(typeof define === 'function' && define.amd)
-		define("survey-creator-core", ["survey-core", "survey-core/themes"], factory);
+		define("survey-creator-core", ["survey-core", "survey-creator-core/themes", "survey-core/themes"], factory);
 	else if(typeof exports === 'object')
-		exports["survey-creator-core"] = factory(require("survey-core"), require("survey-core/themes"));
+		exports["survey-creator-core"] = factory(require("survey-core"), require("survey-creator-core/themes"), require("survey-core/themes"));
 	else
-		root["SurveyCreatorCore"] = factory(root["Survey"], root["SurveyTheme"]);
-})(this, (__WEBPACK_EXTERNAL_MODULE_survey_core__, __WEBPACK_EXTERNAL_MODULE_survey_core_themes__) => {
+		root["SurveyCreatorCore"] = factory(root["Survey"], root["SurveyCreatorTheme"], root["SurveyTheme"]);
+})(this, (__WEBPACK_EXTERNAL_MODULE_survey_core__, __WEBPACK_EXTERNAL_MODULE_survey_creator_core_themes__, __WEBPACK_EXTERNAL_MODULE_survey_core_themes__) => {
 return /******/ (() => { // webpackBootstrap
 /******/ 	var __webpack_modules__ = ({
 
@@ -431,6 +431,19 @@ __webpack_require__.r(__webpack_exports__);
 // extracted by mini-css-extract-plugin
 
 
+/***/ }),
+
+/***/ "./src/components/toolbox/toolbox-right.scss":
+/*!***************************************************!*\
+  !*** ./src/components/toolbox/toolbox-right.scss ***!
+  \***************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+// extracted by mini-css-extract-plugin
+
+
 /***/ }),
 
 /***/ "./src/components/toolbox/toolbox-tool.scss":
@@ -2136,11 +2149,11 @@ var SurveyElementAdornerBase = /** @class */ (function (_super) {
     };
     SurveyElementAdornerBase.prototype.detachElement = function (surveyElement) {
         if (surveyElement) {
-            if (surveyElement.getPropertyValue(SurveyElementAdornerBase.AdornerValueName) === this) {
+            if (surveyElement.getPropertyValue(SurveyElementAdornerBase.AdornerValueName) === this && !surveyElement.isDisposed) {
                 surveyElement.setPropertyValue(SurveyElementAdornerBase.AdornerValueName, null);
             }
             surveyElement.onPropertyChanged.remove(this.selectedPropPageFunc);
-            this.updateActionsContainer(surveyElement, true);
+            this.cleanActionsContainer();
         }
     };
     SurveyElementAdornerBase.prototype.attachElement = function (surveyElement) {
@@ -2207,17 +2220,16 @@ var SurveyElementAdornerBase = /** @class */ (function (_super) {
             }
         };
     };
-    SurveyElementAdornerBase.prototype.updateActionsContainer = function (surveyElement, clear) {
-        if (clear === void 0) { clear = false; }
-        if (clear) {
-            this.actionContainer.actions.forEach(function (action) { return action.dispose && action.dispose(); });
-        }
-        else {
-            var actions = [];
-            this.buildActions(actions);
-            this.creator.onElementMenuItemsChanged(surveyElement, actions);
-            this.actionContainer.setItems(actions);
-        }
+    SurveyElementAdornerBase.prototype.cleanActionsContainer = function () {
+        var actions = this.actionContainer.actions;
+        this.actionContainer.setItems([]);
+        actions.forEach(function (action) { return action.dispose && action.dispose(); });
+    };
+    SurveyElementAdornerBase.prototype.updateActionsContainer = function (surveyElement) {
+        var actions = [];
+        this.buildActions(actions);
+        this.creator.onElementMenuItemsChanged(surveyElement, actions);
+        this.actionContainer.setItems(actions);
     };
     SurveyElementAdornerBase.prototype.updateActionsProperties = function () {
         if (this.isDisposed)
@@ -3750,8 +3762,8 @@ var PageAdorner = /** @class */ (function (_super) {
     PageAdorner.prototype.updateActionVisibility = function (id, isVisible) {
         _super.prototype.updateActionVisibility.call(this, id, !this.isGhost && isVisible);
     };
-    PageAdorner.prototype.updateActionsContainer = function (surveyElement, clear) {
-        _super.prototype.updateActionsContainer.call(this, surveyElement, clear);
+    PageAdorner.prototype.updateActionsContainer = function (surveyElement) {
+        _super.prototype.updateActionsContainer.call(this, surveyElement);
         if (this.creator.expandCollapseButtonVisibility != "never")
             this.actionContainer.addAction(this.expandCollapseAction);
     };
@@ -3829,10 +3841,6 @@ var PageAdorner = /** @class */ (function (_super) {
             addGhostPage();
         };
     };
-    PageAdorner.prototype.dispose = function () {
-        this.detachElement(this.page);
-        _super.prototype.dispose.call(this);
-    };
     PageAdorner.prototype.calcIsGhostPage = function (page) {
         return this.creator.survey.pages.indexOf(page) < 0;
     };
@@ -5816,6 +5824,9 @@ var SidebarModel = /** @class */ (function (_super) {
         return this._activePage;
     };
     SidebarModel.prototype.setActivePage = function (newPage) {
+        if (!!this._activePage && this._activePage.id !== newPage.id && !!this._activePage.deactivateCallback) {
+            this._activePage.deactivateCallback();
+        }
         this.pages.forEach(function (page) { return page.visible = false; });
         this._activePage = newPage;
         if (this._activePage) {
@@ -5865,6 +5876,14 @@ var SidebarModel = /** @class */ (function (_super) {
         }
         this.rootElement = undefined;
     };
+    Object.defineProperty(SidebarModel.prototype, "toolbar", {
+        get: function () {
+            var _a;
+            return (_a = this.header) === null || _a === void 0 ? void 0 : _a.toolbar;
+        },
+        enumerable: false,
+        configurable: true
+    });
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.propertyArray)()
     ], SidebarModel.prototype, "pages", void 0);
@@ -7215,6 +7234,14 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _side_bar_tab_control_model__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../side-bar/tab-control-model */ "./src/components/side-bar/tab-control-model.ts");
 /* harmony import */ var _property_grid_icons__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../property-grid/icons */ "./src/property-grid/icons.ts");
 /* harmony import */ var _utils_actions__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../utils/actions */ "./src/utils/actions.ts");
+/* harmony import */ var _editorLocalization__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../editorLocalization */ "./src/editorLocalization.ts");
+/* harmony import */ var _creator_theme_creator_theme_model_definition__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../creator-theme/creator-theme-model-definition */ "./src/creator-theme/creator-theme-model-definition.ts");
+/* harmony import */ var _creator_theme_creator_theme_model__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../creator-theme/creator-theme-model */ "./src/creator-theme/creator-theme-model.ts");
+/* harmony import */ var _themes__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./themes */ "./src/components/tabs/themes.ts");
+
+
+
+
 
 
 
@@ -7258,6 +7285,9 @@ var TabDesignerPlugin = /** @class */ (function () {
         this.toolboxTab = this.creator.sidebar.addPage("toolbox", "svc-toolbox", creator);
         this.propertyGridPlaceholderPage = this.creator.sidebar.addPage("propertyGridPlaceholder", "svc-property-grid-placeholder", this.propertyGridViewModel);
         this.propertyGridPlaceholderPage.caption = "Survey Settings";
+        if (this.creator.showCreatorThemeSettings) {
+            this.createCreatorThemeSettingsPage(creator);
+        }
         this.designerStateManager = new _designer_state_manager__WEBPACK_IMPORTED_MODULE_5__.DesignerStateManager();
         this.designerStateManager.initForSurvey(this.creator.survey);
         this.creator.onSurveyInstanceCreated.add(function (s, o) {
@@ -7325,11 +7355,13 @@ var TabDesignerPlugin = /** @class */ (function () {
         }
     };
     TabDesignerPlugin.prototype.updateHeaderComponent = function () {
+        var activePage = this.creator.sidebar.activePage;
         if (this.showOneCategoryInPropertyGrid && this.activePageIsPropertyGrid) {
             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) {
+        else if (this.showOneCategoryInPropertyGrid && (activePage === this.propertyGridPlaceholderPage.id
+            || activePage === this.themePropertyGridTab.id)) {
             this.creator.sidebar.header.componentName = "svc-side-bar-header";
             this.creator.sidebar.header.componentData = this.creator.sidebar.header;
         }
@@ -7340,7 +7372,7 @@ var TabDesignerPlugin = /** @class */ (function () {
     };
     TabDesignerPlugin.prototype.updateActivePage = function () {
         if (this.showOneCategoryInPropertyGrid) {
-            this.creator.sidebar.activePage = this.creator.survey.pageCount ? this.propertyGridTab.id : this.propertyGridPlaceholderPage.id;
+            this.setActivePage(this.creator.survey.pageCount ? this.propertyGridTab.id : this.propertyGridPlaceholderPage.id);
             this.updateHeaderComponent();
         }
         else {
@@ -7348,7 +7380,10 @@ var TabDesignerPlugin = /** @class */ (function () {
         }
     };
     TabDesignerPlugin.prototype.setPropertyGridIsActivePage = function () {
-        this.creator.sidebar.activePage = this.propertyGridTab.id;
+        this.setActivePage(this.propertyGridTab.id);
+    };
+    TabDesignerPlugin.prototype.setActivePage = function (id) {
+        this.creator.sidebar.activePage = id;
         this.updateHeaderComponent();
     };
     Object.defineProperty(TabDesignerPlugin.prototype, "showOneCategoryInPropertyGrid", {
@@ -7370,6 +7405,60 @@ var TabDesignerPlugin = /** @class */ (function () {
         enumerable: false,
         configurable: true
     });
+    TabDesignerPlugin.prototype.syncTheme = function (theme) {
+        var newTheme = theme || this.themeModel.toJSON();
+        this.creator.syncTheme(newTheme);
+    };
+    TabDesignerPlugin.prototype.updatePredefinedColorChoices = function () {
+        var _this = this;
+        this.themePropertyGrid.survey.getAllQuestions().forEach(function (question) {
+            if (question.name === "--sjs-primary-background-500" || question.name === "--sjs-secondary-background-500") {
+                question.choices = (0,_themes__WEBPACK_IMPORTED_MODULE_12__.getPredefinedColorsItemValues)(_this.themeModel["isLight"] === false ? "dark" : "light");
+            }
+        });
+    };
+    TabDesignerPlugin.prototype.updateThemeSettings = function () {
+        if (this.creator.showCreatorThemeSettings) {
+            this.themeModel.loadTheme(this.creator.creatorTheme);
+            this.themePropertyGrid.obj = this.themeModel;
+            this.updatePredefinedColorChoices();
+        }
+    };
+    TabDesignerPlugin.prototype.createCreatorThemeSettingsPage = function (creator) {
+        var _this = this;
+        this.themeModel = new _creator_theme_creator_theme_model__WEBPACK_IMPORTED_MODULE_11__.CreatorThemeModel();
+        this.themePropertyGrid = new _property_grid__WEBPACK_IMPORTED_MODULE_2__.PropertyGridModel(undefined, creator, _creator_theme_creator_theme_model_definition__WEBPACK_IMPORTED_MODULE_10__.creatorThemeModelPropertyGridDefinition);
+        this.themePropertyGrid.showOneCategoryInPropertyGrid = true;
+        this.themePropertyGrid.surveyInstanceCreatedArea = "designer-tab:creator-settings";
+        var themePropertyGridViewModel = new _property_grid_property_grid_view_model__WEBPACK_IMPORTED_MODULE_3__.PropertyGridViewModel(this.themePropertyGrid, creator);
+        themePropertyGridViewModel.searchEnabled = false;
+        this.themePropertyGridTab = this.creator.sidebar.addPage("creatorTheme", "svc-property-grid", themePropertyGridViewModel);
+        this.themePropertyGridTab.caption = _editorLocalization__WEBPACK_IMPORTED_MODULE_9__.editorLocalization.getString("ed.creatorSettingTitle");
+        this.themePropertyGridTab.deactivateCallback = function () {
+            settingsAction.active = false;
+        };
+        this.themeModel.onThemeSelected.add(function (sender, options) {
+            _this.syncTheme(options.theme);
+            _this.themePropertyGrid.survey.editingObj = undefined;
+            _this.themePropertyGrid.survey.editingObj = sender;
+            _this.updatePredefinedColorChoices();
+        });
+        this.themeModel.onThemePropertyChanged.add(function (sender, options) {
+            _this.syncTheme();
+        });
+        var settingsAction = new _utils_actions__WEBPACK_IMPORTED_MODULE_8__.MenuButton({
+            id: "theme-settings",
+            locTooltipName: "pe.tabs.creatorSettingTitle",
+            iconName: "icon-config",
+            pressed: false,
+            action: function () {
+                _this.creator.sidebar.expandSidebar();
+                _this.setActivePage(_this.themePropertyGridTab.id);
+                settingsAction.active = true;
+            }
+        });
+        this.tabControlModel.bottomToolbar.setItems([settingsAction]);
+    };
     TabDesignerPlugin.prototype.updateTabControlActions = function () {
         var _this = this;
         var _a;
@@ -7393,6 +7482,9 @@ var TabDesignerPlugin = /** @class */ (function () {
                 return action;
             });
             this.tabControlModel.topToolbar.setItems(pgTabs_1);
+            this.propertyGridTab.deactivateCallback = function () {
+                pgTabs_1.forEach(function (tab) { return tab.active = false; });
+            };
             this.propertyGrid.survey.onCurrentPageChanged.add(function (sender, options) {
                 pgTabs_1.forEach(function (action) {
                     action.active = action.id === options.newCurrentPage.name;
@@ -7407,6 +7499,7 @@ var TabDesignerPlugin = /** @class */ (function () {
         this.creator.sidebar.hideSideBarVisibilityControlActions = this.showOneCategoryInPropertyGrid;
         this.updateActivePage();
         this.updateTabControl();
+        this.updateThemeSettings();
         this.creator.focusElement(undefined, true);
     };
     TabDesignerPlugin.prototype.deactivate = function () {
@@ -7416,6 +7509,8 @@ var TabDesignerPlugin = /** @class */ (function () {
         this.model = undefined;
         this.propertyGridTab.visible = false;
         this.propertyGridPlaceholderPage.visible = false;
+        if (!!this.themePropertyGridTab)
+            this.themePropertyGridTab.visible = false;
         this.toolboxTab.visible = false;
         this.creator.sidebar.hideSideBarVisibilityControlActions = false;
         this.creator.sidebar.sideAreaComponentName = undefined;
@@ -7445,7 +7540,7 @@ var TabDesignerPlugin = /** @class */ (function () {
                 if (!_this.creator.showSidebar) {
                     _this.creator.setShowSidebar(true, true);
                 }
-                _this.creator.sidebar.activePage = "toolbox";
+                _this.setActivePage("toolbox");
             },
             active: new survey_core__WEBPACK_IMPORTED_MODULE_0__.ComputedUpdater(function () { return _this.creator.sidebar.activePage === "toolbox"; }),
             visible: new survey_core__WEBPACK_IMPORTED_MODULE_0__.ComputedUpdater(function () {
@@ -15540,12 +15635,6 @@ var ThemeTabPlugin = /** @class */ (function () {
             pageDescriptionQuestion.readOnly = !pageElements.some(function (p) { return !!p.description; });
         }
     };
-    ThemeTabPlugin.prototype.getPredefinedColorsItemValues = function () {
-        var _this = this;
-        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 () {
         var _this = this;
         var page = this.propertyGrid.survey.pages[0];
@@ -15554,12 +15643,12 @@ var ThemeTabPlugin = /** @class */ (function () {
             var headerViewContainer = header.elements[0].contentPanel;
             var headerBackgroundQuestion = headerViewContainer.getQuestionByName("backgroundColor");
             if (!!headerBackgroundQuestion) {
-                headerBackgroundQuestion.choices = this.getPredefinedColorsItemValues();
+                headerBackgroundQuestion.choices = (0,_themes__WEBPACK_IMPORTED_MODULE_4__.getPredefinedColorsItemValues)(this.themeModel.colorPalette);
             }
         }
         this.propertyGrid.survey.getAllQuestions().forEach(function (question) {
             if (["color", "coloralpha"].indexOf(question.getType()) !== -1) {
-                question.choices = _this.getPredefinedColorsItemValues();
+                question.choices = (0,_themes__WEBPACK_IMPORTED_MODULE_4__.getPredefinedColorsItemValues)(_this.themeModel.colorPalette);
             }
         });
     };
@@ -15690,7 +15779,12 @@ var ThemeTabPlugin = /** @class */ (function () {
         this.creator.sidebar.activePage = this.propertyGridTab.id;
         this.propertyGridTab.visible = true;
         this.updateTabControl();
-        this.creator.expandCategoryIfNeeded();
+        this.expandCategoryIfNeeded();
+    };
+    ThemeTabPlugin.prototype.expandCategoryIfNeeded = function () {
+        if (!this.model.survey.isEmpty) {
+            this.propertyGrid.expandCategoryIfNeeded();
+        }
     };
     ThemeTabPlugin.prototype.updateTabControlActions = function () {
         var _this = this;
@@ -16212,8 +16306,14 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   PredefinedColors: () => (/* binding */ PredefinedColors),
 /* harmony export */   PredefinedThemes: () => (/* binding */ PredefinedThemes),
-/* harmony export */   Themes: () => (/* binding */ Themes)
+/* harmony export */   Themes: () => (/* binding */ Themes),
+/* harmony export */   getPredefinedColorsItemValues: () => (/* binding */ getPredefinedColorsItemValues)
 /* harmony export */ });
+/* 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 _editorLocalization__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../editorLocalization */ "./src/editorLocalization.ts");
+
+
 var Themes = {};
 var PredefinedThemes = ["default", "sharp", "borderless", "flat", "plain", "doubleborder", "layered", "solid", "threedimensional", "contrast"];
 var PredefinedColors = {
@@ -16236,6 +16336,12 @@ var PredefinedColors = {
         green: "rgba(140, 204, 90, 1)"
     }
 };
+function getPredefinedColorsItemValues(colorPalette) {
+    if (colorPalette === void 0) { colorPalette = "light"; }
+    return Object.keys(PredefinedColors[colorPalette]).map(function (colorName) {
+        return new survey_core__WEBPACK_IMPORTED_MODULE_0__.ItemValue(PredefinedColors[colorPalette][colorName], (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_1__.getLocString)("theme.colors." + colorName));
+    });
+}
 
 
 /***/ }),
@@ -19533,6 +19639,7 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
         _this.showTabsDefault = _creator_settings__WEBPACK_IMPORTED_MODULE_2__.settings.layout.showTabs;
         _this.showToolbarDefault = _creator_settings__WEBPACK_IMPORTED_MODULE_2__.settings.layout.showToolbar;
         _this.expandOnDragTimeOut = 1000;
+        _this.themeVariables = {};
         _this.allowDragPages = false;
         _this.collapsePagesOnDrag = false;
         if (!!options2 ||
@@ -21038,7 +21145,9 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
     });
     Object.defineProperty(SurveyCreatorModel.prototype, "designTabSurveyThemeVariables", {
         get: function () {
-            return _designTabSurveyThemeJSON__WEBPACK_IMPORTED_MODULE_26__["default"].cssVariables;
+            var cssVariables = {};
+            (0,_utils_utils__WEBPACK_IMPORTED_MODULE_8__.assign)(cssVariables, _designTabSurveyThemeJSON__WEBPACK_IMPORTED_MODULE_26__["default"].cssVariables, { "--sjs-base-unit": "var(--ctr-surface-base-unit)" });
+            return cssVariables;
         },
         enumerable: false,
         configurable: true
@@ -21629,6 +21738,9 @@ 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, _b;
@@ -21678,7 +21790,7 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
     Object.defineProperty(SurveyCreatorModel.prototype, "designerPropertyGrid", {
         //#region Obsolete designerPropertyGrid
         get: function () {
-            var propertyGridTab = this.sidebar.getPageById(this.sidebar.activePage);
+            var propertyGridTab = this.sidebar.getPageById("propertyGrid");
             if (!propertyGridTab)
                 return null;
             return propertyGridTab.componentData ? propertyGridTab.componentData.propertyGridModel : null;
@@ -21782,25 +21894,9 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
             this.designerPropertyGrid.setPropertyGridDefinition(val);
         }
     };
-    SurveyCreatorModel.prototype.getPropertyGridExpandedCategory = function () {
-        if (!this.designerPropertyGrid)
-            return undefined;
-        var panels = this.designerPropertyGrid.survey.getAllPanels();
-        for (var i = 0; i < panels.length; i++) {
-            if (panels[i].isExpanded)
-                return panels[i].name;
-        }
-        return "";
-    };
     SurveyCreatorModel.prototype.expandCategoryIfNeeded = function () {
-        var expandedTabName = _creator_settings__WEBPACK_IMPORTED_MODULE_2__.settings.propertyGrid.defaultExpandedTabName;
-        if (!!expandedTabName && !this.getPropertyGridExpandedCategory() && !this.survey.isEmpty) {
-            var panel = this.designerPropertyGrid.survey.getPanelByName(expandedTabName);
-            if (!!panel) {
-                panel.blockAnimations();
-                panel.expand();
-                panel.releaseAnimations();
-            }
+        if (!this.survey.isEmpty) {
+            this.designerPropertyGrid.expandCategoryIfNeeded();
         }
     };
     SurveyCreatorModel.prototype.selectionChanged = function (element, propertyName, focus) {
@@ -22620,6 +22716,21 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
             .append("svc-creator--disable-animations", !this.animationEnabled)
             .toString();
     };
+    SurveyCreatorModel.prototype.applyTheme = function (theme) {
+        this.syncTheme(theme);
+        var designerPlugin = this.getPlugin("designer");
+        if (designerPlugin) {
+            designerPlugin.updateThemeSettings();
+        }
+    };
+    SurveyCreatorModel.prototype.syncTheme = function (theme) {
+        if (!theme)
+            return;
+        this.creatorTheme = theme;
+        var newCssVariable = {};
+        (0,_utils_utils__WEBPACK_IMPORTED_MODULE_8__.assign)(newCssVariable, theme === null || theme === void 0 ? void 0 : theme.cssVariables);
+        this.themeVariables = newCssVariable;
+    };
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)({ defaultValue: true })
     ], SurveyCreatorModel.prototype, "showDesignerTab", void 0);
@@ -22632,6 +22743,9 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)({ defaultValue: false })
     ], SurveyCreatorModel.prototype, "showThemeTab", void 0);
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)({ defaultValue: false })
+    ], SurveyCreatorModel.prototype, "showCreatorThemeSettings", void 0);
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)({ defaultValue: false })
     ], SurveyCreatorModel.prototype, "showTranslationTab", void 0);
@@ -22787,6 +22901,12 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)({ defaultValue: true })
     ], SurveyCreatorModel.prototype, "enableLinkFileEditor", void 0);
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)({ defaultValue: {} })
+    ], SurveyCreatorModel.prototype, "themeVariables", void 0);
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
+    ], SurveyCreatorModel.prototype, "creatorTheme", void 0);
     return SurveyCreatorModel;
 }(survey_core__WEBPACK_IMPORTED_MODULE_1__.Base));
 
@@ -23405,6 +23525,401 @@ var EmptySurveyCreatorOptions = /** @class */ (function () {
 survey_core__WEBPACK_IMPORTED_MODULE_0__.StylesManager.applyTheme("defaultV2");
 
 
+/***/ }),
+
+/***/ "./src/creator-theme/creator-theme-model-definition.ts":
+/*!*************************************************************!*\
+  !*** ./src/creator-theme/creator-theme-model-definition.ts ***!
+  \*************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   creatorThemeModelEditorDefinition: () => (/* binding */ creatorThemeModelEditorDefinition),
+/* harmony export */   creatorThemeModelPropertyGridDefinition: () => (/* binding */ creatorThemeModelPropertyGridDefinition)
+/* harmony export */ });
+var creatorThemeModelProperties = {
+    "creatorTheme": {
+        properties: [
+            { name: "themeName", index: 1 },
+            { name: "--sjs-special-background", index: 10 },
+            { name: "--sjs-primary-background-500", index: 20 },
+            { name: "--sjs-secondary-background-500", index: 30 },
+            { name: "fontScale", index: 40 },
+            { name: "scale", index: 50 },
+            { name: "surfaceScale", index: 60 },
+        ],
+    },
+};
+var creatorThemeModelPropertyGridDefinition = {
+    autoGenerateProperties: true,
+    classes: creatorThemeModelProperties
+};
+var creatorThemeModelEditorDefinition = /** @class */ (function () {
+    function creatorThemeModelEditorDefinition() {
+    }
+    creatorThemeModelEditorDefinition.definition = creatorThemeModelProperties;
+    return creatorThemeModelEditorDefinition;
+}());
+
+
+
+/***/ }),
+
+/***/ "./src/creator-theme/creator-theme-model.ts":
+/*!**************************************************!*\
+  !*** ./src/creator-theme/creator-theme-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 */   CreatorThemeModel: () => (/* binding */ CreatorThemeModel)
+/* 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 _editorLocalization__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../editorLocalization */ "./src/editorLocalization.ts");
+/* harmony import */ var _utils_utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../utils/utils */ "./src/utils/utils.ts");
+/* harmony import */ var _creator_themes__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./creator-themes */ "./src/creator-theme/creator-themes.ts");
+/* harmony import */ var survey_creator_core_themes__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! survey-creator-core/themes */ "survey-creator-core/themes");
+/* harmony import */ var survey_creator_core_themes__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(survey_creator_core_themes__WEBPACK_IMPORTED_MODULE_5__);
+
+
+
+
+
+
+Object.keys(survey_creator_core_themes__WEBPACK_IMPORTED_MODULE_5__ || {}).forEach(function (themeName) {
+    var theme = survey_creator_core_themes__WEBPACK_IMPORTED_MODULE_5__[themeName];
+    if (_creator_themes__WEBPACK_IMPORTED_MODULE_4__.PredefinedCreatorThemes.indexOf(theme.themeName) === -1) {
+        _creator_themes__WEBPACK_IMPORTED_MODULE_4__.PredefinedCreatorThemes.push(theme.themeName);
+    }
+    _creator_themes__WEBPACK_IMPORTED_MODULE_4__.CreatorThemes[theme.themeName] = theme;
+});
+var CreatorThemeModel = /** @class */ (function (_super) {
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__extends)(CreatorThemeModel, _super);
+    function CreatorThemeModel() {
+        var _this = _super.call(this) || this;
+        _this.initialCssVariables = {};
+        _this.themeCssVariablesChanges = {};
+        _this.unitDictionary = {
+            "--ctr-font-unit": 8,
+            "--ctr-line-height-unit": 8,
+            "--ctr-size-unit": 8,
+            "--ctr-spacing-unit": 8,
+            "--ctr-corner-radius-unit": 8,
+            "--ctr-stroke-unit": 1,
+            "--ctr-surface-base-unit": 8,
+        };
+        _this.themeName = CreatorThemeModel.defautlThemeName;
+        _this.isLight = true;
+        _this.onThemeSelected = new survey_core__WEBPACK_IMPORTED_MODULE_1__.EventBase();
+        _this.onThemePropertyChanged = new survey_core__WEBPACK_IMPORTED_MODULE_1__.EventBase();
+        _this.blockThemeChangedNotifications = 0;
+        _this.onPropertyValueChangedCallback = function (name, oldValue, newValue, sender, arrayChanges) {
+            _this.onThemePropertyValueChangedCallback(name, oldValue, newValue, sender, arrayChanges);
+        };
+        return _this;
+    }
+    CreatorThemeModel.prototype.getType = function () {
+        return "creatortheme";
+    };
+    Object.defineProperty(CreatorThemeModel.prototype, "cssVariables", {
+        get: function () {
+            return this.toJSON()["cssVariables"] || {};
+        },
+        enumerable: false,
+        configurable: true
+    });
+    CreatorThemeModel.prototype.setThemeCssVariablesChanges = function (name, value) {
+        if (this.themeCssVariablesChanges[name] !== value) {
+            this.themeCssVariablesChanges[name] = value;
+            this.onThemePropertyChanged.fire(this, { name: name, value: value });
+        }
+    };
+    CreatorThemeModel.prototype.onThemePropertyValueChangedCallback = function (name, oldValue, newValue, sender, arrayChanges) {
+        if (this.blockThemeChangedNotifications > 0)
+            return;
+        if (name === "themeName") {
+            this.loadTheme({ themeName: newValue });
+            this.onThemeSelected.fire(this, { theme: this.toJSON() });
+        }
+        else if (name.indexOf("--") === 0) {
+            this.setThemeCssVariablesChanges(name, newValue);
+        }
+        else if (name == "fontScale" || name == "scale" || name == "surfaceScale") {
+            this.scalePropertiesChanged(name, newValue);
+        }
+    };
+    CreatorThemeModel.prototype.scalePropertiesChanged = function (propertyName, newValue) {
+        if (propertyName == "fontScale") {
+            this.scalingProperties("--ctr-font-unit", newValue);
+            this.scalingProperties("--ctr-line-height-unit", newValue);
+        }
+        else if (propertyName == "scale") {
+            this.scalingProperties("--ctr-size-unit", newValue);
+            this.scalingProperties("--ctr-spacing-unit", newValue);
+            this.scalingProperties("--ctr-corner-radius-unit", newValue);
+        }
+        else if (propertyName == "surfaceScale") {
+            this.scalingProperties("--ctr-surface-base-unit", newValue);
+        }
+    };
+    CreatorThemeModel.prototype.scalingProperties = function (cssName, newValue) {
+        var baseUnit = this.unitDictionary[cssName];
+        this.setThemeCssVariablesChanges(cssName, (newValue * baseUnit / 100) + "px");
+    };
+    CreatorThemeModel.prototype.scaleValue = function (cssName, scale) {
+        var baseUnit = this.unitDictionary[cssName];
+        this[cssName] = (scale * baseUnit / 100) + "px";
+    };
+    CreatorThemeModel.prototype.scaleCssVariables = function () {
+        if (this.fontScale !== undefined) {
+            this.scaleValue("--ctr-font-unit", this.fontScale);
+            this.scaleValue("--ctr-line-height-unit", this.fontScale);
+        }
+        if (this.scale !== undefined) {
+            this.scaleValue("--ctr-size-unit", this.scale);
+            this.scaleValue("--ctr-spacing-unit", this.scale);
+            this.scaleValue("--ctr-corner-radius-unit", this.scale);
+        }
+        if (this.surfaceScale !== undefined) {
+            this.scaleValue("--ctr-surface-base-unit", this.surfaceScale);
+        }
+    };
+    CreatorThemeModel.prototype.getScaleFactor = function (cssName) {
+        return !!this[cssName] ? (0,_utils_utils__WEBPACK_IMPORTED_MODULE_3__.roundTo2Decimals)(parseFloat(this[cssName]) * 100 / this.unitDictionary[cssName]) : undefined;
+    };
+    CreatorThemeModel.prototype.updateScaleProperties = function () {
+        this.blockThemeChangedNotifications += 1;
+        try {
+            this.fontScale = this.getScaleFactor(/*this.isDefaultTheme ? "--ctr-font-size" :*/ "--ctr-font-unit");
+            this.scale = this.getScaleFactor(/*this.isDefaultTheme ? "--sjs-base-unit" :*/ "--ctr-size-unit");
+            this.surfaceScale = this.getScaleFactor("--ctr-surface-base-unit");
+        }
+        finally {
+            this.blockThemeChangedNotifications -= 1;
+        }
+    };
+    CreatorThemeModel.prototype.loadTheme = function (theme) {
+        if (theme === void 0) { theme = {}; }
+        this.blockThemeChangedNotifications += 1;
+        try {
+            var baseTheme = _creator_themes__WEBPACK_IMPORTED_MODULE_4__.CreatorThemes[theme.themeName] || {};
+            this.themeName = theme.themeName || baseTheme.themeName || CreatorThemeModel.defautlThemeName;
+            var effectiveThemeCssVariables = {};
+            (0,_utils_utils__WEBPACK_IMPORTED_MODULE_3__.assign)(effectiveThemeCssVariables, baseTheme.cssVariables || {});
+            (0,_utils_utils__WEBPACK_IMPORTED_MODULE_3__.assign)(effectiveThemeCssVariables, theme.cssVariables || {}, this.themeCssVariablesChanges);
+            var effectiveTheme = {};
+            (0,_utils_utils__WEBPACK_IMPORTED_MODULE_3__.assign)(effectiveTheme, baseTheme, theme, { cssVariables: effectiveThemeCssVariables, themeName: this.themeName });
+            // this.initializeColorCalculator(effectiveTheme.cssVariables);
+            this.fromJSON(effectiveTheme);
+        }
+        finally {
+            this.blockThemeChangedNotifications -= 1;
+        }
+    };
+    CreatorThemeModel.prototype.fromJSON = function (json, options) {
+        if (!json)
+            return;
+        var _json = {};
+        (0,_utils_utils__WEBPACK_IMPORTED_MODULE_3__.assign)(_json, json);
+        delete _json["cssVariables"];
+        _super.prototype.fromJSON.call(this, _json, options);
+        if (json.cssVariables) {
+            _super.prototype.fromJSON.call(this, json.cssVariables, options);
+            this.initialCssVariables = {};
+            (0,_utils_utils__WEBPACK_IMPORTED_MODULE_3__.assign)(this.initialCssVariables, json.cssVariables);
+            this.updateScaleProperties();
+        }
+    };
+    CreatorThemeModel.prototype.toJSON = function (options) {
+        this.scaleCssVariables();
+        var result = _super.prototype.toJSON.call(this, options);
+        var cssVariables = {};
+        (0,_utils_utils__WEBPACK_IMPORTED_MODULE_3__.assign)(cssVariables, this.initialCssVariables, this.themeCssVariablesChanges);
+        result.cssVariables = cssVariables;
+        Object.keys(result).forEach(function (key) {
+            if (key.indexOf("--") == 0) {
+                delete result[key];
+            }
+        });
+        if (Object.keys(result.cssVariables).length === 0) {
+            delete result.cssVariables;
+        }
+        return result;
+    };
+    CreatorThemeModel.defautlThemeName = "sc2020";
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
+    ], CreatorThemeModel.prototype, "themeName", void 0);
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
+    ], CreatorThemeModel.prototype, "scale", void 0);
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
+    ], CreatorThemeModel.prototype, "fontScale", void 0);
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
+    ], CreatorThemeModel.prototype, "surfaceScale", void 0);
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
+    ], CreatorThemeModel.prototype, "isLight", void 0);
+    return CreatorThemeModel;
+}(survey_core__WEBPACK_IMPORTED_MODULE_1__.Base));
+
+survey_core__WEBPACK_IMPORTED_MODULE_1__.Serializer.addClass("creatortheme", [
+    {
+        type: "dropdown",
+        name: "themeName",
+        choices: _creator_themes__WEBPACK_IMPORTED_MODULE_4__.PredefinedCreatorThemes.map(function (theme) { return ({ value: theme, text: (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)("creatortheme.names." + theme) }); }),
+    }
+], function (json) { return new CreatorThemeModel(); });
+survey_core__WEBPACK_IMPORTED_MODULE_1__.Serializer.addProperties("creatortheme", [
+    {
+        type: "color",
+        name: "--sjs-special-background",
+        default: "#F3F3F3FF",
+        onPropertyEditorUpdate: function (obj, editor) {
+            if (!!editor) {
+                editor.title = (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)("creatortheme.--sjs-special-background");
+            }
+        }
+    }, {
+        type: "color",
+        name: "--sjs-primary-background-500",
+        default: "#19B394FF",
+        onPropertyEditorUpdate: function (obj, editor) {
+            if (!!editor) {
+                editor.title = (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)("creatortheme.--sjs-primary-background-500");
+            }
+        },
+    }, {
+        type: "color",
+        name: "--sjs-secondary-background-500",
+        default: "#FF9814FF",
+        displayName: ""
+    }, {
+        name: "--ctr-font-unit",
+        default: "8px",
+        visible: false,
+    }, {
+        name: "--ctr-line-height-unit",
+        default: "8px",
+        visible: false,
+    }, {
+        type: "spinedit",
+        name: "fontScale",
+        isSerializable: false,
+        default: 100,
+        enableIf: function (obj) {
+            return !obj || obj.themeName !== CreatorThemeModel.defautlThemeName;
+        },
+        onPropertyEditorUpdate: function (obj, editor) {
+            if (!!editor) {
+                editor.unit = "%";
+                editor.min = 0;
+                editor.step = 5;
+                editor.title = (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)("creatortheme.fontScale");
+                editor.titleLocation = "left";
+                editor.descriptionLocation = "hidden";
+            }
+        }
+    }, {
+        name: "--ctr-spacing-unit",
+        default: "8px",
+        visible: false,
+    }, {
+        name: "--ctr-size-unit",
+        default: "8px",
+        visible: false,
+    }, {
+        name: "--ctr-corner-radius-unit",
+        default: "8px",
+        visible: false,
+    }, {
+        type: "spinedit",
+        name: "scale",
+        isSerializable: false,
+        default: 100,
+        enableIf: function (obj) {
+            return !obj || obj.themeName !== CreatorThemeModel.defautlThemeName;
+        },
+        onPropertyEditorUpdate: function (obj, editor) {
+            if (!!editor) {
+                editor.unit = "%";
+                editor.min = 0;
+                editor.step = 5;
+                editor.title = (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)("creatortheme.userInterfaceBaseUnit");
+                editor.titleLocation = "left";
+                editor.descriptionLocation = "hidden";
+            }
+        }
+    }, {
+        name: "--ctr-surface-base-unit",
+        default: "8px",
+        visible: false,
+    }, {
+        type: "spinedit",
+        name: "surfaceScale",
+        isSerializable: false,
+        default: 100,
+        enableIf: function (obj) {
+            return !obj || obj.themeName !== CreatorThemeModel.defautlThemeName;
+        },
+        onPropertyEditorUpdate: function (obj, editor) {
+            if (!!editor) {
+                editor.unit = "%";
+                editor.min = 0;
+                editor.step = 5;
+                editor.title = (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)("creatortheme.surfaceScale");
+                editor.titleLocation = "left";
+                editor.descriptionLocation = "hidden";
+            }
+        }
+    }, {
+        name: "isLight:boolean",
+        visible: false,
+        isSerializable: false,
+    },
+]);
+
+
+/***/ }),
+
+/***/ "./src/creator-theme/creator-themes.ts":
+/*!*********************************************!*\
+  !*** ./src/creator-theme/creator-themes.ts ***!
+  \*********************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   CreatorThemes: () => (/* binding */ CreatorThemes),
+/* harmony export */   PredefinedCreatorThemes: () => (/* binding */ PredefinedCreatorThemes)
+/* harmony export */ });
+var PredefinedCreatorThemes = ["sc2020"];
+var CreatorThemes = {
+    "sc2020": {
+        themeName: "sc2020",
+        cssVariables: {
+            "--sjs-special-background": "#F3F3F3FF",
+            "--sjs-primary-background-500": "#19B394FF",
+            "--sjs-primary-background-10": "#19B3941A",
+            "--sjs-primary-background-400": "#14A48BFF",
+            "--sjs-secondary-background-500": "#FF9814FF",
+            "--sjs-secondary-background-25": "#FF981440",
+            "--sjs-secondary-background-10": "#FF98141A",
+            "--ctr-surface-background-color": "var(--sjs-special-background)",
+        }
+    }
+};
+
+
 /***/ }),
 
 /***/ "./src/custom-questions/question-color.ts":
@@ -25932,6 +26447,7 @@ var enStrings = {
         surveySettingsTooltip: "Survey settings",
         themeSettings: "Theme Settings",
         themeSettingsTooltip: "Theme settings",
+        creatorSettingTitle: "Creator Settings",
         showPanel: "Show Panel",
         hidePanel: "Hide Panel",
         prevSelected: "Select previous",
@@ -27561,7 +28077,20 @@ var enStrings = {
             tulip: "Tulip",
             brown: "Brown",
             green: "Green"
-        }
+        },
+    },
+    creatortheme: {
+        "--sjs-special-background": "Surface background",
+        "--sjs-primary-background-500": "Accent colors",
+        "surfaceScale": "Surface",
+        "userInterfaceBaseUnit": "User interface",
+        "fontScale": "Font",
+        names: {
+            "sc2020": "Survey Creator 2020",
+            "default-light": "Light",
+            "default-dark": "Dark",
+            "default-contrast": "Contrast"
+        },
     }
 };
 // Uncomment the line below if you create a custom dictionary.
@@ -31935,6 +32464,25 @@ var PropertyGridModel = /** @class */ (function () {
             }
         });
     };
+    PropertyGridModel.prototype.expandCategoryIfNeeded = function () {
+        var expandedTabName = _creator_settings__WEBPACK_IMPORTED_MODULE_6__.settings.propertyGrid.defaultExpandedTabName;
+        if (!!expandedTabName && !this.getPropertyGridExpandedCategory()) {
+            var panel = this.survey.getPanelByName(expandedTabName);
+            if (!!panel) {
+                panel.blockAnimations();
+                panel.expand();
+                panel.releaseAnimations();
+            }
+        }
+    };
+    PropertyGridModel.prototype.getPropertyGridExpandedCategory = function () {
+        var panels = this.survey.getAllPanels();
+        for (var i = 0; i < panels.length; i++) {
+            if (panels[i].isExpanded)
+                return panels[i].name;
+        }
+        return "";
+    };
     PropertyGridModel.prototype.collapseOtherPanels = function (panel) {
         this.collapseAllCategoriesExcept(panel);
     };
@@ -32493,6 +33041,14 @@ var PropertyGridEditorColor = /** @class */ (function (_super) {
         var res = { type: "color", allowEmptyValue: true };
         return res;
     };
+    PropertyGridEditorColor.prototype.onCreated = function (obj, question, prop) {
+        question.valueFromDataCallback = function (val) {
+            return val;
+        };
+        question.valueToDataCallback = function (val) {
+            return val;
+        };
+    };
     return PropertyGridEditorColor;
 }(PropertyGridEditor));
 
@@ -34232,6 +34788,16 @@ var PropertyGridViewModel = /** @class */ (function (_super) {
         _this.onSurveyChanged();
         return _this;
     }
+    Object.defineProperty(PropertyGridViewModel.prototype, "rootCss", {
+        get: function () {
+            return new survey_core__WEBPACK_IMPORTED_MODULE_1__.CssClassBuilder()
+                .append("spg-container")
+                .append("spg-container_search", this.searchEnabled)
+                .toString();
+        },
+        enumerable: false,
+        configurable: true
+    });
     PropertyGridViewModel.prototype.onPropertyValueChanged = function (name, oldValue, newValue) {
         _super.prototype.onPropertyValueChanged.call(this, name, oldValue, newValue);
         if (!!this.nextSelectionAction && name === "hasNext") {
@@ -34542,8 +35108,7 @@ var SearchManagerToolbox = /** @class */ (function (_super) {
         return _this;
     }
     SearchManagerToolbox.prototype.setFiterString = function (newValue, oldValue) {
-        if (!!oldValue != !!newValue)
-            this.toolbox.lockScrollBar(!!newValue);
+        this.toolbox.showSeparators = !newValue;
         this.toolbox.items.forEach(function (item) { return item.visible = item.hasText(newValue); });
         this.toolbox.showPlaceholder = !this.toolbox.items.filter(function (i) { return i.visible; }).length;
         this.toolbox.categories.forEach(function (category) {
@@ -34553,7 +35118,7 @@ var SearchManagerToolbox = /** @class */ (function (_super) {
     };
     SearchManagerToolbox.prototype.clearFilterString = function () {
         this.filterString = "";
-        this.toolbox.containerElement.querySelector("input").focus();
+        this.toolbox.rootElement.querySelector("input").focus();
     };
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
@@ -38490,6 +39055,16 @@ var QuestionToolboxItem = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(QuestionToolboxItem.prototype, "renderedCss", {
+        get: function () {
+            return new survey_core__WEBPACK_IMPORTED_MODULE_1__.CssClassBuilder()
+                .append("svc-toolbox__item")
+                .append(this.className)
+                .append("svc-toolbox__item--has-subitems", this.hasSubItems).toString();
+        },
+        enumerable: false,
+        configurable: true
+    });
     QuestionToolboxItem.prototype.toJSON = function () {
         return this.item;
     };
@@ -38647,6 +39222,7 @@ var QuestionToolbox = /** @class */ (function (_super) {
         _this.toolboxNoResultsFound = (0,_editorLocalization__WEBPACK_IMPORTED_MODULE_2__.getLocString)("ed.toolboxNoResultsFound");
         _this.categoriesTitles = {};
         _this.searchManager = new _property_grid_search_manager__WEBPACK_IMPORTED_MODULE_4__.SearchManagerToolbox();
+        _this.subItemsShowDelay = 0;
         _this.searchManager.isVisible = _this.searchEnabled;
         _this.searchManager.toolbox = _this;
         _this.searchItem = new survey_core__WEBPACK_IMPORTED_MODULE_1__.Action({
@@ -38657,7 +39233,7 @@ var QuestionToolbox = /** @class */ (function (_super) {
             component: "sv-action-bar-item",
             tooltip: survey_core__WEBPACK_IMPORTED_MODULE_1__.surveyLocalization.getString("search"),
             action: function () {
-                document.querySelector(".svc-toolbox__panel input").focus();
+                _this.rootElement.querySelector("input").focus();
                 _this.isFocused = true;
             }
         });
@@ -38725,18 +39301,12 @@ var QuestionToolbox = /** @class */ (function (_super) {
         this.isResponsivenessDisabled = false;
         this.raiseUpdate(true);
     };
-    QuestionToolbox.prototype.lockScrollBar = function (val) {
-        if (!this._containerElementValue)
-            return;
-        this.isScrollLocked = val && this._containerElementValue.scrollHeight > this._containerElementValue.clientHeight;
-    };
     QuestionToolbox.prototype.initDotsItem = function () {
         var _this = this;
-        var originalCss = this.dotsItem.css;
+        this.dotsItem.innerCss = "svc-toolbox__item svc-toolbox__item--dots sv-dots__item";
         this.dotsItem.css = new survey_core__WEBPACK_IMPORTED_MODULE_1__.ComputedUpdater(function () {
             return new survey_core__WEBPACK_IMPORTED_MODULE_1__.CssClassBuilder()
-                .append("svc-toolbox__tool")
-                .append(originalCss)
+                .append("svc-toolbox__tool svc-toolbox__tool--dots")
                 .append("sv-action--hidden", !_this.dotsItem.isVisible)
                 .toString();
         });
@@ -38805,7 +39375,30 @@ var QuestionToolbox = /** @class */ (function (_super) {
         configurable: true
     });
     QuestionToolbox.prototype.setRootElement = function (element) {
+        var _this = this;
+        this._rootElementValue = element;
         this._containerElementValue = element === null || element === void 0 ? void 0 : element.querySelector(this.containerSelector);
+        this._scrollbarElement = element === null || element === void 0 ? void 0 : element.querySelector(".svc-toolbox__scrollbar");
+        this._scrollbarSizerElement = element === null || element === void 0 ? void 0 : element.querySelector(".svc-toolbox__scrollbar-sizer");
+        this._containerBodyElement = element === null || element === void 0 ? void 0 : element.querySelector(".svc-toolbox__container");
+        if (!element)
+            return;
+        this._containerBodyResizeObserver = new ResizeObserver(function (entries) {
+            for (var _i = 0, entries_1 = entries; _i < entries_1.length; _i++) {
+                var entry = entries_1[_i];
+                var height = entry.contentBoxSize
+                    ? entry.contentBoxSize[0].blockSize
+                    : entry.contentRect.width;
+                _this._scrollbarSizerElement.style.height = height + "px";
+            }
+        });
+        this._containerBodyResizeObserver.observe(this._containerBodyElement);
+    };
+    QuestionToolbox.prototype.unsubscribeRootElement = function () {
+        if (!!this._containerBodyResizeObserver) {
+            this._containerBodyResizeObserver.disconnect();
+            this._containerBodyResizeObserver = undefined;
+        }
     };
     Object.defineProperty(QuestionToolbox.prototype, "containerElement", {
         get: function () {
@@ -38814,6 +39407,13 @@ var QuestionToolbox = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(QuestionToolbox.prototype, "rootElement", {
+        get: function () {
+            return this._rootElementValue;
+        },
+        enumerable: false,
+        configurable: true
+    });
     QuestionToolbox.prototype.focusOut = function (e) {
         if (e.relatedTarget !== e.currentTarget &&
             !e.currentTarget.contains(e.relatedTarget)) {
@@ -38826,9 +39426,8 @@ var QuestionToolbox = /** @class */ (function (_super) {
             return new survey_core__WEBPACK_IMPORTED_MODULE_1__.CssClassBuilder()
                 .append("svc-toolbox")
                 .append("svc-toolbox--searchable", this.searchEnabled)
-                .append("svc-toolbox--filtering", !!this.searchManager.filterString)
+                .append("svc-toolbox--no-separators", !this.showSeparators)
                 .append("svc-toolbox--compact", this.isCompactRendered)
-                .append("svc-toolbox--scroll-locked", this.isScrollLocked)
                 .append("svc-toolbox--flyout", this.isCompact && this.isFocused)
                 .append("svc-toolbox--scrollable", this.overflowBehavior == "scroll").toString();
         },
@@ -39637,6 +40236,10 @@ var QuestionToolbox = /** @class */ (function (_super) {
     };
     QuestionToolbox.prototype.onScroll = function (model, event) {
         this.hideAllInnerPopups();
+        this._scrollbarElement.scrollTop = this._containerElementValue.scrollTop;
+    };
+    QuestionToolbox.prototype.onScrollbarScroll = function (event) {
+        this._containerElementValue.scrollTop = this._scrollbarElement.scrollTop;
     };
     QuestionToolbox.MINELEMENTCOUNT = 10;
     QuestionToolbox.defaultIconName = "icon-default";
@@ -39704,12 +40307,12 @@ var QuestionToolbox = /** @class */ (function (_super) {
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)({ defaultValue: true })
     ], QuestionToolbox.prototype, "showSubitems", void 0);
-    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
-        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)({ defaultValue: false })
-    ], QuestionToolbox.prototype, "isScrollLocked", void 0);
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
     ], QuestionToolbox.prototype, "showPlaceholder", void 0);
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)({ defaultValue: true })
+    ], QuestionToolbox.prototype, "showSeparators", void 0);
     return QuestionToolbox;
 }(survey_core__WEBPACK_IMPORTED_MODULE_1__.AdaptiveActionContainer));
 
@@ -40638,6 +41241,17 @@ module.exports = __WEBPACK_EXTERNAL_MODULE_survey_core__;
 
 /***/ }),
 
+/***/ "survey-creator-core/themes":
+/*!******************************************************************************************************************************************************************!*\
+  !*** external {"root":"SurveyCreatorTheme","commonjs2":"survey-creator-core/themes","commonjs":"survey-creator-core/themes","amd":"survey-creator-core/themes"} ***!
+  \******************************************************************************************************************************************************************/
+/***/ ((module) => {
+
+"use strict";
+module.exports = __WEBPACK_EXTERNAL_MODULE_survey_creator_core_themes__;
+
+/***/ }),
+
 /***/ "survey-core/themes":
 /*!***********************************************************************************************************************************!*\
   !*** external {"root":"SurveyTheme","commonjs2":"survey-core/themes","commonjs":"survey-core/themes","amd":"survey-core/themes"} ***!
@@ -40731,18 +41345,19 @@ __webpack_require__.r(__webpack_exports__);
 /* 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_84__.CreatorPreset),
-/* harmony export */   CreatorPresetBase: () => (/* reexport safe */ _presets_presets_base__WEBPACK_IMPORTED_MODULE_83__.CreatorPresetBase),
-/* harmony export */   CreatorPresetPropertyGrid: () => (/* reexport safe */ _presets_presets_properties__WEBPACK_IMPORTED_MODULE_85__.CreatorPresetPropertyGrid),
-/* harmony export */   CreatorPresetPropertyGridDefinition: () => (/* reexport safe */ _presets_presets_properties__WEBPACK_IMPORTED_MODULE_85__.CreatorPresetPropertyGridDefinition),
-/* harmony export */   CreatorPresetTabs: () => (/* reexport safe */ _presets_presets_tabs__WEBPACK_IMPORTED_MODULE_86__.CreatorPresetTabs),
-/* harmony export */   CreatorPresetToolbox: () => (/* reexport safe */ _presets_presets_toolbox__WEBPACK_IMPORTED_MODULE_87__.CreatorPresetToolbox),
-/* harmony export */   CreatorPresetToolboxConfigurator: () => (/* reexport safe */ _presets_presets_toolbox__WEBPACK_IMPORTED_MODULE_87__.CreatorPresetToolboxConfigurator),
-/* harmony export */   CreatorPresetToolboxDefinition: () => (/* reexport safe */ _presets_presets_toolbox__WEBPACK_IMPORTED_MODULE_87__.CreatorPresetToolboxDefinition),
+/* harmony export */   CreatorPreset: () => (/* reexport safe */ _presets_presets__WEBPACK_IMPORTED_MODULE_86__.CreatorPreset),
+/* harmony export */   CreatorPresetBase: () => (/* reexport safe */ _presets_presets_base__WEBPACK_IMPORTED_MODULE_85__.CreatorPresetBase),
+/* harmony export */   CreatorPresetPropertyGrid: () => (/* reexport safe */ _presets_presets_properties__WEBPACK_IMPORTED_MODULE_87__.CreatorPresetPropertyGrid),
+/* harmony export */   CreatorPresetPropertyGridDefinition: () => (/* reexport safe */ _presets_presets_properties__WEBPACK_IMPORTED_MODULE_87__.CreatorPresetPropertyGridDefinition),
+/* harmony export */   CreatorPresetTabs: () => (/* reexport safe */ _presets_presets_tabs__WEBPACK_IMPORTED_MODULE_88__.CreatorPresetTabs),
+/* harmony export */   CreatorPresetToolbox: () => (/* reexport safe */ _presets_presets_toolbox__WEBPACK_IMPORTED_MODULE_89__.CreatorPresetToolbox),
+/* harmony export */   CreatorPresetToolboxConfigurator: () => (/* reexport safe */ _presets_presets_toolbox__WEBPACK_IMPORTED_MODULE_89__.CreatorPresetToolboxConfigurator),
+/* harmony export */   CreatorPresetToolboxDefinition: () => (/* reexport safe */ _presets_presets_toolbox__WEBPACK_IMPORTED_MODULE_89__.CreatorPresetToolboxDefinition),
 /* harmony export */   CreatorResponsivityManager: () => (/* reexport safe */ _creator_responsivity_manager__WEBPACK_IMPORTED_MODULE_6__.CreatorResponsivityManager),
+/* harmony export */   CreatorThemeModel: () => (/* reexport safe */ _creator_theme_creator_theme_model__WEBPACK_IMPORTED_MODULE_84__.CreatorThemeModel),
 /* harmony export */   DEFAULT_MONITOR_DPI: () => (/* reexport safe */ _components_simulator__WEBPACK_IMPORTED_MODULE_40__.DEFAULT_MONITOR_DPI),
 /* harmony export */   DefaultFonts: () => (/* reexport safe */ _components_tabs_theme_custom_questions_font_settings__WEBPACK_IMPORTED_MODULE_14__.DefaultFonts),
-/* harmony export */   DragDropSurveyElements: () => (/* reexport safe */ _survey_elements__WEBPACK_IMPORTED_MODULE_88__.DragDropSurveyElements),
+/* harmony export */   DragDropSurveyElements: () => (/* reexport safe */ _survey_elements__WEBPACK_IMPORTED_MODULE_90__.DragDropSurveyElements),
 /* 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_74__.HSBToRGB),
@@ -40905,9 +41520,9 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   assignDefaultV2Classes: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_74__.assignDefaultV2Classes),
 /* harmony export */   backgroundCornerRadiusFromCssVariable: () => (/* reexport safe */ _components_tabs_theme_custom_questions_background_corner_radius__WEBPACK_IMPORTED_MODULE_15__.backgroundCornerRadiusFromCssVariable),
 /* harmony export */   backgroundCornerRadiusToCssVariable: () => (/* reexport safe */ _components_tabs_theme_custom_questions_background_corner_radius__WEBPACK_IMPORTED_MODULE_15__.backgroundCornerRadiusToCssVariable),
-/* harmony export */   calculateDragOverLocation: () => (/* reexport safe */ _survey_elements__WEBPACK_IMPORTED_MODULE_88__.calculateDragOverLocation),
-/* harmony export */   calculateIsEdge: () => (/* reexport safe */ _survey_elements__WEBPACK_IMPORTED_MODULE_88__.calculateIsEdge),
-/* harmony export */   calculateIsSide: () => (/* reexport safe */ _survey_elements__WEBPACK_IMPORTED_MODULE_88__.calculateIsSide),
+/* harmony export */   calculateDragOverLocation: () => (/* reexport safe */ _survey_elements__WEBPACK_IMPORTED_MODULE_90__.calculateDragOverLocation),
+/* harmony export */   calculateIsEdge: () => (/* reexport safe */ _survey_elements__WEBPACK_IMPORTED_MODULE_90__.calculateIsEdge),
+/* harmony export */   calculateIsSide: () => (/* reexport safe */ _survey_elements__WEBPACK_IMPORTED_MODULE_90__.calculateIsSide),
 /* harmony export */   capitalize: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_74__.capitalize),
 /* harmony export */   clearNewLines: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_74__.clearNewLines),
 /* harmony export */   convertRgbaToString: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_74__.convertRgbaToString),
@@ -40918,6 +41533,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   createColor: () => (/* reexport safe */ _components_tabs_theme_custom_questions_color_alpha__WEBPACK_IMPORTED_MODULE_12__.createColor),
 /* harmony export */   createExportCSVAction: () => (/* reexport safe */ _components_tabs_translation__WEBPACK_IMPORTED_MODULE_21__.createExportCSVAction),
 /* harmony export */   createImportCSVAction: () => (/* reexport safe */ _components_tabs_translation__WEBPACK_IMPORTED_MODULE_21__.createImportCSVAction),
+/* harmony export */   creatorThemeModelEditorDefinition: () => (/* reexport safe */ _creator_theme_creator_theme_model_definition__WEBPACK_IMPORTED_MODULE_83__.creatorThemeModelEditorDefinition),
+/* harmony export */   creatorThemeModelPropertyGridDefinition: () => (/* reexport safe */ _creator_theme_creator_theme_model_definition__WEBPACK_IMPORTED_MODULE_83__.creatorThemeModelPropertyGridDefinition),
 /* harmony export */   defaultPropertyGridDefinition: () => (/* reexport safe */ _question_editor_definition__WEBPACK_IMPORTED_MODULE_76__.defaultPropertyGridDefinition),
 /* harmony export */   defaultStrings: () => (/* reexport safe */ _editorLocalization__WEBPACK_IMPORTED_MODULE_1__.defaultStrings),
 /* harmony export */   editableStringRendererName: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.editableStringRendererName),
@@ -40938,6 +41555,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   getNextItemValue: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_74__.getNextItemValue),
 /* harmony export */   getNextValue: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_74__.getNextValue),
 /* harmony export */   getNodesFromKoComponentInfo: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_74__.getNodesFromKoComponentInfo),
+/* harmony export */   getPredefinedColorsItemValues: () => (/* reexport safe */ _components_tabs_themes__WEBPACK_IMPORTED_MODULE_16__.getPredefinedColorsItemValues),
 /* harmony export */   getQuestionContentWrapperComponentName: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.getQuestionContentWrapperComponentName),
 /* harmony export */   getQuestionFromObj: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_74__.getQuestionFromObj),
 /* harmony export */   ignoreUndoRedo: () => (/* reexport safe */ _plugins_undo_redo__WEBPACK_IMPORTED_MODULE_80__.ignoreUndoRedo),
@@ -40946,7 +41564,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   initLogicOperator: () => (/* reexport safe */ _components_tabs_logic__WEBPACK_IMPORTED_MODULE_20__.initLogicOperator),
 /* harmony export */   initialSettingsAllowShowEmptyTitleInDesignMode: () => (/* reexport safe */ _components_tabs_designer__WEBPACK_IMPORTED_MODULE_24__.initialSettingsAllowShowEmptyTitleInDesignMode),
 /* harmony export */   initializeDesignTimeSurveyModel: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.initializeDesignTimeSurveyModel),
-/* harmony export */   isPanelDynamic: () => (/* reexport safe */ _survey_elements__WEBPACK_IMPORTED_MODULE_88__.isPanelDynamic),
+/* harmony export */   isPanelDynamic: () => (/* reexport safe */ _survey_elements__WEBPACK_IMPORTED_MODULE_90__.isPanelDynamic),
 /* harmony export */   isPropertyVisible: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_74__.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),
@@ -41063,16 +41681,18 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _plugins_undo_redo__WEBPACK_IMPORTED_MODULE_80__ = __webpack_require__(/*! ../plugins/undo-redo */ "./src/plugins/undo-redo/index.ts");
 /* harmony import */ var _plugins_undo_redo_undo_redo_manager__WEBPACK_IMPORTED_MODULE_81__ = __webpack_require__(/*! ../plugins/undo-redo/undo-redo-manager */ "./src/plugins/undo-redo/undo-redo-manager.ts");
 /* harmony import */ var _pages_controller__WEBPACK_IMPORTED_MODULE_82__ = __webpack_require__(/*! ../pages-controller */ "./src/pages-controller.ts");
-/* harmony import */ var _presets_presets_base__WEBPACK_IMPORTED_MODULE_83__ = __webpack_require__(/*! ../presets/presets-base */ "./src/presets/presets-base.ts");
-/* harmony import */ var _presets_presets__WEBPACK_IMPORTED_MODULE_84__ = __webpack_require__(/*! ../presets/presets */ "./src/presets/presets.ts");
-/* harmony import */ var _presets_presets_properties__WEBPACK_IMPORTED_MODULE_85__ = __webpack_require__(/*! ../presets/presets-properties */ "./src/presets/presets-properties.ts");
-/* harmony import */ var _presets_presets_tabs__WEBPACK_IMPORTED_MODULE_86__ = __webpack_require__(/*! ../presets/presets-tabs */ "./src/presets/presets-tabs.ts");
-/* harmony import */ var _presets_presets_toolbox__WEBPACK_IMPORTED_MODULE_87__ = __webpack_require__(/*! ../presets/presets-toolbox */ "./src/presets/presets-toolbox.ts");
-/* harmony import */ var _survey_elements__WEBPACK_IMPORTED_MODULE_88__ = __webpack_require__(/*! ../survey-elements */ "./src/survey-elements.ts");
-/* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_89__ = __webpack_require__(/*! survey-core */ "survey-core");
-/* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_89___default = /*#__PURE__*/__webpack_require__.n(survey_core__WEBPACK_IMPORTED_MODULE_89__);
+/* harmony import */ var _creator_theme_creator_theme_model_definition__WEBPACK_IMPORTED_MODULE_83__ = __webpack_require__(/*! ../creator-theme/creator-theme-model-definition */ "./src/creator-theme/creator-theme-model-definition.ts");
+/* harmony import */ var _creator_theme_creator_theme_model__WEBPACK_IMPORTED_MODULE_84__ = __webpack_require__(/*! ../creator-theme/creator-theme-model */ "./src/creator-theme/creator-theme-model.ts");
+/* harmony import */ var _presets_presets_base__WEBPACK_IMPORTED_MODULE_85__ = __webpack_require__(/*! ../presets/presets-base */ "./src/presets/presets-base.ts");
+/* harmony import */ var _presets_presets__WEBPACK_IMPORTED_MODULE_86__ = __webpack_require__(/*! ../presets/presets */ "./src/presets/presets.ts");
+/* harmony import */ var _presets_presets_properties__WEBPACK_IMPORTED_MODULE_87__ = __webpack_require__(/*! ../presets/presets-properties */ "./src/presets/presets-properties.ts");
+/* harmony import */ var _presets_presets_tabs__WEBPACK_IMPORTED_MODULE_88__ = __webpack_require__(/*! ../presets/presets-tabs */ "./src/presets/presets-tabs.ts");
+/* harmony import */ var _presets_presets_toolbox__WEBPACK_IMPORTED_MODULE_89__ = __webpack_require__(/*! ../presets/presets-toolbox */ "./src/presets/presets-toolbox.ts");
+/* harmony import */ var _survey_elements__WEBPACK_IMPORTED_MODULE_90__ = __webpack_require__(/*! ../survey-elements */ "./src/survey-elements.ts");
+/* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_91__ = __webpack_require__(/*! survey-core */ "survey-core");
+/* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_91___default = /*#__PURE__*/__webpack_require__.n(survey_core__WEBPACK_IMPORTED_MODULE_91__);
 var Version;
-Version = "".concat("1.12.6");
+Version = "".concat("1.12.7");
 //should be loaded before other styles for easier override 
 __webpack_require__(/*! ../utils/context-button.scss */ "./src/utils/context-button.scss");
 
@@ -41164,6 +41784,8 @@ __webpack_require__(/*! ../utils/context-button.scss */ "./src/utils/context-but
 
 
 
+
+
 
 
 
@@ -41174,6 +41796,7 @@ __webpack_require__(/*! ../components/tabbed-menu/tabbed-menu.scss */ "./src/com
 __webpack_require__(/*! ../components/toolbox/toolbox-tool.scss */ "./src/components/toolbox/toolbox-tool.scss");
 __webpack_require__(/*! ../components/question-dropdown.scss */ "./src/components/question-dropdown.scss");
 __webpack_require__(/*! ../components/toolbox/toolbox.scss */ "./src/components/toolbox/toolbox.scss");
+__webpack_require__(/*! ../components/toolbox/toolbox-right.scss */ "./src/components/toolbox/toolbox-right.scss");
 __webpack_require__(/*! ../components/side-bar/side-bar.scss */ "./src/components/side-bar/side-bar.scss");
 __webpack_require__(/*! ../components/side-bar/tab-control.scss */ "./src/components/side-bar/tab-control.scss");
 __webpack_require__(/*! ../property-grid-theme/property-grid.scss */ "./src/property-grid-theme/property-grid.scss");
@@ -41181,8 +41804,8 @@ __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_89__.settings.supportCreatorV2 = true;
-(0,survey_core__WEBPACK_IMPORTED_MODULE_89__.checkLibraryVersion)("".concat("1.12.6"), "survey-creator-core");
+survey_core__WEBPACK_IMPORTED_MODULE_91__.settings.supportCreatorV2 = true;
+(0,survey_core__WEBPACK_IMPORTED_MODULE_91__.checkLibraryVersion)("".concat("1.12.7"), "survey-creator-core");
 
 })();