tdesign-react/es/hooks/useResizeObserver.js

TDesign Component for React

/**
 * tdesign v1.16.2
 * (c) 2025 tdesign
 * @license MIT
 */

import useIsomorphicLayoutEffect from './useLayoutEffect.js';
import { c as canUseDocument } from '../_chunks/dep-ca8d3fa0.js';
import useLatest from './useLatest.js';
import 'react';
import 'lodash-es';

function useResizeObserver(container, callback) {
  var enabled = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
  var callbackRef = useLatest(callback);
  useIsomorphicLayoutEffect(function () {
    var isSupport = canUseDocument && window.ResizeObserver;
    var element = container.current;
    var observer = null;
    if (!enabled) return;
    if (isSupport && element) {
      var resizeCallback = function resizeCallback(entries) {
        callbackRef.current(entries);
      };
      observer = new ResizeObserver(resizeCallback);
      observer.observe(element);
    }
    return function () {
      if (observer && element) {
        var _observer$disconnect, _observer;
        observer.unobserve(element);
        (_observer$disconnect = (_observer = observer).disconnect) === null || _observer$disconnect === void 0 || _observer$disconnect.call(_observer);
        observer = null;
      }
    };
  }, [container, enabled]);
}

export { useResizeObserver as default };
//# sourceMappingURL=useResizeObserver.js.map