Toast Component Catalog

toast('This is a basic toast message')

toast.success('This is a success toast', {
  description: 'Your action was completed successfully',
})

toast.error('This is an error toast', {
  description: 'Something went wrong',
  duration: 8000, // 8 seconds
})

toast.warning('This is a warning toast', {
  description: 'Please be careful with this action',
  duration: 3000, // 3 seconds
})

toast.info('This is an info toast', {
  description: "Here's some information for you",
  duration: Number.POSITIVE_INFINITY, // Won't disappear until closed
})

toast('Short duration toast', {
  description: 'This toast will disappear quickly',
  duration: 2000, // 2 seconds
})

toast('Long duration toast', {
  description: 'This toast will stay visible for longer',
  duration: 10000, // 10 seconds
})

toast.info('This is a permanent toast', {
  description: "This toast won't disappear until closed",
  duration: Number.POSITIVE_INFINITY,
})

toastOnNextPage(
  'success',
  'Welcome from the previous page!',
  'This toast was set on the home page and shown after navigation',
  10000 // 10 seconds duration
)

// Then navigate to the next page
router.push('/some-page')

toast('Custom toast', {
  description: 'With custom styling and options',
  icon: <CustomIcon />,
  position: 'top-center',
  className: 'my-custom-toast',
})