JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 7
  • Score
    100M100P100Q45573F
  • License MIT

React.js component for entering a period of stay in a hotel: check-in + check-out date

Package Exports

  • react-period-of-stay-input

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-period-of-stay-input) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Build Status

About

React.js component for entering a period of stay in a hotel: check-in day and check-out day. See the demo. In case when a native <input type="date"> implementation is not available, it's "polyfilled" with a jQuery UI datepicker (English only).

Installation

Made for Browserify.

npm install --save react-period-of-stay-input

Usage

See the code of the demo mentioned above. The polyfilling part is visible here.

Internationalization

react-intl-based. To translate the component, please pass the messages property, containing:

{
    'react-period-of-stay-input': {
        period: '{count, plural, =0 {Single day} =1 {1 night} other {# nights}}',
        checkInDay: 'Check-in day',
        checkOutDay: 'Check-out day'
    }
}

react-intl allows using react-period-of-stay-input uniformly in bigger applications, and passing all the namespaced translations, from the root, down the React components hierarchy, -- automatically, with the help of IntlMixin.

Please note, that react-intl depends on global Intl object. You can polyfill it with intl package:

if (!global.Intl) {
    require('intl');
}