@thilan-tran/qss

Quicksilver

Quicksilver is a minimal library of material design inspired React components for common, medium-complexity UI elements such as date pickers, time pickers, dropdowns, and other inputs (with more componetns coming in the future!).

As of v1, the DatePicker, TimePicker, and DatetimePicker components are supported.

The library is very lightweight at under 50kb zipped, with no external libraries besides React and ReactDOM.

Installation

$ npm install @thilan-tran/quicksilver

Usage

import { DatePicker, TimePicker, DatetimePicker } from '@thilan-tran/quicksilver';

As of v1, the following time and datepicker components are supported by the library:

• TimePicker, DatePicker, and DatetimePicker.

Each support the following props:

• value: Date object or ISO timestamp - Default value of the picker. If this value is changed, the picker will update accordingly as well.
• onChange: (val) => {} - Function that is called whenever the date or time is changed. val is a JS Date object. For the DatetimePicker, all the fields are up to date, and seconds and milliseconds are zeroed out. For the DatePicker, hours, minutes, seconds, and milliseconds are zeroed out. For the TimePicker, the current date of the object is set to the current day.
• disabled: boolean - Disable the picker.