@react-lit/rect

Provides and useRect to measure Elements via
Element.getBoundingClientRect().

Installation

``bash $ npm i @react-lit/rect

`or`


$ yarn add @react-lit/rect


Example

`js import * as React from 'react'; import { Rect, useRect } from "@react-lit/rect";

// (1) Example using function RectExample() { return ( {({ ref, rect }) => (


          {JSON.stringify(rect, null, 2)}

                      ref={ref}
            contentEditable
            dangerouslySetInnerHTML={{
              __html: "Edit this to change the size!",
            }}
          />


      )}
    
  );
}
// (2) Example using useRect()
function UseRefExample() {
  const ref = React.useRef();
  const rect = useRect(ref);
  return (
    

      {JSON.stringify(rect, null, 2)}

              ref={ref}
        contentEditable
        dangerouslySetInnerHTML={{
          __html: "Edit this to change the size!",
        }}
      />
    

  );
}


Development
(1) Install dependencies

`bash $ npm i

`or`


$ yarn


(2) Run initial validation

`bash $ ./Taskfile.sh validate`

(3) Run tests in watch-mode to validate functionality.

`bash $ ./Taskfile test -w``

---

_This project was set up by @jvdx/core_