diff --git a/src/components/data-entry/Radio/Radio.tsx b/src/components/data-entry/Radio/Radio.tsx index 208e1a807..026442730 100644 --- a/src/components/data-entry/Radio/Radio.tsx +++ b/src/components/data-entry/Radio/Radio.tsx @@ -1,6 +1,8 @@ import { Radio as AntRadio } from 'antd' import { type RadioProps as AntRadioProps } from 'antd' import { ConfigProvider } from 'src/components' +import { RadioGroup } from "./RadioGroup"; +import { RadioButton } from "./RadioButton"; export interface IRadioProps extends AntRadioProps {} @@ -14,5 +16,5 @@ export const Radio = (props: IRadioProps) => { // TODO Is there a way to type the props from Radio.Group better so that value types are inferred? // This happens with ant as well. doesn't get properly propagated to the change event -Radio.Group = AntRadio.Group -Radio.Button = AntRadio.Button +Radio.Group = RadioGroup +Radio.Button = RadioButton diff --git a/src/components/data-entry/Radio/RadioButton.stories.tsx b/src/components/data-entry/Radio/RadioButton.stories.tsx new file mode 100644 index 000000000..4de404e75 --- /dev/null +++ b/src/components/data-entry/Radio/RadioButton.stories.tsx @@ -0,0 +1,21 @@ +import { type Meta, type StoryObj } from '@storybook/react' +import { Radio } from 'src/components/data-entry/Radio/Radio' + +const meta: Meta = { + title: 'Aquarium/Data Entry/Radio/RadioButton', + component: Radio.Button, + + args: { + autoFocus: false, + checked: false, + defaultChecked: false, + disabled: false, + value: undefined, + children: 'Radio Button', + }, +} +export default meta + +type Story = StoryObj + +export const Primary: Story = {} \ No newline at end of file diff --git a/src/components/data-entry/Radio/RadioButton.tsx b/src/components/data-entry/Radio/RadioButton.tsx new file mode 100644 index 000000000..731e6e5b2 --- /dev/null +++ b/src/components/data-entry/Radio/RadioButton.tsx @@ -0,0 +1,13 @@ +import { Radio as AntRadio } from 'antd' +import { type RadioButtonProps as AntRadioGroupProps } from "antd/es/radio/radioButton"; +import { ConfigProvider } from 'src/components' + +export interface IRadioButtonProps extends AntRadioGroupProps {} + +export const RadioButton = (props: IRadioButtonProps) => { + return ( + + + + ) +} diff --git a/src/components/data-entry/Radio/RadioGroup.stories.tsx b/src/components/data-entry/Radio/RadioGroup.stories.tsx new file mode 100644 index 000000000..863271c2f --- /dev/null +++ b/src/components/data-entry/Radio/RadioGroup.stories.tsx @@ -0,0 +1,46 @@ +import { type Meta, type StoryObj } from '@storybook/react' +import { Radio } from 'src/components/data-entry/Radio/Radio' + +const meta: Meta = { + title: 'Aquarium/Data Entry/Radio/RadioGroup', + component: Radio.Group, + + args: { + buttonStyle: undefined, + defaultValue: undefined, + disabled: false, + name: undefined, + options: undefined, + optionType: undefined, + size: 'middle', + value: undefined, + onChange: undefined, + children: undefined + }, +} +export default meta + +type Story = StoryObj + +export const WithOptionsAndOptionType: Story = { + args: { + options: [ + { label: 'Apple', value: 'Apple' }, + { label: 'Pear', value: 'Pear' }, + { label: 'Orange', value: 'Orange', title: 'Orange' }, + ], + optionType: 'default', + }, +} + +export const WithRadioButtons: Story = { + args: { + defaultValue: "a", + children: [ + Hangzhou, + Shanghai, + Beijing, + Chengdu + ] + }, +} \ No newline at end of file diff --git a/src/components/data-entry/Radio/RadioGroup.tsx b/src/components/data-entry/Radio/RadioGroup.tsx new file mode 100644 index 000000000..3286a92e9 --- /dev/null +++ b/src/components/data-entry/Radio/RadioGroup.tsx @@ -0,0 +1,13 @@ +import { Radio as AntRadio } from 'antd' +import { type RadioGroupProps as AntRadioGroupProps } from 'antd' +import { ConfigProvider } from 'src/components' + +export interface IRadioGroupProps extends AntRadioGroupProps {} + +export const RadioGroup = (props: IRadioGroupProps) => { + return ( + + + + ) +}