raf-effect-atom 0.3.0 → 0.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +23 -2
- package/README.md +2 -2
- package/dist/Loader.d.mts +5 -6
- package/dist/Loader.mjs +4 -5
- package/dist/{ReactHydration.react-server.d.mts → hydration-boundary-react-server.d.mts} +1 -1
- package/dist/{ReactHydration.react-server.mjs → hydration-boundary-react-server.mjs} +2 -2
- package/dist/{ReactHydration.mjs → hydration-boundary.mjs} +1 -1
- package/dist/{index.react-server.d.mts → index-react-server.d.mts} +9 -9
- package/dist/index-react-server.mjs +8 -0
- package/dist/{index.shared.d.mts → index-shared.d.mts} +7 -7
- package/dist/index.d.mts +8 -8
- package/dist/index.mjs +5 -5
- package/dist/{ReactRouter.mjs → react-router.mjs} +1 -1
- package/dist/{RegistryProvider.mjs → registry-provider.mjs} +1 -1
- package/dist/{Rsc.d.mts → rsc.d.mts} +1 -1
- package/dist/{Rsc.mjs → rsc.mjs} +1 -1
- package/dist/{TanStackRouter.mjs → tanstack-router.mjs} +1 -1
- package/dist/{Hooks.d.mts → use-atom-result.d.mts} +65 -9
- package/dist/{Hooks.mjs → use-atom-result.mjs} +118 -17
- package/dist/{Waterfalls.d.mts → waterfalls.d.mts} +3 -4
- package/dist/{Waterfalls.mjs → waterfalls.mjs} +3 -4
- package/package.json +6 -6
- package/dist/index.react-server.mjs +0 -8
- /package/dist/{Handle.d.mts → handle.d.mts} +0 -0
- /package/dist/{ReactHydration.d.mts → hydration-boundary.d.mts} +0 -0
- /package/dist/{ReactRouter.d.mts → react-router.d.mts} +0 -0
- /package/dist/{RegistryProvider.d.mts → registry-provider.d.mts} +0 -0
- /package/dist/{TanStackRouter.d.mts → tanstack-router.d.mts} +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,14 +1,35 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## [0.3.1](https://github.com/KATT/raf-effect-atom/compare/raf-effect-atom%400.3.0...raf-effect-atom%400.3.1) (2026-10-24)
|
|
4
|
+
|
|
5
|
+
### Features
|
|
6
|
+
|
|
7
|
+
* **raf-effect-atom:** add useHandleValue, a handle read that doesn't suspend ([4b083f7](https://github.com/KATT/raf-effect-atom/commit/4b083f7dee91834cda71691f44a1498061f3cfe1))
|
|
8
|
+
|
|
9
|
+
### Code Refactoring
|
|
10
|
+
|
|
11
|
+
* name files in kebab-case, PascalCase only for Effect modules ([d76b06a](https://github.com/KATT/raf-effect-atom/commit/d76b06aef3d04d6be6c0b0e086a756234ab3f253))
|
|
12
|
+
|
|
13
|
+
### Documentation
|
|
14
|
+
|
|
15
|
+
* **raf-effect-atom:** pass a read's result to a boundary's hook in the README and JSDoc ([fd82e5c](https://github.com/KATT/raf-effect-atom/commit/fd82e5c1f92b3f99dc166140383837b11b695ca7))
|
|
16
|
+
* **raf-effect-atom:** pass the atom to a boundary's hook in the README and JSDoc ([772d349](https://github.com/KATT/raf-effect-atom/commit/772d3494954f64a5c0fc92ebfd146b5f14e16e51))
|
|
17
|
+
|
|
18
|
+
### Tests
|
|
19
|
+
|
|
20
|
+
* **raf-effect-atom:** pass a read's result to a boundary's hook ([df11247](https://github.com/KATT/raf-effect-atom/commit/df11247edab69b060c0677059ae24a4d8835c28e))
|
|
21
|
+
* **raf-effect-atom:** read through a boundary's hook with the atom ([de19b85](https://github.com/KATT/raf-effect-atom/commit/de19b8502ef41a8efbd9b50da6e00843cb38f2fd))
|
|
22
|
+
* **raf-effect-atom:** start an Atom.swr over a keyed readable that picks a seed or a live query ([697e785](https://github.com/KATT/raf-effect-atom/commit/697e78550bff0dce02903b963677828786770338))
|
|
23
|
+
|
|
3
24
|
## [0.3.0](https://github.com/KATT/raf-effect-atom/compare/raf-effect-atom%400.2.6...raf-effect-atom%400.3.0) (2026-10-23)
|
|
4
25
|
|
|
5
26
|
### ⚠ BREAKING CHANGES
|
|
6
27
|
|
|
7
|
-
|
|
28
|
+
- **raf-effect-atom:** `raf-effect-atom/next` is `raf-effect-atom/rsc`, without `dehydrate`; write `<HydrationBoundary registry={getRegistry()}>` from `raf-effect-atom` instead of `<HydrateAtoms state={await dehydrate()}>`, and import `RegistryProvider` from `raf-effect-atom`.
|
|
8
29
|
|
|
9
30
|
### Features
|
|
10
31
|
|
|
11
|
-
|
|
32
|
+
- **raf-effect-atom:** import HydrationBoundary from raf-effect-atom in server components, and the RSC verbs from raf-effect-atom/rsc ([bf7fdbc](https://github.com/KATT/raf-effect-atom/commit/bf7fdbcde2e9f785bd276a08117aefa359051b82))
|
|
12
33
|
|
|
13
34
|
## [0.2.6](https://github.com/KATT/raf-effect-atom/compare/raf-effect-atom%400.2.5...raf-effect-atom%400.2.6) (2026-10-23)
|
|
14
35
|
|
package/README.md
CHANGED
|
@@ -37,13 +37,13 @@ export async function loader(args: LoaderArgs) {
|
|
|
37
37
|
}
|
|
38
38
|
```
|
|
39
39
|
|
|
40
|
-
A component takes the handle as a prop and reads it with `useAtomResult(source, handle)`, which waits for a streamed result instead of starting the atom again, and returns typed failures. Given a handle instead of an id, it can't start a request of its own.
|
|
40
|
+
A component takes the handle as a prop and reads it with `useAtomResult(source, handle)`, which waits for a streamed result instead of starting the atom again, and returns typed failures. Given a handle instead of an id, it can't start a request of its own. An [`effect-atom-boundary`](https://github.com/KATT/raf-effect-atom/tree/main/packages/effect-atom-boundary) boundary's hook takes the result, throws the errors that boundary claims to it, and returns the rest:
|
|
41
41
|
|
|
42
42
|
```tsx
|
|
43
43
|
import { type Handle, useAtomResult } from "raf-effect-atom";
|
|
44
44
|
|
|
45
45
|
function IssueTitle(props: { readonly issue: Handle<typeof issue> }) {
|
|
46
|
-
const result =
|
|
46
|
+
const result = useIssueBoundary(useAtomResult(issue, props.issue));
|
|
47
47
|
// Success<Issue, never>: its boundaries claim every failure
|
|
48
48
|
return <h1>{result.value.title}</h1>;
|
|
49
49
|
}
|
package/dist/Loader.d.mts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ArgsOf, ErrorOf, Handle, LoadedHandle, Source, SuccessOf } from "./
|
|
1
|
+
import { ArgsOf, ErrorOf, Handle, LoadedHandle, Source, SuccessOf } from "./handle.mjs";
|
|
2
2
|
import * as Context from "effect/Context";
|
|
3
3
|
import * as Duration from "effect/Duration";
|
|
4
4
|
import * as Effect from "effect/Effect";
|
|
@@ -44,11 +44,10 @@ export declare const LeaseTTL: Context.Reference<Duration.Duration>;
|
|
|
44
44
|
* is. Takes a lease either way. The component that reads the handle
|
|
45
45
|
* suspends until the result settles. On a request registry whose async
|
|
46
46
|
* seed is still running, it waits for the seed first.
|
|
47
|
-
* - A derived atom that isn't serializable
|
|
48
|
-
* `
|
|
49
|
-
*
|
|
50
|
-
*
|
|
51
|
-
* that atom's. `ensure` and `fetch` wait for the derived atom's own
|
|
47
|
+
* - A derived atom that isn't serializable starts the first serializable
|
|
48
|
+
* atom its `initialValueTarget` chain points at, the one `useAtomResult`
|
|
49
|
+
* reads it through: the lease, the handle's key and what the server sends
|
|
50
|
+
* are that atom's. `ensure` and `fetch` wait for the derived atom's own
|
|
52
51
|
* result.
|
|
53
52
|
*
|
|
54
53
|
* **Gotchas**
|
package/dist/Loader.mjs
CHANGED
|
@@ -125,11 +125,10 @@ const rejectDefects = (result) => {
|
|
|
125
125
|
* is. Takes a lease either way. The component that reads the handle
|
|
126
126
|
* suspends until the result settles. On a request registry whose async
|
|
127
127
|
* seed is still running, it waits for the seed first.
|
|
128
|
-
* - A derived atom that isn't serializable
|
|
129
|
-
* `
|
|
130
|
-
*
|
|
131
|
-
*
|
|
132
|
-
* that atom's. `ensure` and `fetch` wait for the derived atom's own
|
|
128
|
+
* - A derived atom that isn't serializable starts the first serializable
|
|
129
|
+
* atom its `initialValueTarget` chain points at, the one `useAtomResult`
|
|
130
|
+
* reads it through: the lease, the handle's key and what the server sends
|
|
131
|
+
* are that atom's. `ensure` and `fetch` wait for the derived atom's own
|
|
133
132
|
* result.
|
|
134
133
|
*
|
|
135
134
|
* **Gotchas**
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { dehydrate } from "./Hydration.mjs";
|
|
2
2
|
import { isRequestRegistry, settled } from "./RequestRegistry.mjs";
|
|
3
|
-
import { HydrationBoundary as HydrationBoundary$1 } from "./
|
|
3
|
+
import { HydrationBoundary as HydrationBoundary$1 } from "./hydration-boundary.mjs";
|
|
4
4
|
import { jsx } from "react/jsx-runtime";
|
|
5
|
-
// src/
|
|
5
|
+
// src/hydration-boundary-react-server.tsx
|
|
6
6
|
/**
|
|
7
7
|
* Sends a server component's request registry to the client components
|
|
8
8
|
* under it.
|
|
@@ -5,7 +5,7 @@ import { isServer, requireRequestRegistry } from "./internal/registry.mjs";
|
|
|
5
5
|
import { HydrationBoundary, RegistryContext } from "@effect/atom-react";
|
|
6
6
|
import * as React from "react";
|
|
7
7
|
import { jsx } from "react/jsx-runtime";
|
|
8
|
-
// src/
|
|
8
|
+
// src/hydration-boundary.tsx
|
|
9
9
|
/**
|
|
10
10
|
* Applies a server registry's dehydrated state to the nearest
|
|
11
11
|
* `RegistryContext`, while rendering.
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import { ArgsOf, ErrorOf, Handle, HandleKey, LoadedHandle, Source, SuccessOf } from "./
|
|
1
|
+
import { ArgsOf, ErrorOf, Handle, HandleKey, LoadedHandle, Source, SuccessOf } from "./handle.mjs";
|
|
2
|
+
import { Hydration_d_exports } from "./Hydration.mjs";
|
|
2
3
|
import { Loader_d_exports } from "./Loader.mjs";
|
|
3
4
|
import { RequestRegistry_d_exports } from "./RequestRegistry.mjs";
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import
|
|
9
|
-
import "./
|
|
10
|
-
|
|
11
|
-
export { ArgsOf, ErrorOf, Handle, HandleKey, Hydration_d_exports as Hydration, HydrationBoundary, type HydrationBoundaryProps, LoadedHandle, Loader_d_exports as Loader, RegistryProvider, RequestRegistry_d_exports as RequestRegistry, Source, SuccessOf, WaterfallDetection, WaterfallMode, useAtomResult, useWaterfall };
|
|
5
|
+
import { useAtomResult, useHandleValue } from "./use-atom-result.mjs";
|
|
6
|
+
import { HydrationBoundaryProps } from "./hydration-boundary.mjs";
|
|
7
|
+
import { RegistryProvider } from "./registry-provider.mjs";
|
|
8
|
+
import { WaterfallDetection, WaterfallMode, useWaterfall } from "./waterfalls.mjs";
|
|
9
|
+
import "./index-shared.mjs";
|
|
10
|
+
import { HydrationBoundary } from "./hydration-boundary-react-server.mjs";
|
|
11
|
+
export { ArgsOf, ErrorOf, Handle, HandleKey, Hydration_d_exports as Hydration, HydrationBoundary, type HydrationBoundaryProps, LoadedHandle, Loader_d_exports as Loader, RegistryProvider, RequestRegistry_d_exports as RequestRegistry, Source, SuccessOf, WaterfallDetection, WaterfallMode, useAtomResult, useHandleValue, useWaterfall };
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { Hydration_exports } from "./Hydration.mjs";
|
|
2
|
+
import { RequestRegistry_exports } from "./RequestRegistry.mjs";
|
|
3
|
+
import { Loader_exports } from "./Loader.mjs";
|
|
4
|
+
import { useAtomResult, useHandleValue } from "./use-atom-result.mjs";
|
|
5
|
+
import { RegistryProvider } from "./registry-provider.mjs";
|
|
6
|
+
import { WaterfallDetection, useWaterfall } from "./waterfalls.mjs";
|
|
7
|
+
import { HydrationBoundary } from "./hydration-boundary-react-server.mjs";
|
|
8
|
+
export { Hydration_exports as Hydration, HydrationBoundary, Loader_exports as Loader, RegistryProvider, RequestRegistry_exports as RequestRegistry, WaterfallDetection, useAtomResult, useHandleValue, useWaterfall };
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { ArgsOf, ErrorOf, Handle, HandleKey, LoadedHandle, Source, SuccessOf } from "./
|
|
1
|
+
import { ArgsOf, ErrorOf, Handle, HandleKey, LoadedHandle, Source, SuccessOf } from "./handle.mjs";
|
|
2
|
+
import { Hydration_d_exports } from "./Hydration.mjs";
|
|
2
3
|
import { Loader_d_exports } from "./Loader.mjs";
|
|
3
4
|
import { RequestRegistry_d_exports } from "./RequestRegistry.mjs";
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
|
|
9
|
-
export { ArgsOf, ErrorOf, Handle, HandleKey, Hydration_d_exports as Hydration, type HydrationBoundaryProps, LoadedHandle, Loader_d_exports as Loader, RegistryProvider, RequestRegistry_d_exports as RequestRegistry, Source, SuccessOf, WaterfallDetection, WaterfallMode, useAtomResult, useWaterfall };
|
|
5
|
+
import { useAtomResult, useHandleValue } from "./use-atom-result.mjs";
|
|
6
|
+
import { HydrationBoundaryProps } from "./hydration-boundary.mjs";
|
|
7
|
+
import { RegistryProvider } from "./registry-provider.mjs";
|
|
8
|
+
import { WaterfallDetection, WaterfallMode, useWaterfall } from "./waterfalls.mjs";
|
|
9
|
+
export { ArgsOf, ErrorOf, Handle, HandleKey, Hydration_d_exports as Hydration, type HydrationBoundaryProps, LoadedHandle, Loader_d_exports as Loader, RegistryProvider, RequestRegistry_d_exports as RequestRegistry, Source, SuccessOf, WaterfallDetection, WaterfallMode, useAtomResult, useHandleValue, useWaterfall };
|
package/dist/index.d.mts
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { ArgsOf, ErrorOf, Handle, HandleKey, LoadedHandle, Source, SuccessOf } from "./
|
|
1
|
+
import { ArgsOf, ErrorOf, Handle, HandleKey, LoadedHandle, Source, SuccessOf } from "./handle.mjs";
|
|
2
|
+
import { Hydration_d_exports } from "./Hydration.mjs";
|
|
2
3
|
import { Loader_d_exports } from "./Loader.mjs";
|
|
3
4
|
import { RequestRegistry_d_exports } from "./RequestRegistry.mjs";
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import
|
|
9
|
-
|
|
10
|
-
export { ArgsOf, ErrorOf, Handle, HandleKey, Hydration_d_exports as Hydration, HydrationBoundary, type HydrationBoundaryProps, LoadedHandle, Loader_d_exports as Loader, RegistryProvider, RequestRegistry_d_exports as RequestRegistry, Source, SuccessOf, WaterfallDetection, WaterfallMode, useAtomResult, useWaterfall };
|
|
5
|
+
import { useAtomResult, useHandleValue } from "./use-atom-result.mjs";
|
|
6
|
+
import { HydrationBoundary, HydrationBoundaryProps } from "./hydration-boundary.mjs";
|
|
7
|
+
import { RegistryProvider } from "./registry-provider.mjs";
|
|
8
|
+
import { WaterfallDetection, WaterfallMode, useWaterfall } from "./waterfalls.mjs";
|
|
9
|
+
import "./index-shared.mjs";
|
|
10
|
+
export { ArgsOf, ErrorOf, Handle, HandleKey, Hydration_d_exports as Hydration, HydrationBoundary, type HydrationBoundaryProps, LoadedHandle, Loader_d_exports as Loader, RegistryProvider, RequestRegistry_d_exports as RequestRegistry, Source, SuccessOf, WaterfallDetection, WaterfallMode, useAtomResult, useHandleValue, useWaterfall };
|
package/dist/index.mjs
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { Hydration_exports } from "./Hydration.mjs";
|
|
2
2
|
import { RequestRegistry_exports } from "./RequestRegistry.mjs";
|
|
3
3
|
import { Loader_exports } from "./Loader.mjs";
|
|
4
|
-
import { useAtomResult } from "./
|
|
5
|
-
import { RegistryProvider } from "./
|
|
6
|
-
import { WaterfallDetection, useWaterfall } from "./
|
|
7
|
-
import { HydrationBoundary } from "./
|
|
8
|
-
export { Hydration_exports as Hydration, HydrationBoundary, Loader_exports as Loader, RegistryProvider, RequestRegistry_exports as RequestRegistry, WaterfallDetection, useAtomResult, useWaterfall };
|
|
4
|
+
import { useAtomResult, useHandleValue } from "./use-atom-result.mjs";
|
|
5
|
+
import { RegistryProvider } from "./registry-provider.mjs";
|
|
6
|
+
import { WaterfallDetection, useWaterfall } from "./waterfalls.mjs";
|
|
7
|
+
import { HydrationBoundary } from "./hydration-boundary.mjs";
|
|
8
|
+
export { Hydration_exports as Hydration, HydrationBoundary, Loader_exports as Loader, RegistryProvider, RequestRegistry_exports as RequestRegistry, WaterfallDetection, useAtomResult, useHandleValue, useWaterfall };
|
|
@@ -3,7 +3,7 @@ import { make, settled } from "./RequestRegistry.mjs";
|
|
|
3
3
|
import { make as make$1 } from "./Loader.mjs";
|
|
4
4
|
import { current } from "./internal/registry.mjs";
|
|
5
5
|
import * as Predicate from "effect/Predicate";
|
|
6
|
-
// src/
|
|
6
|
+
// src/react-router.ts
|
|
7
7
|
/**
|
|
8
8
|
* Connects the loader verbs to React Router's Framework Mode.
|
|
9
9
|
*
|
|
@@ -3,7 +3,7 @@ import { make, mount } from "./internal/registry.mjs";
|
|
|
3
3
|
import { RegistryContext } from "@effect/atom-react";
|
|
4
4
|
import * as React from "react";
|
|
5
5
|
import { jsx } from "react/jsx-runtime";
|
|
6
|
-
// src/
|
|
6
|
+
// src/registry-provider.tsx
|
|
7
7
|
/**
|
|
8
8
|
* The registry provider for apps that render the server's state through
|
|
9
9
|
* `HydrationBoundary`, such as React Server Components and React Router.
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ArgsOf, Handle, LoadedHandle, Source } from "./
|
|
1
|
+
import { ArgsOf, Handle, LoadedHandle, Source } from "./handle.mjs";
|
|
2
2
|
import { Loader } from "./Loader.mjs";
|
|
3
3
|
import { Options } from "./RequestRegistry.mjs";
|
|
4
4
|
import * as AtomRegistry from "effect/reactivity/AtomRegistry";
|
package/dist/{Rsc.mjs → rsc.mjs}
RENAMED
|
@@ -5,7 +5,7 @@ import * as Predicate from "effect/Predicate";
|
|
|
5
5
|
import { RegistryContext } from "@effect/atom-react";
|
|
6
6
|
import * as React from "react";
|
|
7
7
|
import { jsx } from "react/jsx-runtime";
|
|
8
|
-
// src/
|
|
8
|
+
// src/tanstack-router.tsx
|
|
9
9
|
/**
|
|
10
10
|
* Connects the loader verbs to TanStack Router and TanStack Start.
|
|
11
11
|
*
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import { ErrorOf, Handle, Source, SuccessOf } from "./
|
|
1
|
+
import { ErrorOf, Handle, Source, SuccessOf } from "./handle.mjs";
|
|
2
2
|
import { SettledResult } from "./Loader.mjs";
|
|
3
3
|
import * as Atom from "effect/reactivity/Atom";
|
|
4
4
|
import * as AsyncResult from "effect/reactivity/AsyncResult";
|
|
5
5
|
/**
|
|
6
6
|
* A source with the same arguments and success type as `S`, and any error:
|
|
7
|
-
* the sources whose handles `S` reads, such as the source
|
|
8
|
-
*
|
|
7
|
+
* the sources whose handles `S` reads, such as the source a derived `S`
|
|
8
|
+
* points at.
|
|
9
9
|
*/
|
|
10
10
|
type Readable<S> = S extends ((...args: infer Args) => Atom.Atom<AsyncResult.AsyncResult<infer A, infer _E>>) ? (...args: Args) => Atom.Atom<AsyncResult.AsyncResult<A, unknown>> : S extends Atom.Atom<AsyncResult.AsyncResult<infer A, infer _E>> ? Atom.Atom<AsyncResult.AsyncResult<A, unknown>> : never;
|
|
11
11
|
/**
|
|
@@ -16,8 +16,9 @@ type Readable<S> = S extends ((...args: infer Args) => Atom.Atom<AsyncResult.Asy
|
|
|
16
16
|
*
|
|
17
17
|
* Use in the component a loader, a server component or `useWaterfall` gave
|
|
18
18
|
* the handle to. The source can be the one the verb started, or one derived
|
|
19
|
-
* from it whose atoms point at its atoms with `initialValueTarget
|
|
20
|
-
* an error boundary's
|
|
19
|
+
* from it whose atoms point at its atoms with `initialValueTarget`. To send
|
|
20
|
+
* some failures to an error boundary, pass the result to the boundary's hook,
|
|
21
|
+
* such as `useIssueBoundary(useAtomResult(issue, handle))`.
|
|
21
22
|
*
|
|
22
23
|
* **Details**
|
|
23
24
|
*
|
|
@@ -38,8 +39,8 @@ type Readable<S> = S extends ((...args: infer Args) => Atom.Atom<AsyncResult.Asy
|
|
|
38
39
|
* `initialValueTarget` chain points at: that one is awaited, hydrated and
|
|
39
40
|
* released, so the derived atom doesn't request it again.
|
|
40
41
|
* - The settled result is returned, typed failures included. A defect is
|
|
41
|
-
* thrown to the error boundaries above. With no typed failures
|
|
42
|
-
* as
|
|
42
|
+
* thrown to the error boundaries above. With no typed failures, it's typed
|
|
43
|
+
* as a success.
|
|
43
44
|
* - While a failed atom refreshes, such as after a boundary's `reset`, the
|
|
44
45
|
* read suspends instead of returning the old failure again.
|
|
45
46
|
*
|
|
@@ -64,8 +65,8 @@ type Readable<S> = S extends ((...args: infer Args) => Atom.Atom<AsyncResult.Asy
|
|
|
64
65
|
* `Atom.transform`'s `initialValueTarget` option points at the end of the
|
|
65
66
|
* target's own chain, which for an AtomRpc query with `reactivityKeys` is an
|
|
66
67
|
* inner atom with no serialization key. A derived atom read here sets
|
|
67
|
-
* `initialValueTarget` to its source itself,
|
|
68
|
-
*
|
|
68
|
+
* `initialValueTarget` to its source itself, or it requests the source again
|
|
69
|
+
* after hydration.
|
|
69
70
|
*
|
|
70
71
|
* **Example**
|
|
71
72
|
*
|
|
@@ -86,4 +87,59 @@ type Readable<S> = S extends ((...args: infer Args) => Atom.Atom<AsyncResult.Asy
|
|
|
86
87
|
* @since 0.1.0
|
|
87
88
|
*/
|
|
88
89
|
export declare const useAtomResult: <S extends Source>(source: S, handle: NoInfer<Handle<Readable<S>>>) => [ErrorOf<S>] extends [never] ? AsyncResult.Success<SuccessOf<S>, never> : SettledResult<SuccessOf<S>, ErrorOf<S>>;
|
|
90
|
+
/**
|
|
91
|
+
* Reads a handle without React Suspense, through the source that made it,
|
|
92
|
+
* and returns the atom's current result as it is.
|
|
93
|
+
*
|
|
94
|
+
* **When to use**
|
|
95
|
+
*
|
|
96
|
+
* Use where a component renders every state of the read itself: its loading
|
|
97
|
+
* state, a failure that stays on the page while the atom refreshes, or a
|
|
98
|
+
* defect. Otherwise prefer `useAtomResult`, which suspends until the result
|
|
99
|
+
* settles and sends defects to the error boundaries above.
|
|
100
|
+
*
|
|
101
|
+
* **Details**
|
|
102
|
+
*
|
|
103
|
+
* - It reads the atom as `useAtomResult` does: through `hydrated`, through
|
|
104
|
+
* the serializable atom a derived source points at, and with the same
|
|
105
|
+
* development checks on the handle's key and on request waterfalls.
|
|
106
|
+
* - It returns `Initial` while the atom loads, and while a result the server
|
|
107
|
+
* was still loading streams in. It doesn't read the atom until the stream
|
|
108
|
+
* settles, so the browser doesn't request it a second time.
|
|
109
|
+
* - A failure is returned as it is, `waiting` while the atom refreshes, and
|
|
110
|
+
* so is a defect.
|
|
111
|
+
* - Once the component has subscribed to the atom, the loader's lease ends
|
|
112
|
+
* and the component keeps the atom mounted.
|
|
113
|
+
* - A handle `Loader.prefetchInBrowser` returned on the server reads as
|
|
114
|
+
* `Initial` there, without starting the atom; the browser's read starts
|
|
115
|
+
* it.
|
|
116
|
+
*
|
|
117
|
+
* **Gotchas**
|
|
118
|
+
*
|
|
119
|
+
* The server renders what the read returns, `Initial` for a result still
|
|
120
|
+
* loading, and the browser's first render has to match it: render the same
|
|
121
|
+
* loading state for every `Initial`.
|
|
122
|
+
*
|
|
123
|
+
* During server rendering, the registry must be a request registry (see
|
|
124
|
+
* `RequestRegistry.make`): in development, the hook throws without one.
|
|
125
|
+
*
|
|
126
|
+
* **Example**
|
|
127
|
+
*
|
|
128
|
+
* ```tsx
|
|
129
|
+
* import { AsyncResult } from "effect/reactivity"
|
|
130
|
+
* import { type Handle, useHandleValue } from "raf-effect-atom"
|
|
131
|
+
*
|
|
132
|
+
* function IssueTitle(props: { readonly issue: Handle<typeof issue> }) {
|
|
133
|
+
* const result = useHandleValue(issue, props.issue)
|
|
134
|
+
* return AsyncResult.isSuccess(result) ? <h1>{result.value.title}</h1> : <p>Loading…</p>
|
|
135
|
+
* }
|
|
136
|
+
* ```
|
|
137
|
+
*
|
|
138
|
+
* @see {@link useAtomResult} for a read that suspends until the result settles
|
|
139
|
+
*
|
|
140
|
+
* @stability unstable
|
|
141
|
+
* @category hooks
|
|
142
|
+
* @since 0.3.1
|
|
143
|
+
*/
|
|
144
|
+
export declare const useHandleValue: <S extends Source>(source: S, handle: NoInfer<Handle<Readable<S>>>) => AsyncResult.AsyncResult<SuccessOf<S>, ErrorOf<S>>;
|
|
89
145
|
export {};
|
|
@@ -1,24 +1,37 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { stream } from "./internal/pending.mjs";
|
|
2
|
+
import { get, stream } from "./internal/pending.mjs";
|
|
3
3
|
import { hydrated } from "./Hydration.mjs";
|
|
4
4
|
import { keyOf, release } from "./internal/leases.mjs";
|
|
5
5
|
import { atomOf, sourceOf } from "./internal/handles.mjs";
|
|
6
6
|
import { isRequestRegistry } from "./RequestRegistry.mjs";
|
|
7
7
|
import { requireRequestRegistry } from "./internal/registry.mjs";
|
|
8
8
|
import { ModeContext, check } from "./internal/waterfalls.mjs";
|
|
9
|
+
import * as Atom from "effect/reactivity/Atom";
|
|
9
10
|
import * as Predicate from "effect/Predicate";
|
|
10
11
|
import * as Cause from "effect/Cause";
|
|
11
12
|
import * as Option from "effect/Option";
|
|
12
13
|
import * as AsyncResult from "effect/reactivity/AsyncResult";
|
|
13
|
-
import { RegistryContext, useAtomSuspense } from "@effect/atom-react";
|
|
14
|
+
import { RegistryContext, useAtomSuspense, useAtomValue } from "@effect/atom-react";
|
|
14
15
|
import * as React from "react";
|
|
15
|
-
// src/
|
|
16
|
+
// src/use-atom-result.ts
|
|
16
17
|
/**
|
|
17
|
-
* The read
|
|
18
|
+
* The read hooks for atoms started by loaders and streamed from the server.
|
|
18
19
|
*
|
|
19
20
|
* @stability unstable
|
|
20
21
|
* @since 0.1.0
|
|
21
22
|
*/
|
|
23
|
+
const targetsOf = (atom, handle, hook) => {
|
|
24
|
+
const target = sourceOf(atom);
|
|
25
|
+
const started = hydrated(target);
|
|
26
|
+
const read = target === atom ? hydrated(atom) : atom;
|
|
27
|
+
const key = keyOf(started);
|
|
28
|
+
if (process.env.NODE_ENV !== "production" && handle.key !== void 0 && Predicate.isString(key) && handle.key !== key) throw new Error(`raf-effect-atom: ${hook} read the handle of ${handle.key} through a source that makes ${key}. Read a handle through the source that made it.`);
|
|
29
|
+
return {
|
|
30
|
+
key,
|
|
31
|
+
read,
|
|
32
|
+
started
|
|
33
|
+
};
|
|
34
|
+
};
|
|
22
35
|
/**
|
|
23
36
|
* Reads a handle through React Suspense, through the source that made it: a
|
|
24
37
|
* result streamed from the server, a hydrated one, or one a loader started.
|
|
@@ -27,8 +40,9 @@ import * as React from "react";
|
|
|
27
40
|
*
|
|
28
41
|
* Use in the component a loader, a server component or `useWaterfall` gave
|
|
29
42
|
* the handle to. The source can be the one the verb started, or one derived
|
|
30
|
-
* from it whose atoms point at its atoms with `initialValueTarget
|
|
31
|
-
* an error boundary's
|
|
43
|
+
* from it whose atoms point at its atoms with `initialValueTarget`. To send
|
|
44
|
+
* some failures to an error boundary, pass the result to the boundary's hook,
|
|
45
|
+
* such as `useIssueBoundary(useAtomResult(issue, handle))`.
|
|
32
46
|
*
|
|
33
47
|
* **Details**
|
|
34
48
|
*
|
|
@@ -49,8 +63,8 @@ import * as React from "react";
|
|
|
49
63
|
* `initialValueTarget` chain points at: that one is awaited, hydrated and
|
|
50
64
|
* released, so the derived atom doesn't request it again.
|
|
51
65
|
* - The settled result is returned, typed failures included. A defect is
|
|
52
|
-
* thrown to the error boundaries above. With no typed failures
|
|
53
|
-
* as
|
|
66
|
+
* thrown to the error boundaries above. With no typed failures, it's typed
|
|
67
|
+
* as a success.
|
|
54
68
|
* - While a failed atom refreshes, such as after a boundary's `reset`, the
|
|
55
69
|
* read suspends instead of returning the old failure again.
|
|
56
70
|
*
|
|
@@ -75,8 +89,8 @@ import * as React from "react";
|
|
|
75
89
|
* `Atom.transform`'s `initialValueTarget` option points at the end of the
|
|
76
90
|
* target's own chain, which for an AtomRpc query with `reactivityKeys` is an
|
|
77
91
|
* inner atom with no serialization key. A derived atom read here sets
|
|
78
|
-
* `initialValueTarget` to its source itself,
|
|
79
|
-
*
|
|
92
|
+
* `initialValueTarget` to its source itself, or it requests the source again
|
|
93
|
+
* after hydration.
|
|
80
94
|
*
|
|
81
95
|
* **Example**
|
|
82
96
|
*
|
|
@@ -101,12 +115,9 @@ const useAtomResult = (source, handle) => {
|
|
|
101
115
|
const atom = atomOf(source, handle.args);
|
|
102
116
|
requireRequestRegistry(registry, "useAtomResult");
|
|
103
117
|
if (handle.inBrowser === true && isRequestRegistry(registry)) throw new Error(`raf-effect-atom: ${String(atom)} starts in the browser (Loader.prefetchInBrowser), so the server renders the nearest Suspense boundary's fallback, and the browser renders the boundary.`);
|
|
104
|
-
const
|
|
105
|
-
const started =
|
|
106
|
-
const
|
|
107
|
-
const key = keyOf(started);
|
|
108
|
-
if (process.env.NODE_ENV !== "production" && handle.key !== void 0 && Predicate.isString(key) && handle.key !== key) throw new Error(`raf-effect-atom: useAtomResult read the handle of ${handle.key} through a source that makes ${key}. Read a handle through the source that made it.`);
|
|
109
|
-
const streamed = Predicate.isString(key) ? stream(registry, key) : void 0;
|
|
118
|
+
const targets = targetsOf(atom, handle, "useAtomResult");
|
|
119
|
+
const { read, started } = targets;
|
|
120
|
+
const streamed = Predicate.isString(targets.key) ? stream(registry, targets.key) : void 0;
|
|
110
121
|
if (streamed !== void 0) React.use(streamed);
|
|
111
122
|
if (process.env.NODE_ENV !== "production" && handle.inBrowser !== true) check(registry, started, React.use(ModeContext));
|
|
112
123
|
if (read !== started) registry.get(started);
|
|
@@ -121,4 +132,94 @@ const useAtomResult = (source, handle) => {
|
|
|
121
132
|
if (AsyncResult.isFailure(result) && Option.isNone(Cause.findErrorOption(result.cause))) throw Cause.squash(result.cause);
|
|
122
133
|
return result;
|
|
123
134
|
};
|
|
124
|
-
|
|
135
|
+
/** What a read shows while it can't read the atom yet. */
|
|
136
|
+
const loading = Atom.make(AsyncResult.initial(true));
|
|
137
|
+
/**
|
|
138
|
+
* Reads a handle without React Suspense, through the source that made it,
|
|
139
|
+
* and returns the atom's current result as it is.
|
|
140
|
+
*
|
|
141
|
+
* **When to use**
|
|
142
|
+
*
|
|
143
|
+
* Use where a component renders every state of the read itself: its loading
|
|
144
|
+
* state, a failure that stays on the page while the atom refreshes, or a
|
|
145
|
+
* defect. Otherwise prefer `useAtomResult`, which suspends until the result
|
|
146
|
+
* settles and sends defects to the error boundaries above.
|
|
147
|
+
*
|
|
148
|
+
* **Details**
|
|
149
|
+
*
|
|
150
|
+
* - It reads the atom as `useAtomResult` does: through `hydrated`, through
|
|
151
|
+
* the serializable atom a derived source points at, and with the same
|
|
152
|
+
* development checks on the handle's key and on request waterfalls.
|
|
153
|
+
* - It returns `Initial` while the atom loads, and while a result the server
|
|
154
|
+
* was still loading streams in. It doesn't read the atom until the stream
|
|
155
|
+
* settles, so the browser doesn't request it a second time.
|
|
156
|
+
* - A failure is returned as it is, `waiting` while the atom refreshes, and
|
|
157
|
+
* so is a defect.
|
|
158
|
+
* - Once the component has subscribed to the atom, the loader's lease ends
|
|
159
|
+
* and the component keeps the atom mounted.
|
|
160
|
+
* - A handle `Loader.prefetchInBrowser` returned on the server reads as
|
|
161
|
+
* `Initial` there, without starting the atom; the browser's read starts
|
|
162
|
+
* it.
|
|
163
|
+
*
|
|
164
|
+
* **Gotchas**
|
|
165
|
+
*
|
|
166
|
+
* The server renders what the read returns, `Initial` for a result still
|
|
167
|
+
* loading, and the browser's first render has to match it: render the same
|
|
168
|
+
* loading state for every `Initial`.
|
|
169
|
+
*
|
|
170
|
+
* During server rendering, the registry must be a request registry (see
|
|
171
|
+
* `RequestRegistry.make`): in development, the hook throws without one.
|
|
172
|
+
*
|
|
173
|
+
* **Example**
|
|
174
|
+
*
|
|
175
|
+
* ```tsx
|
|
176
|
+
* import { AsyncResult } from "effect/reactivity"
|
|
177
|
+
* import { type Handle, useHandleValue } from "raf-effect-atom"
|
|
178
|
+
*
|
|
179
|
+
* function IssueTitle(props: { readonly issue: Handle<typeof issue> }) {
|
|
180
|
+
* const result = useHandleValue(issue, props.issue)
|
|
181
|
+
* return AsyncResult.isSuccess(result) ? <h1>{result.value.title}</h1> : <p>Loading…</p>
|
|
182
|
+
* }
|
|
183
|
+
* ```
|
|
184
|
+
*
|
|
185
|
+
* @see {@link useAtomResult} for a read that suspends until the result settles
|
|
186
|
+
*
|
|
187
|
+
* @stability unstable
|
|
188
|
+
* @category hooks
|
|
189
|
+
* @since 0.3.1
|
|
190
|
+
*/
|
|
191
|
+
const useHandleValue = (source, handle) => {
|
|
192
|
+
const registry = React.useContext(RegistryContext);
|
|
193
|
+
const atom = atomOf(source, handle.args);
|
|
194
|
+
requireRequestRegistry(registry, "useHandleValue");
|
|
195
|
+
const targets = targetsOf(atom, handle, "useHandleValue");
|
|
196
|
+
const { started } = targets;
|
|
197
|
+
const streamed = Predicate.isString(targets.key) ? get(registry, targets.key) : void 0;
|
|
198
|
+
const [, settled] = React.useReducer((count) => count + 1, 0);
|
|
199
|
+
React.useEffect(() => {
|
|
200
|
+
if (streamed === void 0) return;
|
|
201
|
+
let active = true;
|
|
202
|
+
const rerender = () => {
|
|
203
|
+
if (active) settled();
|
|
204
|
+
};
|
|
205
|
+
streamed.then(rerender, rerender);
|
|
206
|
+
return () => {
|
|
207
|
+
active = false;
|
|
208
|
+
};
|
|
209
|
+
}, [streamed]);
|
|
210
|
+
const waiting = streamed !== void 0 || handle.inBrowser === true && isRequestRegistry(registry);
|
|
211
|
+
if (!waiting) {
|
|
212
|
+
if (process.env.NODE_ENV !== "production" && handle.inBrowser !== true) check(registry, started, React.use(ModeContext));
|
|
213
|
+
if (targets.read !== started) registry.get(started);
|
|
214
|
+
}
|
|
215
|
+
const result = useAtomValue(waiting ? loading : targets.read);
|
|
216
|
+
React.useEffect(() => {
|
|
217
|
+
if (!waiting) release(registry, started);
|
|
218
|
+
}, [
|
|
219
|
+
registry,
|
|
220
|
+
started,
|
|
221
|
+
waiting
|
|
222
|
+
]);
|
|
223
|
+
return result;
|
|
224
|
+
};
|
|
225
|
+
export { useAtomResult, useHandleValue };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ArgsOf, Handle, Source } from "./
|
|
1
|
+
import { ArgsOf, Handle, Source } from "./handle.mjs";
|
|
2
2
|
import { Mode } from "./internal/waterfalls.mjs";
|
|
3
3
|
import * as React from "react";
|
|
4
4
|
/**
|
|
@@ -72,9 +72,8 @@ export declare const WaterfallDetection: (props: {
|
|
|
72
72
|
* - `useAtomResult` doesn't report an atom started this way.
|
|
73
73
|
* - The handle is a prefetched one: its reader suspends until the result
|
|
74
74
|
* settles, as for a handle from a loader's `prefetch`.
|
|
75
|
-
* - A derived source
|
|
76
|
-
*
|
|
77
|
-
* `Loader.prefetch` does.
|
|
75
|
+
* - A derived source starts the serializable atom its `initialValueTarget`
|
|
76
|
+
* chain points at, as `Loader.prefetch` does.
|
|
78
77
|
*
|
|
79
78
|
* **Example**
|
|
80
79
|
*
|
|
@@ -11,7 +11,7 @@ import * as AtomRegistry from "effect/reactivity/AtomRegistry";
|
|
|
11
11
|
import { RegistryContext } from "@effect/atom-react";
|
|
12
12
|
import * as React from "react";
|
|
13
13
|
import { jsx } from "react/jsx-runtime";
|
|
14
|
-
// src/
|
|
14
|
+
// src/waterfalls.tsx
|
|
15
15
|
/**
|
|
16
16
|
* Request waterfalls: the escape hatch for atoms only a render can start,
|
|
17
17
|
* and the development check that finds the others.
|
|
@@ -76,9 +76,8 @@ const WaterfallDetection = (props) => process.env.NODE_ENV === "production" ? pr
|
|
|
76
76
|
* - `useAtomResult` doesn't report an atom started this way.
|
|
77
77
|
* - The handle is a prefetched one: its reader suspends until the result
|
|
78
78
|
* settles, as for a handle from a loader's `prefetch`.
|
|
79
|
-
* - A derived source
|
|
80
|
-
*
|
|
81
|
-
* `Loader.prefetch` does.
|
|
79
|
+
* - A derived source starts the serializable atom its `initialValueTarget`
|
|
80
|
+
* chain points at, as `Loader.prefetch` does.
|
|
82
81
|
*
|
|
83
82
|
* **Example**
|
|
84
83
|
*
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "raf-effect-atom",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.1",
|
|
4
4
|
"description": "Render-as-you-fetch for Effect Atom: start atoms from route loaders and stream them into the browser, typed failures intact",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"effect",
|
|
@@ -34,12 +34,12 @@
|
|
|
34
34
|
"sideEffects": false,
|
|
35
35
|
"exports": {
|
|
36
36
|
".": {
|
|
37
|
-
"react-server": "./dist/index
|
|
37
|
+
"react-server": "./dist/index-react-server.mjs",
|
|
38
38
|
"default": "./dist/index.mjs"
|
|
39
39
|
},
|
|
40
|
-
"./react-router": "./dist/
|
|
41
|
-
"./rsc": "./dist/
|
|
42
|
-
"./tanstack-router": "./dist/
|
|
40
|
+
"./react-router": "./dist/react-router.mjs",
|
|
41
|
+
"./rsc": "./dist/rsc.mjs",
|
|
42
|
+
"./tanstack-router": "./dist/tanstack-router.mjs"
|
|
43
43
|
},
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@effect/atom-react": "^4.0.6",
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
"@types/react-dom": "19.3.0",
|
|
62
62
|
"@vitest/coverage-v8": "5.0.5",
|
|
63
63
|
"effect": "4.0.6",
|
|
64
|
-
"effect-atom-boundary": "0.
|
|
64
|
+
"effect-atom-boundary": "0.3.0",
|
|
65
65
|
"happy-dom": "21.0.4",
|
|
66
66
|
"react": "19.3.1",
|
|
67
67
|
"react-dom": "19.3.1",
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import { Hydration_exports } from "./Hydration.mjs";
|
|
2
|
-
import { RequestRegistry_exports } from "./RequestRegistry.mjs";
|
|
3
|
-
import { Loader_exports } from "./Loader.mjs";
|
|
4
|
-
import { useAtomResult } from "./Hooks.mjs";
|
|
5
|
-
import { RegistryProvider } from "./RegistryProvider.mjs";
|
|
6
|
-
import { WaterfallDetection, useWaterfall } from "./Waterfalls.mjs";
|
|
7
|
-
import { HydrationBoundary } from "./ReactHydration.react-server.mjs";
|
|
8
|
-
export { Hydration_exports as Hydration, HydrationBoundary, Loader_exports as Loader, RegistryProvider, RequestRegistry_exports as RequestRegistry, WaterfallDetection, useAtomResult, useWaterfall };
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|