Announcement Banner
Top-of-page announcement bar
Marketing BlockHero
Overview
A sticky banner pinned to the top of the viewport. Supports an optional inline link and a dismiss button that hides the banner for the current session.
Usage
import { AnnouncementBanner } from "@leanicon/web-builder-library";We just launched v2.0! Read the changelog
Notes
- Dismissed state is local React state — the banner reappears on page refresh.
- The banner renders
nullafter dismissal. - Dark mode: pass
colorScheme="dark"or use within a dark-themed layout.
Props
| Name | Type | Default | Required | Description |
|---|---|---|---|---|
text | string | — | Yes | |
link | { label: string; href: string; } | — | No | |
dismissible | boolean | true | No | |
id | string | — | No | Stable identifier for this announcement. When set, dismissals are persisted to `localStorage` so the same banner is not shown again on later visits. Change the id whenever the announcement content changes to re-show it. |
colorScheme | enum | — | No | |
className | string | — | No |