@ispb/react-lazy 0.0.5 → 0.0.7
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/README.md +131 -0
- package/dist/async.d.ts +1 -1
- package/dist/async.js +12 -4
- package/dist/async.js.map +1 -1
- package/dist/hooks.js +30 -34
- package/dist/hooks.js.map +1 -1
- package/dist/types.d.ts +1 -1
- package/package.json +2 -3
package/README.md
ADDED
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
# React Lazy
|
|
2
|
+
|
|
3
|
+
`@ispb/react-lazy` provides React hooks and components for rendering values that arrive asynchronously. It supports promises, RxJS observables, and a shared loading/fulfilled/rejected event model.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```sh
|
|
8
|
+
npm install @ispb/react-lazy
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
React 19 is a peer dependency. The observable helpers also use RxJS.
|
|
12
|
+
|
|
13
|
+
## Promises
|
|
14
|
+
|
|
15
|
+
Use `Asyncified` to load a value and render it when available. The promise factory receives an `AbortController`; pass its signal to work that supports cancellation.
|
|
16
|
+
|
|
17
|
+
```tsx
|
|
18
|
+
import { useCallback } from "react"
|
|
19
|
+
import { Asyncified } from "@ispb/react-lazy"
|
|
20
|
+
|
|
21
|
+
type User = { name: string }
|
|
22
|
+
|
|
23
|
+
export function UserView() {
|
|
24
|
+
const loadUser = useCallback((controller: AbortController) => fetch("/api/user", { signal: controller.signal }).then(response => {
|
|
25
|
+
if (!response.ok) {
|
|
26
|
+
throw new Error("Could not load user")
|
|
27
|
+
}
|
|
28
|
+
return response.json() as Promise<User>
|
|
29
|
+
}), [])
|
|
30
|
+
|
|
31
|
+
return <Asyncified<User>
|
|
32
|
+
promise={loadUser}
|
|
33
|
+
children={(user, { retry, isReloading }) => <>
|
|
34
|
+
<p>{user.name}{isReloading ? " (refreshing...)" : ""}</p>
|
|
35
|
+
<button onClick={() => retry()}>Reload</button>
|
|
36
|
+
</>}
|
|
37
|
+
overrides={{
|
|
38
|
+
onLoading: () => <p>Loading user...</p>,
|
|
39
|
+
onError: ({ reason }) => <p role="alert">{String(reason)}</p>,
|
|
40
|
+
}}
|
|
41
|
+
/>
|
|
42
|
+
}
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
The promise factory can also be supplied as `() => PromiseLike<T>` if it does not need cancellation. It should be stable between renders (for example, memoize it with `useCallback`); changing the factory starts a new request. An optional `defer: { initial }` renders an initial value immediately and starts loading after mount.
|
|
46
|
+
|
|
47
|
+
For more control, `useAsyncLazy` returns the event plus a `retry()` function:
|
|
48
|
+
|
|
49
|
+
```tsx
|
|
50
|
+
import { useCallback } from "react"
|
|
51
|
+
import { Lazy, useAsyncLazy } from "@ispb/react-lazy"
|
|
52
|
+
|
|
53
|
+
function UserPanel() {
|
|
54
|
+
const loadUser = useCallback(() => fetch("/api/user").then(response => response.json() as Promise<User>), [])
|
|
55
|
+
const event = useAsyncLazy(loadUser)
|
|
56
|
+
|
|
57
|
+
return <Lazy event={event} overrides={{
|
|
58
|
+
onLoading: () => <p>Loading...</p>,
|
|
59
|
+
onError: ({ reason }) => <p role="alert">{String(reason)}</p>,
|
|
60
|
+
}}>
|
|
61
|
+
{(user, state) => <>
|
|
62
|
+
<p>{user.name}</p>
|
|
63
|
+
<button disabled={state.isLoading} onClick={() => event.retry()}>Retry</button>
|
|
64
|
+
</>}
|
|
65
|
+
</Lazy>
|
|
66
|
+
}
|
|
67
|
+
```
|
|
68
|
+
|
|
69
|
+
## RxJS Observables
|
|
70
|
+
|
|
71
|
+
`Observing` subscribes when mounted, renders each emitted value, routes errors through the lazy error handling, and unsubscribes when the observable changes or the component unmounts.
|
|
72
|
+
|
|
73
|
+
```tsx
|
|
74
|
+
import { Observing } from "@ispb/react-lazy"
|
|
75
|
+
import { interval, map } from "rxjs"
|
|
76
|
+
|
|
77
|
+
const values = interval(1000).pipe(map(count => `Value ${count}`))
|
|
78
|
+
|
|
79
|
+
export function ValueView() {
|
|
80
|
+
return <Observing of={values}
|
|
81
|
+
overrides={{ onLoading: () => <p>Waiting for first value...</p> }}>
|
|
82
|
+
{value => <p>{value}</p>}
|
|
83
|
+
</Observing>
|
|
84
|
+
}
|
|
85
|
+
```
|
|
86
|
+
|
|
87
|
+
Use `useObservableLazy({ of })` when you need the resulting `LazyEvent<T>` in your own component, or `observing(factory)` to wrap an existing component.
|
|
88
|
+
|
|
89
|
+
## Lazy Events and Rendering
|
|
90
|
+
|
|
91
|
+
A `LazyEvent<T>` is one of:
|
|
92
|
+
|
|
93
|
+
```ts
|
|
94
|
+
{ status: "loading" }
|
|
95
|
+
{ status: "fulfilled", value: T }
|
|
96
|
+
{ status: "rejected", reason: unknown }
|
|
97
|
+
```
|
|
98
|
+
|
|
99
|
+
Pass an event to `<Lazy>`. Its children can be a node or a render function receiving the value and a `LazyState<T>`. On an initial load, `Lazy` renders `null` unless `onLoading` is provided. If a previously settled event starts loading again, the previous content remains visible and is passed to `onReloading` with `reloading: true`. Rejected events are thrown unless `onError` is provided.
|
|
100
|
+
|
|
101
|
+
Lazy options can be set on an individual component using `overrides`, or for a subtree using `LazyContext.Provider`:
|
|
102
|
+
|
|
103
|
+
```tsx
|
|
104
|
+
import { LazyContext } from "@ispb/react-lazy"
|
|
105
|
+
|
|
106
|
+
<LazyContext.Provider value={{
|
|
107
|
+
onLoading: () => <p>Loading...</p>,
|
|
108
|
+
onError: ({ message }) => <p role="alert">{message ?? "Request failed"}</p>,
|
|
109
|
+
defaultMessage: "Please wait",
|
|
110
|
+
}}>
|
|
111
|
+
{children}
|
|
112
|
+
</LazyContext.Provider>
|
|
113
|
+
```
|
|
114
|
+
|
|
115
|
+
Available options are `onLoading`, `onReloading`, `onError`, `defaultMessage`, `loadingMessage`, `reloadingMessage`, and `errorMessage`. Per-component overrides take precedence over context options.
|
|
116
|
+
|
|
117
|
+
## Hooks
|
|
118
|
+
|
|
119
|
+
- `useAsyncLazy` adapts a promise to a lazy event and exposes `retry`.
|
|
120
|
+
- `useObservableLazy` adapts an RxJS observable to a lazy event; `useObservableLazyWrapped` handles an observable that emits lazy events.
|
|
121
|
+
- `useLazyState` derives loading, reloading, fulfilled, and rejected flags from an event.
|
|
122
|
+
- `useLazyMap` maps a fulfilled value; `useLazyChain` maps it to another lazy event; `useLazyFlatten` flattens nested lazy events.
|
|
123
|
+
- `useLazyCombine` combines a record of lazy events into one event.
|
|
124
|
+
- `useLazyAsPromise` and `useLazyAsObservable` adapt a lazy event to a promise or RxJS subject.
|
|
125
|
+
- `isLoading`, `isFulfilled`, and `isRejected` are type guards for lazy events.
|
|
126
|
+
|
|
127
|
+
The package also exports `Asyncified`, `asyncified`, `Observing`, `observing`, `Lazy`, and `lazified` for component-based and higher-order-component integrations.
|
|
128
|
+
|
|
129
|
+
## License
|
|
130
|
+
|
|
131
|
+
[MIT](https://choosealicense.com/licenses/mit/)
|
package/dist/async.d.ts
CHANGED
|
@@ -11,7 +11,7 @@ export interface AsyncLazyOptions<D> {
|
|
|
11
11
|
/**
|
|
12
12
|
* A promise or a function that returns a promise. This MUST be memoized - the function will re-run every time a new value is received.
|
|
13
13
|
*/
|
|
14
|
-
readonly promise: ValueOrFactory<PromiseLike<D
|
|
14
|
+
readonly promise: ValueOrFactory<PromiseLike<D>, [AbortController]>;
|
|
15
15
|
/**
|
|
16
16
|
* Don't execute immediately.
|
|
17
17
|
*/
|
package/dist/async.js
CHANGED
|
@@ -7,8 +7,8 @@ import { useIsFirstMount } from "./internal.js";
|
|
|
7
7
|
export function useAsyncLazy(input) {
|
|
8
8
|
const options = typeof input === "function" ? { promise: input } : input;
|
|
9
9
|
const [event, setEvent] = useState(options.defer === undefined ? { status: "loading" } : { status: "fulfilled", value: options.defer.initial });
|
|
10
|
-
const run = useCallback(() => {
|
|
11
|
-
callOrGet(options.promise).then(value => {
|
|
10
|
+
const run = useCallback((controller) => {
|
|
11
|
+
callOrGet(options.promise, controller).then(value => {
|
|
12
12
|
setEvent({
|
|
13
13
|
status: "fulfilled",
|
|
14
14
|
value,
|
|
@@ -28,7 +28,11 @@ export function useAsyncLazy(input) {
|
|
|
28
28
|
status: "loading"
|
|
29
29
|
});
|
|
30
30
|
}
|
|
31
|
-
|
|
31
|
+
const controller = new AbortController();
|
|
32
|
+
run(controller);
|
|
33
|
+
return () => {
|
|
34
|
+
controller.abort();
|
|
35
|
+
};
|
|
32
36
|
}, [
|
|
33
37
|
run
|
|
34
38
|
]);
|
|
@@ -44,7 +48,11 @@ export function useAsyncLazy(input) {
|
|
|
44
48
|
status: "loading"
|
|
45
49
|
});
|
|
46
50
|
}
|
|
47
|
-
|
|
51
|
+
const controller = new AbortController();
|
|
52
|
+
run(controller);
|
|
53
|
+
return () => {
|
|
54
|
+
controller.abort();
|
|
55
|
+
};
|
|
48
56
|
}, [
|
|
49
57
|
run,
|
|
50
58
|
]);
|
package/dist/async.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"async.js","sourceRoot":"","sources":["../src/async.tsx"],"names":[],"mappings":";AACA,OAAO,EAAa,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACnE,OAAO,EAAkB,SAAS,EAAE,MAAM,kBAAkB,CAAA;AAC5D,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAA;AACtC,OAAO,EAAkB,QAAQ,EAAE,MAAM,UAAU,CAAA;AACnD,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAiC/C,MAAM,UAAU,YAAY,CAAI,KAAmD;IAC/E,MAAM,OAAO,GAAG,OAAO,KAAK,KAAK,UAAU,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,KAAK,CAAA;IACxE,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAe,OAAO,CAAC,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,OAAO,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC,CAAA;IAC7J,MAAM,GAAG,GAAG,WAAW,CAAC,
|
|
1
|
+
{"version":3,"file":"async.js","sourceRoot":"","sources":["../src/async.tsx"],"names":[],"mappings":"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"}
|
package/dist/hooks.js
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import pDefer from "p-defer";
|
|
2
2
|
import { createContext, useEffect, useMemo, useState } from "react";
|
|
3
3
|
import { Subject } from "rxjs";
|
|
4
|
-
import { useIsFirstMount } from "./internal.js";
|
|
5
4
|
export const LazyContext = createContext({});
|
|
6
5
|
export function isLoading(event) {
|
|
7
6
|
if (event.status === "loading") {
|
|
@@ -58,22 +57,14 @@ export function useLazyMap(event, map) {
|
|
|
58
57
|
]);
|
|
59
58
|
}
|
|
60
59
|
export function useObservableAsPromise(observable) {
|
|
61
|
-
const [promise, setPromise] = useState(() =>
|
|
62
|
-
const isFirstMount = useIsFirstMount();
|
|
63
|
-
useEffect(() => {
|
|
64
|
-
if (!isFirstMount) {
|
|
65
|
-
setPromise(pDefer());
|
|
66
|
-
}
|
|
67
|
-
}, [
|
|
68
|
-
observable
|
|
69
|
-
]);
|
|
60
|
+
const [promise, setPromise] = useState(new Promise(() => void 0));
|
|
70
61
|
useEffect(() => {
|
|
71
62
|
const sub = observable.subscribe({
|
|
72
63
|
next: value => {
|
|
73
|
-
|
|
64
|
+
setPromise(Promise.resolve(value));
|
|
74
65
|
},
|
|
75
66
|
error: reason => {
|
|
76
|
-
|
|
67
|
+
setPromise(Promise.reject(reason));
|
|
77
68
|
}
|
|
78
69
|
});
|
|
79
70
|
return () => {
|
|
@@ -82,7 +73,7 @@ export function useObservableAsPromise(observable) {
|
|
|
82
73
|
}, [
|
|
83
74
|
promise
|
|
84
75
|
]);
|
|
85
|
-
return promise
|
|
76
|
+
return promise;
|
|
86
77
|
}
|
|
87
78
|
export function useLazyAsPromise(event) {
|
|
88
79
|
const [promise, setPromise] = useState(() => pDefer());
|
|
@@ -115,32 +106,37 @@ export function useLazyAsObservable(event) {
|
|
|
115
106
|
]);
|
|
116
107
|
return subject;
|
|
117
108
|
}
|
|
109
|
+
//TODO memoize with a custom compare function
|
|
118
110
|
export function useLazyCombine(lazies) {
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
status: "loading",
|
|
123
|
-
};
|
|
124
|
-
}
|
|
125
|
-
else {
|
|
126
|
-
const failed = entries.map(entry => entry[1]).filter(isRejected).at(0);
|
|
127
|
-
if (failed !== undefined) {
|
|
111
|
+
return useMemo(() => {
|
|
112
|
+
const entries = Object.entries(lazies);
|
|
113
|
+
if (entries.map(entry => entry[1]).some(isLoading)) {
|
|
128
114
|
return {
|
|
129
|
-
status: "
|
|
130
|
-
reason: failed
|
|
115
|
+
status: "loading",
|
|
131
116
|
};
|
|
132
117
|
}
|
|
133
118
|
else {
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
119
|
+
const failed = entries.map(entry => entry[1]).filter(isRejected).at(0);
|
|
120
|
+
if (failed !== undefined) {
|
|
121
|
+
return {
|
|
122
|
+
status: "rejected",
|
|
123
|
+
reason: failed
|
|
124
|
+
};
|
|
125
|
+
}
|
|
126
|
+
else {
|
|
127
|
+
return {
|
|
128
|
+
status: "fulfilled",
|
|
129
|
+
value: Object.fromEntries(entries.map(([key, value]) => {
|
|
130
|
+
return [
|
|
131
|
+
key,
|
|
132
|
+
value.status === "fulfilled" ? value.value : undefined,
|
|
133
|
+
];
|
|
134
|
+
}))
|
|
135
|
+
};
|
|
136
|
+
}
|
|
143
137
|
}
|
|
144
|
-
}
|
|
138
|
+
}, [
|
|
139
|
+
lazies
|
|
140
|
+
]);
|
|
145
141
|
}
|
|
146
142
|
//# sourceMappingURL=hooks.js.map
|
package/dist/hooks.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hooks.js","sourceRoot":"","sources":["../src/hooks.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,SAAS,CAAA;AAC5B,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACnE,OAAO,EAAc,OAAO,EAAE,MAAM,MAAM,CAAA;
|
|
1
|
+
{"version":3,"file":"hooks.js","sourceRoot":"","sources":["../src/hooks.ts"],"names":[],"mappings":"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"}
|
package/dist/types.d.ts
CHANGED
|
@@ -9,7 +9,7 @@ export type LazyFulfilled<D> = {
|
|
|
9
9
|
export type LazyRejected = {
|
|
10
10
|
readonly status: "rejected";
|
|
11
11
|
readonly reason: unknown;
|
|
12
|
-
readonly retry?: (() => void) | undefined;
|
|
12
|
+
readonly retry?: (() => () => void) | undefined;
|
|
13
13
|
};
|
|
14
14
|
export type LazySettled<D> = LazyFulfilled<D> | LazyRejected;
|
|
15
15
|
export type LazyEvent<D> = LazySettled<D> | LazyLoading;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ispb/react-lazy",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.7",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -27,6 +27,5 @@
|
|
|
27
27
|
"@types/react": "^19.2.18",
|
|
28
28
|
"react": "^19.2.8",
|
|
29
29
|
"typescript": "^7.0.2"
|
|
30
|
-
}
|
|
31
|
-
"packageManager": "yarn@4.18.0"
|
|
30
|
+
}
|
|
32
31
|
}
|