react-forceupdate - npm Package Compare versions

Comparing version 0.2.1 to 0.3.0

dist/index.d.ts

@@ -1,14 +0,13 @@
-declare type UseForceUpdatePropsItem = string | undefined;
-export declare type UseForceUpdateProps = UseForceUpdatePropsItem | Array<UseForceUpdatePropsItem>;
-declare type Input = string | undefined | '*';
-export declare type RunForceUpdateType = Input | Array<Input>;
+export declare type UseForceUpdateProps = string;
+declare type Input = string;
+export declare type RunForceUpdateEventType = Input;
 export declare type RunForceUpdatePayload = any;
 export declare type UseForceUpdateState = {
-    count: number;
-    type?: string;
+    eventCount: number;
+    subscribedEventType: string;
+    eventType?: string;
     payload?: any;
-    key?: any;
 };
-export declare function runForceUpdate(types?: RunForceUpdateType, payload?: RunForceUpdatePayload): void;
-export declare function useForceUpdate(type?: Input): UseForceUpdateState;
+export declare function runForceUpdate(eventType?: RunForceUpdateEventType, payload?: RunForceUpdatePayload): void;
+export declare function useForceUpdate(subscribedEventType?: Input): UseForceUpdateState;
 export {};

dist/react-forceupdate.cjs.development.js

@@ -8,66 +8,44 @@ 'use strict';
 var React = _interopDefault(require('react'));
-var mitt = _interopDefault(require('mitt'));
+var mittt = _interopDefault(require('mittt'));
 
-var emitter = /*#__PURE__*/mitt();
+var emitterHandlerMap = /*#__PURE__*/Object.create(null);
+var emitter = /*#__PURE__*/mittt(emitterHandlerMap);
+var prefix = 'event_';
 
-var getOnKeys = function getOnKeys(type) {
-  var result = [];
-
-  function add(typeItem) {
-    if (typeof typeItem === 'undefined') result.push('update_default');else if (typeItem === '*') result.push('*');else result.push('update_' + typeItem);
-  }
-
-  if (Array.isArray(type)) {
-    type.forEach(function (typeItem) {
-      add(typeItem);
-    });
-  } else {
-    add(type);
-  }
-
-  return result;
+var getKey = function getKey(eventType) {
+  if (!eventType) return prefix + 'default';
+  return prefix + eventType;
 };
 
-var getEmitKey = function getEmitKey(type) {
-  if (typeof type === 'undefined') return 'update_default';
-  return 'update_' + type;
-};
+function runForceUpdate(eventType, payload) {
+  emitter.emit(getKey(eventType), payload);
+}
+function useForceUpdate(subscribedEventType) {
+  var key = getKey(subscribedEventType);
 
-var initialState = {
-  count: 0
-};
-function runForceUpdate(types, payload) {
-  if (typeof types === 'undefined' || typeof types === 'string') {
-    emitter.emit(getEmitKey(types), payload);
-  } else if (Array.isArray(types)) {
-    types.forEach(function (type) {
-      emitter.emit(getEmitKey(type), payload);
-    });
-  }
-}
-function useForceUpdate(type) {
-  var _React$useState = React.useState(initialState),
+  var _React$useState = React.useState({
+    eventCount: 0,
+    subscribedEventType: subscribedEventType
+  }),
       state = _React$useState[0],
       setState = _React$useState[1];
+  /*
+  let fn = React.useMemo(
+    () => (eventType: Input, payload: any) =>
+      updateState(setState, subscribedEventType, eventType, payload),
+    []
+  )
+  */
+  // React.useMemo not needed.
 
-  var keys = React.useMemo(function () {
-    return getOnKeys(type); // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-  var updateFunctions = React.useMemo(function () {
-    var functions = {};
-    keys.forEach(function (key) {
-      functions[key] = function (mittType, mittEvt) {
-        updateState(setState, key, mittType, mittEvt);
-      };
-    });
-    return functions;
-  }, [keys]);
+
+  var fn = function fn(eventType, payload) {
+    return updateState(setState, subscribedEventType, eventType, payload);
+  };
+
   React.useEffect(function () {
-    keys.forEach(function (key) {
-      emitter.on(key, updateFunctions[key]);
-    });
+    emitter.on(key, fn); // console.debug('on', emitterHandlerMap)
+
     return function () {
-      keys.forEach(function (key) {
-        emitter.off(key, updateFunctions[key]);
-      });
+      emitter.off(key, fn); // console.debug('off', emitterHandlerMap)
     };
@@ -78,25 +56,12 @@ });
 
-function updateState(setState, key, mittType, mittEvt) {
-  // Order of args in mitt depending on whether type is '*' or not.
-  // Either it is (mittType, mittEvt) or (mittEvt).
-  // https://github.com/developit/mitt/blob/master/src/index.js
-  var type = mittEvt ? mittType : undefined;
-  var payload = mittEvt ? mittEvt : mittType;
-
-  if (key === '*' && !type) {
-    // Special thing with mitt and '*' usage. Workaround that.
-    type = payload;
-    payload = undefined;
-  } // This triggers re-render
-
-
+function updateState(setState, subscribedEventType, eventType, payload) {
+  // This triggers re-render
   setState(function (prevState) {
-    var count = (prevState.count || 0) + 1;
+    var eventCount = (prevState.eventCount || 0) + 1;
     var result = {
-      type: type,
+      eventType: eventType,
       payload: payload,
-      count: count,
-      key: key
+      subscribedEventType: subscribedEventType,
+      eventCount: eventCount
     };
-    if (type === undefined) delete result.type;
     if (payload === undefined) delete result.payload;
@@ -103,0 +68,0 @@ return result;

dist/react-forceupdate.cjs.development.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"react-forceupdate.cjs.development.js","sources":["../src/index.tsx"],"sourcesContent":["import React from 'react'\r\nimport mitt from 'mitt'\r\n\r\n// Please do not use types off of a default export module or else Storybook Docs will suffer.\r\n// see: https://github.com/storybookjs/storybook/issues/9556\r\n\r\ntype UseForceUpdatePropsItem = string | undefined\r\nexport type UseForceUpdateProps =\r\n  | UseForceUpdatePropsItem\r\n  | Array<UseForceUpdatePropsItem>\r\n\r\ntype Input = string | undefined | '*'\r\n\r\nexport type RunForceUpdateType = Input | Array<Input>\r\nexport type RunForceUpdatePayload = any\r\n\r\nexport type UseForceUpdateState = {\r\n  count: number\r\n  type?: string\r\n  payload?: any\r\n  key?: any\r\n}\r\n\r\nlet emitter: mitt.Emitter = mitt()\r\n\r\nlet getOnKeys = (type: UseForceUpdateProps): Array<string> => {\r\n  let result = []\r\n\r\n  function add(typeItem: Input) {\r\n    if (typeof typeItem === 'undefined') result.push('update_default')\r\n    else if (typeItem === '*') result.push('*')\r\n    else result.push('update_' + typeItem)\r\n  }\r\n\r\n  if (Array.isArray(type)) {\r\n    type.forEach(typeItem => {\r\n      add(typeItem)\r\n    })\r\n  } else {\r\n    add(type)\r\n  }\r\n\r\n  return result\r\n}\r\n\r\nlet getEmitKey = (type: Input): string => {\r\n  if (typeof type === 'undefined') return 'update_default'\r\n\r\n  return 'update_' + type\r\n}\r\n\r\nlet initialState: UseForceUpdateState = { count: 0 }\r\n\r\nexport function runForceUpdate(\r\n  types?: RunForceUpdateType,\r\n  payload?: RunForceUpdatePayload\r\n) {\r\n  if (typeof types === 'undefined' || typeof types === 'string') {\r\n    emitter.emit(getEmitKey(types), payload)\r\n  } else if (Array.isArray(types)) {\r\n    types.forEach(type => {\r\n      emitter.emit(getEmitKey(type), payload)\r\n    })\r\n  } else {\r\n    // error\r\n  }\r\n}\r\n\r\nexport function useForceUpdate(type?: Input): UseForceUpdateState {\r\n  const [state, setState] = React.useState(initialState)\r\n\r\n  let keys = React.useMemo(() => {\r\n    return getOnKeys(type)\r\n    // eslint-disable-next-line react-hooks/exhaustive-deps\r\n  }, [])\r\n\r\n  let updateFunctions = React.useMemo(() => {\r\n    let functions = {}\r\n\r\n    keys.forEach(key => {\r\n      functions[key] = (mittType: any, mittEvt?: any) => {\r\n        updateState(setState, key, mittType, mittEvt)\r\n      }\r\n    })\r\n\r\n    return functions\r\n  }, [keys])\r\n\r\n  React.useEffect(() => {\r\n    keys.forEach(key => {\r\n      emitter.on(key, updateFunctions[key])\r\n    })\r\n\r\n    return () => {\r\n      keys.forEach(key => {\r\n        emitter.off(key, updateFunctions[key])\r\n      })\r\n    }\r\n  })\r\n\r\n  return state\r\n}\r\n\r\nfunction updateState(\r\n  setState: React.Dispatch<React.SetStateAction<UseForceUpdateState>>,\r\n  key: Input,\r\n  mittType: any,\r\n  mittEvt?: any\r\n) {\r\n  // Order of args in mitt depending on whether type is '*' or not.\r\n  // Either it is (mittType, mittEvt) or (mittEvt).\r\n  // https://github.com/developit/mitt/blob/master/src/index.js\r\n\r\n  let type = mittEvt ? mittType : undefined\r\n  let payload = mittEvt ? mittEvt : mittType\r\n\r\n  if (key === '*' && !type) {\r\n    // Special thing with mitt and '*' usage. Workaround that.\r\n    type = payload\r\n    payload = undefined\r\n  }\r\n\r\n  // This triggers re-render\r\n  setState(prevState => {\r\n    let count = (prevState.count || 0) + 1\r\n    let result: UseForceUpdateState = { type, payload, count, key }\r\n    if (type === undefined) delete result.type\r\n    if (payload === undefined) delete result.payload\r\n\r\n    return result\r\n  })\r\n}\r\n"],"names":["emitter","mitt","getOnKeys","type","result","add","typeItem","push","Array","isArray","forEach","getEmitKey","initialState","count","runForceUpdate","types","payload","emit","useForceUpdate","React","useState","state","setState","keys","useMemo","updateFunctions","functions","key","mittType","mittEvt","updateState","useEffect","on","off","undefined","prevState"],"mappings":";;;;;;;;;AAuBA,IAAIA,OAAO,gBAAiBC,IAAI,EAAhC;;AAEA,IAAIC,SAAS,GAAG,SAAZA,SAAY,CAACC,IAAD;AACd,MAAIC,MAAM,GAAG,EAAb;;AAEA,WAASC,GAAT,CAAaC,QAAb;AACE,QAAI,OAAOA,QAAP,KAAoB,WAAxB,EAAqCF,MAAM,CAACG,IAAP,CAAY,gBAAZ,EAArC,KACK,IAAID,QAAQ,KAAK,GAAjB,EAAsBF,MAAM,CAACG,IAAP,CAAY,GAAZ,EAAtB,KACAH,MAAM,CAACG,IAAP,CAAY,YAAYD,QAAxB;AACN;;AAED,MAAIE,KAAK,CAACC,OAAN,CAAcN,IAAd,CAAJ,EAAyB;AACvBA,IAAAA,IAAI,CAACO,OAAL,CAAa,UAAAJ,QAAQ;AACnBD,MAAAA,GAAG,CAACC,QAAD,CAAH;AACD,KAFD;AAGD,GAJD,MAIO;AACLD,IAAAA,GAAG,CAACF,IAAD,CAAH;AACD;;AAED,SAAOC,MAAP;AACD,CAlBD;;AAoBA,IAAIO,UAAU,GAAG,SAAbA,UAAa,CAACR,IAAD;AACf,MAAI,OAAOA,IAAP,KAAgB,WAApB,EAAiC,OAAO,gBAAP;AAEjC,SAAO,YAAYA,IAAnB;AACD,CAJD;;AAMA,IAAIS,YAAY,GAAwB;AAAEC,EAAAA,KAAK,EAAE;AAAT,CAAxC;SAEgBC,eACdC,OACAC;AAEA,MAAI,OAAOD,KAAP,KAAiB,WAAjB,IAAgC,OAAOA,KAAP,KAAiB,QAArD,EAA+D;AAC7Df,IAAAA,OAAO,CAACiB,IAAR,CAAaN,UAAU,CAACI,KAAD,CAAvB,EAAgCC,OAAhC;AACD,GAFD,MAEO,IAAIR,KAAK,CAACC,OAAN,CAAcM,KAAd,CAAJ,EAA0B;AAC/BA,IAAAA,KAAK,CAACL,OAAN,CAAc,UAAAP,IAAI;AAChBH,MAAAA,OAAO,CAACiB,IAAR,CAAaN,UAAU,CAACR,IAAD,CAAvB,EAA+Ba,OAA/B;AACD,KAFD;AAGD;AAGF;SAEeE,eAAef;wBACHgB,KAAK,CAACC,QAAN,CAAeR,YAAf;MAAnBS;MAAOC;;AAEd,MAAIC,IAAI,GAAGJ,KAAK,CAACK,OAAN,CAAc;AACvB,WAAOtB,SAAS,CAACC,IAAD,CAAhB;AAED,GAHU,EAGR,EAHQ,CAAX;AAKA,MAAIsB,eAAe,GAAGN,KAAK,CAACK,OAAN,CAAc;AAClC,QAAIE,SAAS,GAAG,EAAhB;AAEAH,IAAAA,IAAI,CAACb,OAAL,CAAa,UAAAiB,GAAG;AACdD,MAAAA,SAAS,CAACC,GAAD,CAAT,GAAiB,UAACC,QAAD,EAAgBC,OAAhB;AACfC,QAAAA,WAAW,CAACR,QAAD,EAAWK,GAAX,EAAgBC,QAAhB,EAA0BC,OAA1B,CAAX;AACD,OAFD;AAGD,KAJD;AAMA,WAAOH,SAAP;AACD,GAVqB,EAUnB,CAACH,IAAD,CAVmB,CAAtB;AAYAJ,EAAAA,KAAK,CAACY,SAAN,CAAgB;AACdR,IAAAA,IAAI,CAACb,OAAL,CAAa,UAAAiB,GAAG;AACd3B,MAAAA,OAAO,CAACgC,EAAR,CAAWL,GAAX,EAAgBF,eAAe,CAACE,GAAD,CAA/B;AACD,KAFD;AAIA,WAAO;AACLJ,MAAAA,IAAI,CAACb,OAAL,CAAa,UAAAiB,GAAG;AACd3B,QAAAA,OAAO,CAACiC,GAAR,CAAYN,GAAZ,EAAiBF,eAAe,CAACE,GAAD,CAAhC;AACD,OAFD;AAGD,KAJD;AAKD,GAVD;AAYA,SAAON,KAAP;AACD;;AAED,SAASS,WAAT,CACER,QADF,EAEEK,GAFF,EAGEC,QAHF,EAIEC,OAJF;AAME;AACA;AACA;AAEA,MAAI1B,IAAI,GAAG0B,OAAO,GAAGD,QAAH,GAAcM,SAAhC;AACA,MAAIlB,OAAO,GAAGa,OAAO,GAAGA,OAAH,GAAaD,QAAlC;;AAEA,MAAID,GAAG,KAAK,GAAR,IAAe,CAACxB,IAApB,EAA0B;AACxB;AACAA,IAAAA,IAAI,GAAGa,OAAP;AACAA,IAAAA,OAAO,GAAGkB,SAAV;AACD;;;AAGDZ,EAAAA,QAAQ,CAAC,UAAAa,SAAS;AAChB,QAAItB,KAAK,GAAG,CAACsB,SAAS,CAACtB,KAAV,IAAmB,CAApB,IAAyB,CAArC;AACA,QAAIT,MAAM,GAAwB;AAAED,MAAAA,IAAI,EAAJA,IAAF;AAAQa,MAAAA,OAAO,EAAPA,OAAR;AAAiBH,MAAAA,KAAK,EAALA,KAAjB;AAAwBc,MAAAA,GAAG,EAAHA;AAAxB,KAAlC;AACA,QAAIxB,IAAI,KAAK+B,SAAb,EAAwB,OAAO9B,MAAM,CAACD,IAAd;AACxB,QAAIa,OAAO,KAAKkB,SAAhB,EAA2B,OAAO9B,MAAM,CAACY,OAAd;AAE3B,WAAOZ,MAAP;AACD,GAPO,CAAR;AAQD;;;;;"}
+{"version":3,"file":"react-forceupdate.cjs.development.js","sources":["../src/index.tsx"],"sourcesContent":["import React from 'react'\nimport mittt, { Emitter, EventHandlerMap } from 'mittt'\n\n// Please do not use types off of a default export module or else Storybook Docs will suffer.\n// see: https://github.com/storybookjs/storybook/issues/9556\n\nexport type UseForceUpdateProps = string\ntype Input = string\n\nexport type RunForceUpdateEventType = Input\nexport type RunForceUpdatePayload = any\n\nexport type UseForceUpdateState = {\n  eventCount: number\n  subscribedEventType: string\n  eventType?: string\n  payload?: any\n}\n\nlet emitterHandlerMap: EventHandlerMap = Object.create(null)\nlet emitter: Emitter = mittt(emitterHandlerMap)\nlet prefix = 'event_'\n\nlet getKey = (eventType: Input): string => {\n  if (!eventType) return prefix + 'default'\n\n  return prefix + eventType\n}\n\nexport function runForceUpdate(\n  eventType?: RunForceUpdateEventType,\n  payload?: RunForceUpdatePayload\n) {\n  emitter.emit(getKey(eventType), payload)\n}\n\nexport function useForceUpdate(\n  subscribedEventType?: Input\n): UseForceUpdateState {\n  let key = getKey(subscribedEventType)\n  let [state, setState] = React.useState({ eventCount: 0, subscribedEventType })\n\n  /*\n  let fn = React.useMemo(\n    () => (eventType: Input, payload: any) =>\n      updateState(setState, subscribedEventType, eventType, payload),\n    []\n  )\n  */\n  // React.useMemo not needed.\n  let fn = (eventType: Input, payload: any) =>\n    updateState(setState, subscribedEventType, eventType, payload)\n\n  React.useEffect(() => {\n    emitter.on(key, fn)\n    // console.debug('on', emitterHandlerMap)\n    return () => {\n      emitter.off(key, fn)\n      // console.debug('off', emitterHandlerMap)\n    }\n  })\n\n  return state\n}\n\nfunction updateState(\n  setState: React.Dispatch<React.SetStateAction<UseForceUpdateState>>,\n  subscribedEventType: Input,\n  eventType: string,\n  payload?: any\n) {\n  // This triggers re-render\n  setState(prevState => {\n    let eventCount = (prevState.eventCount || 0) + 1\n    let result: UseForceUpdateState = {\n      eventType,\n      payload,\n      subscribedEventType,\n      eventCount,\n    }\n    if (payload === undefined) delete result.payload\n\n    return result\n  })\n}\n"],"names":["emitterHandlerMap","Object","create","emitter","mittt","prefix","getKey","eventType","runForceUpdate","payload","emit","useForceUpdate","subscribedEventType","key","React","useState","eventCount","state","setState","fn","updateState","useEffect","on","off","prevState","result","undefined"],"mappings":";;;;;;;;;AAmBA,IAAIA,iBAAiB,gBAAoBC,MAAM,CAACC,MAAP,CAAc,IAAd,CAAzC;AACA,IAAIC,OAAO,gBAAYC,KAAK,CAACJ,iBAAD,CAA5B;AACA,IAAIK,MAAM,GAAG,QAAb;;AAEA,IAAIC,MAAM,GAAG,SAATA,MAAS,CAACC,SAAD;AACX,MAAI,CAACA,SAAL,EAAgB,OAAOF,MAAM,GAAG,SAAhB;AAEhB,SAAOA,MAAM,GAAGE,SAAhB;AACD,CAJD;;SAMgBC,eACdD,WACAE;AAEAN,EAAAA,OAAO,CAACO,IAAR,CAAaJ,MAAM,CAACC,SAAD,CAAnB,EAAgCE,OAAhC;AACD;SAEeE,eACdC;AAEA,MAAIC,GAAG,GAAGP,MAAM,CAACM,mBAAD,CAAhB;;wBACwBE,KAAK,CAACC,QAAN,CAAe;AAAEC,IAAAA,UAAU,EAAE,CAAd;AAAiBJ,IAAAA,mBAAmB,EAAnBA;AAAjB,GAAf;MAAnBK;MAAOC;AAEZ;;;;;;;AAOA;;;AACA,MAAIC,EAAE,GAAG,SAALA,EAAK,CAACZ,SAAD,EAAmBE,OAAnB;AAAA,WACPW,WAAW,CAACF,QAAD,EAAWN,mBAAX,EAAgCL,SAAhC,EAA2CE,OAA3C,CADJ;AAAA,GAAT;;AAGAK,EAAAA,KAAK,CAACO,SAAN,CAAgB;AACdlB,IAAAA,OAAO,CAACmB,EAAR,CAAWT,GAAX,EAAgBM,EAAhB;;AAEA,WAAO;AACLhB,MAAAA,OAAO,CAACoB,GAAR,CAAYV,GAAZ,EAAiBM,EAAjB;AAED,KAHD;AAID,GAPD;AASA,SAAOF,KAAP;AACD;;AAED,SAASG,WAAT,CACEF,QADF,EAEEN,mBAFF,EAGEL,SAHF,EAIEE,OAJF;AAME;AACAS,EAAAA,QAAQ,CAAC,UAAAM,SAAS;AAChB,QAAIR,UAAU,GAAG,CAACQ,SAAS,CAACR,UAAV,IAAwB,CAAzB,IAA8B,CAA/C;AACA,QAAIS,MAAM,GAAwB;AAChClB,MAAAA,SAAS,EAATA,SADgC;AAEhCE,MAAAA,OAAO,EAAPA,OAFgC;AAGhCG,MAAAA,mBAAmB,EAAnBA,mBAHgC;AAIhCI,MAAAA,UAAU,EAAVA;AAJgC,KAAlC;AAMA,QAAIP,OAAO,KAAKiB,SAAhB,EAA2B,OAAOD,MAAM,CAAChB,OAAd;AAE3B,WAAOgB,MAAP;AACD,GAXO,CAAR;AAYD;;;;;"}

dist/react-forceupdate.cjs.production.min.js

@@ -1,2 +0,2 @@
-"use strict";function t(t){return t&&"object"==typeof t&&"default"in t?t.default:t}Object.defineProperty(exports,"__esModule",{value:!0});var e=t(require("react")),n=t(require("mitt"))(),r=function(t){return void 0===t?"update_default":"update_"+t},o={count:0};exports.runForceUpdate=function(t,e){void 0===t||"string"==typeof t?n.emit(r(t),e):Array.isArray(t)&&t.forEach((function(t){n.emit(r(t),e)}))},exports.useForceUpdate=function(t){var r=e.useState(o),u=r[0],i=r[1],f=e.useMemo((function(){return function(t){var e=[];function n(t){e.push(void 0===t?"update_default":"*"===t?"*":"update_"+t)}return Array.isArray(t)?t.forEach((function(t){n(t)})):n(t),e}(t)}),[]),c=e.useMemo((function(){var t={};return f.forEach((function(e){t[e]=function(t,n){!function(t,e,n,r){var o=r?n:void 0,u=r||n;"*"!==e||o||(o=u,u=void 0),t((function(t){var n={type:o,payload:u,count:(t.count||0)+1,key:e};return void 0===o&&delete n.type,void 0===u&&delete n.payload,n}))}(i,e,t,n)}})),t}),[f]);return e.useEffect((function(){return f.forEach((function(t){n.on(t,c[t])})),function(){f.forEach((function(t){n.off(t,c[t])}))}})),u};
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("react")),n=e(require("mittt"))(Object.create(null)),u=function(e){return e?"event_"+e:"event_default"};exports.runForceUpdate=function(e,t){n.emit(u(e),t)},exports.useForceUpdate=function(e){var r=u(e),o=t.useState({eventCount:0,subscribedEventType:e}),c=o[0],i=o[1],f=function(t,n){return function(e,t,n,u){e((function(e){var r={eventType:n,payload:u,subscribedEventType:t,eventCount:(e.eventCount||0)+1};return void 0===u&&delete r.payload,r}))}(i,e,t,n)};return t.useEffect((function(){return n.on(r,f),function(){n.off(r,f)}})),c};
 //# sourceMappingURL=react-forceupdate.cjs.production.min.js.map

dist/react-forceupdate.cjs.production.min.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"react-forceupdate.cjs.production.min.js","sources":["../src/index.tsx"],"sourcesContent":["import React from 'react'\r\nimport mitt from 'mitt'\r\n\r\n// Please do not use types off of a default export module or else Storybook Docs will suffer.\r\n// see: https://github.com/storybookjs/storybook/issues/9556\r\n\r\ntype UseForceUpdatePropsItem = string | undefined\r\nexport type UseForceUpdateProps =\r\n  | UseForceUpdatePropsItem\r\n  | Array<UseForceUpdatePropsItem>\r\n\r\ntype Input = string | undefined | '*'\r\n\r\nexport type RunForceUpdateType = Input | Array<Input>\r\nexport type RunForceUpdatePayload = any\r\n\r\nexport type UseForceUpdateState = {\r\n  count: number\r\n  type?: string\r\n  payload?: any\r\n  key?: any\r\n}\r\n\r\nlet emitter: mitt.Emitter = mitt()\r\n\r\nlet getOnKeys = (type: UseForceUpdateProps): Array<string> => {\r\n  let result = []\r\n\r\n  function add(typeItem: Input) {\r\n    if (typeof typeItem === 'undefined') result.push('update_default')\r\n    else if (typeItem === '*') result.push('*')\r\n    else result.push('update_' + typeItem)\r\n  }\r\n\r\n  if (Array.isArray(type)) {\r\n    type.forEach(typeItem => {\r\n      add(typeItem)\r\n    })\r\n  } else {\r\n    add(type)\r\n  }\r\n\r\n  return result\r\n}\r\n\r\nlet getEmitKey = (type: Input): string => {\r\n  if (typeof type === 'undefined') return 'update_default'\r\n\r\n  return 'update_' + type\r\n}\r\n\r\nlet initialState: UseForceUpdateState = { count: 0 }\r\n\r\nexport function runForceUpdate(\r\n  types?: RunForceUpdateType,\r\n  payload?: RunForceUpdatePayload\r\n) {\r\n  if (typeof types === 'undefined' || typeof types === 'string') {\r\n    emitter.emit(getEmitKey(types), payload)\r\n  } else if (Array.isArray(types)) {\r\n    types.forEach(type => {\r\n      emitter.emit(getEmitKey(type), payload)\r\n    })\r\n  } else {\r\n    // error\r\n  }\r\n}\r\n\r\nexport function useForceUpdate(type?: Input): UseForceUpdateState {\r\n  const [state, setState] = React.useState(initialState)\r\n\r\n  let keys = React.useMemo(() => {\r\n    return getOnKeys(type)\r\n    // eslint-disable-next-line react-hooks/exhaustive-deps\r\n  }, [])\r\n\r\n  let updateFunctions = React.useMemo(() => {\r\n    let functions = {}\r\n\r\n    keys.forEach(key => {\r\n      functions[key] = (mittType: any, mittEvt?: any) => {\r\n        updateState(setState, key, mittType, mittEvt)\r\n      }\r\n    })\r\n\r\n    return functions\r\n  }, [keys])\r\n\r\n  React.useEffect(() => {\r\n    keys.forEach(key => {\r\n      emitter.on(key, updateFunctions[key])\r\n    })\r\n\r\n    return () => {\r\n      keys.forEach(key => {\r\n        emitter.off(key, updateFunctions[key])\r\n      })\r\n    }\r\n  })\r\n\r\n  return state\r\n}\r\n\r\nfunction updateState(\r\n  setState: React.Dispatch<React.SetStateAction<UseForceUpdateState>>,\r\n  key: Input,\r\n  mittType: any,\r\n  mittEvt?: any\r\n) {\r\n  // Order of args in mitt depending on whether type is '*' or not.\r\n  // Either it is (mittType, mittEvt) or (mittEvt).\r\n  // https://github.com/developit/mitt/blob/master/src/index.js\r\n\r\n  let type = mittEvt ? mittType : undefined\r\n  let payload = mittEvt ? mittEvt : mittType\r\n\r\n  if (key === '*' && !type) {\r\n    // Special thing with mitt and '*' usage. Workaround that.\r\n    type = payload\r\n    payload = undefined\r\n  }\r\n\r\n  // This triggers re-render\r\n  setState(prevState => {\r\n    let count = (prevState.count || 0) + 1\r\n    let result: UseForceUpdateState = { type, payload, count, key }\r\n    if (type === undefined) delete result.type\r\n    if (payload === undefined) delete result.payload\r\n\r\n    return result\r\n  })\r\n}\r\n"],"names":["emitter","mitt","getEmitKey","type","initialState","count","types","payload","emit","Array","isArray","forEach","React","useState","state","setState","keys","useMemo","result","add","typeItem","push","getOnKeys","updateFunctions","functions","key","mittType","mittEvt","undefined","prevState","updateState","useEffect","on","off"],"mappings":"oKAuBIA,oBAAwBC,GAsBxBC,EAAa,SAACC,eACI,IAATA,EAA6B,iBAEjC,UAAYA,GAGjBC,EAAoC,CAAEC,MAAO,mCAG/CC,EACAC,QAEqB,IAAVD,GAA0C,iBAAVA,EACzCN,EAAQQ,KAAKN,EAAWI,GAAQC,GACvBE,MAAMC,QAAQJ,IACvBA,EAAMK,SAAQ,SAAAR,GACZH,EAAQQ,KAAKN,EAAWC,GAAOI,uCAONJ,SACHS,EAAMC,SAAST,GAAlCU,OAAOC,OAEVC,EAAOJ,EAAMK,SAAQ,kBA9CX,SAACd,OACXe,EAAS,YAEJC,EAAIC,GAC0BF,EAAOG,UAApB,IAAbD,EAAsC,iBAC3B,MAAbA,EAA8B,IACtB,UAAYA,UAG3BX,MAAMC,QAAQP,GAChBA,EAAKQ,SAAQ,SAAAS,GACXD,EAAIC,MAGND,EAAIhB,GAGCe,EA8BEI,CAAUnB,KAEhB,IAECoB,EAAkBX,EAAMK,SAAQ,eAC9BO,EAAY,UAEhBR,EAAKL,SAAQ,SAAAc,GACXD,EAAUC,GAAO,SAACC,EAAeC,IAuBvC,SACEZ,EACAU,EACAC,EACAC,OAMIxB,EAAOwB,EAAUD,OAAWE,EAC5BrB,EAAUoB,GAAoBD,EAEtB,MAARD,GAAgBtB,IAElBA,EAAOI,EACPA,OAAUqB,GAIZb,GAAS,SAAAc,OAEHX,EAA8B,CAAEf,KAAAA,EAAMI,QAAAA,EAASF,OADtCwB,EAAUxB,OAAS,GAAK,EACqBoB,IAAAA,eAC7CG,IAATzB,UAA2Be,EAAOf,UACtByB,IAAZrB,UAA8BW,EAAOX,QAElCW,KAhDHY,CAAYf,EAAUU,EAAKC,EAAUC,OAIlCH,IACN,CAACR,WAEJJ,EAAMmB,WAAU,kBACdf,EAAKL,SAAQ,SAAAc,GACXzB,EAAQgC,GAAGP,EAAKF,EAAgBE,OAG3B,WACLT,EAAKL,SAAQ,SAAAc,GACXzB,EAAQiC,IAAIR,EAAKF,EAAgBE,WAKhCX"}
+{"version":3,"file":"react-forceupdate.cjs.production.min.js","sources":["../src/index.tsx"],"sourcesContent":["import React from 'react'\nimport mittt, { Emitter, EventHandlerMap } from 'mittt'\n\n// Please do not use types off of a default export module or else Storybook Docs will suffer.\n// see: https://github.com/storybookjs/storybook/issues/9556\n\nexport type UseForceUpdateProps = string\ntype Input = string\n\nexport type RunForceUpdateEventType = Input\nexport type RunForceUpdatePayload = any\n\nexport type UseForceUpdateState = {\n  eventCount: number\n  subscribedEventType: string\n  eventType?: string\n  payload?: any\n}\n\nlet emitterHandlerMap: EventHandlerMap = Object.create(null)\nlet emitter: Emitter = mittt(emitterHandlerMap)\nlet prefix = 'event_'\n\nlet getKey = (eventType: Input): string => {\n  if (!eventType) return prefix + 'default'\n\n  return prefix + eventType\n}\n\nexport function runForceUpdate(\n  eventType?: RunForceUpdateEventType,\n  payload?: RunForceUpdatePayload\n) {\n  emitter.emit(getKey(eventType), payload)\n}\n\nexport function useForceUpdate(\n  subscribedEventType?: Input\n): UseForceUpdateState {\n  let key = getKey(subscribedEventType)\n  let [state, setState] = React.useState({ eventCount: 0, subscribedEventType })\n\n  /*\n  let fn = React.useMemo(\n    () => (eventType: Input, payload: any) =>\n      updateState(setState, subscribedEventType, eventType, payload),\n    []\n  )\n  */\n  // React.useMemo not needed.\n  let fn = (eventType: Input, payload: any) =>\n    updateState(setState, subscribedEventType, eventType, payload)\n\n  React.useEffect(() => {\n    emitter.on(key, fn)\n    // console.debug('on', emitterHandlerMap)\n    return () => {\n      emitter.off(key, fn)\n      // console.debug('off', emitterHandlerMap)\n    }\n  })\n\n  return state\n}\n\nfunction updateState(\n  setState: React.Dispatch<React.SetStateAction<UseForceUpdateState>>,\n  subscribedEventType: Input,\n  eventType: string,\n  payload?: any\n) {\n  // This triggers re-render\n  setState(prevState => {\n    let eventCount = (prevState.eventCount || 0) + 1\n    let result: UseForceUpdateState = {\n      eventType,\n      payload,\n      subscribedEventType,\n      eventCount,\n    }\n    if (payload === undefined) delete result.payload\n\n    return result\n  })\n}\n"],"names":["emitter","mittt","Object","create","getKey","eventType","prefix","payload","emit","subscribedEventType","key","React","useState","eventCount","state","setState","fn","prevState","result","undefined","updateState","useEffect","on","off"],"mappings":"oKAoBIA,qBAAmBC,CADkBC,OAAOC,OAAO,OAInDC,EAAS,SAACC,UACPA,EAHM,SAKKA,EAFOC,iDAMvBD,EACAE,GAEAP,EAAQQ,KAAKJ,EAAOC,GAAYE,oCAIhCE,OAEIC,EAAMN,EAAOK,KACOE,EAAMC,SAAS,CAAEC,WAAY,EAAGJ,oBAAAA,IAAnDK,OAAOC,OAURC,EAAK,SAACX,EAAkBE,UAe9B,SACEQ,EACAN,EACAJ,EACAE,GAGAQ,GAAS,SAAAE,OAEHC,EAA8B,CAChCb,UAAAA,EACAE,QAAAA,EACAE,oBAAAA,EACAI,YALgBI,EAAUJ,YAAc,GAAK,eAO/BM,IAAZZ,UAA8BW,EAAOX,QAElCW,KA/BPE,CAAYL,EAAUN,EAAqBJ,EAAWE,WAExDI,EAAMU,WAAU,kBACdrB,EAAQsB,GAAGZ,EAAKM,GAET,WACLhB,EAAQuB,IAAIb,EAAKM,OAKdF"}

dist/react-forceupdate.esm.js

 import React from 'react';
-import mitt from 'mitt';
+import mittt from 'mittt';
 
-var emitter = /*#__PURE__*/mitt();
+var emitterHandlerMap = /*#__PURE__*/Object.create(null);
+var emitter = /*#__PURE__*/mittt(emitterHandlerMap);
+var prefix = 'event_';
 
-var getOnKeys = function getOnKeys(type) {
-  var result = [];
-
-  function add(typeItem) {
-    if (typeof typeItem === 'undefined') result.push('update_default');else if (typeItem === '*') result.push('*');else result.push('update_' + typeItem);
-  }
-
-  if (Array.isArray(type)) {
-    type.forEach(function (typeItem) {
-      add(typeItem);
-    });
-  } else {
-    add(type);
-  }
-
-  return result;
+var getKey = function getKey(eventType) {
+  if (!eventType) return prefix + 'default';
+  return prefix + eventType;
 };
 
-var getEmitKey = function getEmitKey(type) {
-  if (typeof type === 'undefined') return 'update_default';
-  return 'update_' + type;
-};
+function runForceUpdate(eventType, payload) {
+  emitter.emit(getKey(eventType), payload);
+}
+function useForceUpdate(subscribedEventType) {
+  var key = getKey(subscribedEventType);
 
-var initialState = {
-  count: 0
-};
-function runForceUpdate(types, payload) {
-  if (typeof types === 'undefined' || typeof types === 'string') {
-    emitter.emit(getEmitKey(types), payload);
-  } else if (Array.isArray(types)) {
-    types.forEach(function (type) {
-      emitter.emit(getEmitKey(type), payload);
-    });
-  }
-}
-function useForceUpdate(type) {
-  var _React$useState = React.useState(initialState),
+  var _React$useState = React.useState({
+    eventCount: 0,
+    subscribedEventType: subscribedEventType
+  }),
       state = _React$useState[0],
       setState = _React$useState[1];
+  /*
+  let fn = React.useMemo(
+    () => (eventType: Input, payload: any) =>
+      updateState(setState, subscribedEventType, eventType, payload),
+    []
+  )
+  */
+  // React.useMemo not needed.
 
-  var keys = React.useMemo(function () {
-    return getOnKeys(type); // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-  var updateFunctions = React.useMemo(function () {
-    var functions = {};
-    keys.forEach(function (key) {
-      functions[key] = function (mittType, mittEvt) {
-        updateState(setState, key, mittType, mittEvt);
-      };
-    });
-    return functions;
-  }, [keys]);
+
+  var fn = function fn(eventType, payload) {
+    return updateState(setState, subscribedEventType, eventType, payload);
+  };
+
   React.useEffect(function () {
-    keys.forEach(function (key) {
-      emitter.on(key, updateFunctions[key]);
-    });
+    emitter.on(key, fn); // console.debug('on', emitterHandlerMap)
+
     return function () {
-      keys.forEach(function (key) {
-        emitter.off(key, updateFunctions[key]);
-      });
+      emitter.off(key, fn); // console.debug('off', emitterHandlerMap)
     };
@@ -71,25 +49,12 @@ });
 
-function updateState(setState, key, mittType, mittEvt) {
-  // Order of args in mitt depending on whether type is '*' or not.
-  // Either it is (mittType, mittEvt) or (mittEvt).
-  // https://github.com/developit/mitt/blob/master/src/index.js
-  var type = mittEvt ? mittType : undefined;
-  var payload = mittEvt ? mittEvt : mittType;
-
-  if (key === '*' && !type) {
-    // Special thing with mitt and '*' usage. Workaround that.
-    type = payload;
-    payload = undefined;
-  } // This triggers re-render
-
-
+function updateState(setState, subscribedEventType, eventType, payload) {
+  // This triggers re-render
   setState(function (prevState) {
-    var count = (prevState.count || 0) + 1;
+    var eventCount = (prevState.eventCount || 0) + 1;
     var result = {
-      type: type,
+      eventType: eventType,
       payload: payload,
-      count: count,
-      key: key
+      subscribedEventType: subscribedEventType,
+      eventCount: eventCount
     };
-    if (type === undefined) delete result.type;
     if (payload === undefined) delete result.payload;
@@ -96,0 +61,0 @@ return result;

dist/react-forceupdate.esm.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"react-forceupdate.esm.js","sources":["../src/index.tsx"],"sourcesContent":["import React from 'react'\r\nimport mitt from 'mitt'\r\n\r\n// Please do not use types off of a default export module or else Storybook Docs will suffer.\r\n// see: https://github.com/storybookjs/storybook/issues/9556\r\n\r\ntype UseForceUpdatePropsItem = string | undefined\r\nexport type UseForceUpdateProps =\r\n  | UseForceUpdatePropsItem\r\n  | Array<UseForceUpdatePropsItem>\r\n\r\ntype Input = string | undefined | '*'\r\n\r\nexport type RunForceUpdateType = Input | Array<Input>\r\nexport type RunForceUpdatePayload = any\r\n\r\nexport type UseForceUpdateState = {\r\n  count: number\r\n  type?: string\r\n  payload?: any\r\n  key?: any\r\n}\r\n\r\nlet emitter: mitt.Emitter = mitt()\r\n\r\nlet getOnKeys = (type: UseForceUpdateProps): Array<string> => {\r\n  let result = []\r\n\r\n  function add(typeItem: Input) {\r\n    if (typeof typeItem === 'undefined') result.push('update_default')\r\n    else if (typeItem === '*') result.push('*')\r\n    else result.push('update_' + typeItem)\r\n  }\r\n\r\n  if (Array.isArray(type)) {\r\n    type.forEach(typeItem => {\r\n      add(typeItem)\r\n    })\r\n  } else {\r\n    add(type)\r\n  }\r\n\r\n  return result\r\n}\r\n\r\nlet getEmitKey = (type: Input): string => {\r\n  if (typeof type === 'undefined') return 'update_default'\r\n\r\n  return 'update_' + type\r\n}\r\n\r\nlet initialState: UseForceUpdateState = { count: 0 }\r\n\r\nexport function runForceUpdate(\r\n  types?: RunForceUpdateType,\r\n  payload?: RunForceUpdatePayload\r\n) {\r\n  if (typeof types === 'undefined' || typeof types === 'string') {\r\n    emitter.emit(getEmitKey(types), payload)\r\n  } else if (Array.isArray(types)) {\r\n    types.forEach(type => {\r\n      emitter.emit(getEmitKey(type), payload)\r\n    })\r\n  } else {\r\n    // error\r\n  }\r\n}\r\n\r\nexport function useForceUpdate(type?: Input): UseForceUpdateState {\r\n  const [state, setState] = React.useState(initialState)\r\n\r\n  let keys = React.useMemo(() => {\r\n    return getOnKeys(type)\r\n    // eslint-disable-next-line react-hooks/exhaustive-deps\r\n  }, [])\r\n\r\n  let updateFunctions = React.useMemo(() => {\r\n    let functions = {}\r\n\r\n    keys.forEach(key => {\r\n      functions[key] = (mittType: any, mittEvt?: any) => {\r\n        updateState(setState, key, mittType, mittEvt)\r\n      }\r\n    })\r\n\r\n    return functions\r\n  }, [keys])\r\n\r\n  React.useEffect(() => {\r\n    keys.forEach(key => {\r\n      emitter.on(key, updateFunctions[key])\r\n    })\r\n\r\n    return () => {\r\n      keys.forEach(key => {\r\n        emitter.off(key, updateFunctions[key])\r\n      })\r\n    }\r\n  })\r\n\r\n  return state\r\n}\r\n\r\nfunction updateState(\r\n  setState: React.Dispatch<React.SetStateAction<UseForceUpdateState>>,\r\n  key: Input,\r\n  mittType: any,\r\n  mittEvt?: any\r\n) {\r\n  // Order of args in mitt depending on whether type is '*' or not.\r\n  // Either it is (mittType, mittEvt) or (mittEvt).\r\n  // https://github.com/developit/mitt/blob/master/src/index.js\r\n\r\n  let type = mittEvt ? mittType : undefined\r\n  let payload = mittEvt ? mittEvt : mittType\r\n\r\n  if (key === '*' && !type) {\r\n    // Special thing with mitt and '*' usage. Workaround that.\r\n    type = payload\r\n    payload = undefined\r\n  }\r\n\r\n  // This triggers re-render\r\n  setState(prevState => {\r\n    let count = (prevState.count || 0) + 1\r\n    let result: UseForceUpdateState = { type, payload, count, key }\r\n    if (type === undefined) delete result.type\r\n    if (payload === undefined) delete result.payload\r\n\r\n    return result\r\n  })\r\n}\r\n"],"names":["emitter","mitt","getOnKeys","type","result","add","typeItem","push","Array","isArray","forEach","getEmitKey","initialState","count","runForceUpdate","types","payload","emit","useForceUpdate","React","useState","state","setState","keys","useMemo","updateFunctions","functions","key","mittType","mittEvt","updateState","useEffect","on","off","undefined","prevState"],"mappings":"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"}
+{"version":3,"file":"react-forceupdate.esm.js","sources":["../src/index.tsx"],"sourcesContent":["import React from 'react'\nimport mittt, { Emitter, EventHandlerMap } from 'mittt'\n\n// Please do not use types off of a default export module or else Storybook Docs will suffer.\n// see: https://github.com/storybookjs/storybook/issues/9556\n\nexport type UseForceUpdateProps = string\ntype Input = string\n\nexport type RunForceUpdateEventType = Input\nexport type RunForceUpdatePayload = any\n\nexport type UseForceUpdateState = {\n  eventCount: number\n  subscribedEventType: string\n  eventType?: string\n  payload?: any\n}\n\nlet emitterHandlerMap: EventHandlerMap = Object.create(null)\nlet emitter: Emitter = mittt(emitterHandlerMap)\nlet prefix = 'event_'\n\nlet getKey = (eventType: Input): string => {\n  if (!eventType) return prefix + 'default'\n\n  return prefix + eventType\n}\n\nexport function runForceUpdate(\n  eventType?: RunForceUpdateEventType,\n  payload?: RunForceUpdatePayload\n) {\n  emitter.emit(getKey(eventType), payload)\n}\n\nexport function useForceUpdate(\n  subscribedEventType?: Input\n): UseForceUpdateState {\n  let key = getKey(subscribedEventType)\n  let [state, setState] = React.useState({ eventCount: 0, subscribedEventType })\n\n  /*\n  let fn = React.useMemo(\n    () => (eventType: Input, payload: any) =>\n      updateState(setState, subscribedEventType, eventType, payload),\n    []\n  )\n  */\n  // React.useMemo not needed.\n  let fn = (eventType: Input, payload: any) =>\n    updateState(setState, subscribedEventType, eventType, payload)\n\n  React.useEffect(() => {\n    emitter.on(key, fn)\n    // console.debug('on', emitterHandlerMap)\n    return () => {\n      emitter.off(key, fn)\n      // console.debug('off', emitterHandlerMap)\n    }\n  })\n\n  return state\n}\n\nfunction updateState(\n  setState: React.Dispatch<React.SetStateAction<UseForceUpdateState>>,\n  subscribedEventType: Input,\n  eventType: string,\n  payload?: any\n) {\n  // This triggers re-render\n  setState(prevState => {\n    let eventCount = (prevState.eventCount || 0) + 1\n    let result: UseForceUpdateState = {\n      eventType,\n      payload,\n      subscribedEventType,\n      eventCount,\n    }\n    if (payload === undefined) delete result.payload\n\n    return result\n  })\n}\n"],"names":["emitterHandlerMap","Object","create","emitter","mittt","prefix","getKey","eventType","runForceUpdate","payload","emit","useForceUpdate","subscribedEventType","key","React","useState","eventCount","state","setState","fn","updateState","useEffect","on","off","prevState","result","undefined"],"mappings":";;;AAmBA,IAAIA,iBAAiB,gBAAoBC,MAAM,CAACC,MAAP,CAAc,IAAd,CAAzC;AACA,IAAIC,OAAO,gBAAYC,KAAK,CAACJ,iBAAD,CAA5B;AACA,IAAIK,MAAM,GAAG,QAAb;;AAEA,IAAIC,MAAM,GAAG,SAATA,MAAS,CAACC,SAAD;AACX,MAAI,CAACA,SAAL,EAAgB,OAAOF,MAAM,GAAG,SAAhB;AAEhB,SAAOA,MAAM,GAAGE,SAAhB;AACD,CAJD;;SAMgBC,eACdD,WACAE;AAEAN,EAAAA,OAAO,CAACO,IAAR,CAAaJ,MAAM,CAACC,SAAD,CAAnB,EAAgCE,OAAhC;AACD;SAEeE,eACdC;AAEA,MAAIC,GAAG,GAAGP,MAAM,CAACM,mBAAD,CAAhB;;wBACwBE,KAAK,CAACC,QAAN,CAAe;AAAEC,IAAAA,UAAU,EAAE,CAAd;AAAiBJ,IAAAA,mBAAmB,EAAnBA;AAAjB,GAAf;MAAnBK;MAAOC;AAEZ;;;;;;;AAOA;;;AACA,MAAIC,EAAE,GAAG,SAALA,EAAK,CAACZ,SAAD,EAAmBE,OAAnB;AAAA,WACPW,WAAW,CAACF,QAAD,EAAWN,mBAAX,EAAgCL,SAAhC,EAA2CE,OAA3C,CADJ;AAAA,GAAT;;AAGAK,EAAAA,KAAK,CAACO,SAAN,CAAgB;AACdlB,IAAAA,OAAO,CAACmB,EAAR,CAAWT,GAAX,EAAgBM,EAAhB;;AAEA,WAAO;AACLhB,MAAAA,OAAO,CAACoB,GAAR,CAAYV,GAAZ,EAAiBM,EAAjB;AAED,KAHD;AAID,GAPD;AASA,SAAOF,KAAP;AACD;;AAED,SAASG,WAAT,CACEF,QADF,EAEEN,mBAFF,EAGEL,SAHF,EAIEE,OAJF;AAME;AACAS,EAAAA,QAAQ,CAAC,UAAAM,SAAS;AAChB,QAAIR,UAAU,GAAG,CAACQ,SAAS,CAACR,UAAV,IAAwB,CAAzB,IAA8B,CAA/C;AACA,QAAIS,MAAM,GAAwB;AAChClB,MAAAA,SAAS,EAATA,SADgC;AAEhCE,MAAAA,OAAO,EAAPA,OAFgC;AAGhCG,MAAAA,mBAAmB,EAAnBA,mBAHgC;AAIhCI,MAAAA,UAAU,EAAVA;AAJgC,KAAlC;AAMA,QAAIP,OAAO,KAAKiB,SAAhB,EAA2B,OAAOD,MAAM,CAAChB,OAAd;AAE3B,WAAOgB,MAAP;AACD,GAXO,CAAR;AAYD;;;;"}

LICENSE

@@ -0,0 +0,0 @@ MIT License

package.json

 {
-  "version": "0.2.1",
+  "version": "0.3.0",
   "license": "MIT",
@@ -21,10 +21,7 @@ "main": "dist/index.js",
     "storybook": "start-storybook -p 6006",
-    "build-storybook": "build-storybook"
+    "build-storybook": "build-storybook",
+    "gzip": "node gzip.js"
   },
-  "dependencies": {
-    "mitt": "^1.2.0"
-  },
   "peerDependencies": {
-    "react": ">=16",
-    "mitt": "^1.2.0"
+    "react": ">=16"
   },
@@ -36,8 +33,2 @@ "husky": {
   },
-  "prettier": {
-    "printWidth": 80,
-    "semi": false,
-    "singleQuote": true,
-    "trailingComma": "es5"
-  },
   "name": "react-forceupdate",
@@ -47,3 +38,3 @@ "author": "Kunuk Nykjær",
   "devDependencies": {
-    "@babel/core": "^7.9.0",
+    "@babel/core": "^7.9.6",
     "@storybook/addon-actions": "^5.3.18",
@@ -55,8 +46,13 @@ "@storybook/addon-docs": "^5.3.18",
     "@storybook/react": "^5.3.18",
+    "@testing-library/jest-dom": "^5.5.0",
+    "@testing-library/react": "^10.0.4",
+    "@testing-library/react-hooks": "^3.2.1",
     "@types/react": "^16.9.34",
-    "@types/react-dom": "^16.9.6",
+    "@types/react-dom": "^16.9.7",
+    "babel-jest": "^25.5.1",
     "babel-loader": "^8.1.0",
+    "gzip-size": "^5.1.1",
     "husky": "^4.2.5",
     "identity-obj-proxy": "^3.0.0",
-    "mitt": "^1.2.0",
+    "mittt": "^1",
     "react": "^16.13.1",
@@ -66,3 +62,3 @@ "react-docgen-typescript-loader": "^3.7.2",
     "react-is": "^16.13.1",
-    "ts-loader": "^7.0.1",
+    "ts-loader": "^7.0.2",
     "tsdx": "^0.13.2",
@@ -69,0 +65,0 @@ "tslib": "^1.11.1",

README.md

@@ -11,17 +11,10 @@ # react-forceupdate
 React hooks for force updating components.
-Force update from anywhere to those using a useForceUpdate hook.
+Force update from anywhere to those using a useForceUpdate hook with optional payload.
 
-## Dependency
-
-mitt: tiny library ~270 byte gzipped.
-https://bundlephobia.com/result?p=mitt
-
 ## Install
 
 ```bash
-npm install mitt
 npm install react-forceupdate
 
 # or
-# yarn add mitt
 # yarn add react-forceupdate
@@ -38,14 +31,11 @@ ```
 function ReceiverComponent() {
-  // re-render this component on run event
-  useForceUpdate()
+  // re-render this component on 'default' event
+  useForceUpdate() // same as useForceUpdate('default')
 
-  // re-render this component on run alpha event
+  // re-render this component on this event
   useForceUpdate('alpha')
 
-  // re-render this component on either bravo or charlie run event
-  useForceUpdate(['bravo', 'charlie'])
+  // re-render this component on this event with received payload
+  let { payload } = useForceUpdate('bravo')
 
-  // re-render this component on delta run event and receive payload
-  let { payload } = useForceUpdate('delta')
-
   return <div>component {payload.message}</div>
@@ -62,3 +52,3 @@ }
   let onUpdate = () => {
-    runForceUpdate()
+    runForceUpdate() // same as runForceUpdate('default')
   }
@@ -68,11 +58,5 @@ let onAlphaUpdate = () => {
   }
-  let onABravoCharlieUpdate = () => {
-    runForceUpdate(['bravo', 'charlie'])
+  let onBravoUpdate = () => {
+    runForceUpdate('bravo', { message: 'hi' })
   }
-  let onDeltaUpdate = () => {
-    runForceUpdate('delta', { message: 'hi' })
-  }
-  let onEchoFoxtrotUpdate = () => {
-    runForceUpdate(['echo', 'foxtrot'], { message: 'hello' })
-  }
 
@@ -87,9 +71,5 @@ return (
 
-      <button onClick={onABravoCharlieUpdate}>
-        re-render bravo and charlie receiver components
+      <button onClick={onBravoUpdate}>
+        re-render bravo receiver components with provided payload
       </button>
-
-      <button onClick={onDeltaUpdate}>
-        re-render delta receiver components with provided payload
-      </button>
     </div>
@@ -108,7 +88,7 @@ )
 let nonReactive = {
-  something: '',
+  something: 'waiting...',
 }
 
-let Alpha = () => {
-  useForceUpdate() // re-render on runForceUpdate event.
+let Component1 = () => {
+  useForceUpdate()
 
@@ -118,4 +98,4 @@ return <div> {nonReactive.something} </div>
 
-let Bravo = () => {
-  useForceUpdate() // re-render on runForceUpdate event.
+let Component2 = () => {
+  useForceUpdate()
 
@@ -130,3 +110,2 @@ return <div> {nonReactive.something} </div>
 
-    // force update those who uses useForceUpdate hook.
     runForceUpdate()
@@ -138,4 +117,4 @@ }
       <button onClick={onUpdate}>Force update</button>
-      <DeeplyNestedComponentContainingAlpha />
-      <DeeplyNestedComponentContainingBravo />
+      <DeeplyNestedComponentContainingComponent1 />
+      <DeeplyNestedComponentContainingComponent2 />
     </main>
@@ -146,3 +125,3 @@ )
 
-### With type or payload
+### With eventType or payload
 
@@ -153,3 +132,3 @@ ```jsx
 let Alpha = () => {
-  let data = useForceUpdate('alpha') // re-render on runForceUpdate event.
+  let data = useForceUpdate('alpha')
 
@@ -160,3 +139,3 @@ return <pre>{JSON.stringify(data, null, 2)}</pre>
 let Bravo = () => {
-  let data = useForceUpdate('bravo') // re-render on runForceUpdate event.
+  let data = useForceUpdate('bravo')
 
@@ -166,22 +145,9 @@ return <pre>{JSON.stringify(data, null, 2)}</pre>
 
-let AlphaBravo = () => {
-  let data = useForceUpdate(['alpha', 'bravo']) // re-render on runForceUpdate event.
-
-  return <pre>{JSON.stringify(data, null, 2)}</pre>
-}
-
-let CatchAll = () => {
-  let data = useForceUpdate('*') // re-render on runForceUpdate event.
-
-  return <pre>{JSON.stringify(data, null, 2)}</pre>
-}
-
 function App() {
   let onUpdateAlpha = () => {
-    // force update those who uses useForceUpdate hook with given type.
-    runForceUpdate('alpha', { message: 'hi' })
+    const payload = { message: 'hi' }
+    runForceUpdate('alpha', payload)
   }
 
   let onUpdateBravo = () => {
-    // force update those who uses useForceUpdate hook with given type.
     runForceUpdate('bravo')
@@ -197,3 +163,2 @@ }
       <DeeplyNestedComponentContainingBravo />
-      <DeeplyNestedComponentContainingCatchAll />
     </main>
@@ -200,0 +165,0 @@ )

src/index.tsx

 import React from 'react'
-import mitt from 'mitt'
+import mittt, { Emitter, EventHandlerMap } from 'mittt'
 
@@ -7,93 +7,55 @@ // Please do not use types off of a default export module or else Storybook Docs will suffer.
 
-type UseForceUpdatePropsItem = string | undefined
-export type UseForceUpdateProps =
-  | UseForceUpdatePropsItem
-  | Array<UseForceUpdatePropsItem>
+export type UseForceUpdateProps = string
+type Input = string
 
-type Input = string | undefined | '*'
-
-export type RunForceUpdateType = Input | Array<Input>
+export type RunForceUpdateEventType = Input
 export type RunForceUpdatePayload = any
 
 export type UseForceUpdateState = {
-  count: number
-  type?: string
+  eventCount: number
+  subscribedEventType: string
+  eventType?: string
   payload?: any
-  key?: any
 }
 
-let emitter: mitt.Emitter = mitt()
+let emitterHandlerMap: EventHandlerMap = Object.create(null)
+let emitter: Emitter = mittt(emitterHandlerMap)
+let prefix = 'event_'
 
-let getOnKeys = (type: UseForceUpdateProps): Array<string> => {
-  let result = []
+let getKey = (eventType: Input): string => {
+  if (!eventType) return prefix + 'default'
 
-  function add(typeItem: Input) {
-    if (typeof typeItem === 'undefined') result.push('update_default')
-    else if (typeItem === '*') result.push('*')
-    else result.push('update_' + typeItem)
-  }
-
-  if (Array.isArray(type)) {
-    type.forEach(typeItem => {
-      add(typeItem)
-    })
-  } else {
-    add(type)
-  }
-
-  return result
+  return prefix + eventType
 }
 
-let getEmitKey = (type: Input): string => {
-  if (typeof type === 'undefined') return 'update_default'
-
-  return 'update_' + type
-}
-
-let initialState: UseForceUpdateState = { count: 0 }
-
 export function runForceUpdate(
-  types?: RunForceUpdateType,
+  eventType?: RunForceUpdateEventType,
   payload?: RunForceUpdatePayload
 ) {
-  if (typeof types === 'undefined' || typeof types === 'string') {
-    emitter.emit(getEmitKey(types), payload)
-  } else if (Array.isArray(types)) {
-    types.forEach(type => {
-      emitter.emit(getEmitKey(type), payload)
-    })
-  } else {
-    // error
-  }
+  emitter.emit(getKey(eventType), payload)
 }
 
-export function useForceUpdate(type?: Input): UseForceUpdateState {
-  const [state, setState] = React.useState(initialState)
+export function useForceUpdate(
+  subscribedEventType?: Input
+): UseForceUpdateState {
+  let key = getKey(subscribedEventType)
+  let [state, setState] = React.useState({ eventCount: 0, subscribedEventType })
 
-  let keys = React.useMemo(() => {
-    return getOnKeys(type)
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [])
+  /*
+  let fn = React.useMemo(
+    () => (eventType: Input, payload: any) =>
+      updateState(setState, subscribedEventType, eventType, payload),
+    []
+  )
+  */
+  // React.useMemo not needed.
+  let fn = (eventType: Input, payload: any) =>
+    updateState(setState, subscribedEventType, eventType, payload)
 
-  let updateFunctions = React.useMemo(() => {
-    let functions = {}
-
-    keys.forEach(key => {
-      functions[key] = (mittType: any, mittEvt?: any) => {
-        updateState(setState, key, mittType, mittEvt)
-      }
-    })
-
-    return functions
-  }, [keys])
-
   React.useEffect(() => {
-    keys.forEach(key => {
-      emitter.on(key, updateFunctions[key])
-    })
-
+    emitter.on(key, fn)
+    // console.debug('on', emitterHandlerMap)
     return () => {
-      keys.forEach(key => {
-        emitter.off(key, updateFunctions[key])
-      })
+      emitter.off(key, fn)
+      // console.debug('off', emitterHandlerMap)
     }
@@ -107,24 +69,15 @@ })
   setState: React.Dispatch<React.SetStateAction<UseForceUpdateState>>,
-  key: Input,
-  mittType: any,
-  mittEvt?: any
+  subscribedEventType: Input,
+  eventType: string,
+  payload?: any
 ) {
-  // Order of args in mitt depending on whether type is '*' or not.
-  // Either it is (mittType, mittEvt) or (mittEvt).
-  // https://github.com/developit/mitt/blob/master/src/index.js
-
-  let type = mittEvt ? mittType : undefined
-  let payload = mittEvt ? mittEvt : mittType
-
-  if (key === '*' && !type) {
-    // Special thing with mitt and '*' usage. Workaround that.
-    type = payload
-    payload = undefined
-  }
-
   // This triggers re-render
   setState(prevState => {
-    let count = (prevState.count || 0) + 1
-    let result: UseForceUpdateState = { type, payload, count, key }
-    if (type === undefined) delete result.type
+    let eventCount = (prevState.eventCount || 0) + 1
+    let result: UseForceUpdateState = {
+      eventType,
+      payload,
+      subscribedEventType,
+      eventCount,
+    }
     if (payload === undefined) delete result.payload
@@ -131,0 +84,0 @@

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

Fixed alerts

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

Improved metrics

Dependency count

1

-66.67%

Worsened metrics

Total package byte prevSize

24584

-33.69%

Dev dependency count

26

23.81%

Lines of code

208

-32.69%

Number of lines in readme file

158

-18.13%

Number of medium supply chain risk alerts

1

Infinity%

Dependency changes

• - Removed

  mitt@^1.2.0

• - Removed

  mitt@1.2.0
  (transitive)