{"_id":"@daveparslow/react-timeline-range-slider","_rev":"3-cfe8c98be24362048d953fa83c6c5f3e","name":"@daveparslow/react-timeline-range-slider","dist-tags":{"latest":"2.0.2"},"versions":{"2.0.0":{"name":"@daveparslow/react-timeline-range-slider","version":"2.0.0","description":"Time Slider component for React","author":{"name":"Elizaveta Shkodkina","email":"lizashkodkina@gmail.com"},"main":"dist/index.js","license":"MIT","homepage":"https://github.com/lizashkod/react-time-range-slider","repository":{"type":"git","url":"git+https://github.com/lizashkod/react-time-range-slider.git"},"keywords":["react-component","react","slider","component","time-picker","react-slider","range-slider","range"],"peerDependencies":{"react":"^16.13.1","react-dom":"^16.13.1"},"scripts":{"start":"webpack --watch","build":"tsc && ncp src/styles dist/styles","watch":"tsc -w","tsc":"tsc"},"eslintConfig":{"extends":"react-app"},"browserslist":{"production":[">0.2%","not dead","not op_mini all"],"development":["last 1 chrome version","last 1 firefox version","last 1 safari version"]},"dependencies":{"d3-scale":"^3.2.1","date-fns":"^2.14.0","node-sass":"^4.14.1","prop-types":"^15.7.2","react-compound-slider":"^2.5.0"},"devDependencies":{"@types/prop-types":"^15.7.3","@types/react":"^16.9.0","@typescript-eslint/eslint-plugin":"^3.9.0","@typescript-eslint/parser":"^3.9.0","acorn":"^8.0.4","eslint":"^7.6.0","eslint-plugin-import":"^2.20.0","eslint-plugin-prettier":"^3.1.4","eslint-plugin-react":"^7.21.2","eslint-plugin-react-hooks":"^4.2.0-rc.2","ncp":"^2.0.0","prettier":"^2.1.2","react":"^16.13.1","react-dom":"^16.13.1","typescript":"^4.0.2"},"gitHead":"86755b216c8048b9d2a540e99f10db784f7fc219","bugs":{"url":"https://github.com/lizashkod/react-time-range-slider/issues"},"_id":"@daveparslow/react-timeline-range-slider@2.0.0","_nodeVersion":"10.17.0","_npmVersion":"6.11.3","dist":{"integrity":"sha512-002ymloghVyew9eATdYrh7vBKH/aHrq7+vpa/HZgNDRX7uHFXI9ZCd3ivdFMVsYrgodvP/a2uoTSgI3HZiLwUQ==","shasum":"e8e547be7c11588fbd70042d2035648987d6c707","tarball":"https://registry.npmjs.org/@daveparslow/react-timeline-range-slider/-/react-timeline-range-slider-2.0.0.tgz","fileCount":41,"unpackedSize":514345,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfkh0JCRA9TVsSAnZWagAA84kP/2rgZKTo1XywQqfE9ldE\nMo5XKBBxALcbs8H5Yrw8jHn2onEFKmLmnkOhh2jTjJHKB/a9ixsjpFG33nvN\nSyY1bgqlSY2+Wfl7QwCTNVKPB+6kAgcWkxZ0IBg/3DAszlL8bWAQx/mzmBeC\n/EF1fi4OR11BQ/maGqVX8xgBEq8tCnpmcTG8Or0nD0J//FBo7hm7Or//C5lb\n2McVv34kxwBvqXU5PN/uQ20Cg8B6h0f7Ce7s6s5fPuWfrHzbkbNTZHRHQmJa\nc0tWKkHL2bPAgtU5hp4jTUCf+HlcZCWBQ/vWv4A8NVLl1YEZyKSYFBzHcExm\nJL/pZIwpLw9jZoO9khc0qPMrQwYQXN5qjhkA7GIZLMgNxXUy3xU108J+NirT\nC/KdOMRXQGvYp8CXjEGu0OVwE2sAoYSqnxlWSYgzQEIyV/v4JkGvimZ0rPhy\nBTqiJ9SkIKEBWU8vSYexe3AIF47MX2gv3W+DxDezhxN1gX2jM1Qu7rbcR1EW\nEh5ryuG/6Ycenzc36+GtlOTX54drj35T+WOG2pxgUoEUDa9cPTG7y2FK0Beq\nNOn8nPl8REW1GsaM5qG0GxOH7AKbAmXwbZKcjsC6KhIrbhdb3n6ijyqgObTY\noeRxyUfsv7EsdbmWk6ifs+J+6TPpnKvWnLiQ0bWs3K+okHGbiiwwn+qCIlUJ\n2cSy\r\n=0NNm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBlpnCxknWzI206+IPVs7RtLO3lgckhNMd7847Db7DGHAiB1QR4iPTEO8OwFy2D0leGziD3xB5GAqkcCZzQ0VibZvA=="}]},"maintainers":[{"name":"daveparslow","email":"daveparslow@gmail.com"}],"_npmUser":{"name":"daveparslow","email":"daveparslow@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-timeline-range-slider_2.0.0_1603411208974_0.32283102418918297"},"_hasShrinkwrap":false},"2.0.1":{"name":"@daveparslow/react-timeline-range-slider","version":"2.0.1","description":"Time Slider component for React","author":{"name":"Elizaveta Shkodkina","email":"lizashkodkina@gmail.com"},"main":"dist/index.js","license":"MIT","homepage":"https://github.com/lizashkod/react-time-range-slider","repository":{"type":"git","url":"git+https://github.com/lizashkod/react-time-range-slider.git"},"keywords":["react-component","react","slider","component","time-picker","react-slider","range-slider","range"],"peerDependencies":{"react":"^16.13.1","react-dom":"^16.13.1"},"scripts":{"start":"webpack --watch","build":"tsc && ncp src/styles dist/styles","watch":"tsc -w","tsc":"tsc"},"eslintConfig":{"extends":"react-app"},"browserslist":{"production":[">0.2%","not dead","not op_mini all"],"development":["last 1 chrome version","last 1 firefox version","last 1 safari version"]},"dependencies":{"d3-scale":"^3.2.1","date-fns":"^2.14.0","node-sass":"^4.14.1","prop-types":"^15.7.2","react-compound-slider":"^2.5.0"},"devDependencies":{"@types/prop-types":"^15.7.3","@types/react":"^16.9.0","@typescript-eslint/eslint-plugin":"^3.9.0","@typescript-eslint/parser":"^3.9.0","acorn":"^8.0.4","eslint":"^7.6.0","eslint-plugin-import":"^2.20.0","eslint-plugin-prettier":"^3.1.4","eslint-plugin-react":"^7.21.2","eslint-plugin-react-hooks":"^4.2.0-rc.2","ncp":"^2.0.0","prettier":"^2.1.2","react":"^16.13.1","react-dom":"^16.13.1","typescript":"^4.0.2"},"gitHead":"86755b216c8048b9d2a540e99f10db784f7fc219","bugs":{"url":"https://github.com/lizashkod/react-time-range-slider/issues"},"_id":"@daveparslow/react-timeline-range-slider@2.0.1","_nodeVersion":"10.17.0","_npmVersion":"6.11.3","dist":{"integrity":"sha512-AS+e/y7zoCqyzl//5JW6tYDN01dIf6APi6HtD449OcSACl8kmLPrgG1vG+n8qkYwdplNaX/izSW5jdXuiXy3BQ==","shasum":"8290480ac57924ec6324c4abf7614a31f4d97fa5","tarball":"https://registry.npmjs.org/@daveparslow/react-timeline-range-slider/-/react-timeline-range-slider-2.0.1.tgz","fileCount":41,"unpackedSize":514345,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfkiPSCRA9TVsSAnZWagAAJckP/j5GQdo6vAy+DQZRf5Av\n9EiKvYW/XE4nADlreVUnXCsHJi17y7e/x6lbA9CZJXTr/dHlXnYrHDqLYlbj\nbLD0pWfbCH9tBCMIVi6/Dd8WBUYZZ3yAEhHYrLdwGpRI9hzPnStckFsb31IZ\nDASGrtGWoPilg0eaYt53+E6zHHtAufIXdZSkyna9JssFPDScMmou7wDdenxA\nmcXiKcccwjVh+qY52XRMmSVmrYbvyGd/Km0Zw6Rkr1ush8vcKebRVQwppr8w\nGSRBwv1Y0duFAc3NofjGXXe8fmojmhidk0AHCi38lFv2NI0GyJEbJh71gGGn\nLf6iJQdSHtvSV1ZiAq9kv+XGssxVPH+buO9BvZ9pMc+VPigQLb0nQjYkHEQV\nwUfFonRUXQm5wm37KltbnDZDwRl1eX5LtIGB6LYAGhWjN6TPoAUb7xZV3POM\nB0OvdnYzgOyxaoBrhwFEFk938Pk1qrCwzoBARNsfKNIEpIKmy6BILpA9q6iw\nA3Fb/4qYSeyA9SjNr+HlcMmGds/3bd7qwKE9mpGb8HuYXIJBmmWsVYcW6tw4\ntcbUgd3f9A3vLoxERB0R/KjGx3RSEfkao3WXobas4bYsxPGo3wFTcPTzyUFq\nxjOQKXzj03bVNoeqC8DPugS3/oPTnk5lbfoOf4nlnoWYcUz6JZLpm4kHmitu\nTKlw\r\n=StjA\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCvnFCpqjLDeV7sM7Hj+VbvMb4ZAdSJV0ucWrIB2//XegIgbRllLnsOWymTNyc1iF7Cl7xJAIeFBCFGWLZMCsqipOs="}]},"maintainers":[{"name":"daveparslow","email":"daveparslow@gmail.com"}],"_npmUser":{"name":"daveparslow","email":"daveparslow@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-timeline-range-slider_2.0.1_1603412946242_0.40475322221680665"},"_hasShrinkwrap":false},"2.0.2":{"name":"@daveparslow/react-timeline-range-slider","version":"2.0.2","description":"Time Slider component for React","author":{"name":"Elizaveta Shkodkina","email":"lizashkodkina@gmail.com"},"main":"dist/index.js","license":"MIT","homepage":"https://github.com/lizashkod/react-time-range-slider","repository":{"type":"git","url":"git+https://github.com/lizashkod/react-time-range-slider.git"},"keywords":["react-component","react","slider","component","time-picker","react-slider","range-slider","range"],"peerDependencies":{"react":"^16.13.1","react-dom":"^16.13.1"},"scripts":{"start":"webpack --watch","build":"tsc && ncp src/styles dist/styles","watch":"tsc -w","tsc":"tsc"},"eslintConfig":{"extends":"react-app"},"browserslist":{"production":[">0.2%","not dead","not op_mini all"],"development":["last 1 chrome version","last 1 firefox version","last 1 safari version"]},"dependencies":{"d3-scale":"^3.2.1","date-fns":"^2.14.0","node-sass":"^4.14.1","prop-types":"^15.7.2","react-compound-slider":"^2.5.0"},"devDependencies":{"@types/prop-types":"^15.7.3","@types/react":"^16.9.0","@typescript-eslint/eslint-plugin":"^3.9.0","@typescript-eslint/parser":"^3.9.0","acorn":"^8.0.4","eslint":"^7.6.0","eslint-plugin-import":"^2.20.0","eslint-plugin-prettier":"^3.1.4","eslint-plugin-react":"^7.21.2","eslint-plugin-react-hooks":"^4.2.0-rc.2","ncp":"^2.0.0","prettier":"^2.1.2","react":"^16.13.1","react-dom":"^16.13.1","typescript":"^4.0.2"},"gitHead":"7a50cdd4af9502ab8da6f7a0660788ed1a6025ab","bugs":{"url":"https://github.com/lizashkod/react-time-range-slider/issues"},"_id":"@daveparslow/react-timeline-range-slider@2.0.2","_nodeVersion":"10.17.0","_npmVersion":"6.11.3","dist":{"integrity":"sha512-HF+S7bIEmZDBc4/LerjM1KO40YELvQwzH/KpyjT2gkykJYDI2IMRCWIeX6OXm/k/8H+NNR3dlj3sHri/5og0Zg==","shasum":"dd3b1f38dd8e4f1fd6377abefc6942d24f13cb9a","tarball":"https://registry.npmjs.org/@daveparslow/react-timeline-range-slider/-/react-timeline-range-slider-2.0.2.tgz","fileCount":45,"unpackedSize":529950,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfmJF4CRA9TVsSAnZWagAAqxUP/2YDww0H1i2fAhN+EbL+\nYNXCZZLu9dzLSEmMR9GADLN8T/SYfGCqR15g1Zq/+8vf32gNvs0O0oQTSwh8\nAxCWbeP7yVNhAyZkYTXTLPZSzn592Rwmlp9N+IUEh2UFHuVlTJDYWm0Mw/yt\nbCFnKVwCkCyvhbBjWoQkYgxXCPfmLM1lje1vtVYUgCDDt+O6peZFrk7HuyhL\nisUucclhbrXyZG8IJRgyTvgFGm6dw6QqhCC94L2E4ZXUw7WUu+fsjMK7IB64\nXBKYlmF0054zWI9bDOjKuXJY0+DpMumb2fkE8mIHlN6kDgbk7e0o5N6G0q+u\n/MV0xLFasPcBys3iwU8uE9w3XgVn4vHiVL2RHOsE6wQiTlI3flRc6751n9tO\nhiyEB9sag4PfCQVuBkL25/z7aiGFJNrT4wVCQTS8SeR1HjZ2/qoXV8QT/+3y\nOfXtCjFUSZqrxku2/KLvm0T44+PW4KHJzwltQmnUm9WPgTAz/yUbohZesyL/\n+7KqzYBfJr0VntIDCddOG+29uQ3ozx+gbOO08N5NnigP3nJ+5wmhq+xliEHy\nl05nxx8wx1G7V4Ec9Zl8GtPr5u/AsgVze7TPvqnw6Px98Jj8E99joDlQkCNk\ntz2UlIP/7tEZ6xtODxuAyu8hOjvYqLlLNRPbs7fX6kgMbT2G9wFm15gV+GNf\nASmt\r\n=je8F\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFHernRbDCcvcRixXvAt0Hpld5iz1GWv9AJIk/E8H9ZeAiBzj2CvFCG7UQubL/CUdsFQitXmTRlLMK7Hf3uEKHK/dQ=="}]},"maintainers":[{"name":"daveparslow","email":"daveparslow@gmail.com"}],"_npmUser":{"name":"daveparslow","email":"daveparslow@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-timeline-range-slider_2.0.2_1603834231961_0.9851815475102168"},"_hasShrinkwrap":false}},"time":{"created":"2020-10-23T00:00:08.928Z","2.0.0":"2020-10-23T00:00:09.163Z","modified":"2022-04-05T03:05:19.240Z","2.0.1":"2020-10-23T00:29:06.497Z","2.0.2":"2020-10-27T21:30:32.100Z"},"maintainers":[{"name":"daveparslow","email":"daveparslow@gmail.com"}],"description":"Time Slider component for React","homepage":"https://github.com/lizashkod/react-time-range-slider","keywords":["react-component","react","slider","component","time-picker","react-slider","range-slider","range"],"repository":{"type":"git","url":"git+https://github.com/lizashkod/react-time-range-slider.git"},"author":{"name":"Elizaveta Shkodkina","email":"lizashkodkina@gmail.com"},"bugs":{"url":"https://github.com/lizashkod/react-time-range-slider/issues"},"license":"MIT","readme":"### react-timeline-range-slider\r\n![demo gif](./demo.gif)\r\n### Installation\r\n\r\n npm i react-timeline-range-slider\r\n### Props\r\n\r\n| Prop | Type | Default | Description|\r\n|--|--|--|--|\r\n| timelineInterval | array |[startOfToday(), endOfToday()]|Interval to display|\r\n|selectedInterval|array|[new Date(), addHours(new Date(), 1)]|Selected interval inside the timeline|\r\n|disabledIntervals|array|[]|Array of disabled intervals inside the timeline|\r\n|containerClassName|string||ClassName of the wrapping container|\r\n|step|number|1800000|Number of milliseconds between steps (the default value is 30 minutes)|\r\n|ticksNumber|number|48|Number of steps on the timeline (the default value is 30 minutes)|\r\n|error|bool|false|Is the selected interval is not valid|\r\n|mode|int/function|3|The interaction mode. Value of 1 will allow handles to cross each other. Value of 2 will keep the sliders from crossing and separated by a step. Value of 3 will make the handles pushable and keep them a step apart. ADVANCED: You can also supply a function that will be passed the current values and the incoming update. Your function should return what the state should be set as.|\r\n|formatTick|function|ms => format(new Date(ms), 'HH:mm')|Function that determines the format in which the date will be displayed|\r\n|onUpdateCallback|function|||\r\n|onChangeCallback|function|||\r\n### Example\r\n[Live demo](https://codesandbox.io/s/react-timeline-range-slider-ve7w2?file=/src/App.js)\r\n```javascript\r\nimport React from 'react' \r\nimport { endOfToday, set } from 'date-fns' \r\nimport TimeRange from 'react-timeline-range-slider' \r\n\r\nconst now = new Date()\r\nconst getTodayAtSpecificHour = (hour = 12) =>\r\n\tset(now, { hours: hour, minutes: 0, seconds: 0, milliseconds: 0 })\r\n\r\nconst selectedStart = getTodayAtSpecificHour()\r\nconst selectedEnd = getTodayAtSpecificHour(14)\r\n\r\nconst startTime = getTodayAtSpecificHour(7)\r\nconst endTime = endOfToday()\r\n\r\nconst disabledIntervals = [\r\n { start: getTodayAtSpecificHour(16), end: getTodayAtSpecificHour(17) },\r\n { start: getTodayAtSpecificHour(7), end: getTodayAtSpecificHour(12) },\r\n { start: getTodayAtSpecificHour(20), end: getTodayAtSpecificHour(24) }\r\n]\r\n\r\nclass App extends React.Component { \r\n state = { \r\n error: false, \r\n selectedInterval: [selectedStart, selectedEnd], \r\n }\r\n\t\r\n errorHandler = ({ error }) => this.setState({ error }) \r\n\r\n onChangeCallback = selectedInterval => this.setState({ selectedInterval }) \r\n\r\n render() { \r\n const { selectedInterval, error } = this.state \r\n return ( \r\n \r\n ) \r\n } \r\n} \r\n\r\nexport default App\r\n```\r\n","readmeFilename":"README.md"}