Select

1"use client"
2
3import * as React from "react"
4import * as SelectPrimitive from "@radix-ui/react-select"
5import * as Popover from "@radix-ui/react-popover"
6import { cva, type VariantProps } from "class-variance-authority"
7
8import { useFyskConfig } from "@/components/fysk-provider"
9import { useFyskAnimation } from "@/components/hooks/useFyskAnimation"
10import { cn } from "@/lib/utils"
11
12// Changed h-10 to h-9 to match Button 'md' size for consistency
13const selectTriggerVariants = cva(
14    "flex w-full items-center justify-between rounded-md px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1 transition-all",
15    {
16        variants: {
17            variant: {
18                default: "border border-input bg-background",
19                outline: "border-2 border-border bg-transparent",
20                ghost: "border border-transparent bg-transparent hover:bg-muted",
21                glass: "bg-foreground/5 backdrop-blur-md border border-border/50",
22                destructive: "border border-destructive/50 bg-destructive/5 text-destructive",
23                success: "border border-green-500/50 bg-green-500/5 text-green-700 dark:text-green-400",
24                warning: "border border-yellow-500/50 bg-yellow-500/5 text-yellow-700 dark:text-yellow-400",
25                info: "border border-blue-500/50 bg-blue-500/5 text-blue-700 dark:text-blue-400",
26            },
27            size: {
28                default: "h-9 px-3 py-2",
29                xs: "h-7 px-2 py-1 text-xs",
30                sm: "h-8 px-2.5 py-1 text-sm",
31                md: "h-9 px-3 py-2",
32                lg: "h-10 px-4 py-2",
33                xl: "h-12 px-5 py-3 text-lg",
34            },
35        },
36        defaultVariants: {
37            variant: "default",
38            size: "default",
39        },
40    }
41)
42
43// --- CONTEXT & TYPES ---
44
45type SelectionMode = "single" | "multiple"
46
47interface SelectContextValue {
48    selection: SelectionMode
49    selectedValues: string[]
50    onValueChange: (value: string) => void
51    onValueRemove: (value: string) => void
52    onValuesClear: () => void
53    placeholder?: string
54}
55
56const SelectContext = React.createContext<SelectContextValue | null>(null)
57
58function useSelectContext() {
59    return React.useContext(SelectContext)
60}
61
62// … truncated