tdesign-react/cjs/hooks/useResizeObserver.js

TDesign Component for React

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

'use strict';

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

var hooks_useLayoutEffect = require('./useLayoutEffect.js');
var _util_style = require('../_chunks/dep-381fa848.js');
var hooks_useLatest = require('./useLatest.js');
require('react');
require('../_chunks/dep-4ed9eda4.js');
require('../_chunks/dep-25585736.js');
require('../_chunks/dep-667ac7af.js');
require('../_chunks/dep-64577888.js');
require('../_chunks/dep-62e73936.js');

function useResizeObserver(container, callback) {
  var enabled = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
  var callbackRef = hooks_useLatest["default"](callback);
  hooks_useLayoutEffect["default"](function () {
    var isSupport = _util_style.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]);
}

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