import React from 'react';
import type { Meta, StoryObj } from '@storybook/react';
import { RadioButton, RadioButtonGroup } from './RadioButtonGroup';
import { action } from '@storybook/addon-actions';

const meta: Meta<typeof RadioButtonGroup> = {
	title: 'Inputs/RadioButtonGroup',
	component: RadioButtonGroup,
	argTypes: { value: { description: "Not setting this creates an uncontrolled input group." } },
	parameters: {
		controls: {
			include: [
				'disabled',
				'uncheckWhenDisabled',
				'value',
				'name',
				'legend',
				'onChange',
			],
		},
	},
}

export default meta;

type Story = StoryObj<typeof RadioButtonGroup>;

export const Default: Story = {
	name: "RadioButtonGroup Uncontrolled",
	args: {
		disabled: false,
		uncheckWhenDisabled: false,
		name: "RadioButtonGroupStory",
		legend: "Choose between option 1 and 2"
	},
	render: (args) => (
        <RadioButtonGroup {...args} onChange={action('changed')}>
            <RadioButton value="option1" label="Option 1"/>
            <RadioButton value="option2" label="Option 2"/>
        </RadioButtonGroup>
    ),
};