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

package/typings/creator-base.d.ts

@@ -1,5 +1,5 @@
 import { Base, SurveyModel, Question, PanelModel, PageModel, IElement, JsonObjectProperty, ActionContainer, IAction, Action, IPanel, SurveyElement, ItemValue, QuestionSelectBase, LocalizableString, ILocalizableString, ILocalizableOwner, PopupBaseViewModel, EventBase, MatrixDropdownColumn, ISurveyElement, ITheme } from "survey-core";
-import { ICreatorPlugin, ISurveyCreatorOptions, ICollectionItemAllowOperations } from "./creator-settings";
+import { ICreatorPlugin, ISurveyCreatorOptions, ICollectionItemAllowOperations, ITabOptions } from "./creator-settings";
 import { DragDropChoices } from "survey-core";
 import { QuestionToolbox, QuestionToolboxItem } from "./toolbox";
 import { PropertyGridModel } from "./property-grid";
@@ -102,6 +102,11 @@ export declare class SurveyCreatorModel extends Base implements ISurveyCreatorOp
      * @see saveThemeFunc
      */
     showThemeTab: boolean;
+    /**
+     * Specifies whether users can modify the [Survey Creator theme](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#creatorTheme). Applies only if [`propertyGridNavigationMode`](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#propertyGridNavigationMode) is `"buttons"`.
+     *
+     * Default value: `true`
+     */
     showCreatorThemeSettings: boolean;
     /**
      * Specifies whether the "Zoom In", "Zoom Out", and "Zoom to 100%" buttons are available.
@@ -273,17 +278,37 @@ export declare class SurveyCreatorModel extends Base implements ISurveyCreatorOp
     protected plugins: {
         [name: string]: ICreatorPlugin;
     };
+    /**
+     * @deprecated Use the [`addTab(tabOptions)`](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#addTab) method instead.
+     */
+    addPluginTab(name: string, plugin: ICreatorPlugin, title?: string, componentName?: string, index?: number): void;
     /**
      * 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.
      */
-    addPluginTab(name: string, plugin: ICreatorPlugin, title?: string, componentName?: string, index?: number): void;
+    addTab(tabOptions: ITabOptions): void;
     addPlugin(name: string, plugin: ICreatorPlugin): void;
     private removePlugin;
     private getTabIndex;
@@ -717,6 +742,9 @@ export declare class SurveyCreatorModel extends Base implements ISurveyCreatorOp
      * ```
      */
     onCreateCustomMessagePanel: EventBase<SurveyCreatorModel, CreateCustomMessagePanelEvent>;
+    /**
+     * 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).
+     */
     onCreatorThemePropertyChanged: EventBase<SurveyCreatorModel, CreatorThemePropertyChangedEvent>;
     getSurveyJSONTextCallback: () => {
         text: string;
@@ -1387,30 +1415,45 @@ export declare class SurveyCreatorModel extends Base implements ISurveyCreatorOp
     focusElement(element: any, focus: string | boolean, selEl?: any, propertyName?: string, startEdit?: boolean): void;
     private getSelectedSurveyElement;
     private onSelectingElement;
+    /**
+     * 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
+     */
     openCreatorThemeSettings(): void;
+    /**
+     * 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
+     */
     closeCreatorThemeSettings(): void;
+    /**
+     * 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).
+     */
     activatePropertyGridCategory(name: string): void;
     protected get designerPropertyGrid(): PropertyGridModel;
     get propertyGrid(): SurveyModel;
     /**
-     * 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
      */
     collapsePropertyGridCategory(name: string): void;
     /**
-     * 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
      */
     expandPropertyGridCategory(name: string): void;
     /**
-     * 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
      */
     collapseAllPropertyGridCategories(): void;
     /**
-     * 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
      */
     expandAllPropertyGridCategories(): void;
@@ -1598,6 +1641,7 @@ export declare class SurveyCreatorModel extends Base implements ISurveyCreatorOp
     showAddQuestionButton: any;
     isMobileView: boolean;
     isTouch: any;
+    currentOS: string;
     /**
      * Specifies the Toolbox location.
      *
@@ -1672,8 +1716,19 @@ export declare class SurveyCreatorModel extends Base implements ISurveyCreatorOp
     themeVariables: {
         [index: string]: string;
     };
+    /**
+     * A theme for the Survey Creator UI.
+     * @see applyCreatorTheme
+     * @see showCreatorThemeSettings
+     */
     creatorTheme: ICreatorTheme;
     preferredColorPalette: string;
+    /**
+     * Applies a specified UI theme to Survey Creator.
+     * @param theme An `ICreatorTheme` object with theme settings.
+     * @see creatorTheme
+     * @see showCreatorThemeSettings
+     */
     applyCreatorTheme(theme: ICreatorTheme): void;
     syncTheme(theme: ICreatorTheme, isLight?: boolean): void;
     private _allowDragPages;

package/typings/creator-events-api.d.ts

@@ -1029,6 +1029,12 @@ export interface DragStartEndEvent {
     toElement: IElement;
 }
 export interface CreatorThemePropertyChangedEvent {
+    /**
+     * A property name.
+     */
     name: string;
+    /**
+     * A new property value.
+     */
     value: any;
 }

package/typings/creator-options.d.ts

@@ -52,6 +52,11 @@ export interface ICreatorOptions {
      * [Theme Editor](https://surveyjs.io/survey-creator/documentation/theme-editor (linkStyle))
      */
     showThemeTab?: boolean;
+    /**
+     * Specifies whether users can modify the [Survey Creator theme](https://surveyjs.io/survey-creator/documentation/api-reference/survey-creator#creatorTheme). Applies only if [`propertyGridNavigationMode`](https://surveyjs.io/survey-creator/documentation/api-reference/icreatoroptions#propertyGridNavigationMode) is `"buttons"`.
+     *
+     * Default value: `true`
+     */
     showCreatorThemeSettings?: boolean;
     /**
      * Specifies whether the "Zoom In", "Zoom Out", and "Zoom to 100%" buttons are available.

package/typings/creator-settings.d.ts

@@ -155,7 +155,14 @@ export interface ICreatorPlugin {
     dispose?: () => void;
     onDesignerSurveyPropertyChanged?: (obj: Base, propName: string) => void;
     model: Base;
-    showOneCategoryInPropertyGrid?: boolean;
+}
+export interface ITabOptions {
+    name: string;
+    plugin: ICreatorPlugin;
+    title?: string;
+    iconName?: string;
+    componentName?: string;
+    index?: number;
 }
 export interface ISurveyCreatorOptions {
     isMobileView: boolean;

package/typings/creator-theme/creator-themes.d.ts

@@ -7,6 +7,7 @@ export interface ICreatorTheme {
 }
 export declare const PredefinedCreatorThemes: string[];
 export declare const defaultCreatorThemesOrder: string[];
+export declare function registerCreatorTheme(theme: ICreatorTheme): void;
 export declare const CreatorThemes: {
     [index: string]: ICreatorTheme;
 };

package/typings/designTabSurveyThemeJSON.d.ts

@@ -1,5 +1,7 @@
 declare const designTabSurveyThemeJSON: {
     cssVariables: {
+        "--sjs-base-unit": string;
+        "--sjs-font-size": string;
         "--sjs-primary-backcolor": string;
         "--sjs-primary-backcolor-light": string;
         "--sjs-primary-backcolor-dark": string;

package/typings/tabbed-menu.d.ts

@@ -18,6 +18,6 @@ export declare class TabbedMenuItem extends Action implements ITabbedMenuItem {
 export declare class TabbedMenuContainer extends AdaptiveActionContainer<TabbedMenuItem> {
     private creator;
     constructor(creator: CreatorBase);
-    addTab(name: string, plugin: ICreatorPlugin, title?: string, componentName?: string, index?: number): void;
+    addTab(name: string, plugin: ICreatorPlugin, title?: string, iconName?: string, componentName?: string, index?: number): void;
     updateResponsivenessMode(): void;
 }

package/typings/themes/index.d.ts

@@ -43,7 +43,6 @@ export declare const SC2020: {
         "--ctr-shadow-x-large-blur": string;
         "--ctr-shadow-x-large-spread": string;
         "--ctr-property-grid-placeholder-text-max-width": string;
-        "--ctr-surface-placeholder-padding-top": string;
         "--ctr-property-grid-placeholder-padding-bottom": string;
         "--ctr-popup-menu-footer-padding-right": string;
         "--ctr-editor-content-text-opacity-disabled": number;
@@ -269,6 +268,7 @@ export declare const SC2020: {
         "--ctr-surface-placeholder-text-margin-bottom": string;
         "--ctr-surface-placeholder-text-gap": string;
         "--ctr-surface-placeholder-max-width": string;
+        "--ctr-surface-placeholder-padding-top": string;
         "--ctr-surface-placeholder-padding-right": string;
         "--ctr-toolbox-group-header-margin-right": string;
         "--ctr-property-grid-tabs-padding-right": string;

package/typings/themes/sc2020.d.ts

@@ -43,7 +43,6 @@ declare const Theme: {
         "--ctr-shadow-x-large-blur": string;
         "--ctr-shadow-x-large-spread": string;
         "--ctr-property-grid-placeholder-text-max-width": string;
-        "--ctr-surface-placeholder-padding-top": string;
         "--ctr-property-grid-placeholder-padding-bottom": string;
         "--ctr-popup-menu-footer-padding-right": string;
         "--ctr-editor-content-text-opacity-disabled": number;
@@ -269,6 +268,7 @@ declare const Theme: {
         "--ctr-surface-placeholder-text-margin-bottom": string;
         "--ctr-surface-placeholder-text-gap": string;
         "--ctr-surface-placeholder-max-width": string;
+        "--ctr-surface-placeholder-padding-top": string;
         "--ctr-surface-placeholder-padding-right": string;
         "--ctr-toolbox-group-header-margin-right": string;
         "--ctr-property-grid-tabs-padding-right": string;
@@ -1350,7 +1350,6 @@ export declare const SC2020: {
         "--ctr-shadow-x-large-blur": string;
         "--ctr-shadow-x-large-spread": string;
         "--ctr-property-grid-placeholder-text-max-width": string;
-        "--ctr-surface-placeholder-padding-top": string;
         "--ctr-property-grid-placeholder-padding-bottom": string;
         "--ctr-popup-menu-footer-padding-right": string;
         "--ctr-editor-content-text-opacity-disabled": number;
@@ -1576,6 +1575,7 @@ export declare const SC2020: {
         "--ctr-surface-placeholder-text-margin-bottom": string;
         "--ctr-surface-placeholder-text-gap": string;
         "--ctr-surface-placeholder-max-width": string;
+        "--ctr-surface-placeholder-padding-top": string;
         "--ctr-surface-placeholder-padding-right": string;
         "--ctr-toolbox-group-header-margin-right": string;
         "--ctr-property-grid-tabs-padding-right": string;

package/typings/utils/utils.d.ts

@@ -11,3 +11,4 @@ export declare function trimEmptyFields(object: {
 }): void;
 export declare function assign(...inputs: Array<any>): void;
 export declare function sortDefaultThemes(defaultThemesOrder: Array<string>, themes: Array<string>, resultArray: Array<string>): void;
+export declare function getOS(): "Mac OS" | "iOS" | "Windows" | "Android" | "Linux";