@capacitor/dialog
The Dialog API provides methods for triggering native dialog windows for alerts, confirmations, and input prompts
Install
npm install @capacitor/dialog
npx cap sync
Example
import { Dialog } from '@capacitor/dialog';
const showAlert = async () => {
await Dialog.alert({
title: 'Stop',
message: 'this is an error',
});
};
const showConfirm = async () => {
const { value } = await Dialog.confirm({
title: 'Confirm',
message: `Are you sure you'd like to press the red button?`,
});
console.log('Confirmed:', value);
};
const showPrompt = async () => {
const { value, cancelled } = await Dialog.prompt({
title: 'Hello',
message: `What's your name?`,
});
console.log('Name:', value);
console.log('Cancelled:', cancelled);
};
API
alert(...)
alert(options: AlertOptions) => Promise<void>
Show an alert dialog
Param | Type |
---|---|
options | AlertOptions |
Since: 1.0.0
prompt(...)
prompt(options: PromptOptions) => Promise<PromptResult>
Show a prompt dialog
Param | Type |
---|---|
options | PromptOptions |
Returns: Promise<PromptResult>
Since: 1.0.0
confirm(...)
confirm(options: ConfirmOptions) => Promise<ConfirmResult>
Show a confirmation dialog
Param | Type |
---|---|
options | ConfirmOptions |
Returns: Promise<ConfirmResult>
Since: 1.0.0
Interfaces
AlertOptions
Prop | Type | Description | Default | Since |
---|---|---|---|---|
title | string | Title of the dialog. | 1.0.0 | |
message | string | Message to show on the dialog. | 1.0.0 | |
buttonTitle | string | Text to use on the action button. | "OK" | 1.0.0 |
PromptResult
Prop | Type | Description | Since |
---|---|---|---|
value | string | Text entered on the prompt. | 1.0.0 |
cancelled | boolean | Whether if the prompt was canceled or accepted. | 1.0.0 |
PromptOptions
Prop | Type | Description | Default | Since |
---|---|---|---|---|
title | string | Title of the dialog. | 1.0.0 | |
message | string | Message to show on the dialog. | 1.0.0 | |
okButtonTitle | string | Text to use on the positive action button. | "OK" | 1.0.0 |
cancelButtonTitle | string | Text to use on the negative action button. | "Cancel" | 1.0.0 |
inputPlaceholder | string | Placeholder text for hints. | 1.0.0 | |
inputText | string | Prepopulated text. | 1.0.0 |
ConfirmResult
Prop | Type | Description | Since |
---|---|---|---|
value | boolean | true if the positive button was clicked, false otherwise. | 1.0.0 |
ConfirmOptions
Prop | Type | Description | Default | Since |
---|---|---|---|---|
title | string | Title of the dialog. | 1.0.0 | |
message | string | Message to show on the dialog. | 1.0.0 | |
okButtonTitle | string | Text to use on the positive action button. | "OK" | 1.0.0 |
cancelButtonTitle | string | Text to use on the negative action button. | "Cancel" | 1.0.0 |