import { Meta, Story, ArgsTable, Canvas } from '@storybook/addon-docs/blocks';
import { RadioButton } from './radio-button.component';
import { FlowPropsTable, ExternalReferenceLink } from '../../../utils';

<Meta title="RadioButton" component={RadioButton} />

# Radio Button

RadioButton creates a basic RadioOption with some text.

It accepts:

- text (string)
- selected (optional)
- onClick function

## Stories

### Interactive Demo

<Canvas withToolbar>
  <Story id="forms-radiobutton--demo" />
</Canvas>

## Supported Layout Props

Spacing:

<Canvas withToolbar>
  <Story id="forms-radiobutton--mixins-spacing" />
</Canvas>

Stackee:

<Canvas withToolbar>
  <Story id="forms-radiobutton--mixins-stackee" />
</Canvas>

## Props

<FlowPropsTable ofComponent={RadioButton} />

## External Reference

<ExternalReferenceLink
  src="https://www.figma.com/file/r5zKXblbSt0b869OEcOWXu/Patchwork-Web?node-id=637%3A66"
  type="figma"
/>
<ExternalReferenceLink
  src="https://github.com/wealthsimple/patchwork/tree/master/core/forms/radio-button"
  type="github"
/>
