@ozen-ui/kit
Version:
React component library
58 lines (57 loc) • 2.49 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.useMultipleResizeObserver = useMultipleResizeObserver;
var tslib_1 = require("tslib");
var react_1 = require("react");
var OzenProvider_1 = require("../../components/OzenProvider");
var isFunction_1 = require("../../utils/isFunction");
var useCreateResizeObserver_1 = require("../useCreateResizeObserver");
var useStoredValue_1 = require("../useStoredValue");
function useMultipleResizeObserver(elements, onChange, options) {
var ssr = (0, OzenProvider_1.useOzenSSR)();
var observer = (0, useCreateResizeObserver_1.useCreateResizeObserver)(function (entries) {
onChange === null || onChange === void 0 ? void 0 : onChange(entries);
});
var getElements = function () { return ((0, isFunction_1.isFunction)(elements) ? elements() : elements); };
var previousConnectedElements = (0, useStoredValue_1.useStoredValue)(function () { return tslib_1.__spreadArray([], tslib_1.__read(getElements()), false); });
var reconnect = function (isForce) {
if (isForce === void 0) { isForce = false; }
var newElements = getElements();
var hasChangesInElements = (function () {
if (isForce) {
return true;
}
if (previousConnectedElements.current.length !== newElements.length) {
return true;
}
var hasDifferenceInElements = newElements.some(function (element) {
return !previousConnectedElements.current.find(function (previousElementsElement) { return previousElementsElement === element; });
});
return hasDifferenceInElements;
})();
if (!hasChangesInElements) {
return;
}
previousConnectedElements.current = newElements;
observer === null || observer === void 0 ? void 0 : observer.disconnect();
newElements === null || newElements === void 0 ? void 0 : newElements.forEach(function (element) {
if (!element) {
return;
}
observer === null || observer === void 0 ? void 0 : observer.observe(element, options);
});
};
(0, react_1.useEffect)(function () {
if (ssr.config.isEnabled) {
setTimeout(function () {
reconnect();
});
}
else {
reconnect();
}
}, [elements]);
return {
reconnect: reconnect,
};
}