@hairy/react-lib 1.14.0 → 1.15.0
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/index.cjs +97 -10
- package/dist/index.d.ts +40 -15
- package/dist/index.global.js +96 -9
- package/dist/index.js +98 -12
- package/package.json +2 -2
package/dist/index.cjs
CHANGED
|
@@ -62,7 +62,7 @@ __export(index_exports, {
|
|
|
62
62
|
Unless: () => Unless,
|
|
63
63
|
cls: () => cls,
|
|
64
64
|
defineAsyncStore: () => defineAsyncStore,
|
|
65
|
-
|
|
65
|
+
defineAsyncStoreLayered: () => defineAsyncStoreLayered,
|
|
66
66
|
defineStore: () => defineStore,
|
|
67
67
|
proxyWithPersistant: () => proxyWithPersistant,
|
|
68
68
|
useAsyncCallback: () => useAsyncCallback,
|
|
@@ -72,6 +72,7 @@ __export(index_exports, {
|
|
|
72
72
|
useFetchRequestIntercept: () => useFetchRequestIntercept,
|
|
73
73
|
useFetchResponseIntercept: () => useFetchResponseIntercept,
|
|
74
74
|
useMounted: () => useMounted,
|
|
75
|
+
useStatus: () => useStatus,
|
|
75
76
|
useStore: () => useStore,
|
|
76
77
|
useWatch: () => useWatch,
|
|
77
78
|
useWhenever: () => useWhenever,
|
|
@@ -422,6 +423,7 @@ function useWhenever(source, cb, options) {
|
|
|
422
423
|
}
|
|
423
424
|
|
|
424
425
|
// src/storage/defineStore.ts
|
|
426
|
+
var import_react15 = require("react");
|
|
425
427
|
var import_valtio2 = require("valtio");
|
|
426
428
|
|
|
427
429
|
// ../util-core/src/util/json.ts
|
|
@@ -458,11 +460,19 @@ function proxyWithPersistant(keyOrOptions, initialObject) {
|
|
|
458
460
|
// src/storage/defineStore.ts
|
|
459
461
|
function defineStore(store, options = {}) {
|
|
460
462
|
const state = typeof store.state === "function" ? store.state() : store.state;
|
|
463
|
+
const getters = store.getters || {};
|
|
461
464
|
const actions = store.actions || {};
|
|
462
|
-
const
|
|
465
|
+
const status = {};
|
|
466
|
+
status.finished = false;
|
|
467
|
+
status.loading = false;
|
|
468
|
+
status.error = null;
|
|
469
|
+
const $state = options.persist ? proxyWithPersistant(options.persist, state) : (0, import_valtio2.proxy)(state);
|
|
470
|
+
const $status = (0, import_valtio2.proxy)(status);
|
|
463
471
|
const $actions = {};
|
|
464
|
-
|
|
465
|
-
|
|
472
|
+
const $getters = {};
|
|
473
|
+
markActions($state, actions, $actions);
|
|
474
|
+
markGetters(state, $state, getters, $getters);
|
|
475
|
+
markStatus($actions, $status);
|
|
466
476
|
function $subscribe(listener) {
|
|
467
477
|
return (0, import_valtio2.subscribe)($state, () => listener($state));
|
|
468
478
|
}
|
|
@@ -472,14 +482,84 @@ function defineStore(store, options = {}) {
|
|
|
472
482
|
else
|
|
473
483
|
Object.assign($state, patch);
|
|
474
484
|
}
|
|
485
|
+
function $signal(fn) {
|
|
486
|
+
return (0, import_react15.createElement)(() => fn((0, import_valtio2.useSnapshot)($state)));
|
|
487
|
+
}
|
|
488
|
+
$signal.status = function(fn) {
|
|
489
|
+
return (0, import_react15.createElement)(() => fn((0, import_valtio2.useSnapshot)($status)));
|
|
490
|
+
};
|
|
475
491
|
return {
|
|
476
492
|
$subscribe,
|
|
477
493
|
$patch,
|
|
478
494
|
$state,
|
|
495
|
+
$status,
|
|
479
496
|
$actions,
|
|
480
|
-
|
|
497
|
+
$getters,
|
|
498
|
+
$signal,
|
|
499
|
+
...$actions,
|
|
500
|
+
...$state
|
|
481
501
|
};
|
|
482
502
|
}
|
|
503
|
+
function markActions($state, actions, $actions) {
|
|
504
|
+
for (const key in actions)
|
|
505
|
+
$actions[key] = actions[key].bind($state);
|
|
506
|
+
}
|
|
507
|
+
function markGetters(state, $state, getters, $getters) {
|
|
508
|
+
for (const key in getters) {
|
|
509
|
+
Object.defineProperty(state, key, {
|
|
510
|
+
get: () => getters[key].call($state),
|
|
511
|
+
enumerable: true
|
|
512
|
+
});
|
|
513
|
+
Object.defineProperty($getters, key, {
|
|
514
|
+
get: () => state[key],
|
|
515
|
+
enumerable: true
|
|
516
|
+
});
|
|
517
|
+
}
|
|
518
|
+
}
|
|
519
|
+
function markStatus($actions, $status) {
|
|
520
|
+
Object.defineProperty($status, "loading", {
|
|
521
|
+
get: () => Object.keys($actions).some((key) => $status[key].loading),
|
|
522
|
+
enumerable: true
|
|
523
|
+
});
|
|
524
|
+
Object.defineProperty($status, "finished", {
|
|
525
|
+
get: () => Object.keys($actions).every((key) => $status[key].finished),
|
|
526
|
+
enumerable: true
|
|
527
|
+
});
|
|
528
|
+
Object.defineProperty($status, "error", {
|
|
529
|
+
get: () => Object.keys($actions).find((key) => $status[key].error),
|
|
530
|
+
enumerable: true
|
|
531
|
+
});
|
|
532
|
+
for (const key in $actions) {
|
|
533
|
+
let subscribe4 = function() {
|
|
534
|
+
if (subscribers === 0)
|
|
535
|
+
$status[key].loading = true;
|
|
536
|
+
subscribers++;
|
|
537
|
+
}, done2 = function() {
|
|
538
|
+
subscribers--;
|
|
539
|
+
if (!subscribers)
|
|
540
|
+
$status[key].loading = false;
|
|
541
|
+
};
|
|
542
|
+
var subscribe3 = subscribe4, done = done2;
|
|
543
|
+
const action = $actions[key];
|
|
544
|
+
$status[key] = { finished: false, loading: false, error: null };
|
|
545
|
+
let subscribers = 0;
|
|
546
|
+
$actions[key] = function(...args) {
|
|
547
|
+
subscribe4();
|
|
548
|
+
try {
|
|
549
|
+
const result = action(...args);
|
|
550
|
+
if (result instanceof Promise) {
|
|
551
|
+
result.then(() => $status[key].finished = true).catch((error) => $status[key].error = error).finally(done2);
|
|
552
|
+
} else {
|
|
553
|
+
$status[key].finished = true;
|
|
554
|
+
done2();
|
|
555
|
+
}
|
|
556
|
+
} catch (error) {
|
|
557
|
+
$status[key].error = error;
|
|
558
|
+
done2();
|
|
559
|
+
}
|
|
560
|
+
};
|
|
561
|
+
}
|
|
562
|
+
}
|
|
483
563
|
|
|
484
564
|
// src/storage/useStore.ts
|
|
485
565
|
var import_valtio3 = require("valtio");
|
|
@@ -498,7 +578,7 @@ function defineAsyncStore(options) {
|
|
|
498
578
|
error: void 0
|
|
499
579
|
})
|
|
500
580
|
},
|
|
501
|
-
{
|
|
581
|
+
{ persist: options.persist ? { id: options.persist, pick: ["value"] } : void 0 }
|
|
502
582
|
);
|
|
503
583
|
function use() {
|
|
504
584
|
const fn = options.setup();
|
|
@@ -522,14 +602,20 @@ function defineAsyncStore(options) {
|
|
|
522
602
|
return use;
|
|
523
603
|
}
|
|
524
604
|
|
|
525
|
-
// src/storage/
|
|
526
|
-
function
|
|
605
|
+
// src/storage/defineAsyncStoreLayered.ts
|
|
606
|
+
function defineAsyncStoreLayered(fn, options = {}) {
|
|
527
607
|
return defineAsyncStore({
|
|
528
608
|
setup: () => fn,
|
|
529
609
|
initial: options.initial,
|
|
530
|
-
|
|
610
|
+
persist: options.persist
|
|
531
611
|
});
|
|
532
612
|
}
|
|
613
|
+
|
|
614
|
+
// src/storage/useStatus.tsx
|
|
615
|
+
var import_valtio4 = require("valtio");
|
|
616
|
+
function useStatus(store) {
|
|
617
|
+
return (0, import_valtio4.useSnapshot)(store.$status);
|
|
618
|
+
}
|
|
533
619
|
// Annotate the CommonJS export names for ESM import in node:
|
|
534
620
|
0 && (module.exports = {
|
|
535
621
|
Case,
|
|
@@ -543,7 +629,7 @@ function defineAsyncStorePlain(fn, options = {}) {
|
|
|
543
629
|
Unless,
|
|
544
630
|
cls,
|
|
545
631
|
defineAsyncStore,
|
|
546
|
-
|
|
632
|
+
defineAsyncStoreLayered,
|
|
547
633
|
defineStore,
|
|
548
634
|
proxyWithPersistant,
|
|
549
635
|
useAsyncCallback,
|
|
@@ -553,6 +639,7 @@ function defineAsyncStorePlain(fn, options = {}) {
|
|
|
553
639
|
useFetchRequestIntercept,
|
|
554
640
|
useFetchResponseIntercept,
|
|
555
641
|
useMounted,
|
|
642
|
+
useStatus,
|
|
556
643
|
useStore,
|
|
557
644
|
useWatch,
|
|
558
645
|
useWhenever,
|
package/dist/index.d.ts
CHANGED
|
@@ -150,9 +150,10 @@ declare function useWhenever<T>(source: T, cb: WatchCallback<Exclude<T, null | u
|
|
|
150
150
|
interface AsyncStoreOptions<T extends FunctionReturningPromise> {
|
|
151
151
|
initial?: ReturnType<T> extends Promise<infer U> ? U : undefined;
|
|
152
152
|
setup: () => T;
|
|
153
|
-
|
|
153
|
+
persist?: string;
|
|
154
154
|
}
|
|
155
155
|
declare function defineAsyncStore<T extends FunctionReturningPromise>(options: AsyncStoreOptions<T>): () => readonly [{
|
|
156
|
+
readonly [x: string]: any;
|
|
156
157
|
readonly promise: {
|
|
157
158
|
readonly then: <TResult1 = any, TResult2 = never>(onfulfilled?: ((value: any) => TResult1 | PromiseLike<TResult1>) | null | undefined, onrejected?: ((reason: any) => TResult2 | PromiseLike<TResult2>) | null | undefined) => Promise<TResult1 | TResult2>;
|
|
158
159
|
readonly catch: <TResult = never>(onrejected?: ((reason: any) => TResult | PromiseLike<TResult>) | null | undefined) => Promise<any>;
|
|
@@ -164,9 +165,10 @@ declare function defineAsyncStore<T extends FunctionReturningPromise>(options: A
|
|
|
164
165
|
readonly error: Error | undefined;
|
|
165
166
|
}, T, (value?: (ReturnType<T> extends Promise<infer U_1> ? U_1 : undefined)) => void];
|
|
166
167
|
|
|
167
|
-
interface
|
|
168
|
+
interface AsyncStoreLayeredOptions<T extends FunctionReturningPromise> extends Omit<AsyncStoreOptions<T>, 'setup'> {
|
|
168
169
|
}
|
|
169
|
-
declare function
|
|
170
|
+
declare function defineAsyncStoreLayered<T extends FunctionReturningPromise>(fn: T, options?: AsyncStoreLayeredOptions<T>): () => readonly [{
|
|
171
|
+
readonly [x: string]: any;
|
|
170
172
|
readonly promise: {
|
|
171
173
|
readonly then: <TResult1 = any, TResult2 = never>(onfulfilled?: ((value: any) => TResult1 | PromiseLike<TResult1>) | null | undefined, onrejected?: ((reason: any) => TResult2 | PromiseLike<TResult2>) | null | undefined) => Promise<TResult1 | TResult2>;
|
|
172
174
|
readonly catch: <TResult = never>(onrejected?: ((reason: any) => TResult | PromiseLike<TResult>) | null | undefined) => Promise<any>;
|
|
@@ -186,27 +188,50 @@ interface PersistantOptions {
|
|
|
186
188
|
declare function proxyWithPersistant<T extends object>(key: string, initialObject?: T, options?: Omit<PersistantOptions, 'key'>): T;
|
|
187
189
|
declare function proxyWithPersistant<T extends object>(options: PersistantOptions, initialObject?: T): T;
|
|
188
190
|
|
|
189
|
-
|
|
191
|
+
type Actions<S> = Record<string, (this: S, ...args: any) => any>;
|
|
192
|
+
type Getters<S> = Record<string, (this: S) => any>;
|
|
193
|
+
type ActionsOmitThisParameter<A extends Actions<any>> = {
|
|
194
|
+
[K in keyof A]: (...args: Parameters<A[K]>) => ReturnType<A[K]>;
|
|
195
|
+
};
|
|
196
|
+
interface Status {
|
|
197
|
+
finished: boolean;
|
|
198
|
+
loading: boolean;
|
|
199
|
+
error: Error | null;
|
|
200
|
+
}
|
|
201
|
+
type ActionsStatus<A extends Actions<any>> = Status & {
|
|
202
|
+
[K in keyof A]: Status;
|
|
203
|
+
};
|
|
204
|
+
type GettersReturnType<G extends Getters<any>> = {
|
|
205
|
+
[K in keyof G]: ReturnType<G[K]>;
|
|
206
|
+
};
|
|
207
|
+
interface StoreDefine<S extends object, A extends Actions<S>, G extends Getters<S>> {
|
|
190
208
|
state: (() => S) | S;
|
|
191
209
|
actions?: A;
|
|
210
|
+
getters?: G;
|
|
192
211
|
}
|
|
193
212
|
interface StoreOptions {
|
|
194
|
-
|
|
213
|
+
persist?: string | PersistantOptions;
|
|
195
214
|
}
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
}
|
|
200
|
-
type Store<S, A extends Actions<S>> = {
|
|
215
|
+
interface Signal<S, A extends Actions<S>, G extends Getters<S>> {
|
|
216
|
+
<T>(fn: (state: S & GettersReturnType<G>) => T): T;
|
|
217
|
+
status: <T>(fn: (status: ActionsStatus<A>) => T) => T;
|
|
218
|
+
}
|
|
219
|
+
type Store<S, A extends Actions<S>, G extends Getters<S>> = {
|
|
201
220
|
$subscribe: (listener: (state: S) => void) => () => void;
|
|
202
221
|
$patch: (patch: Partial<S> | ((state: S) => void)) => void;
|
|
203
|
-
$state: S
|
|
222
|
+
$state: S & GettersReturnType<G>;
|
|
204
223
|
$actions: ActionsOmitThisParameter<A>;
|
|
205
|
-
|
|
206
|
-
|
|
224
|
+
$getters: GettersReturnType<G>;
|
|
225
|
+
$status: ActionsStatus<A>;
|
|
226
|
+
$signal: Signal<S, A, G>;
|
|
227
|
+
} & ActionsOmitThisParameter<A> & GettersReturnType<G>;
|
|
228
|
+
|
|
229
|
+
declare function defineStore<S extends object, A extends Actions<S>, G extends Getters<S>>(store: StoreDefine<S, A, G>, options?: StoreOptions): Store<S, A, G>;
|
|
230
|
+
|
|
231
|
+
declare function useStatus<S extends object, A extends Actions<S>, G extends Getters<S>>(store: Store<S, A, G>): valtio.Snapshot<ActionsStatus<A>>;
|
|
207
232
|
|
|
208
|
-
declare function useStore<S extends object, A extends Actions<S>>(store: Store<S, A>): valtio.Snapshot<S
|
|
233
|
+
declare function useStore<S extends object, A extends Actions<S>, G extends Getters<S>>(store: Store<S, A, G>): valtio.Snapshot<S & GettersReturnType<G>>;
|
|
209
234
|
|
|
210
235
|
type PropsWithDetailedHTML<T = HTMLDivElement> = DetailedHTMLProps<HTMLAttributes<T>, T>;
|
|
211
236
|
|
|
212
|
-
export { type
|
|
237
|
+
export { type Argument, type ArgumentArray, type AsyncStoreLayeredOptions, type AsyncStoreOptions, Case, type CaseProps, Default, type DefaultProps, Else, type ElseProps, type EventBusListener, type FetchRequestInterceptCallback, type FetchResponseInterceptCallback, If, type IfProps, type InjectComponent, Injector, type InjectorProps, type Mapping, type PersistantOptions, type PropsWithDetailedHTML, type ReadonlyArgumentArray, type StateFromFunctionReturningPromise, Switch, type SwitchProps, Then, type ThenProps, Trans, type TransProps, Unless, type UnlessProps, type UseAsyncStateOptions, type Value, type WatchCallback, type WatchOptions, type WrapperProps, type WrapperTag, cls, defineAsyncStore, defineAsyncStoreLayered, defineStore, proxyWithPersistant, useAsyncCallback, useAsyncState, useDebounce, useEventBus, useFetchRequestIntercept, useFetchResponseIntercept, useMounted, useStatus, useStore, useWatch, useWhenever, wrapper };
|
package/dist/index.global.js
CHANGED
|
@@ -105,7 +105,7 @@ var LibReact = (() => {
|
|
|
105
105
|
Unless: () => Unless,
|
|
106
106
|
cls: () => cls,
|
|
107
107
|
defineAsyncStore: () => defineAsyncStore,
|
|
108
|
-
|
|
108
|
+
defineAsyncStoreLayered: () => defineAsyncStoreLayered,
|
|
109
109
|
defineStore: () => defineStore,
|
|
110
110
|
proxyWithPersistant: () => proxyWithPersistant,
|
|
111
111
|
useAsyncCallback: () => useAsyncCallback,
|
|
@@ -115,6 +115,7 @@ var LibReact = (() => {
|
|
|
115
115
|
useFetchRequestIntercept: () => useFetchRequestIntercept,
|
|
116
116
|
useFetchResponseIntercept: () => useFetchResponseIntercept,
|
|
117
117
|
useMounted: () => useMounted,
|
|
118
|
+
useStatus: () => useStatus,
|
|
118
119
|
useStore: () => useStore,
|
|
119
120
|
useWatch: () => useWatch,
|
|
120
121
|
useWhenever: () => useWhenever,
|
|
@@ -541,6 +542,9 @@ var LibReact = (() => {
|
|
|
541
542
|
useWatch(source, () => source && cb(source), options);
|
|
542
543
|
}
|
|
543
544
|
|
|
545
|
+
// src/storage/defineStore.ts
|
|
546
|
+
var import_react16 = __toESM(require_react(), 1);
|
|
547
|
+
|
|
544
548
|
// ../../node_modules/.pnpm/proxy-compare@3.0.1/node_modules/proxy-compare/dist/index.js
|
|
545
549
|
var TRACK_MEMO_SYMBOL = Symbol();
|
|
546
550
|
var GET_ORIGINAL_SYMBOL = Symbol();
|
|
@@ -1067,11 +1071,19 @@ var LibReact = (() => {
|
|
|
1067
1071
|
// src/storage/defineStore.ts
|
|
1068
1072
|
function defineStore(store, options = {}) {
|
|
1069
1073
|
const state = typeof store.state === "function" ? store.state() : store.state;
|
|
1074
|
+
const getters = store.getters || {};
|
|
1070
1075
|
const actions = store.actions || {};
|
|
1071
|
-
const
|
|
1076
|
+
const status = {};
|
|
1077
|
+
status.finished = false;
|
|
1078
|
+
status.loading = false;
|
|
1079
|
+
status.error = null;
|
|
1080
|
+
const $state = options.persist ? proxyWithPersistant(options.persist, state) : proxy(state);
|
|
1081
|
+
const $status = proxy(status);
|
|
1072
1082
|
const $actions = {};
|
|
1073
|
-
|
|
1074
|
-
|
|
1083
|
+
const $getters = {};
|
|
1084
|
+
markActions($state, actions, $actions);
|
|
1085
|
+
markGetters(state, $state, getters, $getters);
|
|
1086
|
+
markStatus($actions, $status);
|
|
1075
1087
|
function $subscribe(listener) {
|
|
1076
1088
|
return subscribe($state, () => listener($state));
|
|
1077
1089
|
}
|
|
@@ -1081,14 +1093,84 @@ var LibReact = (() => {
|
|
|
1081
1093
|
else
|
|
1082
1094
|
Object.assign($state, patch);
|
|
1083
1095
|
}
|
|
1096
|
+
function $signal(fn) {
|
|
1097
|
+
return (0, import_react16.createElement)(() => fn(useSnapshot($state)));
|
|
1098
|
+
}
|
|
1099
|
+
$signal.status = function(fn) {
|
|
1100
|
+
return (0, import_react16.createElement)(() => fn(useSnapshot($status)));
|
|
1101
|
+
};
|
|
1084
1102
|
return {
|
|
1085
1103
|
$subscribe,
|
|
1086
1104
|
$patch,
|
|
1087
1105
|
$state,
|
|
1106
|
+
$status,
|
|
1088
1107
|
$actions,
|
|
1089
|
-
|
|
1108
|
+
$getters,
|
|
1109
|
+
$signal,
|
|
1110
|
+
...$actions,
|
|
1111
|
+
...$state
|
|
1090
1112
|
};
|
|
1091
1113
|
}
|
|
1114
|
+
function markActions($state, actions, $actions) {
|
|
1115
|
+
for (const key in actions)
|
|
1116
|
+
$actions[key] = actions[key].bind($state);
|
|
1117
|
+
}
|
|
1118
|
+
function markGetters(state, $state, getters, $getters) {
|
|
1119
|
+
for (const key in getters) {
|
|
1120
|
+
Object.defineProperty(state, key, {
|
|
1121
|
+
get: () => getters[key].call($state),
|
|
1122
|
+
enumerable: true
|
|
1123
|
+
});
|
|
1124
|
+
Object.defineProperty($getters, key, {
|
|
1125
|
+
get: () => state[key],
|
|
1126
|
+
enumerable: true
|
|
1127
|
+
});
|
|
1128
|
+
}
|
|
1129
|
+
}
|
|
1130
|
+
function markStatus($actions, $status) {
|
|
1131
|
+
Object.defineProperty($status, "loading", {
|
|
1132
|
+
get: () => Object.keys($actions).some((key) => $status[key].loading),
|
|
1133
|
+
enumerable: true
|
|
1134
|
+
});
|
|
1135
|
+
Object.defineProperty($status, "finished", {
|
|
1136
|
+
get: () => Object.keys($actions).every((key) => $status[key].finished),
|
|
1137
|
+
enumerable: true
|
|
1138
|
+
});
|
|
1139
|
+
Object.defineProperty($status, "error", {
|
|
1140
|
+
get: () => Object.keys($actions).find((key) => $status[key].error),
|
|
1141
|
+
enumerable: true
|
|
1142
|
+
});
|
|
1143
|
+
for (const key in $actions) {
|
|
1144
|
+
let subscribe3 = function() {
|
|
1145
|
+
if (subscribers === 0)
|
|
1146
|
+
$status[key].loading = true;
|
|
1147
|
+
subscribers++;
|
|
1148
|
+
}, done2 = function() {
|
|
1149
|
+
subscribers--;
|
|
1150
|
+
if (!subscribers)
|
|
1151
|
+
$status[key].loading = false;
|
|
1152
|
+
};
|
|
1153
|
+
var subscribe2 = subscribe3, done = done2;
|
|
1154
|
+
const action = $actions[key];
|
|
1155
|
+
$status[key] = { finished: false, loading: false, error: null };
|
|
1156
|
+
let subscribers = 0;
|
|
1157
|
+
$actions[key] = function(...args) {
|
|
1158
|
+
subscribe3();
|
|
1159
|
+
try {
|
|
1160
|
+
const result = action(...args);
|
|
1161
|
+
if (result instanceof Promise) {
|
|
1162
|
+
result.then(() => $status[key].finished = true).catch((error) => $status[key].error = error).finally(done2);
|
|
1163
|
+
} else {
|
|
1164
|
+
$status[key].finished = true;
|
|
1165
|
+
done2();
|
|
1166
|
+
}
|
|
1167
|
+
} catch (error) {
|
|
1168
|
+
$status[key].error = error;
|
|
1169
|
+
done2();
|
|
1170
|
+
}
|
|
1171
|
+
};
|
|
1172
|
+
}
|
|
1173
|
+
}
|
|
1092
1174
|
|
|
1093
1175
|
// src/storage/useStore.ts
|
|
1094
1176
|
function useStore(store) {
|
|
@@ -1106,7 +1188,7 @@ var LibReact = (() => {
|
|
|
1106
1188
|
error: void 0
|
|
1107
1189
|
})
|
|
1108
1190
|
},
|
|
1109
|
-
{
|
|
1191
|
+
{ persist: options.persist ? { id: options.persist, pick: ["value"] } : void 0 }
|
|
1110
1192
|
);
|
|
1111
1193
|
function use() {
|
|
1112
1194
|
const fn = options.setup();
|
|
@@ -1130,13 +1212,18 @@ var LibReact = (() => {
|
|
|
1130
1212
|
return use;
|
|
1131
1213
|
}
|
|
1132
1214
|
|
|
1133
|
-
// src/storage/
|
|
1134
|
-
function
|
|
1215
|
+
// src/storage/defineAsyncStoreLayered.ts
|
|
1216
|
+
function defineAsyncStoreLayered(fn, options = {}) {
|
|
1135
1217
|
return defineAsyncStore({
|
|
1136
1218
|
setup: () => fn,
|
|
1137
1219
|
initial: options.initial,
|
|
1138
|
-
|
|
1220
|
+
persist: options.persist
|
|
1139
1221
|
});
|
|
1140
1222
|
}
|
|
1223
|
+
|
|
1224
|
+
// src/storage/useStatus.tsx
|
|
1225
|
+
function useStatus(store) {
|
|
1226
|
+
return useSnapshot(store.$status);
|
|
1227
|
+
}
|
|
1141
1228
|
return __toCommonJS(index_exports);
|
|
1142
1229
|
})();
|
package/dist/index.js
CHANGED
|
@@ -364,7 +364,8 @@ function useWhenever(source, cb, options) {
|
|
|
364
364
|
}
|
|
365
365
|
|
|
366
366
|
// src/storage/defineStore.ts
|
|
367
|
-
import {
|
|
367
|
+
import { createElement as createElement4 } from "react";
|
|
368
|
+
import { proxy as proxy2, subscribe as subscribe2, useSnapshot } from "valtio";
|
|
368
369
|
|
|
369
370
|
// ../util-core/src/util/json.ts
|
|
370
371
|
function jsonTryParse(text) {
|
|
@@ -400,11 +401,19 @@ function proxyWithPersistant(keyOrOptions, initialObject) {
|
|
|
400
401
|
// src/storage/defineStore.ts
|
|
401
402
|
function defineStore(store, options = {}) {
|
|
402
403
|
const state = typeof store.state === "function" ? store.state() : store.state;
|
|
404
|
+
const getters = store.getters || {};
|
|
403
405
|
const actions = store.actions || {};
|
|
404
|
-
const
|
|
406
|
+
const status = {};
|
|
407
|
+
status.finished = false;
|
|
408
|
+
status.loading = false;
|
|
409
|
+
status.error = null;
|
|
410
|
+
const $state = options.persist ? proxyWithPersistant(options.persist, state) : proxy2(state);
|
|
411
|
+
const $status = proxy2(status);
|
|
405
412
|
const $actions = {};
|
|
406
|
-
|
|
407
|
-
|
|
413
|
+
const $getters = {};
|
|
414
|
+
markActions($state, actions, $actions);
|
|
415
|
+
markGetters(state, $state, getters, $getters);
|
|
416
|
+
markStatus($actions, $status);
|
|
408
417
|
function $subscribe(listener) {
|
|
409
418
|
return subscribe2($state, () => listener($state));
|
|
410
419
|
}
|
|
@@ -414,19 +423,89 @@ function defineStore(store, options = {}) {
|
|
|
414
423
|
else
|
|
415
424
|
Object.assign($state, patch);
|
|
416
425
|
}
|
|
426
|
+
function $signal(fn) {
|
|
427
|
+
return createElement4(() => fn(useSnapshot($state)));
|
|
428
|
+
}
|
|
429
|
+
$signal.status = function(fn) {
|
|
430
|
+
return createElement4(() => fn(useSnapshot($status)));
|
|
431
|
+
};
|
|
417
432
|
return {
|
|
418
433
|
$subscribe,
|
|
419
434
|
$patch,
|
|
420
435
|
$state,
|
|
436
|
+
$status,
|
|
421
437
|
$actions,
|
|
422
|
-
|
|
438
|
+
$getters,
|
|
439
|
+
$signal,
|
|
440
|
+
...$actions,
|
|
441
|
+
...$state
|
|
423
442
|
};
|
|
424
443
|
}
|
|
444
|
+
function markActions($state, actions, $actions) {
|
|
445
|
+
for (const key in actions)
|
|
446
|
+
$actions[key] = actions[key].bind($state);
|
|
447
|
+
}
|
|
448
|
+
function markGetters(state, $state, getters, $getters) {
|
|
449
|
+
for (const key in getters) {
|
|
450
|
+
Object.defineProperty(state, key, {
|
|
451
|
+
get: () => getters[key].call($state),
|
|
452
|
+
enumerable: true
|
|
453
|
+
});
|
|
454
|
+
Object.defineProperty($getters, key, {
|
|
455
|
+
get: () => state[key],
|
|
456
|
+
enumerable: true
|
|
457
|
+
});
|
|
458
|
+
}
|
|
459
|
+
}
|
|
460
|
+
function markStatus($actions, $status) {
|
|
461
|
+
Object.defineProperty($status, "loading", {
|
|
462
|
+
get: () => Object.keys($actions).some((key) => $status[key].loading),
|
|
463
|
+
enumerable: true
|
|
464
|
+
});
|
|
465
|
+
Object.defineProperty($status, "finished", {
|
|
466
|
+
get: () => Object.keys($actions).every((key) => $status[key].finished),
|
|
467
|
+
enumerable: true
|
|
468
|
+
});
|
|
469
|
+
Object.defineProperty($status, "error", {
|
|
470
|
+
get: () => Object.keys($actions).find((key) => $status[key].error),
|
|
471
|
+
enumerable: true
|
|
472
|
+
});
|
|
473
|
+
for (const key in $actions) {
|
|
474
|
+
let subscribe4 = function() {
|
|
475
|
+
if (subscribers === 0)
|
|
476
|
+
$status[key].loading = true;
|
|
477
|
+
subscribers++;
|
|
478
|
+
}, done2 = function() {
|
|
479
|
+
subscribers--;
|
|
480
|
+
if (!subscribers)
|
|
481
|
+
$status[key].loading = false;
|
|
482
|
+
};
|
|
483
|
+
var subscribe3 = subscribe4, done = done2;
|
|
484
|
+
const action = $actions[key];
|
|
485
|
+
$status[key] = { finished: false, loading: false, error: null };
|
|
486
|
+
let subscribers = 0;
|
|
487
|
+
$actions[key] = function(...args) {
|
|
488
|
+
subscribe4();
|
|
489
|
+
try {
|
|
490
|
+
const result = action(...args);
|
|
491
|
+
if (result instanceof Promise) {
|
|
492
|
+
result.then(() => $status[key].finished = true).catch((error) => $status[key].error = error).finally(done2);
|
|
493
|
+
} else {
|
|
494
|
+
$status[key].finished = true;
|
|
495
|
+
done2();
|
|
496
|
+
}
|
|
497
|
+
} catch (error) {
|
|
498
|
+
$status[key].error = error;
|
|
499
|
+
done2();
|
|
500
|
+
}
|
|
501
|
+
};
|
|
502
|
+
}
|
|
503
|
+
}
|
|
425
504
|
|
|
426
505
|
// src/storage/useStore.ts
|
|
427
|
-
import { useSnapshot } from "valtio";
|
|
506
|
+
import { useSnapshot as useSnapshot2 } from "valtio";
|
|
428
507
|
function useStore(store) {
|
|
429
|
-
return
|
|
508
|
+
return useSnapshot2(store.$state);
|
|
430
509
|
}
|
|
431
510
|
|
|
432
511
|
// src/storage/defineAsyncStore.ts
|
|
@@ -440,7 +519,7 @@ function defineAsyncStore(options) {
|
|
|
440
519
|
error: void 0
|
|
441
520
|
})
|
|
442
521
|
},
|
|
443
|
-
{
|
|
522
|
+
{ persist: options.persist ? { id: options.persist, pick: ["value"] } : void 0 }
|
|
444
523
|
);
|
|
445
524
|
function use() {
|
|
446
525
|
const fn = options.setup();
|
|
@@ -464,14 +543,20 @@ function defineAsyncStore(options) {
|
|
|
464
543
|
return use;
|
|
465
544
|
}
|
|
466
545
|
|
|
467
|
-
// src/storage/
|
|
468
|
-
function
|
|
546
|
+
// src/storage/defineAsyncStoreLayered.ts
|
|
547
|
+
function defineAsyncStoreLayered(fn, options = {}) {
|
|
469
548
|
return defineAsyncStore({
|
|
470
549
|
setup: () => fn,
|
|
471
550
|
initial: options.initial,
|
|
472
|
-
|
|
551
|
+
persist: options.persist
|
|
473
552
|
});
|
|
474
553
|
}
|
|
554
|
+
|
|
555
|
+
// src/storage/useStatus.tsx
|
|
556
|
+
import { useSnapshot as useSnapshot3 } from "valtio";
|
|
557
|
+
function useStatus(store) {
|
|
558
|
+
return useSnapshot3(store.$status);
|
|
559
|
+
}
|
|
475
560
|
export {
|
|
476
561
|
Case,
|
|
477
562
|
Default,
|
|
@@ -484,7 +569,7 @@ export {
|
|
|
484
569
|
Unless,
|
|
485
570
|
cls,
|
|
486
571
|
defineAsyncStore,
|
|
487
|
-
|
|
572
|
+
defineAsyncStoreLayered,
|
|
488
573
|
defineStore,
|
|
489
574
|
proxyWithPersistant,
|
|
490
575
|
useAsyncCallback,
|
|
@@ -494,6 +579,7 @@ export {
|
|
|
494
579
|
useFetchRequestIntercept,
|
|
495
580
|
useFetchResponseIntercept,
|
|
496
581
|
useMounted,
|
|
582
|
+
useStatus,
|
|
497
583
|
useStore,
|
|
498
584
|
useWatch,
|
|
499
585
|
useWhenever,
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hairy/react-lib",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "1.
|
|
4
|
+
"version": "1.15.0",
|
|
5
5
|
"description": "Library for react",
|
|
6
6
|
"author": "Hairyf <wwu710632@gmail.com>",
|
|
7
7
|
"license": "MIT",
|
|
@@ -38,7 +38,7 @@
|
|
|
38
38
|
"react-dom": "^18.2.0",
|
|
39
39
|
"react-i18next": "^14.1.2",
|
|
40
40
|
"react-use": "^17.6.0",
|
|
41
|
-
"@hairy/utils": "1.
|
|
41
|
+
"@hairy/utils": "1.15.0"
|
|
42
42
|
},
|
|
43
43
|
"scripts": {
|
|
44
44
|
"build": "tsup",
|