Shadcn UI Live Purchase Block
LivePurchase3 is a dynamic shadcn component designed to display real-time notifications of recent purchases on a website. It enhances user engagement by showcasing live purchase activity, providing social proof that can influence buying decisions. The component presents a floating card at the lower-left corner of the interface, which cycles through recent purchases, along with additional context about the number of viewers currently browsing and the total number of products sold today.
This shadcn UI component is architected with an intelligent notification system that transitions through a list of recent purchases at timed intervals, creating a lively atmosphere that can captivate users’ attention. The component’s design includes two main sections: a notification card that slides into view with details of the latest purchase, and a stats bar displaying real-time metrics such as active viewers and daily sales figures. This visually appealing shadcn block provides a smooth, animated experience, employing a blend of icons, text, and animation to deliver an interactive visual that can be tailored through customizable props like purchases, viewer count, and daily sales.
Dependencies
| Package | Type |
|---|---|
| lucide-react | NPM |
| react | NPM |
button @shadcn | Registry |
card @shadcn | Registry |