{"_id":"@alcacoop/react-datepicker","_rev":"1-1bff966f0bcbedcab88d1eb4fcdaa953","name":"@alcacoop/react-datepicker","dist-tags":{"latest":"2.9.6"},"versions":{"2.9.6":{"author":{"name":"HackerOne"},"name":"@alcacoop/react-datepicker","description":"A simple and reusable datepicker component for React","version":"2.9.6","license":"MIT","homepage":"https://github.com/Hacker0x01/react-datepicker","main":"lib/index.js","browser":"dist/react-datepicker.min.js","module":"es/index.js","unpkg":"dist/react-datepicker.min.js","style":"dist/react-datepicker.min.css","keywords":["react","datepicker","calendar","date","react-component"],"repository":{"type":"git","url":"git://github.com/Hacker0x01/react-datepicker.git"},"bugs":{"url":"https://github.com/Hacker0x01/react-datepicker/issues"},"devDependencies":{"@babel/core":"^7.5.5","@babel/helpers":"^7.5.5","@babel/plugin-external-helpers":"^7.2.0","@babel/plugin-proposal-class-properties":"^7.5.5","@babel/preset-env":"^7.5.5","@babel/preset-flow":"^7.0.0","@babel/preset-react":"^7.0.0","babel-eslint":"^10.0.3","babel-loader":"^8.0.6","babel-plugin-external-helpers":"^6.22.0","babel-plugin-react-transform":"^3.0.0","babel-plugin-transform-react-remove-prop-types":"^0.4.24","babel-preset-airbnb":"^4.0.1","chai":"^4.2.0","codecov":"^3.5.0","core-js":"^3.2.1","cross-env":"^5.2.0","css-loader":"^3.2.0","enzyme":"^3.10.0","enzyme-adapter-react-16":"^1.14.0","eslint":"^6.2.2","eslint-plugin-import":"^2.18.2","eslint-plugin-node":"^9.1.0","eslint-plugin-promise":"^4.2.1","eslint-plugin-react":"^7.14.3","express":"^4.17.1","flow-bin":"^0.106.1","highlight.js":"^9.15.10","husky":"^3.0.4","istanbul-instrumenter-loader":"^3.0.1","karma":"^4.2.0","karma-chai":"^0.1.0","karma-coverage":"^2.0.1","karma-firefox-launcher":"^1.2.0","karma-mocha":"^1.3.0","karma-mocha-reporter":"^2.2.5","karma-sinon":"^1.0.5","karma-sourcemap-loader":"^0.3.7","karma-webpack":"^4.0.2","lint-staged":"^9.2.4","mocha":"^6.2.0","node-sass":"^4.12.0","npm-run-all":"^4.1.5","prettier":"^1.18.2","react":"^16.9.0","react-docgen":"^4.1.1","react-dom":"^16.9.0","react-test-renderer":"^16.9.0","react-transform-hmr":"^1.0.4","rollup":"^1.20.2","rollup-plugin-babel":"^4.3.3","rollup-plugin-commonjs":"^10.0.2","rollup-plugin-filesize":"^6.2.0","rollup-plugin-local-resolve":"^1.0.7","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-peer-deps-external":"^2.2.0","rollup-plugin-replace":"^2.2.0","rollup-plugin-terser":"^5.1.1","rollup-plugin-uglify":"^6.0.2","sass-lint":"^1.13.1","sass-loader":"^8.0.0","sinon":"^7.4.1","slugify":"^1.3.4","style-loader":"^1.0.0","webpack":"^4.39.2","webpack-cli":"^3.3.7","webpack-dev-middleware":"^3.7.0","webpack-dev-server":"^3.8.0","webpack-hot-middleware":"^2.25.0"},"peerDependencies":{"react":"^16.9.0","react-dom":"^16.9.0"},"dependencies":{"classnames":"^2.2.6","date-fns":"^2.0.1","prop-types":"^15.7.2","react-onclickoutside":"^6.9.0","react-popper":"^1.3.4"},"scripts":{"eslint":"eslint --ext .js,.jsx src test","flow":"flow","precommit":"lint-staged","sass-lint":"sass-lint --config .sass-lint.yml 'src/stylesheets/*.scss'","lint":"run-p eslint flow sass-lint","start":"yarn --cwd docs-site install && yarn --cwd docs-site start","test":"cross-env NODE_ENV=test karma start karma.conf.js --single-run","test:watch":"cross-env NODE_ENV=test karma start karma.conf.js --watch","build":"cross-env NODE_ENV=production run-p build:** && run-p css:**","build-dev":"cross-env NODE_ENV=development run-p build:** && run-p css:**","css:prod":"node-sass --output-style compressed src/stylesheets/datepicker.scss > dist/react-datepicker.min.css","css:modules:prod":"node-sass --output-style compressed src/stylesheets/datepicker-cssmodules.scss > dist/react-datepicker-cssmodules.min.css","css:dev":"node-sass --output-style expanded src/stylesheets/datepicker.scss > dist/react-datepicker.css","css:modules:dev":"node-sass --output-style expanded src/stylesheets/datepicker-cssmodules.scss > dist/react-datepicker-cssmodules.css","build:js":"rollup -c"},"lint-staged":{"*.{js,jsx,json,css,scss,md}":["prettier --write","git add"]},"gitHead":"e1b956b5c1d9f3f2e98ec7811f10c437924d12c0","_id":"@alcacoop/react-datepicker@2.9.6","_nodeVersion":"10.16.3","_npmVersion":"6.11.3","dist":{"integrity":"sha512-3uuLAA4FQDdhwt+QuIiM+oCfrh9L58KvDTE49mX0HynI1r7QRShN9/vD7su8JYePw4mEL3BqPWaIHVpLB5a15A==","shasum":"15fb1bf0be846d111379004a0dacadc8d5602f31","tarball":"https://registry.npmjs.org/@alcacoop/react-datepicker/-/react-datepicker-2.9.6.tgz","fileCount":18,"unpackedSize":646322,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdelHHCRA9TVsSAnZWagAAlXYQAJ7CjD/fJ9gK5e76WHmY\nLSYgxLHzA6dOfFY8GORXMgemFLCQCh1h/8zZ0BGFlkEGnVGNoewG01RAzmkF\n7DlPsIcGtuciS3zcGbQYdgTq3lv4Ffv0rASO2O3IGyOgoPPNJVQ3DmOONAUf\nrniDmTihKNIRLDvl6OtJOrQCgZ0s8WY2wyIHYw2rawVuxvMJTaGpcZppxnqY\nZ41sCRRCHPIh2XcB0hTIj9lsDclrbPilZ2XCM5pf2CdTpzfsPr1NLqiytrfm\nb1Z38aEwDRWCKsolHmZl8qmaJ9Hstto0L+FeGINPRucAaH8XRRCAtuNeynlS\nQTfc7XnrcAioKkDH8LxUGJSzhctHIIH7xm0IWTGcQOIM80wuYlhbEHgIqCy2\nYwjZi3tENCMhAaNur/ufeZKfIbPlT3vhoLcZhochy1HsK/k0S+pMdFlKAC7r\nBta+ALF46+FhhyYqHhZoO/xNmv8g2xlxKP5mrZvk72kgS1i2JmgMDKAa8PFD\nmjwQaMZtLFu1UkCXQsDI8pW9xw5pwaNQ0EztonUMvAYWPA/cOxzZyyE9RRNB\nlQrWPks5G1lIn3KmBCZ9A8MY8B7Js/AHe962Kg3FBkO6ig42N0Sf/AUJU0e0\n8YMOjkjhpwRSMWEGYieYSSE+OV01k1RlAcyUdUTJ/ru+2F9P76/8tllRq3An\nko7J\r\n=eQNw\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAUOrayqiv2nzqQX7zs47GTFD8XL1KtHsqtcHJ3Ftpz0AiBi36SDzPOazPa1BFnSgWLHQxcKfKVY4+1q2cMUgJZf+g=="}]},"maintainers":[{"name":"alcacoop","email":"info@alcacoop.it"}],"_npmUser":{"name":"alcacoop","email":"info@alcacoop.it"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-datepicker_2.9.6_1568297414921_0.4183251241099779"},"_hasShrinkwrap":false}},"time":{"created":"2019-09-12T14:10:14.695Z","2.9.6":"2019-09-12T14:10:15.047Z","modified":"2022-04-04T12:35:34.986Z"},"maintainers":[{"name":"alcacoop","email":"info@alcacoop.it"}],"description":"A simple and reusable datepicker component for React","homepage":"https://github.com/Hacker0x01/react-datepicker","keywords":["react","datepicker","calendar","date","react-component"],"repository":{"type":"git","url":"git://github.com/Hacker0x01/react-datepicker.git"},"author":{"name":"HackerOne"},"bugs":{"url":"https://github.com/Hacker0x01/react-datepicker/issues"},"license":"MIT","readme":"# React Date Picker\n\n[![npm version](https://badge.fury.io/js/react-datepicker.svg)](https://badge.fury.io/js/react-datepicker)\n[![Build Status](https://travis-ci.org/Hacker0x01/react-datepicker.svg?branch=master)](https://travis-ci.org/Hacker0x01/react-datepicker)\n[![Dependency Status](https://david-dm.org/Hacker0x01/react-datepicker.svg)](https://david-dm.org/Hacker0x01/react-datepicker)\n[![codecov](https://codecov.io/gh/Hacker0x01/react-datepicker/branch/master/graph/badge.svg)](https://codecov.io/gh/Hacker0x01/react-datepicker)\n[![Downloads](https://img.shields.io/npm/dm/react-datepicker.svg)](https://npmjs.org/package/react-datepicker)\n[![Code Quality: Javascript](https://img.shields.io/lgtm/grade/javascript/g/Hacker0x01/react-datepicker.svg?logo=lgtm&logoWidth=18)](https://lgtm.com/projects/g/Hacker0x01/react-datepicker/context:javascript)\n[![Total Alerts](https://img.shields.io/lgtm/alerts/g/Hacker0x01/react-datepicker.svg?logo=lgtm&logoWidth=18)](https://lgtm.com/projects/g/Hacker0x01/react-datepicker/alerts)\n\nA simple and reusable Datepicker component for React ([Demo](https://reactdatepicker.com/))\n\n![](https://cloud.githubusercontent.com/assets/1412392/5339491/c40de124-7ee1-11e4-9f07-9276e2545f27.png)\n\n## Installation\n\nThe package can be installed via NPM:\n\n```\nnpm install react-datepicker --save\n```\n\nOr `yarn`:\n\n```\nyarn add react-datepicker\n```\n\nYou’ll need to install React and PropTypes separately since those dependencies aren’t included in the package. If you need to use a locale other than the default en-US, you'll also need to import that into your project from date-fns (see Localization section below). Below is a simple example of how to use the Datepicker in a React view. You will also need to require the CSS file from this package (or provide your own). The example below shows how to include the CSS from this package if your build system supports requiring CSS files (Webpack is one that does).\n\n```js\nimport React from \"react\";\nimport DatePicker from \"react-datepicker\";\n\nimport \"react-datepicker/dist/react-datepicker.css\";\n\n// CSS Modules, react-datepicker-cssmodules.css\n// import 'react-datepicker/dist/react-datepicker-cssmodules.css';\n\nclass Example extends React.Component {\n  state = {\n    startDate: new Date()\n  };\n\n  handleChange = date => {\n    this.setState({\n      startDate: date\n    });\n  };\n\n  render() {\n    return (\n      <DatePicker\n        selected={this.state.startDate}\n        onChange={this.handleChange}\n      />\n    );\n  }\n}\n```\n\n## Configuration\n\nThe most basic use of the DatePicker can be described with:\n\n```js\n<DatePicker selected={this.state.date} onChange={this.handleChange} />\n```\n\nYou can use `onSelect` event handler which fires each time some calendar date has been selected\n\n```js\n<DatePicker\n  selected={this.state.date}\n  onSelect={this.handleSelect} //when day is clicked\n  onChange={this.handleChange} //only when value has changed\n/>\n```\n\n`onClickOutside` handler may be useful to close datepicker in `inline` mode\n\nSee [here](https://github.com/Hacker0x01/react-datepicker/blob/master/docs/datepicker.md) for a full list of props that may be passed to the component. Examples are given on the [main website](https://hacker0x01.github.io/react-datepicker).\n\n### Time picker\n\nYou can also include a time picker by adding the showTimeSelect prop\n\n```js\n<DatePicker\n  selected={this.state.date}\n  onChange={this.handleChange}\n  showTimeSelect\n  dateFormat=\"Pp\"\n/>\n```\n\nTimes will be displayed at 30-minute intervals by default (default configurable via timeIntervals prop)\n\nMore examples of how to use the time picker are given on the [main website](https://hacker0x01.github.io/react-datepicker)\n\n### Localization\n\nThe date picker relies on [date-fns internationalization](https://date-fns.org/v2.0.0-alpha.18/docs/I18n) to localize its display components. By default, the date picker will use the locale globally set, which is English. Provided are 3 helper methods to set the locale:\n\n- **registerLocale** (string, object): loads an imported locale object from date-fns\n- **setDefaultLocale** (string): sets a registered locale as the default for all datepicker instances\n- **getDefaultLocale**: returns a string showing the currently set default locale\n\n```js\nimport { registerLocale, setDefaultLocale } from  \"react-datepicker\";\nimport es from 'date-fns/locale/es';\nregisterLocale('es', es)\n\n<DatePicker\n  locale=\"es\"\n/>\n```\n\nLocales can be changed in the following way:\n\n- **Globally** - `setDefaultLocale('es');`\n\n## Compatibility\n\n### React\n\nWe're always trying to stay compatible with the latest version of React. We can't support all older versions of React.\n\nLatest compatible versions:\n\n- React 15.5 or newer: All above React-datepicker v.0.40.0\n- React 15.4.1: needs React-datepicker v0.40.0, newer won't work (due to react-onclickoutside dependencies)\n- React 0.14 or newer: All above React-datepicker v0.13.0\n- React 0.13: React-datepicker v0.13.0\n- pre React 0.13: React-datepicker v0.6.2\n\n### Moment.js\n\nUp until version 1.8.0, this package was using Moment.js. Starting v2.0.0, we switched to using `date-fns`, which uses native Date objects, to reduce the size of the package. If you're switching from 1.8.0 to 2.0.0 or higher, please see the updated example above of check out the [examples site](https://reactdatepicker.com) for up to date examples.\n\n### Browser Support\n\nThe date picker is compatible with the latest versions of Chrome, Firefox, and IE10+.\n\nUnfortunately, it is difficult to support legacy browsers while maintaining our ability to develop new features in the future. For IE9 support, it is known that the [classlist polyfill](https://www.npmjs.com/package/classlist-polyfill) is needed, but this may change or break at any point in the future.\n\n## Local Development\n\nThe `master` branch contains the latest version of the Datepicker component.\n\nTo begin local development:\n\n1. `yarn install`\n2. `yarn build-dev`\n3. `yarn start`\n\nThe last step starts documentation app as a simple webserver on http://localhost:3000.\n\nYou can run `yarn test` to execute the test suite and linters. To help you develop the component we’ve set up some tests that cover the basic functionality (can be found in `/tests`). Even though we’re big fans of testing, this only covers a small piece of the component. We highly recommend you add tests when you’re adding new functionality.\n\n### The examples\n\nThe examples are hosted within the docs folder and are ran in the simple app that loads the Datepicker. To extend the examples with a new example, you can simply duplicate one of the existing examples and change the unique properties of your example.\n\n## Accessibility\n\n### Keyboard support\n\n- _Left_: Move to the previous day.\n- _Right_: Move to the next day.\n- _Up_: Move to the previous week.\n- _Down_: Move to the next week.\n- _PgUp_: Move to the previous month.\n- _PgDn_: Move to the next month.\n- _Home_: Move to the previous year.\n- _End_: Move to the next year.\n- _Enter/Esc/Tab_: close the calendar. (Enter & Esc calls preventDefault)\n\n## License\n\nCopyright (c) 2019 HackerOne Inc. and individual contributors. Licensed under MIT license, see [LICENSE](LICENSE) for the full license.\n","readmeFilename":"README.md"}