@sohanemon/utils 4.0.17 → 4.0.20

package/dist/components/media-wrapper.d.ts

@@ -6,5 +6,5 @@ type MediaWrapperProps = React.ComponentProps<'div'> & {
     fallback?: React.ElementType;
     classNameFallback?: string;
 };
-export declare function MediaWrapper({ breakpoint, as, fallback, classNameFallback, className: classNameOriginal, ...props }: MediaWrapperProps): any;
+export declare function MediaWrapper({ breakpoint, as, fallback, classNameFallback, className: classNameOriginal, ...props }: MediaWrapperProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/hooks/index.d.ts

@@ -1,10 +1,10 @@
-import { type Dispatch, type EffectCallback, type SetStateAction } from 'react';
-export declare const useClickOutside: (callback?: () => void) => any;
-export declare function useMediaQuery(tailwindBreakpoint: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | `(${string})`): any;
+import { type Dispatch, type EffectCallback, type SetStateAction, useEffect } from 'react';
+export declare const useClickOutside: (callback?: () => void) => import("react").MutableRefObject<HTMLDivElement>;
+export declare function useMediaQuery(tailwindBreakpoint: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | `(${string})`): boolean;
 export declare function useEffectOnce(effect: EffectCallback): void;
 export declare function useUpdateEffect(effect: EffectCallback, deps: any[]): void;
 export declare function useDebounce<T>(state: T, delay?: number): T;
-export declare const useIsomorphicEffect: any;
+export declare const useIsomorphicEffect: typeof useEffect;
 export declare function useTimeout(callback: () => void, delay?: number | null): void;
 export declare function useWindowEvent<K extends string = keyof WindowEventMap>(type: K, listener: K extends keyof WindowEventMap ? (this: Window, ev: WindowEventMap[K]) => void : (this: Window, ev: CustomEvent) => void, options?: boolean | AddEventListenerOptions): void;
 type LocalStorageValue<T> = [T, Dispatch<SetStateAction<T>>];
@@ -21,9 +21,11 @@ interface UseAsyncOptions<T extends (...args: any) => any> {
     mode?: 'onLoad' | 'onTrigger';
 }
 export declare const useAsync: <T extends (...args: any) => any>(fn: T, opts?: UseAsyncOptions<T>) => {
-    execute: any;
-    isLoading: any;
-    result: any;
-    error: any;
+    execute: (args: Parameters<T>[0]) => Promise<void>;
+    isLoading: boolean;
+    result: Awaited<ReturnType<T>>;
+    error: Error;
 };
+export declare const useQuerySelector: <T extends Element>(selector: string) => T | null;
+export declare function useIsClient(): boolean;
 export {};

package/dist/hooks/index.js

@@ -44,6 +44,7 @@ export function useMediaQuery(tailwindBreakpoint) {
     function handleChange() {
         setMatches(getMatches(parsedQuery));
     }
+    // biome-ignore lint/correctness/useExhaustiveDependencies: <explanation>
     useEffect(() => {
         const matchMedia = window.matchMedia(parsedQuery);
         handleChange();
@@ -59,6 +60,7 @@ export function useEffectOnce(effect) {
 }
 export function useUpdateEffect(effect, deps) {
     const isInitialMount = useRef(true);
+    // biome-ignore lint/correctness/useExhaustiveDependencies: <explanation>
     useEffect(() => {
         if (isInitialMount.current) {
             isInitialMount.current = false;
@@ -66,7 +68,6 @@ export function useUpdateEffect(effect, deps) {
         else {
             return effect();
         }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
     }, deps);
 }
 export function useDebounce(state, delay = 500) {
@@ -94,6 +95,7 @@ export function useTimeout(callback, delay = 1000) {
     }, [delay]);
 }
 export function useWindowEvent(type, listener, options) {
+    // biome-ignore lint/correctness/useExhaustiveDependencies: <explanation>
     useEffect(() => {
         window.addEventListener(type, listener, options);
         return () => window.removeEventListener(type, listener, options);
@@ -111,6 +113,7 @@ export const useLocalStorage = (key, defaultValue) => {
     }, [key]);
     // Function to update the stored value in local storage and state
     const updateStoredValue = (valueOrFn) => {
+        // biome-ignore lint/suspicious/noImplicitAnyLet: <explanation>
         let newValue;
         if (typeof valueOrFn === 'function') {
             const updateFunction = valueOrFn;
@@ -145,7 +148,7 @@ export const useUrlParams = (key, defaultValue) => {
     return [value, updateValue];
 };
 export const useAsync = (fn, opts = {}) => {
-    const { initialArgs, callback = {}, mode = "onTrigger" } = opts;
+    const { initialArgs, callback = {}, mode = 'onTrigger' } = opts;
     const { onSuccess, onError, onExecute, onSettle } = callback;
     const [isLoading, setIsLoading] = useState(false);
     const [result, setValue] = useState(null);
@@ -157,10 +160,12 @@ export const useAsync = (fn, opts = {}) => {
         setError(null);
         onExecute?.();
         try {
-            startTransition(async () => {
-                const response = await fn(args);
-                setValue(response);
-                onSuccess?.(response);
+            startTransition(() => {
+                (async () => {
+                    const response = await fn(args);
+                    setValue(response);
+                    onSuccess?.(response);
+                })();
             });
         }
         catch (error) {
@@ -172,7 +177,7 @@ export const useAsync = (fn, opts = {}) => {
             onSettle?.();
         }
     }, [fn, onExecute, onSuccess, onError, onSettle]);
-    useEffect(() => {
+    useIsomorphicEffect(() => {
         if (mode === 'onLoad') {
             execute(initialArgs);
         }
@@ -184,3 +189,35 @@ export const useAsync = (fn, opts = {}) => {
         error,
     };
 };
+export const useQuerySelector = (selector) => {
+    const [element, setElement] = useState(null);
+    const elementRef = useRef(null);
+    useLayoutEffect(() => {
+        const referenceElement = document.querySelector(selector);
+        if (!referenceElement)
+            return;
+        if (elementRef.current !== referenceElement) {
+            elementRef.current = referenceElement;
+            setElement(referenceElement);
+        }
+        const resizeObserver = new ResizeObserver(() => {
+            // Only update state if the element reference changes
+            if (elementRef.current !== referenceElement) {
+                elementRef.current = referenceElement;
+                setElement(referenceElement);
+            }
+        });
+        resizeObserver.observe(referenceElement);
+        return () => {
+            resizeObserver.disconnect();
+        };
+    }, [selector]);
+    return element;
+};
+export function useIsClient() {
+    const [isClient, setIsClient] = useState(false);
+    useEffect(() => {
+        setIsClient(true);
+    }, []);
+    return isClient;
+}

package/package.json

@@ -1,6 +1,7 @@
 {
   "name": "@sohanemon/utils",
-  "version": "4.0.17",
+  "version": "4.0.20",
+  "author": "Sohan Emon <sohanemon@outlook.com>",
   "description": "",
   "type": "module",
   "source": "./src/index.ts",
@@ -38,15 +39,16 @@
     "utils",
     "cn"
   ],
-  "author": "sohanemon",
   "license": "ISC",
   "devDependencies": {
-    "typescript": "^5.2.2"
+    "@types/node": "^22.4.0",
+    "@types/react": "^18.3.3",
+    "typescript": "^5.5.4"
   },
   "dependencies": {
     "@iconify/react": "^4.1.1",
-    "clsx": "^2.0.0",
-    "react": "^18.2.0",
+    "clsx": "^2.1.1",
+    "react": "^18.3.1",
     "tailwind-merge": "^1.14.0"
   }
 }