Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/anubra266/choc-datetimepicker

Datepicker component for chakra ui
https://github.com/anubra266/choc-datetimepicker

chakra-ui datepicker datepicker-component react vitejs

Last synced: 3 months ago
JSON representation

Datepicker component for chakra ui

Awesome Lists containing this project

README

        




📅


choc-datetimepicker











npm package


npm  downloads


NPM

GitHub Repo stars

[![All Contributors](https://img.shields.io/badge/all_contributors-1-orange.svg?style=flat-square)](#contributors-)




DateTimePicker Component for the Chakra UI Library.










npm i choc-datetimepicker











## Introduction

This is a Date and Time picker package for Chakra UI. It aims to provide a very composable API that gives you full control of the rendering of every component in your picker, from the container to arrows to each date.
You decide where they render and how they look, no `buttonStyles`, `activeDateStyles`... You decide if you even want it to be a button is the first place, all while still getting all the features a date picker should offer and in the locale of your choice.

In short; _you're the boss_.

## Install

```bash
npm i --save choc-datetimepicker
#or
yarn add choc-datetimepicker
```

## Add react Icons(optional if you're not using our default Buttons)

```bash
npm i --save react-icons
#or
yarn add react-icons
```

## Preview


CleanShot 2022-01-16 at 15 57 37@2x
CleanShot 2022-01-16 at 15 57 47@2x

CleanShot 2022-01-23 at 13 57 49@2x


### Docs in Progress...

## Upcoming features

- Multi date selection
- Time Picker

## Contribute

- Clone this repository

```sh
git clone https://github.com/anubra266/choc-datetimepicker.git
```

- Install all dependencies (with yarn)

```sh
yarn
```

- Install package example dependencies (with yarn)

```sh
cd example
yarn
```

Start the package server, and the example server

```sh
# root directory
yarn start

# example directory with (cd example)
yarn dev
```
## Sponsors ✨

Thanks goes to these wonderful people





## Contributors ✨

Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):



Abraham

💻

This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!