Advance Toast

This is an Advance Toast component.

Installation

1. Dependencies

npm install clsx tailwind-merge framer-motion

2. Paste inside @/lib/utils.ts

import { clsx } from "clsx";
import { twMerge } from "tailwind-merge";

export function cn(...inputs: Parameters<typeof clsx>) {
  return twMerge(clsx(...inputs));
}

3. Copy Advance Toast Code

Copy Advance Toast Code

Advance Toast Props

Name	Type	Required	Default	Description
children	React.ReactNode	Yes	undefined	The content of the toast.
isOpen	boolean	Yes	undefined	Whether the toast is open or not.
onClose	() => void	Yes	undefined	Function to call when the toast is closed.
duration	number	No	3000	Duration in milliseconds before the toast closes automatically.
className	string	No	""	Additional class names for styling.