react-accessible-datepicker

An accessible calendar for React that can be used as a date picker, based off the W3 date picker demo

Usage no npm install needed!

<script type="module">
  import reactAccessibleDatepicker from 'https://cdn.skypack.dev/react-accessible-datepicker';
</script>

README

react-accessible-datepicker

An accessible calendar for React that can be used as a date picker

Uses https://www.w3.org/TR/wai-aria-practices/examples/dialog-modal/datepicker-dialog.html as reference

NPM JavaScript Style Guide

Install

npm install --save react-accessible-datepicker

Usage

import React, { Component } from 'react'

import Calendar from 'react-accessible-datepicker'
import 'react-accessible-datepicker/dist/index.css'

const Example = () => {
  return <Calendar selectedDate='1990-09-11' />
}

export default Example

Props

Prop Description Type Default
selectedDate The date selected on initial load String (YYYY-MM-DD) Defaults to todays date
onDayClick Run additional code on day click Function that passes String of YYYY-MM-DD
onNextMonthClick Run code on next month click Function that passes String of YYYY-MM-DD
onPreviousMonthClick Run code on prev month click Function that passes String of YYYY-MM-DD
onNextYearClick Run additional code on next year click Function that passes String of YYYY-MM-DD
onPreviousYearClick Run additional code on prev year click Function that passes String of YYYY-MM-DD

License

MIT © cjwiseman11