Notification Feed

Layout-animated notifications as a Sonner-style stack, inbox list, dynamic island or timeline cards, with swipe to dismiss and pausable timers.

Open in v0

$ pnpm dlx shadcn@latest add @tweenly/notification-feed

import { NotificationFeed } from "@/components/notification-feed"

// Inside your component:
// const { items, notify, dismiss, clear } = useNotifications()
//
// notify({
//   title: "Deploy succeeded",
//   description: "tweenly-docs is live on production.",
//   tone: "success",
// })

export function Demo() {
  return (
    <NotificationFeed items={items} onDismiss={dismiss} />
  )
}

Updates live as you change the controls. Only non-default props are included.