https://github.com/jonahdc/use-multiple-rects

A React hook that retrieves the window position and dimensions of multiple elements by unique IDs.
https://github.com/jonahdc/use-multiple-rects

dimensions dom hooks measure react rect typescript

Last synced: 25 days ago
JSON representation

A React hook that retrieves the window position and dimensions of multiple elements by unique IDs.

• Host: GitHub
• URL: https://github.com/jonahdc/use-multiple-rects
• Owner: jonahdc
• License: mit
• Created: 2020-04-07T17:07:39.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2024-12-13T07:54:33.000Z (about 1 year ago)
• Last Synced: 2025-10-19T11:34:15.236Z (5 months ago)
• Topics: dimensions, dom, hooks, measure, react, rect, typescript
• Language: TypeScript
• Homepage: https://use-multiple-rects.now.sh
• Size: 5.2 MB
• Stars: 4
• Watchers: 1
• Forks: 0
• Open Issues: 24
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# useMultipleRects

A React hook that retrieves the window position and dimensions of multiple elements by unique IDs.

Demo: https://use-multiple-rects.now.sh/

## Install

```

npm install --save use-multiple-rects

```

or

```

yarn add use-multiple-rects

```

## Usage

```javascript

import { useMultipleRects } from 'use-multiple-rects';

const example = () => {

  const ids = ['id1', 'id2', 'id3'];

  const [refs, rects] = useMultipleRects({ ids });

  return (

    <>

      
Dimensions: {JSON.stringify(rects['id1'])}

      
Dimensions: {JSON.stringify(rects['id2'])}

      
Dimensions: {JSON.stringify(rects['id3'])}

    >

  );

};

```


## License

MIT