Toast

import { Button, Toaster, toast } from '@arbol-ai/ui';

<div className="flex flex-wrap gap-2">
  <Button
    onPress={() => {
      toast.success('Contact saved');
    }}
    variant="outline"
  >
    Success
  </Button>
  <Button
    onPress={() => {
      toast.error('Could not send the campaign', {
        description: 'The WhatsApp number is disconnected.',
      });
    }}
    variant="outline"
  >
    Error
  </Button>
  <Button
    onPress={() => {
      toast.info('Export started', { description: 'We will email you the file.' });
    }}
    variant="outline"
  >
    Info
  </Button>
  <Button
    onPress={() => {
      toast.warning('Contact deleted', {
        action: {
          label: 'Undo',
          onAction: () => {
            toast.success('Contact restored');
          },
        },
      });
    }}
    variant="outline"
  >
    With an action
  </Button>
  <Toaster />
</div>