@blaze-react/date-time-input v0.7.0

Description

Datepicker tools that wraps react-datepicker.

Note about importing

This component requires its consumers to manually import the third-party library's CSS

import "react-datepicker/dist/react-datepicker.css";

Usage

• Required

<DateTimeInput
  label="Date Time input required"
  onChange={({ event, value }) => {}}
  type="dateTime"
  modifier="full-width"
  validationMessage="Date Time is required"
  error
  required
/>

• Disabled

<DateTimeInput
  label="Date Time input disabled"
  onChange={({ event, value }) => {}}
  type="dateTime"
  modifier="full-width"
  validationMessage="Date Time is disabled"
  error
  disabled
/>

• Pick only date

<DateTimeInput
  label="Date input"
  onChange={({ event, value }) => {}}
  type="date"
  modifier="full-width"
/>

• Pick only time

<DateTimeInput
  label="Date input"
  onChange={({ event, value }) => {}}
  type="time"
  modifier="full-width"
/>

API

DateTimeInput can receive a number of props as follow:

onChange events

The raw onChange events are inconsistent from the underlying component and when using the today button so the component makes sure to set the the following props on an event.target

• name: uses the component id prop
• value: the date from the event