survey-creator-core 2.0.0-rc.3 → 2.0.0-rc.4

package/survey-creator-core.i18n.js

@@ -1,5 +1,5 @@
 /*!
- * SurveyJS Creator v2.0.0-rc.3
+ * SurveyJS Creator v2.0.0-rc.4
  * (c) 2015-2025 Devsoft Baltic OÜ - http://surveyjs.io/
  * Github: https://github.com/surveyjs/survey-creator
  * License: https://surveyjs.io/Licenses#SurveyCreator

package/survey-creator-core.i18n.min.js.LICENSE.txt

@@ -1,5 +1,5 @@
 /*!
- * SurveyJS Creator v2.0.0-rc.3
+ * SurveyJS Creator v2.0.0-rc.4
  * (c) 2015-2025 Devsoft Baltic OÜ - http://surveyjs.io/
  * Github: https://github.com/surveyjs/survey-creator
  * License: https://surveyjs.io/Licenses#SurveyCreator

package/survey-creator-core.js

@@ -1,5 +1,5 @@
 /*!
- * SurveyJS Creator v2.0.0-rc.3
+ * SurveyJS Creator v2.0.0-rc.4
  * (c) 2015-2025 Devsoft Baltic OÜ - http://surveyjs.io/
  * Github: https://github.com/surveyjs/survey-creator
  * License: https://surveyjs.io/Licenses#SurveyCreator
@@ -10469,7 +10469,7 @@ var TabDesignerPlugin = /** @class */ (function () {
         var _this = this;
         this.creator = creator;
         this._showOneCategoryInPropertyGrid = true;
-        creator.addPluginTab("designer", this);
+        creator.addTab({ name: "designer", plugin: this, iconName: "icon-config" });
         this.tabControlModel = new _side_bar_tab_control_model__WEBPACK_IMPORTED_MODULE_6__.TabControlModel(this.creator.sidebar);
         this.propertyGrid = new _property_grid__WEBPACK_IMPORTED_MODULE_2__.PropertyGridModel(undefined, creator, creator.getPropertyGridDefinition());
         this.showOneCategoryInPropertyGrid = creator.showOneCategoryInPropertyGrid;
@@ -11069,6 +11069,7 @@ var TabDesignerViewModel = /** @class */ (function (_super) {
             "--lbr-stroke-unit": 1,
         };
         _this.surfaceScale = 100;
+        _this.surfaceCssVariables = {};
         _this.scaleCssVariables = {};
         _this._pages = [];
         _this.pagesAnimation = new survey_core__WEBPACK_IMPORTED_MODULE_1__.AnimationGroup(_this.getPagesAnimationOptions(), function (val) {
@@ -11078,12 +11079,22 @@ var TabDesignerViewModel = /** @class */ (function (_super) {
         _this.creator = creator;
         _this.pagesControllerValue = new _pages_controller__WEBPACK_IMPORTED_MODULE_3__.PagesController(creator);
         _this.creator.dragDropChoices.onShortcutCreated = function (shortcut) {
-            Object.keys(_this.surveyThemeVariables).forEach(function (key) {
-                shortcut.style.setProperty(key, _this.surveyThemeVariables[key]);
+            var _a;
+            var cssVariables = {};
+            if ((_a = _this.creator.dragDropChoices["parentElement"]) === null || _a === void 0 ? void 0 : _a.survey["isPopupEditorContent"]) {
+                (0,_utils_utils__WEBPACK_IMPORTED_MODULE_7__.assign)(cssVariables, _designTabSurveyThemeJSON__WEBPACK_IMPORTED_MODULE_8__["default"].cssVariables);
+            }
+            else {
+                shortcut.classList.add("svc-surface-drag-drop-choices-shortcut");
+                (0,_utils_utils__WEBPACK_IMPORTED_MODULE_7__.assign)(cssVariables, _this.surfaceCssVariables);
+            }
+            Object.keys(cssVariables).forEach(function (key) {
+                shortcut.style.setProperty(key, cssVariables[key]);
             });
         };
         _this.initSurfaceToolbar();
         _this.initSurvey();
+        _this.updateSurfaceCssVariables();
         return _this;
     }
     Object.defineProperty(TabDesignerViewModel.prototype, "displayPageDropTarget", {
@@ -11139,18 +11150,12 @@ var TabDesignerViewModel = /** @class */ (function (_super) {
     TabDesignerViewModel.prototype.isModifiedPage = function (page) {
         return Object.keys(page.toJSON()).filter(function (key) { return key !== "name"; }).length > 0;
     };
-    Object.defineProperty(TabDesignerViewModel.prototype, "surveyThemeVariables", {
-        get: function () {
-            var cssVariables = {};
-            (0,_utils_utils__WEBPACK_IMPORTED_MODULE_7__.assign)(cssVariables, _designTabSurveyThemeJSON__WEBPACK_IMPORTED_MODULE_8__["default"].cssVariables, {
-                "--sjs-base-unit": "var(--ctr-surface-base-unit)",
-                "--sjs-font-size": "calc(2 * var(--ctr-surface-base-unit))",
-            });
-            return cssVariables;
-        },
-        enumerable: false,
-        configurable: true
-    });
+    TabDesignerViewModel.prototype.updateSurfaceCssVariables = function () {
+        var _a;
+        var cssVariables = {};
+        (0,_utils_utils__WEBPACK_IMPORTED_MODULE_7__.assign)(cssVariables, _designTabSurveyThemeJSON__WEBPACK_IMPORTED_MODULE_8__["default"].cssVariables, ((_a = this.creator.creatorTheme) === null || _a === void 0 ? void 0 : _a.cssVariables) || {}, this.scaleCssVariables);
+        this.surfaceCssVariables = cssVariables;
+    };
     TabDesignerViewModel.prototype.initSurfaceToolbar = function () {
         var _this = this;
         this.surfaceToolbar = new survey_core__WEBPACK_IMPORTED_MODULE_1__.ActionContainer();
@@ -11245,9 +11250,7 @@ var TabDesignerViewModel = /** @class */ (function (_super) {
         Object.keys(this.unitDictionary).forEach(function (key) {
             _this.scaleCssVariables[key] = (_this.unitDictionary[key] * scaleFactor / 100) + "px";
         });
-        var newCssVariable = {};
-        (0,_utils_utils__WEBPACK_IMPORTED_MODULE_7__.assign)(newCssVariable, this.creator.themeVariables, this.scaleCssVariables);
-        this.creator.themeVariables = newCssVariable;
+        this.updateSurfaceCssVariables();
     };
     Object.defineProperty(TabDesignerViewModel.prototype, "survey", {
         get: function () {
@@ -11326,7 +11329,11 @@ var TabDesignerViewModel = /** @class */ (function (_super) {
         this.isUpdatingNewPage = false;
     };
     TabDesignerViewModel.prototype.calculateDesignerCss = function () {
-        return this.survey.css.container + " " + this.survey.css.container + "--" + this.survey.calculatedWidthMode;
+        return new survey_core__WEBPACK_IMPORTED_MODULE_1__.CssClassBuilder()
+            .append("svc-designer-surface")
+            .append(this.survey.css.container)
+            .append(this.survey.css.container + "--" + this.survey.calculatedWidthMode)
+            .toString();
     };
     TabDesignerViewModel.prototype.initSurvey = function () {
         var _this = this;
@@ -11495,6 +11502,9 @@ var TabDesignerViewModel = /** @class */ (function (_super) {
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
     ], TabDesignerViewModel.prototype, "surfaceScale", void 0);
+    (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
+        (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.property)()
+    ], TabDesignerViewModel.prototype, "surfaceCssVariables", void 0);
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__decorate)([
         (0,survey_core__WEBPACK_IMPORTED_MODULE_1__.propertyArray)()
     ], TabDesignerViewModel.prototype, "_pages", void 0);
@@ -11977,7 +11987,7 @@ var TabJsonEditorAcePlugin = /** @class */ (function (_super) {
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__extends)(TabJsonEditorAcePlugin, _super);
     function TabJsonEditorAcePlugin(creator) {
         var _this = _super.call(this, creator) || this;
-        creator.addPluginTab("json", _this, undefined, "svc-tab-json-editor-ace");
+        creator.addTab({ name: "json", plugin: _this, iconName: "icon-codeeditor-24x24", componentName: "svc-tab-json-editor-ace" });
         return _this;
     }
     TabJsonEditorAcePlugin.prototype.createModel = function (creator) {
@@ -12388,7 +12398,7 @@ var TabJsonEditorTextareaPlugin = /** @class */ (function (_super) {
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__extends)(TabJsonEditorTextareaPlugin, _super);
     function TabJsonEditorTextareaPlugin(creator) {
         var _this = _super.call(this, creator) || this;
-        creator.addPluginTab("json", _this, undefined, "svc-tab-json-editor-textarea");
+        creator.addTab({ name: "json", plugin: _this, iconName: "icon-codeeditor-24x24", componentName: "svc-tab-json-editor-textarea" });
         return _this;
     }
     TabJsonEditorTextareaPlugin.prototype.createModel = function (creator) {
@@ -14131,7 +14141,7 @@ __webpack_require__.r(__webpack_exports__);
 var TabLogicPlugin = /** @class */ (function () {
     function TabLogicPlugin(creator) {
         this.creator = creator;
-        creator.addPluginTab("logic", this);
+        creator.addTab({ name: "logic", plugin: this, iconName: "icon-logic-24x24" });
         this.createActions().forEach(function (action) { return creator.toolbar.actions.push(action); });
     }
     TabLogicPlugin.prototype.activate = function () {
@@ -15323,7 +15333,6 @@ var SurveyLogicUI = /** @class */ (function (_super) {
         if (!_this.options)
             _this.options = new _creator_settings__WEBPACK_IMPORTED_MODULE_3__.EmptySurveyCreatorOptions();
         _this.setupToolbarItems();
-        _this.update();
         return _this;
     }
     SurveyLogicUI.prototype.update = function (survey, options) {
@@ -16858,7 +16867,7 @@ var TabTestPlugin = /** @class */ (function () {
         this.creator = creator;
         this.simulatorTheme = survey_core__WEBPACK_IMPORTED_MODULE_1__.surveyCss[survey_core__WEBPACK_IMPORTED_MODULE_1__.defaultThemeName];
         this._previewDevice = "";
-        creator.addPluginTab("preview", this);
+        creator.addTab({ name: "preview", plugin: this, iconName: "icon-preview" });
         this.setPreviewTheme(this.creator.previewTheme);
         this.createActions().forEach(function (action) { return creator.toolbar.actions.push(action); });
     }
@@ -19067,7 +19076,7 @@ var ThemeTabPlugin = /** @class */ (function () {
          * A Boolean property that you can set to `false` if you want to disallow theme modifications.
          */
         this.onAllowModifyTheme = new survey_core__WEBPACK_IMPORTED_MODULE_0__.EventBase();
-        creator.addPluginTab("theme", this);
+        creator.addTab({ name: "theme", plugin: this, iconName: "icon-theme" });
         this.simulatorCssClasses = survey_core__WEBPACK_IMPORTED_MODULE_0__.surveyCss[survey_core__WEBPACK_IMPORTED_MODULE_0__.defaultThemeName];
         this.tabControlModel = new _side_bar_tab_control_model__WEBPACK_IMPORTED_MODULE_13__.TabControlModel(this.creator.sidebar);
         this.createActions().forEach(function (action) { return creator.toolbar.actions.push(action); });
@@ -20010,7 +20019,7 @@ var TabTranslationPlugin = /** @class */ (function () {
     function TabTranslationPlugin(creator) {
         this.creator = creator;
         this._showOneCategoryInPropertyGrid = true;
-        creator.addPluginTab("translation", this);
+        creator.addTab({ name: "translation", plugin: this, iconName: "icon-language" });
         this.showOneCategoryInPropertyGrid = creator.showOneCategoryInPropertyGrid;
         this.tabControlModel = new _side_bar_tab_control_model__WEBPACK_IMPORTED_MODULE_3__.TabControlModel(this.creator.sidebar);
         this.sidebarTab = this.creator.sidebar.addPage("translation");
@@ -23278,6 +23287,9 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
          * ```
          */
         _this.onCreateCustomMessagePanel = _this.addCreatorEvent();
+        /**
+         * An event that is raised when users change a property in a [Survey Creator theme](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#creatorTheme).
+         */
         _this.onCreatorThemePropertyChanged = _this.addCreatorEvent();
         // /**
         //  * You need to set this property to true if you want to use tabs instead of accordion in the popup element's editor.
@@ -23542,6 +23554,7 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
         _this.initTabs();
         _this.syncSaveButtons = _this.options.saveSurveyAndTheme !== undefined ? _this.options.saveSurveyAndTheme : _this.options.syncSaveButtons;
         _this.isTouch = survey_core__WEBPACK_IMPORTED_MODULE_1__.IsTouch;
+        _this.currentOS = (0,_utils_utils__WEBPACK_IMPORTED_MODULE_8__.getOS)();
         var expandAction = _this.sidebar.getExpandAction();
         !!expandAction && _this.toolbar.actions.push(expandAction);
         return _this;
@@ -23692,7 +23705,10 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
     });
     Object.defineProperty(SurveyCreatorModel.prototype, "startEditTitleOnQuestionAdded", {
         get: function () {
-            return !this.isMobileView && !this.toolbox.searchManager.filterString && this.startEditTitleOnQuestionAddedValue;
+            return !this.isMobileView &&
+                !((this.currentOS == "iOS" || this.currentOS == "Mac OS") && this.isTouch) &&
+                !this.toolbox.searchManager.filterString &&
+                this.startEditTitleOnQuestionAddedValue;
         },
         set: function (value) {
             this.startEditTitleOnQuestionAddedValue = value;
@@ -23804,18 +23820,45 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
     SurveyCreatorModel.prototype.showPreview = function () {
         this.activeTab = "preview";
     };
+    /**
+     * @deprecated Use the [`addTab(tabOptions)`](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#addTab) method instead.
+     */
+    SurveyCreatorModel.prototype.addPluginTab = function (name, plugin, title, componentName, index) {
+        this.tabbedMenu.addTab(name, plugin, title, undefined, componentName, index);
+        this.addPlugin(name, plugin);
+    };
     /**
      * Adds a custom tab to Survey Creator.
      *
+     * This method accepts an `ITabOptions` object with the following properties:
+     *
+     * - `name`: `string`\
+     * A unique tab ID.
+     *
+     * - `plugin`: `ICreatorPlugin`\
+     * An object that allows you to handle user interactions with the tab.
+     *
+     * - `title`: `string`\
+     * *(Optional)* A tab caption. If `title` is undefined, the `name` property value is displayed instead. To localize the caption, add its translations to the `ed` object within [localization dictionaries](https://github.com/surveyjs/survey-creator/tree/90de47d2c9da49b06a7f97414026d70f7acf05c6/packages/survey-creator-core/src/localization) and pass `ed.propertyName` as the `title` property.
+     *
+     * - `iconName`: `string`\
+     * *(Optional)* An [icon name](https://surveyjs.io/form-library/documentation/icons). Icons are used when the tab bar doesn't have enough width to display tab titles.
+     *
+     * - `componentName`: `string`\
+     * *(Optional)* The name of the component that renders tab markup. Default value: `"svc-tab-" + name`.
+     *
+     * - `index`: `number`\
+     * *(Optional)* A zero-based index that specifies the tab's position relative to other tabs.
+     *
      * [View Demo](https://surveyjs.io/survey-creator/examples/modify-tab-bar/ (linkStyle))
-     * @param name A unique tab ID.
-     * @param plugin An object that allows you to handle user interactions with the tab.
-     * @param title A tab caption. If `title` is undefined, the `name` argument value is displayed instead. To localize the caption, add its translations to the `ed` object within [localization dictionaries](https://github.com/surveyjs/survey-creator/tree/90de47d2c9da49b06a7f97414026d70f7acf05c6/packages/survey-creator-core/src/localization) and pass `ed.propertyName` as the `title` argument.
-     * @param componentName The name of the component that renders tab markup. Default value: `"svc-tab-" + name`.
-     * @param index A zero-based index that specifies the tab's position relative to other tabs.
+     * @param tabOptions An object that configures the custom tab.
      */
-    SurveyCreatorModel.prototype.addPluginTab = function (name, plugin, title, componentName, index) {
-        this.tabbedMenu.addTab(name, plugin, title, componentName, index);
+    SurveyCreatorModel.prototype.addTab = function (tabOptions) {
+        var name = tabOptions.name, plugin = tabOptions.plugin, title = tabOptions.title, iconName = tabOptions.iconName, componentName = tabOptions.componentName, index = tabOptions.index;
+        if (!name || !plugin) {
+            throw new Error("Plugin or name is not set");
+        }
+        this.tabbedMenu.addTab(name, plugin, title, iconName, componentName, index);
         this.addPlugin(name, plugin);
     };
     SurveyCreatorModel.prototype.addPlugin = function (name, plugin) {
@@ -25917,18 +25960,32 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
             return options.newSelectedElement;
         return val;
     };
+    /**
+     * Opens [Survey Creator theme](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#creatorTheme) settings in Property Grid. Applies only if [`propertyGridNavigationMode`](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#propertyGridNavigationMode) is `"buttons"`.
+     * @see closeCreatorThemeSettings
+     * @see showCreatorThemeSettings
+     */
     SurveyCreatorModel.prototype.openCreatorThemeSettings = function () {
         var designerPlugin = this.getPlugin("designer");
         if (designerPlugin) {
             designerPlugin.openCreatorThemeSettings();
         }
     };
+    /**
+     * Closes [Survey Creator theme](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#creatorTheme) settings in Property Grid. Applies only if [`propertyGridNavigationMode`](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#propertyGridNavigationMode) is `"buttons"`.
+     * @see openCreatorThemeSettings
+     * @see showCreatorThemeSettings
+     */
     SurveyCreatorModel.prototype.closeCreatorThemeSettings = function () {
         var designerPlugin = this.getPlugin("designer");
         if (designerPlugin) {
             designerPlugin.closeCreatorThemeSettings();
         }
     };
+    /**
+     * Activates a specified category in Property Grid. Applies only if [`propertyGridNavigationMode`](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#propertyGridNavigationMode) is `"buttons"`.
+     * @param name A [category name](https://surveyjs.io/form-library/documentation/customize-question-types/add-custom-properties-to-a-form#category).
+     */
     SurveyCreatorModel.prototype.activatePropertyGridCategory = function (name) {
         if (!!this.designerPropertyGrid) {
             this.designerPropertyGrid.activateCategory(name);
@@ -25953,7 +26010,7 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
         configurable: true
     });
     /**
-     * Collapses a specified category in Property Grid.
+     * Collapses a specified category in Property Grid. Applies only if [`propertyGridNavigationMode`](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#propertyGridNavigationMode) is `"accordion"`.
      * @param name A [category name](https://surveyjs.io/form-library/documentation/customize-question-types/add-custom-properties-to-a-form#category).
      * @see expandPropertyGridCategory
      */
@@ -25963,9 +26020,10 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
         }
     };
     /**
-     * Expands a specified category in Property Grid.
+     * Expands a specified category in Property Grid. Applies only if [`propertyGridNavigationMode`](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#propertyGridNavigationMode) is `"accordion"`.
      * @param name A [category name](https://surveyjs.io/form-library/documentation/customize-question-types/add-custom-properties-to-a-form#category).
      * @see collapsePropertyGridCategory
+     * @see activatePropertyGridCategory
      */
     SurveyCreatorModel.prototype.expandPropertyGridCategory = function (name) {
         if (!!this.designerPropertyGrid) {
@@ -25973,7 +26031,7 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
         }
     };
     /**
-     * Collapses all categories in Property Grid.
+     * Collapses all categories in Property Grid. Applies only if [`propertyGridNavigationMode`](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#propertyGridNavigationMode) is `"accordion"`.
      * @see expandAllPropertyGridCategories
      */
     SurveyCreatorModel.prototype.collapseAllPropertyGridCategories = function () {
@@ -25982,7 +26040,7 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
         }
     };
     /**
-     * Expands all categories in Property Grid.
+     * Expands all categories in Property Grid. Applies only if [`propertyGridNavigationMode`](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#propertyGridNavigationMode) is `"accordion"`.
      * @see collapseAllPropertyGridCategories
      */
     SurveyCreatorModel.prototype.expandAllPropertyGridCategories = function () {
@@ -26911,6 +26969,12 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
             .append("svc-creator--disable-animations", !this.animationEnabled)
             .toString();
     };
+    /**
+     * Applies a specified UI theme to Survey Creator.
+     * @param theme An `ICreatorTheme` object with theme settings.
+     * @see creatorTheme
+     * @see showCreatorThemeSettings
+     */
     SurveyCreatorModel.prototype.applyCreatorTheme = function (theme) {
         this.syncTheme(theme);
         var designerPlugin = this.getPlugin("designer");
@@ -26926,7 +26990,7 @@ var SurveyCreatorModel = /** @class */ (function (_super) {
         (0,_utils_utils__WEBPACK_IMPORTED_MODULE_8__.assign)(newCssVariable, theme === null || theme === void 0 ? void 0 : theme.cssVariables);
         var designerPlugin = this.getPlugin("designer");
         if (designerPlugin) {
-            (0,_utils_utils__WEBPACK_IMPORTED_MODULE_8__.assign)(newCssVariable, designerPlugin.model.scaleCssVariables || {});
+            designerPlugin.model.updateSurfaceCssVariables();
         }
         this.themeVariables = newCssVariable;
         var iconsSetName = this.creatorTheme && this.creatorTheme["iconSet"] ? this.creatorTheme["iconSet"] : "v2";
@@ -28254,7 +28318,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   CreatorThemes: () => (/* binding */ CreatorThemes),
 /* harmony export */   PredefinedCreatorThemes: () => (/* binding */ PredefinedCreatorThemes),
-/* harmony export */   defaultCreatorThemesOrder: () => (/* binding */ defaultCreatorThemesOrder)
+/* harmony export */   defaultCreatorThemesOrder: () => (/* binding */ defaultCreatorThemesOrder),
+/* harmony export */   registerCreatorTheme: () => (/* binding */ registerCreatorTheme)
 /* harmony export */ });
 /* harmony import */ var _styles_manager__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./styles-manager */ "./src/creator-theme/styles-manager.ts");
 /* harmony import */ var _themes_default_light_color_css_variables__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../themes/default-light-color-css-variables */ "./src/themes/default-light-color-css-variables.ts");
@@ -28262,6 +28327,10 @@ __webpack_require__.r(__webpack_exports__);
 
 var PredefinedCreatorThemes = ["default-light"];
 var defaultCreatorThemesOrder = ["default-light", "default-contrast", "default-dark", "sc2020"];
+function registerCreatorTheme(theme) {
+    PredefinedCreatorThemes.push(theme.themeName);
+    CreatorThemes[theme.themeName] = theme;
+}
 var defaultVariables = {
     "--sjs-special-background": "#EDF9F7FF",
     "--sjs-primary-background-500": "#19B394FF",
@@ -29140,6 +29209,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ });
 var designTabSurveyThemeJSON = {
     "cssVariables": {
+        "--sjs-base-unit": "var(--ctr-surface-base-unit)",
+        "--sjs-font-size": "calc(2 * var(--ctr-surface-base-unit))",
         "--sjs-primary-backcolor": "var(--sjs-primary-background-500, #19B394FF)",
         "--sjs-primary-backcolor-light": "var(--sjs-primary-background-10, #19B3941A)",
         "--sjs-primary-backcolor-dark": "var(--sjs-primary-background-400, #14A48BFF)",
@@ -43109,16 +43180,6 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
-var tabsIcons = {
-    designer: "icon-config",
-    theme: "icon-theme",
-    json: "icon-codeeditor-24x24",
-    translation: "icon-language",
-    preview: "icon-preview",
-    logic: "icon-logic-24x24",
-    customembeded: "icon-embedsurvey-24x24",
-    default: "icon-undefined-24x24"
-};
 var TabbedMenuItem = /** @class */ (function (_super) {
     (0,tslib__WEBPACK_IMPORTED_MODULE_0__.__extends)(TabbedMenuItem, _super);
     function TabbedMenuItem(item) {
@@ -43168,7 +43229,7 @@ var TabbedMenuContainer = /** @class */ (function (_super) {
         _this.minVisibleItemsCount = 1;
         return _this;
     }
-    TabbedMenuContainer.prototype.addTab = function (name, plugin, title, componentName, index) {
+    TabbedMenuContainer.prototype.addTab = function (name, plugin, title, iconName, componentName, index) {
         var _this = this;
         var tabName = name === "test" ? "preview" : name;
         var locStrName = !title ? "tabs." + tabName : (title.indexOf("ed.") == 0 ? title : "");
@@ -43178,7 +43239,7 @@ var TabbedMenuContainer = /** @class */ (function (_super) {
             title: title,
             componentContent: componentName ? componentName : "svc-tab-" + name,
             data: plugin,
-            iconName: tabsIcons[tabName] || tabsIcons["default"],
+            iconName: iconName || "icon-undefined-24x24",
             action: function () { _this.creator.switchTab(name); },
             active: this.creator.viewType === name,
             disableHide: this.creator.viewType === name
@@ -45879,6 +45940,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   copyCssClasses: () => (/* binding */ copyCssClasses),
 /* harmony export */   copyObject: () => (/* binding */ copyObject),
 /* harmony export */   getAcceptedTypesByContentMode: () => (/* binding */ getAcceptedTypesByContentMode),
+/* harmony export */   getOS: () => (/* binding */ getOS),
 /* harmony export */   imageMimeTypes: () => (/* binding */ imageMimeTypes),
 /* harmony export */   notShortCircuitAnd: () => (/* binding */ notShortCircuitAnd),
 /* harmony export */   roundTo2Decimals: () => (/* binding */ roundTo2Decimals),
@@ -45975,6 +46037,27 @@ function sortDefaultThemes(defaultThemesOrder, themes, resultArray) {
         }
     });
 }
+function getOS() {
+    var _a, _b;
+    var userAgent = window.navigator.userAgent, platform = ((_b = (_a = window.navigator) === null || _a === void 0 ? void 0 : _a.userAgentData) === null || _b === void 0 ? void 0 : _b.platform) || window.navigator.platform, macosPlatforms = ["macOS", "Macintosh", "MacIntel", "MacPPC", "Mac68K"], windowsPlatforms = ["Win32", "Win64", "Windows", "WinCE"], iosPlatforms = ["iPhone", "iPad", "iPod"];
+    var os = null;
+    if (macosPlatforms.indexOf(platform) !== -1) {
+        os = "Mac OS";
+    }
+    else if (iosPlatforms.indexOf(platform) !== -1) {
+        os = "iOS";
+    }
+    else if (windowsPlatforms.indexOf(platform) !== -1) {
+        os = "Windows";
+    }
+    else if (/Android/.test(userAgent)) {
+        os = "Android";
+    }
+    else if (/Linux/.test(platform)) {
+        os = "Linux";
+    }
+    return os;
+}
 
 
 /***/ }),
@@ -46783,6 +46866,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   getNextItemValue: () => (/* reexport safe */ _utils_creator_utils__WEBPACK_IMPORTED_MODULE_81__.getNextItemValue),
 /* harmony export */   getNextValue: () => (/* reexport safe */ _utils_creator_utils__WEBPACK_IMPORTED_MODULE_81__.getNextValue),
 /* harmony export */   getNodesFromKoComponentInfo: () => (/* reexport safe */ _utils_html_element_utils__WEBPACK_IMPORTED_MODULE_79__.getNodesFromKoComponentInfo),
+/* harmony export */   getOS: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_78__.getOS),
 /* harmony export */   getPredefinedBackgoundColorsChoices: () => (/* reexport safe */ _components_tabs_themes__WEBPACK_IMPORTED_MODULE_16__.getPredefinedBackgoundColorsChoices),
 /* 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),
@@ -46810,6 +46894,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   propertyExists: () => (/* reexport safe */ _utils_creator_utils__WEBPACK_IMPORTED_MODULE_81__.propertyExists),
 /* harmony export */   propertyGridCss: () => (/* reexport safe */ _property_grid_theme_property_grid__WEBPACK_IMPORTED_MODULE_67__.propertyGridCss),
 /* harmony export */   registerAdorner: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.registerAdorner),
+/* harmony export */   registerCreatorTheme: () => (/* reexport safe */ _creator_theme_creator_themes__WEBPACK_IMPORTED_MODULE_90__.registerCreatorTheme),
 /* harmony export */   registerDefaultThemes: () => (/* reexport safe */ _creator_theme_creator_theme_model__WEBPACK_IMPORTED_MODULE_92__.registerDefaultThemes),
 /* harmony export */   removeAdorners: () => (/* reexport safe */ _creator_base__WEBPACK_IMPORTED_MODULE_4__.removeAdorners),
 /* harmony export */   roundTo2Decimals: () => (/* reexport safe */ _utils_utils__WEBPACK_IMPORTED_MODULE_78__.roundTo2Decimals),
@@ -46936,7 +47021,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_99__ = __webpack_require__(/*! survey-core */ "survey-core");
 /* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_99___default = /*#__PURE__*/__webpack_require__.n(survey_core__WEBPACK_IMPORTED_MODULE_99__);
 var Version;
-Version = "".concat("2.0.0-rc.3");
+Version = "".concat("2.0.0-rc.4");
 //should be loaded before other styles for easier override 
 __webpack_require__(/*! ../utils/context-button.scss */ "./src/utils/context-button.scss");
 
@@ -47059,7 +47144,7 @@ __webpack_require__(/*! ../property-grid-theme/property-grid.scss */ "./src/prop
 __webpack_require__(/*! ../utils/layout.scss */ "./src/utils/layout.scss");
 __webpack_require__(/*! ../custom-questions/boolean-switch.scss */ "./src/custom-questions/boolean-switch.scss");
 
-(0,survey_core__WEBPACK_IMPORTED_MODULE_99__.checkLibraryVersion)("".concat("2.0.0-rc.3"), "survey-creator-core");
+(0,survey_core__WEBPACK_IMPORTED_MODULE_99__.checkLibraryVersion)("".concat("2.0.0-rc.4"), "survey-creator-core");
 
 })();