<div align="center">
  <h1>Tommy's inclusive datepicker</h1>

  <p>
    <video controls autoplay>
      <source src="https://github.com/fymmot/inclusive-dates/blob/main/docs/images/demo.mp4" type="video/mp4">
      Your browser does not support the video tag.
    </video>
  </p>
  
  <p><strong>A human-friendly and fully accessible datepicker with support for natural language input. </strong>Now as a standard Web Component written in Typescript!</p>
<p>Try typing "tomorrow" or "in 10 days"!</p>

  <p>Calendar is forked from the excellent <a href="https://github.com/Sqrrl/wc-datepicker"><code>sqrrl/wc-datepicker</code></a></p>
  
  <div>
    <img alt="Github test action status" src="https://github.com/fymmot/inclusive-dates/actions/workflows/test.yml/badge.svg" />
    <!-- <img alt="Github publish action status" src="https://github.com/inclusive-dates-v2/actions/workflows/publish.yml/badge.svg" /> -->
    <img alt="Github docs action status" src="https://github.com/fymmot/inclusive-dates/actions/workflows/docs.yml/badge.svg" />
    <img alt="NPM version" src="https://img.shields.io/npm/v/inclusive-dates?color=informational">
  </div>
</div>

## Features

### 🧏‍ Natural language input

Text field accepts natural language input using Chrono.js. Try typing "yesterday", "May tenth" or "in one year"!.

### 🧏‍ Accessibility first

Built to support users of assistive technology. Follows the WAI-ARIA APG Datepicker dialog pattern.

### 🖼 Framework-agnostic

Standard Web Component that works with any framework – or no framework at all.

### 🦶 Small footprint

The component is ~45KB minified and gzipped with Chrono.js. If you do not need language parsing, the original sqrrl/wc-datepicker calendar is ~4KB.

### 🪁 Low dependency

External dependencies limited to accessibility utils (@react-aria/live-announcer, @a11y/focus-trap and aria-hidden).

### 💪 Strongly typed

Written in TypeScript.

### 🇪🇺 Localizable

Customizable labels and date formats.

### 🌈 Customizable

Semantic markup with no built-in styles.

### 🧪 Well tested

Quality assured by means of unit tests.


## Documentation & Demo

**https://fymmot.github.io/inclusive-dates/**
