react-use-real-dimensions 🕊️↔😌

So react-use-dimensions will measure your rendered elements in place.

But react-use-real-dimensions will measure your elements in isolation, unconstrained by the rest of the page layout.

Demo

Text in a 100px wide box:

Aw dude you're cramping my style

react-use-dimensions - width: , height:

Aw dude you're cramping my style

react-use-real-dimensions - width: , height:

Installation

npm install react-use-real-dimensions --save

or
yarn add react-use-real-dimensions

Usage

Use it just like react-use-dimensions.