Alert Glass

1/**
2 * AlertGlass Component
3 *
4 * Glass-themed alert with:
5 * - Theme-aware styling via CSS variables (glass/light/aurora)
6 * - shadcn/ui compatible variants (default, destructive)
7 * - Extended Glass UI variants (success, warning)
8 * - Compound component API for flexible composition
9 * - Dismissible option
10 * - Backdrop blur effect
11 *
12 * @example Compound API (recommended)
13 * ```tsx
14 * <AlertGlass variant="default">
15 *   <AlertGlassTitle>Heads up!</AlertGlassTitle>
16 *   <AlertGlassDescription>
17 *     You can add components to your app using the cli.
18 *   </AlertGlassDescription>
19 * </AlertGlass>
20 * ```
21 *
22 * @example With dismiss button
23 * ```tsx
24 * <AlertGlass variant="destructive" dismissible onDismiss={() => setShow(false)}>
25 *   <AlertGlassTitle>Error</AlertGlassTitle>
26 *   <AlertGlassDescription>
27 *     Your session has expired.
28 *   </AlertGlassDescription>
29 * </AlertGlass>
30 * ```
31 */
32 
33'use client';
34 
35import { forwardRef, type CSSProperties } from 'react';
36import { type VariantProps } from 'class-variance-authority';
37import { Info, CheckCircle, AlertTriangle, AlertCircle, X } from 'lucide-react';
38import { cn } from '@/lib/utils';
39import { alertVariants } from '@/lib/variants/alert-glass-variants';
40import { ICON_SIZES } from '@/components/glass/primitives';
41import '@/glass-theme.css';
42 
43import type { AlertVariant } from '@/lib/variants/alert-glass-variants';
44 
45// ========================================
46// ICON MAP
47// ========================================
48 
49const iconMap: Record<AlertVariant, typeof Info> = {
50  default: Info,
51  destructive: AlertCircle,
52  success: CheckCircle,
53  warning: AlertTriangle,
54  // Aliases
55  info: Info,
56  error: AlertCircle,
57};
58 
59// ========================================
60// CSS VARIABLE HELPERS
61// ========================================
62 
63type AlertStyleVars = { bg: string; border: string; text: string };
64 
65const variantStyles: Record<AlertVariant, AlertStyleVars> = {
66  // shadcn/ui compatible variants
67  default: {
68    bg: 'var(--alert-default-bg)',
69    border: 'var(--alert-default-border)',
70    text: 'var(--alert-default-text)',
71  },
72  destructive: {
73    bg: 'var(--alert-destructive-bg)',
74    border: 'var(--alert-destructive-border)',
75    text: 'var(--alert-destructive-text)',
76  },
77  // Glass UI extended variants
78  success: {
79    bg: 'var(--alert-success-bg)',
80    border: 'var(--alert-success-border)',
81    text: 'var(--alert-success-text)',
82  },
83  warning: {
84    bg: 'var(--alert-warning-bg)',
85// … truncated