Showing preview only (1,133K chars total). Download the full file or copy to clipboard to get everything.
Repository: bvaughn/react-virtualized
Branch: master
Commit: c737715486f7
Files: 227
Total size: 1.0 MB
Directory structure:
gitextract_s_hdht1l/
├── .babelrc.js
├── .circleci/
│ └── config.yml
├── .eslintignore
├── .eslintrc
├── .flowconfig
├── .github/
│ ├── ISSUE_TEMPLATE/
│ │ ├── bug-report.md
│ │ ├── feature-request.md
│ │ └── question.md
│ ├── PULL_REQUEST_TEMPLATE.md
│ └── workflows/
│ └── stale.yml
├── .gitignore
├── .nvmrc
├── .prettierrc
├── .watchmanconfig
├── CHANGELOG.md
├── CODE_OF_CONDUCT.md
├── CONTRIBUTING.md
├── LICENSE
├── README.md
├── codemods/
│ ├── 6-to-7/
│ │ └── rename-properties.js
│ └── 7-to-8/
│ └── rename-components.js
├── docs/
│ ├── ArrowKeyStepper.md
│ ├── AutoSizer.md
│ ├── CellMeasurer.md
│ ├── Collection.md
│ ├── Column.md
│ ├── ColumnSizer.md
│ ├── Grid.md
│ ├── InfiniteLoader.md
│ ├── List.md
│ ├── Masonry.md
│ ├── MultiGrid.md
│ ├── README.md
│ ├── ScrollSync.md
│ ├── SortDirection.md
│ ├── Table.md
│ ├── WindowScroller.md
│ ├── creatingAnInfiniteLoadingList.md
│ ├── customizingStyles.md
│ ├── multiColumnSortTable.md
│ ├── overscanUsage.md
│ ├── reverseList.md
│ ├── tableWithNaturalSort.md
│ ├── upgrades/
│ │ └── Version8.md
│ └── usingAutoSizer.md
├── index.html
├── jest-puppeteer.config.js
├── jest.config.js
├── package.json
├── playground/
│ ├── chat-no-resize.html
│ ├── chat-no-resize.js
│ ├── chat.html
│ ├── chat.js
│ ├── grid-test.html
│ ├── grid-test.js
│ ├── grid.html
│ ├── grid.js
│ ├── helper.js
│ ├── hover.html
│ ├── hover.js
│ ├── render-counters.html
│ ├── render-counters.js
│ ├── scroll-sync.html
│ ├── scroll-sync.js
│ ├── table.html
│ ├── table.js
│ ├── tests.js
│ ├── tree.html
│ ├── tree.js
│ └── utils.js
├── postcss.config.js
├── rollup.config.js
├── source/
│ ├── ArrowKeyStepper/
│ │ ├── ArrowKeyStepper.example.css
│ │ ├── ArrowKeyStepper.example.js
│ │ ├── ArrowKeyStepper.jest.js
│ │ ├── ArrowKeyStepper.js
│ │ ├── index.js
│ │ └── types.js
│ ├── AutoSizer/
│ │ ├── AutoSizer.example.css
│ │ ├── AutoSizer.example.js
│ │ ├── AutoSizer.jest.js
│ │ ├── AutoSizer.js
│ │ ├── AutoSizer.ssr.js
│ │ └── index.js
│ ├── CellMeasurer/
│ │ ├── CellMeasurer.DynamicHeightGrid.example.js
│ │ ├── CellMeasurer.DynamicHeightList.example.js
│ │ ├── CellMeasurer.DynamicHeightTableColumn.example.js
│ │ ├── CellMeasurer.DynamicWidthGrid.example.js
│ │ ├── CellMeasurer.DynamicWidthMultiGrid.example.js
│ │ ├── CellMeasurer.example.css
│ │ ├── CellMeasurer.example.js
│ │ ├── CellMeasurer.jest.js
│ │ ├── CellMeasurer.js
│ │ ├── CellMeasurerCache.jest.js
│ │ ├── CellMeasurerCache.js
│ │ ├── index.js
│ │ └── types.js
│ ├── Collection/
│ │ ├── Collection.example.css
│ │ ├── Collection.example.js
│ │ ├── Collection.jest.js
│ │ ├── Collection.js
│ │ ├── CollectionView.js
│ │ ├── Section.jest.js
│ │ ├── Section.js
│ │ ├── SectionManager.jest.js
│ │ ├── SectionManager.js
│ │ ├── TestData.js
│ │ ├── index.js
│ │ ├── types.js
│ │ └── utils/
│ │ ├── calculateSizeAndPositionData.jest.js
│ │ └── calculateSizeAndPositionData.js
│ ├── ColumnSizer/
│ │ ├── ColumnSizer.example.css
│ │ ├── ColumnSizer.example.js
│ │ ├── ColumnSizer.jest.js
│ │ ├── ColumnSizer.js
│ │ └── index.js
│ ├── Grid/
│ │ ├── Grid.example.css
│ │ ├── Grid.example.js
│ │ ├── Grid.jest.js
│ │ ├── Grid.js
│ │ ├── Grid.ssr.js
│ │ ├── accessibilityOverscanIndicesGetter.jest.js
│ │ ├── accessibilityOverscanIndicesGetter.js
│ │ ├── defaultCellRangeRenderer.js
│ │ ├── defaultOverscanIndicesGetter.jest.js
│ │ ├── defaultOverscanIndicesGetter.js
│ │ ├── index.js
│ │ ├── types.js
│ │ └── utils/
│ │ ├── CellSizeAndPositionManager.jest.js
│ │ ├── CellSizeAndPositionManager.js
│ │ ├── ScalingCellSizeAndPositionManager.jest.js
│ │ ├── ScalingCellSizeAndPositionManager.js
│ │ ├── calculateSizeAndPositionDataAndUpdateScrollOffset.jest.js
│ │ ├── calculateSizeAndPositionDataAndUpdateScrollOffset.js
│ │ ├── maxElementSize.js
│ │ ├── updateScrollIndexHelper.jest.js
│ │ └── updateScrollIndexHelper.js
│ ├── InfiniteLoader/
│ │ ├── InfiniteLoader.example.css
│ │ ├── InfiniteLoader.example.js
│ │ ├── InfiniteLoader.jest.js
│ │ ├── InfiniteLoader.js
│ │ └── index.js
│ ├── List/
│ │ ├── List.example.css
│ │ ├── List.example.js
│ │ ├── List.jest.js
│ │ ├── List.js
│ │ ├── index.js
│ │ └── types.js
│ ├── Masonry/
│ │ ├── Masonry.example.css
│ │ ├── Masonry.example.js
│ │ ├── Masonry.jest.js
│ │ ├── Masonry.js
│ │ ├── PositionCache.js
│ │ ├── createCellPositioner.js
│ │ └── index.js
│ ├── MultiGrid/
│ │ ├── CellMeasurerCacheDecorator.js
│ │ ├── MultiGrid.example.css
│ │ ├── MultiGrid.example.js
│ │ ├── MultiGrid.jest.js
│ │ ├── MultiGrid.js
│ │ └── index.js
│ ├── ScrollSync/
│ │ ├── ScrollSync.example.css
│ │ ├── ScrollSync.example.js
│ │ ├── ScrollSync.jest.js
│ │ ├── ScrollSync.js
│ │ └── index.js
│ ├── Table/
│ │ ├── Column.jest.js
│ │ ├── Column.js
│ │ ├── SortDirection.js
│ │ ├── SortIndicator.js
│ │ ├── Table.example.css
│ │ ├── Table.example.js
│ │ ├── Table.jest.js
│ │ ├── Table.js
│ │ ├── createMultiSort.jest.js
│ │ ├── createMultiSort.js
│ │ ├── defaultCellDataGetter.js
│ │ ├── defaultCellRenderer.js
│ │ ├── defaultHeaderRenderer.js
│ │ ├── defaultHeaderRowRenderer.js
│ │ ├── defaultRowRenderer.js
│ │ ├── index.js
│ │ └── types.js
│ ├── TestUtils.js
│ ├── WindowScroller/
│ │ ├── WindowScroller.e2e.js
│ │ ├── WindowScroller.example.css
│ │ ├── WindowScroller.example.js
│ │ ├── WindowScroller.header-resize.e2e.js
│ │ ├── WindowScroller.jest.js
│ │ ├── WindowScroller.js
│ │ ├── WindowScroller.ssr.js
│ │ ├── index.js
│ │ └── utils/
│ │ ├── dimensions.js
│ │ └── onScroll.js
│ ├── demo/
│ │ ├── Application.css
│ │ ├── Application.js
│ │ ├── ComponentLink.css
│ │ ├── ComponentLink.js
│ │ ├── ContentBox.css
│ │ ├── ContentBox.js
│ │ ├── Icon.css
│ │ ├── Icon.js
│ │ ├── LabeledInput.css
│ │ ├── LabeledInput.js
│ │ ├── NavLink.css
│ │ ├── NavLink.js
│ │ ├── Wizard/
│ │ │ ├── Generator.js
│ │ │ ├── Wizard.css
│ │ │ ├── Wizard.js
│ │ │ └── index.js
│ │ ├── index.js
│ │ └── utils.js
│ ├── index.js
│ ├── jest-setup.js
│ ├── utils/
│ │ ├── TestHelper.js
│ │ ├── animationFrame.js
│ │ ├── createCallbackMemoizer.jest.js
│ │ ├── createCallbackMemoizer.js
│ │ ├── getUpdatedOffsetForIndex.jest.js
│ │ ├── getUpdatedOffsetForIndex.js
│ │ ├── initCellMetadata.js
│ │ └── requestAnimationTimeout.js
│ └── vendor/
│ ├── binarySearchBounds.js
│ ├── detectElementResize.js
│ └── intervalTree.js
├── webpack.config.demo.js
└── webpack.config.dev.js
================================================
FILE CONTENTS
================================================
================================================
FILE: .babelrc.js
================================================
const env = process.env.NODE_ENV;
if (env === 'commonjs' || env === 'es') {
module.exports = {
ignore: [
'*.jest.js',
'*.e2e.js',
'*.ssr.js',
'*.example.js',
'source/demo',
'source/jest-*.js',
'source/TestUtils.js',
],
plugins: [
'@babel/plugin-transform-runtime',
'@babel/plugin-proposal-class-properties',
'@babel/plugin-transform-flow-comments',
['flow-react-proptypes', {deadCode: true, useESModules: true}],
['transform-react-remove-prop-types', {mode: 'wrap'}],
],
presets: [
['@babel/preset-env', {modules: false}],
'@babel/preset-react',
'@babel/preset-flow',
],
};
if (env === 'commonjs') {
module.exports.plugins.push('@babel/plugin-transform-modules-commonjs');
}
}
if (env === 'rollup') {
module.exports = {
comments: false,
plugins: [
'@babel/plugin-external-helpers',
'@babel/plugin-proposal-class-properties',
],
presets: [
['@babel/preset-env', {modules: false}],
'@babel/preset-react',
'@babel/preset-flow',
],
};
}
if (env === 'development') {
module.exports = {
plugins: ['@babel/plugin-proposal-class-properties'],
presets: ['@babel/preset-react', '@babel/preset-flow'],
};
}
if (env === 'production') {
module.exports = {
comments: false,
plugins: [
'@babel/plugin-transform-runtime',
'@babel/plugin-proposal-class-properties',
],
presets: ['@babel/preset-env', '@babel/preset-react', '@babel/preset-flow'],
};
}
if (env === 'test') {
module.exports = {
comments: false,
plugins: [
'@babel/plugin-transform-modules-commonjs',
'@babel/plugin-proposal-class-properties',
],
presets: ['@babel/preset-react', '@babel/preset-flow'],
};
}
================================================
FILE: .circleci/config.yml
================================================
version: 2.1
defaults: &defaults
working_directory: ~/repo
docker:
- image: circleci/node:10.16.3-stretch-browsers
jobs:
dependencies:
<<: *defaults
steps:
- checkout
- restore_cache:
key: npm-cache-{{ checksum "yarn.lock" }}
- run:
name: Install NPM Dependencies
command: yarn --frozen-lockfile
- save_cache:
key: npm-cache-{{ checksum "yarn.lock" }}
paths:
- ~/repo/node_modules
lint:
<<: *defaults
steps:
- checkout
- restore_cache:
key: npm-cache-{{ checksum "yarn.lock" }}
- run:
name: ESLint Code Analysis
command: yarn lint
typecheck:
<<: *defaults
steps:
- checkout
- restore_cache:
key: npm-cache-{{ checksum "yarn.lock" }}
- run:
name: Typechecking with flow
command: yarn typecheck
test:
<<: *defaults
steps:
- checkout
- attach_workspace:
at: ~/repo
- restore_cache:
key: npm-cache-{{ checksum "yarn.lock" }}
- run:
name: Run tests
command: yarn test
coverage:
<<: *defaults
steps:
- checkout
- attach_workspace:
at: ~/repo
- restore_cache:
key: npm-cache-{{ checksum "yarn.lock" }}
- run:
name: Run tests and upload coverage results
command: yarn test:coverage
prettier:
<<: *defaults
steps:
- checkout
- restore_cache:
key: npm-cache-{{ checksum "yarn.lock" }}
- run:
name: Check prettier diff
command: yarn prettier:diff
build:
<<: *defaults
steps:
- checkout
- restore_cache:
key: npm-cache-{{ checksum "yarn.lock" }}
- run:
name: Build all distributions formats
command: yarn build
- persist_to_workspace:
root: .
paths:
- dist
workflows:
version: 2
build_and_test:
jobs:
- dependencies
- lint:
requires:
- dependencies
- typecheck:
requires:
- dependencies
- prettier:
requires:
- dependencies
- build:
requires:
- dependencies
- test:
requires:
- build
filters:
branches:
ignore: gh-pages
- coverage:
requires:
- build
filters:
branches:
ignore: gh-pages
================================================
FILE: .eslintignore
================================================
node_modules/*
# Website dist
build/*
# NPM dist
dist/*
# Vendor files
source/vendor/*
================================================
FILE: .eslintrc
================================================
{
"parser": "babel-eslint",
"plugins": ["react"],
"extends": ["fbjs", "eslint:recommended", "plugin:prettier/recommended"],
"rules": {
"no-console": 0
}
}
================================================
FILE: .flowconfig
================================================
[ignore]
.*/Collection/.*
.*/ColumnSizer/.*
.*/InfiniteLoader/.*
.*/Masonry/.*
.*/MultiGrid/.*
.*/ScrollSync/.*
.*/Table/.*
[untyped]
.*/node_modules/babel-plugin-transform-react-remove-prop-types/.*
.*/node_modules/graphql/.*
.*/node_modules/immutable/.*
[include]
[libs]
[options]
munge_underscores=true
================================================
FILE: .github/ISSUE_TEMPLATE/bug-report.md
================================================
---
name: Bug Report
about: Bugs, missing documentation, or unexpected behavior 🤔.
---
## Bug Report
Please include either a failing unit test or a simple repro. You can start by forking this Code Sandbox: https://codesandbox.io/s/03qpzq1p9p?module=%2FExample.js
### What is the current behavior?
If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn't have dependencies other than React and react-virtualized. Paste the link to your [Code Sandbox](https://codesandbox.io/s/03qpzq1p9p?module=%2FExample.js) below:
### What is the expected behavior?
### Which versions of React and react-virtualized, and which browser / OS are affected by this issue? Did this work in previous versions of react-virtualized?
| | |
|-------------------|----------|
| Browser | |
| OS | |
| React | |
| React DOM | |
| react-virtualized | |
================================================
FILE: .github/ISSUE_TEMPLATE/feature-request.md
================================================
---
name: Feature request
about: Ideas and suggestions
---
## Feature Request
Provide as much information as possible about your requested feature. Here are a few questions you may consider answering:
* What's your use case? (Tell me about your application and what problem you're trying to solve.)
* What interface do you have in mind? (What new properties or methods do you think might be helpful?)
* Can you point to similar functionality with any existing libraries or components? (Working demos can be helpful.)
================================================
FILE: .github/ISSUE_TEMPLATE/question.md
================================================
---
name: Questions
about: Questions about react-virtualized
---
## Asking a Question?
Please don't file GitHub issues to ask questions! Instead use:
* Stack Overflow: http://stackoverflow.com/questions/tagged/react-virtualized
================================================
FILE: .github/PULL_REQUEST_TEMPLATE.md
================================================
Thanks for contributing to react-virtualized!
**Before submitting a pull request,** please complete the following checklist:
- [ ] The existing test suites (`npm test`) all pass
- [ ] For any new features or bug fixes, both positive and negative test cases have been added
- [ ] For any new features, documentation has been added
- [ ] For any documentation changes, the text has been proofread and is clear to both experienced users and beginners.
- [ ] Format your code with [prettier](https://github.com/prettier/prettier) (`yarn run prettier`).
- [ ] Run the [Flow](https://flowtype.org/) typechecks (`yarn run typecheck`).
Here is a short checklist of additional things to keep in mind before submitting:
- Please make sure your pull request description makes it very clear what you're trying to accomplish. If it's a bug fix, please also provide a failing test case (if possible). In either case, please add additional unit test coverage for your changes. :)
- Be sure you have notifications setup so that you'll see my code review responses. (I may ask you to make some adjustments before merging.)
================================================
FILE: .github/workflows/stale.yml
================================================
name: Close stale issues and PRs
on:
schedule:
- cron: '0 8 * * *'
jobs:
stale:
runs-on: ubuntu-latest
steps:
- uses: actions/stale@v9.0.0
with:
days-before-stale: 28
days-before-close: 0
exempt-issue-labels: do-not-close
exempt-pr-labels: do-not-close
================================================
FILE: .gitignore
================================================
.DS_Store
build
coverage
dist
node_modules
npm-debug.log
styles.css
.vscode
.idea
================================================
FILE: .nvmrc
================================================
v10.16.3
================================================
FILE: .prettierrc
================================================
{
"bracketSpacing": false,
"jsxBracketSameLine": true,
"printWidth": 80,
"singleQuote": true,
"trailingComma": "all"
}
================================================
FILE: .watchmanconfig
================================================
================================================
FILE: CHANGELOG.md
================================================
## Changelog
##### NEXT
- Update peer dependencies to allow React 17 ([levenleven](https://github.com/levenleven) - [#1625](https://github.com/bvaughn/react-virtualized/pull/1625))
- Use DOM API instead of creating Trusted Types policy to append a markup ([shhnjk](https://github.com/shhnjk) - [#1627](https://github.com/bvaughn/react-virtualized/pull/1627))
- Fix bug in WindowScroller::updatePosition ([yamadapc](https://github.com/yamadapc) - [#1642](https://github.com/bvaughn/react-virtualized/pull/1642), [#1648](https://github.com/bvaughn/react-virtualized/pull/1648))
- Fix babel tranform es error ([fupengl](https://github.com/fupengl) - [#1651](https://github.com/bvaughn/react-virtualized/pull/1651))
- Fix issue with unused import being emitted ([mewhhaha](https://github.com/mewhhaha) - [#1635](https://github.com/bvaughn/react-virtualized/pull/1635))
- Fix grid roles for accessbility ([asnewman](https://github.com/asnewman) - [#1624](https://github.com/bvaughn/react-virtualized/pull/1624))
##### 9.22.5
- React 19 support added; special thanks to ([artur-ptaszek-mck](https://github.com/artur-ptaszek-mck) and ([adubrouski](https://github.com/adubrouski)
##### 9.22.4
- README changes
##### 9.22.3
- Add Trusted Types support ([shhnjk](https://github.com/shhnjk) - [#1614](https://github.com/bvaughn/react-virtualized/pull/1614))
##### 9.22.2
- CollectionView scrollTop/scrollLeft ([dawnmist](https://github.com/dawnmist) - [#1260](https://github.com/bvaughn/react-virtualized/pull/1260))
##### 9.22.1
- Upgrade babel-plugin-flow-react-proptypes ([Hypnosphi](https://github.com/Hypnosphi) - [#1578](https://github.com/bvaughn/react-virtualized/pull/1578))
##### 9.22.0
- Make AutoSizer a Component ([vzaidman](https://github.com/vzaidman) - [#1490](https://github.com/bvaughn/react-virtualized/pull/1490))
- Update masonry props and docs ([seanstrom](https://github.com/seanstrom) - [#1493](https://github.com/bvaughn/react-virtualized/pull/1493))
- CellMeasurer: add registerChild render prop ([Hypnosphi](https://github.com/Hypnosphi) - [#1477](https://github.com/bvaughn/react-virtualized/pull/1477))
- Fix Table class names in documentation ([jakemmarsh](https://github.com/jakemmarsh) - [#1471](https://github.com/bvaughn/react-virtualized/pull/1471))
- Fix style.css import in demo ([Dominic0512](https://github.com/Dominic0512) - [#1466](https://github.com/bvaughn/react-virtualized/pull/1466))
##### 9.21.2
- 🎉 Update prettier ([wuweiweiwu](https://github.com/wuweiweiwu) - [#1455](https://github.com/bvaughn/react-virtualized/pull/1455))
- 🎉 Remove slack from documentation ([wuweiweiwu](https://github.com/wuweiweiwu) - [#1417](https://github.com/bvaughn/react-virtualized/pull/1417))
- 🐛 Fix masionry scroll handler target ([chinmay17](https://github.com/chinmay17) - [#1420](https://github.com/bvaughn/react-virtualized/pull/1420))
- 🎉 AutoSizer support for multi window ([mbman](https://github.com/mbman) - [#1421](https://github.com/bvaughn/react-virtualized/pull/1421))
- 🎉 Upgrade dom-helpers ([dominykas](https://github.com/dominykas) - [#1424](https://github.com/bvaughn/react-virtualized/pull/1424))
- 🎉 Remove react-vtree from docs ([Lodin](https://github.com/Lodin) - [#1415](https://github.com/bvaughn/react-virtualized/pull/1415))
- 🐛 Fix detection of chrome ([nifgraup](https://github.com/nifgraup) - [#1355](https://github.com/bvaughn/react-virtualized/pull/1355))
- 🐛 Fix hostname issues for images ([nickstew](https://github.com/nickstew) - [#1401](https://github.com/bvaughn/react-virtualized/pull/1401))
- 🐛 Fix aria attributes on Table ([eps1lon](https://github.com/eps1lon) - [#1380](https://github.com/bvaughn/react-virtualized/pull/1380))
##### 9.21.1
- 🐛 Fix doc typos. ([tienpham94](https://github.com/tienpham94) - [#1268](https://github.com/bvaughn/react-virtualized/pull/1268))
- 🐛 Fix typos in changelog. ([misacorn](https://github.com/misacorn) - [#1267](https://github.com/bvaughn/react-virtualized/pull/1267))
- 🐛 Fix formatting in AutoSizer.md ([jacklee814](https://github.com/jacklee814) - [#1246](https://github.com/bvaughn/react-virtualized/pull/1246))
- 🐛 Fix usage of reduce in InfiniteLoader ([jedwards1211](https://github.com/jedwards1211) - [#1277](https://github.com/bvaughn/react-virtualized/pull/1277))
- 🎉 Migrate from classnames to clsx ([TrySound](https://github.com/TrySound) - [#1306](https://github.com/bvaughn/react-virtualized/pull/1306))
- 🐛 Ensure a string title for header ([oakfang](https://github.com/oakfang) - [#1321](https://github.com/bvaughn/react-virtualized/pull/1321))
- 🎉 Use sparse array for cell position caches ([trxcllnt](https://github.com/trxcllnt) - [#1312](https://github.com/bvaughn/react-virtualized/pull/1312))
- 🐛 Fix scrollToPosition ([jaycrypto](https://github.com/jaycrypto) - [#1288](https://github.com/bvaughn/react-virtualized/pull/1288))
##### 9.21.0
- 🎉 Added new use case example for CellMeasurer. ([wuweiweiwu](https://github.com/wuweiweiwu) - [#1168](https://github.com/bvaughn/react-virtualized/pull/1168))
- 🎉 Added react-timeline-9000 as a related library. ([vasdee](https://github.com/vasdee) - [#1197](https://github.com/bvaughn/react-virtualized/pull/1197))
- 🐛 Fix CellMeasurer docs with correct import statement. ([skipjack](https://github.com/skipjack) - [#1187](https://github.com/bvaughn/react-virtualized/pull/1187))
- 🐛 Fix broken Slack badge. ([slieshke](https://github.com/slieshke) - [#1205](https://github.com/bvaughn/react-virtualized/pull/1205))
- 🐛 Fix type in CellMeasurer example. ([rloqvist](https://github.com/rloqvist) - [#1190](https://github.com/bvaughn/react-virtualized/pull/1190))
- 🐛 Fix Table aria attributes. ([jsomsanith](https://github.com/jsomsanith) - [#1208](https://github.com/bvaughn/react-virtualized/pull/1208))
- 🐛 Removed unused variable in Masonry example. ([ignocide](https://github.com/ignocide) - [#1218](https://github.com/bvaughn/react-virtualized/pull/1218))
- 🎉 Add onColumnClick to Table. ([grahamlyus](https://github.com/grahamlyus) - [#1207](https://github.com/bvaughn/react-virtualized/pull/1207))
- 🎉 Allow users to override default table row styles. ([emroussel](https://github.com/emroussel) - [#1175](https://github.com/bvaughn/react-virtualized/pull/1175))
##### 9.20.1
- 🐛 Removing `sideEffects: false` from package.json. ([wuweiweiwu](https://github.com/wuweiweiwu) - [#1163](https://github.com/bvaughn/react-virtualized/pull/1163))
- 🐛 Prevent early `debounceScrollEndedCallback`. ([Gvozd](https://github.com/Gvozd) - [#1141](https://github.com/bvaughn/react-virtualized/pull/1141))
- 🐛 Fix `scrollToIndex` behavior in `InfiniteLoader`. ([mengdage](https://github.com/mengdage), [dcolens](https://github.com/dcolens) - [#1154](https://github.com/bvaughn/react-virtualized/pull/1154))
##### 9.20.0
- 🎉 Code of Conduct and updated Issue/PR templates. ([aem](https://github.com/aem) - [#1052](https://github.com/bvaughn/react-virtualized/pull/1052))
- 🐛 Make scrollTo{Column,Row} take precedence over scroll{Left,Top}. ([wuweiweiwu](https://github.com/wuweiweiwu) - [#1130](https://github.com/bvaughn/react-virtualized/pull/1130))
- 🐛 No `setState(null)`. ([wuweiweiwu](https://github.com/wuweiweiwu) - [#1129](https://github.com/bvaughn/react-virtualized/pull/1129))
- 🎉 New `isScrollingOptOut` prop for `Grid` that prevents re-rendering on scroll-end. ([wuweiweiwu](https://github.com/wuweiweiwu) - [#1131](https://github.com/bvaughn/react-virtualized/pull/1131))
- 🐛 Updated npm badge link. ([SpainTrain](https://github.com/SpainTrain) - [#1146](https://github.com/bvaughn/react-virtualized/pull/1146))
##### 9.19.1
- Updated [react-lifecycles-compat](https://github.com/reactjs/react-lifecycles-compat) to 3.0.4. ([pigcan](https://github.com/pigcan) - [#1114](https://github.com/bvaughn/react-virtualized/pull/1114))
##### 9.19.0
- Replaced `componentWillMount`, `componentWillReceiveProps`, and `componentWillUpdate` with async-safe lifecycles in advance of React 16.x deprecation warnings. Added [react-lifecycles-compat](https://github.com/reactjs/react-lifecycles-compat) as a dependency, to ensure backwards compatibility.
- Public flow interface for `CellMeasurer`. ([diogofcunha](https://github.com/diogofcunha) - [#1058](https://github.com/bvaughn/react-virtualized/pull/1058))
- Improved build by setting `sideEffects` to `false`. ([0xR](https://github.com/0xR) - [#1064](https://github.com/bvaughn/react-virtualized/pull/1064))
- 🐛 Fix flow type checks. ([RyanLiu0235](https://github.com/RyanLiu0235) - [#1066](https://github.com/bvaughn/react-virtualized/pull/1066))
- Rollup for UMD build. ([TrySound](https://github.com/TrySound) - [#994](https://github.com/bvaughn/react-virtualized/pull/994))
- Row direction support for `Masonry` ([bardiarastin](https://github.com/bardiarastin) - [#1071](https://github.com/bvaughn/react-virtualized/pull/1071))
- Add lint-staged and precommit hooks ([TrySound](https://github.com/TrySound) - [#1082](https://github.com/bvaughn/react-virtualized/pull/1082))
- Add `scrollToRow` and `scrollToColumn` support for ssr. ([microcood](https://github.com/microcood) - [#1072](https://github.com/bvaughn/react-virtualized/pull/1072))
- Add `getTotalRowsHeight` and `getTotalColumnsWidth` to `Grid`. ([nihgwu](https://github.com/nihgwu) - [#1022](https://github.com/bvaughn/react-virtualized/pull/1022))
- Allow top-right and bottom-left scrollbars in `MultiGrid` be hidden. ([RaviDasari](https://github.com/RaviDasari) - [#1040](https://github.com/bvaughn/react-virtualized/pull/1040))
- Documentation changes
- Added `forceUpdateGrid` documentation for `MultiGrid`. ([kartikluke](https://github.com/kartikluke) - [#1079](https://github.com/bvaughn/react-virtualized/pull/1079))
- 🐛 Fixed typo in `Grid` docs. ([r-kot](https://github.com/r-kot) - [#1092](https://github.com/bvaughn/react-virtualized/pull/1092))
- 🐛 Fixed typo in `Collection` docs. ([skipjack](https://github.com/skipjack) - [#1050](https://github.com/bvaughn/react-virtualized/pull/1050))
- Added dynamically measured images example for `Masonry`. ([kirill-konshin](https://github.com/kirill-konshin) - [#1081](https://github.com/bvaughn/react-virtualized/pull/1081))
##### 9.18.5
- 🐛 Revert changes > 9.18.0
<!--
##### 9.18.1
* ✨ Prevent generating cjs `prop-types` requires in esm build ([TrySound](https://github.com/TrySound) - [#950](https://github.com/bvaughn/react-virtualized/pull/950))
-->
##### 9.18.0
- ✨ Add `onScrollbarPresenceChange` prop to `MultiGrid`.
##### 9.17.3
- 🐛 Fix `Grid` server-side rendering which was broken after natural scrolling tweak in Chrome. ([TrySound](https://github.com/TrySound) - [#970](https://github.com/bvaughn/react-virtualized/pull/970))
##### 9.17.2
- ✨ Eliminate unnecessary renders for `CellMeasurer` and `Grid`. ([bvaughn](https://github.com/bvaughn) - [#969](https://github.com/bvaughn/react-virtualized/pull/969))
##### 9.17.1
- 🐛 `CellMeasurer` works properly in iframes and popup windows. ([dfdeagle47](https://github.com/dfdeagle47) - [#968](https://github.com/bvaughn/react-virtualized/pull/968))
##### 9.17.0
- More natural scrolling speeds for large lists in Chrome. ([TrySound](https://github.com/TrySound) - [#936](https://github.com/bvaughn/react-virtualized/pull/936))
- Support for multi-column sort added to `Table` component. Read more about this [here](https://github.com/bvaughn/react-virtualized/blob/master/docs/multiColumnSortTable.md). Special thanks to [CzBuCHi](https://github.com/CzBuCHi) for the initial proposal and iteration in PRs [#946](https://github.com/bvaughn/react-virtualized/pull/946) and [#957](https://github.com/bvaughn/react-virtualized/pull/957). ([bvaughn](https://github.com/bvaughn) - [#966](https://github.com/bvaughn/react-virtualized/pull/966))
- ✨ Improved `Table` performance for cases with large numbers of columns. ([gannunziata](https://github.com/gannunziata) - [#942](https://github.com/bvaughn/react-virtualized/pull/942))
- 🐛 Fixed potential initial render bug when using `CellMeasurer` with a `List`. ([OriR](https://github.com/OriR) - [#959](https://github.com/bvaughn/react-virtualized/pull/959))
- 🐛 `Masonry` component now renders at least one column to avoid an invalid, Infinity height layout issue. ([djeeg](https://github.com/djeeg) - [#961](https://github.com/bvaughn/react-virtualized/pull/961))
- 🎉 Optional `className` and `style` props added to `AutoSizer` component.
##### 9.16.1
- 🐛 Run server-side rendering tests under pure node environment and fix SSR in `WindowScroller` ([TrySound](https://github.com/TrySound) - [#953](https://github.com/bvaughn/react-virtualized/pull/953))
- 🎉 Warn on passing wrong value to registerChild in `WindowScroller` ([TrySound](https://github.com/TrySound) - [#949](https://github.com/bvaughn/react-virtualized/pull/949))
- 🐛 Fixed overrided merge `WindowScroller` scrollElement prop type ([TrySound](https://github.com/TrySound) - [#948](https://github.com/bvaughn/react-virtualized/pull/948))
- 🎉 `AutoSizer` (via the `detectElementResize` helper) now supports properly rendering into iframes and child windows ([ahutchings](https://github.com/ahutchings) - [#900](https://github.com/bvaughn/react-virtualized/pull/900))
##### 9.16.0
- 🐛 Fixed window check for SSR in `detectElementResize` ([eqyiel](https://github.com/eqyiel) - [#945](https://github.com/bvaughn/react-virtualized/pull/945))
- 🎉 Allowed custom `WindowScroller` child with `registerChild` in children function ([TrySound](https://github.com/TrySound) - [#940](https://github.com/bvaughn/react-virtualized/pull/940) and [#947](https://github.com/bvaughn/react-virtualized/pull/947))
- 🐛 Fixed `WindowScroller` scrollElement prop type ([TrySound](https://github.com/TrySound) - [#939](https://github.com/bvaughn/react-virtualized/pull/939))
##### 9.15.0
- 🎉 Detected `WindowScroller` container (not only window) resize similar to `AutoSizer` ([TrySound](https://github.com/TrySound) - [#918](https://github.com/bvaughn/react-virtualized/pull/918))
- 🐛 Prevented position breaking on `WindowScroller` container resize ([TrySound](https://github.com/TrySound) - [#920](https://github.com/bvaughn/react-virtualized/pull/920))
- 🎉 Published `AutoSizer` Flow types ([TrySound](https://github.com/TrySound) - [#934](https://github.com/bvaughn/react-virtualized/pull/934))
- 🎉 Published `WindowScroller` Flow types ([TrySound](https://github.com/TrySound) - [#915](https://github.com/bvaughn/react-virtualized/pull/915))
##### 9.14.1
- 🐛 Fixed server-side rendering bug in `WindowScroller` with undefined `window` variable.
##### 9.14.0
- 🎉 Added `serverHeight` and `serverWidth` props to `WindowScroller` for better server-side rendering support.
##### 9.13.0
- 🎉 Added `headerStyle` support for `Table` columns ([@mucsi96](https://github.com/mucsi96) - [#877](https://github.com/bvaughn/react-virtualized/pull/877))
- 🐛 Fixed `Masonry` bug that caused cells to be unnecessarily destroyed and then recreated when new cells were measured - d561d9c
##### 9.12.0
- 🎉 Added `defaultWidth` and `defaultHeight` props to `AutoSizer` to better support server-side rendering.
##### 9.11.1
- 🐛 `Masonry` component now properly pre-renders as specified by `overscanByPixels`
##### 9.11.0
- 🐛 `List` and `Grid` scroll snapping / resetting bugfix #825 by @TrySound
- 🐛 `MultiGrid` crash due to `scrollTo*` prop being `NaN` #829 by @mcordova47
- 🐛 `MultiGrid` invalid `tabIndex` prop type #818 by @kalley
- 🎉 Column default sort direction #833 by @mbseid
##### 9.10.1
- 🐛 Server-side rendering `window` reference bugfix
- 🐛 `Grid.defaultProps` bugfix
##### 9.10.0
- ✨ `Grid` uses `requestAnimationFrame` instead of `setTimeout` for improved scroll-ended debounce timing ([@guilhermefloriani](https://github.com/guilhermefloriani) - [#742](https://github.com/bvaughn/react-virtualized/pull/742))
- 🎉 `onRowRightClick` prop added to `Table` ([@damian-codilime](https://github.com/damian-codilime) - [#741](https://github.com/bvaughn/react-virtualized/pull/741))
- 🎉 `Table` component now allow children that extend `Column` ([@CptLemming](https://github.com/CptLemming) - [#748](https://github.com/bvaughn/react-virtualized/pull/748))
- 🐛 Firefox edge-case bugfix ([@ReinAkane](https://github.com/ReinAkane) - [#798](https://github.com/bvaughn/react-virtualized/pull/798))
- 🎉 `containerProps` prop added to `Grid` ([@implausible](https://github.com/implausible) - [#778](https://github.com/bvaughn/react-virtualized/pull/778))
- ✨ `Grid` accessibility improved via better aria attributes ([@smockle](https://github.com/smockle) - [#744](https://github.com/bvaughn/react-virtualized/pull/744))
- ✨ `CellMeasurererCache.clearAll` also sets row and column counts ([@tcosentino](https://github.com/tcosentino) - [#796](https://github.com/bvaughn/react-virtualized/pull/796))
##### 9.9.0
- 🎉 `InfiniteLoader` API method `resetLoadMoreRowsCache` accepts optional parameter to auto-reload most recent range of rows. ([@BamaBoy](https://github.com/BamaBoy) - [#704](https://github.com/bvaughn/react-virtualized/pull/704))
- 🎉 `MultiGrid` now supports scrolling when hovering over fixed rows or columns by way of new `enableFixedColumnScroll` and `enableFixedRowScroll` props. ([@danalloway](https://github.com/danalloway) - [#708](https://github.com/bvaughn/react-virtualized/pull/708))
- 🎉 `WindowScroller` supports new configurable `scrollingResetTimeInterval` prop (similar to `Grid`). ([@djeeg](https://github.com/djeeg) - [#728](https://github.com/bvaughn/react-virtualized/pull/728))
- 🐛 Edge-case bugfix for style caching of `Grids` locked with `ScrollSync`. ([@nathanpower](https://github.com/nathanpower) - [#727](https://github.com/bvaughn/react-virtualized/pull/727))
- ✨ New `onScrollbarPresenceChange` prop added to `Grid`.
##### 9.8.0
- 🎉 `WindowScroller` supports `scrollToIndex` prop. ([@leoasis](https://github.com/leoasis) - [#643](https://github.com/bvaughn/react-virtualized/pull/643))
- 🎉 Allow `ArrowKeyStepper` to be used as a controlled component. ([@mking-clari](https://github.com/mking-clari) - [#688](https://github.com/bvaughn/react-virtualized/pull/688))
- 🎉New `handleScroll` method on `Grid` to better support custom scrollbars. ([@5angel](https://github.com/5angel) - [#693](https://github.com/bvaughn/react-virtualized/pull/693))
- 🐛 Added edge-case guard to `WindowScroller` to prevent calling `setState` when unmounted. ([@liorbrauer](https://github.com/liorbrauer) - [#689](https://github.com/bvaughn/react-virtualized/pull/689))
- 🐛 Fixed edge-case in `Grid` where setting an initial scroll-to offset with a `height` or `width` of 0 caused the scroll-to prop to be ignored when size later changed. ([#691](https://github.com/bvaughn/react-virtualized/pull/691))
##### 9.7.6
- ✨ Better aria roles set for `Table` column cells and headers. ([@jchen527](https://github.com/jchen527) - [#681](https://github.com/bvaughn/react-virtualized/pull/681))
- 🐛 `CellMeasurer` restores `width` and `height` `style` values after measuring to avoid edge-case layout bugs. ([@marcelmokos](https://github.com/marcelmokos) - [#675](https://github.com/bvaughn/react-virtualized/pull/675))
##### 9.7.5
- ✨ Improved performance for `CellMeasurerCache` by removing some unnecessary computations for fixed-width/fixed-height use cases. ([@RaviDasari](https://github.com/RaviDasari) - [#676](https://github.com/bvaughn/react-virtualized/pull/676))
- 🐛 `MultiGrid` ensures correct row/column indices are passed to `CellMeasurerCache` for top-right and bottom `Grid`s. ([#670](https://github.com/bvaughn/react-virtualized/pull/670))
##### 9.7.4
- 🎉 Add `nonce` attribute to `AutoSizer` for better [Content Security Policy compliance](https://www.w3.org/TR/2016/REC-CSP2-20161215/#script-src-the-nonce-attribute). ([@akihikodaki](https://github.com/akihikodaki) - [#663](https://github.com/bvaughn/react-virtualized/pull/663))
- ✨ `Column` renderers now accept a `columnIndex` parameter as well. This allows multiple `Table` columns to more easily use `CellMeasurer` to compute the min row height. ([@BamaBoy](https://github.com/BamaBoy) - [#662](https://github.com/bvaughn/react-virtualized/pull/662))
##### 9.7.3
- Clear cell and style cache when controlled-scroll mode `Grid` stops scrolling. ([@leoasis](https://github.com/leoasis) - [#649](https://github.com/bvaughn/react-virtualized/pull/649))
##### 9.7.2
- ✨ Removed lingering `React.PropTypes` reference in `InfiniteLoader`.
##### 9.7.1
- ✨ Added `prop-types` dependency to avoid deprecation warnings for React 15.5+.
##### 9.7.0
- Added public animation-friendly API methods to `Grid`/`List`/`Table` for an alternative to props-based animating. ([@imadha](https://github.com/imadha) - [#641](https://github.com/bvaughn/react-virtualized/pull/641))
##### 9.6.1
- 🐛 Fixed module syntax error in vendered file.
##### 9.6.0
- 🎉 `WindowScroller` and `Grid` now support horizontal window-scrolling via new `autoWidth` property. ([@maxnowack](https://github.com/maxnowack) - [#644](https://github.com/bvaughn/react-virtualized/pull/644))
- 🐛 Fixed a Content Security Policy (CSP) issue in an upstream dependency that impacted users of the `Masonry` component. For more information see issue [#640](https://github.com/bvaughn/react-virtualized/issues/640).
- ✨ `List` and `Table` always overscan 1 row in the direction _not_ being scrolled to better support keyboard navigation (via TAB and SHIFT+TAB). For more information see [issue #625](https://github.com/bvaughn/react-virtualized/issues/625).
- ✨ `Grid` no longer alters scroll direction for one axis (eg vertical) if a scroll event occurs for another axis (eg horizontal).
##### 9.5.0
- 🎉 `Grid` supports state-override of `isScrolling` value via new `isScrolling` prop. This enables cache-while-scrolling of cells when used with `WindowScroller`. ([@olavk](https://github.com/olavk) - [#639](https://github.com/bvaughn/react-virtualized/pull/639))
##### 9.4.2
- 🐛 Small accessibility fix to `MultiGrid` so that focus outline shows through by default for main (bottom/right) `Grid`. Top and left `Grid`s are also not tab-focusable by default now since they are scroll-observers anyway.
- ✨ Added `columnWidth` parameter to `ColumnSizer` and deprecated `getColumnWidth` callback. The callback was not necessary since `columnWidth` doesn't change without a re-render and fixed number values perform better in `Grid` due to some internal optimizations anyway.
##### 9.4.1
- 🐛 Edge-case `InfiniteLoader` bug fix; prevent jumping to the first row when scrolling fast. ([@reVrost](https://github.com/reVrost) - [#632](https://github.com/bvaughn/react-virtualized/pull/632))
- 🐛 Reverted unexpected regression from [#616](https://github.com/bvaughn/react-virtualized/pull/616) until a safer fix can be found.
##### 9.4.0
- 🎉 New `Masonry` component optimized for Pinterest-style layouts. Check out the [docs](https://github.com/bvaughn/react-virtualized/blob/master/docs/Masonry.md) and [demo page](https://bvaughn.github.io/react-virtualized/#/components/Masonry) to learn more. ([#618](https://github.com/bvaughn/react-virtualized/pull/618))
- 🎉 `MultiGrid` supports `scrollLeft` and `scrollTop` props for controlled scrolling. ([@julianwong94](https://github.com/julianwong94) - [#624](https://github.com/bvaughn/react-virtualized/pull/624))
- 🎉 New `direction` parameter passed to `overscanIndicesGetter` with values "horizontal" or "vertical". ([@offsky](https://github.com/offsky) - [#629](https://github.com/bvaughn/react-virtualized/pull/629))
- ✨ Replaced inline `require` statement with header `import` in `Grid` for better integration with the Rollup module bundler. ([@odogono](https://github.com/odogono) - [#617](https://github.com/bvaughn/react-virtualized/pull/617))
- 🐛 Improved guard for edge-case scrolling issue with rubberband scrolling in iOS. ([@dtoddtarsi](https://github.com/offsky) - [#616](https://github.com/bvaughn/react-virtualized/pull/616))
- ✨ Replaced `getBoundingClientRect()` with slightly faster `offsetWidth` and `offsetHeight` inside of `AutoSizer`.
- ✨ `AutoSizer` no longer re-renders nor calls `onResize` callback unless `width` and/or `height` have changed (depending on which properties are being watched).
##### 9.3.0
- 🎉 Added `resetLoadMoreRowsCache` method to `InfiniteLoader` to reset any cached data about loaded rows. This method should be called if any/all loaded data needs to be refetched (eg a filtered list where the search criteria changes). ([#612](https://github.com/bvaughn/react-virtualized/issues/612))
##### 9.2.3
- 🐛 `CellMeasurer` should work better out of the box with `MultiGrid`.
- 🐛 `CellMeasurerCache` should return correct values from `rowHeight` and `columnWidth` functions when `keyMapper` is used. ([#613](https://github.com/bvaughn/react-virtualized/pull/613))
##### 9.2.2
- 🐛 Fixed small scrollbar offset bug in `MultiGrid`. ([#609](https://github.com/bvaughn/react-virtualized/issues/609))
##### 9.2.1
- 🐛 Fixed potential scrollbar offset bug in `MultiGrid` by giving top and left `Grid`s a little extra space to scroll into. ([#535](https://github.com/bvaughn/react-virtualized/pull/535))
##### 9.2.0
- 🎉 New `Table` prop, `headerRowRenderer`. ([@kaoDev](https://github.com/kaoDev) - [#600](https://github.com/bvaughn/react-virtualized/pull/600))
- 🎉 All `Table` event handlers now receive a named `event` params ([@paulbrom](https://github.com/paulbrom) - [#605](https://github.com/bvaughn/react-virtualized/pull/605))
- 🎉 Aria roles for `Table` improved to specify `role="row"` for table rows and `role="rowgroup"` for inner `Grid`. ([@jchen527](https://github.com/jchen527) - [#607](https://github.com/bvaughn/react-virtualized/pull/607))
- 🐛 Calling `scrollToRow` for `List` or `Table` no longer potentially messes up horizontal scroll position. ([#603](https://github.com/bvaughn/react-virtualized/issues/603))
##### 9.1.0
- 🎉 Public method `setScrollIndexes` added to `ArrowKeyStepper` to enable easier overrides of current/default focused cell. - ([@alexandro81](https://github.com/alexandro81) - [#592](https://github.com/bvaughn/react-virtualized/pull/592))
- ✨ Replaced `value instanceof Function` checks with `typeof value === 'function'` for improved robustness with iframes/frames/popups. (Learn more [here](<https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/instanceof#instanceof_and_multiple_context_(e.g._frames_or_windows)>).) ([@rickychien](https://github.com/rickychien) - [#596](https://github.com/bvaughn/react-virtualized/pull/596))
- 🐛 `Grid` props `scrollToColumn` and `scrollToRow` as well as `Collection` prop `scrollToCell` now default to `-1` to avoid false positives from `null>=0` check. - ([#595](https://github.com/bvaughn/react-virtualized/issues/595))
##### 9.0.5
- 🎉 Explicitly set `width`/`height` style to "auto" before re-measuring `CellMeasurer` content so that new measurements can be taken. ([#593](https://github.com/bvaughn/react-virtualized/issues/593))
- 🐛 CellMeasurerCache now correctly recomputes cached row height and column width values when cells are cleared. ([#594](https://github.com/bvaughn/react-virtualized/issues/594))
##### 9.0.4
- 🐛 Moved flow-bin from 'dependencies' to 'devDependencies'. This was accidentally placed as a dep before.
##### 9.0.3
- 🐛 `Grid` takes scrollbar size into account when aligning cells for `scrollToColumn` or `scrollToRow` usage. ([#543](https://github.com/bvaughn/react-virtualized/issues/543))
##### 9.0.2
- 🎉 Added additional DEV-only warnings for improperly configured `CellMeasurerCache` based on user-feedback for the new API.
- 🐛 Fixed edge-case where restoring `columnCount` from 0 wouldnt properly restore previous `scrollToRow` offset (and vice versa for `rowCount` and `scrollToColumn`)
- Updated `Grid` and `Collection` to move some state-setting logic related to offsets from `componentWillUpdate` to `componentWillReceiveProps`. This change should have no externally visible impact. ([#585](https://github.com/bvaughn/react-virtualized/issues/585))
##### 9.0.1
- 🐛 Edge-case bug with scroll-to-index and cell size function property ([#565](https://github.com/bvaughn/react-virtualized/issues/565))
- 🐛 Edge-case bug with `WindowScroller` and mocked `window` object
# 9.0.0
Version 9 changes and upgrade steps are described in detail on the [version 9 pull request](https://github.com/bvaughn/react-virtualized/pull/577).
##### 8.11.4
- 🐛 Better guard against minification/uglification in `ColumnSizer` when verifying child is either a `Grid` or a `MultiGrid`. (#558)
##### 8.11.3
- Adding missing `scrollToRow` method to `List` and `Table` (as pass-thrus for `Grid.scrollToCell`).
- 🐛 Bugfixes with `MultiGrid` resize handling and caching. ([@codingbull](https://github.com/codingbull) - [#552](https://github.com/bvaughn/react-virtualized/pull/552))
- 🐛 List checks it row-style object has been frozen before modifying width; (fix for [upcoming React 16 change](https://github.com/facebook/react/commit/977357765b44af8ff0cfea327866861073095c12#commitcomment-20648713)).
- 🐛 `MultiGrid` better handles case where `rowCount === fixedRowCount`.
##### 8.11.2
- 🐛 Added `MultiGrid` method `measureAllCells`; deprecated misnamed `measureAllRows` method.
##### 8.11.1
- 🐛 Fixed regression in `WindowScroller` when browser is resized. ([@andrewbranch](https://github.com/andrewbranch) - [#548](https://github.com/bvaughn/react-virtualized/pull/548))
##### 8.11.0
- 🐛 Minor Preact compat fix to element resize detector; see [developit/preact-compat/issues/228](https://github.com/developit/preact-compat/issues/228)
- 🎉 New `scrollToCell` public method added to `Grid`.
##### 8.10.0
- 🎉 `WindowScroller` supports custom target element via a new `scrollElement` prop; defaults to `window` for backwards compatibility. ([@andrewbranch](https://github.com/andrewbranch) - [#481](https://github.com/bvaughn/react-virtualized/pull/481))
- 🐛 `MultiGrid` supports `onScroll` property. ([@Pana](https://github.com/Pana) - [#536](https://github.com/bvaughn/react-virtualized/pull/536))
- 🎉 New id-based `CellMeasurer` cell size cache, `idCellMeasurerCellSizeCache`. ([@bvaughn](https://github.com/bvaughn) - [#538](https://github.com/bvaughn/react-virtualized/pull/538))
##### 8.9.0
- New `MultiGrid` reduces the boilerplate required to configure a `Grid` with fixed columns and/or rows.
- `defaultTableRowRenderer` passes new `rowData` param to event handlers (in addition to `index`).
- 🐛 Styles are no longer cached while scrolling for compressed lists ([@nickclaw](https://github.com/nickclaw) - [#527](https://github.com/bvaughn/react-virtualized/pull/527))
- 🐛 Cell cache is reset once `InfiniteLoader` load completes ([@nickclaw](https://github.com/nickclaw) - [#528](https://github.com/bvaughn/react-virtualized/pull/528))
- Add loose-envify support for Browserify users ([@chrisvasz](https://github.com/chrisvasz) - [#519](https://github.com/bvaughn/react-virtualized/pull/519), [#523](https://github.com/bvaughn/react-virtualized/pull/523))
- `dom-helpers` dependency relaxed to support 2.x and 3.x versions ([@danez](https://github.com/danez) - [#522](https://github.com/bvaughn/react-virtualized/pull/522))
- 🐛 `Collection` no longer drops its `overflow` style in certain conditions; see facebook/react/issues/8689 for more info.
##### 8.8.1
Fixed a bug with `Grid` style-cache that caused stale cell-sizes to be used when `Grid` resized.
##### 8.8.0
`Grid` now temporarily caches inline style objects to avoid causing shallow compare to fail unnecessarily (see [PR 506](https://github.com/bvaughn/react-virtualized/pull/506)).
`AutoSizer` internal `detectElementResize` library now no longer creates duplicate `<style>` tags when unmounted and remounted (see [PR 507](https://github.com/bvaughn/react-virtualized/pull/507)).
##### 8.7.1
Reverted part of the change introduced in version 8.6.0 that changed the behavior regarding controlled/uncontrolled `scrollTop` and `scrollLeft` props and `Grid` in a way that was not backwards compatible. (See issue #490 for more.)
##### 8.7.0
Added `updatePosition` to `WindowScroller` to handle case when header items change or resize. `WindowScroller` also better handles window resize events.
##### 8.6.1
Updated `CellSizeCache` interface for the better perfomance by removing `has` methods, reducing a double hashtable lookup to a single lookup. Special thanks to @arusakov for this contribution!
##### 8.6.0
`CellMeasurer` passes `index` param (duplicate of `rowIndex`) in order to more easily integrate with `List` by default.
`Grid` now better handles a mix of controlled and uncontrolled scroll offsets. Previously changes to one offset would wipe out the other causing cells to disappear (see PR #482). This is an edge-case bug and only impacted an uncommon usecase for `Grid`. As such this change is expected to only impact only a small percetange of users.
##### 8.5.3
Changed overscan rows/cols behavior as described [here](https://github.com/bvaughn/react-virtualized/pull/478).
This change targets performance improvements only and should have no other noticeable impact.
##### 8.5.2
Added guard against potential `null` return value from `getComputedStyle` for hidden elements (see PR #465).
##### 8.5.1
`Table` header height is no longer subtracted from overall (rows) height if header is disabled.
Thanks to @Jakehp for this contribution!
##### 8.5.0
Added `disabled` property to `ArrowKeyStepper`; when `true` this component ignores keyboard events.
##### 8.4.1
`Collection` and `Grid` now set a default `direction: ltr` style property.
Neither component gracefully handles RTL layout at the moment and so it is disabled by default.
Cells within either component can be layed out RTL without any problem though.
To do so, just add an additional `direction: rtl` style property via the cell renderer.
##### 8.4.0
`ArrowKeyStepper` incrementing behavior can now be further customized via new `mode` prop.
Default behavior will remain the same (eg `mode='edges'`).
Use `mode='cells'` to prefer smaller increments.
##### 8.3.1
Fixed `scrollToAlignment` bug in `Collection` that caused cells not to render under certain conditions.
Special thanks to @coluccini for spotting and fixing this bug!
##### 8.3.0
`cellRenderer` and `rowRenderer` callbacks now accept an additional property, `isVisible`.
This property can be used to differentiate between visible and overscanned cells.
Thanks to @mbrevda for this feature!
##### 8.2.0
Added optional `id` prop to `Collection`, `Grid`, `List`, and `Table`.
Thanks to @mnquintana for the contribution!
##### 8.1.1
Wrapped component `propTypes` with `process.env.NODE_ENV !== 'production'` so they can be stripped from production builds.
Thanks to @mbrevda for the suggestion and contribution.
##### 8.1.0
Added `containerStyle` property to `Grid`.
This property allows custom styling to be applied to the inner cell-containing div.
This can be used to enable padding within the grid.
For more context see: github.com/metabase/metabase/pull/3547
Refactored the `detect-element-resize` util to export a factory function.
This allows `AutoSizer` to import it initially but defer execution until mounted.
(Executing immediately causes problems for server-side rendering context.
Using a deferred `require` causes problems for es6 bundlers, eg Rollup.)
Fixed an edge-case that occurred for slower browsers when mounting and then quickly unmounting an `AutoSizer`.
In some cases, an animation event was left attached.
This event is now specifically checked for and removed.
Special thanks to @yb (PR #436) for this bugfix contribution.
##### 8.0.13
Replaces references to `getComputedStyle` with `window.getComputedStyle` to better support Enzyme.
Thanks to @DevinClark for the contribution!
##### 8.0.12
Added "module" entry to `package.json` in order to support ES modules with the latest Webpack.
This should enable tree-shaking support ouf of the box for Webpack.
Rollup will continue to use the "jsnext:main" entry to my knowledge.
For more info see https://github.com/dherman/defense-of-dot-js/blob/master/proposal.md
Related issues: webpack/webpack#1979, bvaughn/react-virtualized/issues/427
##### 8.0.11
Fixed an invalid export for `IS_SCROLLING_TIMEOUT` inside the `WindowScroller` module.
##### 8.0.10
Changed the embedded `detect-element-resize` library `includes` call to use `indexOf` instead for better IE compatibility.
##### 8.0.9
`scrollToColumn` and `scrollToRow` offsets will always be 0 when `Grid` size is <= 0.
Technically this is an invalid size but a 0 offset is a more meaningful return value.
Previously the min/max offset check could result in a positive offset in this case (which is invalid).
##### 8.0.8
Fixes bug in resize detector that broke scrollbar functionality in Safari.
##### 8.0.7
Fixed a small `Table` alignment issue due to conflicting `padding-right` and `width: 100%` value.
Also fixed an edge-case horiztonal scrollbar that was appearing for some tables.
##### 8.0.6
Updated the embedded `detect-element-resize` library to reduce the number of reflows it triggered.
This library was forcing reflow (to measure itself) each time a scroll event occurred within its children.
This was unnecessary since it really only cared about resizes to its expand-trigger and collapse-trigger.
I have updated it to ignore scroll events triggered by other DOM elements.
As a result of this change, `AutoSizer` no longer needs to trap bubbling "scroll" events.
This opens the door to potentially using passive scroll event handlers in the future.
It also fixes a long-standing bug that prevented scrollbars from working correctly within auto-sized-content.
##### 8.0.5
`Grid` notifies `onScroll` callback if `scrollLeft` or `scrollTop` have changed in response to prop changes (including `scrollToColumn` or `scrollToRow`).
##### 8.0.4
Fixed a small regression in the `Table` component that caused a horizontal scrollbar to appear.
##### 8.0.3
Removed unnecessary `react-router` dependency.
(This was accidentally added as to `dependencies` when it should have been in `devDependencies`).
##### 8.0.2
Improved fix for regression with scaled `Grid`s that caused position offsets to be incorrect while scrolling.
##### 8.0.1
Initial attempt at fixing regression with scaled `Grid`s that caused position offsets to be incorrect while scrolling.
# 8.0.0
Version 8 changes are described in detail on the [Version 8 Roadmap](https://github.com/bvaughn/react-virtualized/issues/386).
Upgrade instructions and [jscodeshift](https://github.com/facebook/jscodeshift) mods can be found [here](docs/upgrades/Version8.md).
##### 7.24.3
ES module build (_jsnext:main_ target) updated to depend on Babel's `transform-runtime` rather than referencing global `babelHelpers`.
This should fix support within projects like `react-boilerplate`.
##### 7.24.2
`Grid` and `Collection` now set `pointer-events: ''` (instead of _auto_) after scrolling has stopped to avoid overriding parents who may have specified `pointer-events: 'none'`.
##### 7.24.1
Refactored `AutoSizer` slightly to add support for `react-lite`.
Note that if you intend to use the UMD build of `react-lite` the following lines are required before `react-virtualized` is loaded:
```js
React.addons = {
shallowCompare(context, nextProps, nextState) {
return React.PureComponent.prototype.shouldComponentUpdate(
nextProps,
nextState,
);
},
};
ReactDOM = React;
```
##### 7.24.0
Added `autoHeight` prop to `Collection` so that it can more easily be used with `WindowScroller`.
##### 7.23.0
`Grid` scrolling timeout for pointer events can be customized now via `scrollingResetTimeInterval` property.
This defaults to 150ms (as before).
Also addressed a couple of small bugs as well:
- Multiple `WindowScroller` instances can be used on a single page now without interfering with each other's `pointer-events` settings.
- Calling `recomputeGridSize` on `Grid` (or any of its wrapping HOCs) will clear any pending cell cache to avoid edge-case issue where a scrolling `Grid` has invalid cached cells due to a change in the underlying collection data.
##### 7.22.3
While a scroll is in progress, `Grid` focuses overscan on the direction being scrolled- doubling up the number of overscanned cells.
This reduces the amount of empty space that temporarily appears when a user is quickly scrolling.
It does not increase the overall number of cells being rendered (and so does not negatively impact performance).
##### 7.22.2
In the event that size or cell count decreases for a `Grid`, remaining cells are no longer remeasured in order to verify the current scroll offset.
Instead the most recent measurements are used.
This change should positively impact performance but should have no other affect.
##### 7.22.1
`InfiniteLoader` now better handles `FlexTable` and `VirtualScroll` children by calling `forceUpdateGrid` when defined.
This prevents rows from being stuck in a visual "loading" state until a user scrolls.
##### 7.22.0
Updated the exported `defaultCellMeasurerCellSizeCache` to support configured uniform column widths and/or row heights.
This allows greater customization and flexibility than the version released in 7.21.0.
For backwards compat `uniformSizeCellMeasurerCellSizeCache` is still exported but also points to `defaultCellMeasurerCellSizeCache`.
##### 7.21.1
Lowered the `ScalingCellSizeAndPositionManager` maximum scroll threshold from 10M to 1.5M pixels to accommodate Edge's lower-than-expected `scrollTop` maximum.
##### 7.21.0
New `cellSizeCache` added for `CellMeasurer` (`uniformSizeCellMeasurerCellSizeCache`) for cells that have a _dyanmic but uniform_ width or height.
This cache will measure only a single cell and then return its width and height for all other cells.
This allows for greater performance optimization for use cases like virtualized drop-down lists, etc.
##### 7.20.0
`Collection` now temporarily caches cells while scrolling is in progress.
##### 7.19.4
Initialize `WindowScroller` height to `window.innerHeight` if component is initially rendered in the browser.
This fixes temporary zero-height that would cause previous scroll position to be lost when a user navigates back in their history.
##### 7.19.3
Improved memoization in `InfiniteLoader` to reduce repeated calls to `loadMoreRows`.
##### 7.19.2
Edge-case bug fix for `WindowScroller` when user returning to a page (via browser back button) that has already been scrolled. Previously, `WindowScroller` failed to correctly calculate its position from the top under these conditions. Now it calculates the proper position.
##### 7.19.1
`WindowScroller` auto-restores body pointer-events when unmounted to fix edge-case bug when component was unmounted during (or _right after_) scrolling.
##### 7.19.0
`CellMeasurer` now properly uses `shallowCompare`.
It also supports a custom caching strategy for measured cell sizes (see `cellSizeCache` prop).
`Collection` supports 2 new properties: `horizontalOverscanSize` and `verticalOverscanSize`.
These properties enable the `Collection` to "overscan" its content similar to how `Grid` does.
This can reduce flicker around the edges when a user scrolls quickly.
##### 7.18.1
Fixed edge-case scroll-to-cell bug in `Grid` when row or column count increases from 0 after a scroll-offset was previous assigned.
For more info see issue #218.
##### 7.18.0
Added named exports for `defaultFlexTableCellDataGetter`, `defaultFlexTableCellRenderer`, and `defaultFlexTableHeaderRenderer` due to user request.
##### 7.17.1
Fixed a `Collection` bug that could cause the `noContentRenderer` to be shown when a collection happened to contain no visible children (due to a sparse layout).
##### 7.17.0
`CellMeasurer` exposes 2 new public methods: `resetMeasurementForColumn` and `resetMeasurementForRow`.
These methods allow a finer grain of control over the cell measurement cache.
Learn more [here](docs/CellMeasurer.md#children-function).
##### 7.16.0
Added new property `autoContainerWidth` to `Grid`.
It can be used to set the width of the inner scrollable container to 'auto'.
This is useful for single-column Grids to ensure that the column doesn't extend below a vertical scrollbar.
By default this is disabled but `VirtualScroll` and `FlexTable` both enable it on their inner `Grid`s.
##### 7.15.1
Renamed `Grid` refs within `FlexTable` and `VirtualScroll` from `_grid` to `Grid`.
This is done to better support interoperability between `FlexTable` and `react-sortable-hoc` which requires a handle on the inner `Grid`.
Technically the change is not required but it is more inline with JavaScript naming conventions (since I plan to preserve this property from an Api perspective).
##### 7.15.0
Added support for greater `FlexTable` customization via a new `rowRenderer` property.
Also exported default implementation as `defaultFlexTableRowRenderer`.
Learn more [here](docs/FlexTable.md#rowrenderer).
##### 7.14.0
`WindowScroller` component passes new named argument, `isScrolling`, to its child render function.
##### 7.13.0
Added `onRowDoubleClick` support to `FlexTable`.
##### 7.12.3
`CellMeasurer` implementation changed to use `ReactDOM.unstable_renderSubtreeIntoContainer` instead of `ReactDOMServer.renderToString` in order to support `context`.
`Grid` has been changed slightly as well to calculate its visible children just before `render` (instead of in it).
This change is not expected to have any public-facing consequences beyond supporting the `context` property for `CellMeasure`d cells.
Thanks to @jquense for this contribution!
##### 7.12.2
User-specified `Grid` and `Collection` styles can now override default style options (eg overflow, height/width).
##### 7.12.1
Fixed unexpected usage of `recomputeRowHeights` / `recomputeGridSize` where method is called with an index higher than the last measured row/cell index.
Cell measurer now properly updates the value only if the requested index is lower than the most-recently-measured cell.
##### 7.12.0
`FlexTable` `rowStyle` property can now be a on Object _or_ a function similar to the `rowClassName` property.
##### 7.11.8
Fixed edge-case bug previously possible when combining the `scrollToAlignment` property with `scrollToRow` or `scrollToColumn` at the end of a collection.
Under certain circumstances this caused the grid to scroll too far; that has now been resolved.
Center-alignment logic has also been improved to better align scrolled cells.
##### 7.11.7
Removed `xmlns` property from `<svg>` tag in `SortEditor` to avoid React 15.2 property warning.
##### 7.11.6
Fixed `CellMeasurer` throws "Only a ReactOwner can have refs" error.
##### 7.11.5
Small change to inline styles for `Grid` to work around obscure bug where an initial scroll offset prop is specified before external CSS stylesheets have loaded.
##### 7.11.4
Added more pass-thru props from `VirtualScroll` to `Grid` to ensure that when `VirtualScroll` re-renders (due to changed props) so does its inner `Grid`.
Both components are still "pure" (from a shallow comparison perspective).
##### 7.11.3
Updated `Grid` and `VirtualScroll` so that the width of rows in a `VirtualScroll` does not stretch beneath a scrollbar (if one is visible).
##### 7.11.2
Added more pass-thru props from `FlexTable` to `Grid` to ensure that when `FlexTable` re-renders (due to changed props) so does its inner `Grid`.
Both components are still "pure" (from a shallow comparison perspective).
This just avoids the unintuitive use-case where some table properties (eg headers) may change while others (eg rows) do not.
##### 7.11.1
Updated UMD build to remove `react-addons-shallow-compare` from the build.
UMD users should use `react-with-addons.min.js` (should have already been using it in fact) instead of `react.min.js`.
Thanks to @ducky427 for reporting this oversight and updating the Webpack config!
##### 7.11.0
The `recomputeRowHeights` method of `FlexTable` and `VirtualScroll` accepts an optional index (defaults to 0) after which to recompute sizes.
The `recomputeGridSize` method of `Grid` accepts named `columnIndex` and `rowIndex` parameters tha function similarly.
This allows for a finer grained optimization when invalidating a collection.
If, for example, a specific row in a table has resized- it is now possible to recompute the positions of only the rows occurring after this row.
Because of the way react-virtualized just-in-time measures rows, this will also avoid re-measuring any but the visible rows at the time of the change.
If several items in the collection have changed and you are unsure of which, it is safest to recompute all columns/rows.
This remains the default behavior unless override indices are specified as parameters.
##### 7.10.0
New `gridClassName` and `gridStyle` pass-through properties added to `FlexTable`.
##### 7.9.1
Fixed edge-case bug in `FlexTable` that caused the inner `Grid` not to update when there was a vertical scrollbar.
This in turn caused headers to be misaligned.
##### 7.9.0
Added `forceUpdateGrid` method to `FlexTable` and `VirtualScroll` to enable the inner `Grid` to be udpated without resorting to recomputing cached row heights.
##### 7.8.3
`Grid` no longer checks `scrollTop` when `autoHeight=true` in order to avoid unnecessary reflows/repaints.
This change only impacts `WindowScroller` use cases.
##### 7.8.2
Fixed edge-case problem with `FlexTable` where changes to the number of children (`FlexColumn`s) didn't update the inner `Grid`.
##### 7.8.1
Reverted default `tabIndex = null` value for `Grid` (introduced in 7.8.0) due to a negative accessibility impact.
A focused `Grid` paints significantly more while scrolling which impacts FPS.
Unfortunately it is a necessity to support keyboard scrolling properly and so it's the default once more.
This can be explicitly disabled by setting `tabIndex = null` if you want.
##### 7.8.0
Scrolling performance improvements for `FlexTable` and to a lesser extent `Grid`.
The primary change to `Grid` is that `tabIndex` will be set to `null` by default instead of `0`.
This improves repainting performance when a `Grid` is being scrolled.
This release removes the `FlexTable__truncatedColumnText` wrapper column and collapses its styles into `FlexTable__rowColumn`.
If you were depending on the former class you will want to update your dependencies.
I was on the fence about this in terms of compatibility, but I feel this is more of an internal implementation detail than it is public-facing API.
This release also changes the primary `FlexTable` cell from a flex container to a block.
This means that if you were right-aligning text within a column you will need to change from `align-items: flex-end` to `text-align: right`.
##### 7.7.1
Export the `defaultCellRangeRenderer` used by `Grid` in order to enable easier composition.
##### 7.7.0
Added configurable `tabIndex` property to `Grid`, `FlexTable`, and `VirtualScroll`.
Default value remains 0 but can now be overridden.
##### 7.6.0
New property added to `Grid`, `FlexTable`, and `VirtualScroll` to enable custom CSS class name and style to be added to the outer cell decorator.
This can be used to greater customize styles as well as to better implement custom (non-flexbox) styles for IE9.
Thanks to nicholasrq@ for this contribution!
##### 7.5.0
New `WindowScroller` HOC added to enable a `FlexTable` or `VirtualScroll` component to be scrolled based on the window's scroll positions.
This can be used to create layouts similar to Facebook or Twitter news feeds.
Big thanks to minheq@ for this contribution!
##### 7.4.0
Added mouse-over and mouse-out row-level events to `FlexTable`. Thanks to @queeto for the PR!
##### 7.3.3
Fixed unintention regression in IE10 support introduced with `ScalingCellSizeAndPositionManager` extending `CellSizeAndPositionManager`.
Inheritance has been replaced with composition for this case in order to simplify IE10 compatibility.
Notice that Babel `babel-polyfill` is still required in order to support other ES5 features.
##### 7.3.2
Edge-case bug fix for `CellMeasurer` in the event that its `getRowHeight` or `getColumnWidth` method gets called before the initial render completes.
##### 7.3.1
Increased the safe-scale size from 1,000,000 to 10,000,000 to make for better UX.
##### 7.3.0
`Grid` (and its HOCs `FlexTable` and `VirtualScroll`) now support larger heights and widths than browsers support natively.
For example, the current version of Chrome will not allow users to scroll pass ~33.5M pixel offset.
To work around this limitation, `Grid` increases the density of cells, shifting them as a ratio of what the full scrollable size would be to a browser-safe size.
This should be more or less transparent to users, although in extreme cases it can lead to _really sensitive_ scroll responsiveness.
##### 7.2.0
Added new method- `measureAllCells`- to `Grid`, `FlexTable`, and `VirtualScroll` to force-measure all cells.
This supports special use-cases where deferred measuring is not desired.
Added `estimatedRowSize` property to `FlexTable` and `VirtualScroll` to be passed through to the inner `Grid`.
Also added guard to ensure the `onScroll` callback for `Collection`, `Grid`, `FlexTable`, and `VirtualScroll` is never called with a negative number.
##### 7.1.3
The inner javascript-detect-element-resize library used by `AutoSizer` now passes the proper `useCapture` value when removing listeners as well. This should prevent lingering event listeners in certain cases. Thanks to @cyberxndr for this fix.
##### 7.1.2
Added "_center_" option for `scrollToAlignment` property of `Collection`, `Grid`, `FlexTable`, and `VirtualScroll`.
Thanks to @edulan for the contribution!
Also added a check to avoid rendering content frmo `noContentRenderer` if `width` or `height` are 0.
##### 7.1.1
Resolved edge-case bug that caused the bottom/right cells in a `Grid` or `Collection` to be partially overlapped by a scrollbar.
Thanks to @anjianshi for reporting this and collaborating on the fix!
##### 7.1.0
Added `scrollToAlignment` property to `Collection`, `Grid`, `FlexTable`, and `VirtualScroll` to offer finer-grained control of how scrolled-to cells are aligned.
Default behavior ("_auto_") remains unchanged- the least amount of scrolling will occur to ensure that the specified cell is visible.
##### 7.0.5
Fixed edge-case bug where `InfiniteLoader` did not respect `minBatchSize` setting when a user was scrolling up.
##### 7.0.4
Added `scrollLeft` and `scrollTop` parameters to `cellRangeRenderer` callback for `Grid`.
##### 7.0.3
Added `box-sizing: border-box` rules to `.FlexTable__headerRow` and `.FlexTable__Grid` classes to fix edge-case scrollbar bug experienced by some users.
##### 7.0.2
Added `recomputeCellSizesAndPositions` method to `Collection` (to pass through to inner `CollectionView`).
##### 7.0.1
Replaced single occurence of `Number.isNaN` with `isNaN` to avoid IE compatibility issues.
# 7.0.0
Version 7 changes are described in detail on the [Version 7 Roadmap wiki page](https://github.com/bvaughn/react-virtualized/wiki/Version-7-Roadmap).
Upgrade instructions and [jscodeshift](https://github.com/facebook/jscodeshift) mods can also be found there.
To run a code mod, check out react-virtualized (or download the codemod) and then...
```
jscodeshift -t /path/to/react-virtualized/codemods/6-to-7/rename-properties.js source
```
##### 6.3.2
Fixed edge-case bug in `Collection` where initial `scrollLeft` and `scrollTop` would not correctly adjust inner offsets.
Thanks @edulan for the contribution!
##### 6.3.1
Added better checks against invalid style properties in `AutoSizer` to protected against the case when it is removed from the DOM immediately after being added.
##### 6.3.0
Added new `minimumBatchSize` property to `InfiniteLoader` to simplify HTTP request batching.
Fixed edge-case NPE with `AutoSizer` when it is unmounted immediately after being mounted.
##### 6.2.2
Fixed off-by-one for `InfiniteLoader` that caused it to request one too many rows when scrolled to the end of the list.
##### 6.2.1
`FlexTable` supports `true`, `false`, `undefined`, and `null` children now to more easily enable support for dynamic columns (see issue #174).
Improved edge-case handling for changes to cell counts when scroll-to-index properties have been set.
### 6.2.0
Added new `Collection` component for rendering non-checkboard data.
This component's cells can be positioned in any arrangement, even overlapping.
Note that because it has fewer constraints, `Collection` cannot compute positioning and layout data as fast as `Grid`.
##### 6.1.2
Moved `react-addons-shallow-compare` from `dependencies` to `peerDependencies`.
##### 6.1.1
Updated React dependency ranges now that 15.0 has been released.
### 6.1.0
`Grid` supports a new `renderCellRanges` property for customizing the rendering of a window of cells.
This function should implement the following signature:
```js
function renderCellRanges ({
columnMetadata:Array<Object>,
columnStartIndex: number,
columnStopIndex: number,
renderCell: Function,
rowMetadata:Array<Object>,
rowStartIndex: number,
rowStopIndex: number
}): Array<PropTypes.node>
```
##### 6.0.8
Fixed dependency ranges for `react-addons-shallow-compare` and `react-dom`.
##### 6.0.7
Added key handling to sortable `FlexTable` headers so that ENTER and SPACE keys can be used to toggle sort direction.
##### 6.0.6
Added conditional checks to when `aria-label`, `role`, and `tabIndex` get attached to `FlexTable` headers and rows.
These a11y properties are only added when on-click or sort handlers are present.
##### 6.0.5
Added `aria-label` and `role` attributes to `FlexTable`, `Grid`, and `VirtualScroll` components to fix a11y issues reported by [reactjs/react-a11y](https://github.com/reactjs/react-a11y).
Thanks to @globexdesigns for the contributions!
##### 6.0.4
Separated horiontal and vertical `Grid` metadata calculation to avoid unnecessarily recomputing row metadata for `FlexTable`s and `VirtualScroll`s when a browser's window is resized, for example.
Also replaced `columnWidth` and `rowHeight` getter uses in `Grid.render` in favor of cached cell metadata instead.
##### 6.0.3
Small update to `FlexTable` to move the `rowGetter` call outside of the column loop to reduce the number of times that method gets called.
##### 6.0.2
Added [transform-react-inline-elements](http://babeljs.io/docs/plugins/transform-react-inline-elements/) to UMD build for minor runtime performance improvements.
This change does not effect CommonJS or ES6 module builds because I did not want to remove prop-type checks.
You should apply this transformation step as part of your own production build pipeline.
##### 6.0.1
Removed lingering references to `react-pure-render` with with [`shallowCompare`](https://facebook.github.io/react/docs/shallow-compare.html).
This was meant to be part of the initial 6.0 release but was left out accidentally.
# 6.0.0
Version 6 includes the following changes.
(For more background information refer to the [Version 6 Roadmap wiki page](https://github.com/bvaughn/react-virtualized/wiki/Version-6-Roadmap).)
At a high-level the purpose of this release is to improve customization and flexibility with regard to arrow-key event handling.
### Backwards-incompatible changes
- Refactored `Grid` to remove arrow-key scroll-snapping. Instead this feature is implemented in a HOC, `ArrowKeyStepper`. The upgrade path from React 5.x to 6.x if you want to maintain arrow-key navigation behavior is as follows:
```jsx
// Before...
<Grid {...gridProps}/>
// After...
<ArrowKeyStepper
columnsCount={columnsCount}
rowsCount={rowsCount}
>
{({ onSectionRendered, scrollToColumn, scrollToRow }) => (
<Grid
columnsCount={columnsCount}
onSectionRendered={onSectionRendered}
rowsCount={rowsCount}
scrollToColumn={scrollToColumn}
scrollToRow={scrollToRow}
{...otherGridProps}
/>
)}
</ArrowKeyStepper>
```
- The following public methods have also be removed from components:
- `FlexTable`: `scrollToRow` (use `scrollToIndex` prop instead), `setScrollTop` (use `scrollTop` prop instead)
- `Grid`: `scrollToCell` (use `scrollToColumn` and `scrollToRow` props instead), `setScrollPosition` (use `scrollLeft` and `scrollTop` props instead)
- `VirtualScroll`: `scrollToRow` (use `scrollToIndex` prop instead), `setScrollTop` (use `scrollTop` prop instead)
### Backwards-compatible changes
- Replaced (the now unsupported) `react-pure-render` with [`shallowCompare`](https://facebook.github.io/react/docs/shallow-compare.html).
##### 5.5.6
Max scroll position logic in `Grid` now takes scrollbar size into consideration.
Also includes a small `render` optimization for null cells.
This release made possible by @jquense!
##### 5.5.5
Updated `package.json` to support React `^0.14.0` as well as `^15.0.0-rc.1`.
Thanks to @opichals for the PR.
##### 5.5.4
Changed key-down event handler in `VirtualScroll`, `FlexTable`, and `Grid` to no longer call `event.preventDefault()` for arrow-key events.
This was causing poor user interactions for `<input>` elements within `VirtualScroll` and `FlexTable` components.
Note that this issue still occurs for `<input>` elements in a `Grid` component.
This release also removes the `outline: 0` default style for `Grid`.
After consideration I think that's a harmful default behavior.
##### 5.5.3
Added `will-change` property to `Grid` to work around a Chrome bug(?) that caused the entire grid to be repainted whenever a new row or column was added. This was negatively impacting scrolling performance for Chrome under certain conditions. This change is not expected to impact Firefox, Safari, or IE.
Also trapped scroll events inside of `AutoSizer` so that `sdecima/javascript-detect-element-resize` did not treat them as potential resizes and unnecessarily force a sync DOM layout.
##### 5.5.2
Removed two unnecessary method calls in `Grid` and replaced them with cached properties. Should offer a minor performance boost.
Added better bounds-checking to util function `getVisibleCellIndices()`
##### 5.5.1
Removed unnecessary `setImmediate` in `Grid` initialization code.
This prevents a possible edge-case runtime error when a `Grid` is mounted and then removed before `setImmediate` is invoked.
### 5.5.0
`ScrollSync` passes additional parameters to child function in order to enable more complex scroll-driven UI changes.
### 5.4.0
Added optional `headerRenderer` property to `FlexColumn` to enable custom `FlexTable` header cells.
##### 5.3.2
Decoupled x/y axes in `Grid` when determining whether or not to enable overflow.
This results in more robustly handling issues like the one reported in PR #133.
It also comes with the small cost of partially obscuring a small part of cells (the area used by a scrollbar).
##### 5.3.1
Fixed edge-case where always-on scrollbars were not hidden once shown (see issue #116).
### 5.3.0
Separated CommonJS and UMD builds and pointed package.json's `main` target at the CommonJS build.
Also moved the ES6 modules build from `/es` to `/dist/es` to reduce the amount of clutter in the packaged dir.
##### 5.2.4
Changed `Grid` child `key` attributes again to reduce the number of elements created as a result of scrolling.
This dramatically improves perforamance without introducing any known regressions.
Thanks to @cesarandreu for consulting on this release.
##### 5.2.3
Reverted `transform: translate` positioning to old `top` / `left` positioning to address performance concerns reported via PR #124 and issue #94.
##### 5.2.2
Updated ES6 module build to be Rollup-friendly by way of `es2015-rollup` Babel preset.
Also cleaned up NPM package to suppress unnecessary files (via new `.npmignore`).
##### 5.2.1
Fixes long-standing slow wheel scrolling issue that affected certain browsers such as Firefox (see issue #2). Big thanks to James Long (@jlongster), Markus Stange (@mstange), and Dan Abramov (@gaearon) for their help with this fix.
### 5.2.0
Added optional `onResize` callback property to `AutoSizer`. This method is invoked any time the `AutoSizer` detects a resize. It is passed `width` and `height` named parameters.
Added optional `minWidth` and `maxWidth` properties to `FlexColumn` to enable greater flexibility with regard to table-column layout.
##### 5.1.1
Marked `FlexColumn` `width` property as required since ommitting this property can lead to uneven column layouts.
### 5.1.0
Added `ColumnSizer` high-order component for auto-calculating column widths for `Grid` cells.
#### 5.0.1
Added `webkit-transform` style to `Grid` cells for iOS 8 support.
# 5.0.0
Version 5 includes the following changes.
(For more background information refer to the [Version 5 Roadmap wiki page](https://github.com/bvaughn/react-virtualized/wiki/Version-5-Roadmap).)
At a high-level the purpose of this release is to make HOCs more easily composible in order to support a wider variety of them in the future.
A secondary goal was to cut redundant code from `VirtualScroll` and rely more heavily on the base `Grid` component.
###### Backwards-incompatible changes
- Refactored `FlexTable` and `VirtualScroll` to be HOCs that use `Grid` internally. This change makes `width` a required attribute for all virtualized components. A simple upgrade strategy is to use the `AutoSizer` HOC (learn more [here](docs/AutoSizer.md)).
- Changed globally exported library name (for use with vanilla `<script>` tags) to `window.ReactVirtualized` instead of `window["react-virtualized"]` (see [issue #86](https://github.com/bvaughn/react-virtualized/issues/86)).
- Removed `horizontalPadding` and `verticalPadding` properties from `FlexTable`. These properties were redundant. Such padding should be the responsibility of the parent container and taken into consideration by the injected `width` and `height`.
- Refactored `InfiniteLoader` and `AutoSizer` to require function children so as to be more easily composable with each other and new HOCs like `ScrollSync` (learn more [here](docs/usingAutoSizer.md#using-autosizer-with-infiniteloader)).
- `AutoSizer` no longer supports a `className` property or uses the global 'AutoSizer' class.
###### Backwards-compatible changes
- Added ES6 module and `jsnext:main` target to enable tree-shaking support.
- Updated `onScroll` property to specific total scrollable area so that offsets can be converted into percentages if desired (learn more [here](docs/README.md)).
- Replaced `top` / `left` cell positioning with `transform: translate()` for small performance gains. (This may become configurable in the future if any negative impact on performance is noticed.)
- Created `ScrollSync` HOC for synchronizing scrolling between two or more virtualized components (learn more [here](docs/ScrollSync.md)).
### 4.10.0
`FlexTable` and `VirtualScroll` get a new property, `overscanRowsCount`. `Grid` gets `overscanRowsCount` and `overscanColumnsCount`.
These properties can be used to reduce visual flicker around the sides of virtualized components when quickly scrolling.
`overscanRowsCount` defaults to 10 and `overscanColumnsCount` defaults to 0; adjust as necessary based on the size of your lists and cells.
`FlexTable` sets a default value of 0 for `headerHeight` to more gracefully support `disableHeader` use case.
### 4.9.0
`AutoSizer` component now takes padding into consideration before setting the `width` and `height` of its children.
##### 4.8.1
Updated `InfiniteLoader` to better reflect required properties. (`isRowLoaded`, `rowsCount`, and `threshold` were not marked as required before.)
### 4.8.0
Updated `InfiniteLoader` to support being composable within an `AutoSizer` HOC. If either a `width` or `height` attribute are specified on `InfiniteLoader` they will be bundled through to the loader's child component.
##### 4.7.1
Fixed `AutoSizer` bug that caused it to prevent parent flex containers from shrinking in some contexts.
### 4.7.0
Added `scrollToIndex` property to `FlexTable` to be passed through to inner `Grid`.
##### 4.6.6
Better guard against `NaN` values for `clientWidth` and `offsetWidth` for test environments using `jsdom`.
##### 4.6.5
Added `react-dom` to the Webpack :externals node to avoid including it in the build.
This fixes the bad `4.6.3` and `4.6.4` builds. Sorry!
##### 4.6.4
Moved `react-dom` from `dependencies` to `peerDependencies` to fix bad `4.6.3` build.
##### 4.6.3
Fixed edge-case sizing bug with `FlexTable` headers and always-on scrollbars (see issue #80 for more info).
##### 4.6.2
Replaced single occurence of `Number.isNaN` with `isNaN` to avoid IE compatibility issues. Maybe in the future I will add a polyfill dependency but I did not intend to introduce this without a major version bump so I'm removing it.
##### 4.6.1
Removes `event.stopPropagation` since it was unnecessary to prevent keyboard event bubbling, only to prevent the default browser behavior.
### 4.6.0
Relocated a couple of static style properties from inline style object to exported CSS file for easier customization.
Added `Grid__cell` and `VirtualScroll__row` classes.
### 4.5.0
Added `onScroll` callback to `Grid`, `FlexTable`, and `VirtualScroll`.
Added `scrollToCell` method to `Grid` and `scrollToRow` to `FlexTable`, and `VirtualScroll`.
##### 4.4.3
Added `-ms-flex` and `-webkit-flex` browser prefixes to `FlexTable` cells.
##### 4.4.2
Fixed invalid function reference in `Grid` triggered by specifying an initial `scrollToRow` property.
##### 4.4.1
Fixed distribution to include new `Grid` component as an export.
### 4.4.0
Added new `Grid` component for virtualizing rows _and_ columns .
Updated `AutoSizer` component to support managing _only_ `width` or `height` (in addition to both).
##### 4.3.1
Fixed small CSS property misnaming issue.
### 4.3.0
`FlexTable` now supports dynamic row-heights (in the same way as `VirtualScroll`).
##### 4.2.1
Set `VirtualScroll` default style to `width: 100%` to be more inline with default `FlexTable` behavior.
### 4.2.0
Replaced `React.cloneElement` with wrapper element in order to:
- Better support for pure function components; (they were not compatible with inline style positioning).
- Relax the requirement of `rowRenderer` having to specify a `key`.
- Support `React.PropTypes.node` children (including plain strings, numbers, etc.) instead of just elements.
### 4.1.0
Added `-webkit-overflow-scrolling: touch` for smoother inertial scrolling on mobile devices.
##### 4.0.2
Additional `columnData` parameter passed to `onHeaderClick` callback.
##### 4.0.1
Removed an unused dependency on 'inline-style-prefixer' from the `package.json`.
# 4.0.0
CSS styles have been split into their own, separately loaded stylesheet. This simplifies universal/isomorphic use cases without breaking vendor prefixing. This change means that you'll need to import the following additional file. This only needs to be done once (usually during bootstrapping).
```js
import 'react-virtualized/styles.css';
```
In this release the `width` property of the `FlexTable` component was removed. Tables will now grow to fill 100% of the width of their parent container.
The `AutoSizer`'s `ChildComponent` attribute has been removed in favor of using a regular react child. For example:
```jsx
<AutoSizer ChildComponent={VirtualScroll} {...props} />
```
Should instead be this:
```jsx
<AutoSizer>
<VirtualScroll {...props} />
</AutoSizer>
```
##### 3.1.1
New `onHeaderClick` property added to `FlexTable`. Thanks to @olslash for the contribution!
### 3.1.0
Added high-order `InfiniteLoader` component to manage just-in-time fetching of data as a user scrolls up or down in a list.
For more information about this component refer to the [API docs](https://github.com/bvaughn/react-virtualized/blob/master/docs/InfiniteLoader.md).
##### 3.0.1
Fixed small NPE when up/down arrow key was used while an empty VirtualScroll was in-focus.
# 3.0.0
CSS styles have been split into two groups: functional styles (eg. `position`, `overflow`) and presentational styles (eg. `text-transform`, `color`) and both have been converted to inline styles rather than being loaded as CSS. This was done primarily to simplify usage for universal/isomorphic rendering.
For more information on customizing styles refer to the [documentation](https://github.com/bvaughn/react-virtualized/#customizing-styles)...
### 2.8.0
Changed `Autosizer` component to support a single child instead of the `ChildComponent` property.
(For backwards compatibility purposes the `ChildComponent` property will continue to be supported.)
##### 2.7.5
Defer loading of element resize code until `componentDidMount` to avoid undefined `document` and `body` references.
This was breaking server-side rendering.
##### 2.7.4
Uglify dist build to remove dead code.
##### 2.7.2 & 2.7.3
Improved checks for undefined `document` and `window` in hopes of better supporting server-side rendering.
##### 2.7.1
Replaced invalid `rowHeight instanceof Number` check with `typeof rowHeight === 'number'` in `VirtualScroll`.
### 2.7.0
Moved `onRowsRendered` to `componentDidUpdate` (instead of `render`) to keep `render` free of side-effects.
Added tests to ensure that the callback is only invoked once per start/stop index pair (and not again unless the indices change).
##### 2.6.2
Added check for undefined `document` before accessing `attachEvent` to avoid causing problems with server-side rendering.
##### 2.6.1
Cell `title` now only set if rendered cell contents are a string. This fixes issue #35.
### 2.6.0
`VirtualScroll` and `FlexTable` now support dynamic row heights by accepting a function as the `rowHeight` property.
### 2.5.0
Added `AutoSizer` component for wrapping `FlexTable` or `VirtualScroll` and growing to fill the parent container. This should hopefully simplify usage of these components.
### 2.4.0
`FlexTable` and `VirtualScroll` offer new callback property `onRowsRendered` to be invoked with a params object `{ startIndex, stopIndex }` after rows have been rendered.
### 2.3.0
`FlexTable`'s `rowClassName` property can now be either a string or a function in order to support dynamic row classes (eg. alternating colors).
### 2.2.0
Added `onRowClick` property to `FlexTable`.
##### 2.1.1
Fixed a few minor FlexTable font styles to use relative sizes instead of custom ones
### 2.1.0
Added optional `noRowsRenderer` property to `VirtualScroll` and `FlexTable`.
This property can be used to render loading indicators or placeholder content for empty lists.
# 2.0.0
Set `shouldPureComponentUpdate` on component prototypes instead of instances.
Dropped half-ass support for React 0.13. This module has always depended on React 0.14 but it was checking in previous versions and trying to be backwards compatible with 0.13. Since that check is no longer in place, this is a major version bump (even though there is no real new functionality being added).
##### 1.0.4
Fixed package.json dependencies by moving `classnames`, `raf`, and `react-pure-render` out of `peerDependencies` and into `dependencies`.
##### 1.0.3
Same as version 1.0.2; published just to update NPM keyword and description.
##### 1.0.2
Removed default row-border styling from FlexTable and added new :rowClassName property.
##### 1.0.1
Updated to use ReactDOM.findDOMNode instead of getDOMNode (but added backwards-compatible check for < React v0.14).
# 1.0.0
Package JSON updated so that "main" entry points to `dist/react-virtualized.js` to provide easier integration for users that don't want Babel/Webpack to have to process their `node_modules` folder.
##### 0.0.4
Added keypress scrolling support.
##### 0.0.3
Added "main" entry to package.json.
##### 0.0.2
Added CSS auto-prefixing to support Safari and other, older browsers.
##### 0.0.1
Initial release.
================================================
FILE: CODE_OF_CONDUCT.md
================================================
# Code of Conduct
## When Something Happens
If you see a Code of Conduct violation, follow these steps:
1. Let the person know that what they did is not appropriate and ask them to stop and/or edit their message(s) or commits.
2. That person should immediately stop the behavior and correct the issue.
3. If this doesn’t happen, or if you're uncomfortable speaking up, [contact the maintainers](#contacting-maintainers).
4. As soon as available, a maintainer will look into the issue, and take [further action (see below)](#further-enforcement), starting with a warning, then temporary block, then long-term repo or organization ban.
When reporting, please include any relevant details, links, screenshots, context, or other information that may be used to better understand and resolve the situation.
**The maintainer team will prioritize the well-being and comfort of the recipients of the violation over the comfort of the violator.** See [some examples below](#enforcement-examples).
## Our Pledge
We encourage everyone to participate and are committed to building a community for all. Although we may not be able to satisfy everyone, we all agree that everyone is equal. Whenever a participant has made a mistake, we expect them to take responsibility for it. If someone has been harmed or offended, it is our responsibility to listen carefully and respectfully, and do our best to right the wrong.
Although this list cannot be exhaustive, we explicitly honor diversity and hope to foster an open and welcoming environment for all, regardless of age, gender, gender identity or expression, culture, ethnicity, language, national origin, political beliefs, profession, race, religion, sexual orientation, socioeconomic status, and technical ability. We will not tolerate discrimination based on any of the protected characteristics above, including participants with disabilities.
## Our Standards
Examples of behavior that contributes to creating a positive environment include:
- Using welcoming and inclusive language.
- Being respectful of differing viewpoints and experiences.
- Gracefully accepting constructive feedback.
- Focusing on what is best for the community.
- Showing empathy and kindness towards other community members.
- Encouraging and raising up your peers in the project so you can all bask in hacks and glory.
Examples of unacceptable behavior by participants include:
- The use of sexualized language or imagery and unwelcome sexual attention or advances, including when simulated online. The only exception to sexual topics is channels/spaces specifically for topics of sexual identity.
- Casual mention of slavery or indentured servitude and/or false comparisons of one's occupation or situation to slavery. Please consider using or asking about alternate terminology when referring to such metaphors in technology.
- Making light of/making mocking comments about trigger warnings and content warnings.
- Trolling, insulting/derogatory comments, and personal or political attacks.
- Public or private harassment, deliberate intimidation, or threats.
- Publishing others' private information, such as a physical or electronic address, without explicit permission. This includes any sort of "outing" of any aspect of someone's identity without their consent.
- Publishing private screenshots or quotes of interactions in the context of this project without all quoted users' _explicit_ consent.
- Publishing of private communication that doesn't have to do with reporting harrassment.
- Any of the above even when [presented as "ironic" or "joking"](https://en.wikipedia.org/wiki/Hipster_racism).
- Any attempt to present "reverse-ism" versions of the above as violations. Examples of reverse-isms are "reverse racism", "reverse sexism", "heterophobia", and "cisphobia".
- Unsolicited explanations under the assumption that someone doesn't already know it. Ask before you teach! Don't assume what people's knowledge gaps are.
- [Feigning or exaggerating surprise](https://www.recurse.com/manual#no-feigned-surprise) when someone admits to not knowing something.
- "[Well-actuallies](https://www.recurse.com/manual#no-well-actuallys)"
- Other conduct which could reasonably be considered inappropriate in a professional or community setting.
## Scope
This Code of Conduct applies both within spaces involving this project and in other spaces involving community members. This includes the repository, its Pull Requests and Issue tracker, its Twitter community, private email communications in the context of the project, and any events where members of the project are participating, as well as adjacent communities and venues affecting the project's members.
Depending on the violation, the maintainers may decide that violations of this code of conduct that have happened outside of the scope of the community may deem an individual unwelcome, and take appropriate action to maintain the comfort and safety of its members.
### Other Community Standards
As a project on GitHub, this project is additionally covered by the [GitHub Community Guidelines](https://help.github.com/articles/github-community-guidelines/).
Additionally, as a project hosted on npm, is is covered by [npm, Inc's Code of Conduct](https://www.npmjs.com/policies/conduct).
Enforcement of those guidelines after violations overlapping with the above are the responsibility of the entities, and enforcement may happen in any or all of the services/communities.
## Maintainer Enforcement Process
Once the maintainers get involved, they will follow a documented series of steps and do their best to preserve the well-being of project members. This section covers actual concrete steps.
### Contacting Maintainers
If you experience or witness unacceptable behavior—or have any other concerns—please report it by contacting us via the following methods:
- Through email:
- [brian.david.vaughn@gmail.com](mailto:brian.david.vaughn@gmail.com) (Brian Vaughn)
- [me@weiweiwu.me](mailto:me@weiweiwu.me) (Wei-Wei Wu)
All reports will be handled with discretion. In your report please include:
- Your contact information.
- Names (real, nicknames, or pseudonyms) of any individuals involved. If there are additional witnesses, please include them as well. Your account of what occurred, and if you believe the incident is ongoing. If there is a publicly available record (e.g. a mailing list archive or a public IRC logger), please include a link.
- Any additional information that may be helpful.
### Further Enforcement
If you've already followed the [initial enforcement steps](#enforcement), these are the steps maintainers will take for further enforcement, as needed:
1. Repeat the request to stop.
2. If the person doubles down, they will have offending messages removed or edited by a maintainers given an official warning. The PR or Issue may be locked.
3. If the behavior continues or is repeated later, the person will be blocked from participating for 24 hours.
4. If the behavior continues or is repeated after the temporary block, a long-term (6-12mo) ban will be used.
On top of this, maintainers may remove any offending messages, images, contributions, etc, as they deem necessary.
Maintainers reserve full rights to skip any of these steps, at their discretion, if the violation is considered to be a serious and/or immediate threat to the health and well-being of members of the community. These include any threats, serious physical or verbal attacks, and other such behavior that would be completely unacceptable in any social setting that puts our members at risk.
Members expelled from events or venues with any sort of paid attendance will not be refunded.
### Who Watches the Watchers?
Maintainers and other leaders who do not follow or enforce the Code of Conduct in good faith may face temporary or permanent repercussions as determined by other members of the project's leadership. These may include anything from removal from the maintainer team to a permanent ban from the community.
Additionally, as a project hosted on both GitHub and npm, [their own Codes of Conducts may be applied against maintainers of this project](#other-community-standards), externally of this project's procedures.
### Enforcement Examples
#### The Best Case
The vast majority of situations work out like this. This interaction is common, and generally positive.
> Alex: "Yeah I used X and it was really crazy!"
> Patt (not a maintainer): "Hey, could you not use that word? What about 'ridiculous' instead?"
> Alex: "oh sorry, sure." -> edits old comment to say "it was really confusing!"
#### The Maintainer Case
Sometimes, though, you need to get maintainers involved. Maintainers will do their best to resolve conflicts, but people who were harmed by something **will take priority**.
> Patt: "Honestly, sometimes I just really hate using \$library and anyone who uses it probably sucks at their job."
> Alex: "Whoa there, could you dial it back a bit? There's a CoC thing about attacking folks' tech use like that."
> Patt: "I'm not attacking anyone, what's your problem?"
> Alex: "@maintainers hey uh. Can someone look at this issue? Patt is getting a bit aggro. I tried to nudge them about it, but nope."
> KeeperOfCommitBits: (on issue) "Hey Patt, maintainer here. Could you tone it down? This sort of attack is really not okay in this space."
> Patt: "Leave me alone I haven't said anything bad wtf is wrong with you."
> KeeperOfCommitBits: (deletes user's comment), "@patt I mean it. Please refer to the CoC over at (URL to this CoC) if you have questions, but you can consider this an actual warning. I'd appreciate it if you reworded your messages in this thread, since they made folks there uncomfortable. Let's try and be kind, yeah?"
> Patt: "@keeperofbits Okay sorry. I'm just frustrated and I'm kinda burnt out and I guess I got carried away. I'll DM Alex a note apologizing and edit my messages. Sorry for the trouble."
> KeeperOfCommitBits: "@patt Thanks for that. I hear you on the stress. Burnout sucks :/. Have a good one!"
#### The Nope Case
> PepeTheFrog🐸: "Hi, I am a literal actual nazi and I think white supremacists are quite fashionable."
> Patt: "NOOOOPE. OH NOPE NOPE."
> Alex: "JFC NO. NOPE. @keeperofbits NOPE NOPE LOOK HERE"
> KeeperOfCommitBits: "👀 Nope. NOPE NOPE NOPE. 🔥"
> PepeTheFrog🐸 has been banned from all organization or user repositories belonging to KeeperOfCommitBits.
## Attribution
This Code of Conduct was adapted from the [Facebook Open Source Code of Conduct](https://code.facebook.com/pages/876921332402685/open-source-code-of-conduct), as well as the [WeAllJS Code of Conduct Generator](https://npm.im/weallbehave), which is based on the [WeAllJS Code of
Conduct](https://wealljs.org/code-of-conduct), which is itself based on
[Contributor Covenant](http://contributor-covenant.org), version 1.4, available
at
[http://contributor-covenant.org/version/1/4](http://contributor-covenant.org/version/1/4),
and the LGBTQ in Technology Slack [Code of
Conduct](http://lgbtq.technology/coc.html).
================================================
FILE: CONTRIBUTING.md
================================================
[Bug Reports](#bugs) | [Features Requests](#features) | [Submitting Pull Requests](#pull-requests) | [Running Local Demo](#running-local-demo) | [Running Tests](#running-tests)
# Contributing to this project
Please take a moment to review this document in order to make the contribution process easy and effective for everyone involved.
Following these guidelines helps to communicate that you respect the time of the developers managing and developing this open source project.
In return, they should reciprocate that respect in addressing your issue or assessing patches and features.
## Using the issue tracker
The issue tracker is the preferred channel for bug reports but please respect the following restrictions:
- Please **do not** use the issue tracker for personal support requests (use [Slack](https://react-virtualized.now.sh)).
- Please **do not** derail or troll issues. Keep the discussion on topic and respect the opinions of others.
<a name="bugs"></a>
## Bug reports
A bug is a _demonstrable problem_ that is caused by the code in the repository.
Good bug reports are extremely helpful - thank you!
Guidelines for bug reports:
1. **Use the GitHub issue search** — check if the issue has already been reported.
2. **Check if the issue has been fixed** — try to reproduce it using the latest `master` or development branch in the repository.
3. **Isolate the problem** — create a [reduced test case](http://css-tricks.com/reduced-test-cases/) and a live example (using a site like [Plunker](http://plnkr.co/)).
A good bug report shouldn't leave others needing to chase you up for more information.
Please try to be as detailed as possible in your report.
Which versions of react-virtualized and react are you using?
What steps will reproduce the issue? What browser(s) and OS experience the problem?
What would you expect to be the outcome?
All these details will help people to fix any potential bugs.
Example:
> Short and descriptive example bug report title
>
> A summary of the issue and the browser/OS environment in which it occurs.
> If suitable, include the steps required to reproduce the bug.
>
> 1. This is the first step
> 2. This is the second step
> 3. Further steps, etc.
>
> `<url>` - a link to the reduced test case
>
> Any other information you want to share that is relevant to the issue being reported.
> This might include the lines of code that you have identified as causing the bug,
> and potential solutions (and your opinions on their merits).
<a name="features"></a>
## Feature requests
Feature requests are welcome.
But take a moment to find out whether your idea fits with the scope and aims of the project.
It's up to _you_ to make a strong case to convince the project's developers of the merits of this feature.
Please provide as much detail and context as possible.
<a name="pull-requests"></a>
## Pull requests
Good pull requests - patches, improvements, new features - are a fantastic help.
They should remain focused in scope and avoid containing unrelated commits.
**Please ask first** before embarking on any significant pull request (e.g. implementing features, refactoring code, porting to a different language),
otherwise you risk spending a lot of time working on something that the project's developers might not want to merge into the project.
Please adhere to the coding conventions used throughout a project (indentation, accurate comments, etc.) and any other requirements (such as test coverage).
Follow this process if you'd like your work considered for inclusion in the project:
1. [Fork](http://help.github.com/fork-a-repo/) the project, clone your fork, and configure the remotes:
```bash
# Clone your fork of the repo into the current directory
git clone https://github.com/<your-username>/react-virtualized
# Navigate to the newly cloned directory
cd react-virtualized
# Assign the original repo to a remote called "upstream"
git remote add upstream https://github.com/bvaughn/react-virtualized
```
2. If you cloned a while ago, get the latest changes from upstream:
```bash
git checkout master
git pull upstream master
```
3. Install/update dependencies:
```bash
yarn install
```
4. Create a new topic branch (off the main project development branch) to
contain your feature, change, or fix:
```bash
git checkout -b <topic-branch-name>
```
5. Commit your changes in logical chunks.
Please adhere to these [git commit message guidelines](http://tbaggery.com/2008/04/19/a-note-about-git-commit-messages.html)
or your code is unlikely be merged into the main project.
Use Git's [interactive rebase](https://help.github.com/articles/interactive-rebase)
feature to tidy up your commits before making them public.
6. Locally merge (or rebase) the upstream development branch into your topic branch:
```bash
git pull [--rebase] upstream master
```
7. Push your topic branch up to your fork:
```bash
git push origin <topic-branch-name>
```
8. [Open a Pull Request](https://help.github.com/articles/using-pull-requests/)
with a clear title and description.
**IMPORTANT**: By submitting a patch, you agree to allow the project owner to license your work under the same license as that used by this project (MIT).
<a name="running-local-demo"></a>
## Running Local Demo
You can run the local demo with NPM like so:
```bash
cd <root>
yarn start
```
The local app will then be available at http://localhost:3001
<a name="running-tests"></a>
## Running Tests
All unit tests must pass before a pull request will be approved.
You can run unit tests with NPM like so:
```bash
cd <root>
yarn test
```
================================================
FILE: LICENSE
================================================
The MIT License (MIT)
Copyright (c) 2015 Brian Vaughn
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
================================================
FILE: README.md
================================================
[<img src="https://cloud.githubusercontent.com/assets/29597/11737732/0ca1e55e-9f91-11e5-97f3-098f2f8ed866.png" alt="React virtualized" data-canonical-src="https://cloud.githubusercontent.com/assets/29597/11737732/0ca1e55e-9f91-11e5-97f3-098f2f8ed866.png" width="330" height="100" />](http://bvaughn.github.io/react-virtualized/)
React components for efficiently rendering large lists and tabular data.
Check out [the demo](https://bvaughn.github.io/react-virtualized/) for some examples.
### If you like this project, 🎉 [become a sponsor](https://github.com/sponsors/bvaughn/) or ☕ [buy me a coffee](http://givebrian.coffee/)
### Sponsors
The following wonderful companies have sponsored react-virtualized:
<a href="https://www.treasuredata.com/"><img width="64" height="64" title="Treasure Data" src="https://cloud.githubusercontent.com/assets/29597/17391516/962647f8-59cb-11e6-83be-aa1bac299dd0.png"></a>
<a href="https://developer.hpe.com/"><img width="64" height="64" title="HPE Dev" src="https://user-images.githubusercontent.com/5983843/37311298-1c3a711a-261d-11e8-9129-ef1589d7063f.png"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/0/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/0/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/1/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/1/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/2/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/2/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/3/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/3/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/4/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/4/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/5/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/5/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/6/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/6/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/7/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/7/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/8/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/8/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/9/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/9/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/10/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/10/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/11/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/11/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/12/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/12/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/13/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/13/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/14/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/14/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/15/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/15/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/16/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/16/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/17/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/17/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/18/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/18/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/19/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/19/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/20/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/20/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/21/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/21/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/22/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/22/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/23/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/23/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/24/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/24/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/25/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/25/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/26/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/26/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/27/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/27/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/28/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/28/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/sponsor/29/website" target="_blank"><img src="https://opencollective.com/react-virtualized/sponsor/29/avatar.svg"></a>
[Learn more about becoming a sponsor!](https://opencollective.com/react-virtualized#sponsor)
<a href="https://opencollective.com/react-virtualized/backer/0/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/0/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/1/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/1/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/2/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/2/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/3/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/3/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/4/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/4/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/5/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/5/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/6/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/6/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/7/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/7/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/8/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/8/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/9/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/9/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/10/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/10/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/11/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/11/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/12/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/12/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/13/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/13/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/14/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/14/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/15/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/15/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/16/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/16/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/17/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/17/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/18/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/18/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/19/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/19/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/20/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/20/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/21/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/21/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/22/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/22/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/23/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/23/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/24/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/24/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/25/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/25/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/26/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/26/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/27/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/27/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/28/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/28/avatar.svg"></a>
<a href="https://opencollective.com/react-virtualized/backer/29/website" target="_blank"><img src="https://opencollective.com/react-virtualized/backer/29/avatar.svg"></a>
## A word about `react-window`
If you're considering adding `react-virtualized` to a project, take a look at [`react-window`](https://github.com/bvaughn/react-window) as a possible lighter-weight alternative. [Learn more about how the two libraries compare here.](https://github.com/bvaughn/react-window#how-is-react-window-different-from-react-virtualized)
## Getting started
Install `react-virtualized` using npm.
```shell
npm install react-virtualized --save
```
ES6, CommonJS, and UMD builds are available with each distribution.
For example:
```js
// Most of react-virtualized's styles are functional (eg position, size).
// Functional styles are applied directly to DOM elements.
// The Table component ships with a few presentational styles as well.
// They are optional, but if you want them you will need to also import the CSS file.
// This only needs to be done once; probably during your application's bootstrapping process.
import 'react-virtualized/styles.css';
// You can import any component you want as a named export from 'react-virtualized', eg
import {Column, Table} from 'react-virtualized';
// But if you only use a few react-virtualized components,
// And you're concerned about increasing your application's bundle size,
// You can directly import only the components you need, like so:
import AutoSizer from 'react-virtualized/dist/commonjs/AutoSizer';
import List from 'react-virtualized/dist/commonjs/List';
```
Note webpack 4 makes this optimization itself, see the [documentation](https://webpack.js.org/guides/tree-shaking/#mark-the-file-as-side-effect-free).
If the above syntax looks too cumbersome, or you import react-virtualized components from a lot of places, you can also configure a Webpack alias. For example:
```js
// Partial webpack.config.js
{
alias: {
'react-virtualized/List': 'react-virtualized/dist/es/List',
},
...rest
}
```
Then you can just import like so:
```js
import List from 'react-virtualized/List';
// Now you can use <List {...props} />
```
You can also use a global-friendly UMD build:
```html
<link rel="stylesheet" href="path-to-react-virtualized/styles.css" />
<script src="path-to-react-virtualized/dist/umd/react-virtualized.js"></script>
```
Now you're ready to start using the components.
You can learn more about which components react-virtualized has to offer [below](#documentation).
## Dependencies
React Virtualized has very few dependencies and most are managed by NPM automatically.
However the following peer dependencies must be specified by your project in order to avoid version conflicts:
[`react`](https://www.npmjs.com/package/react),
[`react-dom`](https://www.npmjs.com/package/react-dom).
NPM will not automatically install these for you but it will show you a warning message with instructions on how to install them.
## Pure Components
By default all react-virtualized components use [`shallowCompare`](https://facebook.github.io/react/docs/shallow-compare.html) to avoid re-rendering unless props or state has changed.
This occasionally confuses users when a collection's data changes (eg `['a','b','c']` => `['d','e','f']`) but props do not (eg `array.length`).
The solution to this is to let react-virtualized know that something external has changed.
This can be done a couple of different ways.
###### Pass-thru props
The `shallowCompare` method will detect changes to any props, even if they aren't declared as `propTypes`.
This means you can also pass through additional properties that affect cell rendering to ensure changes are detected.
For example, if you're using `List` to render a list of items that may be re-sorted after initial render- react-virtualized would not normally detect the sort operation because none of the properties it deals with change.
However you can pass through the additional sort property to trigger a re-render.
For example:
```js
<List {...listProps} sortBy={sortBy} />
```
###### Public methods
`Grid` and `Collection` components can be forcefully re-rendered using [`forceUpdate`](https://facebook.github.io/react/docs/component-api.html#forceupdate).
For `Table` and `List`, you'll need to call [`forceUpdateGrid`](https://github.com/bvaughn/react-virtualized/blob/master/docs/Table.md#forceupdategrid) to ensure that the inner `Grid` is also updated. For `MultiGrid`, you'll need to call [`forceUpdateGrids`](https://github.com/bvaughn/react-virtualized/blob/master/docs/MultiGrid.md#forceupdategrids) to ensure that the inner `Grid`s are updated.
## Documentation
API documentation available [here](docs/README.md).
There are also a couple of how-to guides:
- [Customizing classes and styles](docs/customizingStyles.md)
- [Displaying items in reverse order](docs/reverseList.md)
- [Using AutoSizer](docs/usingAutoSizer.md)
- [Creating an infinite-loading list](docs/creatingAnInfiniteLoadingList.md)
- [Natural sort Table](docs/tableWithNaturalSort.md)
- [Sorting a Table by multiple columns](docs/multiColumnSortTable.md)
## Examples
Examples for each component can be seen in [the documentation](docs/README.md).
Here are some online demos of each component:
- [ArrowKeyStepper](https://bvaughn.github.io/react-virtualized/#/components/ArrowKeyStepper)
- [AutoSizer](https://bvaughn.github.io/react-virtualized/#/components/AutoSizer)
- [CellMeasurer](https://bvaughn.github.io/react-virtualized/#/components/CellMeasurer)
- [Collection](https://bvaughn.github.io/react-virtualized/#/components/Collection)
- [ColumnSizer](https://bvaughn.github.io/react-virtualized/#/components/ColumnSizer)
- [Grid](https://bvaughn.github.io/react-virtualized/#/components/Grid)
- [InfiniteLoader](https://bvaughn.github.io/react-virtualized/#/components/InfiniteLoader)
- [List](https://bvaughn.github.io/react-virtualized/#/components/List)
- [Masonry](https://bvaughn.github.io/react-virtualized/#/components/Masonry)
- [MultiGrid](https://bvaughn.github.io/react-virtualized/#/components/MultiGrid)
- [ScrollSync](https://bvaughn.github.io/react-virtualized/#/components/ScrollSync)
- [Table](https://bvaughn.github.io/react-virtualized/#/components/Table)
- [WindowScroller](https://bvaughn.github.io/react-virtualized/#/components/WindowScroller)
And here are some "recipe" type demos:
- [Table with resizable (drag and drop) columns](https://codesandbox.io/s/j30k46l7xw)
- [Collapsable tree view](https://rawgit.com/bvaughn/react-virtualized/master/playground/tree.html)
- [Full-page grid (spreadsheet)](https://rawgit.com/bvaughn/react-virtualized/master/playground/grid.html)
- [Dynamic cell measuring](https://rawgit.com/bvaughn/react-virtualized/master/playground/chat.html)
- [Cell hover effects](https://rawgit.com/bvaughn/react-virtualized/master/playground/hover.html)
## Supported Browsers
react-virtualized aims to support all evergreen browsers and recent mobile browsers for iOS and Android. IE 9+ is also supported (although IE 9 will require some user-defined, custom CSS since flexbox layout is not supported).
If you find a browser-specific problem, please report it along with a repro case. The easiest way to do this is probably by forking [this Plunker](https://plnkr.co/edit/6syKo8cx3RfoO96hXFT1).
## Friends
Here are some great components built on top of react-virtualized:
- [react-infinite-calendar](https://github.com/clauderic/react-infinite-calendar): Infinite scrolling date-picker with localization, themes, keyboard support, and more
- [react-sortable-hoc](https://github.com/clauderic/react-sortable-hoc): Higher-order components to turn any list into an animated, touch-friendly, sortable list
- [react-sortable-tree](https://github.com/fritz-c/react-sortable-tree): Drag-and-drop sortable representation of hierarchical data
- [react-virtualized-checkbox](https://github.com/emilebres/react-virtualized-checkbox): Checkbox group component with virtualization for large number of options
- [react-virtualized-select](https://github.com/bvaughn/react-virtualized-select): Drop-down menu for React with windowing to support large numbers of options.
- [react-virtualized-tree](https://github.com/diogofcunha/react-virtualized-tree/): A reactive tree component that aims to render large sets of tree structured data in an elegant and performant way
- [react-timeline-9000](https://github.com/BHP-DevHub/react-timeline-9000/): A calendar timeline component that is capable of displaying and interacting with a large number of items
## Contributions
Use [GitHub issues](https://github.com/bvaughn/react-virtualized/issues) for requests.
I actively welcome pull requests; learn how to [contribute](https://github.com/bvaughn/react-virtualized/blob/master/CONTRIBUTING.md).
## Changelog
Changes are tracked in the [changelog](https://github.com/bvaughn/react-virtualized/blob/master/CHANGELOG.md).
## License
_react-virtualized_ is available under the MIT License.
================================================
FILE: codemods/6-to-7/rename-properties.js
================================================
'use strict'
// Renames react-virtualized version 6.x properties to be version-7 compatible
module.exports = function transformer (file, api) {
const jscodeshift = api.jscodeshift
let source = file.source
// Rename variable references
for (var property in propertyRenameMap) {
source = jscodeshift(source)
.findVariableDeclarators(property)
.renameTo(propertyRenameMap[property])
.toSource()
}
// Rename JSX attributes
source = jscodeshift(source)
.find(jscodeshift.JSXAttribute)
.filter(shouldAttributeBeRenamed)
.replaceWith(renameReactVirtualizedAttribute)
.toSource()
return source
}
const reactVirtualizedElementNames = [
'ArrowKeyStepper',
'AutoSizer',
'Collection',
'ColumnSizer',
'FlexTable',
'Grid',
'ScrollSync',
'VirtualScroll'
]
// @param path jscodeshift.JSXAttribute
const attributeBelongsToReactVirtualizedElement = path => reactVirtualizedElementNames.includes(path.parent.value.name.name)
// See https://github.com/bvaughn/react-virtualized/wiki/Version-7-Roadmap#clean-up-property-names
const propertyRenameMap = {
cellClassName: 'className',
columnsCount: 'columnCount',
overscanColumnsCount: 'overscanColumnCount',
overscanRowsCount: 'overscanRowCount',
renderCell: 'cellRenderer',
renderCellRanges: 'cellRangeRenderer',
rowsCount: 'rowCount'
}
// @param path jscodeshift.JSXAttribute
const shouldAttributeBeRenamed = path => attributeBelongsToReactVirtualizedElement(path) && isAttributeInPropertyRenameMap(path)
// @param path jscodeshift.JSXAttribute
const isAttributeInPropertyRenameMap = path => propertyRenameMap.hasOwnProperty(path.value.name.name)
// @param path jscodeshift.JSXAttribute
const renameReactVirtualizedAttribute = path => {
path.value.name.name = propertyRenameMap[path.value.name.name] || path.value.name.name
return path.node
}
================================================
FILE: codemods/7-to-8/rename-components.js
================================================
const renameMap = {
FlexColumn: 'Column',
FlexTable: 'Table',
VirtualScroll: 'List'
}
module.exports = function transformer (file, api) {
const j = api.jscodeshift
return j(file.source)
.find(j.Identifier)
.filter(
identifier => !!renameMap[identifier.value.name]
)
.replaceWith(
identifier => j.identifier(renameMap[identifier.node.name])
)
.toSource()
}
================================================
FILE: docs/ArrowKeyStepper.md
================================================
## ArrowKeyStepper
High-order component that decorates another virtualized component and responds to arrow-key events by scrolling one row or column at a time.
This provides a snap-to behavior rather than the default browser scrolling behavior.
Note that unlike the other HOCs in react-virtualized, the `ArrowKeyStepper` adds a `<div>` element around its children in order to attach a key-down event handler.
The appearance of this wrapper element can be customized using the `className` property.
### Prop Types
| Property | Type | Required? | Description |
| :--------------- | :----------------- | :-------: | :----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| children | Function | ✓ | Function responsible for rendering children. This function should implement the following signature: `({ onSectionRendered: Function, scrollToColumn: number, scrollToRow: number }) => PropTypes.element` |
| className | String | | CSS class name to attach to the wrapper `<div>`. |
| columnCount | Number | ✓ | Number of columns in grid; for `Table` and `List` this property should always be `1`. |
| disabled | Boolean | | Disables all scrolling using arrow-keys; defaults to `false` |
| isControlled | Boolean | | This component is "controlled"; it will not update `scrollToColumn` or `scrollToRow`. This property should be used with `onScrollToChange`. |
| mode | "edges" or "cells" | | Controls behavior of stepper when arrow key direction changes. "cells" means that the index will only increment or decrement by 1; "edges" (default) means that the opposite side of the grid will be incremented. |
| onScrollToChange | Function | | Called when arrow key navigation should update the current scroll-to values. |
| rowCount | Number | ✓ | Number of rows in grid. |
| scrollToColumn | Number | | Optional default/initial `scrollToColumn` value |
| scrollToRow | Number | | Optional default/initial `scrollToRow` value |
### Public Methods
##### setScrollIndexes ({ scrollToColumn: number, scrollToRow: number })
Override the local state of the component with new values for `scrollToRow` and `scrollToColumn`.
### Children function
The child function is passed the following named parameters:
| Parameter | Type | Description |
| :---------------- | :------- | :--------------------------------------------------------------------------------------------------------------------------- |
| onSectionRendered | Function | Pass-through callback to be attached to child component; informs the key-stepper which range of cells are currently visible. |
| scrollToColumn | Number | Specifies which column in the child component should be visible |
| scrollToRow | Number | Specifies which row in the child component should be visible |
### Examples
You can decorate any virtualized component (eg. `Table`, `Grid`, or `List`) with arrow-key snapping like so:
```javascript
import React from 'react';
import ReactDOM from 'react-dom';
import {ArrowKeyStepper, Grid} from 'react-virtualized';
import 'react-virtualized/styles.css'; // only needs to be imported once
ReactDOM.render(
<ArrowKeyStepper columnCount={columnCount} rowCount={rowCount}>
{({onSectionRendered, scrollToColumn, scrollToRow}) => (
<Grid
columnCount={columnCount}
onSectionRendered={onSectionRendered}
rowCount={rowCount}
scrollToColumn={scrollToColumn}
scrollToRow={scrollToRow}
{...otherGridProps}
/>
)}
</ArrowKeyStepper>,
document.getElementById('example'),
);
```
================================================
FILE: docs/AutoSizer.md
================================================
## AutoSizer
High-order component that automatically adjusts the width and height of a single child.
### Prop Types
| Property | Type | Required? | Description |
| :------------ | :------- | :-------: | :-------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| children | Function | ✓ | Function responsible for rendering children. This function should implement the following signature: `({ height: number, width: number }) => PropTypes.element` |
| className | String | | Optional custom CSS class name to attach to root `AutoSizer` element. This is an advanced property and is not typically necessary. |
| defaultHeight | Number | | Height passed to child for initial render; useful for server-side rendering. This value will be overridden with an accurate height after mounting. |
| defaultWidth | Number | | Width passed to child for initial render; useful for server-side rendering. This value will be overridden with an accurate width after mounting. |
| disableHeight | Boolean | | Fixed `height`; if specified, the child's `height` property will not be managed |
| disableWidth | Boolean | | Fixed `width`; if specified, the child's `width` property will not be managed |
| nonce | String | | Nonce of the inlined stylesheets for [Content Security Policy](https://www.w3.org/TR/2016/REC-CSP2-20161215/#script-src-the-nonce-attribute) |
| onResize | Function | | Callback to be invoked on-resize; it is passed the following named parameters: `({ height: number, width: number })`. |
| style | Object | | Optional custom inline style to attach to root `AutoSizer` element. This is an advanced property and is not typically necessary. |
### Examples
Many react-virtualized components require explicit dimensions but sometimes you just want a component to just grow to fill all of the available space.
The `AutoSizer` component can be useful in this case.
One word of caution about using `AutoSizer` with flexbox containers.
Flex containers don't prevent their children from growing and `AutoSizer` greedily grows to fill as much space as possible.
Combining the two can cause a loop.
The simple way to fix this is to nest `AutoSizer` inside of a `block` element (like a `<div>`) rather than putting it as a direct child of the flex container.
Read more about common `AutoSizer` questions [here](usingAutoSizer.md).
```javascript
import React from 'react';
import ReactDOM from 'react-dom';
import {AutoSizer, List} from 'react-virtualized';
import 'react-virtualized/styles.css'; // only needs to be imported once
// List data as an array of strings
const list = [
'Brian Vaughn',
// And so on...
];
function rowRenderer({key, index, style}) {
return (
<div key={key} style={style}>
{list[index]}
</div>
);
}
// Render your list
ReactDOM.render(
<AutoSizer>
{({height, width}) => (
<List
height={height}
rowCount={list.length}
rowHeight={20}
rowRenderer={rowRenderer}
width={width}
/>
)}
</AutoSizer>,
document.getElementById('example'),
);
```
================================================
FILE: docs/CellMeasurer.md
================================================
## CellMeasurer
High-order component that automatically measures a cell's contents by temporarily rendering it in a way that is not visible to the user.
Specify a fixed width to measure dynamic height (or vice versa).
This is an advanced component and has some limitations and performance considerations.
[See below for more information](#limitations-and-performance-considerations).
`CellMeasurer` can be used with `Grid`, `List`, and `Table` components. It is not intended to be used with the `Collection` component.
### Prop Types
| Property | Type | Required? | Description |
| :---------- | :------------------ | :-------: | :----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| cache | `CellMeasurerCache` | ✓ | Cache to be shared between `CellMeasurer` and its parent `Grid`. Learn more [here](#cellmeasurercache). |
| children | Element or Function | ✓ | Either a React element as a child (eg `<div />`) or a function (eg. `({ measure, registerChild }) => <div ref={registerChild} />`). See [below](#using-cellmeasurer-with-images) for more detailed examples. |
| columnIndex | number | ✓ | Index of column being measured (within the parent `Grid`) or 0 (if used within a `List` or `Table`). |
| parent | `Grid` | ✓ | Reference to the parent `Grid`; this value is passed by `Grid` to the `cellRenderer` and should be passed along as-is. |
| rowIndex | number | ✓ | Index of row being measured (within the parent `Grid`). |
### Render Props
| Property | Type | Description |
| :------------ | :------- | :----------------------------------------------------------------------------------------------------------------------------- |
| measure | Function | Perform the cell measurements. |
| registerChild | Function | Specify DOM element to be measured, can be used as a `ref` (by default `WindowScroller` uses `ReactDOM.findDOMNode` function). |
### CellMeasurerCache
The `CellMeasurerCache` stores `CellMeasurer` measurements and shares them with a parent `Grid`.
It should be configured based on the type of measurements you need. It accepts the following parameters:
### Prop Types
| Property | Type | Required? | Description |
| :------------ | :-------- | :-------: | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| defaultHeight | number | | Unmeasured cells will initially report this height |
| defaultWidth | number | | Unmeasured cells will initially report this width |
| fixedHeight | boolean | | Rendered cells will have a fixed height, dynamic width |
| fixedWidth | boolean | | Rendered cells will have a fixed width, dynamic height |
| minHeight | number | | Derived row height (of multiple cells) should not be less than this value |
| minWidth | number | | Derived column width (of multiple cells) should not be less than this value |
| keyMapper | KeyMapper | | Enables more intelligent mapping of a given column and row index to an item ID. This prevents a cell cache from being invalidated when its parent collection is modified. `(rowIndex: number, columnIndex: number) => any` |
Note that while all of the individual parameters above are optional, you must supply at least some of them.
`CellMeasurerCache` is not meant to measure cells that are both dynamic width _and_ height.
It would be inefficient to do so since the size of a row (or column) is equal to the largest cell within that row.
See [below](#limitations-and-performance-considerations) for more information.
### `CellMeasurerCache` Public Methods
##### clear (rowIndex: number, columnIndex: number)
Reset cached measurements for a specific cell.
This should be called when a cell needs to be re-measured to handle dynamic content (eg. replacing a loading indicator with loaded content or reacting to state-changes for stateful cells).
##### clearAll ()
Reset cached measurements for all cells.
This method should be called when a `Grid`, `List` or `Table` needs to reflow content due to a resizing event for a responsive layout (eg. a window width resize may have an impact on the height of cells).
### Examples
###### Grid
This example shows a `Grid` with fixed row heights and dynamic column widths.
For more examples check out the component [demo page](https://bvaughn.github.io/react-virtualized/#/components/CellMeasurer).
```jsx
import React from 'react';
import { CellMeasurer, CellMeasurerCache, Grid } from 'react-virtualized';
// In this example, average cell width is assumed to be about 100px.
// This value will be used for the initial `Grid` layout.
// Cell measurements smaller than 75px should also be rounded up.
// Height is not dynamic.
const cache = new CellMeasurerCache({
defaultWidth: 100,
minWidth: 75,
fixedHeight: true
});
function cellRenderer ({ columnIndex, key, parent, rowIndex, style }) {
const content // Derive this from your data somehow
return (
<CellMeasurer
cache={cache}
columnIndex={columnIndex}
key={key}
parent={parent}
rowIndex={rowIndex}
>
<div
style={{
...style,
height: 35,
whiteSpace: 'nowrap'
}}
>
{content}
</div>
</CellMeasurer>
);
}
function renderGrid (props) {
return (
<Grid
{...props}
columnWidth={cache.columnWidth}
deferredMeasurementCache={cache}
cellRenderer={cellRenderer}
/>
);
}
```
##### Using `registerChild`
By default, `CellMeasurer` uses `findDOMNode` to access the DOM element to measure.
This API is [deprecated in React `StrictMode`](https://reactjs.org/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage), so you may want to avoid its usage.
As an alternative, you can use `registerChild` render prop to specify the element, e.g. by passing as a `ref`.
```jsx
import React from 'react';
import { CellMeasurer, CellMeasurerCache, Grid } from 'react-virtualized';
// In this example, average cell width is assumed to be about 100px.
// This value will be used for the initial `Grid` layout.
// Cell measurements smaller than 75px should also be rounded up.
// Height is not dynamic.
const cache = new CellMeasurerCache({
defaultWidth: 100,
minWidth: 75,
fixedHeight: true
});
function cellRenderer ({ columnIndex, key, parent, rowIndex, style }) {
const content // Derive this from your data somehow
return (
<CellMeasurer
cache={cache}
columnIndex={columnIndex}
key={key}
parent={parent}
rowIndex={rowIndex}
>
{({registerChild}) => (
<div
style={{
...style,
height: 35,
whiteSpace: 'nowrap'
}}
>
{content}
</div>
)}
</CellMeasurer>
);
}
function renderGrid (props) {
return (
<Grid
{...props}
columnWidth={cache.columnWidth}
deferredMeasurementCache={cache}
cellRenderer={cellRenderer}
/>
);
}
```
###### Using `CellMeasurer` with images
This example shows how you might use the `CellMeasurer` component along with the `List` component in order to display dynamic-height rows.
The difference between this example and the above example is that the height of the row is not determined until image data has loaded.
To support this, a function-child is passed to `CellMeasurer` which then receives `measure` and `registerChild` parameters.
`measure` should be called when cell content is ready to be measured (in this case, when the image has loaded).
```jsx
import React from 'react';
import { CellMeasurer, CellMeasurerCache, List } from 'react-virtualized';
// In this example, average cell height is assumed to be about 50px.
// This value will be used for the initial `Grid` layout.
// Width is not dynamic.
const cache = new CellMeasurerCache({
defaultHeight: 50,
fixedWidth: true
});
function rowRenderer ({ index, isScrolling, key, parent, style }) {
const source // This comes from your list data
return (
<CellMeasurer
cache={cache}
columnIndex={0}
key={key}
parent={parent}
rowIndex={index}
>
{({ measure, registerChild }) => (
// 'style' attribute required to position cell (within parent List)
<div ref={registerChild} style={style}>
<img
onLoad={measure}
src={source}
/>
</div>
)}
</CellMeasurer>
);
}
function renderList (props) {
return (
<List
{...props}
deferredMeasurementCache={cache}
rowHeight={cache.rowHeight}
rowRenderer={rowRenderer}
/>
);
}
```
###### Using `CellMeasurer` with equal dynamic cell heights or widths
```jsx
// Normally, every cell gets measured individually and is very slow.
// However, with the keyMapper prop we can specify a constant return value and
// tell CellMeasurer that all measurements after the first one will hit the
// cache and we get a speedy solution.
const cache = new CellMeasurerCache({
defaultHeight: 30,
fixedWidth: true,
keyMapper: () => 1,
});
```
### Limitations and Performance Considerations
###### Performance
Measuring a column's width requires measuring all rows in order to determine the widest occurrence of that column.
The same is true in reverse for measuring a row's height.
For this reason it may not be a good idea to use this HOC for `Grid`s containing a large number of both columns _and_ cells.
Since this component measures one cell at a time to determine its width/height, it will likely be slow if a user skips many rows (or columns) at once by scrolling with a scrollbar or via a scroll-to-cell prop.
There is (unfortunately) no workaround for this performance limitation at the moment.
================================================
FILE: docs/Collection.md
================================================
## Collection
Renders scattered or non-linear data.
Unlike `Grid`, which renders checkerboard data, `Collection` can render arbitrarily positioned- even overlapping- data.
**Note** that this component's measuring and layout phase is more expensive than `Grid` since it can not assume a correlation between a cell's index and position. For this reason it will take significantly longer to initialize than the more linear/checkerboard components.
### Prop Types
| Property | Type | Required? | Description |
| :------------------------ | :------- | :-------: | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| autoHeight | Boolean | | Outer `height` of `Collection` is set to "auto". This property should only be used in conjunction with the `WindowScroller` HOC. |
| className | String | | Optional custom CSS class name to attach to root `Collection` element. |
| cellCount | Number | ✓ | Number of cells in collection. |
| cellGroupRenderer | Function | | Responsible for rendering a group of cells given their indices.: `({ cellSizeAndPositionGetter:Function, indices: Array<number>, cellRenderer: Function }): Array<PropTypes.node>` |
| cellRenderer | Function | ✓ | Responsible for rendering a cell given an row and column index: `({ index: number, isScrolling: boolean, key: string, style: object }): PropTypes.element` |
| cellSizeAndPositionGetter | Function | ✓ | Callback responsible for returning size and offset/position information for a given cell (index): `({ index: number }): { height: number, width: number, x: number, y: number }` |
| height | Number | ✓ | Height of Collection; this property determines the number of visible (vs virtualized) rows. |
| horizontalOverscanSize | Number | | Enables the `Collection` to horizontally "overscan" its content similar to how `Grid` does. This can reduce flicker around the edges when a user scrolls quickly. This property defaults to `0`; |
| id | String | | Optional custom id to attach to root `Collection` element. |
| noContentRenderer | Function | | Optional renderer to be rendered inside the grid when `cellCount` is 0: `(): PropTypes.node` |
| onSectionRendered | Function | | Callback invoked with information about the section of the Collection that was just rendered: `({ indices: Array<number> }): void` |
| onScroll | Function | | Callback invoked whenever the scroll offset changes within the inner scrollable region: `({ clientHeight: number, clientWidth: number, scrollHeight: number, scrollLeft: number, scrollTop: number, scrollWidth: number }): void` |
| scrollLeft | Number | | Horizontal offset |
| scrollToAlignment | String | | Controls the alignment of scrolled-to-cells. The default ("_auto_") scrolls the least amount possible to ensure that the specified cell is fully visible. Use "_start_" to always align cells to the top/left of the `Collection` and "_end_" to align them bottom/right. Use "_center_" to align specified cell in the middle of container. |
| scrollToCell | Number | | Cell index to ensure visible (by scrolling if necessary) |
| scrollTop | Number | | Vertical offset |
| sectionSize | Number | | Optionally override the size of the sections a Collection's cells are split into. This is an advanced option and should only be used for performance tuning purposes. |
| style | Object | | Optional custom inline style to attach to root Collection element. |
| verticalOverscanSize | Number | | Enables the `Collection` to vertically "overscan" its content similar to how `Grid` does. This can reduce flicker around the edges when a user scrolls quickly. This property defaults to `0`; |
| width | Number | ✓ | Width of Collection; this property determines the number of visible (vs virtualized) columns. |
### Public Methods
##### recomputeCellSizesAndPositions
Recomputes cell sizes and positions.
This function should be called if cell sizes or positions have changed but nothing else has.
Since Collection only receives `cellCount` (and not the underlying List or Array) it has no way of detecting when the underlying data changes.
### Class names
The Collection component supports the following static class names
| Property | Description |
| :------------------------------------------------- | :-------------------- |
| ReactVirtualized\_\_Collection | Main (outer) element |
| ReactVirtualized**Collection**innerScrollContainer | Inner scrollable area |
### Examples
Below is a very basic `Collection` example. It displays an array of objects with fixed row and column sizes.
[See here](../source/Collection/Collection.example.js) for a more full-featured example.
```jsx
import React from 'react';
import ReactDOM from 'react-dom';
import {Collection} from 'react-virtualized';
import 'react-virtualized/styles.css'; // only needs to be imported once
// Collection data as an array of objects
const list = [
{name: 'Brian Vaughn', x: 13, y: 34, width: 123, height: 234},
// And so on...
];
function cellRenderer({index, key, style}) {
return (
<div key={key} style={style}>
{list[index].name}
</div>
);
}
function cellSizeAndPositionGetter({index}) {
const datum = list[index];
return {
height: datum.height,
width: datum.width,
x: datum.x,
y: datum.y,
};
}
// Render your grid
ReactDOM.render(
<Collection
cellCount={list.length}
cellRenderer={cellRenderer}
cellSizeAndPositionGetter={cellSizeAndPositionGetter}
height={300}
width={300}
/>,
document.getElementById('example'),
);
```
================================================
FILE: docs/Column.md
================================================
## Column
Describes the header and cell contents of a table column.
#### Prop Types
| Property | Type | Required? | Description |
| :------------------- | :-------------------------------- | :-------: | :-------------------------------------------------------------------------------------------------------------------------------------------- |
| cellDataGetter | Function | | Callback responsible for returning a cell's data, given its `dataKey`. [Learn more](#celldatagetter) |
| cellRenderer | Function | | Callback responsible for rendering a cell's contents. [Learn more](#cellrenderer) |
| className | String | | CSS class to apply to rendered cell container |
| columnData | Object | | Additional data passed to this column's `cellDataGetter`. Use this object to relay action-creators or relational data. |
| dataKey | any | ✓ | Uniquely identifies the row-data attribute corresponding to this cell (eg this might be "name" in an array of user objects). |
| defaultSortDirection | [SortDirection](SortDirection.md) | | Default sort order when clicked for the first time. Valid options include "ASC" and "DESC". Defaults to "ASC" |
| disableSort | Boolean | | If sort is enabled for the table at large, disable it for this column |
| flexGrow | Number | | Flex grow style; defaults to 0 |
| flexShrink | Number | | Flex shrink style; defaults to 1 |
| headerClassName | String | | CSS class to apply to this column's header |
| headerRenderer | Function | | Optional callback responsible for rendering a column's header column. [Learn more](#headerrenderer) |
| headerStyle | Object | | Optional inline style to apply to this column's header |
| id | String | | Optional id to set on the column header; used for [`aria-describedby`](https://www.w3.org/TR/wai-aria/states_and_properties#aria-describedby) |
| label | Node | | Header label for this column |
| maxWidth | Number | | Maximum width of column; this property will only be used if :flexGrow is greater than 0 |
| minWidth | Number | | Minimum width of column |
| style | Object | | Optional inline style to apply to rendered cell container |
| width | Number | ✓ | Flex basis (width) for this column; This value can grow or shrink based on `flexGrow` and `flexShrink` properties |
#### cellDataGetter
Callback responsible for returning a cell's data, given its `dataKey`.
It should implement the following signature:
```javascript
function ({
columnData: any,
dataKey: string,
rowData: any
}): any
```
A [default `cellDataGetter`](https://github.com/bvaughn/react-virtualized/blob/master/source/Table/defaultCellDataGetter.js) is provided that simply returns the attribute as a String.
This function expects to operate on either a vanilla Object or a Map-like object with a get method.
You should override this default method if your data is calculated or requires any custom processing.
#### cellRenderer
Callback responsible for rendering a cell's contents.
It should implement the following signature:
```javascript
function ({
cellData: any,
columnData: any,
columnIndex: number,
dataKey: string,
isScrolling: boolean,
rowData: any,
rowIndex: number
}): node
```
A [default `cellRenderer`](https://github.com/bvaughn/react-virtualized/blob/master/source/Table/defaultCellRenderer.js) is provided that displays an attribute as a simple string
You should override this default method if your data is some other type of object or requires custom formatting.
#### headerRenderer
Callback responsible for rendering a cell's header column.
It should implement the following signature:
```javascript
function ({
columnData: any,
dataKey: string,
disableSort: boolean,
label: any,
sortBy: string,
sortDirection: SortDirection
}): element
```
A [default `headerRenderer`](https://github.com/bvaughn/react-virtualized/blob/master/source/Table/defaultHeaderRenderer.js) is provided that displays the column `label` along with a sort indicator if the column is sort-enabled and active.
You should override this default method if you want to customize the appearance of table columns.
================================================
FILE: docs/ColumnSizer.md
================================================
## ColumnSizer
High-order component that auto-calculates column-widths for `Grid` cells.
### Prop Types
| Property | Type | Required? | Description |
| :------------- | :------- | :-------: | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| children | Function | ✓ | Function responsible for rendering a virtualized Grid. This function should implement the following signature: `({ adjustedWidth: number, getColumnWidth: Function, registerChild: Function }) => PropTypes.element` |
| columnMaxWidth | Number | | Optional maximum allowed column width |
| columnMinWidth | Number | | Optional minimum allowed column width |
| width | Number | ✓ | Width of Grid or `Table` child |
### Children function
The child function is passed the following named parameters:
| Parameter | Type | Description |
| :------------- | :------- | :--------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| adjustedWidth | Number | This number reflects the lesser of the overall `Grid` width or the width of all columns. Use this to make your `Grid` shrink to fit sparse content. |
| columnWidth | Number | This value should be passed to the `Grid`'s `columnWidth` property. |
| getColumnWidth | Function | This value can be passed to the `Grid`'s `columnWidth` property but it's recommended that you use the `columnWidth` property instead. This is a legacy property. |
| registerChild | Function | This function should be set as the child's `ref` property. It enables a set of rows to be refreshed once their data has finished loading. |
### Examples
This example displays a `Grid` that shrinks to fit sparse content (using the `adjustedWidth` parameter). An interactive demo of this component can be seen [here](https://bvaughn.github.io/react-virtualized/#/components/ColumnSizer).
```javascript
import React from 'react';
import ReactDOM from 'react-dom';
import {ColumnSizer, Grid} from 'react-virtualized';
import 'react-virtualized/styles.css'; // only needs to be imported once
// numColumns, numRows, someCalculatedHeight, and someCalculatedWidth determined here...
// Render your list
ReactDOM.render(
<ColumnSizer
columnMaxWidth={100}
columnMinWidth={50}
columnCount={numColumns}
width={someCalculatedWidth}>
{({adjustedWidth, getColumnWidth, registerChild}) => (
<Grid
ref={registerChild}
columnWidth={getColumnWidth}
columnCount={numColumns}
height={someCalculatedHeight}
cellRenderer={someCellRenderer}
rowHeight={50}
rowCount={numRows}
width={adjustedWidth}
/>
)}
</ColumnSizer>,
document.getElementById('example'),
);
```
================================================
FILE: docs/Grid.md
================================================
## Grid
A windowed grid of elements. `Grid` only renders cells necessary to fill itself based on the current horizontal and vertical scroll position. A simple `Grid` example can be seen [here](#basic-grid-example).
### Prop Types
| Property | Type | Required? | Description |
| :------------------------- | :----------------- | :-------: | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| autoContainerWidth | Boolean | | Set the width of the inner scrollable container to 'auto'. This is useful for single-column Grids to ensure that the column doesn't extend below a vertical scrollbar. |
| autoHeight | Boolean | | Outer `height` of `Grid` is set to "auto". This property should only be used in conjunction with the `WindowScroller` HOC. |
| autoWidth | Boolean | | Outer `width` of `Grid` is set to "auto". This property should only be used in conjunction with the `WindowScroller` HOC. |
| cellRangeRenderer | Function | | Responsible for rendering a group of cells given their index ranges. [Learn more](#cellrangerenderer) |
| cellRenderer | Function | ✓ | Responsible for rendering a cell given an row and column index. [Learn more](#cellrenderer) |
| className | String | | Optional custom CSS class name to attach to root `Grid` element. |
| columnCount | Number | ✓ | Number of columns in grid. |
| columnWidth | Number or Function | ✓ | Either a fixed column width (number) or a function that returns the width of a column given its index: `({ index: number }): number`. If function is used, specify `estimatedColumnSize` for more consistent scrolling behavior. |
| containerProps | Object | | Responsible for adding props to the cell-container, i.e. `onWheel`. |
| containerRole | string | | ARIA role for the cell-container; defaults to "rowgroup" |
| containerStyle | Object | | Optional custom inline style to attach to inner cell-container element. |
| deferredMeasurementCache | `CellMeasurer` | | If CellMeasurer is used to measure this Grid's children, this should be a pointer to its CellMeasurerCache. A shared CellMeasurerCache reference enables Grid and CellMeasurer to share measurement data. |
| estimatedColumnSize | Number | | Used to estimate the total width of a `Grid` before all of its columns have actually been measured. The estimated total width is adjusted as columns are rendered. |
| estimatedRowSize | Number | | Used to estimate the total height of a `Grid` before all of its rows have actually been measured. The estimated total height is adjusted as rows are rendered. |
| height | Number | ✓ | Height of Grid; this property determines the number of visible (vs virtualized) rows. |
| id | String | | Optional custom id to attach to root `Grid` element. |
| isScrolling | Boolean | | Override internal is-scrolling state tracking. This property is primarily intended for use with the WindowScroller component. |
| isScrollingOptOut | Boolean | | Prevents re-rendering of visible cells on scroll end. |
| noContentRenderer | Function | | Optional renderer to be rendered inside the grid when either `rowCount` or `columnCount` is empty: `(): PropTypes.node` |
| onSectionRendered | Function | | Callback invoked with information about the section of the Grid that was just rendered. This callback is only invoked when visible rows have changed: `({ columnOverscanStartIndex: number, columnOverscanStopIndex: number, columnStartIndex: number, columnStopIndex: number, rowOverscanStartIndex: number, rowOverscanStopIndex: number, rowStartIndex: number, rowStopIndex: number }): void` |
| onScroll | Function | | Callback invoked whenever the scroll offset changes within the inner scrollable region: `({ clientHeight: number, clientWidth: number, scrollHeight: number, scrollLeft: number, scrollTop: number, scrollWidth: number }): void` |
| onScrollbarPresenceChange | Function | | Called whenever a horizontal or vertical scrollbar is added or removed: `({ horizontal: boolean, size: number, vertical: boolean }): void` |
| overscanColumnCount | Number | | Number of columns to render before/after the visible slice of the grid. This can help reduce flickering during scrolling on certain browsers/devices. See [here](overscanUsage.md) for an important note about this property. |
| overscanIndicesGetter | Function | | Responsible for calculating the number of cells to overscan before and after a specified range [Learn more](#overscanindicesgetter) |
| overscanRowCount | Number | | Number of rows to render above/below the visible slice of the grid. This can help reduce flickering during scrolling on certain browsers/devices. See [here](overscanUsage.md) for an important note about this property. |
| role | String | | Optional override of ARIA role default; defaults to `grid`. |
| rowCount | Number | ✓ | Number of rows in grid. |
| rowHeight | Number or Function | ✓ | Either a fixed row height (number) or a function that returns the height of a row given its index: `({ index: number }): number`. If function is used, specify `estimatedRowSize` for more consistent scrolling behavior. |
| scrollingResetTimeInterval | Number | | Wait this amount of time after the last scroll event before resetting Grid `pointer-events`; defaults to 150ms. |
| scrollLeft | Number | | Horizontal offset |
| scrollToAlignment | String | | Controls the alignment of scrolled-to-cells. The default ("_auto_") scrolls the least amount possible to ensure that the specified cell is fully visible. Use "_start_" to always align cells to the top/left of the `Grid` and "_end_" to align them bottom/right. Use "_center_" to align specified cell in the middle of container. |
| scrollToColumn | Number | | Column index to ensure visible (by forcefully scrolling if necessary). Takes precedence over `scrollLeft`. |
| scrollToRow | Number | | Row index to ensure visible (by forcefully scrolling if necessary). Takes precedence over `scrollTop`. |
| scrollTop | Number | | Vertical offset |
| style | Object | | Optional custom inline style to attach to root `Grid` element. |
| tabIndex | Number | | Optional override of tab index default; defaults to `0`. |
| width | Number | ✓ | Width of Grid; this property determines the number of visible (vs virtualized) columns. |
### Public Methods
##### getOffsetForCell ({ alignment: ?string, columnIndex: ?number, rowIndex: ?number })
Gets offsets for a given cell and alignment.
##### getTotalRowsHeight
Gets estimated total rows' height.
##### getTotalColumnsWidth
Gets estimated total columns' width.
##### handleScrollEvent ({ scrollLeft, scrollTop })
This method handles a scroll event originating from an external scroll control.
It's an advanced method and should probably not be used unless you're implementing a custom scroll-bar solution.
##### measureAllCells
Pre-measure all columns and rows in a `Grid`.
Typically cells are only measured as needed and estimated sizes are used for cells that have not yet been measured.
This method ensures that the next call to getTotalSize() returns an exact size (as opposed to just an estimated one).
##### recomputeGridSize ({ columnIndex: number, rowIndex: number })
Recomputes row heights and column widths after the specified index (both default to 0).
This function should be called if dynamic column or row sizes have changed but nothing else has.
Since `Grid` only receives `columnCount` and `rowCount` it has no way of detecting when the underlying data changes.
This method will also force a render cycle (via `forceUpdate`) to ensure that the updated measurements are reflected in the rendered grid.
##### scrollToCell ({ columnIndex: number, rowIndex: number })
Ensure column and row are visible.
This method can be used to safely scroll back to a cell that a user has scrolled away from even if it was previously scrolled to.
##### scrollToPosition ({ scrollLeft, scrollTop })
Scroll to the specified offset(s).
Useful for animating position changes.
### Class names
The Grid component supports the following static class names
| Property | Description |
| :------------------------------------------- | :-------------------- |
| ReactVirtualized\_\_Grid | Main (outer) element |
| ReactVirtualized**Grid**innerScrollContainer | Inner scrollable area |
### cellRangeRenderer
This is an advanced property.
It is useful for situations where the `Grid` requires additional, overlayed UI (such as a Gantt chart or a calendar application).
Many use cases can be solved more easily using the `onScroll` callback or the `ScrollSync` HOC.
If you do want to override `cellRangeRenderer` the easiest way is to decorate the default implementation like so:
```jsx
import {defaultCellRangeRenderer, Grid} from 'react-virtualized';
function cellRangeRenderer(props) {
const children = defaultCellRangeRenderer(props);
children.push(<div>My custom overlay</div>);
return children;
}
function CustomizedGrid(props) {
return <Grid cellRangeRenderer={cellRangeRenderer} {...props} />;
}
```
If you require greater customization, you may want to fork the [`defaultCellRangeRenderer`](https://github.com/bvaughn/react-virtualized/blob/master/source/Grid/defaultCellRangeRenderer.js) function.
This function accepts the following named parameters:
```js
function cellRangeRenderer({
cellCache, // Temporary cell cache used while scrolling
cellRenderer, // Cell renderer prop supplied to Grid
columnSizeAndPositionManager, // @see CellSizeAndPositionManager,
columnStartIndex, // Index of first column (inclusive) to render
columnStopIndex, // Index of last column (inclusive) to render
horizontalOffsetAdjustment, // Horizontal pixel offset (required for scaling)
isScrolling, // The Grid is currently being scrolled
rowSizeAndPositionManager, // @see CellSizeAndPositionManager,
rowStartIndex, // Index of first row (inclusive) to render
rowStopIndex, // Index of last row (inclusive) to render
scrollLeft, // Current horizontal scroll offset of Grid
scrollTop, // Current vertical scroll offset of Grid
styleCache, // Temporary style (size & position) cache used while scrolling
verticalOffsetAdjustment, // Vertical pixel offset (required for scaling)
}) {
const renderedCells = [];
for (let rowIndex = rowStartIndex; rowIndex <= rowStopIndex; rowIndex++) {
// This contains :offset (top) and :size (height) information for the cell
let rowDatum = rowSizeAndPositionManager.getSizeAndPositionOfCell(rowIndex);
for (
let columnIndex = columnStartIndex;
columnIndex <= columnStopIndex;
columnIndex++
) {
// This contains :offset (left) and :size (width) information for the cell
let columnDatum = columnSizeAndPositionManager.getSizeAndPositionOfCell(
columnIndex,
);
// Be sure to adjust cell position in case the total set of cells is too large to be supported by the browser natively.
// In this case, Grid will shift cells as a user scrolls to increase cell density.
let left = columnDatum.offset + horizontalOffsetAdjustment;
let top = rowDatum.offset + verticalOffsetAdjustment;
// The rest of the information you need to render the cell are contained in the data.
// Be sure to provide unique :key attributes.
let key = `${rowIndex}-${columnIndex}`;
let height = rowDatum.size;
let width = columnDatum.size;
// Now render your cell and additional UI as you see fit.
// Add all rendered children to the :renderedCells Array.
}
}
return renderedCells;
}
```
### overscanIndicesGetter
This is an advanced property.
This function is responsible for calculating the number of cells to overscan before and after a specified range. By default, React Virtualized optimizes the number of cells to overscan based on scroll direction. If you'd like to customize this behavior, you may want to fork the [`defaultOverscanIndicesGetter`](https://github.com/bvaughn/react-virtualized/blob/master/source/Grid/defaultOverscanIndicesGetter.js) function.
```js
function overscanIndicesGetter({
direction, // One of "horizontal" or "vertical"
cellCount, // Number of rows or columns in the current axis
scrollDirection, // 1 (forwards) or -1 (backwards)
overscanCellsCount, // Maximum number of cells to over-render in either direction
startIndex, // Begin of range of visible cells
stopIndex, // End of range of visible cells
}) {
return {
overscanStartIndex: Math.max(0, startIndex - overscanCellsCount),
overscanStopIndex: Math.min(cellCount - 1, stopIndex + overscanCellsCount),
};
}
```
### cellRenderer
Responsible for rendering a single cell, given its row and column index.
This function accepts the following named parameters:
```jsx
function cellRenderer({
columnIndex, // Horizontal (column) index of cell
isScrolling, // The Grid is currently being scrolled
isVisible, // This cell is visible within the grid (eg it is not an overscanned cell)
key, // Unique key within array of cells
parent, // Reference to the parent Grid (instance)
rowIndex, // Vertical (row) index of cell
style, // Style object to be applied to cell (to position it);
// This must be passed through to the rendered cell element.
}) {
// Grid data is a 2d array in this example...
const user = list[rowIndex][columnIndex];
// If cell content is complex, consider rendering a lighter-weight placeholder while scrolling.
const content = isScrolling ? '...' : <User user={user} />;
// Style is required since it specifies how the cell is to be sized and positioned.
// React Virtualized depends on this sizing/positioning for proper scrolling behavior.
// By default, the grid component provides the following style properties:
// position
// left
// top
// height
// width
// You can add additional class names or style properties as you would like.
// Key is also required by React to more efficiently manage the array of cells.
return (
<div key={key} style={style}>
{content}
</div>
);
}
```
### Basic `Grid` Example
Below is a very basic `Grid` example. The grid displays an array of objects with fixed row and column sizes. (Dynamic sizes are also supported but this example is intended to be basic.) [See here](../source/Grid/Grid.example.js) for a more full-featured example with dynamic cell sizes and more.
```jsx
import React from 'react';
import ReactDOM from 'react-dom';
import {Grid} from 'react-virtualized';
// Grid data as an array of arrays
const list = [
['Brian Vaughn', 'Software Engineer', 'San Jose', 'CA', 95125 /* ... */],
// And so on...
];
function cellRenderer({columnIndex, key, rowIndex, style}) {
return (
<div key={key} style={style}>
{list[rowIndex][columnIndex]}
</div>
);
}
// Render your grid
ReactDOM.render(
<Grid
cellRenderer={cellRenderer}
columnCount={list[0].length}
columnWidth={100}
height={300}
rowCount={list.length}
rowHeight={30}
width={300}
/>,
document.getElementById('example'),
);
```
================================================
FILE: docs/InfiniteLoader.md
================================================
## InfiniteLoader
A component that manages just-in-time fetching of data as a user scrolls up or down in a list.
Note that this component is intended to assist with row-loading.
As such it is best suited for use with `Table` and `List` (although it can also be used with `Grid`).
This component is not compatible with the `Collection` component.
This is an advanced component and can be confusing in certain situations.
[See below for more information](#edge-cases-and-considerations).
### Prop Types
| Property | Type | Required? | Description |
| :--------------- | :------- | :-------: | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| children | Function | ✓ | Function responsible for rendering a virtualized component. This function should implement the following signature: `({ onRowsRendered: Function, registerChild: Function }) => PropTypes.element`
gitextract_s_hdht1l/ ├── .babelrc.js ├── .circleci/ │ └── config.yml ├── .eslintignore ├── .eslintrc ├── .flowconfig ├── .github/ │ ├── ISSUE_TEMPLATE/ │ │ ├── bug-report.md │ │ ├── feature-request.md │ │ └── question.md │ ├── PULL_REQUEST_TEMPLATE.md │ └── workflows/ │ └── stale.yml ├── .gitignore ├── .nvmrc ├── .prettierrc ├── .watchmanconfig ├── CHANGELOG.md ├── CODE_OF_CONDUCT.md ├── CONTRIBUTING.md ├── LICENSE ├── README.md ├── codemods/ │ ├── 6-to-7/ │ │ └── rename-properties.js │ └── 7-to-8/ │ └── rename-components.js ├── docs/ │ ├── ArrowKeyStepper.md │ ├── AutoSizer.md │ ├── CellMeasurer.md │ ├── Collection.md │ ├── Column.md │ ├── ColumnSizer.md │ ├── Grid.md │ ├── InfiniteLoader.md │ ├── List.md │ ├── Masonry.md │ ├── MultiGrid.md │ ├── README.md │ ├── ScrollSync.md │ ├── SortDirection.md │ ├── Table.md │ ├── WindowScroller.md │ ├── creatingAnInfiniteLoadingList.md │ ├── customizingStyles.md │ ├── multiColumnSortTable.md │ ├── overscanUsage.md │ ├── reverseList.md │ ├── tableWithNaturalSort.md │ ├── upgrades/ │ │ └── Version8.md │ └── usingAutoSizer.md ├── index.html ├── jest-puppeteer.config.js ├── jest.config.js ├── package.json ├── playground/ │ ├── chat-no-resize.html │ ├── chat-no-resize.js │ ├── chat.html │ ├── chat.js │ ├── grid-test.html │ ├── grid-test.js │ ├── grid.html │ ├── grid.js │ ├── helper.js │ ├── hover.html │ ├── hover.js │ ├── render-counters.html │ ├── render-counters.js │ ├── scroll-sync.html │ ├── scroll-sync.js │ ├── table.html │ ├── table.js │ ├── tests.js │ ├── tree.html │ ├── tree.js │ └── utils.js ├── postcss.config.js ├── rollup.config.js ├── source/ │ ├── ArrowKeyStepper/ │ │ ├── ArrowKeyStepper.example.css │ │ ├── ArrowKeyStepper.example.js │ │ ├── ArrowKeyStepper.jest.js │ │ ├── ArrowKeyStepper.js │ │ ├── index.js │ │ └── types.js │ ├── AutoSizer/ │ │ ├── AutoSizer.example.css │ │ ├── AutoSizer.example.js │ │ ├── AutoSizer.jest.js │ │ ├── AutoSizer.js │ │ ├── AutoSizer.ssr.js │ │ └── index.js │ ├── CellMeasurer/ │ │ ├── CellMeasurer.DynamicHeightGrid.example.js │ │ ├── CellMeasurer.DynamicHeightList.example.js │ │ ├── CellMeasurer.DynamicHeightTableColumn.example.js │ │ ├── CellMeasurer.DynamicWidthGrid.example.js │ │ ├── CellMeasurer.DynamicWidthMultiGrid.example.js │ │ ├── CellMeasurer.example.css │ │ ├── CellMeasurer.example.js │ │ ├── CellMeasurer.jest.js │ │ ├── CellMeasurer.js │ │ ├── CellMeasurerCache.jest.js │ │ ├── CellMeasurerCache.js │ │ ├── index.js │ │ └── types.js │ ├── Collection/ │ │ ├── Collection.example.css │ │ ├── Collection.example.js │ │ ├── Collection.jest.js │ │ ├── Collection.js │ │ ├── CollectionView.js │ │ ├── Section.jest.js │ │ ├── Section.js │ │ ├── SectionManager.jest.js │ │ ├── SectionManager.js │ │ ├── TestData.js │ │ ├── index.js │ │ ├── types.js │ │ └── utils/ │ │ ├── calculateSizeAndPositionData.jest.js │ │ └── calculateSizeAndPositionData.js │ ├── ColumnSizer/ │ │ ├── ColumnSizer.example.css │ │ ├── ColumnSizer.example.js │ │ ├── ColumnSizer.jest.js │ │ ├── ColumnSizer.js │ │ └── index.js │ ├── Grid/ │ │ ├── Grid.example.css │ │ ├── Grid.example.js │ │ ├── Grid.jest.js │ │ ├── Grid.js │ │ ├── Grid.ssr.js │ │ ├── accessibilityOverscanIndicesGetter.jest.js │ │ ├── accessibilityOverscanIndicesGetter.js │ │ ├── defaultCellRangeRenderer.js │ │ ├── defaultOverscanIndicesGetter.jest.js │ │ ├── defaultOverscanIndicesGetter.js │ │ ├── index.js │ │ ├── types.js │ │ └── utils/ │ │ ├── CellSizeAndPositionManager.jest.js │ │ ├── CellSizeAndPositionManager.js │ │ ├── ScalingCellSizeAndPositionManager.jest.js │ │ ├── ScalingCellSizeAndPositionManager.js │ │ ├── calculateSizeAndPositionDataAndUpdateScrollOffset.jest.js │ │ ├── calculateSizeAndPositionDataAndUpdateScrollOffset.js │ │ ├── maxElementSize.js │ │ ├── updateScrollIndexHelper.jest.js │ │ └── updateScrollIndexHelper.js │ ├── InfiniteLoader/ │ │ ├── InfiniteLoader.example.css │ │ ├── InfiniteLoader.example.js │ │ ├── InfiniteLoader.jest.js │ │ ├── InfiniteLoader.js │ │ └── index.js │ ├── List/ │ │ ├── List.example.css │ │ ├── List.example.js │ │ ├── List.jest.js │ │ ├── List.js │ │ ├── index.js │ │ └── types.js │ ├── Masonry/ │ │ ├── Masonry.example.css │ │ ├── Masonry.example.js │ │ ├── Masonry.jest.js │ │ ├── Masonry.js │ │ ├── PositionCache.js │ │ ├── createCellPositioner.js │ │ └── index.js │ ├── MultiGrid/ │ │ ├── CellMeasurerCacheDecorator.js │ │ ├── MultiGrid.example.css │ │ ├── MultiGrid.example.js │ │ ├── MultiGrid.jest.js │ │ ├── MultiGrid.js │ │ └── index.js │ ├── ScrollSync/ │ │ ├── ScrollSync.example.css │ │ ├── ScrollSync.example.js │ │ ├── ScrollSync.jest.js │ │ ├── ScrollSync.js │ │ └── index.js │ ├── Table/ │ │ ├── Column.jest.js │ │ ├── Column.js │ │ ├── SortDirection.js │ │ ├── SortIndicator.js │ │ ├── Table.example.css │ │ ├── Table.example.js │ │ ├── Table.jest.js │ │ ├── Table.js │ │ ├── createMultiSort.jest.js │ │ ├── createMultiSort.js │ │ ├── defaultCellDataGetter.js │ │ ├── defaultCellRenderer.js │ │ ├── defaultHeaderRenderer.js │ │ ├── defaultHeaderRowRenderer.js │ │ ├── defaultRowRenderer.js │ │ ├── index.js │ │ └── types.js │ ├── TestUtils.js │ ├── WindowScroller/ │ │ ├── WindowScroller.e2e.js │ │ ├── WindowScroller.example.css │ │ ├── WindowScroller.example.js │ │ ├── WindowScroller.header-resize.e2e.js │ │ ├── WindowScroller.jest.js │ │ ├── WindowScroller.js │ │ ├── WindowScroller.ssr.js │ │ ├── index.js │ │ └── utils/ │ │ ├── dimensions.js │ │ └── onScroll.js │ ├── demo/ │ │ ├── Application.css │ │ ├── Application.js │ │ ├── ComponentLink.css │ │ ├── ComponentLink.js │ │ ├── ContentBox.css │ │ ├── ContentBox.js │ │ ├── Icon.css │ │ ├── Icon.js │ │ ├── LabeledInput.css │ │ ├── LabeledInput.js │ │ ├── NavLink.css │ │ ├── NavLink.js │ │ ├── Wizard/ │ │ │ ├── Generator.js │ │ │ ├── Wizard.css │ │ │ ├── Wizard.js │ │ │ └── index.js │ │ ├── index.js │ │ └── utils.js │ ├── index.js │ ├── jest-setup.js │ ├── utils/ │ │ ├── TestHelper.js │ │ ├── animationFrame.js │ │ ├── createCallbackMemoizer.jest.js │ │ ├── createCallbackMemoizer.js │ │ ├── getUpdatedOffsetForIndex.jest.js │ │ ├── getUpdatedOffsetForIndex.js │ │ ├── initCellMetadata.js │ │ └── requestAnimationTimeout.js │ └── vendor/ │ ├── binarySearchBounds.js │ ├── detectElementResize.js │ └── intervalTree.js ├── webpack.config.demo.js └── webpack.config.dev.js
SYMBOL INDEX (591 symbols across 113 files)
FILE: playground/chat-no-resize.js
function rowRenderer (line 8) | function rowRenderer(params) {
function cellRenderer (line 35) | function cellRenderer(params) {
FILE: playground/chat.js
function rowRenderer (line 8) | function rowRenderer(params) {
function cellRenderer (line 35) | function cellRenderer(params) {
FILE: playground/grid-test.js
function cellRenderer (line 1) | function cellRenderer(params) {
FILE: playground/grid.js
function getColumnWidth (line 4) | function getColumnWidth(params) {
function cellRenderer (line 15) | function cellRenderer(params) {
FILE: playground/helper.js
function loadStyle (line 1) | function loadStyle(source, callback) {
function loadScript (line 9) | function loadScript(source) {
function loadScriptsAndStyles (line 16) | function loadScriptsAndStyles(source) {
function loadReact (line 37) | function loadReact() {
FILE: playground/hover.js
method _cellRenderer (line 29) | _cellRenderer(params) {
FILE: playground/render-counters.js
class ListExample (line 4) | class ListExample extends PureComponent {
method render (line 5) | render() {
method _rowRenderer (line 18) | _rowRenderer({index, isScrolling, key, style}) {
class Row (line 27) | class Row extends PureComponent {
method constructor (line 28) | constructor(props, context) {
method render (line 38) | render() {
FILE: playground/scroll-sync.js
function cellRenderer (line 1) | function cellRenderer(params) {
FILE: playground/table.js
constant NUM_COLUMNS (line 1) | const NUM_COLUMNS = 40;
function rowGetter (line 3) | function rowGetter(params) {
FILE: playground/tests.js
function createScrollingTestCase (line 1) | function createScrollingTestCase(component) {
FILE: playground/tree.js
function renderItem (line 93) | function renderItem(item, keyPrefix) {
function getExpandedItemCount (line 134) | function getExpandedItemCount(item) {
function setRef (line 149) | function setRef(ref) {
function cellRenderer (line 153) | function cellRenderer(params) {
function rowHeight (line 165) | function rowHeight(params) {
function createRandomizedData (line 189) | function createRandomizedData() {
function createRandomizedItem (line 199) | function createRandomizedItem(depth) {
FILE: playground/utils.js
function getUrlParams (line 1) | function getUrlParams() {
function getUrlParam (line 16) | function getUrlParam(key) {
FILE: source/ArrowKeyStepper/ArrowKeyStepper.example.js
method if (line 200) | if (event.target instanceof HTMLInputElement) {
FILE: source/ArrowKeyStepper/ArrowKeyStepper.jest.js
function renderTextContent (line 7) | function renderTextContent(scrollToColumn, scrollToRow) {
function ChildComponent (line 11) | function ChildComponent({scrollToColumn, scrollToRow}) {
function renderHelper (line 16) | function renderHelper(props = {}) {
function assertCurrentScrollTo (line 42) | function assertCurrentScrollTo(node, scrollToColumn, scrollToRow) {
FILE: source/ArrowKeyStepper/ArrowKeyStepper.js
class ArrowKeyStepper (line 39) | class ArrowKeyStepper extends React.PureComponent<Props, State> {
method State (line 65) | State> {
method if (line 70) | if (
FILE: source/AutoSizer/AutoSizer.example.js
class AutoSizerExample (line 19) | class AutoSizerExample extends React.PureComponent<{}, State> {
FILE: source/AutoSizer/AutoSizer.jest.js
function DefaultChildComponent (line 6) | function DefaultChildComponent({height, width, foo, bar}) {
function getMarkup (line 13) | function getMarkup({
function mockOffsetSize (line 68) | function mockOffsetSize(width, height) {
function simulateResize (line 118) | async function simulateResize({element, height, width}) {
FILE: source/AutoSizer/AutoSizer.js
class AutoSizer (line 52) | class AutoSizer extends React.Component<Props, State> {
FILE: source/CellMeasurer/CellMeasurer.DynamicHeightGrid.example.js
class DynamicHeightGrid (line 9) | class DynamicHeightGrid extends React.PureComponent {
method constructor (line 17) | constructor(props, context) {
method render (line 28) | render() {
method _cellRenderer (line 48) | _cellRenderer({columnIndex, key, parent, rowIndex, style}) {
FILE: source/CellMeasurer/CellMeasurer.DynamicHeightList.example.js
class DynamicHeightList (line 9) | class DynamicHeightList extends React.PureComponent {
method constructor (line 16) | constructor(props, context) {
method render (line 27) | render() {
method _rowRenderer (line 44) | _rowRenderer({index, key, parent, style}) {
FILE: source/CellMeasurer/CellMeasurer.DynamicHeightTableColumn.example.js
class DynamicHeightTableColumn (line 9) | class DynamicHeightTableColumn extends React.PureComponent {
method render (line 22) | render() {
FILE: source/CellMeasurer/CellMeasurer.DynamicWidthGrid.example.js
class DynamicWidthGrid (line 9) | class DynamicWidthGrid extends React.PureComponent {
method constructor (line 17) | constructor(props, context) {
method render (line 28) | render() {
method _cellRenderer (line 48) | _cellRenderer({columnIndex, key, parent, rowIndex, style}) {
FILE: source/CellMeasurer/CellMeasurer.DynamicWidthMultiGrid.example.js
class DynamicWidthMultiGrid (line 9) | class DynamicWidthMultiGrid extends React.PureComponent {
method constructor (line 17) | constructor(props, context) {
method render (line 29) | render() {
method _cellRenderer (line 51) | _cellRenderer({columnIndex, key, parent, rowIndex, style}) {
FILE: source/CellMeasurer/CellMeasurer.example.js
class CellMeasurerExample (line 26) | class CellMeasurerExample extends React.PureComponent {
method constructor (line 31) | constructor(props, context) {
method render (line 41) | render() {
method _onClick (line 103) | _onClick(id) {
function getClassName (line 110) | function getClassName({columnIndex, rowIndex}) {
function getContent (line 118) | function getContent({index, datum, long = true}) {
function Tab (line 129) | function Tab({children, currentTab, id, onClick}) {
FILE: source/CellMeasurer/CellMeasurer.jest.js
function mockClientWidthAndHeight (line 11) | function mockClientWidthAndHeight(
function createParent (line 34) | function createParent({cache, invalidateCellSizeAfterRender = jest.fn()}...
function renderHelper (line 43) | function renderHelper({
method children (line 176) | children({registerChild}) {
method children (line 210) | children({registerChild}) {
FILE: source/CellMeasurer/CellMeasurer.js
class CellMeasurer (line 30) | class CellMeasurer extends React.PureComponent<Props> {
FILE: source/CellMeasurer/CellMeasurerCache.js
constant DEFAULT_HEIGHT (line 5) | const DEFAULT_HEIGHT = 30;
constant DEFAULT_WIDTH (line 6) | const DEFAULT_WIDTH = 100;
class CellMeasurerCache (line 33) | class CellMeasurerCache implements CellMeasureCache {
method constructor (line 48) | constructor(params: CellMeasurerCacheParams = {}) {
method clear (line 99) | clear(rowIndex: number, columnIndex: number = 0) {
method clearAll (line 108) | clearAll() {
method defaultHeight (line 125) | get defaultHeight(): number {
method defaultWidth (line 129) | get defaultWidth(): number {
method hasFixedHeight (line 133) | hasFixedHeight(): boolean {
method hasFixedWidth (line 137) | hasFixedWidth(): boolean {
method getHeight (line 141) | getHeight(rowIndex: number, columnIndex: number = 0): number {
method getWidth (line 153) | getWidth(rowIndex: number, columnIndex: number = 0): number {
method has (line 165) | has(rowIndex: number, columnIndex: number = 0): boolean {
method set (line 179) | set(
method _updateCachedColumnAndRowSizes (line 201) | _updateCachedColumnAndRowSizes(rowIndex: number, columnIndex: number) {
function defaultKeyMapper (line 225) | function defaultKeyMapper(rowIndex: number, columnIndex: number) {
FILE: source/Collection/Collection.example.js
constant GUTTER_SIZE (line 17) | const GUTTER_SIZE = 3;
constant CELL_WIDTH (line 18) | const CELL_WIDTH = 75;
class CollectionExample (line 20) | class CollectionExample extends React.PureComponent {
method constructor (line 25) | constructor(props, context) {
method render (line 56) | render() {
method _cellRenderer (line 151) | _cellRenderer({index, isScrolling, key, style}) {
method _cellSizeAndPositionGetter (line 167) | _cellSizeAndPositionGetter({index}) {
method _getColumnCount (line 190) | _getColumnCount(cellCount) {
method _onHorizontalOverscanSizeChange (line 194) | _onHorizontalOverscanSizeChange(event) {
method _noContentRenderer (line 200) | _noContentRenderer() {
method _onCellCountChange (line 204) | _onCellCountChange(event) {
method _onHeightChange (line 215) | _onHeightChange(event) {
method _onScrollToCellChange (line 221) | _onScrollToCellChange(event) {
method _onVerticalOverscanSizeChange (line 236) | _onVerticalOverscanSizeChange(event) {
FILE: source/Collection/Collection.jest.js
function defaultCellRenderer (line 14) | function defaultCellRenderer({index, key, style}) {
function getMarkup (line 22) | function getMarkup(props = {}) {
function simulateScroll (line 44) | function simulateScroll({collection, scrollLeft = 0, scrollTop = 0}) {
function compareArrays (line 50) | function compareArrays(array1, array2) {
function cellRenderer (line 71) | function cellRenderer({index, key, style}) {
function cellSizeAndPositionGetter (line 371) | function cellSizeAndPositionGetter() {
function cellRenderer (line 643) | function cellRenderer({index, isScrolling, key, style}) {
function cellRenderer (line 730) | function cellRenderer({isScrolling, index, key, style}) {
function cellRenderer (line 763) | function cellRenderer({isScrolling, index, key, style}) {
function cellRenderer (line 801) | function cellRenderer({isScrolling, index, key, style}) {
FILE: source/Collection/Collection.js
class Collection (line 13) | class Collection extends React.PureComponent {
method constructor (line 55) | constructor(props, context) {
method forceUpdate (line 68) | forceUpdate() {
method recomputeCellSizesAndPositions (line 75) | recomputeCellSizesAndPositions() {
method render (line 82) | render() {
method calculateSizeAndPositionData (line 97) | calculateSizeAndPositionData() {
method getLastRenderedIndices (line 115) | getLastRenderedIndices() {
method getScrollPositionForCell (line 122) | getScrollPositionForCell({
method getTotalSize (line 160) | getTotalSize(): SizeInfo {
method cellRenderers (line 167) | cellRenderers({height, isScrolling, width, x, y}) {
method _isScrollingChange (line 188) | _isScrollingChange(isScrolling) {
method _setCollectionViewRef (line 194) | _setCollectionViewRef(ref) {
function defaultCellGroupRenderer (line 199) | function defaultCellGroupRenderer({
FILE: source/Collection/CollectionView.js
constant IS_SCROLLING_TIMEOUT (line 15) | const IS_SCROLLING_TIMEOUT = 150;
constant SCROLL_POSITION_CHANGE_REASONS (line 21) | const SCROLL_POSITION_CHANGE_REASONS = {
class CollectionView (line 30) | class CollectionView extends React.PureComponent {
method constructor (line 155) | constructor(...args) {
method recomputeCellSizesAndPositions (line 174) | recomputeCellSizesAndPositions() {
method getDerivedStateFromProps (line 188) | static getDerivedStateFromProps(nextProps, prevState) {
method componentDidMount (line 218) | componentDidMount() {
method componentDidUpdate (line 252) | componentDidUpdate(prevProps, prevState) {
method componentWillUnmount (line 294) | componentWillUnmount() {
method render (line 300) | render() {
method _enablePointerEventsAfterDelay (line 425) | _enablePointerEventsAfterDelay() {
method _invokeOnScrollMemoizer (line 453) | _invokeOnScrollMemoizer({scrollLeft, scrollTop, totalHeight, totalWidt...
method _setScrollPosition (line 478) | _setScrollPosition({scrollLeft, scrollTop}) {
FILE: source/Collection/Section.jest.js
function helper (line 4) | function helper({height = 100, width = 200, x = 0, y = 0} = {}) {
FILE: source/Collection/Section.js
class Section (line 10) | class Section {
method constructor (line 11) | constructor({height, width, x, y}: SizeAndPositionInfo) {
method addCellIndex (line 22) | addCellIndex({index}: Index) {
method getCellIndices (line 30) | getCellIndices(): Array<number> {
method toString (line 35) | toString() {
FILE: source/Collection/SectionManager.jest.js
function initSectionManager (line 4) | function initSectionManager() {
function verifySections (line 15) | function verifySections(
FILE: source/Collection/SectionManager.js
constant SECTION_SIZE (line 9) | const SECTION_SIZE = 100;
class SectionManager (line 21) | class SectionManager {
method constructor (line 22) | constructor(sectionSize = SECTION_SIZE) {
method getCellIndices (line 33) | getCellIndices({height, width, x, y}: SizeAndPositionInfo): Array<numb...
method getCellMetadata (line 47) | getCellMetadata({index}: Index): SizeAndPositionInfo {
method getSections (line 52) | getSections({height, width, x, y}: SizeAndPositionInfo): Array<Section> {
method getTotalSectionCount (line 81) | getTotalSectionCount() {
method toString (line 86) | toString() {
method registerCell (line 93) | registerCell({cellMetadatum, index}: RegisterCellParams) {
FILE: source/Collection/TestData.js
constant CELLS (line 20) | const CELLS = [
constant SECTION_SIZE (line 33) | const SECTION_SIZE = 2;
FILE: source/Collection/utils/calculateSizeAndPositionData.jest.js
function cellSizeAndPositionGetter (line 6) | function cellSizeAndPositionGetter({index}) {
FILE: source/Collection/utils/calculateSizeAndPositionData.js
function calculateSizeAndPositionData (line 3) | function calculateSizeAndPositionData({
FILE: source/ColumnSizer/ColumnSizer.example.js
class ColumnSizerExample (line 16) | class ColumnSizerExample extends React.PureComponent {
method constructor (line 17) | constructor(props) {
method render (line 33) | render() {
method _noColumnMaxWidthChange (line 107) | _noColumnMaxWidthChange(event) {
method _noColumnMinWidthChange (line 119) | _noColumnMinWidthChange(event) {
method _onColumnCountChange (line 131) | _onColumnCountChange(event) {
method _noContentRenderer (line 135) | _noContentRenderer() {
method _cellRenderer (line 139) | _cellRenderer({columnIndex, key, rowIndex, style}) {
FILE: source/ColumnSizer/ColumnSizer.jest.js
function getMarkup (line 8) | function getMarkup({
function helper (line 83) | function helper(updatedProps, expectedTextContent) {
FILE: source/ColumnSizer/ColumnSizer.js
class ColumnSizer (line 8) | class ColumnSizer extends React.PureComponent {
method constructor (line 34) | constructor(props, context) {
method componentDidUpdate (line 40) | componentDidUpdate(prevProps) {
method render (line 55) | render() {
method _registerChild (line 85) | _registerChild(child) {
FILE: source/Grid/Grid.example.js
class GridExample (line 15) | class GridExample extends React.PureComponent {
method constructor (line 20) | constructor(props, context) {
method render (line 48) | render() {
method _cellRenderer (line 182) | _cellRenderer({columnIndex, key, rowIndex, style}) {
method _getColumnWidth (line 190) | _getColumnWidth({index}) {
method _getDatum (line 203) | _getDatum(index) {
method _getRowClassName (line 209) | _getRowClassName(row) {
method _getRowHeight (line 213) | _getRowHeight({index}) {
method _noContentRenderer (line 217) | _noContentRenderer() {
method _renderBodyCell (line 221) | _renderBodyCell({columnIndex, key, rowIndex, style}) {
method _renderLeftSideCell (line 250) | _renderLeftSideCell({key, rowIndex, style}) {
method _updateUseDynamicRowHeights (line 270) | _updateUseDynamicRowHeights(value) {
method _onColumnCountChange (line 276) | _onColumnCountChange(event) {
method _onRowCountChange (line 282) | _onRowCountChange(event) {
method _onScrollToColumnChange (line 288) | _onScrollToColumnChange(event) {
method _onScrollToRowChange (line 302) | _onScrollToRowChange(event) {
FILE: source/Grid/Grid.jest.js
constant DEFAULT_COLUMN_WIDTH (line 15) | const DEFAULT_COLUMN_WIDTH = 50;
constant DEFAULT_HEIGHT (line 16) | const DEFAULT_HEIGHT = 100;
constant DEFAULT_ROW_HEIGHT (line 17) | const DEFAULT_ROW_HEIGHT = 20;
constant DEFAULT_WIDTH (line 18) | const DEFAULT_WIDTH = 200;
constant NUM_ROWS (line 19) | const NUM_ROWS = 100;
constant NUM_COLUMNS (line 20) | const NUM_COLUMNS = 50;
function getScrollbarSize0 (line 22) | function getScrollbarSize0() {
function getScrollbarSize20 (line 26) | function getScrollbarSize20() {
function defaultCellRenderer (line 31) | function defaultCellRenderer({columnIndex, key, rowIndex, style}) {
function simulateScroll (line 39) | function simulateScroll({grid, scrollLeft = 0, scrollTop = 0}) {
function getMarkup (line 45) | function getMarkup(props = {}) {
function cellRenderer (line 82) | function cellRenderer({columnIndex, key, rowIndex, style}) {
function noContentRenderer (line 859) | function noContentRenderer() {
function createHelper (line 1292) | function createHelper() {
function onSectionRendered (line 1537) | function onSectionRendered(params) {
function cellRenderer (line 1658) | function cellRenderer({columnIndex, isScrolling, key, rowIndex, style}) {
function cellRenderer (line 1706) | function cellRenderer(props) {
function cellRenderer (line 1729) | function cellRenderer({columnIndex, key, rowIndex, style}) {
function cellRenderer (line 1769) | function cellRenderer({columnIndex, key, rowIndex, style}) {
function cellRenderer (line 1810) | function cellRenderer({columnIndex, key, rowIndex, style}) {
function cellRenderer (line 1851) | function cellRenderer({columnIndex, key, rowIndex, style}) {
function cellRenderer (line 1937) | function cellRenderer({columnIndex, key, rowIndex, style}) {
function cellRenderer (line 1967) | function cellRenderer({columnIndex, key, rowIndex, style}) {
function cellRangeRenderer (line 2014) | function cellRangeRenderer(props) {
function cellRenderer (line 2051) | function cellRenderer({columnIndex, key, rowIndex, style}) {
function columnWidth (line 2129) | function columnWidth({index}) {
function rowHeight (line 2133) | function rowHeight({index}) {
function cellRenderer (line 2300) | function cellRenderer({key, style}) {
class GridComponent (line 2315) | class GridComponent extends React.PureComponent {
method componentDidUpdate (line 2316) | componentDidUpdate() {
method render (line 2320) | render() {
function cellRenderer (line 2330) | function cellRenderer({columnIndex, key, rowIndex, style}) {
function cellRenderer (line 2414) | function cellRenderer(params) {
function cellRenderer (line 2449) | function cellRenderer(params) {
function cellRenderer (line 2504) | function cellRenderer(params) {
FILE: source/Grid/Grid.js
constant DEFAULT_SCROLLING_RESET_TIME_INTERVAL (line 42) | const DEFAULT_SCROLLING_RESET_TIME_INTERVAL = 150;
constant SCROLL_POSITION_CHANGE_REASONS (line 48) | const SCROLL_POSITION_CHANGE_REASONS = {
class Grid (line 261) | class Grid extends React.PureComponent<Props, State> {
method if (line 363) | if (props.scrollToRow > 0) {
method if (line 366) | if (props.scrollToColumn > 0) {
FILE: source/Grid/accessibilityOverscanIndicesGetter.jest.js
function testHelper (line 7) | function testHelper({
FILE: source/Grid/accessibilityOverscanIndicesGetter.js
constant SCROLL_DIRECTION_BACKWARD (line 5) | const SCROLL_DIRECTION_BACKWARD = -1;
constant SCROLL_DIRECTION_FORWARD (line 6) | const SCROLL_DIRECTION_FORWARD = 1;
constant SCROLL_DIRECTION_HORIZONTAL (line 8) | const SCROLL_DIRECTION_HORIZONTAL = 'horizontal';
constant SCROLL_DIRECTION_VERTICAL (line 9) | const SCROLL_DIRECTION_VERTICAL = 'vertical';
function defaultOverscanIndicesGetter (line 16) | function defaultOverscanIndicesGetter({
FILE: source/Grid/defaultCellRangeRenderer.js
function defaultCellRangeRenderer (line 11) | function defaultCellRangeRenderer({
function warnAboutMissingStyle (line 153) | function warnAboutMissingStyle(parent, renderedCell) {
FILE: source/Grid/defaultOverscanIndicesGetter.jest.js
function testHelper (line 7) | function testHelper({
FILE: source/Grid/defaultOverscanIndicesGetter.js
constant SCROLL_DIRECTION_BACKWARD (line 5) | const SCROLL_DIRECTION_BACKWARD = -1;
constant SCROLL_DIRECTION_FORWARD (line 6) | const SCROLL_DIRECTION_FORWARD = 1;
constant SCROLL_DIRECTION_HORIZONTAL (line 8) | const SCROLL_DIRECTION_HORIZONTAL = 'horizontal';
constant SCROLL_DIRECTION_VERTICAL (line 9) | const SCROLL_DIRECTION_VERTICAL = 'vertical';
function defaultOverscanIndicesGetter (line 16) | function defaultOverscanIndicesGetter({
FILE: source/Grid/utils/CellSizeAndPositionManager.jest.js
function getCellSizeAndPositionManager (line 4) | function getCellSizeAndPositionManager({
function getUpdatedOffsetForIndexHelper (line 187) | function getUpdatedOffsetForIndexHelper({
FILE: source/Grid/utils/CellSizeAndPositionManager.js
class CellSizeAndPositionManager (line 38) | class CellSizeAndPositionManager {
method constructor (line 53) | constructor({
method areOffsetsAdjusted (line 63) | areOffsetsAdjusted() {
method configure (line 67) | configure({cellCount, estimatedCellSize, cellSizeGetter}: ConfigurePar...
method getCellCount (line 73) | getCellCount(): number {
method getEstimatedCellSize (line 77) | getEstimatedCellSize(): number {
method getLastMeasuredIndex (line 81) | getLastMeasuredIndex(): number {
method getOffsetAdjustment (line 85) | getOffsetAdjustment() {
method getSizeAndPositionOfCell (line 93) | getSizeAndPositionOfCell(index: number): SizeAndPositionData {
method getSizeAndPositionOfLastMeasuredCell (line 136) | getSizeAndPositionOfLastMeasuredCell(): SizeAndPositionData {
method getTotalSize (line 150) | getTotalSize(): number {
method getUpdatedOffsetForIndex (line 172) | getUpdatedOffsetForIndex({
method getVisibleCellRange (line 208) | getVisibleCellRange(params: GetVisibleCellRangeParams): VisibleCellRan...
method resetCell (line 242) | resetCell(index: number): void {
method _binarySearch (line 246) | _binarySearch(high: number, low: number, offset: number): number {
method _exponentialSearch (line 267) | _exponentialSearch(index: number, offset: number): number {
method _findNearestCell (line 291) | _findNearestCell(offset: number): number {
FILE: source/Grid/utils/ScalingCellSizeAndPositionManager.jest.js
function init (line 4) | function init({
FILE: source/Grid/utils/ScalingCellSizeAndPositionManager.js
class ScalingCellSizeAndPositionManager (line 29) | class ScalingCellSizeAndPositionManager {
method constructor (line 33) | constructor({maxScrollSize = getMaxElementSize(), ...params}: Params) {
method areOffsetsAdjusted (line 39) | areOffsetsAdjusted(): boolean {
method configure (line 45) | configure(params: {
method getCellCount (line 53) | getCellCount(): number {
method getEstimatedCellSize (line 57) | getEstimatedCellSize(): number {
method getLastMeasuredIndex (line 61) | getLastMeasuredIndex(): number {
method getOffsetAdjustment (line 69) | getOffsetAdjustment({
method getSizeAndPositionOfCell (line 84) | getSizeAndPositionOfCell(index: number) {
method getSizeAndPositionOfLastMeasuredCell (line 88) | getSizeAndPositionOfLastMeasuredCell() {
method getTotalSize (line 93) | getTotalSize(): number {
method getUpdatedOffsetForIndex (line 101) | getUpdatedOffsetForIndex({
method getVisibleCellRange (line 131) | getVisibleCellRange({
method resetCell (line 146) | resetCell(index: number): void {
method _getOffsetPercentage (line 150) | _getOffsetPercentage({
method _offsetToSafeOffset (line 164) | _offsetToSafeOffset({
method _safeOffsetToOffset (line 184) | _safeOffsetToOffset({
FILE: source/Grid/utils/calculateSizeAndPositionDataAndUpdateScrollOffset.jest.js
function helper (line 4) | function helper({
FILE: source/Grid/utils/calculateSizeAndPositionDataAndUpdateScrollOffset.js
function calculateSizeAndPositionDataAndUpdateScrollOffset (line 36) | function calculateSizeAndPositionDataAndUpdateScrollOffset({
FILE: source/Grid/utils/maxElementSize.js
constant DEFAULT_MAX_ELEMENT_SIZE (line 3) | const DEFAULT_MAX_ELEMENT_SIZE = 1500000;
constant CHROME_MAX_ELEMENT_SIZE (line 4) | const CHROME_MAX_ELEMENT_SIZE = 1.67771e7;
FILE: source/Grid/utils/updateScrollIndexHelper.jest.js
function getCellSizeAndPositionManager (line 5) | function getCellSizeAndPositionManager({
constant CELL_SIZES (line 16) | const CELL_SIZES = [
function helper (line 29) | function helper({
FILE: source/Grid/utils/updateScrollIndexHelper.js
function updateScrollIndexHelper (line 50) | function updateScrollIndexHelper({
FILE: source/InfiniteLoader/InfiniteLoader.example.js
constant STATUS_LOADING (line 15) | const STATUS_LOADING = 1;
constant STATUS_LOADED (line 16) | const STATUS_LOADED = 2;
class InfiniteLoaderExample (line 18) | class InfiniteLoaderExample extends React.PureComponent {
method constructor (line 23) | constructor(props) {
method componentWillUnmount (line 40) | componentWillUnmount() {
method render (line 46) | render() {
method _clearData (line 101) | _clearData() {
method _isRowLoaded (line 109) | _isRowLoaded({index}) {
method _loadMoreRows (line 114) | _loadMoreRows({startIndex, stopIndex}) {
method _rowRenderer (line 152) | _rowRenderer({index, key, style}) {
FILE: source/InfiniteLoader/InfiniteLoader.jest.js
function defaultIsRowLoaded (line 24) | function defaultIsRowLoaded({index}) {
function defaultLoadMoreRows (line 29) | function defaultLoadMoreRows({startIndex, stopIndex}) {
function rowRenderer (line 33) | function rowRenderer({index, key, style}) {
function getMarkup (line 38) | function getMarkup({
function loadMoreRows (line 114) | function loadMoreRows() {
function loadMoreRows (line 128) | function loadMoreRows() {
function isRowLoaded (line 189) | function isRowLoaded({index}) {
function createIsRowLoaded (line 322) | function createIsRowLoaded(rows) {
class TestComponent (line 437) | class TestComponent extends React.Component {
method render (line 439) | render() {
method render (line 452) | render() {
method render (line 465) | render() {
class TestComponent (line 450) | class TestComponent extends React.Component {
method render (line 439) | render() {
method render (line 452) | render() {
method render (line 465) | render() {
class TestComponent (line 463) | class TestComponent extends React.Component {
method render (line 439) | render() {
method render (line 452) | render() {
method render (line 465) | render() {
FILE: source/InfiniteLoader/InfiniteLoader.js
class InfiniteLoader (line 11) | class InfiniteLoader extends React.PureComponent {
method constructor (line 63) | constructor(props, context) {
method resetLoadMoreRowsCache (line 72) | resetLoadMoreRowsCache(autoReload) {
method render (line 80) | render() {
method _loadUnloadedRanges (line 89) | _loadUnloadedRanges(unloadedRanges) {
method _onRowsRendered (line 118) | _onRowsRendered({startIndex, stopIndex}) {
method _doStuff (line 125) | _doStuff(startIndex, stopIndex) {
method _registerChild (line 152) | _registerChild(registeredChild) {
function isRangeVisible (line 160) | function isRangeVisible({
function scanForUnloadedRanges (line 174) | function scanForUnloadedRanges({
function forceUpdateReactVirtualizedComponent (line 260) | function forceUpdateReactVirtualizedComponent(
FILE: source/List/List.example.js
class ListExample (line 15) | class ListExample extends React.PureComponent {
method constructor (line 20) | constructor(props, context) {
method render (line 40) | render() {
method _getDatum (line 166) | _getDatum(index) {
method _getRowHeight (line 172) | _getRowHeight({index}) {
method _noRowsRenderer (line 176) | _noRowsRenderer() {
method _onRowCountChange (line 180) | _onRowCountChange(event) {
method _onScrollToRowChange (line 186) | _onScrollToRowChange(event) {
method _rowRenderer (line 200) | _rowRenderer({index, isScrolling, key, style}) {
FILE: source/List/List.jest.js
function overscanIndicesGetter (line 18) | function overscanIndicesGetter({startIndex, stopIndex}) {
function getMarkup (line 25) | function getMarkup(props = {}) {
function rowRenderer (line 471) | function rowRenderer({index, key, style}) {
function rowRenderer (line 508) | function rowRenderer(props) {
function rowRenderer (line 536) | function rowRenderer({index, key, style}) {
FILE: source/List/List.js
method if (line 116) | if (this.Grid) {
method if (line 123) | if (this.Grid) {
method if (line 137) | if (this.Grid) {
method if (line 147) | if (this.Grid) {
method if (line 154) | if (this.Grid) {
method if (line 164) | if (this.Grid) {
method if (line 174) | if (this.Grid) {
method if (line 181) | if (this.Grid) {
FILE: source/Masonry/Masonry.example.js
class GridExample (line 18) | class GridExample extends React.PureComponent {
method constructor (line 23) | constructor(props, context) {
method render (line 49) | render() {
method _calculateColumnCount (line 170) | _calculateColumnCount() {
method _cellRenderer (line 176) | _cellRenderer({index, key, parent, style}) {
method _initCellPositioner (line 211) | _initCellPositioner() {
method _onResize (line 224) | _onResize({width}) {
method _renderAutoSizer (line 232) | _renderAutoSizer({height, scrollTop}) {
method _renderMasonry (line 250) | _renderMasonry({width}) {
method _resetCellPositioner (line 288) | _resetCellPositioner() {
method _setMasonryRef (line 298) | _setMasonryRef(ref) {
FILE: source/Masonry/Masonry.jest.js
constant ALTERNATING_CELL_HEIGHTS (line 9) | const ALTERNATING_CELL_HEIGHTS = [100, 50, 100, 150];
constant CELL_SIZE_MULTIPLIER (line 10) | const CELL_SIZE_MULTIPLIER = 50;
constant COLUMN_COUNT (line 11) | const COLUMN_COUNT = 3;
function assertVisibleCells (line 13) | function assertVisibleCells(rendered, text) {
function createCellMeasurerCache (line 22) | function createCellMeasurerCache(props = {}) {
function createCellPositioner (line 32) | function createCellPositioner(cache) {
function createCellRenderer (line 40) | function createCellRenderer(cache, renderCallback) {
function getMarkup (line 78) | function getMarkup(props = {}) {
function simulateScroll (line 97) | function simulateScroll(masonry, scrollTop = 0) {
FILE: source/Masonry/Masonry.js
constant DEFAULT_SCROLLING_RESET_TIME_INTERVAL (line 46) | const DEFAULT_SCROLLING_RESET_TIME_INTERVAL = 150;
class Masonry (line 76) | class Masonry extends React.PureComponent<Props, State> {
method if (line 111) | if (this._invalidateOnUpdateStartIndex === null) {
method if (line 139) | if (
function identity (line 447) | function identity(value) {
function noop (line 451) | function noop() {}
FILE: source/Masonry/PositionCache.js
class PositionCache (line 9) | class PositionCache {
FILE: source/Masonry/createCellPositioner.js
function createCellPositioner (line 17) | function createCellPositioner({
FILE: source/MultiGrid/CellMeasurerCacheDecorator.js
method constructor (line 22) | constructor(params: CellMeasurerCacheDecoratorParams = {}) {
method clear (line 34) | clear(rowIndex: number, columnIndex: number): void {
method clearAll (line 41) | clearAll(): void {
method defaultHeight (line 51) | get defaultHeight(): number {
method defaultWidth (line 55) | get defaultWidth(): number {
method hasFixedHeight (line 59) | hasFixedHeight(): boolean {
method hasFixedWidth (line 63) | hasFixedWidth(): boolean {
FILE: source/MultiGrid/MultiGrid.example.js
constant STYLE (line 15) | const STYLE = {
constant STYLE_BOTTOM_LEFT_GRID (line 18) | const STYLE_BOTTOM_LEFT_GRID = {
constant STYLE_TOP_LEFT_GRID (line 22) | const STYLE_TOP_LEFT_GRID = {
constant STYLE_TOP_RIGHT_GRID (line 27) | const STYLE_TOP_RIGHT_GRID = {
class MultiGridExample (line 32) | class MultiGridExample extends React.PureComponent {
method constructor (line 37) | constructor(props, context) {
method render (line 56) | render() {
method _cellRenderer (line 112) | _cellRenderer({columnIndex, key, rowIndex, style}) {
method _createEventHandler (line 120) | _createEventHandler(property) {
method _createLabeledInput (line 130) | _createLabeledInput(property, eventHandler) {
FILE: source/MultiGrid/MultiGrid.jest.js
function defaultCellRenderer (line 10) | function defaultCellRenderer({columnIndex, key, rowIndex, style}) {
function getMarkup (line 18) | function getMarkup(props = {}) {
function getScrollbarSize20 (line 175) | function getScrollbarSize20() {
function variableRowHeight (line 240) | function variableRowHeight({index}) {
function variableColumnWidth (line 246) | function variableColumnWidth({index}) {
function cellRenderer (line 403) | function cellRenderer({key, parent}) {
function getDeferredMeasurementCache (line 535) | function getDeferredMeasurementCache() {
function getScrollbarSize20 (line 628) | function getScrollbarSize20() {
FILE: source/MultiGrid/MultiGrid.js
constant SCROLLBAR_SIZE_BUFFER (line 8) | const SCROLLBAR_SIZE_BUFFER = 20;
class MultiGrid (line 17) | class MultiGrid extends React.PureComponent {
method constructor (line 68) | constructor(props, context) {
method forceUpdateGrids (line 105) | forceUpdateGrids() {
method invalidateCellSizeAfterRender (line 113) | invalidateCellSizeAfterRender({columnIndex = 0, rowIndex = 0} = {}) {
method measureAllCells (line 125) | measureAllCells() {
method recomputeGridSize (line 133) | recomputeGridSize({columnIndex = 0, rowIndex = 0} = {}) {
method getDerivedStateFromProps (line 165) | static getDerivedStateFromProps(nextProps, prevState) {
method componentDidMount (line 185) | componentDidMount() {
method componentDidUpdate (line 204) | componentDidUpdate() {
method render (line 208) | render() {
method _getBottomGridHeight (line 343) | _getBottomGridHeight(props) {
method _getLeftGridWidth (line 351) | _getLeftGridWidth(props) {
method _getRightGridWidth (line 371) | _getRightGridWidth(props) {
method _getTopGridHeight (line 379) | _getTopGridHeight(props) {
method _handleInvalidatedGridSize (line 399) | _handleInvalidatedGridSize() {
method _maybeCalculateCachedStyles (line 419) | _maybeCalculateCachedStyles(resetAll) {
method _prepareForRender (line 537) | _prepareForRender() {
method _renderBottomLeftGrid (line 612) | _renderBottomLeftGrid(props) {
method _renderBottomRightGrid (line 669) | _renderBottomRightGrid(props) {
method _renderTopLeftGrid (line 701) | _renderTopLeftGrid(props) {
method _renderTopRightGrid (line 723) | _renderTopRightGrid(props) {
FILE: source/ScrollSync/ScrollSync.example.js
constant LEFT_COLOR_FROM (line 15) | const LEFT_COLOR_FROM = hexToRgb('#471061');
constant LEFT_COLOR_TO (line 16) | const LEFT_COLOR_TO = hexToRgb('#BC3959');
constant TOP_COLOR_FROM (line 17) | const TOP_COLOR_FROM = hexToRgb('#000000');
constant TOP_COLOR_TO (line 18) | const TOP_COLOR_TO = hexToRgb('#333333');
class GridExample (line 20) | class GridExample extends React.PureComponent {
method constructor (line 21) | constructor(props, context) {
method render (line 39) | render() {
method _renderBodyCell (line 204) | _renderBodyCell({columnIndex, key, rowIndex, style}) {
method _renderHeaderCell (line 212) | _renderHeaderCell({columnIndex, key, rowIndex, style}) {
method _renderLeftHeaderCell (line 220) | _renderLeftHeaderCell({columnIndex, key, style}) {
method _renderLeftSideCell (line 228) | _renderLeftSideCell({columnIndex, key, rowIndex, style}) {
function hexToRgb (line 247) | function hexToRgb(hex) {
function mixColors (line 262) | function mixColors(color1, color2, amount) {
FILE: source/ScrollSync/ScrollSync.jest.js
function ChildComponent (line 6) | function ChildComponent({
FILE: source/ScrollSync/ScrollSync.js
class ScrollSync (line 7) | class ScrollSync extends React.PureComponent {
method constructor (line 17) | constructor(props, context) {
method render (line 32) | render() {
method _onScroll (line 54) | _onScroll({
FILE: source/Table/Column.js
class Column (line 12) | class Column extends React.Component {
FILE: source/Table/SortIndicator.js
function SortIndicator (line 9) | function SortIndicator({sortDirection}) {
FILE: source/Table/Table.example.js
class TableExample (line 18) | class TableExample extends React.PureComponent {
method constructor (line 23) | constructor(props, context) {
method render (line 54) | render() {
method _getDatum (line 236) | _getDatum(list, index) {
method _getRowHeight (line 240) | _getRowHeight({index}) {
method _headerRenderer (line 246) | _headerRenderer({dataKey, sortBy, sortDirection}) {
method _isSortEnabled (line 255) | _isSortEnabled() {
method _noRowsRenderer (line 262) | _noRowsRenderer() {
method _onRowCountChange (line 266) | _onRowCountChange(event) {
method _onScrollToRowChange (line 272) | _onScrollToRowChange(event) {
method _rowClassName (line 286) | _rowClassName({index}) {
method _sort (line 294) | _sort({sortBy, sortDirection}) {
method _sortList (line 300) | _sortList({sortBy, sortDirection}) {
method _updateUseDynamicRowHeight (line 310) | _updateUseDynamicRowHeight(value) {
FILE: source/Table/Table.jest.js
function immutableRowGetter (line 22) | function immutableRowGetter({index}) {
function vanillaRowGetter (line 27) | function vanillaRowGetter({index}) {
function overscanIndicesGetter (line 33) | function overscanIndicesGetter({startIndex, stopIndex}) {
function getMarkup (line 40) | function getMarkup({
class AnotherColumn (line 105) | class AnotherColumn extends Column {}
function cellRenderer (line 311) | function cellRenderer({rowIndex}) {
function headerRenderer (line 1477) | function headerRenderer() {
function cellRenderer (line 1481) | function cellRenderer() {
function headerRenderer (line 1502) | function headerRenderer() {
function cellRenderer (line 1506) | function cellRenderer() {
FILE: source/Table/Table.js
class Table (line 19) | class Table extends React.PureComponent {
method constructor (line 253) | constructor(props) {
method forceUpdateGrid (line 268) | forceUpdateGrid() {
method getOffsetForRow (line 275) | getOffsetForRow({alignment, index}) {
method invalidateCellSizeAfterRender (line 288) | invalidateCellSizeAfterRender({columnIndex, rowIndex}: CellPosition) {
method measureAllRows (line 298) | measureAllRows() {
method recomputeGridSize (line 305) | recomputeGridSize({columnIndex = 0, rowIndex = 0}: CellPosition = {}) {
method recomputeRowHeights (line 315) | recomputeRowHeights(index = 0) {
method scrollToPosition (line 324) | scrollToPosition(scrollTop = 0) {
method scrollToRow (line 331) | scrollToRow(index = 0) {
method getScrollbarWidth (line 340) | getScrollbarWidth() {
method componentDidMount (line 351) | componentDidMount() {
method componentDidUpdate (line 355) | componentDidUpdate() {
method render (line 359) | render() {
method _createColumn (line 455) | _createColumn({column, columnIndex, isScrolling, parent, rowData, rowI...
method _createHeader (line 504) | _createHeader({column, index}) {
method _createRow (line 613) | _createRow({rowIndex: index, isScrolling, key, parent, style}) {
method _getFlexStyleForColumn (line 676) | _getFlexStyleForColumn(column, customStyle = {}) {
method _getHeaderColumns (line 697) | _getHeaderColumns() {
method _getRowHeight (line 704) | _getRowHeight(rowIndex) {
method _onScroll (line 712) | _onScroll({clientHeight, scrollHeight, scrollTop}) {
method _onSectionRendered (line 718) | _onSectionRendered({
method _setRef (line 734) | _setRef(ref) {
method _setGridElementRef (line 738) | _setGridElementRef(ref) {
method _setScrollbarWidth (line 742) | _setScrollbarWidth() {
FILE: source/Table/createMultiSort.jest.js
function simulate (line 4) | function simulate(
FILE: source/Table/createMultiSort.js
method if (line 60) | if (event.shiftKey) {
FILE: source/Table/defaultCellDataGetter.js
function defaultCellDataGetter (line 9) | function defaultCellDataGetter({
FILE: source/Table/defaultCellRenderer.js
function defaultCellRenderer (line 8) | function defaultCellRenderer({
FILE: source/Table/defaultHeaderRenderer.js
function defaultHeaderRenderer (line 9) | function defaultHeaderRenderer({
FILE: source/Table/defaultHeaderRowRenderer.js
function defaultHeaderRowRenderer (line 5) | function defaultHeaderRowRenderer({
FILE: source/Table/defaultRowRenderer.js
function defaultRowRenderer (line 8) | function defaultRowRenderer({
FILE: source/TestUtils.js
function render (line 8) | function render(markup) {
FILE: source/WindowScroller/WindowScroller.example.js
class WindowScrollerExample (line 23) | class WindowScrollerExample extends React.PureComponent<
FILE: source/WindowScroller/WindowScroller.header-resize.e2e.js
function Header (line 30) | function Header({height}) {
function App (line 34) | function App() {
FILE: source/WindowScroller/WindowScroller.jest.js
function mockGetBoundingClientRectForHeader (line 6) | function mockGetBoundingClientRectForHeader({
function getMarkup (line 23) | function getMarkup({headerElements, documentOffset, renderFn, ...props} ...
function simulateWindowScroll (line 50) | function simulateWindowScroll({scrollX = 0, scrollY = 0}) {
function simulateWindowResize (line 58) | function simulateWindowResize({height = 0, width = 0}) {
FILE: source/WindowScroller/WindowScroller.js
constant IS_SCROLLING_TIMEOUT (line 73) | const IS_SCROLLING_TIMEOUT = 150;
class WindowScroller (line 77) | class WindowScroller extends React.PureComponent<Props, State> {
method if (line 138) | if (scrollElement) {
FILE: source/WindowScroller/utils/dimensions.js
function getPositionOffset (line 49) | function getPositionOffset(element: Element, container: Element) {
function getScrollOffset (line 73) | function getScrollOffset(element: Element) {
FILE: source/WindowScroller/utils/onScroll.js
function enablePointerEventsIfDisabled (line 14) | function enablePointerEventsIfDisabled() {
function enablePointerEventsAfterDelayCallback (line 26) | function enablePointerEventsAfterDelayCallback() {
function enablePointerEventsAfterDelay (line 31) | function enablePointerEventsAfterDelay() {
function onScrollWindow (line 50) | function onScrollWindow(event: Event) {
function registerScrollListener (line 68) | function registerScrollListener(
function unregisterScrollListener (line 80) | function unregisterScrollListener(
FILE: source/demo/Application.js
constant COMPONENT_EXAMPLES_MAP (line 28) | const COMPONENT_EXAMPLES_MAP = {
class Application (line 47) | class Application extends React.PureComponent {
method constructor (line 59) | constructor(props) {
method setScrollingCustomElement (line 64) | setScrollingCustomElement(custom) {
method getChildContext (line 68) | getChildContext() {
method render (line 78) | render() {
FILE: source/demo/ComponentLink.js
function ComponentLink (line 5) | function ComponentLink({children, to}) {
FILE: source/demo/ContentBox.js
function ContentBox (line 5) | function ContentBox({className, children, style}) {
function ContentBoxHeader (line 13) | function ContentBoxHeader({text, sourceLink, docsLink}) {
function ContentBoxParagraph (line 45) | function ContentBoxParagraph({children}) {
FILE: source/demo/Icon.js
constant TYPES (line 8) | const TYPES = {
function Icon (line 22) | function Icon({className, title, type}) {
function getIconData (line 37) | function getIconData(type) {
FILE: source/demo/LabeledInput.js
function LabeledInput (line 6) | function LabeledInput({
function InputRow (line 44) | function InputRow({children}) {
FILE: source/demo/NavLink.js
function NavLink (line 6) | function NavLink({children, href, iconType, to}) {
FILE: source/demo/Wizard/Generator.js
function Generator (line 1) | function Generator({
function componentToString (line 88) | function componentToString({component, indentation = 0}) {
function getAutoSizer (line 125) | function getAutoSizer({
function getBaseComponent (line 163) | function getBaseComponent({
function getCellMeasurer (line 179) | function getCellMeasurer({
function getCollectionMarkup (line 225) | function getCollectionMarkup() {
function getTableMarkup (line 237) | function getTableMarkup() {
function getGridMarkup (line 250) | function getGridMarkup() {
function getListMarkup (line 264) | function getListMarkup() {
function indentationToSpaces (line 275) | function indentationToSpaces(indentation) {
FILE: source/demo/Wizard/Wizard.js
class Wizard (line 16) | class Wizard extends React.Component {
method constructor (line 17) | constructor(props) {
method render (line 38) | render() {
method _sanitizeState (line 177) | _sanitizeState() {
function Option (line 215) | function Option({checked, disabled = false, label, onChange}) {
FILE: source/demo/utils.js
function generateRandomList (line 4) | function generateRandomList() {
constant BADGE_COLORS (line 28) | const BADGE_COLORS = [
constant NAMES (line 45) | const NAMES = [
constant ROW_HEIGHTS (line 147) | const ROW_HEIGHTS = [50, 75, 100];
FILE: source/utils/TestHelper.js
function getCellMetadata (line 4) | function getCellMetadata() {
FILE: source/utils/createCallbackMemoizer.jest.js
function OnRowsRendered (line 4) | function OnRowsRendered() {
FILE: source/utils/createCallbackMemoizer.js
function createCallbackMemoizer (line 4) | function createCallbackMemoizer(requireAllKeys = true) {
FILE: source/utils/getUpdatedOffsetForIndex.jest.js
function testHelper (line 5) | function testHelper(
FILE: source/utils/getUpdatedOffsetForIndex.js
function getUpdatedOffsetForIndex (line 13) | function getUpdatedOffsetForIndex({
FILE: source/utils/initCellMetadata.js
function initCellMetadata (line 9) | function initCellMetadata({cellCount, size}) {
FILE: source/vendor/binarySearchBounds.js
function _GEA (line 10) | function _GEA(a, l, h, y) {
function _GEP (line 24) | function _GEP(a, l, h, y, c) {
function dispatchBsearchGE (line 38) | function dispatchBsearchGE(a, y, c, l, h) {
function _GTA (line 57) | function _GTA(a, l, h, y) {
function _GTP (line 71) | function _GTP(a, l, h, y, c) {
function dispatchBsearchGT (line 85) | function dispatchBsearchGT(a, y, c, l, h) {
function _LTA (line 104) | function _LTA(a, l, h, y) {
function _LTP (line 118) | function _LTP(a, l, h, y, c) {
function dispatchBsearchLT (line 132) | function dispatchBsearchLT(a, y, c, l, h) {
function _LEA (line 151) | function _LEA(a, l, h, y) {
function _LEP (line 165) | function _LEP(a, l, h, y, c) {
function dispatchBsearchLE (line 179) | function dispatchBsearchLE(a, y, c, l, h) {
function _EQA (line 198) | function _EQA(a, l, h, y) {
function _EQP (line 213) | function _EQP(a, l, h, y, c) {
function dispatchBsearchEQ (line 229) | function dispatchBsearchEQ(a, y, c, l, h) {
FILE: source/vendor/detectElementResize.js
function createDetectElementResize (line 14) | function createDetectElementResize(nonce, hostWindow) {
FILE: source/vendor/intervalTree.js
function IntervalTreeNode (line 16) | function IntervalTreeNode(mid, left, right, leftPoints, rightPoints) {
function copy (line 28) | function copy(a, b) {
function rebuild (line 37) | function rebuild(node, intervals) {
function rebuildWithInterval (line 47) | function rebuildWithInterval(node, interval) {
function rebuildWithoutInterval (line 53) | function rebuildWithoutInterval(node, interval) {
function reportLeftRange (line 209) | function reportLeftRange(arr, hi, cb) {
function reportRightRange (line 218) | function reportRightRange(arr, lo, cb) {
function reportRange (line 227) | function reportRange(arr, cb) {
function compareNumbers (line 280) | function compareNumbers(a, b) {
function compareBegin (line 284) | function compareBegin(a, b) {
function compareEnd (line 292) | function compareEnd(a, b) {
function createIntervalTree (line 300) | function createIntervalTree(intervals) {
function IntervalTree (line 342) | function IntervalTree(root) {
function createWrapper (line 403) | function createWrapper(intervals) {
Condensed preview — 227 files, each showing path, character count, and a content snippet. Download the .json file or copy for the full structured content (1,143K chars).
[
{
"path": ".babelrc.js",
"chars": 1817,
"preview": "const env = process.env.NODE_ENV;\n\nif (env === 'commonjs' || env === 'es') {\n module.exports = {\n ignore: [\n '*"
},
{
"path": ".circleci/config.yml",
"chars": 2559,
"preview": "version: 2.1\n\ndefaults: &defaults\n working_directory: ~/repo\n docker:\n - image: circleci/node:10.16.3-stretch-brows"
},
{
"path": ".eslintignore",
"chars": 89,
"preview": "node_modules/*\n\n# Website dist\nbuild/*\n\n# NPM dist\ndist/*\n\n# Vendor files\nsource/vendor/*"
},
{
"path": ".eslintrc",
"chars": 169,
"preview": "{\n \"parser\": \"babel-eslint\",\n \"plugins\": [\"react\"],\n \"extends\": [\"fbjs\", \"eslint:recommended\", \"plugin:prettier/recom"
},
{
"path": ".flowconfig",
"chars": 310,
"preview": "[ignore]\n.*/Collection/.*\n.*/ColumnSizer/.*\n.*/InfiniteLoader/.*\n.*/Masonry/.*\n.*/MultiGrid/.*\n.*/ScrollSync/.*\n.*/Table"
},
{
"path": ".github/ISSUE_TEMPLATE/bug-report.md",
"chars": 1083,
"preview": "---\nname: Bug Report\nabout: Bugs, missing documentation, or unexpected behavior 🤔.\n---\n\n## Bug Report\n\nPlease include ei"
},
{
"path": ".github/ISSUE_TEMPLATE/feature-request.md",
"chars": 520,
"preview": "---\nname: Feature request\nabout: Ideas and suggestions\n---\n\n## Feature Request\n\nProvide as much information as possible "
},
{
"path": ".github/ISSUE_TEMPLATE/question.md",
"chars": 230,
"preview": "---\nname: Questions\nabout: Questions about react-virtualized\n---\n\n## Asking a Question?\n\nPlease don't file GitHub issues"
},
{
"path": ".github/PULL_REQUEST_TEMPLATE.md",
"chars": 1110,
"preview": "Thanks for contributing to react-virtualized!\n\n**Before submitting a pull request,** please complete the following check"
},
{
"path": ".github/workflows/stale.yml",
"chars": 324,
"preview": "name: Close stale issues and PRs\non:\n schedule:\n - cron: '0 8 * * *'\n\njobs:\n stale:\n runs-on: ubuntu-latest\n "
},
{
"path": ".gitignore",
"chars": 82,
"preview": ".DS_Store\nbuild\ncoverage\ndist\nnode_modules\nnpm-debug.log\nstyles.css\n.vscode\n.idea\n"
},
{
"path": ".nvmrc",
"chars": 9,
"preview": "v10.16.3\n"
},
{
"path": ".prettierrc",
"chars": 128,
"preview": "{\n \"bracketSpacing\": false,\n \"jsxBracketSameLine\": true,\n \"printWidth\": 80,\n \"singleQuote\": true,\n \"trailingComma\":"
},
{
"path": ".watchmanconfig",
"chars": 0,
"preview": ""
},
{
"path": "CHANGELOG.md",
"chars": 76150,
"preview": "## Changelog\n\n##### NEXT\n\n- Update peer dependencies to allow React 17 ([levenleven](https://github.com/levenleven) - [#"
},
{
"path": "CODE_OF_CONDUCT.md",
"chars": 11102,
"preview": "# Code of Conduct\n\n## When Something Happens\n\nIf you see a Code of Conduct violation, follow these steps:\n\n1. Let the pe"
},
{
"path": "CONTRIBUTING.md",
"chars": 5710,
"preview": "[Bug Reports](#bugs) | [Features Requests](#features) | [Submitting Pull Requests](#pull-requests) | [Running Local Demo"
},
{
"path": "LICENSE",
"chars": 1080,
"preview": "The MIT License (MIT)\n\nCopyright (c) 2015 Brian Vaughn\n\nPermission is hereby granted, free of charge, to any person obta"
},
{
"path": "README.md",
"chars": 20354,
"preview": "[<img src=\"https://cloud.githubusercontent.com/assets/29597/11737732/0ca1e55e-9f91-11e5-97f3-098f2f8ed866.png\" alt=\"Reac"
},
{
"path": "codemods/6-to-7/rename-properties.js",
"chars": 1872,
"preview": "'use strict'\n\n// Renames react-virtualized version 6.x properties to be version-7 compatible\nmodule.exports = function t"
},
{
"path": "codemods/7-to-8/rename-components.js",
"chars": 404,
"preview": "const renameMap = {\n FlexColumn: 'Column',\n FlexTable: 'Table',\n VirtualScroll: 'List'\n}\n\nmodule.exports = function t"
},
{
"path": "docs/ArrowKeyStepper.md",
"chars": 5580,
"preview": "## ArrowKeyStepper\n\nHigh-order component that decorates another virtualized component and responds to arrow-key events b"
},
{
"path": "docs/AutoSizer.md",
"chars": 3755,
"preview": "## AutoSizer\n\nHigh-order component that automatically adjusts the width and height of a single child.\n\n### Prop Types\n\n|"
},
{
"path": "docs/CellMeasurer.md",
"chars": 12202,
"preview": "## CellMeasurer\n\nHigh-order component that automatically measures a cell's contents by temporarily rendering it in a way"
},
{
"path": "docs/Collection.md",
"chars": 10845,
"preview": "## Collection\n\nRenders scattered or non-linear data.\nUnlike `Grid`, which renders checkerboard data, `Collection` can re"
},
{
"path": "docs/Column.md",
"chars": 6266,
"preview": "## Column\n\nDescribes the header and cell contents of a table column.\n\n#### Prop Types\n\n| Property | Type "
},
{
"path": "docs/ColumnSizer.md",
"chars": 4003,
"preview": "## ColumnSizer\n\nHigh-order component that auto-calculates column-widths for `Grid` cells.\n\n### Prop Types\n\n| Property "
},
{
"path": "docs/Grid.md",
"chars": 26771,
"preview": "## Grid\n\nA windowed grid of elements. `Grid` only renders cells necessary to fill itself based on the current horizontal"
},
{
"path": "docs/InfiniteLoader.md",
"chars": 9670,
"preview": "## InfiniteLoader\n\nA component that manages just-in-time fetching of data as a user scrolls up or down in a list.\n\nNote "
},
{
"path": "docs/List.md",
"chars": 12054,
"preview": "## List\n\nThis component renders a windowed list (rows) of elements.\nIt uses a `Grid` internally to render the rows and a"
},
{
"path": "docs/Masonry.md",
"chars": 14010,
"preview": "The `Masonry` component efficiently displays dynamically-sized, user-positioned cells using windowing techniques. Cell p"
},
{
"path": "docs/MultiGrid.md",
"chars": 5097,
"preview": "## MultiGrid\n\nDecorates `Grid` and adds fixed columns and/or rows.\nThis is already possible using `ScrollSync` and 2 or "
},
{
"path": "docs/README.md",
"chars": 857,
"preview": "## Documentation\n\n### Components\n\n- [Collection](Collection.md)\n- [Grid](Grid.md)\n- [List](List.md)\n- [Masonry](Masonry."
},
{
"path": "docs/ScrollSync.md",
"chars": 3792,
"preview": "## ScrollSync\n\nHigh order component that simplifies the process of synchronizing scrolling between two or more virtualiz"
},
{
"path": "docs/SortDirection.md",
"chars": 355,
"preview": "## SortDirection\n\nSpecifies which direction [Table](Table.md) data is currently sorted in.\n\n#### SortDirection.ASC\n\nSort"
},
{
"path": "docs/Table.md",
"chars": 21985,
"preview": "## Table\n\nTable component with fixed headers and windowed rows for improved performance with large data sets.\nThis compo"
},
{
"path": "docs/WindowScroller.md",
"chars": 5997,
"preview": "## WindowScroller\n\nA component that enables a `Table` or `List` component to be scrolled based on the window's scroll po"
},
{
"path": "docs/creatingAnInfiniteLoadingList.md",
"chars": 1976,
"preview": "## Creating an Infinite-Loading List\n\nThe `InfiniteLoader` component was created to help break large data sets down into"
},
{
"path": "docs/customizingStyles.md",
"chars": 1428,
"preview": "## Customizing Classes and Styles\n\nReact virtual CSS styles are split into their own, separately loaded stylesheet in or"
},
{
"path": "docs/multiColumnSortTable.md",
"chars": 1503,
"preview": "By default, `Table` assumes that its data will be sorted by single attribute, in either ascending or descending order.\nF"
},
{
"path": "docs/overscanUsage.md",
"chars": 960,
"preview": "The `overscanRowCount` property renders additional rows in the direction the user is scrolling to reduce the chance of a"
},
{
"path": "docs/reverseList.md",
"chars": 1427,
"preview": "## Displaying Items in Reverse Order\n\nSometimes it is desirable to display a list in reverse order.\nThe simplest way to "
},
{
"path": "docs/tableWithNaturalSort.md",
"chars": 1965,
"preview": "By default, `Table` assumes the sortable rows can be sorted in ascending or descending order.\nClicking a column header t"
},
{
"path": "docs/upgrades/Version8.md",
"chars": 3897,
"preview": "Before starting, take a quick look at the [Version 8 Roadmap](https://github.com/bvaughn/react-virtualized/issues/386) t"
},
{
"path": "docs/usingAutoSizer.md",
"chars": 3358,
"preview": "## Using AutoSizer\n\nThe `AutoSizer` component decorates a React element and automatically manages `width` and `height` p"
},
{
"path": "index.html",
"chars": 527,
"preview": "<!doctype html>\n<html>\n <head>\n <title>react-virtualized</title>\n <meta charset=\"utf-8\">\n <meta content=\"width"
},
{
"path": "jest-puppeteer.config.js",
"chars": 134,
"preview": "module.exports = {\n launch: {\n headless: process.env.HEADLESS !== 'false',\n devtools: process.env.DEVTOOLS === 't"
},
{
"path": "jest.config.js",
"chars": 456,
"preview": "module.exports = {\n globalSetup: 'jest-environment-puppeteer/setup',\n globalTeardown: 'jest-environment-puppeteer/tear"
},
{
"path": "package.json",
"chars": 5631,
"preview": "{\n \"name\": \"react-virtualized\",\n \"description\": \"React components for efficiently rendering large, scrollable lists an"
},
{
"path": "playground/chat-no-resize.html",
"chars": 1014,
"preview": "<!DOCTYPE html>\n<html>\n<head>\n <meta charset=\"utf-8\">\n <meta name=\"viewport\" content=\"initial-scale=1, maximum-scale=1"
},
{
"path": "playground/chat-no-resize.js",
"chars": 8158,
"preview": "var cache = new ReactVirtualized.CellMeasurerCache({\n fixedWidth: true,\n});\n\nvar list;\nvar mostRecentWidth;\n\nfunction r"
},
{
"path": "playground/chat.html",
"chars": 1596,
"preview": "<!DOCTYPE html>\n<html>\n<head>\n <meta charset=\"utf-8\">\n <meta name=\"viewport\" content=\"initial-scale=1, maximum-scale=1"
},
{
"path": "playground/chat.js",
"chars": 8453,
"preview": "var cache = new ReactVirtualized.CellMeasurerCache({\n fixedWidth: true,\n});\n\nvar list;\nvar mostRecentWidth;\n\nfunction r"
},
{
"path": "playground/grid-test.html",
"chars": 545,
"preview": "<!DOCTYPE html>\n<html>\n<head>\n <meta charset=\"utf-8\">\n <title>foo</title>\n <style type=\"text/css\">\n body, html, #m"
},
{
"path": "playground/grid-test.js",
"chars": 1077,
"preview": "function cellRenderer(params) {\n return React.createElement(\n 'div',\n {\n className: 'item',\n key: param"
},
{
"path": "playground/grid.html",
"chars": 849,
"preview": "<!DOCTYPE html>\n<html>\n<head>\n <meta charset=\"utf-8\">\n <title>foo</title>\n <style type=\"text/css\">\n body, html, #m"
},
{
"path": "playground/grid.js",
"chars": 1522,
"preview": "var REACT_VIRTUALIZED_BANNER =\n 'https://cloud.githubusercontent.com/assets/29597/11737732/0ca1e55e-9f91-11e5-97f3-098f"
},
{
"path": "playground/helper.js",
"chars": 1358,
"preview": "function loadStyle(source, callback) {\n var link = document.createElement('link');\n link.setAttribute('rel', 'styleshe"
},
{
"path": "playground/hover.html",
"chars": 942,
"preview": "<!DOCTYPE html>\n<html>\n<head>\n <meta charset=\"utf-8\">\n <title>foo</title>\n <style type=\"text/css\">\n body, html, #m"
},
{
"path": "playground/hover.js",
"chars": 1451,
"preview": "var App = React.createClass({\n getInitialState: function() {\n return {};\n },\n\n render: function() {\n var cellRe"
},
{
"path": "playground/render-counters.html",
"chars": 952,
"preview": "<!DOCTYPE html>\n<html>\n<head>\n <meta charset=\"utf-8\">\n <title>foo</title>\n <style type=\"text/css\">\n body, html, #m"
},
{
"path": "playground/render-counters.js",
"chars": 1239,
"preview": "const {PureComponent} = React;\nconst {AutoSizer, List} = ReactVirtualized;\n\nclass ListExample extends PureComponent {\n "
},
{
"path": "playground/scroll-sync.html",
"chars": 430,
"preview": "<!DOCTYPE html>\n<html>\n<head>\n <meta charset=\"utf-8\">\n <title>foo</title>\n <style type=\"text/css\">\n body, html, #m"
},
{
"path": "playground/scroll-sync.js",
"chars": 1622,
"preview": "function cellRenderer(params) {\n return React.createElement(\n 'div',\n {\n className: 'item',\n key: param"
},
{
"path": "playground/table.html",
"chars": 541,
"preview": "<!DOCTYPE html>\n<html>\n<head>\n <meta charset=\"utf-8\">\n <title>foo</title>\n <style type=\"text/css\">\n body, html, #m"
},
{
"path": "playground/table.js",
"chars": 1301,
"preview": "const NUM_COLUMNS = 40;\n\nfunction rowGetter(params) {\n return new Array(NUM_COLUMNS).fill('').map(function(_, index) {\n"
},
{
"path": "playground/tests.js",
"chars": 1161,
"preview": "function createScrollingTestCase(component) {\n var scrollDown = getUrlParam('direction') !== 'up';\n\n return function t"
},
{
"path": "playground/tree.html",
"chars": 739,
"preview": "<!DOCTYPE html>\n<html>\n<head>\n <meta charset=\"utf-8\">\n <title>foo</title>\n <style type=\"text/css\">\n body, html, #m"
},
{
"path": "playground/tree.js",
"chars": 3972,
"preview": "var ROW_HEIGHT = 20;\nvar RANDOM_WORDS = [\n 'abstrusity',\n 'advertisable',\n 'bellwood',\n 'benzole',\n 'boreum',\n 'br"
},
{
"path": "playground/utils.js",
"chars": 384,
"preview": "function getUrlParams() {\n var search = window.location.search;\n\n return search.length\n ? search\n .substr(1)"
},
{
"path": "postcss.config.js",
"chars": 204,
"preview": "module.exports = {\n autoprefixer: {\n browsers: ['last 2 version', 'Firefox 15', 'iOS 8'],\n },\n // The plugins sect"
},
{
"path": "rollup.config.js",
"chars": 849,
"preview": "import nodeResolve from 'rollup-plugin-node-resolve';\nimport commonjs from 'rollup-plugin-commonjs';\nimport babel from '"
},
{
"path": "source/ArrowKeyStepper/ArrowKeyStepper.example.css",
"chars": 457,
"preview": ".Grid {\n border: 1px solid #e0e0e0;\n}\n\n.Cell {\n height: 100%;\n display: flex;\n align-items: center;\n justify-conten"
},
{
"path": "source/ArrowKeyStepper/ArrowKeyStepper.example.js",
"chars": 6064,
"preview": "/** @flow */\n\nimport * as React from 'react';\nimport {\n ContentBox,\n ContentBoxHeader,\n ContentBoxParagraph,\n} from '"
},
{
"path": "source/ArrowKeyStepper/ArrowKeyStepper.jest.js",
"chars": 8189,
"preview": "import * as React from 'react';\nimport {findDOMNode} from 'react-dom';\nimport {render} from '../TestUtils';\nimport Arrow"
},
{
"path": "source/ArrowKeyStepper/ArrowKeyStepper.js",
"chars": 4787,
"preview": "/** @flow */\n\nimport type {RenderedSection} from '../Grid';\nimport type {ScrollIndices} from './types';\n\nimport * as Rea"
},
{
"path": "source/ArrowKeyStepper/index.js",
"chars": 160,
"preview": "// @flow\n\nexport type {ScrollIndices} from './types';\n\nexport {default} from './ArrowKeyStepper';\nexport {default as Arr"
},
{
"path": "source/ArrowKeyStepper/types.js",
"chars": 92,
"preview": "// @flow\n\nexport type ScrollIndices = {\n scrollToColumn: number,\n scrollToRow: number,\n};\n"
},
{
"path": "source/AutoSizer/AutoSizer.example.css",
"chars": 329,
"preview": ".AutoSizerWrapper {\n flex: 1 1 auto;\n}\n\n.List {\n border: 1px solid #e0e0e0;\n}\n\n.row {\n display: flex;\n flex-directio"
},
{
"path": "source/AutoSizer/AutoSizer.example.js",
"chars": 2980,
"preview": "/** @flow */\n\nimport {List as ImmutableList} from 'immutable';\nimport PropTypes from 'prop-types';\nimport * as React fro"
},
{
"path": "source/AutoSizer/AutoSizer.jest.js",
"chars": 7748,
"preview": "import * as React from 'react';\nimport {findDOMNode} from 'react-dom';\nimport {render} from '../TestUtils';\nimport AutoS"
},
{
"path": "source/AutoSizer/AutoSizer.js",
"chars": 5660,
"preview": "/** @flow */\n\nimport * as React from 'react';\nimport createDetectElementResize from '../vendor/detectElementResize';\n\nty"
},
{
"path": "source/AutoSizer/AutoSizer.ssr.js",
"chars": 532,
"preview": "/**\n * @jest-environment node\n */\n\nimport * as React from 'react';\nimport * as ReactDOMServer from 'react-dom/server';\ni"
},
{
"path": "source/AutoSizer/index.js",
"chars": 97,
"preview": "// @flow\n\nexport {default} from './AutoSizer';\nexport {default as AutoSizer} from './AutoSizer';\n"
},
{
"path": "source/CellMeasurer/CellMeasurer.DynamicHeightGrid.example.js",
"chars": 1890,
"preview": "import Immutable from 'immutable';\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimport CellMeasur"
},
{
"path": "source/CellMeasurer/CellMeasurer.DynamicHeightList.example.js",
"chars": 1958,
"preview": "import Immutable from 'immutable';\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimport CellMeasur"
},
{
"path": "source/CellMeasurer/CellMeasurer.DynamicHeightTableColumn.example.js",
"chars": 2255,
"preview": "import Immutable from 'immutable';\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimport CellMeasur"
},
{
"path": "source/CellMeasurer/CellMeasurer.DynamicWidthGrid.example.js",
"chars": 1941,
"preview": "import Immutable from 'immutable';\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimport CellMeasur"
},
{
"path": "source/CellMeasurer/CellMeasurer.DynamicWidthMultiGrid.example.js",
"chars": 2085,
"preview": "import Immutable from 'immutable';\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimport CellMeasur"
},
{
"path": "source/CellMeasurer/CellMeasurer.example.css",
"chars": 1048,
"preview": ".GridRow {\n margin-top: 15px;\n display: flex;\n flex-direction: row;\n}\n.GridColumn {\n display: flex;\n flex-direction"
},
{
"path": "source/CellMeasurer/CellMeasurer.example.js",
"chars": 3795,
"preview": "import Immutable from 'immutable';\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimport {\n Conten"
},
{
"path": "source/CellMeasurer/CellMeasurer.jest.js",
"chars": 8699,
"preview": "import * as React from 'react';\nimport {findDOMNode} from 'react-dom';\nimport {render} from '../TestUtils';\nimport CellM"
},
{
"path": "source/CellMeasurer/CellMeasurer.js",
"chars": 4891,
"preview": "/** @flow */\nimport * as React from 'react';\nimport type {CellMeasureCache} from './types';\nimport {cloneElement} from '"
},
{
"path": "source/CellMeasurer/CellMeasurerCache.jest.js",
"chars": 8796,
"preview": "import CellMeasurerCache, {\n DEFAULT_HEIGHT,\n DEFAULT_WIDTH,\n} from './CellMeasurerCache';\n\ndescribe('CellMeasurerCach"
},
{
"path": "source/CellMeasurer/CellMeasurerCache.js",
"chars": 6499,
"preview": "/** @flow */\n\nimport type {CellMeasureCache} from './types';\n\nexport const DEFAULT_HEIGHT = 30;\nexport const DEFAULT_WID"
},
{
"path": "source/CellMeasurer/index.js",
"chars": 181,
"preview": "/** @flow */\nimport CellMeasurer from './CellMeasurer';\nimport CellMeasurerCache from './CellMeasurerCache';\n\nexport def"
},
{
"path": "source/CellMeasurer/types.js",
"chars": 385,
"preview": "// @flow\n\nexport interface CellMeasureCache {\n hasFixedWidth(): boolean;\n hasFixedHeight(): boolean;\n has(rowIndex: n"
},
{
"path": "source/Collection/Collection.example.css",
"chars": 376,
"preview": ".collection {\n background-color: #fff;\n}\n\n.cell {\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: ce"
},
{
"path": "source/Collection/Collection.example.js",
"chars": 6890,
"preview": "/** @flow */\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimport Immutable from 'immutable';\nimpo"
},
{
"path": "source/Collection/Collection.jest.js",
"chars": 25022,
"preview": "/**\n * Tests Collection and CollectionView.\n * @flow\n */\nimport getScrollbarSize from 'dom-helpers/scrollbarSize';\nimpor"
},
{
"path": "source/Collection/Collection.js",
"chars": 6261,
"preview": "/** @flow */\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimport CollectionView from './Collectio"
},
{
"path": "source/Collection/CollectionView.js",
"chars": 19051,
"preview": "/** @flow */\nimport clsx from 'clsx';\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimport {polyfi"
},
{
"path": "source/Collection/Section.jest.js",
"chars": 1103,
"preview": "import Section from './Section';\n\ndescribe('Section', () => {\n function helper({height = 100, width = 200, x = 0, y = 0"
},
{
"path": "source/Collection/Section.js",
"chars": 1026,
"preview": "/** @flow */\nimport type {Index, SizeAndPositionInfo} from './types';\n\n/**\n * A section of the Window.\n * Window Section"
},
{
"path": "source/Collection/SectionManager.jest.js",
"chars": 2391,
"preview": "import SectionManager from './SectionManager';\nimport {CELLS, SECTION_SIZE} from './TestData';\n\nfunction initSectionMana"
},
{
"path": "source/Collection/SectionManager.js",
"chars": 3038,
"preview": "/**\n * Window Sections are used to group nearby cells.\n * This enables us to more quickly determine which cells to displ"
},
{
"path": "source/Collection/TestData.js",
"chars": 650,
"preview": "/*\n 0 1 2 3 4 5\n ┏━━━┯━━━┯━━━┓\n0┃0 0┊1 3┊6 6┃\n1┃0 0┊2 3┊6 6┃\n ┠┈┈┈┼┈┈┈┼┈┈┈┨\n2┃4 4┊4 3┊7 8┃\n3┃4 4┊4 5┊9 9┃\n ┗━━━┷━━━┷━━━"
},
{
"path": "source/Collection/index.js",
"chars": 101,
"preview": "/** @flow */\nimport Collection from './Collection';\n\nexport default Collection;\nexport {Collection};\n"
},
{
"path": "source/Collection/types.js",
"chars": 358,
"preview": "/** @flow */\n\nexport type Index = {\n index: number,\n};\n\nexport type PositionInfo = {\n x: number,\n y: number,\n};\n\nexpo"
},
{
"path": "source/Collection/utils/calculateSizeAndPositionData.jest.js",
"chars": 934,
"preview": "import calculateSizeAndPositionData from './calculateSizeAndPositionData';\n\ndescribe('calculateSizeAndPositionData', () "
},
{
"path": "source/Collection/utils/calculateSizeAndPositionData.js",
"chars": 1239,
"preview": "import SectionManager from '../SectionManager';\n\nexport default function calculateSizeAndPositionData({\n cellCount,\n c"
},
{
"path": "source/ColumnSizer/ColumnSizer.example.css",
"chars": 489,
"preview": ".GridContainer {\n margin-top: 15px;\n border: 1px solid #e0e0e0;\n}\n\n.cell,\n.firstCell {\n width: 100%;\n height: 100%;\n"
},
{
"path": "source/ColumnSizer/ColumnSizer.example.js",
"chars": 4383,
"preview": "/**\n * @flow\n */\nimport * as React from 'react';\nimport styles from './ColumnSizer.example.css';\nimport AutoSizer from '"
},
{
"path": "source/ColumnSizer/ColumnSizer.jest.js",
"chars": 4231,
"preview": "import * as React from 'react';\nimport {findDOMNode} from 'react-dom';\nimport {render} from '../TestUtils';\nimport Colum"
},
{
"path": "source/ColumnSizer/ColumnSizer.js",
"chars": 2793,
"preview": "/** @flow */\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\n\n/**\n * High-order component that auto-"
},
{
"path": "source/ColumnSizer/index.js",
"chars": 105,
"preview": "/** @flow */\nimport ColumnSizer from './ColumnSizer';\n\nexport default ColumnSizer;\nexport {ColumnSizer};\n"
},
{
"path": "source/Grid/Grid.example.css",
"chars": 973,
"preview": ".GridRow {\n margin-top: 15px;\n display: flex;\n flex-direction: row;\n}\n.GridColumn {\n display: flex;\n flex-direction"
},
{
"path": "source/Grid/Grid.example.js",
"chars": 8584,
"preview": "import Immutable from 'immutable';\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimport {\n Conten"
},
{
"path": "source/Grid/Grid.jest.js",
"chars": 82665,
"preview": "import * as React from 'react';\nimport {findDOMNode} from 'react-dom';\nimport {Simulate} from 'react-dom/test-utils';\nim"
},
{
"path": "source/Grid/Grid.js",
"chars": 53973,
"preview": "/** @flow */\n\nimport type {\n CellRenderer,\n CellRangeRenderer,\n CellPosition,\n CellSize,\n CellSizeGetter,\n NoConte"
},
{
"path": "source/Grid/Grid.ssr.js",
"chars": 1334,
"preview": "/**\n * @flow\n * @jest-environment node\n */\n\nimport * as React from 'react';\nimport * as ReactDOMServer from 'react-dom/s"
},
{
"path": "source/Grid/accessibilityOverscanIndicesGetter.jest.js",
"chars": 2461,
"preview": "import overscanIndicesGetter, {\n SCROLL_DIRECTION_BACKWARD,\n SCROLL_DIRECTION_FORWARD,\n} from './accessibilityOverscan"
},
{
"path": "source/Grid/accessibilityOverscanIndicesGetter.js",
"chars": 1327,
"preview": "// @flow\n\nimport type {OverscanIndicesGetterParams, OverscanIndices} from './types';\n\nexport const SCROLL_DIRECTION_BACK"
},
{
"path": "source/Grid/defaultCellRangeRenderer.js",
"chars": 5710,
"preview": "/** @flow */\n\nimport type {CellRangeRendererParams} from './types';\nimport React from 'react';\n\n/**\n * Default implement"
},
{
"path": "source/Grid/defaultOverscanIndicesGetter.jest.js",
"chars": 2422,
"preview": "import overscanIndicesGetter, {\n SCROLL_DIRECTION_BACKWARD,\n SCROLL_DIRECTION_FORWARD,\n} from './defaultOverscanIndice"
},
{
"path": "source/Grid/defaultOverscanIndicesGetter.js",
"chars": 1045,
"preview": "// @flow\n\nimport type {OverscanIndicesGetterParams, OverscanIndices} from './types';\n\nexport const SCROLL_DIRECTION_BACK"
},
{
"path": "source/Grid/index.js",
"chars": 525,
"preview": "/** @flow */\n\nexport type {\n NoContentRenderer,\n Alignment,\n CellPosition,\n CellSize,\n OverscanIndicesGetter,\n Ren"
},
{
"path": "source/Grid/types.js",
"chars": 2897,
"preview": "// @flow\n\nimport * as React from 'react';\nimport ScalingCellSizeAndPositionManager from './utils/ScalingCellSizeAndPosit"
},
{
"path": "source/Grid/utils/CellSizeAndPositionManager.jest.js",
"chars": 14400,
"preview": "import CellSizeAndPositionManager from './CellSizeAndPositionManager';\n\ndescribe('CellSizeAndPositionManager', () => {\n "
},
{
"path": "source/Grid/utils/CellSizeAndPositionManager.js",
"chars": 9284,
"preview": "/** @flow */\n\nimport type {Alignment, CellSizeGetter, VisibleCellRange} from '../types';\n\ntype CellSizeAndPositionManage"
},
{
"path": "source/Grid/utils/ScalingCellSizeAndPositionManager.jest.js",
"chars": 5610,
"preview": "import ScalingCellSizeAndPositionManager from './ScalingCellSizeAndPositionManager';\n\ndescribe('ScalingCellSizeAndPositi"
},
{
"path": "source/Grid/utils/ScalingCellSizeAndPositionManager.js",
"chars": 5480,
"preview": "/** @flow */\n\nimport type {Alignment, CellSizeGetter, VisibleCellRange} from '../types';\n\nimport CellSizeAndPositionMana"
},
{
"path": "source/Grid/utils/calculateSizeAndPositionDataAndUpdateScrollOffset.jest.js",
"chars": 2582,
"preview": "import calculateSizeAndPositionDataAndUpdateScrollOffset from './calculateSizeAndPositionDataAndUpdateScrollOffset';\n\nde"
},
{
"path": "source/Grid/utils/calculateSizeAndPositionDataAndUpdateScrollOffset.js",
"chars": 1858,
"preview": "// @flow\n\n/**\n * Helper method that determines when to recalculate row or column metadata.\n */\n\ntype Params<T> = {\n // "
},
{
"path": "source/Grid/utils/maxElementSize.js",
"chars": 371,
"preview": "// @flow\n\nconst DEFAULT_MAX_ELEMENT_SIZE = 1500000;\nconst CHROME_MAX_ELEMENT_SIZE = 1.67771e7;\n\nconst isBrowser = () => "
},
{
"path": "source/Grid/utils/updateScrollIndexHelper.jest.js",
"chars": 5068,
"preview": "import updateScrollIndexHelper from './updateScrollIndexHelper';\nimport CellSizeAndPositionManager from './CellSizeAndPo"
},
{
"path": "source/Grid/utils/updateScrollIndexHelper.js",
"chars": 3007,
"preview": "// @flow\n\nimport type {Alignment, CellSize} from '../types';\n\nimport ScalingCellSizeAndPositionManager from './ScalingCe"
},
{
"path": "source/InfiniteLoader/InfiniteLoader.example.css",
"chars": 647,
"preview": ".List {\n width: 100%;\n border: 1px solid #DDD;\n}\n\n.row {\n display: flex;\n flex-direction: row;\n align-items: center"
},
{
"path": "source/InfiniteLoader/InfiniteLoader.example.js",
"chars": 4667,
"preview": "/** @flow */\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport {\n ContentBox,\n ContentBoxHead"
},
{
"path": "source/InfiniteLoader/InfiniteLoader.jest.js",
"chars": 13043,
"preview": "import InfiniteLoader, {\n forceUpdateReactVirtualizedComponent,\n isRangeVisible,\n scanForUnloadedRanges,\n} from './In"
},
{
"path": "source/InfiniteLoader/InfiniteLoader.js",
"chars": 8137,
"preview": "/** @flow */\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport createCallbackMemoizer from '../"
},
{
"path": "source/InfiniteLoader/index.js",
"chars": 117,
"preview": "/** @flow */\nimport InfiniteLoader from './InfiniteLoader';\n\nexport default InfiniteLoader;\nexport {InfiniteLoader};\n"
},
{
"path": "source/List/List.example.css",
"chars": 977,
"preview": ".List {\n width: 100%;\n border: 1px solid #DDD;\n margin-top: 15px;\n}\n\n.row {\n height: 100%;\n display: flex;\n flex-d"
},
{
"path": "source/List/List.example.js",
"chars": 6981,
"preview": "import clsx from 'clsx';\nimport Immutable from 'immutable';\nimport PropTypes from 'prop-types';\nimport * as React from '"
},
{
"path": "source/List/List.jest.js",
"chars": 17224,
"preview": "import * as React from 'react';\nimport {findDOMNode} from 'react-dom';\nimport {render} from '../TestUtils';\nimport {Simu"
},
{
"path": "source/List/List.js",
"chars": 6995,
"preview": "/** @flow */\n\nimport type {\n NoContentRenderer,\n Alignment,\n CellSize,\n CellPosition,\n OverscanIndicesGetter,\n Ren"
},
{
"path": "source/List/index.js",
"chars": 135,
"preview": "/** @flow */\n\nexport type {RowRendererParams} from './types';\n\nexport {default} from './List';\nexport {default as List} "
},
{
"path": "source/List/types.js",
"chars": 500,
"preview": "// @flow\n\nimport * as React from 'react';\n\nexport type RowRendererParams = {\n index: number,\n isScrolling: boolean,\n "
},
{
"path": "source/Masonry/Masonry.example.css",
"chars": 277,
"preview": ".Cell {\n display: flex;\n flex-direction: column;\n border-radius: .5rem;\n padding: 0.5rem;\n background-color: #f7f7f"
},
{
"path": "source/Masonry/Masonry.example.js",
"chars": 8296,
"preview": "/** @flow */\nimport Immutable from 'immutable';\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimpo"
},
{
"path": "source/Masonry/Masonry.jest.js",
"chars": 15530,
"preview": "import * as React from 'react';\nimport {findDOMNode} from 'react-dom';\nimport {Simulate} from 'react-dom/test-utils';\nim"
},
{
"path": "source/Masonry/Masonry.js",
"chars": 13754,
"preview": "/** @flow */\nimport clsx from 'clsx';\nimport * as React from 'react';\nimport {polyfill} from 'react-lifecycles-compat';\n"
},
{
"path": "source/Masonry/PositionCache.js",
"chars": 2328,
"preview": "/** @flow */\nimport createIntervalTree from '../vendor/intervalTree';\n\ntype RenderCallback = (index: number, left: numbe"
},
{
"path": "source/Masonry/createCellPositioner.js",
"chars": 1533,
"preview": "/** @flow */\nimport type {CellMeasurerCache, Positioner} from './Masonry';\n\ntype createCellPositionerParams = {\n cellMe"
},
{
"path": "source/Masonry/index.js",
"chars": 170,
"preview": "/** @flow */\nimport createCellPositioner from './createCellPositioner';\nimport Masonry from './Masonry';\n\nexport default"
},
{
"path": "source/MultiGrid/CellMeasurerCacheDecorator.js",
"chars": 2539,
"preview": "/** @flow */\nimport {CellMeasurerCache} from '../CellMeasurer';\n\ntype CellMeasurerCacheDecoratorParams = {\n cellMeasure"
},
{
"path": "source/MultiGrid/MultiGrid.example.css",
"chars": 141,
"preview": ".Cell {\n display: flex;\n align-items: center;\n justify-content: center;\n border-bottom: 1px solid #eee;\n border-rig"
},
{
"path": "source/MultiGrid/MultiGrid.example.js",
"chars": 3852,
"preview": "/** @flow */\nimport Immutable from 'immutable';\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimpo"
},
{
"path": "source/MultiGrid/MultiGrid.jest.js",
"chars": 23943,
"preview": "import * as React from 'react';\nimport {findDOMNode} from 'react-dom';\nimport {render} from '../TestUtils';\nimport Multi"
},
{
"path": "source/MultiGrid/MultiGrid.js",
"chars": 23130,
"preview": "/** @flow */\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimport {polyfill} from 'react-lifecycle"
},
{
"path": "source/MultiGrid/index.js",
"chars": 97,
"preview": "/** @flow */\nimport MultiGrid from './MultiGrid';\n\nexport default MultiGrid;\nexport {MultiGrid};\n"
},
{
"path": "source/ScrollSync/ScrollSync.example.css",
"chars": 666,
"preview": ".GridRow {\n position: relative;\n display: flex;\n flex-direction: row;\n}\n.GridColumn {\n display: flex;\n flex-directi"
},
{
"path": "source/ScrollSync/ScrollSync.example.js",
"chars": 9043,
"preview": "/** @flow */\nimport * as React from 'react';\nimport {\n ContentBox,\n ContentBoxHeader,\n ContentBoxParagraph,\n} from '."
},
{
"path": "source/ScrollSync/ScrollSync.jest.js",
"chars": 2555,
"preview": "import * as React from 'react';\nimport {findDOMNode} from 'react-dom';\nimport {render} from '../TestUtils';\nimport Scrol"
},
{
"path": "source/ScrollSync/ScrollSync.js",
"chars": 1450,
"preview": "import PropTypes from 'prop-types';\nimport * as React from 'react';\n\n/**\n * HOC that simplifies the process of synchroni"
},
{
"path": "source/ScrollSync/index.js",
"chars": 101,
"preview": "/** @flow */\nimport ScrollSync from './ScrollSync';\n\nexport default ScrollSync;\nexport {ScrollSync};\n"
},
{
"path": "source/Table/Column.jest.js",
"chars": 2701,
"preview": "import * as React from 'react';\nimport Immutable from 'immutable';\nimport defaultCellDataGetter from './defaultCellDataG"
},
{
"path": "source/Table/Column.js",
"chars": 3040,
"preview": "/** @flow */\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimport defaultHeaderRenderer from './de"
},
{
"path": "source/Table/SortDirection.js",
"chars": 346,
"preview": "const SortDirection = {\n /**\n * Sort items in ascending order.\n * This means arranging from the lowest value to the"
},
{
"path": "source/Table/SortIndicator.js",
"chars": 973,
"preview": "import clsx from 'clsx';\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimport SortDirection from '"
},
{
"path": "source/Table/Table.example.css",
"chars": 565,
"preview": ".Table {\n width: 100%;\n margin-top: 15px;\n}\n.headerRow,\n.evenRow,\n.oddRow {\n border-bottom: 1px solid #e0e0e0;\n}\n.odd"
},
{
"path": "source/Table/Table.example.js",
"chars": 9018,
"preview": "/** @flow */\nimport Immutable from 'immutable';\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimpo"
},
{
"path": "source/Table/Table.jest.js",
"chars": 49052,
"preview": "import * as React from 'react';\nimport {findDOMNode} from 'react-dom';\nimport {render} from '../TestUtils';\nimport {Simu"
},
{
"path": "source/Table/Table.js",
"chars": 20466,
"preview": "/** @flow */\n\nimport type {CellPosition} from '../Grid';\n\nimport clsx from 'clsx';\nimport Column from './Column';\nimport"
},
{
"path": "source/Table/createMultiSort.jest.js",
"chars": 6472,
"preview": "import createMultiSort from './createMultiSort';\n\ndescribe('createMultiSort', () => {\n function simulate(\n sort,\n "
},
{
"path": "source/Table/createMultiSort.js",
"chars": 2807,
"preview": "/** @flow */\n\ntype SortDirection = 'ASC' | 'DESC';\n\ntype SortParams = {\n defaultSortDirection: SortDirection,\n event: "
},
{
"path": "source/Table/defaultCellDataGetter.js",
"chars": 540,
"preview": "/** @flow */\nimport type {CellDataGetterParams} from './types';\n\n/**\n * Default accessor for returning a cell value for "
},
{
"path": "source/Table/defaultCellRenderer.js",
"chars": 412,
"preview": "/** @flow */\nimport type {CellRendererParams} from './types';\n\n/**\n * Default cell renderer that displays an attribute a"
},
{
"path": "source/Table/defaultHeaderRenderer.js",
"chars": 709,
"preview": "/** @flow */\nimport * as React from 'react';\nimport SortIndicator from './SortIndicator';\nimport type {HeaderRendererPar"
},
{
"path": "source/Table/defaultHeaderRowRenderer.js",
"chars": 316,
"preview": "/** @flow */\nimport * as React from 'react';\nimport type {HeaderRowRendererParams} from './types';\n\nexport default funct"
},
{
"path": "source/Table/defaultRowRenderer.js",
"chars": 1322,
"preview": "/** @flow */\nimport * as React from 'react';\nimport type {RowRendererParams} from './types';\n\n/**\n * Default row rendere"
},
{
"path": "source/Table/index.js",
"chars": 745,
"preview": "/* @flow */\nimport createMultiSort from './createMultiSort';\nimport defaultCellDataGetter from './defaultCellDataGetter'"
},
{
"path": "source/Table/types.js",
"chars": 788,
"preview": "/** @flow */\nexport type CellDataGetterParams = {\n columnData: ?any,\n dataKey: string,\n rowData: any,\n};\n\nexport type"
},
{
"path": "source/TestUtils.js",
"chars": 1065,
"preview": "import * as ReactDOM from 'react-dom';\n\n/**\n * Helper method for testing components that may use Portal and thus require"
},
{
"path": "source/WindowScroller/WindowScroller.e2e.js",
"chars": 4578,
"preview": "/**\n * @jest-environment jest-environment-puppeteer\n */\n\nconst bootstrap = async () => {\n const page = await global.bro"
},
{
"path": "source/WindowScroller/WindowScroller.example.css",
"chars": 422,
"preview": ".WindowScrollerWrapper {\n flex: 1 1 auto;\n}\n\n.List {\n border: 1px solid #e0e0e0;\n}\n\n.row {\n display: flex;\n flex-dir"
},
{
"path": "source/WindowScroller/WindowScroller.example.js",
"chars": 4971,
"preview": "// @flow\n\nimport clsx from 'clsx';\nimport Immutable from 'immutable';\nimport PropTypes from 'prop-types';\nimport * as Re"
},
{
"path": "source/WindowScroller/WindowScroller.header-resize.e2e.js",
"chars": 5692,
"preview": "/**\n * @jest-environment jest-environment-puppeteer\n */\n\nconst bootstrap = async () => {\n const page = await global.bro"
},
{
"path": "source/WindowScroller/WindowScroller.jest.js",
"chars": 13821,
"preview": "import * as React from 'react';\nimport {findDOMNode} from 'react-dom';\nimport {render} from '../TestUtils';\nimport Windo"
},
{
"path": "source/WindowScroller/WindowScroller.js",
"chars": 7345,
"preview": "// @flow\n\nimport * as React from 'react';\nimport {\n registerScrollListener,\n unregisterScrollListener,\n} from './utils"
},
{
"path": "source/WindowScroller/WindowScroller.ssr.js",
"chars": 551,
"preview": "/**\n * @jest-environment node\n */\n\nimport * as React from 'react';\nimport * as ReactDOMServer from 'react-dom/server';\ni"
},
{
"path": "source/WindowScroller/index.js",
"chars": 160,
"preview": "// @flow\n\nimport WindowScroller, {IS_SCROLLING_TIMEOUT} from './WindowScroller';\n\nexport default WindowScroller;\nexport "
},
{
"path": "source/WindowScroller/utils/dimensions.js",
"chars": 2725,
"preview": "// @flow\n\n/**\n * Gets the dimensions of the element, accounting for API differences between\n * `window` and other DOM el"
},
{
"path": "source/WindowScroller/utils/onScroll.js",
"chars": 2437,
"preview": "// @flow\n'no babel-plugin-flow-react-proptypes';\n\nimport {\n requestAnimationTimeout,\n cancelAnimationTimeout,\n} from '"
},
{
"path": "source/demo/Application.css",
"chars": 1833,
"preview": "html, body, :global(#root) {\n height: 100%;\n}\n\nbody {\n padding: 0;\n margin: 0;\n font-family: 'Roboto', 'Open Sans', "
},
{
"path": "source/demo/Application.js",
"chars": 6813,
"preview": "import Immutable from 'immutable';\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimport {Redirect}"
},
{
"path": "source/demo/ComponentLink.css",
"chars": 435,
"preview": ".ComponentLink {\n display: list-item;\n background: none;\n border: none;\n padding: .6rem;\n color: #bdbdbd;\n cursor:"
},
{
"path": "source/demo/ComponentLink.js",
"chars": 403,
"preview": "import * as React from 'react';\nimport {NavLink} from 'react-router-dom';\nimport styles from './ComponentLink.css';\n\nexp"
},
{
"path": "source/demo/ContentBox.css",
"chars": 563,
"preview": ".ContentBox {\n flex: 1 0 auto;\n display: flex;\n flex-direction: column;\n background-color: #FFF;\n padding: 0 1rem 1"
},
{
"path": "source/demo/ContentBox.js",
"chars": 994,
"preview": "import * as React from 'react';\nimport clsx from 'clsx';\nimport styles from './ContentBox.css';\n\nexport function Content"
}
]
// ... and 27 more files (download for full content)
About this extraction
This page contains the full source code of the bvaughn/react-virtualized GitHub repository, extracted and formatted as plain text for AI agents and large language models (LLMs). The extraction includes 227 files (1.0 MB), approximately 259.9k tokens, and a symbol index with 591 extracted functions, classes, methods, constants, and types. Use this with OpenClaw, Claude, ChatGPT, Cursor, Windsurf, or any other AI tool that accepts text input. You can copy the full output to your clipboard or download it as a .txt file.
Extracted by GitExtract — free GitHub repo to text converter for AI. Built by Nikandr Surkov.