survey-react 1.9.23 → 1.9.24

package/survey.react.d.ts

@@ -1,5 +1,5 @@
 /*
-* Type definition for Survey JavaScript library for React v1.9.23
+* Type definition for Survey JavaScript library for React v1.9.24
 * Copyright (c) 2015-2022 Devsoft Baltic OÜ  - https://surveyjs.io/
 * License: MIT (http://www.opensource.org/licenses/mit-license.php)
 */
@@ -93,96 +93,96 @@ export interface IExpresionExecutor {
   onComplete: any;
 }
 /*
-* Defines an individual action. Action items can be displayed in certain survey elements - in Toolbar (or action bar), in titles (of pages, panels, questions), in matrix rows (as 'expand details' or 'remove row' buttons), and etc.
+* An action item.
+* Action items are used in the Toolbar, matrix rows, titles of pages, panels, questions, and other survey elements.
 */
 export interface IAction {
   /*
-  * Unique string id
+  * A unique action item identifier.
   */
   id: string;
   /*
-  * Set this property to false to make the toolbar item invisible.
+  * Specifies the action item's visibility.
   */
   visible?: boolean;
   /*
-  * Toolbar item title
+  * The action item's title.
   */
   title?: string;
   /*
-  * Toolbar item tooltip
+  * The action item's tooltip.
   */
   tooltip?: string;
   /*
-  * Set this property to false to disable the toolbar item.
+  * Specifies whether users can interact with the action item.
   */
   enabled?: boolean;
   /*
-  * Set this property to false to hide the toolbar item title.
+  * Specifies the visibility of the action item's title.
   */
   showTitle?: boolean;
   /*
-  * A callback that calls on toolbar item click.
+  * A function that is executed when users click the action item.
   */
   action?: any;
   /*
-  * Toolbar item css class
+  * One or several CSS classes that you want to apply to the outer `<div>` element.
+  * In the markup, an action item is rendered as an `<input>` wrapped in a `<div>`. The `css` property applies classes to the `<div>`.
+  * To apply several classes, separate them with a space character: "myclass1 myclass2".
   */
   css?: string;
   /*
-  * Toolbar inner element css class
+  * One or several CSS classes that you want to apply to the inner `<input>` element.
+  * In the markup, an action item is rendered as an `<input>` wrapped in a `<div>`. The `innerCss` property applies classes to the `<input>`.
+  * To apply several classes, separate them with a space character: "myclass1 myclass2".
   */
   innerCss?: string;
   /*
-  * Toolbar item data object. Used as data for custom template or component rendering
+  * The action item's data object. Use it to pass required data to a custom template or component.
   */
   data?: any;
   popupModel?: any;
   needSeparator?: boolean;
   /*
-  * Set this property to true to activate the toolbar item (page)
+  * Specifies whether the action item is active.
+  * Use it as a flag to specify different action item appearances in different states.
   */
   active?: boolean;
   pressed?: boolean;
   /*
-  * Toolbar item template name
+  * Specifies the name of a template used to render the action item.
   */
   template?: string;
   /*
-  * Toolbar item component name
+  * Specifies the name of a component used to render the action item.
   */
   component?: string;
   /*
-  * Toolbar item icon name
+  * The action item's icon name.
   */
   iconName?: string;
   /*
-  * Toolbar item icon size
+  * The action item's icon size in pixels.
   */
   iconSize?: number;
   /*
-  * Toolbar item child items. Can be used as contianer for options
-  */
-  items?: any;
-  /*
-  * Gets or sets an action's location in a matrix question's row.
+  * The action item's location in a matrix question's row.
   * 
-  * The following options are available:
+  * The following values are available:
   * 
-  * - `start` - An action is located at the beginning of a row.
-  * - `end` - An action is located at the end of a row.
+  * - `"start"` - The action item is located at the beginning of the row.
+  * - `"end"` - The action is located at the end of the row.
   */
   location?: string;
   /*
-  * Set it to true to make the tabIndex -1 to disable keyboard navigation to this item
+  * Set this property to `true` if you want to disable keyboard navigation for the action item (sets the `tabIndex` attribute to -1).
   */
   disableTabStop?: boolean;
   /*
-  * Set it to false to force action "large" mode even if has icon and does not fit to action bar space
+  * Set this property to `true` if you want the item's `title` to be always visible.
+  * If you set it to `false`, the `title` hides when the screen space is limited, and the item displays only the icon.
   */
   disableShrink?: boolean;
-  /*
-  * Action button display mode
-  */
   mode?: any;
   visibleIndex?: number;
   needSpace?: boolean;
@@ -1499,6 +1499,7 @@ export declare class ActionContainer<T extends Action = Action> extends Base {
   get visibleActions(): any;
   getRootCss(): string;
   get cssClasses(): any;
+  addAction(val: IAction, sortByVisibleIndex?: boolean): Action;
   setItems(items: any, sortByVisibleIndex?: boolean): void;
   initResponsivityManager(container: any): void;
   resetResponsivityManager(): void;
@@ -2726,18 +2727,6 @@ export declare class SurveyElementCore extends Base implements ILocalizableOwner
   getRendererContext(locStr: LocalizableString): any;
   getProcessedText(text: string): string;
 }
-export declare class SurveyNavigation extends SurveyNavigationBase {
-  constructor(props: any);
-  handlePrevClick(event: any): void;
-  handleNextClick(event: any): void;
-  handleNextMouseDown(event: any): any;
-  handleMouseDown(event: any): any;
-  handleCompleteClick(event: any): void;
-  handlePreviewClick(event: any): void;
-  handleStartClick(event: any): void;
-  render(): any;
-  protected renderButton(click: any, mouseDown: any, text: string, btnClassName: string): any;
-}
 export declare class SurveyPanelBase extends SurveyElementBase<any, any> {
   constructor(props: any);
   protected rootRef: any;
@@ -3533,6 +3522,7 @@ export declare class SurveyModel extends SurveyElementCore implements ISurvey, I
   localeValue: string;
   textPreProcessor: TextPreProcessor;
   timerModelValue: SurveyTimerModel;
+  navigationBarValue: any;
   /*
   * The event is fired before the survey is completed and the `onComplete` event is fired. You can prevent the survey from completing by setting `options.allowComplete` to `false`
   * <br/> `sender` - the survey object that fires the event.
@@ -4194,7 +4184,8 @@ export declare class SurveyModel extends SurveyElementCore implements ISurvey, I
   get cssNavigationStart(): string;
   get cssNavigationNext(): string;
   get bodyCss(): string;
-  get completedCss(): string;
+  completedCss: string;
+  containerCss: string;
   get completedStateCss(): string;
   getCompletedStateCss(): string;
   lazyRenderingValue: boolean;
@@ -4505,6 +4496,12 @@ export declare class SurveyModel extends SurveyElementCore implements ISurvey, I
   get loadingHtml(): string;
   set loadingHtml(val: string);
   get locLoadingHtml(): LocalizableString;
+  get navigationBar(): any;
+  /*
+  * Adds a custom navigation item similar to the Previous Page, Next Page, and Complete buttons.
+  * Accepts an object described in the [IAction](https://surveyjs.io/Documentation/Library?id=IAction) help section.
+  */
+  addNavigationItem(val: IAction): Action;
   /*
   * Gets or sets the 'Start' button caption.
   * The 'Start' button is shown on the started page. Set the `firstPageIsStarted` property to `true`, to display the started page.
@@ -5151,6 +5148,10 @@ export declare class SurveyModel extends SurveyElementCore implements ISurvey, I
   setJsonObject(jsonObj: any): void;
   isEndLoadingFromJson: string;
   endLoadingFromJson(): void;
+  updateNavigationItemTitlesCallback: any;
+  updateNavigationItemCssCallback: any;
+  protected createNavigationBar(): ActionContainer;
+  protected createNavigationActions(): Array<IAction>;
   protected onBeforeCreating(): void;
   protected onCreating(): void;
   getBuiltInVariableValue(name: string): number;
@@ -5338,6 +5339,12 @@ export declare class SurveyModel extends SurveyElementCore implements ISurvey, I
   dispose(): void;
   disposeCallback: any;
 }
+export declare class SurveyNavigationButton extends ReactSurveyElement {
+  constructor(props: any);
+  protected get item(): Action;
+  protected canRender(): boolean;
+  protected renderElement(): any;
+}
 export declare class SurveyPage extends SurveyPanelBase {
   constructor(props: any);
   protected getPanelBase(): PanelModelBase;
@@ -8997,6 +9004,7 @@ export declare class QuestionMatrixDynamicModel extends QuestionMatrixDropdownMo
   */
   get allowRowsDragAndDrop(): boolean;
   set allowRowsDragAndDrop(val: boolean);
+  get iconDragElement(): string;
   protected createRenderedTable(): QuestionMatrixDropdownRenderedTable;
   /*
   * The minimum row count. A user could not delete a row if the rowCount equals to minRowCount
@@ -9721,6 +9729,9 @@ export declare var defaultStandardCss: {
       buttonCollapsed: string,
     },
   },
+  variables: {
+    themeMark: string,
+  },
 };
 export declare var surveyTimerFunctions: {
   setTimeout: any,
@@ -10669,6 +10680,9 @@ export declare var defaultV2Css: {
     itemText: string,
     clearButton: string,
     other: string,
+    itemNoImage: string,
+    itemNoImageSvgIcon: string,
+    itemNoImageSvgIconId: string,
   },
   matrix: {
     mainRoot: string,
@@ -10729,6 +10743,8 @@ export declare var defaultV2Css: {
     buttonRemove: string,
     iconAdd: string,
     iconRemove: string,
+    dragElementDecorator: string,
+    iconDragElement: string,
     footer: string,
     emptyRowsSection: string,
     iconDrag: string,
@@ -10853,6 +10869,7 @@ export declare var defaultV2Css: {
   },
   variables: {
     mobileWidth: string,
+    themeMark: string,
   },
 };
 export declare var modernCss: {
@@ -11223,6 +11240,9 @@ export declare var modernCss: {
       buttonCollapsed: string,
     },
   },
+  variables: {
+    themeMark: string,
+  },
 };
 export declare var SvgRegistry: SvgIconRegistry;
 export declare var SvgBundleViewModel: any;