import { useState, useEffect } from "react";
const useRectHook = ref => {
  const [size, setSize] = useState({
    x: 0,
    y: 0,
    top: 0,
    left: 0,
    bottom: 0,
    right: 0,
    width: 0,
    height: 0
  });
  useEffect(() => {
    const listener = () => {
      if (ref && ref.current) {
        const rect = ref.current.getBoundingClientRect();
        setSize({
          x: rect.x,
          y: rect.y,
          top: rect.top,
          left: rect.left,
          bottom: rect.bottom,
          right: rect.right,
          width: rect.width,
          height: rect.height
        });
      }
    };
    listener();
    window.addEventListener("resize", listener);
    return () => {
      window.removeEventListener("resize", listener);
    };
  }, [ref]);
  return {
    ...size
  };
};
export default useRectHook;
//# sourceMappingURL=useRectHook.js.map