Radio

<RadioGroup
  name="payment-method"
  size="md"
  direction="vertical"
  value="card"
  onChange={(val) => setSelectedValue(val)}
>
  <Radio
    value="card"
    label="신용/체크카드"
    description="국내외 모든 카드사 무이자 할부 지원"
  />
  <Radio
    value="pay"
    label="간편결제"
    description="카카오페이, 네이버페이, 토스페이"
  />
  <Radio
    value="transfer"
    label="실시간 계좌이체"
    description="이체 수수료 무료"
  />
</RadioGroup>

import { useState } from 'react';
import { Radio, RadioGroup } from '@/components/ui';

export function Example() {
  const [selectedPlan, setSelectedPlan] = useState('pro');

  return (
    <RadioGroup
      name="pricing-plan"
      direction="vertical"
      value={selectedPlan}
      onChange={setSelectedPlan}
    >
      <Radio
        value="basic"
        label="Basic 요금제 (무료)"
        description="개인 프로젝트 및 기본 문서 열람"
      />
      <Radio
        value="pro"
        label="Pro 요금제 (월 12,000원)"
        description="무제한 컴포넌트 복사 및 커스텀 토큰 내보내기"
      />
      <Radio
        value="enterprise"
        label="Enterprise 요금제"
        description="엔터프라이즈 전용 SSO 및 기술 지원"
        disabled
      />
    </RadioGroup>
  );
}