@navinc/base-react-components/src/date-picker.story.js

Nav's Pattern Library

import React from 'react'
import withPropsCombinations from 'react-storybook-addon-props-combinations'
import { DatePicker } from './date-picker.js'
import readme from './date-picker.readme.md'

export default {
  title: 'Form Elements/DatePicker',
  component: DatePicker,
  parameters: {
    info: { text: readme },
  },
}

export const Basic = (args) => <DatePicker {...args} />

Basic.argTypes = {
  fieldsToShow: {
    control: { type: 'check' },
    options: ['year', 'month', 'day'],
  },
}
Basic.args = {
  label: 'DatePicker some text',
  value: {
    day: 25,
    month: 12,
    year: 2020,
  },
  hasSpaceForErrors: true,
  isInvalid: false,
  errors: [],
  fieldsToShow: ['year', 'month', 'day'],
}

export const Variations = withPropsCombinations(DatePicker, {
  label: ['businessStartDate'],
  value: [
    {
      day: 25,
      month: 12,
      year: 1950,
    },
  ],
  hasSpaceForErrors: [false, true],
  isInvalid: [false, true],
  errors: [[], ['An error'], ['One error', 'Two Errors']],
  fieldsToShow: [undefined, ['year', 'month'], ['day', 'year'], ['month']],
})

Variations.parameters = {
  info: { disable: true },
}