sassy-datepicker
TypeScript icon, indicating that this package has built-in type declarations

0.10.2 • Public • Published

sassy-datepicker

npm version CI Status Maintenance Status Bundle Size: Minified + Gzipped GitHub Issues: Chat With Us PRs Welcome

Beautiful, minimal, customizable and accessible date-picker and time-picker for react.

Sassy DatePicker Snapshot

Why use sassy-datepicker?

  • Beautiful picker
  • Smooth and slick transitions
  • Simple and Easy to Use
  • Fully Customizable
  • First Class Accessibility
  • Small bundle size
  • Extremely Performant

Contents

Installation and Usage

Package Installation

yarn add sassy-datepicker
# or
npm install sassy-datepicker

Basic Usage

The default export from the library is the DatePicker component.

import { useState } from 'react';
import DatePicker, { TimePicker } from 'sassy-datepicker';
import 'sassy-datepicker/dist/styles.css';

function DateInput() {
  const [date, setDate] = useState(new Date());

  const onChange = newDate => {
    console.log(`New date selected - ${newDate.toString()}`);
    setDate(newDate);
  };

  return <DatePicker onChange={onChange} value={date} />;
}

function TimeInput() {
  const [time, setTime] = useState({ hours: 15, minutes: 30 });

  const onChange = newTime => {
    console.log(`New time selected - ${newTime}`);
    setTime(newTime);
  };

  return <TimePicker onChange={onChange} value={time} />;
}

Documentation

To view detailed documentation, go to https://sassy-datepicker.siddharthborderwala.com

Powered By

Package Sidebar

Install

npm i sassy-datepicker

Weekly Downloads

926

Version

0.10.2

License

MIT

Unpacked Size

477 kB

Total Files

65

Last publish

Collaborators

  • sidborderwala