use-deep-compare-effect
Version:
It's react's useEffect hook, except using deep comparison on the inputs, not reference equality
77 lines (56 loc) • 2.28 kB
JavaScript
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react')) :
typeof define === 'function' && define.amd ? define(['exports', 'react'], factory) :
(factory((global.UseDeepCompareEffect = {}),global.React));
}(this, (function (exports,React) { 'use strict';
React = React && React.hasOwnProperty('default') ? React['default'] : React;
function dequal(foo, bar) {
var ctor, len;
if (foo === bar) return true;
if (foo && bar && (ctor = foo.constructor) === bar.constructor) {
if (ctor === Date) return foo.getTime() === bar.getTime();
if (ctor === RegExp) return foo.toString() === bar.toString();
if (ctor === Array && (len = foo.length) === bar.length) {
while (len-- && dequal(foo[len], bar[len])) {}
return len === -1;
}
if (ctor === Object) {
if (Object.keys(foo).length !== Object.keys(bar).length) return false;
for (len in foo) {
if (!(len in bar) || !dequal(foo[len], bar[len])) return false;
}
return true;
}
}
return foo !== foo && bar !== bar;
}
function checkDeps(deps) {
if (!deps || !deps.length) {
throw new Error('useDeepCompareEffect should not be used with no dependencies. Use React.useEffect instead.');
}
if (deps.every(isPrimitive)) {
throw new Error('useDeepCompareEffect should not be used with dependencies that are all primitive values. Use React.useEffect instead.');
}
}
function isPrimitive(val) {
return val == null || /^[sbn]/.test(typeof val);
}
function useDeepCompareMemoize(value) {
var ref = React.useRef();
if (!dequal(value, ref.current)) {
ref.current = value;
}
return ref.current;
}
function useDeepCompareEffect(callback, dependencies) {
checkDeps(dependencies);
React.useEffect(callback, useDeepCompareMemoize(dependencies));
}
function useDeepCompareEffectNoCheck(callback, dependencies) {
React.useEffect(callback, useDeepCompareMemoize(dependencies));
}
exports.useDeepCompareEffectNoCheck = useDeepCompareEffectNoCheck;
exports.default = useDeepCompareEffect;
Object.defineProperty(exports, '__esModule', { value: true });
})));
//# sourceMappingURL=use-deep-compare-effect.umd.js.map