Glass Empty

1import { cn } from '@/lib/utils'
2 
3export function GlassEmpty({ className, ...props }: React.ComponentProps<'div'>) {
4  return (
5    <div
6      className={cn(
7        'grid place-items-center gap-3 rounded-2xl border border-dashed border-border bg-glass/50 p-10 text-center backdrop-blur-md',
8        className,
9      )}
10      {...props}
11    />
12  )
13}
14 
15export function GlassEmptyIcon({ className, ...props }: React.ComponentProps<'div'>) {
16  return (
17    <div
18      className={cn(
19        'grid size-12 place-items-center rounded-full border border-glass-edge bg-glass text-faint [&_svg]:size-5',
20        className,
21      )}
22      {...props}
23    />
24  )
25}
26 
27export function GlassEmptyTitle({ className, ...props }: React.ComponentProps<'h3'>) {
28  return <h3 className={cn('font-display text-base font-medium', className)} {...props} />
29}
30 
31export function GlassEmptyDescription({ className, ...props }: React.ComponentProps<'p'>) {
32  return <p className={cn('max-w-sm text-sm text-muted-foreground', className)} {...props} />
33}
34 
35export function GlassEmptyContent({ className, ...props }: React.ComponentProps<'div'>) {
36  return (
37    <div
38      className={cn('mt-1 flex flex-wrap items-center justify-center gap-3', className)}
39      {...props}
40    />
41  )
42}