@hairy/react-lib 1.15.0 → 1.16.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 +94 -195
- package/dist/index.d.ts +42 -55
- package/dist/index.global.js +103 -203
- package/dist/index.js +83 -185
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -1,26 +1,3 @@
|
|
|
1
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
2
|
-
var __esm = (fn, res) => function __init() {
|
|
3
|
-
return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
|
|
4
|
-
};
|
|
5
|
-
|
|
6
|
-
// ../../node_modules/.pnpm/tslib@2.8.1/node_modules/tslib/tslib.es6.mjs
|
|
7
|
-
var __assign;
|
|
8
|
-
var init_tslib_es6 = __esm({
|
|
9
|
-
"../../node_modules/.pnpm/tslib@2.8.1/node_modules/tslib/tslib.es6.mjs"() {
|
|
10
|
-
"use strict";
|
|
11
|
-
__assign = function() {
|
|
12
|
-
__assign = Object.assign || function __assign2(t) {
|
|
13
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
14
|
-
s = arguments[i];
|
|
15
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
16
|
-
}
|
|
17
|
-
return t;
|
|
18
|
-
};
|
|
19
|
-
return __assign.apply(this, arguments);
|
|
20
|
-
};
|
|
21
|
-
}
|
|
22
|
-
});
|
|
23
|
-
|
|
24
1
|
// src/utils/cls.ts
|
|
25
2
|
var hasOwn = {}.hasOwnProperty;
|
|
26
3
|
function cls(...args) {
|
|
@@ -168,80 +145,26 @@ function renderNodes(tokens, values) {
|
|
|
168
145
|
// src/hooks/useAsyncCallback.ts
|
|
169
146
|
import { useState } from "react";
|
|
170
147
|
function useAsyncCallback(fun) {
|
|
171
|
-
const [
|
|
172
|
-
const [loading, setLoading] = useState(false);
|
|
148
|
+
const [state, set] = useState({ loading: false });
|
|
173
149
|
async function execute(...args) {
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
const result = await fun(...args);
|
|
177
|
-
setLoading(false);
|
|
178
|
-
return result;
|
|
179
|
-
} catch (error2) {
|
|
180
|
-
setLoading(false);
|
|
181
|
-
setError(error2);
|
|
182
|
-
throw error2;
|
|
183
|
-
}
|
|
184
|
-
}
|
|
185
|
-
return [loading, execute, error];
|
|
186
|
-
}
|
|
187
|
-
|
|
188
|
-
// ../../node_modules/.pnpm/react-use@17.6.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/react-use/esm/useAsyncFn.js
|
|
189
|
-
init_tslib_es6();
|
|
190
|
-
import { useCallback as useCallback2, useRef as useRef2, useState as useState2 } from "react";
|
|
191
|
-
|
|
192
|
-
// ../../node_modules/.pnpm/react-use@17.6.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/react-use/esm/useMountedState.js
|
|
193
|
-
import { useCallback, useEffect, useRef } from "react";
|
|
194
|
-
function useMountedState() {
|
|
195
|
-
var mountedRef = useRef(false);
|
|
196
|
-
var get = useCallback(function() {
|
|
197
|
-
return mountedRef.current;
|
|
198
|
-
}, []);
|
|
199
|
-
useEffect(function() {
|
|
200
|
-
mountedRef.current = true;
|
|
201
|
-
return function() {
|
|
202
|
-
mountedRef.current = false;
|
|
203
|
-
};
|
|
204
|
-
}, []);
|
|
205
|
-
return get;
|
|
206
|
-
}
|
|
207
|
-
|
|
208
|
-
// ../../node_modules/.pnpm/react-use@17.6.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/react-use/esm/useAsyncFn.js
|
|
209
|
-
function useAsyncFn(fn, deps, initialState) {
|
|
210
|
-
if (deps === void 0) {
|
|
211
|
-
deps = [];
|
|
212
|
-
}
|
|
213
|
-
if (initialState === void 0) {
|
|
214
|
-
initialState = { loading: false };
|
|
215
|
-
}
|
|
216
|
-
var lastCallId = useRef2(0);
|
|
217
|
-
var isMounted = useMountedState();
|
|
218
|
-
var _a = useState2(initialState), state = _a[0], set = _a[1];
|
|
219
|
-
var callback = useCallback2(function() {
|
|
220
|
-
var args = [];
|
|
221
|
-
for (var _i = 0; _i < arguments.length; _i++) {
|
|
222
|
-
args[_i] = arguments[_i];
|
|
223
|
-
}
|
|
224
|
-
var callId = ++lastCallId.current;
|
|
225
|
-
if (!state.loading) {
|
|
226
|
-
set(function(prevState) {
|
|
227
|
-
return __assign(__assign({}, prevState), { loading: true });
|
|
228
|
-
});
|
|
229
|
-
}
|
|
230
|
-
return fn.apply(void 0, args).then(function(value) {
|
|
231
|
-
isMounted() && callId === lastCallId.current && set({ value, loading: false });
|
|
150
|
+
return fun(...args).then((value) => {
|
|
151
|
+
set({ loading: false });
|
|
232
152
|
return value;
|
|
233
|
-
}
|
|
234
|
-
|
|
235
|
-
return
|
|
153
|
+
}).catch((err) => {
|
|
154
|
+
set({ loading: false, error: err });
|
|
155
|
+
return Promise.reject(err);
|
|
236
156
|
});
|
|
237
|
-
}
|
|
238
|
-
return [state,
|
|
157
|
+
}
|
|
158
|
+
return [state.loading, execute, state.error];
|
|
239
159
|
}
|
|
240
160
|
|
|
161
|
+
// src/hooks/useAsyncState.ts
|
|
162
|
+
import { useEffect as useEffect2, useState as useState2 } from "react";
|
|
163
|
+
|
|
241
164
|
// ../../node_modules/.pnpm/react-use@17.6.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/react-use/esm/useEffectOnce.js
|
|
242
|
-
import { useEffect
|
|
165
|
+
import { useEffect } from "react";
|
|
243
166
|
var useEffectOnce = function(effect) {
|
|
244
|
-
|
|
167
|
+
useEffect(effect, []);
|
|
245
168
|
};
|
|
246
169
|
var useEffectOnce_default = useEffectOnce;
|
|
247
170
|
|
|
@@ -254,10 +177,14 @@ var useMount = function(fn) {
|
|
|
254
177
|
var useMount_default = useMount;
|
|
255
178
|
|
|
256
179
|
// src/hooks/useAsyncState.ts
|
|
257
|
-
function useAsyncState(
|
|
258
|
-
const [
|
|
259
|
-
|
|
260
|
-
|
|
180
|
+
function useAsyncState(fun, options) {
|
|
181
|
+
const [value, set] = useState2(options?.initial);
|
|
182
|
+
const [loading, execute, error] = useAsyncCallback(async (...args) => fun(...args).then(set));
|
|
183
|
+
useMount_default(() => options?.immediate && execute());
|
|
184
|
+
useEffect2(() => {
|
|
185
|
+
execute();
|
|
186
|
+
}, [execute]);
|
|
187
|
+
return [{ value, loading, error }, execute];
|
|
261
188
|
}
|
|
262
189
|
|
|
263
190
|
// src/hooks/useDebounce.ts
|
|
@@ -273,10 +200,10 @@ function useDebounce(value, delay) {
|
|
|
273
200
|
|
|
274
201
|
// src/hooks/useEventBus.ts
|
|
275
202
|
import mitt from "mitt";
|
|
276
|
-
import { useEffect as useEffect4, useRef
|
|
203
|
+
import { useEffect as useEffect4, useRef } from "react";
|
|
277
204
|
var emitter = mitt();
|
|
278
205
|
function useEventBus(key) {
|
|
279
|
-
const onRef =
|
|
206
|
+
const onRef = useRef();
|
|
280
207
|
function on(listener) {
|
|
281
208
|
emitter.on(key, listener);
|
|
282
209
|
onRef.current = listener;
|
|
@@ -334,10 +261,10 @@ function useMounted() {
|
|
|
334
261
|
}
|
|
335
262
|
|
|
336
263
|
// src/hooks/useWatch.ts
|
|
337
|
-
import { useEffect as useEffect6, useMemo as useMemo2, useRef as
|
|
264
|
+
import { useEffect as useEffect6, useMemo as useMemo2, useRef as useRef2 } from "react";
|
|
338
265
|
function useWatch(source, callback, options = {}) {
|
|
339
|
-
const firstUpdate =
|
|
340
|
-
const then =
|
|
266
|
+
const firstUpdate = useRef2(false);
|
|
267
|
+
const then = useRef2();
|
|
341
268
|
const deps = useMemo2(
|
|
342
269
|
() => Array.isArray(source) ? source : [source],
|
|
343
270
|
[source]
|
|
@@ -376,7 +303,7 @@ function jsonTryParse(text) {
|
|
|
376
303
|
}
|
|
377
304
|
}
|
|
378
305
|
|
|
379
|
-
// src/storage/
|
|
306
|
+
// src/storage/persistant.ts
|
|
380
307
|
import { proxy, subscribe } from "valtio";
|
|
381
308
|
function proxyWithPersistant(keyOrOptions, initialObject) {
|
|
382
309
|
let options;
|
|
@@ -411,12 +338,15 @@ function defineStore(store, options = {}) {
|
|
|
411
338
|
const $status = proxy2(status);
|
|
412
339
|
const $actions = {};
|
|
413
340
|
const $getters = {};
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
341
|
+
setupActions($state, actions, $actions, $status);
|
|
342
|
+
setupGetters(state, $state, getters, $getters);
|
|
343
|
+
setupStatus($actions, $status);
|
|
417
344
|
function $subscribe(listener) {
|
|
418
345
|
return subscribe2($state, () => listener($state));
|
|
419
346
|
}
|
|
347
|
+
$subscribe.status = function(listener) {
|
|
348
|
+
return subscribe2($status, () => listener($status));
|
|
349
|
+
};
|
|
420
350
|
function $patch(patch) {
|
|
421
351
|
if (typeof patch === "function")
|
|
422
352
|
patch($state);
|
|
@@ -437,15 +367,41 @@ function defineStore(store, options = {}) {
|
|
|
437
367
|
$actions,
|
|
438
368
|
$getters,
|
|
439
369
|
$signal,
|
|
440
|
-
...$actions
|
|
441
|
-
...$state
|
|
370
|
+
...$actions
|
|
442
371
|
};
|
|
443
372
|
}
|
|
444
|
-
function
|
|
445
|
-
|
|
446
|
-
|
|
373
|
+
function track(action, status) {
|
|
374
|
+
let loadings = 0;
|
|
375
|
+
const tracking = () => loadings++ === 0 && (status.loading = true);
|
|
376
|
+
const done = () => !--loadings && (status.loading = false);
|
|
377
|
+
const fulfilled = () => {
|
|
378
|
+
status.finished = true;
|
|
379
|
+
done();
|
|
380
|
+
};
|
|
381
|
+
const rejected = (error) => {
|
|
382
|
+
status.error = error;
|
|
383
|
+
done();
|
|
384
|
+
};
|
|
385
|
+
return function(...args) {
|
|
386
|
+
tracking();
|
|
387
|
+
try {
|
|
388
|
+
const result = action(...args);
|
|
389
|
+
if (result instanceof Promise)
|
|
390
|
+
result.then(fulfilled).catch(rejected);
|
|
391
|
+
else
|
|
392
|
+
fulfilled();
|
|
393
|
+
} catch (error) {
|
|
394
|
+
rejected(error);
|
|
395
|
+
}
|
|
396
|
+
};
|
|
447
397
|
}
|
|
448
|
-
function
|
|
398
|
+
function setupActions($state, actions, $actions, $status) {
|
|
399
|
+
for (const key in actions) {
|
|
400
|
+
$status[key] = { finished: false, loading: false, error: null };
|
|
401
|
+
$actions[key] = track(actions[key].bind($state), $status[key]);
|
|
402
|
+
}
|
|
403
|
+
}
|
|
404
|
+
function setupGetters(state, $state, getters, $getters) {
|
|
449
405
|
for (const key in getters) {
|
|
450
406
|
Object.defineProperty(state, key, {
|
|
451
407
|
get: () => getters[key].call($state),
|
|
@@ -457,7 +413,7 @@ function markGetters(state, $state, getters, $getters) {
|
|
|
457
413
|
});
|
|
458
414
|
}
|
|
459
415
|
}
|
|
460
|
-
function
|
|
416
|
+
function setupStatus($actions, $status) {
|
|
461
417
|
Object.defineProperty($status, "loading", {
|
|
462
418
|
get: () => Object.keys($actions).some((key) => $status[key].loading),
|
|
463
419
|
enumerable: true
|
|
@@ -470,92 +426,35 @@ function markStatus($actions, $status) {
|
|
|
470
426
|
get: () => Object.keys($actions).find((key) => $status[key].error),
|
|
471
427
|
enumerable: true
|
|
472
428
|
});
|
|
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
|
-
}
|
|
504
|
-
|
|
505
|
-
// src/storage/useStore.ts
|
|
506
|
-
import { useSnapshot as useSnapshot2 } from "valtio";
|
|
507
|
-
function useStore(store) {
|
|
508
|
-
return useSnapshot2(store.$state);
|
|
509
429
|
}
|
|
510
430
|
|
|
511
431
|
// src/storage/defineAsyncStore.ts
|
|
512
|
-
function defineAsyncStore(options) {
|
|
432
|
+
function defineAsyncStore(fetch, options = {}) {
|
|
513
433
|
const store = defineStore(
|
|
514
434
|
{
|
|
515
|
-
state: () => ({
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
435
|
+
state: () => ({ value: options.initial }),
|
|
436
|
+
actions: {
|
|
437
|
+
fetch,
|
|
438
|
+
refresh(value) {
|
|
439
|
+
this.value = value || options.initial;
|
|
440
|
+
}
|
|
441
|
+
}
|
|
521
442
|
},
|
|
522
|
-
{ persist: options.persist
|
|
443
|
+
{ persist: options.persist }
|
|
523
444
|
);
|
|
524
|
-
|
|
525
|
-
const fn = options.setup();
|
|
526
|
-
const state = useStore(store);
|
|
527
|
-
function fetch(...args) {
|
|
528
|
-
if (state.loading)
|
|
529
|
-
return;
|
|
530
|
-
store.$state.loading = true;
|
|
531
|
-
store.$state.promise = fn(...args);
|
|
532
|
-
store.$state.promise.then((value) => store.$state.value = value).finally(() => store.$state.loading = false).catch((error) => {
|
|
533
|
-
store.$state.error = error;
|
|
534
|
-
throw error;
|
|
535
|
-
});
|
|
536
|
-
return store.$state.promise;
|
|
537
|
-
}
|
|
538
|
-
function refresh(value) {
|
|
539
|
-
store.$state.value = value || options.initial;
|
|
540
|
-
}
|
|
541
|
-
return [state, fetch, refresh];
|
|
542
|
-
}
|
|
543
|
-
return use;
|
|
445
|
+
return store;
|
|
544
446
|
}
|
|
545
447
|
|
|
546
|
-
// src/storage/
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
initial: options.initial,
|
|
551
|
-
persist: options.persist
|
|
552
|
-
});
|
|
448
|
+
// src/storage/useStatus.tsx
|
|
449
|
+
import { useSnapshot as useSnapshot2 } from "valtio";
|
|
450
|
+
function useStatus(store) {
|
|
451
|
+
return useSnapshot2(store.$status);
|
|
553
452
|
}
|
|
554
453
|
|
|
555
|
-
// src/storage/
|
|
454
|
+
// src/storage/useStore.ts
|
|
556
455
|
import { useSnapshot as useSnapshot3 } from "valtio";
|
|
557
|
-
function
|
|
558
|
-
return useSnapshot3(store.$
|
|
456
|
+
function useStore(store) {
|
|
457
|
+
return useSnapshot3(store.$state);
|
|
559
458
|
}
|
|
560
459
|
export {
|
|
561
460
|
Case,
|
|
@@ -569,7 +468,6 @@ export {
|
|
|
569
468
|
Unless,
|
|
570
469
|
cls,
|
|
571
470
|
defineAsyncStore,
|
|
572
|
-
defineAsyncStoreLayered,
|
|
573
471
|
defineStore,
|
|
574
472
|
proxyWithPersistant,
|
|
575
473
|
useAsyncCallback,
|
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.16.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.16.0"
|
|
42
42
|
},
|
|
43
43
|
"scripts": {
|
|
44
44
|
"build": "tsup",
|