Announcement Banner
A banner component to display important messages with different color variants.
📣 Heads up! We have a special offer just for you.
🎉 You have successfully completed the task !
⚠️ This action cannot be undone. Are you sure you want to proceed?
🚨 This action will permanently delete your account .
Usage
import { AnnouncementBanner } from "@/app/_components/ui/announcement-banner";
<AnnouncementBanner variant="info"> 📣 Heads up! We have a special offer just for you.</AnnouncementBanner>
Props
Name | Type | Default | Description |
---|---|---|---|
children* | ReactNode | - | The content of the banner. |
className | string | - | Adds a custom class. |
variant | "info" | "success" | "warning" | "destructive" | "info" | The color variant of the banner. |
hideCloseButton | boolean | false | Hides or show the close button. |