@aiszlab/relax 1.2.29 → 1.2.30

package/dist/hooks/use-debounce-callback.d.ts

@@ -1,4 +1,5 @@
-import { type Debounced } from '../utils/debounce';
+import { type Debounced, type Debouncer } from '../utils/debounce';
+import { type Callable } from './use-event';
 /**
  * @author murukal
  *
@@ -14,4 +15,4 @@ import { type Debounced } from '../utils/debounce';
  * @example
  * 1000
  */
-export declare const useDebounceCallback: <T extends Function>(callback: T, wait?: number) => Debounced<T>;
+export declare const useDebounceCallback: <T extends Callable, R extends unknown[] = Parameters<T>>(debouncer: T | Debouncer<T, R>, wait?: number) => Debounced<T>;

package/dist/hooks/use-debounce-callback.mjs

@@ -1,7 +1,23 @@
 import { useRef, useEffect, useMemo } from 'react';
 import { debounce } from '../utils/debounce.mjs';
 import { useEvent } from './use-event.mjs';
+import { isFunction } from '../is/is-function.mjs';
+import { useDefault } from './use-default.mjs';
 
+const useDebouncer = (debouncer) => {
+    const _debouncer = useMemo(() => {
+        return isFunction(debouncer) ? { callback: debouncer, pipeable: null } : debouncer;
+    }, [debouncer]);
+    return {
+        callback: useEvent((...args) => {
+            return _debouncer.callback(...args);
+        }),
+        pipeable: useEvent((...args) => {
+            var _a, _b;
+            return (_b = (_a = _debouncer.pipeable) === null || _a === void 0 ? void 0 : _a.call(_debouncer, ...args)) !== null && _b !== void 0 ? _b : args;
+        })
+    };
+};
 /**
  * @author murukal
  *
@@ -17,24 +33,26 @@ import { useEvent } from './use-event.mjs';
  * @example
  * 1000
  */
-const useDebounceCallback = (callback, wait = 1000) => {
-    const trigger = useRef(null);
-    const callable = useEvent(callback);
+const useDebounceCallback = (debouncer, wait = 1000) => {
+    const debounced = useRef(null);
+    const { callback, pipeable } = useDebouncer(debouncer);
     useEffect(() => {
-        const debounced = debounce(callable, wait);
-        trigger.current = debounced;
+        const _debounced = debounce({
+            callback,
+            pipeable
+        }, wait);
+        debounced.current = _debounced;
         // dispose
         return () => {
-            debounced.cancel();
-            trigger.current = null;
+            _debounced.abort();
+            debounced.current = null;
         };
     }, [wait]);
-    const debounced = useMemo(() => ({
-        next: (value) => { var _a; return (_a = trigger.current) === null || _a === void 0 ? void 0 : _a.next(value); },
-        complete: () => { var _a; return (_a = trigger.current) === null || _a === void 0 ? void 0 : _a.complete(); },
-        cancel: () => { var _a; return (_a = trigger.current) === null || _a === void 0 ? void 0 : _a.cancel(); }
-    }), []);
-    return debounced;
+    return useDefault(() => ({
+        next: (...args) => { var _a; return (_a = debounced.current) === null || _a === void 0 ? void 0 : _a.next(...args); },
+        flush: () => { var _a; return (_a = debounced.current) === null || _a === void 0 ? void 0 : _a.flush(); },
+        abort: () => { var _a; return (_a = debounced.current) === null || _a === void 0 ? void 0 : _a.abort(); }
+    }));
 };
 
 export { useDebounceCallback };

package/dist/hooks/use-event.d.ts

@@ -1 +1,2 @@
-export declare const useEvent: <T extends Function>(callback: T) => T;
+export type Callable = (...args: any) => any;
+export declare const useEvent: <T extends Callable>(callback: T) => T;

package/dist/hooks/use-event.mjs

@@ -3,7 +3,8 @@ import { useRef, useCallback } from 'react';
 const useEvent = (callback) => {
     const ref = useRef(callback);
     ref.current = callback;
-    return useCallback(((...args) => ref.current(...args)), []);
+    // @ts-ignore
+    return useCallback((...args) => ref.current(...args), []);
 };
 
 export { useEvent };

package/dist/hooks/use-focus.d.ts

@@ -11,5 +11,5 @@ type Props<T> = Pick<DOMAttributes<T>, 'onFocus' | 'onBlur'> & {
  * dom attributes
  */
 type UsedFocus<T> = [boolean, Required<Pick<DOMAttributes<T>, 'onFocus' | 'onBlur'>>];
-export declare const useFocus: <T extends Element = Element>(props?: Props<T> | undefined) => UsedFocus<T>;
+export declare const useFocus: <T extends Element = Element>(props?: Props<T>) => UsedFocus<T>;
 export {};

package/dist/hooks/use-hover.d.ts

@@ -4,5 +4,5 @@ type UseHoverBy<T> = {
     onLeave?: DOMAttributes<T>['onPointerLeave'];
 };
 type UsedHover<T> = [boolean, Required<Pick<DOMAttributes<T>, 'onPointerEnter' | 'onPointerLeave'>>];
-export declare const useHover: <T extends Element = Element>(props?: UseHoverBy<T> | undefined) => UsedHover<T>;
+export declare const useHover: <T extends Element = Element>(props?: UseHoverBy<T>) => UsedHover<T>;
 export {};

package/dist/hooks/use-throttle-callback.d.ts

@@ -1,4 +1,5 @@
-import { type Throttled } from '../utils/throttle';
+import { type Throttler, type Throttled } from '../utils/throttle';
+import { type Callable } from './use-event';
 /**
  * @author murukal
  *
@@ -14,4 +15,4 @@ import { type Throttled } from '../utils/throttle';
  * @example
  * 1000
  */
-export declare const useThrottleCallback: <T extends Function>(callback: T, duration?: number) => Throttled<T>;
+export declare const useThrottleCallback: <T extends Callable, R extends unknown[] = Parameters<T>>(throttler: T | Throttler<T, R>, duration?: number) => Throttled<T>;

package/dist/hooks/use-throttle-callback.mjs

@@ -1,7 +1,23 @@
 import { useRef, useEffect, useMemo } from 'react';
 import { throttle } from '../utils/throttle.mjs';
 import { useEvent } from './use-event.mjs';
+import { isFunction } from '../is/is-function.mjs';
+import { useDefault } from './use-default.mjs';
 
+const useThrottler = (debouncer) => {
+    const _debouncer = useMemo(() => {
+        return isFunction(debouncer) ? { callback: debouncer, pipeable: null } : debouncer;
+    }, [debouncer]);
+    return {
+        callback: useEvent((...args) => {
+            return _debouncer.callback(...args);
+        }),
+        pipeable: useEvent((...args) => {
+            var _a, _b;
+            return (_b = (_a = _debouncer.pipeable) === null || _a === void 0 ? void 0 : _a.call(_debouncer, ...args)) !== null && _b !== void 0 ? _b : args;
+        })
+    };
+};
 /**
  * @author murukal
  *
@@ -17,24 +33,26 @@ import { useEvent } from './use-event.mjs';
  * @example
  * 1000
  */
-const useThrottleCallback = (callback, duration = 1000) => {
-    const trigger = useRef(null);
-    const callable = useEvent(callback);
+const useThrottleCallback = (throttler, duration = 1000) => {
+    const throttled = useRef(null);
+    const { callback, pipeable } = useThrottler(throttler);
     useEffect(() => {
-        const throttled = throttle(callable, duration);
-        trigger.current = throttled;
+        const _throttled = throttle({
+            callback,
+            pipeable
+        }, duration);
+        throttled.current = _throttled;
         // dispose
         return () => {
-            throttled.cancel();
-            trigger.current = null;
+            _throttled.abort();
+            throttled.current = null;
         };
     }, [duration]);
-    const throttled = useMemo(() => ({
-        next: (value) => { var _a; return (_a = trigger.current) === null || _a === void 0 ? void 0 : _a.next(value); },
-        complete: () => { var _a; return (_a = trigger.current) === null || _a === void 0 ? void 0 : _a.complete(); },
-        cancel: () => { var _a; return (_a = trigger.current) === null || _a === void 0 ? void 0 : _a.cancel(); }
-    }), []);
-    return throttled;
+    return useDefault(() => ({
+        next: (...args) => { var _a; return (_a = throttled.current) === null || _a === void 0 ? void 0 : _a.next(...args); },
+        flush: () => { var _a; return (_a = throttled.current) === null || _a === void 0 ? void 0 : _a.flush(); },
+        abort: () => { var _a; return (_a = throttled.current) === null || _a === void 0 ? void 0 : _a.abort(); }
+    }));
 };
 
 export { useThrottleCallback };

package/dist/types/index.d.ts

@@ -1,4 +1,3 @@
-export type { Arguments } from './arguments';
 export type { Nullable } from './nullable';
 export type { Partialable } from './partialable';
 export type { Voidable } from './voidable';

package/dist/utils/debounce.d.ts

@@ -1,30 +1,56 @@
-import { type Subscriber } from 'rxjs';
-import type { Arguments, First } from '../types';
-export interface Debounced<T extends Function> {
+import { type Nullable } from '../types';
+import { type Callable } from '../hooks/use-event';
+type Type = 'debounce' | 'throttle';
+export interface Debounced<T extends Callable> {
     /**
      * @description
      * value trigger
      */
-    next: (value: First<Arguments<T>>) => void;
+    next: (...args: Parameters<T>) => void;
     /**
      * @description
-     * complete current debounce function
-     * this function will not be usable
+     * complete current debounce/throttle function
      */
-    complete: () => void;
+    flush: () => void;
     /**
      * @description
      * ignore any value after call cancel
-     * this function will not be usable
      */
-    cancel: () => void;
+    abort: () => void;
 }
-export declare class Trigger<T> {
+export type Debouncer<T extends Callable, R extends Array<unknown> = Parameters<T>> = {
+    callback: (...args: R) => ReturnType<T>;
+    pipeable: Nullable<(...args: Parameters<T>) => R | Promise<R>>;
+};
+export declare class Trigger<T extends Callable, R extends Array<unknown> = Parameters<T>> {
     #private;
-    constructor();
-    set use(subscriber: Subscriber<T>);
-    next(value: T): void;
-    error(error?: unknown): void;
-    complete(): void;
+    constructor(debouncer: Debouncer<T, R>, wait: number, type?: Type);
+    /**
+     * @description
+     * create observable
+     * used for debounce/throttle handler
+     */
+    use(): this;
+    /**
+     * @description
+     * flush
+     * complete all debounced handlers
+     * in relax, we will create a new observable for next debounce/throttle handler
+     * so it will make some async problems, pls attention
+     */
+    flush(): void;
+    /**
+     * @description
+     * abort
+     * cancel all debounced handlers
+     * in relax, we will create a new observable for next debounce/throttle handler
+     */
+    abort(): void;
+    /**
+     * @description
+     * trigger value
+     */
+    next(...args: Parameters<T>): void;
 }
-export declare const debounce: <T extends Function>(callback: T, wait: number) => Debounced<T>;
+export declare const debounce: <T extends Callable, R extends unknown[] = Parameters<T>>(debouncer: Debouncer<T, R> | T, wait: number) => Debounced<T>;
+export {};

package/dist/utils/debounce.mjs

@@ -1,51 +1,84 @@
 import { __classPrivateFieldSet, __classPrivateFieldGet } from '../node_modules/tslib/tslib.es6.mjs';
-import { Observable, debounceTime } from 'rxjs';
+import { Observable, debounceTime, throttleTime, concatMap, from } from 'rxjs';
+import { isFunction } from '../is/is-function.mjs';
 
-var _Trigger_next, _Trigger_error, _Trigger_complete;
+var _Trigger_subscriber, _Trigger_subscription, _Trigger_callback, _Trigger_pipeable, _Trigger_wait, _Trigger_type;
 class Trigger {
-    constructor() {
-        _Trigger_next.set(this, void 0);
-        _Trigger_error.set(this, void 0);
-        _Trigger_complete.set(this, void 0);
-        __classPrivateFieldSet(this, _Trigger_next, null, "f");
-        __classPrivateFieldSet(this, _Trigger_error, null, "f");
-        __classPrivateFieldSet(this, _Trigger_complete, null, "f");
+    constructor(debouncer, wait, type = 'debounce') {
+        var _a;
+        _Trigger_subscriber.set(this, void 0);
+        _Trigger_subscription.set(this, void 0);
+        _Trigger_callback.set(this, void 0);
+        _Trigger_pipeable.set(this, void 0);
+        _Trigger_wait.set(this, void 0);
+        _Trigger_type.set(this, void 0);
+        __classPrivateFieldSet(this, _Trigger_subscriber, null, "f");
+        __classPrivateFieldSet(this, _Trigger_subscription, null, "f");
+        __classPrivateFieldSet(this, _Trigger_callback, debouncer.callback, "f");
+        __classPrivateFieldSet(this, _Trigger_pipeable, (_a = debouncer.pipeable) !== null && _a !== void 0 ? _a : ((...args) => args), "f");
+        __classPrivateFieldSet(this, _Trigger_wait, wait, "f");
+        __classPrivateFieldSet(this, _Trigger_type, type, "f");
     }
-    set use(subscriber) {
-        __classPrivateFieldSet(this, _Trigger_next, (value) => subscriber.next(value), "f");
-        __classPrivateFieldSet(this, _Trigger_error, (error) => subscriber.error(error), "f");
-        __classPrivateFieldSet(this, _Trigger_complete, () => subscriber.complete(), "f");
+    /**
+     * @description
+     * create observable
+     * used for debounce/throttle handler
+     */
+    use() {
+        __classPrivateFieldSet(this, _Trigger_subscription, new Observable((subscriber) => {
+            __classPrivateFieldSet(this, _Trigger_subscriber, subscriber, "f");
+        })
+            .pipe(__classPrivateFieldGet(this, _Trigger_type, "f") === 'debounce' ? debounceTime(__classPrivateFieldGet(this, _Trigger_wait, "f")) : throttleTime(__classPrivateFieldGet(this, _Trigger_wait, "f")), concatMap((args) => from(Promise.resolve(__classPrivateFieldGet(this, _Trigger_pipeable, "f").call(this, ...args)))))
+            .subscribe((args) => {
+            var _a;
+            (_a = __classPrivateFieldGet(this, _Trigger_callback, "f")) === null || _a === void 0 ? void 0 : _a.call(this, ...args);
+        }), "f");
+        return this;
     }
-    next(value) {
+    /**
+     * @description
+     * flush
+     * complete all debounced handlers
+     * in relax, we will create a new observable for next debounce/throttle handler
+     * so it will make some async problems, pls attention
+     */
+    flush() {
         var _a;
-        (_a = __classPrivateFieldGet(this, _Trigger_next, "f")) === null || _a === void 0 ? void 0 : _a.call(this, value);
+        (_a = __classPrivateFieldGet(this, _Trigger_subscriber, "f")) === null || _a === void 0 ? void 0 : _a.complete();
+        this.use();
     }
-    error(error) {
-        var _a;
-        (_a = __classPrivateFieldGet(this, _Trigger_error, "f")) === null || _a === void 0 ? void 0 : _a.call(this, error);
+    /**
+     * @description
+     * abort
+     * cancel all debounced handlers
+     * in relax, we will create a new observable for next debounce/throttle handler
+     */
+    abort() {
+        var _a, _b;
+        (_a = __classPrivateFieldGet(this, _Trigger_subscription, "f")) === null || _a === void 0 ? void 0 : _a.unsubscribe();
+        (_b = __classPrivateFieldGet(this, _Trigger_subscriber, "f")) === null || _b === void 0 ? void 0 : _b.error();
+        this.use();
     }
-    complete() {
+    /**
+     * @description
+     * trigger value
+     */
+    next(...args) {
         var _a;
-        (_a = __classPrivateFieldGet(this, _Trigger_complete, "f")) === null || _a === void 0 ? void 0 : _a.call(this);
+        (_a = __classPrivateFieldGet(this, _Trigger_subscriber, "f")) === null || _a === void 0 ? void 0 : _a.next(args);
     }
 }
-_Trigger_next = new WeakMap(), _Trigger_error = new WeakMap(), _Trigger_complete = new WeakMap();
-const debounce = (callback, wait) => {
-    const trigger = new Trigger();
-    const listened = new Observable((subscriber) => {
-        trigger.use = subscriber;
-    })
-        .pipe(debounceTime(wait))
-        .subscribe((value) => {
-        callback(value);
-    });
+_Trigger_subscriber = new WeakMap(), _Trigger_subscription = new WeakMap(), _Trigger_callback = new WeakMap(), _Trigger_pipeable = new WeakMap(), _Trigger_wait = new WeakMap(), _Trigger_type = new WeakMap();
+const debounce = (debouncer, wait) => {
+    const _isFunction = isFunction(debouncer);
+    const trigger = new Trigger({
+        callback: _isFunction ? debouncer : debouncer.callback,
+        pipeable: _isFunction ? null : debouncer.pipeable
+    }, wait).use();
     return {
-        next: (value) => trigger.next(value),
-        complete: () => trigger.complete(),
-        cancel: () => {
-            listened.unsubscribe();
-            trigger.error();
-        }
+        next: (...args) => trigger.next(...args),
+        flush: () => trigger.flush(),
+        abort: () => trigger.abort()
     };
 };
 

package/dist/utils/throttle.d.ts

@@ -1,3 +1,5 @@
-import { type Debounced } from './debounce';
-export type Throttled<T extends Function> = Debounced<T>;
-export declare const throttle: <T extends Function>(callback: T, duration: number) => Throttled<T>;
+import { type Debounced, type Debouncer } from './debounce';
+import { type Callable } from '../hooks/use-event';
+export type Throttled<T extends Callable> = Debounced<T>;
+export type Throttler<T extends Callable, R extends Array<unknown> = Parameters<T>> = Debouncer<T, R>;
+export declare const throttle: <T extends Callable, R extends unknown[] = Parameters<T>>(throttler: Throttler<T, R> | T, duration: number) => Throttled<T>;

package/dist/utils/throttle.mjs

@@ -1,22 +1,16 @@
-import { Observable, throttleTime } from 'rxjs';
 import { Trigger } from './debounce.mjs';
+import { isFunction } from '../is/is-function.mjs';
 
-const throttle = (callback, duration) => {
-    const trigger = new Trigger();
-    const listened = new Observable((subscriber) => {
-        trigger.use = subscriber;
-    })
-        .pipe(throttleTime(duration))
-        .subscribe((value) => {
-        callback(value);
-    });
+const throttle = (throttler, duration) => {
+    const _isFunction = isFunction(throttler);
+    const trigger = new Trigger({
+        callback: _isFunction ? throttler : throttler.callback,
+        pipeable: _isFunction ? null : throttler.pipeable
+    }, duration, 'throttle').use();
     return {
-        next: (value) => trigger.next(value),
-        complete: () => trigger.complete(),
-        cancel: () => {
-            listened.unsubscribe();
-            trigger.error();
-        }
+        next: (...args) => trigger.next(...args),
+        flush: () => trigger.flush(),
+        abort: () => trigger.abort()
     };
 };
 

package/dist/utils/to-array.d.ts

@@ -2,4 +2,4 @@
  * @description
  * convert any type data to a array
  */
-export declare const toArray: <T extends unknown[]>(value: unknown) => T;
+export declare const toArray: <T extends unknown = unknown>(value: T | Array<T>) => Array<T>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aiszlab/relax",
-  "version": "1.2.29",
+  "version": "1.2.30",
   "description": "react utils collection",
   "type": "module",
   "exports": {
@@ -25,7 +25,7 @@
     "rxjs": "^7.8.1"
   },
   "devDependencies": {
-    "@babel/core": "^7.22.5",
+    "@babel/core": "^7.24.0",
     "@babel/preset-env": "^7.24.0",
     "@babel/preset-typescript": "^7.22.5",
     "@rollup/plugin-babel": "^6.0.3",
@@ -34,8 +34,8 @@
     "@types/react": "^18",
     "@types/react-dom": "^18",
     "@types/react-is": "^18",
-    "rollup": "^4.12.0",
-    "typescript": "^5.1.3"
+    "rollup": "^4.13.0",
+    "typescript": "^5.4.2"
   },
   "peerDependencies": {
     "react": "^18",
@@ -53,5 +53,6 @@
   "publishConfig": {
     "access": "public",
     "registry": "https://registry.npmjs.org/"
-  }
+  },
+  "homepage": "https://aisz.dev/hooks"
 }

package/dist/types/arguments.d.ts

@@ -1 +0,0 @@
-export type Arguments<T extends Function> = T extends (...args: infer A) => unknown ? A : [];