Radio

import { cn as merge } from 'cn';
import type { VariantProps } from 'cva';
import { defineConfig } from 'cva/config';
import { getSchema } from 'cva/tools';

export const { cva, cx: cn } = defineConfig({
  cx: merge,
});

export type { VariantProps };
export { getSchema };

import { Radio as RadioPrimitive } from '@base-ui/react/radio';
import { RadioGroup as RadioGroupPrimitive } from '@base-ui/react/radio-group';
import { cn } from '@/lib/utils';

/**
 * Provides a shared state to a series of radio buttons.
 * Renders a `<div>` element.
 *
 * Documentation: [Caprice UI Radio](https://caprice-ui.com/docs/components/radio)
 *
 * API Reference: [Base UI Radio](https://base-ui.com/react/components/radio#radiogroup)
 */
export namespace Group {
  export type State = RadioGroupPrimitive.State;
  export type Props = React.ComponentProps<typeof RadioGroupPrimitive>;
  export type ChangeEventDetails = RadioGroupPrimitive.ChangeEventDetails;
  export type ChangeEventReason = RadioGroupPrimitive.ChangeEventReason;
}

export function Group({ ...props }: Group.Props) {
  return <RadioGroupPrimitive data-slot="radio-group" {...props} />;
}

/**
 * Represents the radio button itself.
 * Renders a `<span>` element and a hidden `<input>` beside.
 *
 * Documentation: [Caprice UI Radio](https://caprice-ui.com/docs/components/radio)
 *
 * API Reference: [Base UI Radio](https://base-ui.com/react/components/radio#root)
 */
export namespace Item {
  export type State = RadioPrimitive.Root.State;
  export type Props = React.ComponentProps<typeof RadioPrimitive.Root>;
}

export function Item({ className, ...props }: Item.Props) {
  return (
    <RadioPrimitive.Root className={cn('', className)} data-slot="radio" {...props}>
      <RadioPrimitive.Indicator className="" data-slot="radio-indicator" />
    </RadioPrimitive.Root>
  );
}