A toast style notification badge with an icon tile, title, and description for product updates.
The import and the props worth knowing about, in one place.
import { Badge17 } from "@/components/beste/component/badge17";
import { Rocket } from "lucide-react";
<Badge17 title="New template added" description="The Auralis studio set is live" />
<Badge17
title="v2.0 shipped"
description="See what's new"
icon={Rocket} // tile icon (default: BellRing)
tone="emerald" // "primary" (default) | "emerald" | "amber"
/>Read from the component's own type, so this cannot drift from what it accepts.
| Prop | Type | Default | Description |
|---|---|---|---|
title* | string | — | Notification title |
description | string | — | Muted second line |
icon | LucideIcon | — | Icon in the leading tile (defaults to BellRing) |
tone | "primary" | "emerald" | "amber" | — | Icon color |
className | string | — | Additional classes merged onto the root |