{"_id":"@ridi/react-router-restore-scroll","_rev":"61-62870a1fcef9fee6b37d481e8d388d79","name":"@ridi/react-router-restore-scroll","dist-tags":{"latest":"0.0.4"},"versions":{"0.0.1":{"name":"@ridi/react-router-restore-scroll","version":"0.0.1","keywords":["react","react router","scroll","scroll behavior","restore scroll"],"license":"MIT","_id":"@ridi/react-router-restore-scroll@0.0.1","maintainers":[{"name":"jshin49","email":"jshin49@gmail.com"}],"homepage":"https://github.com/ridi/react-router-restore-scroll#readme","bugs":{"url":"https://github.com/ridi/react-router-restore-scroll/issues"},"dist":{"shasum":"bab30749e3ff04c203911a445569bcf464d7d23a","tarball":"https://registry.npmjs.org/@ridi/react-router-restore-scroll/-/react-router-restore-scroll-0.0.1.tgz","integrity":"sha512-l7O9mzTpj7Z/3dgYkmoSoLRKzOGic7mOMxdk9D+ERDv12wRlHgjf9WIDS5xq6Ar+DI1dW0zndd0nYMsTst/oZQ==","signatures":[{"sig":"MEQCIHk+kmyUrSkl9cid6ZgKM+5Bt7KG+Qz0j+OBMz7BsquFAiBARpzAZIheFWmGud3DPVMlRejEDYpLLxLY6WElnVtXGw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"main":"lib/index.js","tags":["react","react router","scroll","scroll behavior","restore scroll"],"_from":".","_shasum":"bab30749e3ff04c203911a445569bcf464d7d23a","authors":["Ryan Florence","Jay Shin","ridi"],"gitHead":"b8911a32ea807096f8df690b0ccee45fedc4522a","scripts":{"lint":"eslint modules","test":"npm run lint && karma start","build":"babel ./modules -d lib --ignore '__tests__'","start":"webpack-dev-server --config example/webpack.config.js --inline --content-base example","build-min":"NODE_ENV=production webpack -p modules/RestoreScroll.js umd/RestoreScroll.min.js","build-umd":"NODE_ENV=production webpack modules/RestoreScroll.js umd/RestoreScroll.js","postinstall":"node npm-scripts/postinstall.js"},"_npmUser":{"name":"jshin49","email":"jshin49@gmail.com"},"repository":{"url":"git+https://github.com/ridi/react-router-restore-scroll.git","type":"git"},"_npmVersion":"3.10.10","description":"Scroll position restoration for React Router","directories":{},"_nodeVersion":"6.10.3","dependencies":{},"devDependencies":{"karma":"^0.13.3","mocha":"^2.0.1","react":"^15.0.1","eslint":"*","expect":"^1.12.0","rimraf":"^2.4.2","webpack":"^1.12.6","babel-cli":"^6.6.5","gzip-size":"^3.0.0","react-dom":"^15.0.1","babel-core":"^6.7.0","prop-types":"^15.5.10","karma-mocha":"^0.2.0","babel-eslint":"*","babel-loader":"^6.2.4","pretty-bytes":"^2.0.1","react-router":"^3.0.0","karma-webpack":"^1.7.0","babel-preset-react":"^6.5.0","create-react-class":"^15.6.0","webpack-dev-server":"^1.14.1","babel-preset-es2015":"^6.6.0","eslint-config-rackt":"*","eslint-plugin-react":"*","babel-preset-stage-1":"^6.5.0","karma-mocha-reporter":"^1.0.4","karma-chrome-launcher":"^0.2.0","karma-firefox-launcher":"^0.1.6","karma-sourcemap-loader":"^0.3.5","webpack-dev-middleware":"^1.2.0","karma-browserstack-launcher":"^0.1.3"},"peerDependencies":{"react":"*","react-router":"^3.0.0","create-react-class":"^15.6.0"},"_npmOperationalInternal":{"tmp":"tmp/react-router-restore-scroll-0.0.1.tgz_1502271257222_0.8510022631380707","host":"s3://npm-registry-packages"}},"0.0.2":{"name":"@ridi/react-router-restore-scroll","version":"0.0.2","keywords":["react","react router","scroll","scroll behavior","restore scroll"],"license":"MIT","_id":"@ridi/react-router-restore-scroll@0.0.2","maintainers":[{"name":"jshin49","email":"jshin49@gmail.com"},{"name":"jaeyo","email":"lastiverse@gmail.com"},{"name":"freekering","email":"freekering@gmail.com"},{"name":"jh.park","email":"jh.park@ridi.com"},{"name":"namenu","email":"namenu@gmail.com"},{"name":"ridistory","email":"developer@ridi.com"}],"homepage":"https://github.com/ridi/react-router-restore-scroll#readme","bugs":{"url":"https://github.com/ridi/react-router-restore-scroll/issues"},"dist":{"shasum":"a20acb7d723378b88b3e535bbb12e874fb739d5e","tarball":"https://registry.npmjs.org/@ridi/react-router-restore-scroll/-/react-router-restore-scroll-0.0.2.tgz","integrity":"sha512-KqZtlEd7hHVYyYsRYIYVUHI6eaxEPD8du9uLbjKPjLfUAHlU64GVKiV8uqBXBwbvda1+/b1v4UpxRHCQWCqtkA==","signatures":[{"sig":"MEQCIHmzlSE/GnIM0+W0s/7vOFpn+eM7/sxbwnuZ2cWThIEEAiAd92pdwsay5XGWDb6j8qxlmjxcCeL4O/1xdjPRvc67KA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"main":"lib/index.js","tags":["react","react router","scroll","scroll behavior","restore scroll"],"authors":["Ryan Florence","Jay Shin","ridi"],"gitHead":"0e10bb11f6e69a1fd4b8908136b5c31a34cb2eaf","scripts":{"lint":"eslint modules","test":"npm run lint && karma start","build":"babel ./modules -d lib --ignore '__tests__'","start":"webpack-dev-server --config example/webpack.config.js --inline --content-base example","build-min":"NODE_ENV=production webpack -p modules/RestoreScroll.js umd/RestoreScroll.min.js","build-umd":"NODE_ENV=production webpack modules/RestoreScroll.js umd/RestoreScroll.js","postinstall":"node npm-scripts/postinstall.js"},"_npmUser":{"name":"jshin49","email":"jshin49@gmail.com"},"repository":{"url":"git+https://github.com/ridi/react-router-restore-scroll.git","type":"git"},"_npmVersion":"5.0.3","description":"Scroll position restoration for React Router","directories":{},"_nodeVersion":"8.1.2","dependencies":{},"devDependencies":{"karma":"^0.13.3","mocha":"^2.0.1","react":"^15.0.1","eslint":"*","expect":"^1.12.0","rimraf":"^2.4.2","webpack":"^1.12.6","babel-cli":"^6.6.5","gzip-size":"^3.0.0","react-dom":"^15.0.1","babel-core":"^6.7.0","prop-types":"^15.5.10","karma-mocha":"^0.2.0","babel-eslint":"*","babel-loader":"^6.2.4","pretty-bytes":"^2.0.1","react-router":"^3.0.0","karma-webpack":"^1.7.0","babel-preset-react":"^6.5.0","create-react-class":"^15.6.0","webpack-dev-server":"^1.14.1","babel-preset-es2015":"^6.6.0","eslint-config-rackt":"*","eslint-plugin-react":"*","babel-preset-stage-1":"^6.5.0","karma-mocha-reporter":"^1.0.4","karma-chrome-launcher":"^0.2.0","karma-firefox-launcher":"^0.1.6","karma-sourcemap-loader":"^0.3.5","webpack-dev-middleware":"^1.2.0","karma-browserstack-launcher":"^0.1.3"},"peerDependencies":{"react":"*","react-router":"^3.0.0","create-react-class":"^15.6.0"},"_npmOperationalInternal":{"tmp":"tmp/react-router-restore-scroll-0.0.2.tgz_1502272370677_0.5839687667321414","host":"s3://npm-registry-packages"}},"0.0.3":{"name":"@ridi/react-router-restore-scroll","version":"0.0.3","keywords":["react","react router","scroll","scroll behavior","restore scroll"],"license":"MIT","_id":"@ridi/react-router-restore-scroll@0.0.3","maintainers":[{"name":"jshin49","email":"jshin49@gmail.com"},{"name":"jaeyo","email":"lastiverse@gmail.com"},{"name":"freekering","email":"freekering@gmail.com"},{"name":"jh.park","email":"jh.park@ridi.com"},{"name":"namenu","email":"namenu@gmail.com"},{"name":"ridistory","email":"developer@ridi.com"}],"homepage":"https://github.com/ridi/react-router-restore-scroll#readme","bugs":{"url":"https://github.com/ridi/react-router-restore-scroll/issues"},"dist":{"shasum":"0914ac469a4c37c2f7d00e15bd3094cb70bd185b","tarball":"https://registry.npmjs.org/@ridi/react-router-restore-scroll/-/react-router-restore-scroll-0.0.3.tgz","integrity":"sha512-iTAQbPPgx3D8Ni8N0BePm+hbwnxUBPLnOz2V+hnOuASDWwS++zS3gu1vvE/eIJkoUr6RD74eNKCYMbUH9EYOWA==","signatures":[{"sig":"MEUCIQDDmCI2Yh+HCHHJ+SdtUOAt6JoRCiepn3SIxvJ9qFJCGgIgL4ugYj8pyb1YuVYocdFWv5IieR5ptRvPyn3Zx7YK1hI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"main":"lib/index.js","tags":["react","react router","scroll","scroll behavior","restore scroll"],"authors":["Ryan Florence","Jay Shin","ridi"],"gitHead":"3f56c2ba4f893678d7436ba55594d698ea2a9341","scripts":{"lint":"eslint modules","test":"npm run lint && karma start","build":"babel ./modules -d lib --ignore '__tests__'","start":"webpack-dev-server --config example/webpack.config.js --inline --content-base example","build-min":"NODE_ENV=production webpack -p modules/RestoreScroll.js umd/RestoreScroll.min.js","build-umd":"NODE_ENV=production webpack modules/RestoreScroll.js umd/RestoreScroll.js","postinstall":"node npm-scripts/postinstall.js"},"_npmUser":{"name":"jshin49","email":"jshin49@gmail.com"},"repository":{"url":"git+https://github.com/ridi/react-router-restore-scroll.git","type":"git"},"_npmVersion":"5.0.3","description":"Scroll position restoration for React Router","directories":{},"_nodeVersion":"8.1.2","dependencies":{},"devDependencies":{"karma":"^0.13.3","mocha":"^2.0.1","react":"^15.0.1","eslint":"*","expect":"^1.12.0","rimraf":"^2.4.2","webpack":"^1.12.6","babel-cli":"^6.6.5","gzip-size":"^3.0.0","react-dom":"^15.0.1","babel-core":"^6.7.0","prop-types":"^15.5.10","karma-mocha":"^0.2.0","babel-eslint":"*","babel-loader":"^6.2.4","pretty-bytes":"^2.0.1","react-router":"^3.0.0","karma-webpack":"^1.7.0","babel-preset-react":"^6.5.0","create-react-class":"^15.6.0","webpack-dev-server":"^1.14.1","babel-preset-es2015":"^6.6.0","eslint-config-rackt":"*","eslint-plugin-react":"*","babel-preset-stage-1":"^6.5.0","karma-mocha-reporter":"^1.0.4","karma-chrome-launcher":"^0.2.0","karma-firefox-launcher":"^0.1.6","karma-sourcemap-loader":"^0.3.5","webpack-dev-middleware":"^1.2.0","karma-browserstack-launcher":"^0.1.3"},"peerDependencies":{"react":"*","react-router":"^3.0.0","create-react-class":"^15.6.0"},"_npmOperationalInternal":{"tmp":"tmp/react-router-restore-scroll-0.0.3.tgz_1502272560061_0.5640179885085672","host":"s3://npm-registry-packages"}},"0.0.4":{"name":"@ridi/react-router-restore-scroll","version":"0.0.4","keywords":["react","react router","scroll","scroll behavior","restore scroll"],"license":"MIT","_id":"@ridi/react-router-restore-scroll@0.0.4","maintainers":[{"name":"jshin49","email":"jshin49@gmail.com"},{"name":"jaeyo","email":"lastiverse@gmail.com"},{"name":"freekering","email":"freekering@gmail.com"},{"name":"jh.park","email":"jh.park@ridi.com"},{"name":"namenu","email":"namenu@gmail.com"},{"name":"ridistory","email":"developer@ridi.com"}],"homepage":"https://github.com/ridi/react-router-restore-scroll#readme","bugs":{"url":"https://github.com/ridi/react-router-restore-scroll/issues"},"dist":{"shasum":"2a7124742306d56d3b8dbe9994a3a52b9d9a8eaf","tarball":"https://registry.npmjs.org/@ridi/react-router-restore-scroll/-/react-router-restore-scroll-0.0.4.tgz","integrity":"sha512-vIUm3OA6iKE13PyuNcdwitZP5TEN2nYNS/+GskdFBMHxVh9PLFWdFKeq4IJltQ5fMMuokGg/rUJqgYb52G0WJQ==","signatures":[{"sig":"MEUCIAc9POdI0/oLxQmPsNmCmsQNvbBZ5X+5xa6+Qex7Om49AiEA3fL9C7pKV3bhBi+HnOsU8lDRGAFs4Pt8yqMR0Pno+yI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}]},"main":"lib/index.js","tags":["react","react router","scroll","scroll behavior","restore scroll"],"authors":["Ryan Florence","Jay Shin","ridi"],"gitHead":"10f8d574825e71a8c2a8a2aca1bc02df3ceee430","scripts":{"lint":"eslint modules","test":"npm run lint && karma start","build":"babel ./modules -d lib --ignore '__tests__'","start":"webpack-dev-server --config example/webpack.config.js --inline --content-base example","build-min":"NODE_ENV=production webpack -p modules/RestoreScroll.js umd/RestoreScroll.min.js","build-umd":"NODE_ENV=production webpack modules/RestoreScroll.js umd/RestoreScroll.js","postinstall":"node npm-scripts/postinstall.js"},"_npmUser":{"name":"jshin49","email":"jshin49@gmail.com"},"repository":{"url":"git+https://github.com/ridi/react-router-restore-scroll.git","type":"git"},"_npmVersion":"5.0.3","description":"Scroll position restoration for React Router","directories":{},"_nodeVersion":"8.1.2","dependencies":{},"devDependencies":{"karma":"^0.13.3","mocha":"^2.0.1","react":"^15.0.1","eslint":"*","expect":"^1.12.0","rimraf":"^2.4.2","webpack":"^1.12.6","babel-cli":"^6.6.5","gzip-size":"^3.0.0","react-dom":"^15.0.1","babel-core":"^6.7.0","prop-types":"^15.5.10","karma-mocha":"^0.2.0","babel-eslint":"*","babel-loader":"^6.2.4","pretty-bytes":"^2.0.1","react-router":"^3.0.0","karma-webpack":"^1.7.0","babel-preset-react":"^6.5.0","create-react-class":"^15.6.0","webpack-dev-server":"^1.14.1","babel-preset-es2015":"^6.6.0","eslint-config-rackt":"*","eslint-plugin-react":"*","babel-preset-stage-1":"^6.5.0","karma-mocha-reporter":"^1.0.4","karma-chrome-launcher":"^0.2.0","karma-firefox-launcher":"^0.1.6","karma-sourcemap-loader":"^0.3.5","webpack-dev-middleware":"^1.2.0","karma-browserstack-launcher":"^0.1.3"},"peerDependencies":{"react":"*","react-router":"^3.0.0","create-react-class":"^15.6.0"},"_npmOperationalInternal":{"tmp":"tmp/react-router-restore-scroll-0.0.4.tgz_1502347282873_0.39823023951612413","host":"s3://npm-registry-packages"}}},"time":{"created":"2017-08-09T09:34:17.388Z","modified":"2026-07-01T06:20:36.969Z","0.0.1":"2017-08-09T09:34:17.388Z","0.0.2":"2017-08-09T09:52:50.776Z","0.0.3":"2017-08-09T09:56:00.189Z","0.0.4":"2017-08-10T06:41:22.997Z"},"bugs":{"url":"https://github.com/ridi/react-router-restore-scroll/issues"},"license":"MIT","homepage":"https://github.com/ridi/react-router-restore-scroll#readme","keywords":["react","react router","scroll","scroll behavior","restore scroll"],"repository":{"url":"git+https://github.com/ridi/react-router-restore-scroll.git","type":"git"},"description":"Scroll position restoration for React Router","maintainers":[{"email":"davin.ahn@ridi.com","name":"davin.ahn"},{"email":"developer@ridi.com","name":"ridicorp"},{"email":"junhee.han@ridi.com","name":"ridi-junhee"},{"email":"nsa06031@gmail.com","name":"mando212"},{"email":"hw.choi@ridi.com","name":"hw.choi"},{"email":"ys.yoon@ridi.com","name":"ys.yoon"}],"readme":"# Restore Scroll\n[![npm version](https://img.shields.io/npm/v/@ridi/react-router-restore-scroll.svg)](https://www.npmjs.com/package/@ridi/react-router-restore-scroll)\n\nRestore the scroll positions of `window` and scrollable elements when\nthe user navigates around a React Router app.\n\n![demo](http://g.recordit.co/WTEvqRtWq9.gif)\n\n## Updates for this fork\n\nThis is a fork of [jshin49/react-router-restore-scroll](https://github.com/jshin49/react-router-restore-scroll).\n\nThe original library created by Ryan Florence seems to be unmaintained so @jshin49 forked it to support React v16 and fix some other minor issues.\n\nWe recommend using node v8.1.2 and the latest npm version in order to use this version, and to use react-router@3.\n\n### Major updates:\n1. Removed deprecated usages of React.createClass and React.PropTypes in order to support React v16.\n  - Before\n  ```javascript\n  import React from 'react'\n\n  const RestoreScroll = React.createClass({\n  ...\n    propTypes: {\n      scrollKey: React.PropTypes.string.isRequired\n    },\n  ...\n  )}\n  ```\n\n  - After\n  ```javascript\n  import React from 'react'\n  import PropTypes from 'prop-types'\n  import createReactClass from 'create-react-class'\n\n  const RestoreScroll = createReactClass({\n  ...\n    propTypes: {\n      scrollKey: PropTypes.string.isRequired\n    },\n  ...\n  )}\n  ```\n\n  Referring to\n  - https://facebook.github.io/react/blog/2017/04/07/react-v15.5.0.html#migrating-from-react.createclass\n  - https://facebook.github.io/react/blog/2017/04/07/react-v15.5.0.html#migrating-from-react.proptypes\n\n2. Fixed this repo to directly allow installation with npm (post installation script).\n3. Fixed wrong link in ```package.json```\n4. Fixed not restoring scroll for the first ```POP``` action.\n5. Only save scroll position when ```PUSH``` or ```REPLACE``` action.\n\n### Installation:\n\n```sh\nnpm install @ridi/react-router-restore-scroll\n```\n\nor\n\n\nAdd the following in your ```package.json```\n```javascript\n...\n\"@ridi/react-router-restore-scroll\": \"^0.0.3\",\n...\n```\n\nand run ```npm install```. If there's an error, remove the ```node_modules``` file and try installing again.\n\n\n## Temporarily a Plugin\n\nPlan is to put this into React Router directly, but for now you can plug\nit in and help us get the bugs out (and write some tests, there aren't\nany yet!)\n\n\n## Usage\n\n```js\nimport React from 'react'\nimport { render } from 'react-dom'\nimport { Router, browserHistory, applyRouterMiddleware } from 'react-router'\nimport routes from './routes'\n\nimport {\n  useHistoryRestoreScroll,\n  useRouterRestoreScroll\n} from '@ridi/react-router-restore-scroll'\n\n// first enhance a history\nconst createHistory = useHistoryRestoreScroll(() => browserHistory)\n\n// next create some router middleware\nconst routerRender = applyRouterMiddleware(\n  useRouterRestoreScroll()\n)\n\n// then plug them into Router\nrender(\n  <Router\n    history={createHistory()}\n    render={routerRender}\n    routes={routes}\n  />,\n  document.getElementById('app')\n)\n```\n\nNow the window's scroll positions will be automatically restored as you\nnavigate around in a React Router app, and even when you navigate out of\nand back into it from external sites.\n\n## Restores Scrollable Elements Too\n\nIf you’ve got scrollable elements (`overflow: auto|scroll`) they can\nalso be restored with the `RestoreScroll` component.\n\n```js\nimport { RestoreScroll } from '@ridi/react-router-restore-scroll'\n\n// then in a component's render method, wrap your scrollable element\n// in a `RestoreScroll` component. It needs a `scrollKey`.\n<RestoreScroll scrollKey=\"one\">\n  <div style={{ height: '200px', overflow: 'auto', border: '1px solid' }}>\n    <div style={{ height: '100px', background: 'hsl(0, 50%, 90%)' }}>scroll me</div>\n    <div style={{ height: '100px', background: 'hsl(100, 50%, 90%)' }}>two</div>\n    <div style={{ height: '100px', background: 'hsl(200, 50%, 90%)' }}>three</div>\n  </div>\n</RestoreScroll>\n```\n\n## Non-React usage\n\nThe `useHistoryRestoreScroll` enhancer gives you a history with a\n`restoreScroll` property with three methods that you can use to\nintegrate into any view layer that uses `history` (cycle.js, etc.).\n\n```js\nimport createBrowserHistory from 'history/lib/createBrowserHistory'\nimport useHistoryRestoreScroll from '@ridi/react-router-restore-scroll/lib/useHistoryRestoreScroll'\n\nconst history = useHistoryRestoreScroll(createBrowserHistory)()\n\n// call this when a scrollable element is inserted into the dom, where\n// `scrollKey` is a globally unique identifier for the node\nhistory.restoreScroll.registerScroller(scrollKey, domNode)\n\n// call this when it's removed from the dom\nhistory.restoreScroll.unregisterScroller(scrollKey)\n\n// call this\n// - when the app first renders\n// - after the app re-renders after a location change\nhistory.restoreScroll.restoreWindow()\n```\n\nYou can look at `modules/RestoreWindowScroll.js` and `modules/RestoreScroll.js`\nto see at which points in a React app these methods are all called.\n\nWe'll pull `useHistoryRestoreScroll` out into it's own package on npm\neventually so that this use-case isn't required to bring in stuff that\ndepends on React and React Router.\n\n## Difference from [taion/scroll-behavior](https://github.com/taion/scroll-behavior)\n\n- It ties into the router middleware to decide when to restore scroll\n  positions so we don't need workarounds for async routes\n- It restores scroll position of individual elements in addition to the\n  window.\n- It doesn't rely on `location.key` in preparation for history 3.0\n- It does not have `shouldUpdateScroll`, but once [route is on\n  context](https://github.com/reactjs/react-router/issues/3325) we'll be\nable to implement [the old `ignoreScroll` route prop](https://github.com/gaearon/react-router/blob/edfe32086fe9373fe9653b0ef0aaec544eecd3d5/docs/api/components/Route.md#ignorescrollbehavior) or maybe a function like `shouldUpdateScroll` instead.\n","readmeFilename":"README.md"}