Skip to content
[UNMAINTAINED] React component-wrapper detecting height changes of its children
Branch: master
Clone or download
Latest commit 57116aa Sep 12, 2016
Type Name Latest commit message Commit time
Failed to load latest commit information.
example initial commit Jun 4, 2016
src additional height changes check Aug 19, 2016
.gitignore initial commit Jun 4, 2016
.npmignore add .npmignore Jun 5, 2016
LICENSE Create LICENSE Jun 5, 2016
package.json 1.0.7 Aug 19, 2016
webpack.config.js remove index.js Jun 5, 2016

Deprecation notice

This is unmaintained. Check out

react-height-reporter npm

React component-wrapper detecting height changes of its children.

Heavily inspired by react-height but somehow it wasn't accurate enough so I tried to make my own implementation. This implementation uses ResizeSensor from css-element-queries



npm install --save react react-dom react-height-reporter

Don't forget to manually install peer dependencies (react, react-dom) if you use npm@3.


import HeightReporter from 'react-height-reporter';

<HeightReporter onHeightChange={height => console.log(height)}>
  <div>CONTENT GOES HERE</div>
  <div>AND HERE</div>


onHeightChange: PropTypes.func.isRequired

Callback called on mount and height changes

children: PropTypes.node.isRequired

Children with static or dynamic height

Pass-through props

You can pass any valid props, like style or className to HeightReporter, they will be applied to container


To run example, use npm start and then go to http://localhost:8080



You can’t perform that action at this time.