35 lines
823 B
TypeScript
35 lines
823 B
TypeScript
"use client";
|
|
|
|
import { ReactNode } from 'react';
|
|
|
|
interface NotificationStackProps {
|
|
children: ReactNode[];
|
|
}
|
|
|
|
/**
|
|
* Container component to stack multiple notifications vertically
|
|
*/
|
|
export function NotificationStack({ children }: NotificationStackProps) {
|
|
const notifications = Array.isArray(children) ? children.filter(Boolean) : (children ? [children] : []);
|
|
|
|
if (notifications.length === 0) {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<div className="fixed top-4 right-4 z-[9999] flex flex-col gap-3">
|
|
{notifications.map((notification, index) => (
|
|
<div
|
|
key={index}
|
|
className="animate-in slide-in-from-top-5 duration-300"
|
|
style={{
|
|
animationDelay: `${index * 100}ms`,
|
|
}}
|
|
>
|
|
{notification}
|
|
</div>
|
|
))}
|
|
</div>
|
|
);
|
|
}
|