@navinc/base-react-components/src/checkbox.story.js

Nav's Pattern Library

import { Checkbox } from './checkbox.js'
import readme from './checkbox.readme.md'
import { Copy } from './copy.js'
import { StandardCard } from './standard-card.js'

export default {
  title: 'Form Elements/Checkbox',
  component: Checkbox,
  parameters: {
    readme: { content: readme },
  },
}

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

Basic.argTypes = {
  size: {
    type: 'select',
    options: ['sm', 'md'],
  },
}
Basic.args = {
  checkedBackgroundColor: '',
  label: 'pick me',
  checked: false,
  disabled: false,
  isInvalid: false,
  errors: [],
  hasBorder: false,
  hasSpaceForErrors: false,
  size: 'md',
}