From fe4587ba95e05f3b24e96ba83a28ff4240c513d3 Mon Sep 17 00:00:00 2001 From: Logan Volkers Date: Fri, 3 Nov 2023 22:16:03 +0000 Subject: [PATCH 1/2] Added bunshi as an alternative and working example --- docs/guides/component-state.mdx | 14 +++++++++++--- docs/how-tos/how-to-use-with-context.mdx | 12 ++++++++++-- 2 files changed, 21 insertions(+), 5 deletions(-) diff --git a/docs/guides/component-state.mdx b/docs/guides/component-state.mdx index db63dd9a..65e272f3 100644 --- a/docs/guides/component-state.mdx +++ b/docs/guides/component-state.mdx @@ -30,9 +30,17 @@ const MyCounter = () => { } ``` -If you are not happy with useRef usage, consider [use-constant](https://www.npmjs.com/package/use-constant) instead. -You may also create custom hooks wrapping useContext and optionally useSnapshot. - ## Codesandbox example https://codesandbox.io/s/valtio-component-ye5tbg?file=/src/App.tsx + +## Alternatives + +If you are not happy with useRef usage, consider: + * [use-constant](https://www.npmjs.com/package/use-constant) + * [bunshi](https://www.bunshi.org/recipes/valtio/) + * You may also create custom hooks wrapping useContext and optionally useSnapshot. + +### Bunshi example + +https://codesandbox.io/s/77r53c?file=/molecules.ts \ No newline at end of file diff --git a/docs/how-tos/how-to-use-with-context.mdx b/docs/how-tos/how-to-use-with-context.mdx index 1481478a..42c8effe 100644 --- a/docs/how-tos/how-to-use-with-context.mdx +++ b/docs/how-tos/how-to-use-with-context.mdx @@ -30,5 +30,13 @@ const MyCounter = () => { } ``` -- If you are not happy with `useRef` usage, consider [use-constant](https://www.npmjs.com/package/use-constant) instead. -- You can create custom hooks to `useContext` and optionally `useSnapshot`. +## Alternatives + +If you are not happy with `useRef` usage, consider: + * [use-constant](https://www.npmjs.com/package/use-constant) + * [bunshi](https://www.bunshi.org/recipes/valtio/) + * You can create custom hooks to `useContext` and optionally `useSnapshot` + +### Bunshi example + +https://codesandbox.io/s/77r53c?file=/molecules.ts \ No newline at end of file From a39759a9d37d27739d9b1597d27eea958bedba16 Mon Sep 17 00:00:00 2001 From: Logan Volkers Date: Fri, 3 Nov 2023 22:17:22 +0000 Subject: [PATCH 2/2] Prettier --- docs/guides/component-state.mdx | 9 +++++---- docs/how-tos/how-to-use-with-context.mdx | 9 +++++---- 2 files changed, 10 insertions(+), 8 deletions(-) diff --git a/docs/guides/component-state.mdx b/docs/guides/component-state.mdx index 65e272f3..b0fc5808 100644 --- a/docs/guides/component-state.mdx +++ b/docs/guides/component-state.mdx @@ -37,10 +37,11 @@ https://codesandbox.io/s/valtio-component-ye5tbg?file=/src/App.tsx ## Alternatives If you are not happy with useRef usage, consider: - * [use-constant](https://www.npmjs.com/package/use-constant) - * [bunshi](https://www.bunshi.org/recipes/valtio/) - * You may also create custom hooks wrapping useContext and optionally useSnapshot. + +- [use-constant](https://www.npmjs.com/package/use-constant) +- [bunshi](https://www.bunshi.org/recipes/valtio/) +- You may also create custom hooks wrapping useContext and optionally useSnapshot. ### Bunshi example -https://codesandbox.io/s/77r53c?file=/molecules.ts \ No newline at end of file +https://codesandbox.io/s/77r53c?file=/molecules.ts diff --git a/docs/how-tos/how-to-use-with-context.mdx b/docs/how-tos/how-to-use-with-context.mdx index 42c8effe..6e9e050d 100644 --- a/docs/how-tos/how-to-use-with-context.mdx +++ b/docs/how-tos/how-to-use-with-context.mdx @@ -33,10 +33,11 @@ const MyCounter = () => { ## Alternatives If you are not happy with `useRef` usage, consider: - * [use-constant](https://www.npmjs.com/package/use-constant) - * [bunshi](https://www.bunshi.org/recipes/valtio/) - * You can create custom hooks to `useContext` and optionally `useSnapshot` + +- [use-constant](https://www.npmjs.com/package/use-constant) +- [bunshi](https://www.bunshi.org/recipes/valtio/) +- You can create custom hooks to `useContext` and optionally `useSnapshot` ### Bunshi example -https://codesandbox.io/s/77r53c?file=/molecules.ts \ No newline at end of file +https://codesandbox.io/s/77r53c?file=/molecules.ts