PioneerUI v2.0 is here with 25+ new components!See what's new
🎉 PioneerUI Pro is now available — one-time purchase, lifetime access.Learn more
Maintenance scheduled for Sunday 2AM UTC.
Installation
Usage
import { AnnouncementBanner } from "@/components/pioneerui/announcement-banner"
export default function Layout({ children }) {
return (
<>
<AnnouncementBanner
message="PioneerUI v2.0 is here!"
href="/docs"
cta="See what's new"
variant="primary"
dismissible
/>
{children}
</>
)
}Props
| Prop | Type | Default | Description |
|---|---|---|---|
message | string | — | Banner message text (required) |
href | string | undefined | CTA link URL |
cta | string | undefined | CTA link text |
variant | default | primary | warning | success | default | Color scheme |
dismissible | boolean | true | Show dismiss button |
icon | React.ReactNode | undefined | Leading icon element |
onDismiss | () => void | undefined | Callback when dismissed |