Slider Glass

1/**
2 * SliderGlass Component
3 *
4 * Glass-themed range slider built on Radix UI with shadcn/ui compatible API:
5 * - Theme-aware styling (glass/light/aurora)
6 * - Glow effect on hover/drag
7 * - Gradient fill (glass theme)
8 * - Range slider support (multiple thumbs)
9 * - Optional label and value display
10 *
11 * **shadcn/ui compatible props:**
12 * - `value` / `defaultValue` - Array of values (supports range)
13 * - `onValueChange` - Callback when values change
14 * - `onValueCommit` - Callback when interaction ends
15 *
16 * @example
17 * ```tsx
18 * // Single value (controlled)
19 * <SliderGlass value={[50]} onValueChange={setValue} />
20 *
21 * // Range slider
22 * <SliderGlass defaultValue={[25, 75]} />
23 *
24 * // With label and value display
25 * <SliderGlass value={[50]} onValueChange={setValue} label="Volume" showValue />
26 * ```
27 */
28 
29import { forwardRef, type CSSProperties, type ComponentPropsWithoutRef } from 'react';
30import * as SliderPrimitive from '@radix-ui/react-slider';
31import { cn } from '@/lib/utils';
32import { FormFieldWrapper } from '@/components/glass/primitives';
33import '@/glass-theme.css';
34 
35// ========================================
36// PROPS INTERFACE
37// ========================================
38 
39export interface SliderGlassProps extends Omit<
40  ComponentPropsWithoutRef<typeof SliderPrimitive.Root>,
41  'value' | 'defaultValue' | 'onValueChange'
42> {
43  /**
44   * Controlled value (shadcn/ui compatible - array for range support)
45   */
46  readonly value?: number[];
47  /**
48   * Default value for uncontrolled usage (array for range support)
49   */
50  readonly defaultValue?: number[];
51  /**
52   * Callback when value changes (shadcn/ui compatible)
53   */
54  readonly onValueChange?: (value: number[]) => void;
55  /**
56   * Callback when interaction ends (mouse up / touch end)
57   */
58  readonly onValueCommit?: (value: number[]) => void;
59  /**
60   * Show current value(s) next to label
61   */
62  readonly showValue?: boolean;
63  /**
64   * Optional label text
65   */
66  readonly label?: string;
67  /**
68   * Error message to display
69   */
70  readonly error?: string;
71  /**
72   * Success message to display
73   */
74  readonly success?: string;
75}
76 
77// ========================================
78// COMPONENT
79// ========================================
80 
81export const SliderGlass = forwardRef<
82  React.ComponentRef<typeof SliderPrimitive.Root>,
83  SliderGlassProps
84>(
85  (
86    {
87      className,
88      value,
89      defaultValue,
90      onValueChange,
91      onValueCommit,
92      min = 0,
93      max = 100,
94      step = 1,
95// … truncated