@cripty2001/utils 0.0.254 → 0.0.255
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/dist/Dispatcher.d.ts +7 -3
- package/dist/Dispatcher.js +18 -9
- package/dist/react-ui/loader.d.ts +5 -5
- package/dist/react-ui/loader.js +15 -16
- package/dist/react-whispr.js +2 -2
- package/package.json +1 -1
package/dist/Dispatcher.d.ts
CHANGED
|
@@ -1,21 +1,25 @@
|
|
|
1
1
|
import { Whispr } from "@cripty2001/whispr";
|
|
2
|
-
export type
|
|
2
|
+
export type DispatcherStatePayloadResponse<O> = {
|
|
3
3
|
loading: true;
|
|
4
4
|
progress: number;
|
|
5
5
|
} | ({
|
|
6
6
|
loading: false;
|
|
7
7
|
} & ({
|
|
8
8
|
ok: true;
|
|
9
|
-
data:
|
|
9
|
+
data: O;
|
|
10
10
|
} | {
|
|
11
11
|
ok: false;
|
|
12
12
|
error: Error;
|
|
13
13
|
}));
|
|
14
|
+
export type DispatcherStatePayload<I, O> = {
|
|
15
|
+
input: I;
|
|
16
|
+
output: DispatcherStatePayloadResponse<O>;
|
|
17
|
+
};
|
|
14
18
|
type DispatcherFunction<I, O> = (data: I, setProgress: (p: number) => void, signal: AbortSignal) => Promise<O>;
|
|
15
19
|
export declare class Dispatcher<I, O> {
|
|
16
20
|
private state;
|
|
17
21
|
private setState;
|
|
18
|
-
data: Whispr<DispatcherStatePayload<O>>;
|
|
22
|
+
data: Whispr<DispatcherStatePayload<I, O>>;
|
|
19
23
|
filtered: Whispr<O | null>;
|
|
20
24
|
readonly DEBOUNCE_INTERVAL: number;
|
|
21
25
|
private readonly f;
|
package/dist/Dispatcher.js
CHANGED
|
@@ -31,8 +31,11 @@ class Dispatcher {
|
|
|
31
31
|
[this.state, this.setState] = whispr_1.Whispr.create({
|
|
32
32
|
controller: new AbortController(),
|
|
33
33
|
payload: {
|
|
34
|
-
|
|
35
|
-
|
|
34
|
+
input: value.value,
|
|
35
|
+
output: {
|
|
36
|
+
loading: true,
|
|
37
|
+
progress: 0,
|
|
38
|
+
},
|
|
36
39
|
}
|
|
37
40
|
});
|
|
38
41
|
// Subscribing to input changes
|
|
@@ -47,12 +50,12 @@ class Dispatcher {
|
|
|
47
50
|
.from({ state: this.state }, ({ state }) => state.payload);
|
|
48
51
|
this.filtered = whispr_1.Whispr.from({
|
|
49
52
|
data: this.data
|
|
50
|
-
}, ({ data }) => {
|
|
51
|
-
if (
|
|
53
|
+
}, ({ data: { output: response } }) => {
|
|
54
|
+
if (response.loading)
|
|
52
55
|
return null;
|
|
53
|
-
if (!
|
|
56
|
+
if (!response.ok)
|
|
54
57
|
return null;
|
|
55
|
-
return
|
|
58
|
+
return response.data;
|
|
56
59
|
});
|
|
57
60
|
}
|
|
58
61
|
reset() {
|
|
@@ -64,8 +67,11 @@ class Dispatcher {
|
|
|
64
67
|
this.setState({
|
|
65
68
|
controller,
|
|
66
69
|
payload: {
|
|
67
|
-
|
|
68
|
-
|
|
70
|
+
input: this.value.value,
|
|
71
|
+
output: {
|
|
72
|
+
loading: true,
|
|
73
|
+
progress: 0,
|
|
74
|
+
},
|
|
69
75
|
}
|
|
70
76
|
});
|
|
71
77
|
// Creating generic state update function
|
|
@@ -74,7 +80,10 @@ class Dispatcher {
|
|
|
74
80
|
return;
|
|
75
81
|
this.setState({
|
|
76
82
|
controller: this.state.value.controller, // Keeping the effective controller, not the internal old one (even if, in practice, they should be the same, if everything worked well),
|
|
77
|
-
payload:
|
|
83
|
+
payload: {
|
|
84
|
+
input: this.value.value,
|
|
85
|
+
output: value,
|
|
86
|
+
}
|
|
78
87
|
});
|
|
79
88
|
};
|
|
80
89
|
// Returning state update function
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import type React from "react";
|
|
2
2
|
import type { Dispatcher } from "../Dispatcher";
|
|
3
|
-
export type LoaderProps<
|
|
4
|
-
data: Dispatcher<
|
|
3
|
+
export type LoaderProps<I, O> = {
|
|
4
|
+
data: Dispatcher<I, O>;
|
|
5
5
|
children: (props: {
|
|
6
|
-
data:
|
|
6
|
+
data: O;
|
|
7
7
|
}) => React.ReactNode;
|
|
8
8
|
loader?: React.ReactNode;
|
|
9
|
-
|
|
9
|
+
computeRefreshKey?: (input: I) => string;
|
|
10
10
|
};
|
|
11
|
-
export default function Loader<
|
|
11
|
+
export default function Loader<I, O>(props: LoaderProps<I, O>): React.JSX.Element;
|
package/dist/react-ui/loader.js
CHANGED
|
@@ -19,22 +19,21 @@ if (typeof document !== 'undefined') {
|
|
|
19
19
|
}
|
|
20
20
|
}
|
|
21
21
|
function Loader(props) {
|
|
22
|
-
const
|
|
23
|
-
const
|
|
24
|
-
|
|
25
|
-
|
|
22
|
+
const ck = props.computeRefreshKey ?? ((input) => JSON.stringify(input));
|
|
23
|
+
const active = (0, react_1.useRef)({
|
|
24
|
+
input: undefined,
|
|
25
|
+
output: { loading: true, progress: 0 }
|
|
26
|
+
});
|
|
27
|
+
const incoming = (0, react_whispr_1.useWhisprValue)(props.data.data);
|
|
28
|
+
if (ck(active.current.input) !== ck(incoming.input) ||
|
|
29
|
+
!incoming.output.loading) {
|
|
30
|
+
active.current = incoming;
|
|
26
31
|
}
|
|
27
|
-
|
|
28
|
-
if (props.showRefreshing)
|
|
29
|
-
return state;
|
|
30
|
-
if (state.loading && prev.current !== null)
|
|
31
|
-
return prev.current;
|
|
32
|
-
return state;
|
|
33
|
-
}, [state.loading, prev.current, props.showRefreshing]);
|
|
34
|
-
return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(Content, { data: data, children: props.children, loader: props.loader }) }));
|
|
32
|
+
return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(Content, { data: active.current, children: props.children, loader: props.loader }) }));
|
|
35
33
|
}
|
|
36
34
|
function Content({ data, children, loader }) {
|
|
37
|
-
|
|
35
|
+
const result = data.output;
|
|
36
|
+
if (result.loading)
|
|
38
37
|
return loader ?? ((0, jsx_runtime_1.jsx)("div", { style: { display: 'flex', alignItems: 'center', justifyContent: 'center', height: '100vh' }, children: (0, jsx_runtime_1.jsx)("div", { style: {
|
|
39
38
|
animation: 'spin 1s linear infinite',
|
|
40
39
|
borderRadius: '9999px',
|
|
@@ -43,7 +42,7 @@ function Content({ data, children, loader }) {
|
|
|
43
42
|
borderTop: '2px solid #111827',
|
|
44
43
|
borderBottom: '2px solid #111827'
|
|
45
44
|
} }) }));
|
|
46
|
-
if (!
|
|
47
|
-
return (0, jsx_runtime_1.jsx)("div", { style: { color: '#ef4444' }, children:
|
|
48
|
-
return children({ data:
|
|
45
|
+
if (!result.ok)
|
|
46
|
+
return (0, jsx_runtime_1.jsx)("div", { style: { color: '#ef4444' }, children: result.error.message });
|
|
47
|
+
return children({ data: result.data });
|
|
49
48
|
}
|
package/dist/react-whispr.js
CHANGED
|
@@ -295,8 +295,8 @@ function useAsync(data, debouce, interval, f) {
|
|
|
295
295
|
function useAsyncEffect(f, data, debounce = 200) {
|
|
296
296
|
const [dispatcher] = useAsync(data, debounce, null, f);
|
|
297
297
|
useOnWhispr(dispatcher.data, (data) => {
|
|
298
|
-
if (!data.loading && !data.ok) {
|
|
299
|
-
throw data.error;
|
|
298
|
+
if (!data.output.loading && !data.output.ok) {
|
|
299
|
+
throw data.output.error;
|
|
300
300
|
}
|
|
301
301
|
}, true);
|
|
302
302
|
}
|
package/package.json
CHANGED