Staticmaple/NEWBING
0
1'use client'2 3import * as React from 'react'4import * as SelectPrimitive from '@radix-ui/react-select'5 6import { cn } from '@/lib/utils'7import {8 IconArrowDown,9 IconCheck,10 IconChevronUpDown11} from '@/components/ui/icons'12 13const Select = SelectPrimitive.Root14 15const SelectGroup = SelectPrimitive.Group16 17const SelectValue = SelectPrimitive.Value18 19const SelectTrigger = React.forwardRef<20 React.ElementRef<typeof SelectPrimitive.Trigger>,21 React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>22>(({ className, children, ...props }, ref) => (23 <SelectPrimitive.Trigger24 ref={ref}25 className={cn(26 'flex h-9 w-full items-center justify-between rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow 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',27 className28 )}29 {...props}30 >31 {children}32 <SelectPrimitive.Icon asChild>33 <IconChevronUpDown className="opacity-50" />34 </SelectPrimitive.Icon>35 </SelectPrimitive.Trigger>36))37SelectTrigger.displayName = SelectPrimitive.Trigger.displayName38 39const SelectContent = React.forwardRef<40 React.ElementRef<typeof SelectPrimitive.Content>,41 React.ComponentPropsWithoutRef<typeof SelectPrimitive.Content>42>(({ className, children, position = 'popper', ...props }, ref) => (43 <SelectPrimitive.Portal>44 <SelectPrimitive.Content45 ref={ref}46 className={cn(47 'relative z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md animate-in fade-in-80',48 position === 'popper' && 'translate-y-1',49 className50 )}51 position={position}52 {...props}53 >54 <SelectPrimitive.Viewport55 className={cn(56 'p-1',57 position === 'popper' &&58 'h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]'59 )}60 >61 {children}62 </SelectPrimitive.Viewport>63 </SelectPrimitive.Content>64 </SelectPrimitive.Portal>65))66SelectContent.displayName = SelectPrimitive.Content.displayName67 68const SelectLabel = React.forwardRef<69 React.ElementRef<typeof SelectPrimitive.Label>,70 React.ComponentPropsWithoutRef<typeof SelectPrimitive.Label>71>(({ className, ...props }, ref) => (72 <SelectPrimitive.Label73 ref={ref}74 className={cn('py-1.5 pl-8 pr-2 text-sm font-semibold', className)}75 {...props}76 />77))78SelectLabel.displayName = SelectPrimitive.Label.displayName79 80const SelectItem = React.forwardRef<81 React.ElementRef<typeof SelectPrimitive.Item>,82 React.ComponentPropsWithoutRef<typeof SelectPrimitive.Item>83>(({ className, children, ...props }, ref) => (84 <SelectPrimitive.Item85 ref={ref}86 className={cn(87 'relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',88 className89 )}90 {...props}91 >92 <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">93 <SelectPrimitive.ItemIndicator>94 <IconCheck className="h-4 w-4" />95 </SelectPrimitive.ItemIndicator>96 </span>97 <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>98 </SelectPrimitive.Item>99))100SelectItem.displayName = SelectPrimitive.Item.displayName101 102const SelectSeparator = React.forwardRef<103 React.ElementRef<typeof SelectPrimitive.Separator>,104 React.ComponentPropsWithoutRef<typeof SelectPrimitive.Separator>105>(({ className, ...props }, ref) => (106 <SelectPrimitive.Separator107 ref={ref}108 className={cn('-mx-1 my-1 h-px bg-muted', className)}109 {...props}110 />111))112SelectSeparator.displayName = SelectPrimitive.Separator.displayName113 114export {115 Select,116 SelectGroup,117 SelectValue,118 SelectTrigger,119 SelectContent,120 SelectLabel,121 SelectItem,122 SelectSeparator123}124 