New Badge
Auto-expiring "New" badge that checks feature newness via useNewFeature(). Renders a shadcn Badge — click to dismiss.
Install
npx shadcn@latest add https://featuredrop.dev/r/new-badge.jsonPreview
Usage
import { NewBadge } from "@/components/featuredrop/new-badge"
export function Sidebar() {
return (
<nav>
<a href="/analytics">
Analytics <NewBadge featureKey="analytics" />
</a>
<a href="/settings">
Settings <NewBadge featureKey="settings" label="Updated" />
</a>
</nav>
)
}Props
| Prop | Type | Default | Description |
|---|---|---|---|
featureKey | string | — | Sidebar/feature key to check for newness |
label | string | "New" | Badge text |
className | string | — | Additional Tailwind classes |
dismissOnClick | boolean | true | Whether clicking dismisses the badge |
⚠️
Requires a FeatureDropProvider ancestor with a manifest containing a feature whose sidebarKey matches your featureKey.
shadcn Dependencies
badge