Tooltip Glass

1/**
2 * TooltipGlass Component
3 *
4 * Glass-themed tooltip with:
5 * - Unified dark design (consistent UX across themes)
6 * - Position variants (top/bottom/left/right)
7 * - Smooth animation
8 * - Built on Radix UI primitives
9 *
10 * @example Compound API (recommended)
11 * ```tsx
12 * <TooltipGlassProvider>
13 *   <TooltipGlass>
14 *     <TooltipGlassTrigger asChild>
15 *       <Button>Hover</Button>
16 *     </TooltipGlassTrigger>
17 *     <TooltipGlassContent>
18 *       <p>Add to library</p>
19 *     </TooltipGlassContent>
20 *   </TooltipGlass>
21 * </TooltipGlassProvider>
22 * ```
23 *
24 * @example Simple wrapper
25 * ```tsx
26 * <TooltipGlassProvider>
27 *   <TooltipGlassSimple content="Click to edit">
28 *     <button>Edit</button>
29 *   </TooltipGlassSimple>
30 * </TooltipGlassProvider>
31 * ```
32 */
33 
34'use client';
35 
36import * as React from 'react';
37import * as TooltipPrimitive from '@radix-ui/react-tooltip';
38import { cn } from '@/lib/utils';
39import '@/glass-theme.css';
40 
41// ========================================
42// COMPOUND COMPONENT: PROVIDER
43// ========================================
44 
45type TooltipGlassProviderProps = React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Provider>;
46 
47/**
48 * TooltipGlassProvider - Context provider for all tooltips
49 * Must wrap TooltipGlass components at the app level.
50 */
51const TooltipGlassProvider: React.FC<TooltipGlassProviderProps> = ({
52  delayDuration = 0,
53  ...props
54}) => {
55  return (
56    <TooltipPrimitive.Provider
57      data-slot="tooltip-provider"
58      delayDuration={delayDuration}
59      {...props}
60    />
61  );
62};
63 
64TooltipGlassProvider.displayName = 'TooltipGlassProvider';
65 
66// ========================================
67// COMPOUND COMPONENT: ROOT
68// ========================================
69 
70/**
71 * TooltipGlassRoot - Individual tooltip instance
72 * Wraps Radix TooltipPrimitive.Root with auto-included Provider (shadcn/ui pattern)
73 */
74function TooltipGlassRoot({
75  ...props
76}: React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Root>) {
77  return (
78    <TooltipGlassProvider>
79      <TooltipPrimitive.Root data-slot="tooltip" {...props} />
80    </TooltipGlassProvider>
81  );
82}
83 
84// ========================================
85// COMPOUND COMPONENT: TRIGGER
86// ========================================
87 
88/**
89 * TooltipGlassTrigger - Element that triggers the tooltip
90 * Supports asChild pattern for custom trigger elements.
91 */
92const TooltipGlassTrigger = React.forwardRef<
93  React.ElementRef<typeof TooltipPrimitive.Trigger>,
94// … truncated