UNPKG

3.12 kBTypeScriptView Raw
1import * as React from "react";
2import { AbstractPureComponent2, Position } from "../../common";
3import { DialogProps } from "./dialog";
4import { DialogStepId } from "./dialogStep";
5import { DialogStepButtonProps } from "./dialogStepButton";
6export declare type MultistepDialogNavPosition = typeof Position.TOP | typeof Position.LEFT | typeof Position.RIGHT;
7export declare type MultistepDialogProps = IMultistepDialogProps;
8/** @deprecated use MultistepDialogProps */
9export interface IMultistepDialogProps extends DialogProps {
10 /**
11 * Props for the back button.
12 */
13 backButtonProps?: DialogStepButtonProps;
14 /** Dialog steps. */
15 children?: React.ReactNode;
16 /**
17 * Props for the close button that appears in the footer.
18 */
19 closeButtonProps?: DialogStepButtonProps;
20 /**
21 * Props for the button to display on the final step.
22 */
23 finalButtonProps?: DialogStepButtonProps;
24 /**
25 * Position of the step navigation within the dialog.
26 *
27 * @default "left"
28 */
29 navigationPosition?: MultistepDialogNavPosition;
30 /**
31 * Props for the next button.
32 */
33 nextButtonProps?: DialogStepButtonProps;
34 /**
35 * A callback that is invoked when the user selects a different step by clicking on back, next, or a step itself.
36 */
37 onChange?(newDialogStepId: DialogStepId, prevDialogStepId: DialogStepId | undefined, event: React.MouseEvent<HTMLElement>): void;
38 /**
39 * Whether to reset the dialog state to its initial state on close.
40 * By default, closing the dialog will reset its state.
41 *
42 * @default true
43 */
44 resetOnClose?: boolean;
45 /**
46 * Whether the footer close button is shown. When this value is true, the button will appear
47 * regardless of the value of `isCloseButtonShown`.
48 *
49 * @default false
50 */
51 showCloseButtonInFooter?: boolean;
52 /**
53 * A 0 indexed initial step to start off on, to start in the middle of the dialog, for example.
54 * If the provided index exceeds the number of steps, it defaults to the last step.
55 * If a negative index is provided, it defaults to the first step.
56 */
57 initialStepIndex?: number;
58}
59interface IMultistepDialogState {
60 lastViewedIndex: number;
61 selectedIndex: number;
62}
63/**
64 * Multi-step dialog component.
65 *
66 * @see https://blueprintjs.com/docs/#core/components/dialog.multistep-dialog
67 */
68export declare class MultistepDialog extends AbstractPureComponent2<MultistepDialogProps, IMultistepDialogState> {
69 static displayName: string;
70 static defaultProps: Partial<MultistepDialogProps>;
71 state: IMultistepDialogState;
72 render(): JSX.Element;
73 componentDidUpdate(prevProps: MultistepDialogProps): void;
74 private getDialogStyle;
75 private renderLeftPanel;
76 private renderDialogStep;
77 private handleClickDialogStep;
78 private maybeRenderRightPanel;
79 private renderFooter;
80 private renderButtons;
81 private getDialogStepChangeHandler;
82 /** Filters children to only `<DialogStep>`s */
83 private getDialogStepChildren;
84 private getInitialIndexFromProps;
85}
86export {};