Empty state

1import { cn } from "@/lib/utils";
2 
3export function EmptyStateContainer({
4  children,
5  className,
6  ...props
7}: React.ComponentProps<"div">) {
8  return (
9    <div
10      className={cn(
11        "flex h-full flex-col items-center justify-center gap-2 rounded-lg border border-border border-dashed p-4",
12        className,
13      )}
14      {...props}
15    >
16      {children}
17    </div>
18  );
19}
20 
21export function EmptyStateTitle({
22  children,
23  className,
24  ...props
25}: React.ComponentProps<"p">) {
26  return (
27    <p className={cn("text-foreground", className)} {...props}>
28      {children}
29    </p>
30  );
31}
32 
33export function EmptyStateDescription({
34  children,
35  className,
36  ...props
37}: React.ComponentProps<"p">) {
38  return (
39    <p
40      className={cn("text-center text-muted-foreground text-sm", className)}
41      {...props}
42    >
43      {children}
44    </p>
45  );
46}