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

<Meta
  title="Components/Actions/Text Button With Icon"
  component={TextButtonWithIcon}
/>

# Text Button with Icon

The Text Button with Icon component renders an anchor tag with an Icon on the left or right side.

Unlike other button components in patchwork, it does not support an `onClick` event.

## Variants

<Canvas>
  <Story id="components-actions-text-button-with-icon--left-icon" />
  <Story id="components-actions-text-button-with-icon--right-icon" />
  <Story id="components-actions-text-button-with-icon--right-icon-with-on-click" />
</Canvas>

## Supported Property Mixins:

Spacing:

<Canvas>
  <Story id="components-actions-text-button-with-icon--mixins-spacing" />
</Canvas>

## Props

<FlowPropsTable ofComponent={TextButtonWithIcon} />

## 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/text-button-with-icon"
  type="github"
/>
