import * as React from "react";
import { Document } from "../utils/globals.js";
import { contentDependency } from "../utils/objects.js";
import { useDidUpdateEffect } from "./useDidUpdateEffect.js";
import { useEventListener } from "./useEventListener.js";
import { useResizeObserver } from "./useResizeObserver.js";
function useBoundingClientRect(ref, onChange, listenToScroll = true) {
  var _a;
  const [rect, setRect] = React.useState(((_a = ref.current) == null ? void 0 : _a.getBoundingClientRect()) || new DOMRect(0, 0, 0, 0));
  const domRectToObject = React.useCallback((domRect) => {
    const { top, right, bottom, left, width, height, x, y } = domRect;
    return { top, right, bottom, left, width, height, x, y };
  }, []);
  const setRectSize = React.useCallback(() => {
    if (ref.current) {
      const boundingClientRect = ref.current.getBoundingClientRect();
      if (contentDependency(domRectToObject(boundingClientRect)) !== contentDependency(domRectToObject(rect))) {
        onChange == null ? void 0 : onChange(boundingClientRect);
        setRect(boundingClientRect);
      }
    }
  }, [ref, domRectToObject, rect, onChange]);
  useResizeObserver(setRectSize, {}, ref);
  useDidUpdateEffect(() => {
    if (listenToScroll) {
      setRectSize();
    }
  }, [listenToScroll]);
  const onScroll = React.useCallback(() => {
    if (listenToScroll) {
      setRectSize();
    }
  }, [listenToScroll, setRectSize]);
  useEventListener("resize", setRectSize, Document);
  useEventListener("scroll", onScroll, Document, { capture: true });
  React.useEffect(() => {
    setRectSize();
  }, []);
  return [rect, setRectSize];
}
export {
  useBoundingClientRect
};
//# sourceMappingURL=useBoundingClientRect.js.map
