(
}
prevState.current = nextState;
return nextState;
- }, []);
+ }, [affected]);
const state = useSelector(selector);
if (typeof process === 'object' && process.env.NODE_ENV !== 'production') {
// eslint-disable-next-line react-hooks/rules-of-hooks
diff --git a/src/index.ts b/src/index.ts
index 4993bf39..97ae345e 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,4 +1,3 @@
export { createContainer } from './createContainer';
export { createTrackedSelector } from './createTrackedSelector';
-export { memo } from './memo';
export { getUntracked as getUntrackedObject } from 'proxy-compare';
diff --git a/src/memo.ts b/src/memo.ts
deleted file mode 100644
index 14068eab..00000000
--- a/src/memo.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-import { createElement, memo as reactMemo, forwardRef } from 'react';
-import { trackMemo } from 'proxy-compare';
-
-import type {
- PropsWithChildren,
- NamedExoticComponent,
- ComponentType,
- ComponentProps,
- MemoExoticComponent,
-} from 'react';
-
-export function memo>(
- Component: ComponentType
,
- propsAreEqual?: (
- prevProps: Readonly>,
- nextProps: Readonly>,
- ) => boolean,
-): NamedExoticComponent;
-
-export function memo>(
- Component: T,
- propsAreEqual?: (
- prevProps: Readonly>,
- nextProps: Readonly>,
- ) => boolean,
-): MemoExoticComponent;
-
-export function memo(Component: any, propsAreEqual?: any) {
- const WrappedComponent = forwardRef((props: any, ref: any) => {
- Object.values(props).forEach(trackMemo);
- return createElement(Component, { ...props, ref });
- });
- return reactMemo(WrappedComponent, propsAreEqual);
-}
diff --git a/website/docs/api.md b/website/docs/api.md
index 35897eb6..0c65cdb6 100644
--- a/website/docs/api.md
+++ b/website/docs/api.md
@@ -147,6 +147,9 @@ const Component = () => {
## memo
+`memo` is removed in v2. With v2, we can use `React.memo`.
+The description below only applies to v1.
+
There is a utility function exported from the library.
This should be used instead of `React.memo` if props
@@ -155,7 +158,7 @@ work correctly because a memoized component doesn't always render
when a parent component renders.
```javascript
-import { memo } from 'react-tracked';
+import { memo } from 'react-tracked'; // v1 only
const ChildComponent = memo(({ num1, str1, obj1, obj2 }) => {
// ...
diff --git a/website/docs/caveats.md b/website/docs/caveats.md
index e368d93d..a27d4d50 100644
--- a/website/docs/caveats.md
+++ b/website/docs/caveats.md
@@ -19,7 +19,9 @@ const state2 = useTrackedState();
You should use `useTrackedState` only once in a component
if you need referential equality of objects in the state.
-## An object referential change doesn't trigger re-render if an property of the object is accessed in previous render
+## An object referential change doesn't trigger re-render if an property of the object is accessed in previous render (v1 only)
+
+:warning: This caveat only applies to v1. Since v2, we don't have such limitations.
```javascript
const state = useTrackedState();
diff --git a/website/docs/tutorial-02.md b/website/docs/tutorial-02.md
index 586913cd..28c016ba 100644
--- a/website/docs/tutorial-02.md
+++ b/website/docs/tutorial-02.md
@@ -192,11 +192,8 @@ export default React.memo(TodoItem);
```
This is the TodoItem component.
-We prefer primitive props for memoized components.
-
-If you want to use object props for memoized components,
-you need to use a special [memo](../api#memo) instead of `React.memo`.
-See [example/09](https://github.com/dai-shi/react-tracked/tree/main/examples/09_reactmemo) for the usage.
+We used to prefer primitive props for memoized components with v1.
+With v2, object props are also fine.
## src/NewTodo.js
diff --git a/website/docs/tutorial-03.md b/website/docs/tutorial-03.md
index 81796804..9a3b3dc4 100644
--- a/website/docs/tutorial-03.md
+++ b/website/docs/tutorial-03.md
@@ -278,11 +278,8 @@ export default React.memo(TodoItem);
```
This is the TodoItem component.
-We prefer primitive props for memoized components.
-
-If you want to use object props for memoized components,
-you need to use a special [memo](../api#memo) instead of `React.memo`.
-See [example/09](https://github.com/dai-shi/react-tracked/tree/main/examples/09_reactmemo) for the usage.
+We used to prefer primitive props for memoized components with v1.
+With v2, object props are also fine.
## src/components/NewTodo.js