@navinc/base-react-components/src/callout-link.story.js

Nav's Pattern Library

import { CalloutLink } from './callout-link.js'
import { StandardCard } from './standard-card.js'
import { Copy } from './copy.js'

export default {
  title: 'General/CalloutLink',
  component: CalloutLink,
}

export const Basic = (args) => {
  return (
    <>
      <Copy>No Card</Copy>
      <CalloutLink {...args} />
      <br />
      <Copy>In Card</Copy>
      <StandardCard>
        <CalloutLink {...args} />
      </StandardCard>
    </>
  )
}

Basic.argTypes = {
  variation: {
    type: 'select',
    options: ['improve', 'positive', 'negative', 'neutral', 'information'],
  },
}
Basic.args = {
  iconName: 'financing/cash',
  copy: 'Here for PPP funding',
  linkCopy: 'Apply here',
  linkAction: 'yourFunction()',
  variation: 'neutral',
}