Toast

Use toast to notify

ToastChakra UI: Simple, Modular and Accessible UI Components for your React Applications.

import { useToast } from '@chakra-ui/react'

function ToastExample() {
  const toast = useToast()
  return (
    <Button
      onClick={() =>
        toast({
          title: 'Account created.',
          description: "We've created your account for you.",
          status: 'success',
          duration: 9000,
          isClosable: true,
        })
      }
    >
      Show Toast
    </Button>
  )
}