Toast
A Toast displays a brief, temporary notification of actions, errors, or other events in an application.

Installation

In the terminal, run the following command to begin:
npx hq-kit add toast

First, in your root app component or layout, import the Toast component.

import { ToastProvider } from '@/components/ui'
 
const Layout = ({ children }: { children: React.ReactNode }) => {
    return (
        <>
            <ToastProvider />
            {children}
        <>
    )
}

Basic

Use the toast() function to show a toast.

Description

Status

Action

Manually Close

Just pass the timeout: 0 option.