{"_id":"@amdglobal/react-infinite-scroller","_rev":"7-608ec2c48c1637999bf1a1b93cb07445","name":"@amdglobal/react-infinite-scroller","dist-tags":{"latest":"1.3.0"},"versions":{"1.3.0":{"name":"@amdglobal/react-infinite-scroller","version":"1.3.0","keywords":["infinite","scroll","react"],"author":{"name":"CassetteRocks"},"license":"MIT","_id":"@amdglobal/react-infinite-scroller@1.3.0","maintainers":[{"name":"fauxsoup","email":"fauxsoup@gmail.com"}],"homepage":"https://github.com/CassetteRocks/react-infinite-scroller#readme","bugs":{"url":"https://github.com/CassetteRocks/react-infinite-scroller/issues"},"dist":{"shasum":"39ade8f7c4ffb6a48f5779ba4f19cfafd4b3804d","tarball":"https://registry.npmjs.org/@amdglobal/react-infinite-scroller/-/react-infinite-scroller-1.3.0.tgz","fileCount":13,"integrity":"sha512-FB43hzgZ+QaqrK+HvR+0HDo+Hu6HIfmAdbh66uHkuY//yhP4adSkSL8TwU7NGLpa/XWLZhQOwwuzo0ZF118yPA==","signatures":[{"sig":"MEQCIHAoj6MnOeGgxnkkBTVL9nOzuvGZO5tKHj9Xkf5NrJcmAiA+roy+a9FhAJ133L0cbpb9wKMOR2I/Hvee+md+IDeRGw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":24026,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg8X5BCRA9TVsSAnZWagAAN1cP/3lDfIQg85uODzTWAesx\nqkg2R1d0H0YhCuPu5KLfu3DRhrKu4iraBL5QL1qQMVvzZ/hPQftreDiT3Ju4\n6rvI/oS9S6GDbaIWXugdE1LUokPzD8ml1VU52orlpnigN3VmWWGk3+WylfjI\nLKKDr+JUmyuuWpYyLCN+fd1mQ6amINfq9O55s3KpRIR665JmyZSwaBOXAMIW\ngZZP6ccmQORytSed/Nw3lMUzof3R3lTSwU1e1Z1Z50Z8VU5OmpMN6lLtL8o1\nRKxWjrnwAMR5nkNyJ5AYkto/cRUjiocTU8w2pS1Qa2Akk/eEEkpYlUXHGOsq\nO54ciq7ZIYM0FswLI0kv1NvBJlseN86ZIGUG3WGNxxSgyNE+jV4KoC7HtvmC\ni8w4pQrZEAFhnuuM9MjpXb/JDqGUrAqeuTbqynlzxz1fd5tRHiwj6VD8Nda7\n4gAH1M/nEm4VOtvfW4uFvqzhhgHhLqvihiEIOoRKQ1n+2UDBt+ZztBhpwp3N\nt2a7K93wxwOSAdqD3srDvOuOgMuL4aFGO794dsAmDHv1ziof9Q4ynl/lGXRs\nU6VeynEXfwBg3meHz7A6KSFAO8bx/MsgzXVUEqpKhke/SVh9T6SyLQcliM74\nWDqdQbJ6jTtBByWSXU97GGs0nI9aHtxZMXmxgqBUTS+VaSgMnRFwp/5ReUeb\nAhX5\r\n=zTyk\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"af0f839a52120186fd18c5747d2ed161d4496e94","scripts":{"lint":"eslint ./src ./test","spec":"_mocha -R spec ./test/test_helper.js --recursive test/*_test.js","test":"nyc npm run spec","build":"mkdirp dist && babel src/InfiniteScroll.js --out-file dist/InfiniteScroll.js","precommit":"lint-staged","prepublish":"npm run build"},"_npmUser":{"name":"fauxsoup","email":"fauxsoup@gmail.com"},"repository":{"url":"git://github.com/CassetteRocks/react-infinite-scroller.git","type":"git"},"_npmVersion":"7.18.1","description":"Infinite scroll component for React in ES6","directories":{},"jsnext:main":"src/InfiniteScroll.js","lint-staged":{"*.{js,jsx}":["node_modules/.bin/eslint ./src ./test --fix --max-warnings 0 --no-ignore","git add"]},"_nodeVersion":"16.4.2","dependencies":{"prop-types":"^15.5.8"},"_hasShrinkwrap":false,"devDependencies":{"nyc":"^10.2.0","chai":"^3.5.0","husky":"^0.14.3","jsdom":"^10.0.0","mocha":"^3.3.0","react":"^16.0.0","sinon":"^2.1.0","enzyme":"^3.3.0","eslint":"^4.10.0","mkdirp":"^0.5.1","webpack":"^2.5.1","istanbul":"^0.4.5","prettier":"^1.7.4","babel-cli":"^6.6.5","react-dom":"^16.0.0","babel-core":"^6.26.3","chai-enzyme":"^0.6.1","lint-staged":"^4.3.0","babel-eslint":"^7.2.3","babel-loader":"^7.0.0","babel-istanbul":"^0.12.2","babel-preset-react":"^6.5.0","eslint-config-last":"^0.0.3","babel-preset-es2015":"^6.6.0","eslint-plugin-react":"^7.4.0","react-test-renderer":"^16.0.0","babel-preset-stage-2":"^6.13.0","babel-plugin-istanbul":"^4.1.6","eslint-config-prettier":"^2.6.0","eslint-plugin-prettier":"^2.3.1","enzyme-adapter-react-16":"^1.1.1","babel-plugin-add-module-exports":"^0.1.2","babel-plugin-transform-object-rest-spread":"^6.23.0"},"peerDependencies":{"react":"^0.14.9 || ^15.3.0 || ^16.0.0 || ^17.0.0"},"_npmOperationalInternal":{"tmp":"tmp/react-infinite-scroller_1.3.0_1626439233061_0.5280189435646916","host":"s3://npm-registry-packages"}}},"time":{"created":"2021-07-16T12:40:32.846Z","modified":"2026-06-16T18:04:34.346Z","1.3.0":"2021-07-16T12:40:33.253Z"},"bugs":{"url":"https://github.com/CassetteRocks/react-infinite-scroller/issues"},"author":{"name":"CassetteRocks"},"license":"MIT","homepage":"https://github.com/CassetteRocks/react-infinite-scroller#readme","keywords":["infinite","scroll","react"],"repository":{"url":"git://github.com/CassetteRocks/react-infinite-scroller.git","type":"git"},"description":"Infinite scroll component for React in ES6","maintainers":[{"email":"ganesh.r@excelglobalsolution.com","name":"ganeshr"},{"email":"muhammadyounus.shaik@excelglobalsolution.com","name":"younus183"},{"email":"fauxsoup@gmail.com","name":"fauxsoup"},{"email":"rohitkumar.padala@excelglobalsolution.com","name":"rohitkumarpadala"},{"email":"sean@amdtelemedicine.com","name":"dayburner"},{"email":"chip@amdtelemedicine.com","name":"chipmcintosh"}],"readme":"React Infinite Scroller\n=======================\n\n[![Travis](https://img.shields.io/travis/danbovey/react-infinite-scroller.svg?style=flat-square)](https://travis-ci.org/CassetteRocks/react-infinite-scroller)\n[![npm](https://img.shields.io/npm/dt/react-infinite-scroller.svg?style=flat-square)](https://www.npmjs.com/package/react-infinite-scroller)\n[![React Version](https://img.shields.io/badge/React-%5E0.14.9%20%7C%7C%20%5E15.3.0%20%7C%7C%20%5E16.0.0-blue.svg?style=flat-square)](https://www.npmjs.com/package/react)\n[![npm](https://img.shields.io/npm/v/react-infinite-scroller.svg?style=flat-square)](https://www.npmjs.com/package/react-infinite-scroller)\n[![npm](https://img.shields.io/npm/l/react-infinite-scroller.svg?style=flat-square)](https://github.com/danbovey/react-infinite-scroller/blob/master/LICENSE)\n\nInfinitely load content using a React Component. This fork maintains a simple, lightweight infinite scroll package that supports both `window` and scrollable elements.\n\n- [Demo](https://danbovey.uk/react-infinite-scroller/demo/)\n- [Demo Source](https://github.com/danbovey/react-infinite-scroller/blob/master/docs/src/index.js)\n\n## Installation\n\n```\nnpm install react-infinite-scroller --save\n```\n```\nyarn add react-infinite-scroller\n```\n\n## How to use\n\n```js\nimport InfiniteScroll from 'react-infinite-scroller';\n```\n\n### Window scroll events\n\n```js\n<InfiniteScroll\n    pageStart={0}\n    loadMore={loadFunc}\n    hasMore={true || false}\n    loader={<div className=\"loader\" key={0}>Loading ...</div>}\n>\n    {items} // <-- This is the content you want to load\n</InfiniteScroll>\n```\n\n### DOM scroll events\n\n```js\n<div style=\"height:700px;overflow:auto;\">\n    <InfiniteScroll\n        pageStart={0}\n        loadMore={loadFunc}\n        hasMore={true || false}\n        loader={<div className=\"loader\" key={0}>Loading ...</div>}\n        useWindow={false}\n    >\n        {items}\n    </InfiniteScroll>\n</div>\n```\n\n### Custom parent element\n\nYou can define a custom `parentNode` element to base the scroll calulations on.\n\n```js\n<div style=\"height:700px;overflow:auto;\" ref={(ref) => this.scrollParentRef = ref}>\n    <div>\n        <InfiniteScroll\n            pageStart={0}\n            loadMore={loadFunc}\n            hasMore={true || false}\n            loader={<div className=\"loader\" key={0}>Loading ...</div>}\n            useWindow={false}\n            getScrollParent={() => this.scrollParentRef}\n        >\n            {items}\n        </InfiniteScroll>\n    </div>\n</div>\n```\n\n## Props\n\n| Name              | Required | Type         | Default   | Description                                                                                                                                                                         |\n| :---------------- | :------- | :----------- | :-------- | :---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n| `children`        | Yes      | `Node`   |           | Anything that can be rendered (same as PropType's Node) |\n| `loadMore`        | Yes      | `Function`   |           | A callback when more items are requested by the user. Receives a single parameter specifying the page to load e.g. `function handleLoadMore(page) { /* load more items here */ }` } |\n| `element`         |          | `Component`  | `'div'`   | Name of the element that the component should render as.                                                                                                                            |\n| `hasMore`         |          | `Boolean`    | `false`   | Whether there are more items to be loaded. Event listeners are removed if `false`.                                                                                                  |\n| `initialLoad`     |          | `Boolean`    | `true`    | Whether the component should load the first set of items.                                                                                                                           |\n| `isReverse`       |          | `Boolean`    | `false`   | Whether new items should be loaded when user scrolls to the top of the scrollable area.                                                                                             |\n| `loader`          |          | `Component`  |           | A React component to render while more items are loading. The parent component must have a unique key prop.                                                                         |\n| `pageStart`       |          | `Number`     | `0`       | The number of the first page to load, With the default of `0`, the first page is `1`.                                                                                               |\n| `getScrollParent` |          | `Function`   |           | Override method to return a different scroll listener if it's not the immediate parent of InfiniteScroll.                                                                           |\n| `threshold`       |          | `Number`     | `250`     | The distance in pixels before the end of the items that will trigger a call to `loadMore`.                                                                                          |\n| `useCapture`      |          | `Boolean`    | `false`   | Proxy to the `useCapture` option of the added event listeners.                                                                                                                      |\n| `useWindow`       |          | `Boolean`    | `true`    | Add scroll listeners to the window, or else, the component's `parentNode`.                                                                                                          |\n","readmeFilename":"README.md"}