DatePicker

Allows the user to select a date from a list of months, ideal for creating a pay run.

Not ideal for scenarios where the user would have to scroll a long way from current date (i.e. birthdays).

<DatePicker
  label="Date of payrun"
  title="Select a pay date"
  value="2019-06-09"
  onChange={val => setDate(val)}
/>

Props

format

"dateString" │ "ISO"

"dateString"

disableFutureDates

bool

false

futureScrollRange

number

undefined

isDisabled

bool

label

string

minDate

string

undefined

maxDate

string

undefined

onChange

func

pastScrollRange

number

undefined

placeholder

string

"Choose a date..."

style

object

title

string

testID

string

value

string

current

string

DatePickerWithValidation

Use this as a child of the <Form/> component. Form takes care of the value and onChange prop, so these are not required.

<Form>
  {form => (
    <DatePickerWithValidation
      label="Date of payrun"
      name="dateOfPayrun"
      title="Select a pay date"
      form={form}
    />
  )}
</Form>

format

"dateString" │ "ISO"

defaultValue

string

form

object

required

isRequired

bool

isDisabled

bool

label

string

required

minDate

string

undefined

maxDate

string

undefined

name

string

required

onChange

func

onKeyPress

func

validationMethods

array