All dialog functions return Promises, so you can use async/await for clean, synchronous-looking code:

// Confirm dialog
const confirmed = await dialogService.confirm({
  title: 'Delete Item?',
  message: 'This action cannot be undone.',
  variant: 'danger'
});

if (confirmed) {
  // User clicked OK
}

// Alert dialog
await dialogService.alert({
  title: 'Success!',
  message: 'Your changes have been saved.',
  variant: 'success'
});

// Prompt dialog
const name = await dialogService.prompt({
  title: 'Enter Name',
  message: 'Please enter your name:',
  defaultValue: 'John Doe'
});

if (name !== null) {
  console.log('User entered:', name);
}

Two-button dialogs that return true (confirmed) or false (cancelled).

Dialogs can be positioned in the center (default) or at the top of the viewport.

// Center position (default)
await dialogService.alert({
  title: 'Centered',
  message: 'This dialog is centered.',
  position: 'center'  // default
});

// Top position
await dialogService.prompt({
  title: 'Top Position',
  message: 'This dialog appears near the top.',
  position: 'top'
});

Single-button dialogs for notifications. Just wait for the user to acknowledge.

Text input dialogs that return the entered value (or null if cancelled).

Chain multiple dialogs together using async/await:

async function sequentialDialogs() {
  const name = await dialogService.prompt({
    title: 'Step 1 of 3',
    message: 'Enter your name:'
  });

  if (name === null) return;

  const email = await dialogService.prompt({
    title: 'Step 2 of 3',
    message: 'Enter your email:'
  });

  if (email === null) return;

  const confirmed = await dialogService.confirm({
    title: 'Step 3 of 3',
    message: `Confirm: ${name} <${email}>`,
    variant: 'success'
  });

  if (confirmed) {
    await dialogService.alert({
      title: 'Complete!',
      message: 'Registration successful.',
      variant: 'success'
    });
  }
}

Define your own buttons with typed return values using dialogService.custom().

// Custom dialog with typed return values
const result = await dialogService.custom<'save' | 'discard' | 'cancel'>({
  title: 'Unsaved Changes',
  message: 'You have unsaved changes.',
  variant: 'warning',
  dismissValue: 'cancel',  // Returned on Escape/backdrop click
  buttons: [
    { label: 'Cancel', value: 'cancel', variant: 'secondary' },
    { label: 'Discard', value: 'discard', variant: 'danger', isOutline: true },
    { label: 'Save', value: 'save', variant: 'success' }
  ]
});

switch (result) {
  case 'save':
    await saveDocument();
    break;
  case 'discard':
    discardChanges();
    break;
  case 'cancel':
    // User cancelled
    break;
}

dialogService.confirm(options)

Returns Promise<boolean>

dialogService.alert(options)

Returns Promise<void>

dialogService.prompt(options)

Returns Promise<string | null>

dialogService.custom<T>(options)

Returns Promise<T> - the value of the clicked button

DialogButton<T>

Button definition for custom dialogs