import { Meta, Story, Props, Preview } from '@storybook/addon-docs/blocks';
import { SecondaryButton } from './secondary-button.component';
import { FlowPropsTable, ExternalReferenceLink } from '../../../utils';

<Meta title="Buttons/Secondary" component={SecondaryButton} />

# Secondary Button

The SecondaryButton component renders a button that looks like a link.

The SecondaryButton component either renders a button element or a link element based on if an onClick or url respectively was provided.

## As Button

<Preview withToolbar>
  <Story id="buttons-secondary--default" />
</Preview>

## As Link

<Preview withToolbar>
  <Story id="buttons-secondary--as-link" />
</Preview>

## Disabled

<Preview withToolbar>
  <Story id="buttons-secondary--disabled" />
</Preview>

## Props

<FlowPropsTable ofComponent={SecondaryButton} />

## External Reference

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