Skip to content

🎨 API Reference

This package exposes two main composables:

  • useToast() → for showing toast notifications
  • useConfirmation() → for showing confirmation dialogs

Both are easy to use, promise-based, and fully typed.


🍞 useToast()

The useToast() composable is used to show non-blocking toast notifications like success messages, errors, warnings, or info alerts.

Available Methods

MethodArgumentsWhat it does
success(msg, title?, duration?, position?)Shows a green success toast
error(msg, title?, duration?, position?)Shows a red error toast
warning(msg, title?, duration?, position?)Shows an orange warning toast
info(msg, title?, duration?, position?)Shows a blue info toast
setPosition(position)Changes the toast position globally
remove(id)Removes a specific toast manually

Example

ts
const toast = useToast();

toast.success('Saved successfully');
toast.error('Something went wrong');
toast.warning('Session is about to expire');
toast.info('New update available');

You can also control duration and position per toast if needed.


💬 useConfirmation()

The useConfirmation() composable is used to show confirmation dialogs.

It is promise-based, which means your code waits until the user clicks Confirm or Cancel.

Available Method

MethodArgumentsReturnsWhat it does
confirm(options)Promise<boolean>Opens a modal and waits for user response
  • Returns true → user confirmed
  • Returns false → user cancelled

ModalOptions

These options control how the confirmation modal looks and behaves:

PropertyTypeDescription
titlestringModal heading (required)
messagestringModal description (required)
confirmTextstringText for the confirm button
cancelTextstringText for the cancel button
type'danger' | 'warning' | 'info'Button style (red, orange, blue)
iconstringCustom icon (overrides default icons)