{"_id":"@blinq-reach/rect","name":"@blinq-reach/rect","dist-tags":{"latest":"0.18.0"},"versions":{"0.18.0":{"name":"@blinq-reach/rect","version":"0.18.0","description":"Measure React elements position in the DOM","author":{"name":"React Training","email":"hello@reacttraining.com"},"license":"MIT","sideEffects":["*.css"],"repository":{"type":"git","url":"git+https://github.com/reach/reach-ui.git","directory":"packages/rect"},"dependencies":{"@reach/observe-rect":"1.2.0","@blinq-reach/utils":"0.18.0"},"devDependencies":{"react":"^18.2.0","react-dom":"^18.2.0","tsup":"^6.1.3","@reach-internal/dev":"0.0.0","@reach-internal/test":"0.0.0","@reach-internal/tsconfig":"0.0.0"},"peerDependencies":{"react":"^18.2.0","react-dom":"^18.2.0"},"main":"./dist/reach-rect.cjs.js","types":"./dist/reach-rect.d.ts","publishConfig":{"access":"public"},"module":"./dist/reach-rect.mjs","scripts":{"build":"tsup"},"bugs":{"url":"https://github.com/reach/reach-ui/issues"},"homepage":"https://github.com/reach/reach-ui#readme","_id":"@blinq-reach/rect@0.18.0","_integrity":"sha512-bNpUxEokTw4swQCeHjWKezRvsHWliMPo9bO77iU3/9m2azxA4Y384VF6mt+i6fvn5TOkY4O/cW6mNC81nvVZdg==","_resolved":"/tmp/6751c525b8c81c907c54da55e0411951/blinq-reach-rect-0.18.0.tgz","_from":"file:blinq-reach-rect-0.18.0.tgz","_nodeVersion":"18.16.0","_npmVersion":"9.5.1","dist":{"integrity":"sha512-bNpUxEokTw4swQCeHjWKezRvsHWliMPo9bO77iU3/9m2azxA4Y384VF6mt+i6fvn5TOkY4O/cW6mNC81nvVZdg==","shasum":"96ac4e761edde6466b6f472742465dd5a2e4d596","tarball":"https://registry.npmjs.org/@blinq-reach/rect/-/rect-0.18.0.tgz","fileCount":4,"unpackedSize":3798,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDbNGbbH3vTSpbQZqc9joyNBmMa6wx0LksjcB1oqUlTkAIgM4TjmGJ5XRO40tRwwzaQKFSPLcWb0UXS0u0YiT7CjI0="}]},"_npmUser":{"name":"willhackett","email":"will@willhackett.com"},"directories":{},"maintainers":[{"name":"willhackett","email":"will@willhackett.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/rect_0.18.0_1684374054683_0.04318019288073094"},"_hasShrinkwrap":false}},"time":{"created":"2023-05-18T01:40:54.582Z","0.18.0":"2023-05-18T01:40:54.825Z","modified":"2023-05-18T01:40:55.019Z"},"maintainers":[{"name":"willhackett","email":"will@willhackett.com"}],"description":"Measure React elements position in the DOM","homepage":"https://github.com/reach/reach-ui#readme","repository":{"type":"git","url":"git+https://github.com/reach/reach-ui.git","directory":"packages/rect"},"author":{"name":"React Training","email":"hello@reacttraining.com"},"bugs":{"url":"https://github.com/reach/reach-ui/issues"},"license":"MIT","readme":"# @reach/rect\n\n[![Stable release](https://img.shields.io/npm/v/@reach/rect.svg)](https://npm.im/@reach/rect) ![MIT license](https://badgen.now.sh/badge/license/MIT)\n\n[Docs](https://reach.tech/rect) | [Source](https://github.com/reach/reach-ui/tree/main/packages/rect)\n\nMeasures DOM elements (aka. bounding client rect). See also [Element.getBoundingClientRect()](https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect)\n\n```jsx\nimport { Rect, useRect } from \"@blinq-reach/rect\";\n\nfunction Example() {\n\tconst ref = React.useRef();\n\tconst rect = useRect(ref);\n\n\treturn (\n\t\t<div>\n\t\t\t<pre>{JSON.stringify(rect, null, 2)}</pre>\n\t\t\t<div\n\t\t\t\tref={ref}\n\t\t\t\tcontentEditable\n\t\t\t\tdangerouslySetInnerHTML={{\n\t\t\t\t\t__html: \"Edit this to change the size!\",\n\t\t\t\t}}\n\t\t\t/>\n\t\t</div>\n\t);\n}\n```\n","readmeFilename":"README.md"}