About this piece
Success Toast
Notification with a circled icon, title, description, and an optional action link.
Usage
The import and the props worth knowing about, in one place.
import { Notification1 } from "@/components/beste/piece/notification1";
<Notification1
surface="card"
bordered={true}
inverted={false}
title="Payment successful"
description="Your invoice has been sent to billing@beste.co"
action="View receipt →"
/>More Notification pieces
View all Notification
Linearnow
New issue assignedENG-482 · Crash on checkout submitPush Notification
Mobile-style push toast with app icon tile, timestamp, and a two-line preview.
Access request
Noah Reyes wants the records role
Approval Request Toast
An actionable notification card with an icon tile, a request line, and a pair of approve and decline buttons.
Your card was declinedUpdate the payment method on file to retry the charge.
Alert Toast
Tinted alert with error, warning, or info severities. Optional dismiss × on the right.
Achievement unlockedShipped 10 pull requests this week
+250 XPAchievement Toast
Celebratory unlock notice with a gradient trophy tile and an XP chip on the right.