@wordpress/compose/build/hooks/use-resize-observer/use-resize-observer.js

WordPress higher-order components (HOCs).

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.useResizeObserver = useResizeObserver;
var _element = require("@wordpress/element");
var _useEvent = _interopRequireDefault(require("../use-event"));
/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

// This is the current implementation of `useResizeObserver`.
//
// The legacy implementation is still supported for backwards compatibility.
// This is achieved by overloading the exported function with both signatures,
// and detecting which API is being used at runtime.
function useResizeObserver(callback, resizeObserverOptions = {}) {
  const callbackEvent = (0, _useEvent.default)(callback);
  const observedElementRef = (0, _element.useRef)();
  const resizeObserverRef = (0, _element.useRef)();
  return (0, _useEvent.default)(element => {
    var _resizeObserverRef$cu;
    if (element === observedElementRef.current) {
      return;
    }

    // Set up `ResizeObserver`.
    (_resizeObserverRef$cu = resizeObserverRef.current) !== null && _resizeObserverRef$cu !== void 0 ? _resizeObserverRef$cu : resizeObserverRef.current = new ResizeObserver(callbackEvent);
    const {
      current: resizeObserver
    } = resizeObserverRef;

    // Unobserve previous element.
    if (observedElementRef.current) {
      resizeObserver.unobserve(observedElementRef.current);
    }

    // Observe new element.
    observedElementRef.current = element;
    if (element) {
      resizeObserver.observe(element, resizeObserverOptions);
    }
  });
}
//# sourceMappingURL=use-resize-observer.js.map