Package detail

@ryvora/rect

ryvora16MIT2.0.0

A utility library for rectangle and bounding box calculations in JavaScript/TypeScript.

rect, rectangle, domrect, geometry

readme

@ryvora/rect 📐

Hello Layout Enthusiast! 🖼️

The @ryvora/rect package provides utilities for observing and working with rectangles (DOMRects) in the browser. It's perfect for UI libraries, overlays, and any scenario where you need to track element positions and sizes.

It's like having a live measuring tape for your DOM elements!

Why would you need this?

  • Track element position and size for overlays, tooltips, or popups
  • React to layout changes in real time
  • Build custom UI components that depend on geometry

How it Works (Typically):

It provides a function to observe an element's bounding rectangle and notifies you when it changes.

Basic Usage

import { observeElementRect } from '@ryvora/rect';

const stopObserving = observeElementRect(element, (rect) => {
  console.log('Element rect changed:', rect);
});

// Later, to stop observing:
stopObserving();

Look at your UI from every angle and build smarter layouts! ✨

License

MIT