import { Meta, Story, Preview } from '@storybook/addon-docs/blocks';
import { Switch } from './';

<Meta title="Components/Switch" component={Switch} />

# Switch

The `<Switch/>` component.

## Import

```js
import { Switch } from '@firstclasspostcodes/sw14';
// or
import { Switch } from '@firstclasspostcodes/sw14/lib/components/Switch';
```

<Preview>
  <Story name="Default">
    <Switch id="default" name="default" label="Send email" description="Triggers an email when it happens."/>
  </Story>
</Preview>

<Preview>
  <Story name="Radio Group">
    <>
      <Switch type="radio" id="eggs" color="brand" name="colored" label="I like eggs" />
      <Switch type="radio" id="pizza" invalid checked name="colored" label="I like pizza" />
      <Switch type="radio" id="apples" name="colored" label="I like apples" description="Especially red juicy apples" />
    </>
  </Story>
</Preview>

<Preview>
  <Story name="Invalid">
    <Switch id="invalid" name="invalid" invalid label="Send email"/>
  </Story>
</Preview>

<Preview>
  <Story name="Disabled">
    <Switch id="disabled" name="disabled" disabled label="Send email" description="Triggers an email when it happens."/>
  </Story>
</Preview>





