react-widgets-dates
Version:
A date-fns localizer for react-widgets
66 lines (39 loc) • 2.42 kB
Markdown
# react-widgets-dates *0.0.5*
> A date-fns localizer for react-widgets
### index.js
#### dateFnsLocalizer(formats)
Configures localization of [react-widgets](http://jquense.github.io/react-widgets/) by calling `configure.setDateLocalizer`
##### Parameters
| Name | Type | Description | |
| ---- | ---- | ----------- | -------- |
| formats | `Object` | Confguration options. | |
| formats.default | `string` `Object` `function` | the default date display format, generally a "long" format showing both date and time | |
| formats.date | `string` `Object` `function` | A date only format | |
| formats.time | `string` `Object` `function` | A time only format | |
| formats.header | `string` `Object` `function` | The heading of the Calendar month view, contextualizes the current month, e.g. "Jan 2014" | |
| formats.footer | `string` `Object` `function` | The Calendar footer format, for displaying Today's date | |
| formats.dayOfMonth | `string` `Object` `function` | The day of the month | |
| formats.month | `string` `Object` `function` | Month name, used in the Year view of the Calendar | |
| formats.year | `string` `Object` `function` | year format, used in the Decade view of the Calendar | |
| formats.decade | `string` `Object` `function` | a decade format, used in the Century view of the Calendar, eg. "2010 - 2019" | |
| formats.century | `string` `Object` `function` | A century format, used the in the Calendar heading | |
| locales | `Object` | Supported date-fns locales to include in the bundle | |
##### Examples
```javascript
import dateFnsLocalizer, { defaultFormats } from 'react-widgets-dates'
dateFnsLocalizer()
// => Works out of the box with default formats (defaultFormats) and the `en-US` locale
const newFormats = Object.assign(defaultFormats, { default: 'mmm YY' })
dateFnsLocalizer({ formats: newFormats })
// => Uses new configuration
import locales from 'date-fns/locale'
dateFnsLocalizer({ formats: newFormats, locales })
// => Includes all available locales
import enGB from 'date-fns/locale/en-GB'
import de from 'date-fns/locale/de'
dateFnsLocalizer({ locales: { 'en-GB': enGB, 'de': de } })
// => Include only the locales you need to limit the bundled size
```
##### Returns
- `Void`
*Documentation generated with [doxdox](https://github.com/neogeek/doxdox).*