Awesome
📅 Preact Flatpickr
Flatpickr component for Preact ported from react-flatpickr.
Getting Started
Install the package by running:
npm install --save preact-flatpickr
or yarn add preact-flatpickr
Example
import 'flatpickr/dist/themes/material_green.css'
import { Component, h } from 'preact'
import Flatpickr from 'preact-flatpickr'
class App extends Component {
constructor() {
super();
this.state = {
date: new Date()
};
}
render(props, state) {
return (
<Flatpickr
value={state.date}
onChange={date => { this.setState({date}) }} />
)
}
}
flatpickr options
: you can pass allflatpickr parameters
toprops.options
- All flatpickr hooks can be passed as a JSX prop, or to
props.options
<Flatpickr options={{minDate: '2017-01-01'}} />
Themes
You can import the style for flatpickr manually, like so: import 'flatpickr/dist/themes/theme.css'
or you can use the theme
attribute:
<Flatpickr
theme="material_green"
value={date}
onChange={date => { this.setState({date}) }} />
Learn more about the themes here.
API
Every Flatpickr configuration option is available. You can check out every option here.
License
- MIT
I'm new to Preact, so don't bite my head off. 😊