rc
react-cluster
npm i react-cluster
rc

react-cluster

React component to display large sets of data in a scroll container

by Ayrton

0.1.2 (see all)License:MITTypeScript:Not Found
npm i react-cluster
Readme

react-cluster npm version Build Status

React component to display large sets of data in a scroll container.

react-cluster

Usage

<Cluster className="cluster" height={100} rowHeight={50}>
  <span />
  <span />
  <span />
  ...
</Cluster>

The props types of the Cluster component are:

type Props = {
  children: Array<ReactElement>,
  className: ?string,
  height: number,
  onIndexChange: ?Function,
  onScrollChange: ?Function,
  onScrollEnd: ?Function,
  rowHeight: number,
};

There are 3 ways to hook into the component:

/**
 * Called when the row index has changed.
 *
 * @param index {Number}
 */

function onIndexChange(index) {
}

/**
 * Called when the cluster is scrolled.
 *
 * @param cluster {HTMLElement}
 */

function onScrollChange(cluster) {
}

/**
 * Called when the cluster is scrolled near the end.
 */

function onScrollEnd() {
}

Installation

$ npm install

Development

To start the server:

$ npm start

Tests

To run all tests:

$ npm test

Or you can run the linters, unit tests and check for type errors individually:

$ npm run test:lint
$ npm run test:unit
$ npm run test:flow # or ./node_modules/.bin/flow

Contributing

Bug reports and pull requests are welcome on GitHub. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the Contributor Covenant code of conduct.

License

 _________________
< The MIT License >
 -----------------
        \   ^__^
         \  (oo)\_______
            (__)\       )\/\
                ||----w |
                ||     ||

Downloads/wk

0

GitHub Stars

115

LAST COMMIT

6yrs ago

MAINTAINERS

2

CONTRIBUTORS

3

OPEN ISSUES

2

OPEN PRs

0
VersionTagPublished
0.1.2
latest
6yrs ago
No alternatives found
No tutorials found
Add a tutorial
No dependencies found

Rate & Review

100
No reviews found
Be the first to rate