radio-group

1"use client"
2 
3import * as React from "react"
4 
5import { RadioGroup as RadioGroupPrimitive } from "@ark-ui/react/radio-group"
6 
7import { cn } from "@/lib/utils"
8 
9const RadioGroup = React.forwardRef<
10  React.ElementRef<typeof RadioGroupPrimitive.Root>,
11  RadioGroupPrimitive.RootProps
12>(({ className, ...props }, ref) => (
13  <RadioGroupPrimitive.Root
14    ref={ref}
15    className={cn("grid gap-3", className)}
16    {...props}
17  />
18))
19RadioGroup.displayName = "RadioGroup"
20 
21const RadioGroupContext = RadioGroupPrimitive.Context
22 
23const RadioGroupIndicator = React.forwardRef<
24  React.ElementRef<typeof RadioGroupPrimitive.Indicator>,
25  RadioGroupPrimitive.IndicatorProps
26>(({ className, ...props }, ref) => (
27  <RadioGroupPrimitive.Indicator
28    ref={ref}
29    className={cn(
30      "left-(--left) h-(--height) w-(--width) transition-[left,top,width,height,box-shadow]! peer-has-data-[focus-visible]:border-ring peer-has-data-[focus-visible]:ring-[3px] peer-has-data-[focus-visible]:ring-ring/50",
31      className
32    )}
33    {...props}
34  />
35))
36RadioGroupIndicator.displayName = "RadioGroupIndicator"
37 
38const RadioGroupItem = React.forwardRef<
39  React.ElementRef<typeof RadioGroupPrimitive.Item>,
40  RadioGroupPrimitive.ItemProps
41>(({ className, children, ...props }, ref) => (
42  <RadioGroupPrimitive.Item
43    ref={ref}
44    className={cn("peer flex items-center gap-2", className)}
45    {...props}
46  >
47    <RadioGroupPrimitive.ItemHiddenInput />
48    {children}
49  </RadioGroupPrimitive.Item>
50))
51RadioGroupItem.displayName = "RadioGroupItem"
52 
53const RadioGroupItemContext = RadioGroupPrimitive.ItemContext
54 
55const RadioGroupItemControl = React.forwardRef<
56  React.ElementRef<typeof RadioGroupPrimitive.ItemControl>,
57  RadioGroupPrimitive.ItemControlProps
58>(({ className, ...props }, ref) => (
59  <RadioGroupPrimitive.ItemControl
60    ref={ref}
61    className={cn(
62      "data-[state=checked]:-outline-offset-[5px] aspect-square size-4 shrink-0 rounded-full border border-input bg-transparent shadow-xs transition-shadow focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[disabled]:cursor-not-allowed data-[state=checked]:border-primary data-[state=checked]:bg-primary-foreground data-[disabled]:opacity-50 data-[state=checked]:outline-4 data-[state=checked]:outline-primary data-[state=checked]:outline-solid dark:aria-invalid:ring-destructive/40",
63      className
64    )}
65    {...props}
66  />
67))
68// … truncated