# up-material-ui-next-datepicker

> Datepicker for material-ui next with i18n

Latest version **1.0.6** (published 2018-03-29) · ISC license · 0 weekly downloads

## Install

```sh
npm install up-material-ui-next-datepicker
pnpm add up-material-ui-next-datepicker
yarn add up-material-ui-next-datepicker
bun add up-material-ui-next-datepicker
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities; high quality score.

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.6 |
| Published | 2018-03-29 |
| First published | 2018-03-29 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 11 |
| Unpacked size | 2.4 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Ching Yaw Hao |
| Maintainers | hesquibet |

## Links

- npm: https://www.npmjs.com/package/up-material-ui-next-datepicker
- npm.io page: https://npm.io/package/up-material-ui-next-datepicker

## Dependencies (11)

- [react](https://npm.io/package/react.md) ^16.2.0
- [react-dom](https://npm.io/package/react-dom.md) ^16.2.0
- [classnames](https://npm.io/package/classnames.md) ^2.2.5
- [typescript](https://npm.io/package/typescript.md) ^2.7.2
- [material-ui](https://npm.io/package/material-ui.md) ^1.0.0-beta.35
- [react-popper](https://npm.io/package/react-popper.md) ^0.8.2
- [react-travel](https://npm.io/package/react-travel.md) ^1.3.5
- [material-ui-icons](https://npm.io/package/material-ui-icons.md) ^1.0.0-beta.35
- [react-swipeable-views](https://npm.io/package/react-swipeable-views.md) ^0.12.13
- [react-transition-group](https://npm.io/package/react-transition-group.md) ^2.2.1
- [react-swipeable-views-utils](https://npm.io/package/react-swipeable-views-utils.md) ^0.12.13

## Recent versions

- 1.0.6 (latest) — 2018-03-29

## README

# Material UI Next Datepicker
## Description
This repository act as a sample of creating a datepicker in [Material UI Next](https://material-ui-next.com/) or it can be imported as a datepicker component.

## Prerequisite
```
npm install material-ui-next-datepicker --save
```

## Screenshot
![Image of Material UI Clockpicker](https://github.com/chingyawhao/material-ui-next-datepicker/blob/master/image/datepicker.png)

## Options
```
name: string
value: Date
onChange: (value:Date) => void
label?: string
error?: string
min?: Date
max?: Date
fullWidth?: boolean
```

## Basic setup
1. Make sure you installed [Material UI Next](https://material-ui-next.com/).
2. Install this package via npm.
3. Import this package and use like the following: 
```tsx
import DateFormatInput from 'material-ui-next-datepicker'

class YourComponent extends React.Component<{}, YourComponentState> {
  onChange = (date:Date) => {
    console.log(date)
    this.setState({date})
  } 
  render() {
    const {date} = this.state
    return (
      <div>
        <DateFormatInput name='date-input' value={date} onChange={this.onChange}/>
      </div>
    )
  } 
}
interface YourComponentState {
  date: Date
}
```

---
_Source: https://npm.io/package/up-material-ui-next-datepicker · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._