@simbathesailor/use-what-changed
Advanced tools
Comparing version 0.1.14 to 0.1.15
@@ -40,3 +40,3 @@ 'use strict'; | ||
function useWhatChanged(dependency, dependencyNames) { | ||
function useWhatChanged(dependency, dependencyNames, suffix) { | ||
// This ref is responsible for book keeping of the old value | ||
@@ -51,3 +51,3 @@ var dependencyRef = React.useRef(dependency); // For count bookkeeping , for easy debugging | ||
// const MyWindow: IWindow = window; | ||
if (dependencyRef.current && isDependencyArr && dependencyRef.current.length > 1) { | ||
if (dependencyRef.current && isDependencyArr && dependencyRef.current.length > 0) { | ||
what_debug_changed++; | ||
@@ -59,4 +59,8 @@ whatChangedHookCountRef.current = what_debug_changed; | ||
React.useEffect(function () { | ||
if (!(dependencyRef.current && isDependencyArr && dependencyRef.current.length > 0)) { | ||
if (!(dependencyRef.current && isDependencyArr)) { | ||
return; | ||
} | ||
if (dependencyRef.current.length === 0) { | ||
return; | ||
} // invariant( | ||
@@ -71,3 +75,3 @@ // isDevelopment, | ||
{ | ||
console.log("%c What Changed in Effect ID " + whatChangedHookCountRef.current + " ", "background: " + backgroundColorRef.current + "; color: white; font-size: 10px", '🧐👇'); | ||
console.log("%c What Changed in Effect ID " + whatChangedHookCountRef.current + " " + (suffix || ''), "background: " + backgroundColorRef.current + "; color: white; font-size: 10px", '🧐👇'); | ||
} // More info, if needed by user | ||
@@ -74,0 +78,0 @@ |
@@ -1,2 +0,2 @@ | ||
"use strict";var e,r=(e=require("react"))&&"object"==typeof e&&"default"in e?e.default:e,t=0,n=function(e){return"[object Object]"===Object.prototype.toString.call(e)};function u(e){return n(e)||Array.isArray(e)?JSON.stringify(e,null,2):e}exports.useWhatChanged=function(e,n){var c=r.useRef(e),a=r.useRef(1),l=r.useRef(""),o=Array.isArray(c.current);r.useEffect((function(){c.current&&o&&c.current.length>1&&(t++,a.current=t,l.current=function(){for(var e="#",r=0;r<6;r++)e+="0123456789ABCDEF"[Math.floor(16*Math.random())];return e}())}),[c,o]),r.useEffect((function(){if(c.current&&o&&c.current.length>0){console.log("%c What Changed in Effect ID "+a.current+" ","background: "+l.current+"; color: white; font-size: 10px","🧐👇");var r=n?n.split(","):null,t=e?e.reduce((function(e,t,a){if(c.current&&t!==c.current[a]){var l=c.current[a];return c.current[a]=t,n&&r?e[r[a]+' "✅"']={"Old Value":u(l),"New Value":u(t)}:e[a+' "✅"']={"Old Value":u(l),"New Value":u(t)},e}return n&&r?e[r[a]+' "⏺"']={"Old Value":u(t),"New Value":u(t)}:e[a+' "⏺"']={"Old Value":u(t),"New Value":u(t)},e}),{}):{};console.table(t)}}),[].concat(e&&o?e:[],[c]))}; | ||
"use strict";var e,r=(e=require("react"))&&"object"==typeof e&&"default"in e?e.default:e,t=0,n=function(e){return"[object Object]"===Object.prototype.toString.call(e)};function u(e){return n(e)||Array.isArray(e)?JSON.stringify(e,null,2):e}exports.useWhatChanged=function(e,n,c){var a=r.useRef(e),l=r.useRef(1),o=r.useRef(""),f=Array.isArray(a.current);r.useEffect((function(){a.current&&f&&a.current.length>0&&(t++,l.current=t,o.current=function(){for(var e="#",r=0;r<6;r++)e+="0123456789ABCDEF"[Math.floor(16*Math.random())];return e}())}),[a,f]),r.useEffect((function(){if(a.current&&f&&0!==a.current.length){console.log("%c What Changed in Effect ID "+l.current+" "+(c||""),"background: "+o.current+"; color: white; font-size: 10px","🧐👇");var r=n?n.split(","):null,t=e?e.reduce((function(e,t,c){if(a.current&&t!==a.current[c]){var l=a.current[c];return a.current[c]=t,n&&r?e[r[c]+' "✅"']={"Old Value":u(l),"New Value":u(t)}:e[c+' "✅"']={"Old Value":u(l),"New Value":u(t)},e}return n&&r?e[r[c]+' "⏺"']={"Old Value":u(t),"New Value":u(t)}:e[c+' "⏺"']={"Old Value":u(t),"New Value":u(t)},e}),{}):{};console.table(t)}}),[].concat(e&&f?e:[],[a]))}; | ||
//# sourceMappingURL=use-what-changed.cjs.production.min.js.map |
@@ -36,3 +36,3 @@ import React from 'react'; | ||
function useWhatChanged(dependency, dependencyNames) { | ||
function useWhatChanged(dependency, dependencyNames, suffix) { | ||
// This ref is responsible for book keeping of the old value | ||
@@ -47,3 +47,3 @@ var dependencyRef = React.useRef(dependency); // For count bookkeeping , for easy debugging | ||
// const MyWindow: IWindow = window; | ||
if (dependencyRef.current && isDependencyArr && dependencyRef.current.length > 1) { | ||
if (dependencyRef.current && isDependencyArr && dependencyRef.current.length > 0) { | ||
what_debug_changed++; | ||
@@ -55,4 +55,8 @@ whatChangedHookCountRef.current = what_debug_changed; | ||
React.useEffect(function () { | ||
if (!(dependencyRef.current && isDependencyArr && dependencyRef.current.length > 0)) { | ||
if (!(dependencyRef.current && isDependencyArr)) { | ||
return; | ||
} | ||
if (dependencyRef.current.length === 0) { | ||
return; | ||
} // invariant( | ||
@@ -67,3 +71,3 @@ // isDevelopment, | ||
{ | ||
console.log("%c What Changed in Effect ID " + whatChangedHookCountRef.current + " ", "background: " + backgroundColorRef.current + "; color: white; font-size: 10px", '🧐👇'); | ||
console.log("%c What Changed in Effect ID " + whatChangedHookCountRef.current + " " + (suffix || ''), "background: " + backgroundColorRef.current + "; color: white; font-size: 10px", '🧐👇'); | ||
} // More info, if needed by user | ||
@@ -70,0 +74,0 @@ |
declare type TypeDependency = any[]; | ||
declare type TypeDependencyNames = string; | ||
declare function useWhatChanged(dependency?: TypeDependency, dependencyNames?: TypeDependencyNames): void; | ||
declare function useWhatChanged(dependency?: TypeDependency, dependencyNames?: TypeDependencyNames, suffix?: string): void; | ||
export { useWhatChanged }; |
{ | ||
"name": "@simbathesailor/use-what-changed", | ||
"version": "0.1.14", | ||
"version": "0.1.15", | ||
"license": "MIT", | ||
@@ -5,0 +5,0 @@ "author": "simbathesailor", |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
37633
219