@hairy/react-lib 1.14.0 → 1.16.0

package/dist/index.js

@@ -1,26 +1,3 @@
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __esm = (fn, res) => function __init() {
-  return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
-};
-
-// ../../node_modules/.pnpm/tslib@2.8.1/node_modules/tslib/tslib.es6.mjs
-var __assign;
-var init_tslib_es6 = __esm({
-  "../../node_modules/.pnpm/tslib@2.8.1/node_modules/tslib/tslib.es6.mjs"() {
-    "use strict";
-    __assign = function() {
-      __assign = Object.assign || function __assign2(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-          s = arguments[i];
-          for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-        }
-        return t;
-      };
-      return __assign.apply(this, arguments);
-    };
-  }
-});
-
 // src/utils/cls.ts
 var hasOwn = {}.hasOwnProperty;
 function cls(...args) {
@@ -168,80 +145,26 @@ function renderNodes(tokens, values) {
 // src/hooks/useAsyncCallback.ts
 import { useState } from "react";
 function useAsyncCallback(fun) {
-  const [error, setError] = useState();
-  const [loading, setLoading] = useState(false);
+  const [state, set] = useState({ loading: false });
   async function execute(...args) {
-    try {
-      setLoading(true);
-      const result = await fun(...args);
-      setLoading(false);
-      return result;
-    } catch (error2) {
-      setLoading(false);
-      setError(error2);
-      throw error2;
-    }
-  }
-  return [loading, execute, error];
-}
-
-// ../../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
-init_tslib_es6();
-import { useCallback as useCallback2, useRef as useRef2, useState as useState2 } from "react";
-
-// ../../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
-import { useCallback, useEffect, useRef } from "react";
-function useMountedState() {
-  var mountedRef = useRef(false);
-  var get = useCallback(function() {
-    return mountedRef.current;
-  }, []);
-  useEffect(function() {
-    mountedRef.current = true;
-    return function() {
-      mountedRef.current = false;
-    };
-  }, []);
-  return get;
-}
-
-// ../../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
-function useAsyncFn(fn, deps, initialState) {
-  if (deps === void 0) {
-    deps = [];
-  }
-  if (initialState === void 0) {
-    initialState = { loading: false };
-  }
-  var lastCallId = useRef2(0);
-  var isMounted = useMountedState();
-  var _a = useState2(initialState), state = _a[0], set = _a[1];
-  var callback = useCallback2(function() {
-    var args = [];
-    for (var _i = 0; _i < arguments.length; _i++) {
-      args[_i] = arguments[_i];
-    }
-    var callId = ++lastCallId.current;
-    if (!state.loading) {
-      set(function(prevState) {
-        return __assign(__assign({}, prevState), { loading: true });
-      });
-    }
-    return fn.apply(void 0, args).then(function(value) {
-      isMounted() && callId === lastCallId.current && set({ value, loading: false });
+    return fun(...args).then((value) => {
+      set({ loading: false });
       return value;
-    }, function(error) {
-      isMounted() && callId === lastCallId.current && set({ error, loading: false });
-      return error;
+    }).catch((err) => {
+      set({ loading: false, error: err });
+      return Promise.reject(err);
     });
-  }, deps);
-  return [state, callback];
+  }
+  return [state.loading, execute, state.error];
 }
 
+// src/hooks/useAsyncState.ts
+import { useEffect as useEffect2, useState as useState2 } from "react";
+
 // ../../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
-import { useEffect as useEffect2 } from "react";
+import { useEffect } from "react";
 var useEffectOnce = function(effect) {
-  useEffect2(effect, []);
+  useEffect(effect, []);
 };
 var useEffectOnce_default = useEffectOnce;
 
@@ -254,10 +177,14 @@ var useMount = function(fn) {
 var useMount_default = useMount;
 
 // src/hooks/useAsyncState.ts
-function useAsyncState(fn, deps, options) {
-  const [state, _fn] = useAsyncFn(fn, deps, options?.initial);
-  useMount_default(() => options?.immediate && _fn());
-  return [state, _fn];
+function useAsyncState(fun, options) {
+  const [value, set] = useState2(options?.initial);
+  const [loading, execute, error] = useAsyncCallback(async (...args) => fun(...args).then(set));
+  useMount_default(() => options?.immediate && execute());
+  useEffect2(() => {
+    execute();
+  }, [execute]);
+  return [{ value, loading, error }, execute];
 }
 
 // src/hooks/useDebounce.ts
@@ -273,10 +200,10 @@ function useDebounce(value, delay) {
 
 // src/hooks/useEventBus.ts
 import mitt from "mitt";
-import { useEffect as useEffect4, useRef as useRef3 } from "react";
+import { useEffect as useEffect4, useRef } from "react";
 var emitter = mitt();
 function useEventBus(key) {
-  const onRef = useRef3();
+  const onRef = useRef();
   function on(listener) {
     emitter.on(key, listener);
     onRef.current = listener;
@@ -334,10 +261,10 @@ function useMounted() {
 }
 
 // src/hooks/useWatch.ts
-import { useEffect as useEffect6, useMemo as useMemo2, useRef as useRef4 } from "react";
+import { useEffect as useEffect6, useMemo as useMemo2, useRef as useRef2 } from "react";
 function useWatch(source, callback, options = {}) {
-  const firstUpdate = useRef4(false);
-  const then = useRef4();
+  const firstUpdate = useRef2(false);
+  const then = useRef2();
   const deps = useMemo2(
     () => Array.isArray(source) ? source : [source],
     [source]
@@ -364,7 +291,8 @@ function useWhenever(source, cb, options) {
 }
 
 // src/storage/defineStore.ts
-import { proxy as proxy2, subscribe as subscribe2 } from "valtio";
+import { createElement as createElement4 } from "react";
+import { proxy as proxy2, subscribe as subscribe2, useSnapshot } from "valtio";
 
 // ../util-core/src/util/json.ts
 function jsonTryParse(text) {
@@ -375,7 +303,7 @@ function jsonTryParse(text) {
   }
 }
 
-// src/storage/proxyWithPersistant.ts
+// src/storage/persistant.ts
 import { proxy, subscribe } from "valtio";
 function proxyWithPersistant(keyOrOptions, initialObject) {
   let options;
@@ -400,77 +328,133 @@ function proxyWithPersistant(keyOrOptions, initialObject) {
 // src/storage/defineStore.ts
 function defineStore(store, options = {}) {
   const state = typeof store.state === "function" ? store.state() : store.state;
+  const getters = store.getters || {};
   const actions = store.actions || {};
-  const $state = options.persistant ? proxyWithPersistant(options.persistant, state) : proxy2(state);
+  const status = {};
+  status.finished = false;
+  status.loading = false;
+  status.error = null;
+  const $state = options.persist ? proxyWithPersistant(options.persist, state) : proxy2(state);
+  const $status = proxy2(status);
   const $actions = {};
-  for (const key in actions)
-    $actions[key] = actions[key].bind($state);
+  const $getters = {};
+  setupActions($state, actions, $actions, $status);
+  setupGetters(state, $state, getters, $getters);
+  setupStatus($actions, $status);
   function $subscribe(listener) {
     return subscribe2($state, () => listener($state));
   }
+  $subscribe.status = function(listener) {
+    return subscribe2($status, () => listener($status));
+  };
   function $patch(patch) {
     if (typeof patch === "function")
       patch($state);
     else
       Object.assign($state, patch);
   }
+  function $signal(fn) {
+    return createElement4(() => fn(useSnapshot($state)));
+  }
+  $signal.status = function(fn) {
+    return createElement4(() => fn(useSnapshot($status)));
+  };
   return {
     $subscribe,
     $patch,
     $state,
+    $status,
     $actions,
+    $getters,
+    $signal,
     ...$actions
   };
 }
-
-// src/storage/useStore.ts
-import { useSnapshot } from "valtio";
-function useStore(store) {
-  return useSnapshot(store.$state);
+function track(action, status) {
+  let loadings = 0;
+  const tracking = () => loadings++ === 0 && (status.loading = true);
+  const done = () => !--loadings && (status.loading = false);
+  const fulfilled = () => {
+    status.finished = true;
+    done();
+  };
+  const rejected = (error) => {
+    status.error = error;
+    done();
+  };
+  return function(...args) {
+    tracking();
+    try {
+      const result = action(...args);
+      if (result instanceof Promise)
+        result.then(fulfilled).catch(rejected);
+      else
+        fulfilled();
+    } catch (error) {
+      rejected(error);
+    }
+  };
+}
+function setupActions($state, actions, $actions, $status) {
+  for (const key in actions) {
+    $status[key] = { finished: false, loading: false, error: null };
+    $actions[key] = track(actions[key].bind($state), $status[key]);
+  }
+}
+function setupGetters(state, $state, getters, $getters) {
+  for (const key in getters) {
+    Object.defineProperty(state, key, {
+      get: () => getters[key].call($state),
+      enumerable: true
+    });
+    Object.defineProperty($getters, key, {
+      get: () => state[key],
+      enumerable: true
+    });
+  }
+}
+function setupStatus($actions, $status) {
+  Object.defineProperty($status, "loading", {
+    get: () => Object.keys($actions).some((key) => $status[key].loading),
+    enumerable: true
+  });
+  Object.defineProperty($status, "finished", {
+    get: () => Object.keys($actions).every((key) => $status[key].finished),
+    enumerable: true
+  });
+  Object.defineProperty($status, "error", {
+    get: () => Object.keys($actions).find((key) => $status[key].error),
+    enumerable: true
+  });
 }
 
 // src/storage/defineAsyncStore.ts
-function defineAsyncStore(options) {
+function defineAsyncStore(fetch, options = {}) {
   const store = defineStore(
     {
-      state: () => ({
-        promise: void 0,
-        value: options.initial,
-        loading: false,
-        error: void 0
-      })
+      state: () => ({ value: options.initial }),
+      actions: {
+        fetch,
+        refresh(value) {
+          this.value = value || options.initial;
+        }
+      }
     },
-    { persistant: options.persistant ? { id: options.persistant, pick: ["value"] } : void 0 }
+    { persist: options.persist }
   );
-  function use() {
-    const fn = options.setup();
-    const state = useStore(store);
-    function fetch(...args) {
-      if (state.loading)
-        return;
-      store.$state.loading = true;
-      store.$state.promise = fn(...args);
-      store.$state.promise.then((value) => store.$state.value = value).finally(() => store.$state.loading = false).catch((error) => {
-        store.$state.error = error;
-        throw error;
-      });
-      return store.$state.promise;
-    }
-    function refresh(value) {
-      store.$state.value = value || options.initial;
-    }
-    return [state, fetch, refresh];
-  }
-  return use;
+  return store;
 }
 
-// src/storage/defineAsyncStorePlain.ts
-function defineAsyncStorePlain(fn, options = {}) {
-  return defineAsyncStore({
-    setup: () => fn,
-    initial: options.initial,
-    persistant: options.persistant
-  });
+// src/storage/useStatus.tsx
+import { useSnapshot as useSnapshot2 } from "valtio";
+function useStatus(store) {
+  return useSnapshot2(store.$status);
+}
+
+// src/storage/useStore.ts
+import { useSnapshot as useSnapshot3 } from "valtio";
+function useStore(store) {
+  return useSnapshot3(store.$state);
 }
 export {
   Case,
@@ -484,7 +468,6 @@ export {
   Unless,
   cls,
   defineAsyncStore,
-  defineAsyncStorePlain,
   defineStore,
   proxyWithPersistant,
   useAsyncCallback,
@@ -494,6 +477,7 @@ export {
   useFetchRequestIntercept,
   useFetchResponseIntercept,
   useMounted,
+  useStatus,
   useStore,
   useWatch,
   useWhenever,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@hairy/react-lib",
   "type": "module",
-  "version": "1.14.0",
+  "version": "1.16.0",
   "description": "Library for react",
   "author": "Hairyf <wwu710632@gmail.com>",
   "license": "MIT",
@@ -38,7 +38,7 @@
     "react-dom": "^18.2.0",
     "react-i18next": "^14.1.2",
     "react-use": "^17.6.0",
-    "@hairy/utils": "1.14.0"
+    "@hairy/utils": "1.16.0"
   },
   "scripts": {
     "build": "tsup",