"use client" import * as React from "react" import * as RadioGroupPrimitive from "@radix-ui/react-radio-group" import { cva, type VariantProps } from "class-variance-authority" import { cn } from "@/lib/utils" interface RadioRowsProps extends React.ComponentProps { containerClassName?: string } function RadioRows({ className, containerClassName, ...props }: RadioRowsProps) { const containerStyles = cn("flex flex-col gap-y-1", "h-auto items-start", containerClassName) return (

{props.children}

) } const radioRowsItemVariants = cva( [ "group w-full", "p-3 pr-4 rounded-md relative flex items-center gap-x-3 justify-between", "transition-all duration-300 font-medium", "cursor-pointer select-none outline-none", "focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2", "disabled:cursor-not-allowed disabled:opacity-50", ], { variants: { variant: { default: [ "border-2 border-muted-foreground/20", "bg-muted/5", "data-[state=checked]:bg-foreground data-[state=checked]:text-background data-[state=checked]:border-muted-foreground/20", "hover:border-muted-foreground/30", ], outline: [ "border-2 border-muted-foreground/20", "bg-transparent", "data-[state=checked]:border-foreground data-[state=checked]:bg-foreground/5 data-[state=checked]:text-foreground", "hover:border-muted-foreground/30", ], primary: [ "border-2 border-muted-foreground/20", "bg-transparent", "data-[state=checked]:border-primary data-[state=checked]:bg-primary/5 data-[state=checked]:text-foreground", "hover:border-muted-foreground/30", ], secondary: [ "border border-muted-foreground/10", "bg-muted/5", "data-[state=checked]:bg-muted data-[state=checked]:border-muted-foreground/20 data-[state=checked]:text-foreground", "hover:bg-muted/10", ], }, }, defaultVariants: { variant: "default", }, }, ) interface RadioRowsItemProps extends React.ComponentProps, VariantProps { children: React.ReactNode } function RadioRowsItem({ className, variant = "default", children, ...props }: RadioRowsItemProps) { return ( {/* Custom Radio Indicator */}

{/* Content */}

{children}

) } interface RadioRowsItemTitleProps extends React.HTMLAttributes { children: React.ReactNode } function RadioRowsItemTitle({ className, children, ...props }: RadioRowsItemTitleProps) { return (

{children}

) } interface RadioRowsItemDescriptionProps extends React.HTMLAttributes { children: React.ReactNode } function RadioRowsItemDescription({ className, children, ...props }: RadioRowsItemDescriptionProps) { return (

{children}

) } export { RadioRows, RadioRowsItem, RadioRowsItemTitle, RadioRowsItemDescription, radioRowsItemVariants }