From 6437d18dd3e06a87e69ed4f384110c7cc29696d1 Mon Sep 17 00:00:00 2001 From: i18u Date: Thu, 28 Dec 2023 18:00:52 +0800 Subject: [PATCH 01/44] Update README.md (#472) --- packages/react/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/README.md b/packages/react/README.md index 19b546784..ac4fe29d7 100644 --- a/packages/react/README.md +++ b/packages/react/README.md @@ -65,7 +65,7 @@ See the [Readme for the Babel plugin](../babel-plugin-signals-react/README.md) f If you can't use the Babel transform, you can directly call the `useSignals` hook to make your components reactive. ```js -import { useSignals } from "@preact/signals-react"; +import { useSignals } from "@preact/signals-react/runtime"; const count = signal(0); From 192dbd98213b40abfec4b0f2bcff1bb100995f2b Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Sat, 30 Dec 2023 00:19:33 -0600 Subject: [PATCH 02/44] Fix link to Babel transform docs (#482) --- packages/react/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/README.md b/packages/react/README.md index ac4fe29d7..e2e9a3448 100644 --- a/packages/react/README.md +++ b/packages/react/README.md @@ -58,7 +58,7 @@ function CounterValue() { } ``` -See the [Readme for the Babel plugin](../babel-plugin-signals-react/README.md) for more details about how the transform works and configuring it. +See the [Readme for the Babel plugin](../react-transform/README.md) for more details about how the transform works and configuring it. ### `useSignals` hook From b373986e92e2d406ea5dd9961aba83b0bd32ad6e Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Sun, 7 Jan 2024 18:46:06 -0600 Subject: [PATCH 03/44] docs: Add mention of `useSignalEffect` hook in integration readmes --- packages/preact/README.md | 8 ++++++-- packages/react/README.md | 8 ++++++-- 2 files changed, 12 insertions(+), 4 deletions(-) diff --git a/packages/preact/README.md b/packages/preact/README.md index 2de3cf174..6b62d16f7 100644 --- a/packages/preact/README.md +++ b/packages/preact/README.md @@ -51,15 +51,19 @@ function CounterValue() { ### Hooks -If you need to instantiate new signals inside your components, you can use the `useSignal` or `useComputed` hook. +If you need to instantiate new signals or create new side effects on signal changes inside your components, you can use the `useSignal`, `useComputed` and `useSignalEffect` hooks. ```js -import { useSignal, useComputed } from "@preact/signals"; +import { useSignal, useComputed, useSignalEffect } from "@preact/signals"; function Counter() { const count = useSignal(0); const double = useComputed(() => count.value * 2); + useSignalEffect(() => { + console.log(`Value: ${count.value}, value x 2 = ${double.value}`); + }); + return (