Components/Rotating Stack

Rotating Stack

An animated notification stack that cycles through items automatically.

Vercel logo

Vercel has shipped a new feature

Installation

pnpm dlx shadcn@latest add https://orbit.ruturaj.xyz/r/rotating-stack.json

Usage

import RotatingStack from "@/components/rotating-stack"

export default function Page() {
  return (
    <RotatingStack
      notifications={[
        { id: 1, message: "Vercel has shipped a new feature", cta: "Explore" },
        { id: 2, message: "Your deployment is ready to preview", cta: "View deploy" },
        { id: 3, message: "Domain verification successful", cta: "Go to settings" },
      ]}
    />
  )
}

Examples

With Icons

Notifications with image and React node icons.

Vercel logo

Vercel has shipped a new feature