@reach/rect

Measure React elements position in the DOM

Last updated 4 years ago by mjackson .

MIT · Repository · Bugs · Original npm · Tarball · package.json

$ npm install @reach/rect

SYNC missed versions from official npm registry.

@reach/rect

Measures DOM elements (aka. bounding client rect). See also Element.getBoundingClientRect()

import { Rect, useRect } from "@reach/rect";

function Example() {
	const ref = React.useRef();
	const rect = useRect(ref);

	return (
		<div>
			<pre>{JSON.stringify(rect, null, 2)}</pre>
			<div
				ref={ref}
				contentEditable
				dangerouslySetInnerHTML={{
					__html: "Edit this to change the size!",
				}}
			/>
		</div>
	);
}

Current Tags

0.18.0 ... latest (2 years ago)
0.4.0-beta.0 ... next (5 years ago)
0.18.0-pre.5 ... pre (2 years ago)

50 Versions

Maintainers (4)

chancestrickland

Downloads

Total 0

Today 0

This Week 0

This Month 0

Last Day 0

Last Week 0

Last Month 0

Dependencies (5)

@reach/observe-rect 1.2.0
@reach/utils 0.15.0
prop-types ^15.7.2
tiny-warning ^1.0.3
tslib ^2.1.0

Dev Dependencies (2)

react ^17.0.2
react-dom ^17.0.2

Dependents (3)

© 2010 - cnpmjs.org x YWFE | Home | YWFE