tdesign-react/cjs/hooks/useResizeObserver.js

TDesign Component for React

/**
 * tdesign v1.16.6
 * (c) 2026 tdesign
 * @license MIT
 */

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var React = require('react');
var _util_style = require('../_chunks/dep-2bbded38.js');
var hooks_useLatest = require('./useLatest.js');
var hooks_useLayoutEffect = require('./useLayoutEffect.js');
require('../_chunks/dep-202d6c73.js');
require('../_chunks/dep-615c149d.js');
require('../_chunks/dep-90a93885.js');
require('../_chunks/dep-a8d5081a.js');
require('../_chunks/dep-0173c82c.js');

function useResizeObserver(container, callback) {
  var enabled = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
  var callbackRef = hooks_useLatest["default"](callback);
  var observerRef = React.useRef(null);
  hooks_useLayoutEffect["default"](function () {
    var isSupport = _util_style.canUseDocument && window.ResizeObserver;
    var element = container.current;
    if (!enabled) return;
    if (isSupport && element && element instanceof Element) {
      var resizeCallback = function resizeCallback(entries) {
        callbackRef.current(entries);
      };
      observerRef.current = new ResizeObserver(resizeCallback);
      observerRef.current.observe(element);
    }
    return function () {
      if (observerRef.current && element && element instanceof Element) {
        var _observerRef$current$, _observerRef$current;
        observerRef.current.unobserve(element);
        (_observerRef$current$ = (_observerRef$current = observerRef.current).disconnect) === null || _observerRef$current$ === void 0 || _observerRef$current$.call(_observerRef$current);
        observerRef.current = null;
      }
    };
  }, [container, enabled]);
}

exports["default"] = useResizeObserver;
//# sourceMappingURL=useResizeObserver.js.map