0.1.3 • Published 3 years ago

react-date-painter v0.1.3

Weekly downloads
-
License
MIT
Repository
github
Last release
3 years ago

react-date-painter

Date Paint Picker for React.

Demo - chromatic

Installation

yarn add react-date-painter
or
npm install react-date-painter

Usage

// When using DatePainter
import { DatePainter } from 'react-date-painter'
<DatePainter selectedDates={[]} />
// When using DatePainterPicker
import { DatePainter, DatePainterPicker } from 'react-date-painter'
<DatePainterPicker>
  <DatePainter selectedDates={[]} />
</DatePainterPicker>

Example

import { useState, useCallback } from 'react'
import { DatePainter } from 'react-date-painter'

const App = () => {
  const [state, setState] = useState([])

  return (
    <DatePainter
      selectedDates={state}
      handleSelectDates={useCallback((dates: Date[]) => {
        setSelectedDates(dates)
      }, [])}
    />
  )
}

Props

NameRequiredTypeDefaultDescription
format-LiteralMMMM YYYYCalendar Header format. You can select day.js format.
selectedDatesYesArray-The day you choose. Type is a Date Array.
uniqueHoliday-Array[]Your own holiday. Formats that can be added are 'YYYY-MM-DD'.
targetId-string-Only when using DatePainterPicker. Position to display datepicker. If there is no targetId, start from document.body.
handleSelectDates-(date: Date[]) => void-This function fired when date is selected or reselected.

License

react-date-painter is available under the MIT License.