Dropdown Glass

1/**
2 * DropdownGlass Component
3 *
4 * Glass-themed dropdown menu with simple and compound APIs for maximum flexibility.
5 * Wrapper around DropdownMenuGlass for quick menu creation.
6 *
7 * ## Features
8 * - Two APIs: Simple (items prop) and Compound (DropdownMenuGlass.*)
9 * - Theme-aware glassmorphism styling (glass/light/aurora)
10 * - Keyboard navigation (Arrow keys, Enter, Escape)
11 * - Focus management and trap
12 * - Icon support for menu items
13 * - Danger/destructive item variant
14 * - Left/right alignment options
15 * - Dividers for visual grouping
16 * - Uses `--dropdown-*` CSS variables
17 *
18 * ## APIs
19 * **1. Simple API (items prop)** - Quick setup for basic dropdowns
20 * **2. Compound API (DropdownMenuGlass.*)** - Full shadcn/ui pattern for complex menus
21 *
22 * ## CSS Variables
23 * Inherits from DropdownMenuGlass:
24 * - `--dropdown-bg` - Background color (glass theme: `rgba(255,255,255,0.08)`)
25 * - `--dropdown-border` - Border color (glass theme: `rgba(255,255,255,0.15)`)
26 * - `--dropdown-item-hover` - Item hover background
27 * - `--dropdown-item-text` - Item text color
28 * - `--dropdown-icon` - Icon color
29 * - `--dropdown-icon-hover` - Icon color on hover
30 * - `--dropdown-divider` - Divider background
31 * - `--dropdown-glow` - Box shadow with glow effect
32 *
33 * @example Simple API (recommended for basic dropdowns)
34 * ```tsx
35 * import { DropdownGlass } from 'shadcn-glass-ui'
36 *
37 * <DropdownGlass
38 *   trigger={<ButtonGlass><MoreVertical /></ButtonGlass>}
39 *   items={[
40 *     { label: 'Edit', icon: Edit, onClick: handleEdit },
41 *     { divider: true },
42 *     { label: 'Delete', icon: Trash, onClick: handleDelete, danger: true }
43 *   ]}
44 * />
45 * ```
46 *
47 * @example Compound API (for complex dropdowns)
48 * ```tsx
49 * import {
50 *   DropdownMenuGlass,
51 *   DropdownMenuGlassTrigger,
52 *   DropdownMenuGlassContent,
53 *   DropdownMenuGlassItem,
54 *   DropdownMenuGlassSeparator,
55 * } from 'shadcn-glass-ui'
56 *
57 * <DropdownMenuGlass>
58 *   <DropdownMenuGlassTrigger asChild>
59 *     <ButtonGlass>Open Menu</ButtonGlass>
60 *   </DropdownMenuGlassTrigger>
61 *   <DropdownMenuGlassContent>
62 *     <DropdownMenuGlassItem>Edit</DropdownMenuGlassItem>
63 *     <DropdownMenuGlassSeparator />
64 *     <DropdownMenuGlassItem variant="destructive">Delete</DropdownMenuGlassItem>
65 *   </DropdownMenuGlassContent>
66 * </DropdownMenuGlass>
67 * ```
68 *
69 * @example With alignment
70 * ```tsx
71 * <DropdownGlass
72 *   trigger={<ButtonGlass>Menu</ButtonGlass>}
73 *   items={items}
74 *   align="right"
75 * />
76 * ```
77 *
78// … truncated