survey-react 1.8.75 → 1.8.76

package/survey.react.d.ts

@@ -1,4 +1,4 @@
-/*Type definitions for Survey JavaScript library v1.8.75
+/*Type definitions for Survey JavaScript library v1.8.76
 Copyright (c) 2015-2021 Devsoft Baltic OÜ  - http://surveyjs.io/
 Definitions by: Devsoft Baltic OÜ <https://github.com/surveyjs/>
 */
@@ -233,6 +233,8 @@ export declare var defaultStandardCss: {
         progressText: string;
         panelWrapper: string;
         panelWrapperInRow: string;
+        separatorV2: string;
+        footer: string;
     };
     multipletext: {
         root: string;
@@ -545,6 +547,8 @@ export declare var defaultBootstrapCss: {
         progressText: string;
         panelWrapper: string;
         panelWrapperInRow: string;
+        separatorV2: string;
+        footer: string;
     };
     multipletext: {
         root: string;
@@ -861,6 +865,8 @@ export declare var defaultBootstrapMaterialCss: {
         progressText: string;
         panelWrapper: string;
         panelWrapperInRow: string;
+        separatorV2: string;
+        footer: string;
     };
     multipletext: {
         root: string;
@@ -957,6 +963,322 @@ export declare var defaultBootstrapMaterialCss: {
     };
 };
 
+export declare var defaultV2Css: {
+    root: string;
+    container: string;
+    header: string;
+    body: string;
+    bodyEmpty: string;
+    footer: string;
+    title: string;
+    description: string;
+    logo: string;
+    logoImage: string;
+    headerText: string;
+    navigationButton: string;
+    completedPage: string;
+    navigation: {
+        complete: string;
+        prev: string;
+        next: string;
+        start: string;
+        preview: string;
+        edit: string;
+    };
+    panel: {
+        title: string;
+        titleExpandable: string;
+        titleOnExpand: string;
+        titleOnError: string;
+        description: string;
+        container: string;
+        content: string;
+        icon: string;
+        iconExpanded: string;
+        footer: string;
+        requiredText: string;
+    };
+    paneldynamic: {
+        mainRoot: string;
+        root: string;
+        navigation: string;
+        title: string;
+        button: string;
+        buttonRemove: string;
+        buttonAdd: string;
+        progressTop: string;
+        progressBottom: string;
+        buttonPrev: string;
+        buttonNext: string;
+        progressContainer: string;
+        progress: string;
+        progressBar: string;
+        progressText: string;
+        separator: string;
+        separatorV2: string;
+        panelWrapper: string;
+        footer: string;
+        footerButtonsContainer: string;
+        panelWrapperInRow: string;
+    };
+    progress: string;
+    progressBar: string;
+    progressText: string;
+    progressTextInBar: string;
+    page: {
+        root: string;
+        title: string;
+        description: string;
+    };
+    pageTitle: string;
+    pageDescription: string;
+    row: string;
+    rowMultiple: string;
+    question: {
+        mainRoot: string;
+        flowRoot: string;
+        asCell: string;
+        answered: string;
+        header: string;
+        headerLeft: string;
+        headerTop: string;
+        headerBottom: string;
+        content: string;
+        contentLeft: string;
+        titleLeftRoot: string;
+        titleOnAnswer: string;
+        titleOnError: string;
+        title: string;
+        requiredText: string;
+        number: string;
+        description: string;
+        descriptionUnderInput: string;
+        comment: string;
+        other: string;
+        required: string;
+        titleRequired: string;
+        indent: number;
+        footer: string;
+        formGroup: string;
+        hasError: string;
+        disabled: string;
+    };
+    image: {
+        root: string;
+        image: string;
+    };
+    error: {
+        root: string;
+        icon: string;
+        item: string;
+        locationTop: string;
+        locationBottom: string;
+    };
+    checkbox: {
+        root: string;
+        item: string;
+        itemSelectAll: string;
+        itemNone: string;
+        itemDisabled: string;
+        itemChecked: string;
+        itemHover: string;
+        itemInline: string;
+        label: string;
+        labelChecked: string;
+        itemControl: string;
+        itemDecorator: string;
+        controlLabel: string;
+        materialDecorator: string;
+        other: string;
+        column: string;
+    };
+    radiogroup: {
+        root: string;
+        item: string;
+        itemInline: string;
+        label: string;
+        labelChecked: string;
+        itemDisabled: string;
+        itemChecked: string;
+        itemHover: string;
+        itemControl: string;
+        itemDecorator: string;
+        controlLabel: string;
+        materialDecorator: string;
+        other: string;
+        clearButton: string;
+        column: string;
+    };
+    boolean: {
+        mainRoot: string;
+        root: string;
+        item: string;
+        control: string;
+        itemChecked: string;
+        itemIndeterminate: string;
+        itemDisabled: string;
+        label: string;
+        switch: string;
+        disabledLabel: string;
+        itemDecorator: string;
+        materialDecorator: string;
+        sliderText: string;
+        slider: string;
+    };
+    text: {
+        root: string;
+        small: string;
+        controlDisabled: string;
+        onError: string;
+    };
+    multipletext: {
+        root: string;
+        item: string;
+        itemTitle: string;
+        row: string;
+        cell: string;
+    };
+    dropdown: {
+        root: string;
+        small: string;
+        control: string;
+        selectWrapper: string;
+        other: string;
+        onError: string;
+        label: string;
+        item: string;
+        itemDisabled: string;
+        itemChecked: string;
+        itemHover: string;
+        itemControl: string;
+        itemDecorator: string;
+        controlDisabled: string;
+        controlLabel: string;
+        materialDecorator: string;
+    };
+    imagepicker: {
+        mainRoot: string;
+        root: string;
+        item: string;
+        itemInline: string;
+        itemChecked: string;
+        itemDisabled: string;
+        itemHover: string;
+        label: string;
+        itemControl: string;
+        image: string;
+        itemText: string;
+        clearButton: string;
+        other: string;
+    };
+    matrix: {
+        mainRoot: string;
+        tableWrapper: string;
+        root: string;
+        rowError: string;
+        cell: string;
+        headerCell: string;
+        label: string;
+        itemValue: string;
+        itemChecked: string;
+        itemDisabled: string;
+        itemHover: string;
+        materialDecorator: string;
+        itemDecorator: string;
+        cellText: string;
+        cellTextSelected: string;
+        cellTextDisabled: string;
+    };
+    matrixdropdown: {
+        mainRoot: string;
+        root: string;
+        cell: string;
+        headerCell: string;
+    };
+    matrixdynamic: {
+        mainRoot: string;
+        root: string;
+        cell: string;
+        headerCell: string;
+        button: string;
+        detailRow: string;
+        detailButton: string;
+        detailButtonExpanded: string;
+        detailIcon: string;
+        detailIconExpanded: string;
+        detailPanelCell: string;
+        actionsCell: string;
+        buttonAdd: string;
+        buttonRemove: string;
+        iconAdd: string;
+        iconRemove: string;
+    };
+    rating: {
+        root: string;
+        item: string;
+        itemHover: string;
+        selected: string;
+        minText: string;
+        itemText: string;
+        maxText: string;
+        itemDisabled: string;
+    };
+    comment: {
+        root: string;
+        small: string;
+        controlDisabled: string;
+    };
+    expression: string;
+    file: {
+        root: string;
+        other: string;
+        placeholderInput: string;
+        preview: string;
+        fileSign: string;
+        fileList: string;
+        fileSignBottom: string;
+        fileDecorator: string;
+        fileDecoratorDrag: string;
+        fileInput: string;
+        noFileChosen: string;
+        chooseFile: string;
+        disabled: string;
+        removeButton: string;
+        removeButtonBottom: string;
+        removeFile: string;
+        removeFileSvg: string;
+        wrapper: string;
+        defaultImage: string;
+        removeFileButton: string;
+        dragAreaPlaceholder: string;
+    };
+    signaturepad: {
+        root: string;
+        small: string;
+        controls: string;
+        placeholder: string;
+        clearButton: string;
+    };
+    saveData: {
+        root: string;
+        saving: string;
+        error: string;
+        success: string;
+        saveAgainButton: string;
+    };
+    window: {
+        root: string;
+        body: string;
+        header: {
+            root: string;
+            title: string;
+            button: string;
+            buttonExpanded: string;
+            buttonCollapsed: string;
+        };
+    };
+};
+
 export declare var modernCss: {
     root: string;
     container: string;
@@ -1011,6 +1333,8 @@ export declare var modernCss: {
         separator: string;
         panelWrapper: string;
         panelWrapperInRow: string;
+        separatorV2: string;
+        footer: string;
     };
     progress: string;
     progressBar: string;
@@ -1975,10 +2299,11 @@ export declare class SurveyQuestionPanelDynamic extends SurveyQuestionElementBas
     handleOnRangeChange(event: any): void;
     protected renderElement(): JSX.Element;
     protected renderNavigator(): JSX.Element;
-    protected rendrerPrevButton(): JSX.Element;
-    protected rendrerNextButton(): JSX.Element;
+    protected rendrerPrevButton(viewBox?: string, icon?: JSX.Element): JSX.Element;
+    protected rendrerNextButton(viewBox?: string, icon?: JSX.Element): JSX.Element;
     protected renderRange(): JSX.Element;
     protected renderAddRowButton(): JSX.Element;
+    protected renderNavigatorV2(): JSX.Element;
 }
 export declare class SurveyQuestionPanelDynamicItem extends SurveyPanel {
     constructor(props: any);
@@ -2361,11 +2686,17 @@ export declare var settings: {
             */
         executeSkipTriggerOnValueChanged: boolean;
         /**
-            * Set this property to change readOnlyCommentRenderMode: "textarea" (default) or "div"
+            * Specifies how the input field of [Comment](https://surveyjs.io/Documentation/Library?id=questioncommentmodel) questions is rendered in the read-only mode.
+            * Available values:
+            * "textarea" (default) - A 'textarea' element is used to render a Comment question's input field.
+            * "div" - A 'div' element is used to render a Comment question's input field.
             */
         readOnlyCommentRenderMode: string;
         /**
-            * Set this property to change readOnlyTextRenderMode: "input" (default) or "div"
+            * Specifies how the input field of [Text](https://surveyjs.io/Documentation/Library?id=questiontextmodel) questions is rendered in the read-only mode.
+            * Available values:
+            * "input" (default) - An 'input' element is used to render a Text question's input field.
+            * "div" - A 'div' element is used to render a Text question's input field.
             */
         readOnlyTextRenderMode: string;
         /**
@@ -3017,7 +3348,7 @@ export interface ISurveyElement {
     containsErrors: boolean;
     parent: IPanel;
     skeletonComponentName: string;
-    setSurveyImpl(value: ISurveyImpl): any;
+    setSurveyImpl(value: ISurveyImpl, isLight?: boolean): any;
     onSurveyLoad(): any;
     onFirstRendering(): any;
     getType(): string;
@@ -3165,13 +3496,18 @@ export declare abstract class SurveyElementCore extends Base implements ILocaliz
         abstract getRendererContext(locStr: LocalizableString): any;
         abstract getProcessedText(text: string): string;
 }
+export declare enum DragTypeOverMeEnum {
+        InsideEmptyPanel = 1,
+        MultilineRight = 2,
+        MultilineLeft = 3
+}
 /**
     * Base class of SurveyJS Elements.
     */
 export declare class SurveyElement extends SurveyElementCore implements ISurveyElement {
         stateChangedCallback: () => void;
         static getProgressInfoByElements(children: Array<SurveyElement>, isRequired: boolean): IProgressInfo;
-        isDragOverMe: boolean;
+        dragTypeOverMe: DragTypeOverMeEnum;
         readOnlyChangedCallback: () => void;
         static ScrollElementToTop(elementId: string): boolean;
         static GetFirstNonTextElement(elements: any, removeSpaces?: boolean): any;
@@ -3225,7 +3561,7 @@ export declare class SurveyElement extends SurveyElementCore implements ISurveyE
         getTitleComponentName(): string;
         get titleTabIndex(): number;
         get titleAriaExpanded(): boolean;
-        setSurveyImpl(value: ISurveyImpl): void;
+        setSurveyImpl(value: ISurveyImpl, isLight?: boolean): void;
         protected get surveyImpl(): ISurveyImpl;
         get data(): ISurveyData;
         /**
@@ -4655,7 +4991,7 @@ export declare class QuestionMatrixDynamicModel extends QuestionMatrixDropdownMo
         onGetValueForNewRowCallBack: (sender: QuestionMatrixDynamicModel) => any;
         constructor(name: string);
         dragDropMatrixRows: DragDropMatrixRows;
-        setSurveyImpl(value: ISurveyImpl): void;
+        setSurveyImpl(value: ISurveyImpl, isLight?: boolean): void;
         startDragMatrixRow(event: PointerEvent, row: MatrixDropdownRowModelBase): void;
         getType(): string;
         get isRowsDynamic(): boolean;
@@ -5058,7 +5394,7 @@ export declare class QuestionMultipleTextModel extends Question implements IMult
         colCountChangedCallback: () => void;
         constructor(name: string);
         getType(): string;
-        setSurveyImpl(value: ISurveyImpl): void;
+        setSurveyImpl(value: ISurveyImpl, isLight?: boolean): void;
         get isAllowTitleLeft(): boolean;
         get hasSingleInput(): boolean;
         onSurveyLoad(): void;
@@ -5166,7 +5502,7 @@ export declare class PanelModelBase extends SurveyElement implements IPanel, ICo
         onGetQuestionTitleLocation: () => string;
         constructor(name?: string);
         getType(): string;
-        setSurveyImpl(value: ISurveyImpl): void;
+        setSurveyImpl(value: ISurveyImpl, isLight?: boolean): void;
         endLoadingFromJson(): void;
         get hasTitle(): boolean;
         protected canShowTitle(): boolean;
@@ -5568,6 +5904,7 @@ export declare class PanelModel extends PanelModelBase implements IElement {
         protected getCssError(cssClasses: any): string;
         protected onVisibleChanged(): void;
         needResponsiveWidth(): boolean;
+        focusIn: () => void;
 }
 
 /**
@@ -5825,7 +6162,7 @@ export declare class Question extends SurveyElement implements IQuestion, ICondi
             */
         moveTo(container: IPanel, insertBefore?: any): boolean;
         getProgressInfo(): IProgressInfo;
-        setSurveyImpl(value: ISurveyImpl): void;
+        setSurveyImpl(value: ISurveyImpl, isLight?: boolean): void;
         getDataFilteredValues(): any;
         getDataFilteredProperties(): any;
         /**
@@ -6000,6 +6337,7 @@ export declare class Question extends SurveyElement implements IQuestion, ICondi
             * @param onError set this parameter to true, to focus the input with the first error, other wise the first input will be focused.
             */
         focus(onError?: boolean): void;
+        focusIn: () => void;
         protected fireCallback(callback: () => void): void;
         getOthersMaxLength(): any;
         protected onCreating(): void;
@@ -6478,7 +6816,7 @@ export declare class QuestionSelectBase extends Question {
         supportNone(): boolean;
         protected isSupportProperty(propName: string): boolean;
         protected onCheckForErrors(errors: Array<SurveyError>, isOnValueChanged: boolean): void;
-        setSurveyImpl(value: ISurveyImpl): void;
+        setSurveyImpl(value: ISurveyImpl, isLight?: boolean): void;
         protected setSurveyCore(value: ISurvey): void;
         protected getStoreOthersAsComment(): boolean;
         onSurveyLoad(): void;
@@ -6627,7 +6965,7 @@ export declare class QuestionRankingModel extends QuestionCheckboxModel {
     protected isItemCurrentDropTarget(item: ItemValue): boolean;
     get ghostPositionCssClass(): string;
     getNumberByIndex(index: number): string;
-    setSurveyImpl: (value: ISurveyImpl) => void;
+    setSurveyImpl(value: ISurveyImpl, isLight?: boolean): void;
     onSurveyValueChanged(newValue: any): void;
     protected onVisibleChoicesChanged: () => void;
     localeChanged: () => void;
@@ -7443,7 +7781,7 @@ export declare class QuestionPanelDynamicModel extends Question implements IQues
         currentIndexChangedCallback: () => void;
         constructor(name: string);
         get hasSingleInput(): boolean;
-        setSurveyImpl(value: ISurveyImpl): void;
+        setSurveyImpl(value: ISurveyImpl, isLight?: boolean): void;
         getType(): string;
         get isCompositeQuestion(): boolean;
         clearOnDeletingContainer(): void;
@@ -8310,6 +8648,20 @@ export declare class SurveyModel extends SurveyElementCore implements ISurvey, I
             * <br/> `options.htmlElement` - an HTML element bound to the panel object
             */
         onAfterRenderPanel: EventBase<SurveyModel>;
+        /**
+            * The event occurs when an element within a question gets focus.
+            * <br/> `sender` - A [survey](https://surveyjs.io/Documentation/Library?id=surveymodel) object that fires the event.
+            * <br/> `options.question` - A [question](https://surveyjs.io/Documentation/Library?id=Question) whose child element gets focus.
+            * @see onFocusInPanel
+            */
+        onFocusInQuestion: EventBase<SurveyModel>;
+        /**
+            * The event occurs when an element within a panel gets focus.
+            * <br/> `sender` - A [survey](https://surveyjs.io/Documentation/Library?id=surveymodel) object that fires the event.
+            * <br/> `options.panel` - A [panel](https://surveyjs.io/Documentation/Library?id=PanelModelBase) whose child element gets focus.
+            * @see onFocusInQuestion
+            */
+        onFocusInPanel: EventBase<SurveyModel>;
         /**
             * The event is fired on adding a new row in Matrix Dynamic question.
             * <br/> `sender` - the survey object that fires the event
@@ -9491,11 +9843,12 @@ export declare class SurveyModel extends SurveyElementCore implements ISurvey, I
             * Gets whether the current page is the first one.
             */
         get isFirstPage(): boolean;
-        get isShowPrevButton(): boolean;
         /**
             * Gets whether the current page is the last one.
             */
         get isLastPage(): boolean;
+        get isShowPrevButton(): boolean;
+        get isShowNextButton(): boolean;
         /**
             * Completes the survey.
             *
@@ -9567,6 +9920,8 @@ export declare class SurveyModel extends SurveyElementCore implements ISurvey, I
         afterRenderQuestion(question: IQuestion, htmlElement: HTMLElement): void;
         afterRenderQuestionInput(question: IQuestion, htmlElement: HTMLElement): void;
         afterRenderPanel(panel: IElement, htmlElement: HTMLElement): void;
+        whenQuestionFocusIn(question: IQuestion): void;
+        whenPanelFocusIn(panel: IPanel): void;
         matrixBeforeRowAdded(options: any): void;
         matrixRowAdded(question: IQuestion, row: any): void;
         getQuestionByValueNameFromArray(valueName: string, name: string, index: number): IQuestion;
@@ -10455,7 +10810,7 @@ export declare abstract class QuestionCustomModelBase extends Question implement
     onFirstRendering(): void;
     protected abstract getElement(): SurveyElement;
     protected initElement(el: SurveyElement): void;
-    setSurveyImpl(value: ISurveyImpl): void;
+    setSurveyImpl(value: ISurveyImpl, isLight?: boolean): void;
     onSurveyLoad(): void;
     afterRenderQuestionElement(el: HTMLElement): void;
     afterRender(el: any): void;
@@ -10711,7 +11066,8 @@ export declare class DragDropSurveyElements extends DragDropCore<any> {
     protected createElementFromJson(json: object): HTMLElement;
     protected getShortcutText(draggedElement: any): string;
     protected getDropTargetByDataAttributeValue(dataAttributeValue: string, dropTargetNode: HTMLElement, event: PointerEvent): any;
-    protected isDropTargetValid(dropTarget: SurveyElement, isBottom: boolean): boolean;
+    protected isDropTargetValid(dropTarget: SurveyElement): boolean;
+    protected calculateIsBottom(clientY: number, dropTargetNode?: HTMLElement): boolean;
     protected isDropTargetDoesntChanged(newIsBottom: boolean): boolean;
     protected findDeepestDropTargetChild(parent: HTMLElement): HTMLElement;
     protected afterDragOver(): void;
@@ -10729,7 +11085,7 @@ export declare class DragDropChoices extends DragDropCore<QuestionSelectBase> {
     protected createDraggedElementShortcut(text: string, draggedElementNode: HTMLElement): HTMLElement;
     protected findDropTargetNodeByDragOverNode(dragOverNode: HTMLElement): HTMLElement;
     protected getDropTargetByDataAttributeValue(dataAttributeValue: string): ItemValue;
-    protected isDropTargetValid(dropTarget: ItemValue, isBottom: boolean, dropTargetNode?: HTMLElement): boolean;
+    protected isDropTargetValid(dropTarget: ItemValue): boolean;
     protected calculateIsBottom(clientY: number): boolean;
     protected afterDragOver(dropTargetNode: HTMLElement): void;
     protected doDrop(): any;
@@ -10841,7 +11197,7 @@ export declare class DragDropRankingChoices extends DragDropChoices {
     protected get draggedElementType(): string;
     protected createDraggedElementShortcut(text: string, draggedElementNode: HTMLElement): HTMLElement;
     protected getDropTargetByDataAttributeValue(dataAttributeValue: string): ItemValue;
-    protected isDropTargetValid(dropTarget: ItemValue, isBottom: boolean, dropTargetNode?: HTMLElement): boolean;
+    protected isDropTargetValid(dropTarget: ItemValue, dropTargetNode?: HTMLElement): boolean;
     protected calculateIsBottom(clientY: number): boolean;
     protected afterDragOver(dropTargetNode: HTMLElement): void;
     protected ghostPositionChanged(): void;
@@ -10944,7 +11300,7 @@ export declare abstract class DragDropCore<T> extends Base {
     protected doDragOver(dropTargetNode?: HTMLElement): void;
     protected afterDragOver(dropTargetNode?: HTMLElement): void;
     getGhostPosition(item: any): string;
-    protected abstract isDropTargetValid(dropTarget: any, isBottom: boolean, dropTargetNode?: HTMLElement): boolean;
+    protected abstract isDropTargetValid(dropTarget: any, dropTargetNode?: HTMLElement): boolean;
     protected handleEscapeButton: (event: KeyboardEvent) => void;
     protected banDropHere: () => void;
     protected doBanDropHere: () => void;
@@ -10952,7 +11308,7 @@ export declare abstract class DragDropCore<T> extends Base {
     protected getDropTargetByNode(dropTargetNode: HTMLElement, event: PointerEvent): any;
     protected abstract getDropTargetByDataAttributeValue(dataAttributeValue: string, dropTargetNode?: HTMLElement, event?: PointerEvent): any;
     protected calculateMiddleOfHTMLElement(HTMLElement: HTMLElement): number;
-    protected calculateIsBottom(clientY: number, dropTargetNode?: HTMLElement): boolean;
+    protected abstract calculateIsBottom(clientY: number, dropTargetNode?: HTMLElement): boolean;
     protected findDropTargetNodeByDragOverNode(dragOverNode: HTMLElement): HTMLElement;
     protected abstract doDrop(): any;
     protected clear: () => void;