@hairy/react-lib 1.6.1 → 1.7.0

package/dist/index.cjs

@@ -5,6 +5,9 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __esm = (fn, res) => function __init() {
+  return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
+};
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -27,6 +30,24 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
+// ../../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/index.ts
 var index_exports = {};
 __export(index_exports, {
@@ -171,19 +192,86 @@ function useAsyncCallback(fun) {
   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();
+var import_react8 = require("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
+var import_react7 = require("react");
+function useMountedState() {
+  var mountedRef = (0, import_react7.useRef)(false);
+  var get = (0, import_react7.useCallback)(function() {
+    return mountedRef.current;
+  }, []);
+  (0, import_react7.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 = (0, import_react8.useRef)(0);
+  var isMounted = useMountedState();
+  var _a = (0, import_react8.useState)(initialState), state = _a[0], set = _a[1];
+  var callback = (0, import_react8.useCallback)(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 value;
+    }, function(error) {
+      isMounted() && callId === lastCallId.current && set({ error, loading: false });
+      return error;
+    });
+  }, deps);
+  return [state, callback];
+}
+
+// ../../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
+var import_react9 = require("react");
+var useEffectOnce = function(effect) {
+  (0, import_react9.useEffect)(effect, []);
+};
+var useEffectOnce_default = useEffectOnce;
+
+// ../../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/useMount.js
+var useMount = function(fn) {
+  useEffectOnce_default(function() {
+    fn();
+  });
+};
+var useMount_default = useMount;
+
 // src/hooks/useAsyncState.ts
-var import_react_use = require("react-use");
 function useAsyncState(fn, deps, options) {
-  const [state, _fn] = (0, import_react_use.useAsyncFn)(fn, deps, options?.initial);
-  (0, import_react_use.useMount)(() => options?.immediate && _fn());
+  const [state, _fn] = useAsyncFn(fn, deps, options?.initial);
+  useMount_default(() => options?.immediate && _fn());
   return [state, _fn];
 }
 
 // src/hooks/useDebounce.ts
-var import_react7 = require("react");
+var import_react10 = require("react");
 function useDebounce(value, delay) {
-  const [debouncedValue, setDebouncedValue] = (0, import_react7.useState)(value);
-  (0, import_react7.useEffect)(() => {
+  const [debouncedValue, setDebouncedValue] = (0, import_react10.useState)(value);
+  (0, import_react10.useEffect)(() => {
     const handler = setTimeout(() => setDebouncedValue(value), delay);
     return () => clearTimeout(handler);
   }, [value, delay]);
@@ -192,14 +280,14 @@ function useDebounce(value, delay) {
 
 // src/hooks/useEventBus.ts
 var import_mitt = __toESM(require("mitt"), 1);
-var import_react8 = require("react");
+var import_react11 = require("react");
 var emitter = (0, import_mitt.default)();
 function useEventBus(key) {
-  const onRef = (0, import_react8.useRef)();
+  const onRef = (0, import_react11.useRef)();
   function on(listener) {
     emitter.on(key, listener);
     onRef.current = listener;
-    (0, import_react8.useEffect)(() => {
+    (0, import_react11.useEffect)(() => {
       if (!onRef.current)
         return;
       emitter.off(key, onRef.current);
@@ -222,12 +310,11 @@ function useEventBus(key) {
 }
 
 // src/hooks/useFetchIntercept.ts
-var import_react_use2 = require("react-use");
 function useFetchResponseIntercept(intercept) {
-  (0, import_react_use2.useMount)(() => fetchResponseIntercept(intercept));
+  useMount_default(() => fetchResponseIntercept(intercept));
 }
 function useFetchRequestIntercept(intercept) {
-  (0, import_react_use2.useMount)(() => fetchRequestIntercept(intercept));
+  useMount_default(() => fetchRequestIntercept(intercept));
 }
 function fetchResponseIntercept(intercept) {
   const { fetch: originalFetch } = window;
@@ -246,23 +333,23 @@ function fetchRequestIntercept(intercept) {
 }
 
 // src/hooks/useMounted.ts
-var import_react9 = require("react");
+var import_react12 = require("react");
 function useMounted() {
-  const [mounted, setMounted] = (0, import_react9.useState)(false);
-  (0, import_react9.useEffect)(() => setMounted(true), []);
+  const [mounted, setMounted] = (0, import_react12.useState)(false);
+  (0, import_react12.useEffect)(() => setMounted(true), []);
   return mounted;
 }
 
 // src/hooks/useWatch.ts
-var import_react10 = require("react");
+var import_react13 = require("react");
 function useWatch(source, callback, options = {}) {
-  const firstUpdate = (0, import_react10.useRef)(false);
-  const then = (0, import_react10.useRef)();
-  const deps = (0, import_react10.useMemo)(
+  const firstUpdate = (0, import_react13.useRef)(false);
+  const then = (0, import_react13.useRef)();
+  const deps = (0, import_react13.useMemo)(
     () => Array.isArray(source) ? source : [source],
     [source]
   );
-  (0, import_react10.useEffect)(() => {
+  (0, import_react13.useEffect)(() => {
     if (!firstUpdate.current)
       recordFirst();
     else
@@ -287,14 +374,14 @@ function useWhenever(source, cb, options) {
 var hasOwn = {}.hasOwnProperty;
 function cls(...args) {
   let classes = "";
-  for (let i = 0; i < arguments.length; i++) {
-    const arg = arguments[i];
+  for (let i = 0; i < args.length; i++) {
+    const arg = args[i];
     if (arg)
-      classes = appendClass(classes, parseValue(arg));
+      classes = cls.append(classes, cls.parse(arg));
   }
   return classes;
 }
-function parseValue(arg) {
+cls.parse = function(arg) {
   if (typeof arg === "string")
     return arg;
   if (typeof arg !== "object")
@@ -306,15 +393,15 @@ function parseValue(arg) {
   let classes = "";
   for (const key in arg) {
     if (hasOwn.call(arg, key) && arg[key])
-      classes = appendClass(classes, key);
+      classes = cls.append(classes, key);
   }
   return classes;
-}
-function appendClass(value, newClass) {
+};
+cls.append = function(value, newClass) {
   if (!newClass)
     return value;
   return value ? `${value} ${newClass}` : newClass;
-}
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Case,

package/dist/index.d.ts

@@ -1,8 +1,7 @@
 import { BooleanLike } from '@hairy/utils';
 import * as react from 'react';
 import { ReactNode, PropsWithChildren, ReactElement, FC, ComponentClass, DependencyList, DetailedHTMLProps, HTMLAttributes } from 'react';
-import { FunctionReturningPromise, PromiseType } from 'react-use/lib/misc/types';
-import { AsyncState, AsyncFnReturn } from 'react-use/lib/useAsyncFn';
+import { FunctionReturningPromise as FunctionReturningPromise$1, PromiseType as PromiseType$1 } from './misc/types';
 
 interface CaseProps {
     cond?: BooleanLike;
@@ -55,6 +54,32 @@ declare function Trans({ i18nKey, ...additionalProps }: TransProps): ReactNode[]
 
 declare function useAsyncCallback<T extends (...args: any[]) => any>(fun: T): readonly [boolean, T, Error | undefined];
 
+declare type PromiseType<P extends Promise<any>> = P extends Promise<infer T> ? T : never;
+declare type FunctionReturningPromise = (...args: any[]) => Promise<any>;
+
+declare type AsyncState<T> = {
+    loading: boolean;
+    error?: undefined;
+    value?: undefined;
+} | {
+    loading: true;
+    error?: Error | undefined;
+    value?: T;
+} | {
+    loading: false;
+    error: Error;
+    value?: undefined;
+} | {
+    loading: false;
+    error?: undefined;
+    value: T;
+};
+declare type StateFromFunctionReturningPromise$1<T extends FunctionReturningPromise$1> = AsyncState<PromiseType$1<ReturnType<T>>>;
+declare type AsyncFnReturn<T extends FunctionReturningPromise$1 = FunctionReturningPromise$1> = [
+    StateFromFunctionReturningPromise$1<T>,
+    T
+];
+
 type StateFromFunctionReturningPromise<T extends FunctionReturningPromise> = AsyncState<PromiseType<ReturnType<T>>>;
 interface UseAsyncStateOptions<T extends FunctionReturningPromise> {
     immediate?: boolean;
@@ -107,5 +132,9 @@ type Argument = Value | Mapping | ArgumentArray | ReadonlyArgumentArray;
  * A simple JavaScript utility for conditionally joining classNames together.
  */
 declare function cls(...args: ArgumentArray): string;
+declare namespace cls {
+    var parse: (arg: any) => string;
+    var append: (value: any, newClass: any) => any;
+}
 
 export { type Argument, type ArgumentArray, Case, type CaseProps, Default, Else, type EventBusListener, type FetchRequestInterceptCallback, type FetchResponseInterceptCallback, If, type IfProps, type InjectComponent, Injector, type InjectorProps, type Mapping, type PropWithHtmlProps, type ReadonlyArgumentArray, type StateFromFunctionReturningPromise, Switch, type SwitchProps, Then, Trans, type TransProps, Unless, type UnlessProps, type UseAsyncStateOptions, type Value, type WatchCallback, type WatchOptions, cls, useAsyncCallback, useAsyncState, useDebounce, useEventBus, useFetchRequestIntercept, useFetchResponseIntercept, useMounted, useWatch, useWhenever };

package/dist/index.global.js

@@ -494,14 +494,14 @@ var LibReact = (() => {
   var hasOwn = {}.hasOwnProperty;
   function cls(...args) {
     let classes = "";
-    for (let i2 = 0; i2 < arguments.length; i2++) {
-      const arg = arguments[i2];
+    for (let i2 = 0; i2 < args.length; i2++) {
+      const arg = args[i2];
       if (arg)
-        classes = appendClass(classes, parseValue(arg));
+        classes = cls.append(classes, cls.parse(arg));
     }
     return classes;
   }
-  function parseValue(arg) {
+  cls.parse = function(arg) {
     if (typeof arg === "string")
       return arg;
     if (typeof arg !== "object")
@@ -513,14 +513,14 @@ var LibReact = (() => {
     let classes = "";
     for (const key in arg) {
       if (hasOwn.call(arg, key) && arg[key])
-        classes = appendClass(classes, key);
+        classes = cls.append(classes, key);
     }
     return classes;
-  }
-  function appendClass(value, newClass) {
+  };
+  cls.append = function(value, newClass) {
     if (!newClass)
       return value;
     return value ? `${value} ${newClass}` : newClass;
-  }
+  };
   return __toCommonJS(index_exports);
 })();

package/dist/index.js

@@ -1,3 +1,26 @@
+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/components/condition/Case.ts
 function Case(props) {
   return props.children;
@@ -117,19 +140,86 @@ function useAsyncCallback(fun) {
   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 value;
+    }, function(error) {
+      isMounted() && callId === lastCallId.current && set({ error, loading: false });
+      return error;
+    });
+  }, deps);
+  return [state, callback];
+}
+
+// ../../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";
+var useEffectOnce = function(effect) {
+  useEffect2(effect, []);
+};
+var useEffectOnce_default = useEffectOnce;
+
+// ../../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/useMount.js
+var useMount = function(fn) {
+  useEffectOnce_default(function() {
+    fn();
+  });
+};
+var useMount_default = useMount;
+
 // src/hooks/useAsyncState.ts
-import { useAsyncFn, useMount } from "react-use";
 function useAsyncState(fn, deps, options) {
   const [state, _fn] = useAsyncFn(fn, deps, options?.initial);
-  useMount(() => options?.immediate && _fn());
+  useMount_default(() => options?.immediate && _fn());
   return [state, _fn];
 }
 
 // src/hooks/useDebounce.ts
-import { useEffect, useState as useState2 } from "react";
+import { useEffect as useEffect3, useState as useState3 } from "react";
 function useDebounce(value, delay) {
-  const [debouncedValue, setDebouncedValue] = useState2(value);
-  useEffect(() => {
+  const [debouncedValue, setDebouncedValue] = useState3(value);
+  useEffect3(() => {
     const handler = setTimeout(() => setDebouncedValue(value), delay);
     return () => clearTimeout(handler);
   }, [value, delay]);
@@ -138,14 +228,14 @@ function useDebounce(value, delay) {
 
 // src/hooks/useEventBus.ts
 import mitt from "mitt";
-import { useEffect as useEffect2, useRef } from "react";
+import { useEffect as useEffect4, useRef as useRef3 } from "react";
 var emitter = mitt();
 function useEventBus(key) {
-  const onRef = useRef();
+  const onRef = useRef3();
   function on(listener) {
     emitter.on(key, listener);
     onRef.current = listener;
-    useEffect2(() => {
+    useEffect4(() => {
       if (!onRef.current)
         return;
       emitter.off(key, onRef.current);
@@ -168,12 +258,11 @@ function useEventBus(key) {
 }
 
 // src/hooks/useFetchIntercept.ts
-import { useMount as useMount2 } from "react-use";
 function useFetchResponseIntercept(intercept) {
-  useMount2(() => fetchResponseIntercept(intercept));
+  useMount_default(() => fetchResponseIntercept(intercept));
 }
 function useFetchRequestIntercept(intercept) {
-  useMount2(() => fetchRequestIntercept(intercept));
+  useMount_default(() => fetchRequestIntercept(intercept));
 }
 function fetchResponseIntercept(intercept) {
   const { fetch: originalFetch } = window;
@@ -192,23 +281,23 @@ function fetchRequestIntercept(intercept) {
 }
 
 // src/hooks/useMounted.ts
-import { useEffect as useEffect3, useState as useState3 } from "react";
+import { useEffect as useEffect5, useState as useState4 } from "react";
 function useMounted() {
-  const [mounted, setMounted] = useState3(false);
-  useEffect3(() => setMounted(true), []);
+  const [mounted, setMounted] = useState4(false);
+  useEffect5(() => setMounted(true), []);
   return mounted;
 }
 
 // src/hooks/useWatch.ts
-import { useEffect as useEffect4, useMemo as useMemo2, useRef as useRef2 } from "react";
+import { useEffect as useEffect6, useMemo as useMemo2, useRef as useRef4 } from "react";
 function useWatch(source, callback, options = {}) {
-  const firstUpdate = useRef2(false);
-  const then = useRef2();
+  const firstUpdate = useRef4(false);
+  const then = useRef4();
   const deps = useMemo2(
     () => Array.isArray(source) ? source : [source],
     [source]
   );
-  useEffect4(() => {
+  useEffect6(() => {
     if (!firstUpdate.current)
       recordFirst();
     else
@@ -233,14 +322,14 @@ function useWhenever(source, cb, options) {
 var hasOwn = {}.hasOwnProperty;
 function cls(...args) {
   let classes = "";
-  for (let i = 0; i < arguments.length; i++) {
-    const arg = arguments[i];
+  for (let i = 0; i < args.length; i++) {
+    const arg = args[i];
     if (arg)
-      classes = appendClass(classes, parseValue(arg));
+      classes = cls.append(classes, cls.parse(arg));
   }
   return classes;
 }
-function parseValue(arg) {
+cls.parse = function(arg) {
   if (typeof arg === "string")
     return arg;
   if (typeof arg !== "object")
@@ -252,15 +341,15 @@ function parseValue(arg) {
   let classes = "";
   for (const key in arg) {
     if (hasOwn.call(arg, key) && arg[key])
-      classes = appendClass(classes, key);
+      classes = cls.append(classes, key);
   }
   return classes;
-}
-function appendClass(value, newClass) {
+};
+cls.append = function(value, newClass) {
   if (!newClass)
     return value;
   return value ? `${value} ${newClass}` : newClass;
-}
+};
 export {
   Case,
   Default,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@hairy/react-lib",
   "type": "module",
-  "version": "1.6.1",
+  "version": "1.7.0",
   "description": "Library for react",
   "author": "Hairyf <wwu710632@gmail.com>",
   "license": "MIT",
@@ -29,16 +29,16 @@
   "dependencies": {
     "html-parse-stringify": "^3.0.1",
     "mitt": "^3.0.1",
-    "react-use": "^17.6.0"
+    "valtio": "^2"
   },
   "devDependencies": {
-    "@types/node": "^20.11.7",
     "@types/react": "^18.2.43",
     "@types/react-dom": "^18.2.17",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-i18next": "^14.1.2",
-    "@hairy/utils": "1.6.1"
+    "react-use": "^17.6.0",
+    "@hairy/utils": "1.7.0"
   },
   "scripts": {
     "build": "tsup",