Installation
Usage
import BannerAnnouncement from "@/components/ruixen/banner-announcement";
export default function MyBanner() {
return (
<BannerAnnouncement
badge="New"
action={{ label: "Learn more", href: "/features" }}
>
Real-time collaboration is now available for your team.
</BannerAnnouncement>
);
}Props
| Prop | Type | Default | Description |
|---|---|---|---|
children | React.ReactNode | - | The announcement message |
badge | string | - | Optional pill label before the message |
action | { label: string; href: string } | - | Action link with arrow |
dismissible | boolean | true | Whether the banner can be dismissed |
onDismiss | () => void | - | Callback fired after dismiss animation |
className | string | - | Additional CSS classes |