@difizen/mana-core
Version:
35 lines • 1.39 kB
JavaScript
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
import { useLayoutEffect } from 'react';
import ResizeObserver from 'resize-observer-polyfill';
import { useLatest } from "../utils/index";
export function useViewSize(view, ref) {
var callback = useLatest(function (size) {
var _view$onViewResize;
(_view$onViewResize = view.onViewResize) === null || _view$onViewResize === void 0 || _view$onViewResize.call(view, size);
});
useLayoutEffect(function () {
if (_typeof(ref) !== 'object') {
return function () {
//
};
}
var el = ref === null || ref === void 0 ? void 0 : ref.current;
if (!el || !view.onViewResize) {
return function () {
//
};
}
var resizeObserver = new ResizeObserver(function (entries) {
entries.forEach(function (entry) {
callback.current({
width: entry.target.clientWidth,
height: entry.target.clientHeight
});
});
});
resizeObserver.observe(el);
return function () {
resizeObserver.disconnect();
};
}, [callback, ref, view.container, view.onViewResize]);
}