1import { Info, OctagonAlert, TriangleAlert } from "lucide-react";
 2import {
 3    Alert,
 4    AlertDescription,
 5    AlertTitle,
 6} from "@marzneshin/common/components";
 7import { cn } from "@marzneshin/common/utils";
 8
 9interface AlertCardProps {
10    variant?: "warning" | "default" | "destructive";
11    title: string | JSX.Element;
12    size?: "wide-full" | "inline";
13    desc?: string | JSX.Element;
14}
15
16export const AlertCard = ({
17    title,
18    desc,
19    variant = "default",
20    size = "inline",
21}: AlertCardProps) => {
22    const Icon =
23        variant === "warning"
24            ? TriangleAlert
25            : variant === "destructive"
26              ? OctagonAlert
27              : Info;
28    return (
29        <Alert
30            variant={variant}
31            className={cn({
32                "flex flex-col justify-center items-center max-h-full h-[5.8rem] w-full gap-2 border-0":
33                    size === "wide-full",
34            })}
35        >
36            <div>
37                <Icon
38                    className={cn("size-8", {
39                        "": (size = "inline"),
40                    })}
41                />
42            </div>
43            <AlertTitle className="font-semibold">{title}</AlertTitle>
44            <AlertDescription>{desc}</AlertDescription>
45        </Alert>
46    );
47};