@ovineko/spa-guard-react 0.0.1-alpha-24 → 0.0.1-alpha-26
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 +85 -0
- package/package.json +2 -2
package/README.md
ADDED
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
# @ovineko/spa-guard-react
|
|
2
|
+
|
|
3
|
+
[](https://www.npmjs.com/package/@ovineko/spa-guard-react)
|
|
4
|
+
[](./LICENSE)
|
|
5
|
+
|
|
6
|
+
React hooks, components, and error boundaries for [spa-guard](../spa-guard/README.md).
|
|
7
|
+
|
|
8
|
+
## Install
|
|
9
|
+
|
|
10
|
+
```sh
|
|
11
|
+
npm install @ovineko/spa-guard-react @ovineko/spa-guard react
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
## Usage
|
|
15
|
+
|
|
16
|
+
### lazyWithRetry
|
|
17
|
+
|
|
18
|
+
Wrap `React.lazy` to automatically retry chunk load failures with configurable delays.
|
|
19
|
+
|
|
20
|
+
```tsx
|
|
21
|
+
import { Suspense } from "react";
|
|
22
|
+
import { lazyWithRetry } from "@ovineko/spa-guard-react";
|
|
23
|
+
|
|
24
|
+
const LazyHome = lazyWithRetry(() => import("./pages/Home"));
|
|
25
|
+
|
|
26
|
+
// Override retry delays for a specific route
|
|
27
|
+
const LazyCheckout = lazyWithRetry(() => import("./pages/Checkout"), {
|
|
28
|
+
retryDelays: [500, 1000, 2000, 4000],
|
|
29
|
+
});
|
|
30
|
+
|
|
31
|
+
export function App() {
|
|
32
|
+
return (
|
|
33
|
+
<Suspense fallback={<div>Loading...</div>}>
|
|
34
|
+
<LazyHome />
|
|
35
|
+
</Suspense>
|
|
36
|
+
);
|
|
37
|
+
}
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
### ErrorBoundary
|
|
41
|
+
|
|
42
|
+
Catches errors in child components and integrates with spa-guard retry state.
|
|
43
|
+
|
|
44
|
+
```tsx
|
|
45
|
+
import { ErrorBoundary } from "@ovineko/spa-guard-react/error-boundary";
|
|
46
|
+
|
|
47
|
+
export function App() {
|
|
48
|
+
return (
|
|
49
|
+
<ErrorBoundary>
|
|
50
|
+
<MyApp />
|
|
51
|
+
</ErrorBoundary>
|
|
52
|
+
);
|
|
53
|
+
}
|
|
54
|
+
```
|
|
55
|
+
|
|
56
|
+
## API
|
|
57
|
+
|
|
58
|
+
From `@ovineko/spa-guard-react`:
|
|
59
|
+
|
|
60
|
+
- `lazyWithRetry(importFn, options?)` — lazy component with automatic retry
|
|
61
|
+
- `useSpaGuardState()` — reactive hook for current spa-guard state
|
|
62
|
+
- `useSPAGuardChunkError()` — hook to detect chunk load errors
|
|
63
|
+
- `useSPAGuardEvents()` — hook to subscribe to spa-guard events
|
|
64
|
+
- `DefaultErrorFallback` — default fallback UI component
|
|
65
|
+
- `Spinner` — loading spinner component
|
|
66
|
+
- `DebugSyncErrorTrigger` — trigger sync errors for testing
|
|
67
|
+
- `ForceRetryError` — error class to force a retry
|
|
68
|
+
- `LazyRetryOptions` — options type for `lazyWithRetry`
|
|
69
|
+
- `SpaGuardState` — spa-guard state type
|
|
70
|
+
|
|
71
|
+
From `@ovineko/spa-guard-react/error-boundary`:
|
|
72
|
+
|
|
73
|
+
- `ErrorBoundary` — error boundary with spa-guard integration
|
|
74
|
+
- `ErrorBoundaryProps` — props for `ErrorBoundary`
|
|
75
|
+
- `FallbackProps` — props passed to fallback component
|
|
76
|
+
|
|
77
|
+
## Related Packages
|
|
78
|
+
|
|
79
|
+
- [@ovineko/spa-guard](../spa-guard/README.md) — core package
|
|
80
|
+
- [@ovineko/spa-guard-react-router](../react-router/README.md) — React Router integration
|
|
81
|
+
- [@ovineko/spa-guard-vite](../vite/README.md) — Vite plugin
|
|
82
|
+
|
|
83
|
+
## License
|
|
84
|
+
|
|
85
|
+
MIT
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ovineko/spa-guard-react",
|
|
3
|
-
"version": "0.0.1-alpha-
|
|
3
|
+
"version": "0.0.1-alpha-26",
|
|
4
4
|
"description": "React hooks, components, and error boundaries for spa-guard",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"spa",
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
"dist"
|
|
36
36
|
],
|
|
37
37
|
"dependencies": {
|
|
38
|
-
"@ovineko/spa-guard": "0.0.1-alpha-
|
|
38
|
+
"@ovineko/spa-guard": "0.0.1-alpha-26"
|
|
39
39
|
},
|
|
40
40
|
"peerDependencies": {
|
|
41
41
|
"react": "^19"
|