react-dialogues

Modal

Show dialogs with a single function call. Get user responses via Promises.

Modal.show('Hello!', { title: 'Hi' });

const [action] = await Modal.show({
  title: 'Confirm',
  content: 'Click OK to confirm',
  buttons: ['Cancel', 'OK'],
});

if (action === 'ok') {
  Toast.success('OK clicked');
}

Toast

Display notifications with auto-dismiss, progress bars, and multiple placements.

Toast.success('Saved!');

// Await user action with buttons
const [action] = await Toast.info('Item deleted', {
  duration: 5000,
  buttons: ['Undo', <Button value="new">Create new</Button>],
});

if (action === 'undo' && await undo()) {
  Toast.success('Restored!');
} else if (action === 'new') {
  createNewItem();
}

Tooltip & Popover

Add contextual hints with tooltips or rich content with popovers.

<Tooltip content="I'm a tooltip!">
  <Button>Hover me</Button>
</Tooltip>