xdesign-vue-next/lib/hooks/useResizeObserver.js

XDesign Component for vue-next

/**
 * xdesign v1.0.6
 * (c) 2023 xdesign
 * @license MIT
 */

import { watch, onBeforeUnmount } from 'vue';

function useResizeObserver(container, callback) {
  if (typeof window === "undefined") return;
  var isSupport = window && window.ResizeObserver;
  if (!isSupport) return;
  var containerObserver = null;
  var cleanupObserver = function cleanupObserver() {
    if (!containerObserver) return;
    containerObserver.unobserve(container.value);
    containerObserver.disconnect();
    containerObserver = null;
  };
  var addObserver = function addObserver(el) {
    containerObserver = new ResizeObserver(callback);
    containerObserver.observe(el);
  };
  if (container) {
    watch(container, function (el) {
      cleanupObserver();
      el && addObserver(el);
    }, {
      immediate: true,
      flush: "post"
    });
  }
  onBeforeUnmount(function () {
    cleanupObserver();
  });
}

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