feat: add radio group (#2572)

2026-07-22 04:26:23 +08:00 · 2023-05-29 08:15:22 -07:00
parent 20cc082a02
commit 88eaaf9ce4
8 changed files with 198 additions and 4 deletions
@@ -0,0 +1,35 @@
+import type {
+  RadioGroupItemProps,
+  RadioGroupProps,
+} from '@radix-ui/react-radio-group';
+import * as RadioGroup from '@radix-ui/react-radio-group';
+import { forwardRef } from 'react';
+
+import * as styles from './styles.css';
+
+export const RadioButton = forwardRef<HTMLButtonElement, RadioGroupItemProps>(
+  ({ children, ...props }, ref) => {
+    return (
+      <RadioGroup.Item ref={ref} {...props}>
+        <span className={styles.radioUncheckedButton}>{children}</span>
+        <RadioGroup.Indicator className={styles.radioButton}>
+          {children}
+        </RadioGroup.Indicator>
+      </RadioGroup.Item>
+    );
+  }
+);
+RadioButton.displayName = 'RadioButton';
+
+export const RadioButtonGroup = forwardRef<HTMLDivElement, RadioGroupProps>(
+  ({ ...props }, ref) => {
+    return (
+      <RadioGroup.Root
+        ref={ref}
+        className={styles.radioButtonGroup}
+        {...props}
+      ></RadioGroup.Root>
+    );
+  }
+);
+RadioButtonGroup.displayName = 'RadioButtonGroup';