react-input-date

Made with create-react-library

Usage no npm install needed!

<script type="module">
  import reactInputDate from 'https://cdn.skypack.dev/react-input-date';
</script>

README

react-input-date

NPM JavaScript Style Guide

A simple input to enter dates. Inspired on Typeform input and trying to follow the flexibility and the philosophy of React-select.

Install

npm install --save react-input-date

or

yarn add react-input-date

Usage

import React, { Component } from 'react'

import DateInput from 'react-input-date'

class Example extends Component {
  state = {
    date: '12-02-2020'
  }
  handleChange = (newDate) => {
    this.setState({ date: newDate })
  }

  render() {
    const { date } = this.state
    return (
      <DateInput
        date={date}
        format='DDMMYYYY'
        separator='-'
        onChange={handleChange}
      />
    )
  }
}

With React Hooks

import React, { useState } from 'react'

import DateInput from 'react-input-date'

const Example = () => {
  const [date, setDate] = useState('12-02-2020')

  return (
    <DateInput date={date} format='DDMMYYYY' separator='-' onChange={setDate} />
  )
}

Props

Common props yoy want to specify

  • date
  • format
  • separator
  • onChange

License

MIT © ramirobg94

Made with create-react-library