Dialogs (Finsemble Flow)

Dialogs are a common UI component in both web and desktop applications. Two sample dialogs, the yes/no dialog and the single input dialog, are included in the sample component repo. However, it's easy to make your own dialogs for a variety of situations. The Dialog Manager Client simplifies interacting with dialog windows by spawning them and getting data back from them. Reading the API documentation coupled with the Dialog Control documentation will have you well on the way to creating your own dialogs.

Yes-No Dialog

This dialog provides a binary choice to the user (with possible cancellation), and reports back the response.

Unlike a traditional react component, there are no props. Instead, options are passed through the dialogManagerClient. The accepted options are defined below.

type yesNoDialogParams = {
	title: string = "";
	question: string = "No question";
	negativeResponseLabel: string = "No";
	affirmativeResponseLabel: string = "Yes";
	cancelResponseLabel: string = "Cancel";
	showNegativeButton: Boolean = true;
	showAffirmativeButton: Boolean = true;
	showCancelButton: Boolean = true;
};

Here's a screenshot of the yes/no dialog as used to prompt the user to save a modified workspace:

Single Input Dialog

The single input dialog is used when you need some kind of input from a user (e.g., a new workspace's name).

Unlike a traditional react component, there are no props. Instead, options are passed through the dialogManagerClient. The accepted options are defined below.

type singleInputDialogParams = {
	title: string = "Title";
	inputLabel: string = undefined;
	affirmativeResponseLabel: string = "OK";
	cancelResponseLabel: string = "Cancel";
	showCancelButton: Boolean = false;
	inputPattern: string = undefined;
	inputMaxLength: number = undefined;
	inputPlaceholder: string = "New workspace";
};