<script module lang="ts">
	import { defineMeta } from "@storybook/addon-svelte-csf";
	import Radio from "./Radio.svelte";

	const { Story } = defineMeta({
		title: "UI/Radio",
		component: Radio,
		tags: ["autodocs"],
		argTypes: {
			value: { control: "text" },
			group: { control: "text" },
			disabled: { control: "boolean" }
		},
		args: {
			value: "a",
			group: "b",
			disabled: false
		}
	});
</script>

<!-- Radio content comes through its `children` snippet, provided here as Story slot content. -->
<Story name="Default">Option</Story>
<Story name="Checked" args={{ group: "a" }}>Option</Story>
<Story name="Disabled" args={{ disabled: true }}>Option</Story>
<Story name="Disabled checked" args={{ group: "a", disabled: true }}>Option</Story>

<Story name="Group">
	<div class="flex items-center gap-4">
		<Radio value="a" group="a">Option</Radio>
		<Radio value="b" group="a">Option</Radio>
		<Radio value="c" group="a" disabled>Option</Radio>
	</div>
</Story>
