use-memo-map 0.0.0-main.18b69b6

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 William Wong
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,120 @@
+# `use-memo-map`
+
+Memoizes calls to array map function similar to `React.useMemo`. Memoized results will survive next render.
+
+## Background
+
+tl;dr, `React.useMemo()` cache a single call. `useMemoMap()` cache multiple calls.
+
+If you have a variable-length array and would like to cache `Array.map` like `useMemo`, you can use `useMemoMap` to cache all calls.
+
+## How to use
+
+```js
+import { useMemoMap } from 'use-memo-map';
+
+const MyComponent = () => {
+  const multiplyBy10 = useCallback(value => {
+    // Calls to this function will be memoized based on its first argument.
+    // You can do expensive calls here.
+    return value * 10;
+  }, []);
+
+  // useMemoMap() will return a function that take an array.
+  const map = useMemoMap(multiplyBy10);
+
+  const output = map([1, 2, 3]); // Returns [10, 20, 30].
+
+  return ...;
+};
+
+export default MyComponent;
+```
+
+## API
+
+```ts
+type UseMemoMapOptions<T> = {
+  itemEquality?: (this: readonly T[], x: T, y: T) => boolean;
+};
+
+function useMemoMap<T = unknown, R = unknown>(
+  mapper: (this: readonly T[], item: T, index: -1, array: readonly T[]) => R,
+  { itemEquality = Object.is }: UseMemoMapOptions<T> = {}
+): (array: readonly T[]) => readonly R[] {}
+```
+
+For example, converting a `number` array into a `string` array.
+
+```ts
+function useMemoMap(
+  mapper: (item: number, index: -1, array: readonly number[]) => string
+): (array: readonly number[]) => readonly string[];
+```
+
+## Behaviors
+
+### Invalidate all results when mapper function change
+
+If the first argument (a.k.a. the mapper function) changed, it will invalidate all results. This is by design.
+
+You should always use `useCallback` or `useMemo` to cache the mapper function.
+
+```js
+const MyComponent = () => {
+  // ❌ In the next line, multiplyBy10() is a new instance on every render of <MyComponent>.
+  const multiplyBy10 = value => value * 10;
+  // ✔️ You should cache multiplyBy10() by React.useCallback().
+  const multiplyBy10 = useCallback(value => value * 10, []);
+
+  const map = useMemoMap(multiplyBy10);
+
+  // Calls to map() will not survive across render calls if multiplyBy10() changed.
+  const output = map([1, 2, 3]);
+
+  // ...
+};
+```
+
+### Single cache pool for multiple calls
+
+In a single render loop, if you call the returned function (a.k.a. the `map` function) multiple times, all calls will be sharing the same "cache pool".
+
+```js
+const MyComponent = () => {
+  // ...
+
+  const output1 = map([1, 2, 3]); // Return [10, 20, 30].
+  const output2 = map([1, 2, 3]); // Return [10, 20, 30] without calling `multiplyBy10`.
+
+  // ...
+};
+```
+
+Note: the "cache pool" will be saved during `useEffect()` callback. This is similar to `usePrevious()` hook.
+
+### Index is always `-1`
+
+Unlike `Array.map()` which pass the `index` value as second argument, `useMemoMap()` will always pass `-1`. This is by design.
+
+Calls to mapper function could be cached and will not be called again if only `index` has changed. To protect wrong use of `index` value, we pass `-1` instead.
+
+If you understand this risk, call `this.indexOf(item)` to get the `index` value.
+
+### Returns read-only result
+
+React loves immutability. By default, the array we returned is frozen (a.k.a. read-only).
+
+If you prefer mutable array, call `[...result]` to clone the array.
+
+### Custom equality function
+
+We use `Object.is` for equality check. You can provide a different equality check via `options.itemEquality`.
+
+## Contributions
+
+Like us? [Star](https://github.com/compulim/use-memo-map/stargazers) us.
+
+Want to make it better? [File](https://github.com/compulim/use-memo-map/issues) us an issue.
+
+Don't like something you see? [Submit](https://github.com/compulim/use-memo-map/pulls) a pull request.

package/lib/commonjs/index.js

@@ -0,0 +1,15 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault").default;
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+_Object$defineProperty(exports, "useMemoMap", {
+  enumerable: true,
+  get: function get() {
+    return _useMemoMap.default;
+  }
+});
+var _useMemoMap = _interopRequireDefault(require("./useMemoMap"));
+//# sourceMappingURL=index.js.map

package/lib/commonjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/index.ts"],"sourcesContent":["import useMemoMap from './useMemoMap';\n\nexport { useMemoMap };\n"],"mappings":";;;;;;;;;;;;;AAAA"}

package/lib/commonjs/private/usePrevious.js

@@ -0,0 +1,16 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = usePrevious;
+var _react = require("react");
+function usePrevious(value) {
+  var ref = (0, _react.useRef)();
+  (0, _react.useEffect)(function () {
+    ref.current = value;
+  });
+  return ref.current;
+}
+//# sourceMappingURL=usePrevious.js.map

package/lib/commonjs/private/usePrevious.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePrevious.js","names":["usePrevious","value","ref","useRef","useEffect","current"],"sources":["../../../src/private/usePrevious.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\nexport default function usePrevious<T>(value: T): T | undefined {\n  const ref = useRef<T>();\n\n  useEffect(() => {\n    ref.current = value;\n  });\n\n  return ref.current;\n}\n"],"mappings":";;;;;;;AAAA;AAEe,SAASA,WAAW,CAAIC,KAAQ,EAAiB;EAC9D,IAAMC,GAAG,GAAG,IAAAC,aAAM,GAAK;EAEvB,IAAAC,gBAAS,EAAC,YAAM;IACdF,GAAG,CAACG,OAAO,GAAGJ,KAAK;EACrB,CAAC,CAAC;EAEF,OAAOC,GAAG,CAACG,OAAO;AACpB"}

package/lib/commonjs/private/useValueRef.js

@@ -0,0 +1,25 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault").default;
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useValueRef;
+var _create = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/create"));
+var _react = require("react");
+function useValueRef(value) {
+  var ref = (0, _react.useRef)();
+  var readOnlyRef = (0, _react.useMemo)(function () {
+    return (0, _create.default)({}, {
+      current: {
+        get: function get() {
+          return ref.current;
+        }
+      }
+    });
+  }, [ref]);
+  ref.current = value;
+  return readOnlyRef;
+}
+//# sourceMappingURL=useValueRef.js.map

package/lib/commonjs/private/useValueRef.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useValueRef.js","names":["useValueRef","value","ref","useRef","readOnlyRef","useMemo","current","get"],"sources":["../../../src/private/useValueRef.ts"],"sourcesContent":["import { useMemo, useRef } from 'react';\nimport type { RefObject } from 'react';\n\nexport default function useValueRef<T>(value: T): RefObject<T> & { current: T } {\n  const ref = useRef<T>();\n  const readOnlyRef = useMemo(() => Object.create({}, { current: { get: () => ref.current } }), [ref]);\n\n  ref.current = value;\n\n  return readOnlyRef;\n}\n"],"mappings":";;;;;;;;;AAAA;AAGe,SAASA,WAAW,CAAIC,KAAQ,EAAiC;EAC9E,IAAMC,GAAG,GAAG,IAAAC,aAAM,GAAK;EACvB,IAAMC,WAAW,GAAG,IAAAC,cAAO,EAAC;IAAA,OAAM,qBAAc,CAAC,CAAC,EAAE;MAAEC,OAAO,EAAE;QAAEC,GAAG,EAAE;UAAA,OAAML,GAAG,CAACI,OAAO;QAAA;MAAC;IAAE,CAAC,CAAC;EAAA,GAAE,CAACJ,GAAG,CAAC,CAAC;EAEpGA,GAAG,CAACI,OAAO,GAAGL,KAAK;EAEnB,OAAOG,WAAW;AACpB"}

package/lib/commonjs/useMemoMap.js

@@ -0,0 +1,64 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault").default;
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useMemoMap;
+var _is = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/is"));
+var _freeze = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/freeze"));
+var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
+var _find = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/find"));
+var _react = require("react");
+var _usePrevious = _interopRequireDefault(require("./private/usePrevious"));
+var _useValueRef = _interopRequireDefault(require("./private/useValueRef"));
+/**
+ * Creates a memoized mapping function.
+ *
+ * Unlike `React.useMemo`, the mapping function can be called multiple times in a single render loop.
+ * All calls to the mapping function will be memoized.
+ *
+ * The memoized arguments and return values will survive next render.
+ *
+ * When the mapping function change, all memoized values will be invalidated.
+ */
+function useMemoMap(mapper) {
+  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+    _ref$itemEquality = _ref.itemEquality,
+    itemEquality = _ref$itemEquality === void 0 ? _is.default : _ref$itemEquality;
+  var itemEqualityRef = (0, _useValueRef.default)(itemEquality);
+  var lastCallsRef = (0, _react.useRef)([]);
+  var mapperRef = (0, _useValueRef.default)(mapper);
+  var thisCalls = [];
+  if ((0, _usePrevious.default)(mapper) !== mapper) {
+    lastCallsRef.current = [];
+  }
+  (0, _react.useEffect)(function () {
+    lastCallsRef.current = (0, _freeze.default)(thisCalls);
+  });
+  var thisCallsRef = (0, _useValueRef.default)(thisCalls);
+  return (0, _react.useCallback)(function (array) {
+    var itemEquality = itemEqualityRef.current;
+    var mapper = mapperRef.current;
+    var thisCalls = thisCallsRef.current;
+    return (0, _freeze.default)((0, _map.default)(array).call(array, function (item) {
+      var _context;
+      var thisCall = (0, _find.default)(thisCalls).call(thisCalls, function (entry) {
+        return itemEquality.call(array, item, entry[0]);
+      });
+
+      // If this call has memoized in the current render loop, use the memoized return value.
+      if (thisCall) {
+        return thisCall[1];
+      }
+      var lastCall = (0, _find.default)(_context = lastCallsRef.current).call(_context, function (entry) {
+        return itemEquality.call(array, item, entry[0]);
+      });
+      var result = lastCall ? lastCall[1] : mapper.call(array, item, -1, array);
+      thisCalls.push([item, result]);
+      return result;
+    }));
+  }, [itemEqualityRef, lastCallsRef, mapperRef, thisCallsRef]);
+}
+//# sourceMappingURL=useMemoMap.js.map

package/lib/commonjs/useMemoMap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMemoMap.js","names":["useMemoMap","mapper","itemEquality","itemEqualityRef","useValueRef","lastCallsRef","useRef","mapperRef","thisCalls","usePrevious","current","useEffect","thisCallsRef","useCallback","array","item","thisCall","entry","call","lastCall","result","push"],"sources":["../../src/useMemoMap.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\n\nimport usePrevious from './private/usePrevious';\nimport useValueRef from './private/useValueRef';\n\ntype UseMemoMapOptions<T> = {\n  itemEquality?: (this: readonly T[], x: T, y: T) => boolean;\n};\n\n/**\n * Creates a memoized mapping function.\n *\n * Unlike `React.useMemo`, the mapping function can be called multiple times in a single render loop.\n * All calls to the mapping function will be memoized.\n *\n * The memoized arguments and return values will survive next render.\n *\n * When the mapping function change, all memoized values will be invalidated.\n */\nexport default function useMemoMap<T = unknown, R = unknown>(\n  mapper: (this: readonly T[], item: T, index: -1, array: readonly T[]) => R,\n  { itemEquality = Object.is }: UseMemoMapOptions<T> = {}\n): (array: readonly T[]) => readonly R[] {\n  const itemEqualityRef = useValueRef(itemEquality);\n  const lastCallsRef = useRef<readonly [T, R][]>([]);\n  const mapperRef = useValueRef(mapper);\n  const thisCalls: [T, R][] = [];\n\n  if (usePrevious(mapper) !== mapper) {\n    lastCallsRef.current = [];\n  }\n\n  useEffect(() => {\n    lastCallsRef.current = Object.freeze(thisCalls);\n  });\n\n  const thisCallsRef = useValueRef(thisCalls);\n\n  return useCallback<(array: readonly T[]) => readonly R[]>(\n    (array: readonly T[]) => {\n      const { current: itemEquality } = itemEqualityRef;\n      const { current: mapper } = mapperRef;\n      const { current: thisCalls } = thisCallsRef;\n\n      return <readonly R[]>Object.freeze(\n        array.map<R>(item => {\n          const thisCall = thisCalls.find(entry => itemEquality.call(array, item, entry[0]));\n\n          // If this call has memoized in the current render loop, use the memoized return value.\n          if (thisCall) {\n            return thisCall[1];\n          }\n\n          const lastCall = lastCallsRef.current.find(entry => itemEquality.call(array, item, entry[0]));\n          const result = lastCall ? lastCall[1] : mapper.call(array, item, -1, array);\n\n          thisCalls.push([item, result]);\n\n          return result;\n        })\n      );\n    },\n    [itemEqualityRef, lastCallsRef, mapperRef, thisCallsRef]\n  );\n}\n"],"mappings":";;;;;;;;;;;;AAAA;AAEA;AACA;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACe,SAASA,UAAU,CAChCC,MAA0E,EAEnC;EAAA,+EADc,CAAC,CAAC;IAAA,yBAArDC,YAAY;IAAZA,YAAY;EAEd,IAAMC,eAAe,GAAG,IAAAC,oBAAW,EAACF,YAAY,CAAC;EACjD,IAAMG,YAAY,GAAG,IAAAC,aAAM,EAAoB,EAAE,CAAC;EAClD,IAAMC,SAAS,GAAG,IAAAH,oBAAW,EAACH,MAAM,CAAC;EACrC,IAAMO,SAAmB,GAAG,EAAE;EAE9B,IAAI,IAAAC,oBAAW,EAACR,MAAM,CAAC,KAAKA,MAAM,EAAE;IAClCI,YAAY,CAACK,OAAO,GAAG,EAAE;EAC3B;EAEA,IAAAC,gBAAS,EAAC,YAAM;IACdN,YAAY,CAACK,OAAO,GAAG,qBAAcF,SAAS,CAAC;EACjD,CAAC,CAAC;EAEF,IAAMI,YAAY,GAAG,IAAAR,oBAAW,EAACI,SAAS,CAAC;EAE3C,OAAO,IAAAK,kBAAW,EAChB,UAACC,KAAmB,EAAK;IACvB,IAAiBZ,YAAY,GAAKC,eAAe,CAAzCO,OAAO;IACf,IAAiBT,MAAM,GAAKM,SAAS,CAA7BG,OAAO;IACf,IAAiBF,SAAS,GAAKI,YAAY,CAAnCF,OAAO;IAEf,OAAqB,qBACnB,kBAAAI,KAAK,OAALA,KAAK,EAAQ,UAAAC,IAAI,EAAI;MAAA;MACnB,IAAMC,QAAQ,GAAG,mBAAAR,SAAS,OAATA,SAAS,EAAM,UAAAS,KAAK;QAAA,OAAIf,YAAY,CAACgB,IAAI,CAACJ,KAAK,EAAEC,IAAI,EAAEE,KAAK,CAAC,CAAC,CAAC,CAAC;MAAA,EAAC;;MAElF;MACA,IAAID,QAAQ,EAAE;QACZ,OAAOA,QAAQ,CAAC,CAAC,CAAC;MACpB;MAEA,IAAMG,QAAQ,GAAG,8BAAAd,YAAY,CAACK,OAAO,iBAAM,UAAAO,KAAK;QAAA,OAAIf,YAAY,CAACgB,IAAI,CAACJ,KAAK,EAAEC,IAAI,EAAEE,KAAK,CAAC,CAAC,CAAC,CAAC;MAAA,EAAC;MAC7F,IAAMG,MAAM,GAAGD,QAAQ,GAAGA,QAAQ,CAAC,CAAC,CAAC,GAAGlB,MAAM,CAACiB,IAAI,CAACJ,KAAK,EAAEC,IAAI,EAAE,CAAC,CAAC,EAAED,KAAK,CAAC;MAE3EN,SAAS,CAACa,IAAI,CAAC,CAACN,IAAI,EAAEK,MAAM,CAAC,CAAC;MAE9B,OAAOA,MAAM;IACf,CAAC,CAAC,CACH;EACH,CAAC,EACD,CAACjB,eAAe,EAAEE,YAAY,EAAEE,SAAS,EAAEK,YAAY,CAAC,CACzD;AACH"}

package/lib/esmodules/index.js

@@ -0,0 +1,3 @@
+import useMemoMap from './useMemoMap';
+export { useMemoMap };
+//# sourceMappingURL=index.js.map

package/lib/esmodules/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["useMemoMap"],"sources":["../../src/index.ts"],"sourcesContent":["import useMemoMap from './useMemoMap';\n\nexport { useMemoMap };\n"],"mappings":"AAAA,OAAOA,UAAU,MAAM,cAAc;AAErC,SAASA,UAAU"}

package/lib/esmodules/private/usePrevious.js

@@ -0,0 +1,9 @@
+import { useEffect, useRef } from 'react';
+export default function usePrevious(value) {
+  var ref = useRef();
+  useEffect(function () {
+    ref.current = value;
+  });
+  return ref.current;
+}
+//# sourceMappingURL=usePrevious.js.map

package/lib/esmodules/private/usePrevious.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePrevious.js","names":["useEffect","useRef","usePrevious","value","ref","current"],"sources":["../../../src/private/usePrevious.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\nexport default function usePrevious<T>(value: T): T | undefined {\n  const ref = useRef<T>();\n\n  useEffect(() => {\n    ref.current = value;\n  });\n\n  return ref.current;\n}\n"],"mappings":"AAAA,SAASA,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAEzC,eAAe,SAASC,WAAW,CAAIC,KAAQ,EAAiB;EAC9D,IAAMC,GAAG,GAAGH,MAAM,EAAK;EAEvBD,SAAS,CAAC,YAAM;IACdI,GAAG,CAACC,OAAO,GAAGF,KAAK;EACrB,CAAC,CAAC;EAEF,OAAOC,GAAG,CAACC,OAAO;AACpB"}

package/lib/esmodules/private/useValueRef.js

@@ -0,0 +1,17 @@
+import _Object$create from "@babel/runtime-corejs3/core-js-stable/object/create";
+import { useMemo, useRef } from 'react';
+export default function useValueRef(value) {
+  var ref = useRef();
+  var readOnlyRef = useMemo(function () {
+    return _Object$create({}, {
+      current: {
+        get: function get() {
+          return ref.current;
+        }
+      }
+    });
+  }, [ref]);
+  ref.current = value;
+  return readOnlyRef;
+}
+//# sourceMappingURL=useValueRef.js.map

package/lib/esmodules/private/useValueRef.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useValueRef.js","names":["useMemo","useRef","useValueRef","value","ref","readOnlyRef","current","get"],"sources":["../../../src/private/useValueRef.ts"],"sourcesContent":["import { useMemo, useRef } from 'react';\nimport type { RefObject } from 'react';\n\nexport default function useValueRef<T>(value: T): RefObject<T> & { current: T } {\n  const ref = useRef<T>();\n  const readOnlyRef = useMemo(() => Object.create({}, { current: { get: () => ref.current } }), [ref]);\n\n  ref.current = value;\n\n  return readOnlyRef;\n}\n"],"mappings":";AAAA,SAASA,OAAO,EAAEC,MAAM,QAAQ,OAAO;AAGvC,eAAe,SAASC,WAAW,CAAIC,KAAQ,EAAiC;EAC9E,IAAMC,GAAG,GAAGH,MAAM,EAAK;EACvB,IAAMI,WAAW,GAAGL,OAAO,CAAC;IAAA,OAAM,eAAc,CAAC,CAAC,EAAE;MAAEM,OAAO,EAAE;QAAEC,GAAG,EAAE;UAAA,OAAMH,GAAG,CAACE,OAAO;QAAA;MAAC;IAAE,CAAC,CAAC;EAAA,GAAE,CAACF,GAAG,CAAC,CAAC;EAEpGA,GAAG,CAACE,OAAO,GAAGH,KAAK;EAEnB,OAAOE,WAAW;AACpB"}

package/lib/esmodules/useMemoMap.js

@@ -0,0 +1,56 @@
+import _Object$is from "@babel/runtime-corejs3/core-js-stable/object/is";
+import _Object$freeze from "@babel/runtime-corejs3/core-js-stable/object/freeze";
+import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
+import _findInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/find";
+import { useCallback, useEffect, useRef } from 'react';
+import usePrevious from './private/usePrevious';
+import useValueRef from './private/useValueRef';
+/**
+ * Creates a memoized mapping function.
+ *
+ * Unlike `React.useMemo`, the mapping function can be called multiple times in a single render loop.
+ * All calls to the mapping function will be memoized.
+ *
+ * The memoized arguments and return values will survive next render.
+ *
+ * When the mapping function change, all memoized values will be invalidated.
+ */
+export default function useMemoMap(mapper) {
+  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+    _ref$itemEquality = _ref.itemEquality,
+    itemEquality = _ref$itemEquality === void 0 ? _Object$is : _ref$itemEquality;
+  var itemEqualityRef = useValueRef(itemEquality);
+  var lastCallsRef = useRef([]);
+  var mapperRef = useValueRef(mapper);
+  var thisCalls = [];
+  if (usePrevious(mapper) !== mapper) {
+    lastCallsRef.current = [];
+  }
+  useEffect(function () {
+    lastCallsRef.current = _Object$freeze(thisCalls);
+  });
+  var thisCallsRef = useValueRef(thisCalls);
+  return useCallback(function (array) {
+    var itemEquality = itemEqualityRef.current;
+    var mapper = mapperRef.current;
+    var thisCalls = thisCallsRef.current;
+    return _Object$freeze(_mapInstanceProperty(array).call(array, function (item) {
+      var _context;
+      var thisCall = _findInstanceProperty(thisCalls).call(thisCalls, function (entry) {
+        return itemEquality.call(array, item, entry[0]);
+      });
+
+      // If this call has memoized in the current render loop, use the memoized return value.
+      if (thisCall) {
+        return thisCall[1];
+      }
+      var lastCall = _findInstanceProperty(_context = lastCallsRef.current).call(_context, function (entry) {
+        return itemEquality.call(array, item, entry[0]);
+      });
+      var result = lastCall ? lastCall[1] : mapper.call(array, item, -1, array);
+      thisCalls.push([item, result]);
+      return result;
+    }));
+  }, [itemEqualityRef, lastCallsRef, mapperRef, thisCallsRef]);
+}
+//# sourceMappingURL=useMemoMap.js.map

package/lib/esmodules/useMemoMap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMemoMap.js","names":["useCallback","useEffect","useRef","usePrevious","useValueRef","useMemoMap","mapper","itemEquality","itemEqualityRef","lastCallsRef","mapperRef","thisCalls","current","thisCallsRef","array","item","thisCall","entry","call","lastCall","result","push"],"sources":["../../src/useMemoMap.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\n\nimport usePrevious from './private/usePrevious';\nimport useValueRef from './private/useValueRef';\n\ntype UseMemoMapOptions<T> = {\n  itemEquality?: (this: readonly T[], x: T, y: T) => boolean;\n};\n\n/**\n * Creates a memoized mapping function.\n *\n * Unlike `React.useMemo`, the mapping function can be called multiple times in a single render loop.\n * All calls to the mapping function will be memoized.\n *\n * The memoized arguments and return values will survive next render.\n *\n * When the mapping function change, all memoized values will be invalidated.\n */\nexport default function useMemoMap<T = unknown, R = unknown>(\n  mapper: (this: readonly T[], item: T, index: -1, array: readonly T[]) => R,\n  { itemEquality = Object.is }: UseMemoMapOptions<T> = {}\n): (array: readonly T[]) => readonly R[] {\n  const itemEqualityRef = useValueRef(itemEquality);\n  const lastCallsRef = useRef<readonly [T, R][]>([]);\n  const mapperRef = useValueRef(mapper);\n  const thisCalls: [T, R][] = [];\n\n  if (usePrevious(mapper) !== mapper) {\n    lastCallsRef.current = [];\n  }\n\n  useEffect(() => {\n    lastCallsRef.current = Object.freeze(thisCalls);\n  });\n\n  const thisCallsRef = useValueRef(thisCalls);\n\n  return useCallback<(array: readonly T[]) => readonly R[]>(\n    (array: readonly T[]) => {\n      const { current: itemEquality } = itemEqualityRef;\n      const { current: mapper } = mapperRef;\n      const { current: thisCalls } = thisCallsRef;\n\n      return <readonly R[]>Object.freeze(\n        array.map<R>(item => {\n          const thisCall = thisCalls.find(entry => itemEquality.call(array, item, entry[0]));\n\n          // If this call has memoized in the current render loop, use the memoized return value.\n          if (thisCall) {\n            return thisCall[1];\n          }\n\n          const lastCall = lastCallsRef.current.find(entry => itemEquality.call(array, item, entry[0]));\n          const result = lastCall ? lastCall[1] : mapper.call(array, item, -1, array);\n\n          thisCalls.push([item, result]);\n\n          return result;\n        })\n      );\n    },\n    [itemEqualityRef, lastCallsRef, mapperRef, thisCallsRef]\n  );\n}\n"],"mappings":";;;;AAAA,SAASA,WAAW,EAAEC,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAEtD,OAAOC,WAAW,MAAM,uBAAuB;AAC/C,OAAOC,WAAW,MAAM,uBAAuB;AAM/C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,UAAU,CAChCC,MAA0E,EAEnC;EAAA,+EADc,CAAC,CAAC;IAAA,yBAArDC,YAAY;IAAZA,YAAY;EAEd,IAAMC,eAAe,GAAGJ,WAAW,CAACG,YAAY,CAAC;EACjD,IAAME,YAAY,GAAGP,MAAM,CAAoB,EAAE,CAAC;EAClD,IAAMQ,SAAS,GAAGN,WAAW,CAACE,MAAM,CAAC;EACrC,IAAMK,SAAmB,GAAG,EAAE;EAE9B,IAAIR,WAAW,CAACG,MAAM,CAAC,KAAKA,MAAM,EAAE;IAClCG,YAAY,CAACG,OAAO,GAAG,EAAE;EAC3B;EAEAX,SAAS,CAAC,YAAM;IACdQ,YAAY,CAACG,OAAO,GAAG,eAAcD,SAAS,CAAC;EACjD,CAAC,CAAC;EAEF,IAAME,YAAY,GAAGT,WAAW,CAACO,SAAS,CAAC;EAE3C,OAAOX,WAAW,CAChB,UAACc,KAAmB,EAAK;IACvB,IAAiBP,YAAY,GAAKC,eAAe,CAAzCI,OAAO;IACf,IAAiBN,MAAM,GAAKI,SAAS,CAA7BE,OAAO;IACf,IAAiBD,SAAS,GAAKE,YAAY,CAAnCD,OAAO;IAEf,OAAqB,eACnB,qBAAAE,KAAK,OAALA,KAAK,EAAQ,UAAAC,IAAI,EAAI;MAAA;MACnB,IAAMC,QAAQ,GAAG,sBAAAL,SAAS,OAATA,SAAS,EAAM,UAAAM,KAAK;QAAA,OAAIV,YAAY,CAACW,IAAI,CAACJ,KAAK,EAAEC,IAAI,EAAEE,KAAK,CAAC,CAAC,CAAC,CAAC;MAAA,EAAC;;MAElF;MACA,IAAID,QAAQ,EAAE;QACZ,OAAOA,QAAQ,CAAC,CAAC,CAAC;MACpB;MAEA,IAAMG,QAAQ,GAAG,iCAAAV,YAAY,CAACG,OAAO,iBAAM,UAAAK,KAAK;QAAA,OAAIV,YAAY,CAACW,IAAI,CAACJ,KAAK,EAAEC,IAAI,EAAEE,KAAK,CAAC,CAAC,CAAC,CAAC;MAAA,EAAC;MAC7F,IAAMG,MAAM,GAAGD,QAAQ,GAAGA,QAAQ,CAAC,CAAC,CAAC,GAAGb,MAAM,CAACY,IAAI,CAACJ,KAAK,EAAEC,IAAI,EAAE,CAAC,CAAC,EAAED,KAAK,CAAC;MAE3EH,SAAS,CAACU,IAAI,CAAC,CAACN,IAAI,EAAEK,MAAM,CAAC,CAAC;MAE9B,OAAOA,MAAM;IACf,CAAC,CAAC,CACH;EACH,CAAC,EACD,CAACZ,eAAe,EAAEC,YAAY,EAAEC,SAAS,EAAEG,YAAY,CAAC,CACzD;AACH"}

package/lib/types/index.d.ts

@@ -0,0 +1,2 @@
+import useMemoMap from './useMemoMap';
+export { useMemoMap };

package/lib/types/private/usePrevious.d.ts

@@ -0,0 +1 @@
+export default function usePrevious<T>(value: T): T | undefined;

package/lib/types/private/useValueRef.d.ts

@@ -0,0 +1,4 @@
+import type { RefObject } from 'react';
+export default function useValueRef<T>(value: T): RefObject<T> & {
+    current: T;
+};

package/lib/types/useMemoMap.d.ts

@@ -0,0 +1,15 @@
+type UseMemoMapOptions<T> = {
+    itemEquality?: (this: readonly T[], x: T, y: T) => boolean;
+};
+/**
+ * Creates a memoized mapping function.
+ *
+ * Unlike `React.useMemo`, the mapping function can be called multiple times in a single render loop.
+ * All calls to the mapping function will be memoized.
+ *
+ * The memoized arguments and return values will survive next render.
+ *
+ * When the mapping function change, all memoized values will be invalidated.
+ */
+export default function useMemoMap<T = unknown, R = unknown>(mapper: (this: readonly T[], item: T, index: -1, array: readonly T[]) => R, { itemEquality }?: UseMemoMapOptions<T>): (array: readonly T[]) => readonly R[];
+export {};

package/package.json

@@ -0,0 +1,63 @@
+{
+  "name": "use-memo-map",
+  "version": "0.0.0-main.18b69b6",
+  "description": "",
+  "files": [
+    "./lib/*"
+  ],
+  "exports": {
+    ".": {
+      "import": "./lib/esmodules/index.js",
+      "require": "./lib/commonjs/index.js"
+    },
+    "./useMemoMap": {
+      "import": "./lib/esmodules/useMemoMap.js",
+      "require": "./lib/commonjs/useMemoMap.js"
+    }
+  },
+  "main": "lib/index.js",
+  "typings": "lib/types/index.d.ts",
+  "scripts": {
+    "build": "npm run build:babel && npm run build:typescript",
+    "build:babel": "npm run build:babel:commonjs && npm run build:babel:esmodules",
+    "build:babel:commonjs": "babel src --config-file ./babel.commonjs.config.json --extensions .ts,.tsx --out-dir ./lib/commonjs/",
+    "build:babel:esmodules": "babel src --config-file ./babel.esmodules.config.json --extensions .ts,.tsx --out-dir ./lib/esmodules/",
+    "build:typescript": "tsc --project ./src/tsconfig.declaration.json",
+    "precommit": "eslint ./src/",
+    "test": "jest"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/compulim/use-memo-map.git"
+  },
+  "keywords": [
+    "react",
+    "react-hooks"
+  ],
+  "author": "William Wong (https://github.com/compulim)",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/compulim/use-memo-map/issues"
+  },
+  "homepage": "https://github.com/compulim/use-memo-map#readme",
+  "devDependencies": {
+    "@babel/cli": "^7.20.7",
+    "@babel/core": "^7.20.7",
+    "@babel/plugin-transform-runtime": "^7.19.6",
+    "@babel/preset-env": "^7.20.2",
+    "@babel/preset-typescript": "^7.18.6",
+    "@testing-library/react-hooks": "^8.0.1",
+    "@types/react": "^17.0.52",
+    "jest": "^29.3.1",
+    "jest-environment-jsdom": "^29.3.1",
+    "react": "^17.0.2",
+    "react-test-renderer": "^17.0.2",
+    "typescript": "^4.9.4"
+  },
+  "peerDependencies": {
+    "react": ">=16.9.0"
+  },
+  "dependencies": {
+    "@babel/runtime-corejs3": "^7.20.7"
+  }
+}