@teo-garcia/react-shared 0.1.9 → 1.2.0

package/dist/hooks/index.js

@@ -1,4 +1,15 @@
-/**
- * Hooks - Reusable React hooks for common functionality
- */
-export { useHealthcheck } from './use-healthcheck.js';
+export { useCopyToClipboard } from './use-copy-to-clipboard.js';
+export { useDebounce } from './use-debounce.js';
+export { useEventListener } from './use-event-listener.js';
+export { useIdle } from './use-idle.js';
+export { useIntersectionObserver } from './use-intersection-observer.js';
+export { useIsomorphicLayoutEffect } from './use-isomorphic-layout-effect.js';
+export { useLatest } from './use-latest.js';
+export { useLocalStorage } from './use-local-storage.js';
+export { useMediaQuery } from './use-media-query.js';
+export { useNetworkStatus } from './use-network-status.js';
+export { useOnClickOutside } from './use-on-click-outside.js';
+export { usePrevious } from './use-previous.js';
+export { useRenderCount } from './use-render-count.js';
+export { useToggle } from './use-toggle.js';
+export { useWhyDidYouRender } from './use-why-did-you-render.js';

package/dist/hooks/use-copy-to-clipboard.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Returns `[copied, copy]`.
+ * `copy(text)` writes to the clipboard and returns a boolean indicating success.
+ * `copied` resets to `false` after `resetDelay` ms.
+ */
+export declare function useCopyToClipboard(resetDelay?: number): [boolean, (text: string) => Promise<boolean>];
+//# sourceMappingURL=use-copy-to-clipboard.d.ts.map

package/dist/hooks/use-copy-to-clipboard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-copy-to-clipboard.d.ts","sourceRoot":"","sources":["../../src/hooks/use-copy-to-clipboard.ts"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,wBAAgB,kBAAkB,CAChC,UAAU,SAAO,GAChB,CAAC,OAAO,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC,CAoB/C"}

package/dist/hooks/use-copy-to-clipboard.js

@@ -0,0 +1,23 @@
+import { useCallback, useState } from 'react';
+/**
+ * Returns `[copied, copy]`.
+ * `copy(text)` writes to the clipboard and returns a boolean indicating success.
+ * `copied` resets to `false` after `resetDelay` ms.
+ */
+export function useCopyToClipboard(resetDelay = 2000) {
+    const [copied, setCopied] = useState(false);
+    const copy = useCallback(async (text) => {
+        if (!navigator.clipboard)
+            return false;
+        try {
+            await navigator.clipboard.writeText(text);
+            setCopied(true);
+            setTimeout(() => setCopied(false), resetDelay);
+            return true;
+        }
+        catch {
+            return false;
+        }
+    }, [resetDelay]);
+    return [copied, copy];
+}

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

@@ -0,0 +1,2 @@
+export declare function useDebounce<T>(value: T, delay: number): T;
+//# sourceMappingURL=use-debounce.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"use-debounce.d.ts","sourceRoot":"","sources":["../../src/hooks/use-debounce.ts"],"names":[],"mappings":"AAEA,wBAAgB,WAAW,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,GAAG,CAAC,CASzD"}

package/dist/hooks/use-debounce.js

@@ -0,0 +1,9 @@
+import { useEffect, useState } from 'react';
+export function useDebounce(value, delay) {
+    const [debouncedValue, setDebouncedValue] = useState(value);
+    useEffect(() => {
+        const timer = setTimeout(() => setDebouncedValue(value), delay);
+        return () => clearTimeout(timer);
+    }, [value, delay]);
+    return debouncedValue;
+}

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

@@ -0,0 +1,4 @@
+export declare function useEventListener<K extends keyof WindowEventMap>(target: Window | null, event: K, handler: (event: WindowEventMap[K]) => void, options?: AddEventListenerOptions): void;
+export declare function useEventListener<K extends keyof DocumentEventMap>(target: Document | null, event: K, handler: (event: DocumentEventMap[K]) => void, options?: AddEventListenerOptions): void;
+export declare function useEventListener<K extends keyof HTMLElementEventMap, T extends HTMLElement>(target: T | null, event: K, handler: (event: HTMLElementEventMap[K]) => void, options?: AddEventListenerOptions): void;
+//# sourceMappingURL=use-event-listener.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"use-event-listener.d.ts","sourceRoot":"","sources":["../../src/hooks/use-event-listener.ts"],"names":[],"mappings":"AAKA,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,MAAM,cAAc,EAC7D,MAAM,EAAE,MAAM,GAAG,IAAI,EACrB,KAAK,EAAE,CAAC,EACR,OAAO,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC,CAAC,CAAC,KAAK,IAAI,EAC3C,OAAO,CAAC,EAAE,uBAAuB,GAChC,IAAI,CAAA;AACP,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,MAAM,gBAAgB,EAC/D,MAAM,EAAE,QAAQ,GAAG,IAAI,EACvB,KAAK,EAAE,CAAC,EACR,OAAO,EAAE,CAAC,KAAK,EAAE,gBAAgB,CAAC,CAAC,CAAC,KAAK,IAAI,EAC7C,OAAO,CAAC,EAAE,uBAAuB,GAChC,IAAI,CAAA;AACP,wBAAgB,gBAAgB,CAC9B,CAAC,SAAS,MAAM,mBAAmB,EACnC,CAAC,SAAS,WAAW,EAErB,MAAM,EAAE,CAAC,GAAG,IAAI,EAChB,KAAK,EAAE,CAAC,EACR,OAAO,EAAE,CAAC,KAAK,EAAE,mBAAmB,CAAC,CAAC,CAAC,KAAK,IAAI,EAChD,OAAO,CAAC,EAAE,uBAAuB,GAChC,IAAI,CAAA"}

package/dist/hooks/use-event-listener.js

@@ -0,0 +1,13 @@
+import { useEffect } from 'react';
+import { useLatest } from './use-latest.js';
+export function useEventListener(target, event, handler, options) {
+    const handlerRef = useLatest(handler);
+    useEffect(() => {
+        if (!target)
+            return;
+        const listener = (e) => handlerRef.current(e);
+        target.addEventListener(event, listener, options);
+        return () => target.removeEventListener(event, listener, options);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [target, event, JSON.stringify(options)]);
+}

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

@@ -0,0 +1,7 @@
+/**
+ * Returns `true` when the user has been inactive for longer than `timeout` ms.
+ * Resets on any mouse, keyboard, touch, or scroll event.
+ * Use for session-expiry warnings, pausing background work, or screensaver effects.
+ */
+export declare function useIdle(timeout: number): boolean;
+//# sourceMappingURL=use-idle.d.ts.map

package/dist/hooks/use-idle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-idle.d.ts","sourceRoot":"","sources":["../../src/hooks/use-idle.ts"],"names":[],"mappings":"AAWA;;;;GAIG;AACH,wBAAgB,OAAO,CAAC,OAAO,EAAE,MAAM,GAAG,OAAO,CAyBhD"}

package/dist/hooks/use-idle.js

@@ -0,0 +1,35 @@
+import { useEffect, useState } from 'react';
+const ACTIVITY_EVENTS = [
+    'mousemove',
+    'keydown',
+    'mousedown',
+    'touchstart',
+    'scroll',
+    'wheel',
+];
+/**
+ * Returns `true` when the user has been inactive for longer than `timeout` ms.
+ * Resets on any mouse, keyboard, touch, or scroll event.
+ * Use for session-expiry warnings, pausing background work, or screensaver effects.
+ */
+export function useIdle(timeout) {
+    const [idle, setIdle] = useState(false);
+    useEffect(() => {
+        let timer = setTimeout(() => setIdle(true), timeout);
+        function handleActivity() {
+            clearTimeout(timer);
+            setIdle(false);
+            timer = setTimeout(() => setIdle(true), timeout);
+        }
+        for (const event of ACTIVITY_EVENTS) {
+            window.addEventListener(event, handleActivity, { passive: true });
+        }
+        return () => {
+            clearTimeout(timer);
+            for (const event of ACTIVITY_EVENTS) {
+                window.removeEventListener(event, handleActivity);
+            }
+        };
+    }, [timeout]);
+    return idle;
+}

package/dist/hooks/use-intersection-observer.d.ts

@@ -0,0 +1,15 @@
+import { type RefObject } from 'react';
+interface UseIntersectionObserverOptions extends IntersectionObserverInit {
+    /**
+     * Once the element is visible, stop observing and keep the entry frozen.
+     * Useful for lazy-load triggers that should fire only once.
+     */
+    freezeOnceVisible?: boolean;
+}
+/**
+ * Tracks whether an element is within the viewport (or a custom root).
+ * Returns the latest `IntersectionObserverEntry`, or `null` before first observation.
+ */
+export declare function useIntersectionObserver(ref: RefObject<Element | null>, { threshold, root, rootMargin, freezeOnceVisible, }?: UseIntersectionObserverOptions): IntersectionObserverEntry | null;
+export {};
+//# sourceMappingURL=use-intersection-observer.d.ts.map

package/dist/hooks/use-intersection-observer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-intersection-observer.d.ts","sourceRoot":"","sources":["../../src/hooks/use-intersection-observer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAuB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAE3D,UAAU,8BAA+B,SAAQ,wBAAwB;IACvE;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAA;CAC5B;AAED;;;GAGG;AACH,wBAAgB,uBAAuB,CACrC,GAAG,EAAE,SAAS,CAAC,OAAO,GAAG,IAAI,CAAC,EAC9B,EACE,SAAa,EACb,IAAW,EACX,UAAiB,EACjB,iBAAyB,GAC1B,GAAE,8BAAmC,GACrC,yBAAyB,GAAG,IAAI,CAoBlC"}

package/dist/hooks/use-intersection-observer.js

@@ -0,0 +1,22 @@
+import { useEffect, useState } from 'react';
+/**
+ * Tracks whether an element is within the viewport (or a custom root).
+ * Returns the latest `IntersectionObserverEntry`, or `null` before first observation.
+ */
+export function useIntersectionObserver(ref, { threshold = 0, root = null, rootMargin = '0%', freezeOnceVisible = false, } = {}) {
+    const [entry, setEntry] = useState(null);
+    const frozen = entry?.isIntersecting && freezeOnceVisible;
+    useEffect(() => {
+        const el = ref.current;
+        if (!el || frozen || typeof IntersectionObserver === 'undefined')
+            return;
+        const observer = new IntersectionObserver(([e]) => setEntry(e ?? null), {
+            threshold,
+            root,
+            rootMargin,
+        });
+        observer.observe(el);
+        return () => observer.disconnect();
+    }, [ref, threshold, root, rootMargin, frozen]);
+    return entry;
+}

package/dist/hooks/use-isomorphic-layout-effect.d.ts

@@ -0,0 +1,3 @@
+import { useEffect } from 'react';
+export declare const useIsomorphicLayoutEffect: typeof useEffect;
+//# sourceMappingURL=use-isomorphic-layout-effect.d.ts.map

package/dist/hooks/use-isomorphic-layout-effect.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-isomorphic-layout-effect.d.ts","sourceRoot":"","sources":["../../src/hooks/use-isomorphic-layout-effect.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAmB,MAAM,OAAO,CAAA;AAIlD,eAAO,MAAM,yBAAyB,kBACuB,CAAA"}

package/dist/hooks/use-isomorphic-layout-effect.js

@@ -0,0 +1,4 @@
+import { useEffect, useLayoutEffect } from 'react';
+// useLayoutEffect warns in SSR. This hook silences that by falling back to
+// useEffect on the server where window is not available.
+export const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;

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

@@ -0,0 +1,7 @@
+/**
+ * Returns a ref always pointing to the latest value.
+ * Breaks stale closures in event listeners, intervals, and callbacks
+ * without requiring them to re-subscribe on every render.
+ */
+export declare function useLatest<T>(value: T): import("react").RefObject<T>;
+//# sourceMappingURL=use-latest.d.ts.map

package/dist/hooks/use-latest.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-latest.d.ts","sourceRoot":"","sources":["../../src/hooks/use-latest.ts"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,wBAAgB,SAAS,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,gCAIpC"}

package/dist/hooks/use-latest.js

@@ -0,0 +1,11 @@
+import { useRef } from 'react';
+/**
+ * Returns a ref always pointing to the latest value.
+ * Breaks stale closures in event listeners, intervals, and callbacks
+ * without requiring them to re-subscribe on every render.
+ */
+export function useLatest(value) {
+    const ref = useRef(value);
+    ref.current = value;
+    return ref;
+}

package/dist/hooks/use-local-storage.d.ts

@@ -0,0 +1,2 @@
+export declare function useLocalStorage<T>(key: string, initialValue: T): [T, (value: T | ((prev: T) => T)) => void, () => void];
+//# sourceMappingURL=use-local-storage.d.ts.map

package/dist/hooks/use-local-storage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-local-storage.d.ts","sourceRoot":"","sources":["../../src/hooks/use-local-storage.ts"],"names":[],"mappings":"AAYA,wBAAgB,eAAe,CAAC,CAAC,EAC/B,GAAG,EAAE,MAAM,EACX,YAAY,EAAE,CAAC,GACd,CAAC,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,CAAC,KAAK,IAAI,EAAE,MAAM,IAAI,CAAC,CAmCxD"}

package/dist/hooks/use-local-storage.js

@@ -0,0 +1,37 @@
+import { useCallback, useRef, useState } from 'react';
+function readFromStorage(key, fallback) {
+    if (typeof window === 'undefined')
+        return fallback;
+    try {
+        const item = window.localStorage.getItem(key);
+        return item !== null ? JSON.parse(item) : fallback;
+    }
+    catch {
+        return fallback;
+    }
+}
+export function useLocalStorage(key, initialValue) {
+    const initialValueRef = useRef(initialValue);
+    const [storedValue, setStoredValue] = useState(() => readFromStorage(key, initialValueRef.current));
+    const setValue = useCallback((value) => {
+        setStoredValue((prev) => {
+            const next = value instanceof Function ? value(prev) : value;
+            if (typeof window !== 'undefined') {
+                try {
+                    window.localStorage.setItem(key, JSON.stringify(next));
+                }
+                catch (error) {
+                    console.error(`useLocalStorage: failed to write key "${key}"`, error);
+                }
+            }
+            return next;
+        });
+    }, [key]);
+    const removeValue = useCallback(() => {
+        if (typeof window !== 'undefined') {
+            window.localStorage.removeItem(key);
+        }
+        setStoredValue(initialValueRef.current);
+    }, [key]);
+    return [storedValue, setValue, removeValue];
+}

package/dist/hooks/use-media-query.d.ts

@@ -0,0 +1,2 @@
+export declare function useMediaQuery(query: string): boolean;
+//# sourceMappingURL=use-media-query.d.ts.map

package/dist/hooks/use-media-query.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-media-query.d.ts","sourceRoot":"","sources":["../../src/hooks/use-media-query.ts"],"names":[],"mappings":"AAEA,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAkBpD"}

package/dist/hooks/use-media-query.js

@@ -0,0 +1,18 @@
+import { useEffect, useState } from 'react';
+export function useMediaQuery(query) {
+    const [matches, setMatches] = useState(() => {
+        if (typeof window === 'undefined')
+            return false;
+        return window.matchMedia(query).matches;
+    });
+    useEffect(() => {
+        if (typeof window === 'undefined')
+            return;
+        const mql = window.matchMedia(query);
+        setMatches(mql.matches);
+        const handler = (event) => setMatches(event.matches);
+        mql.addEventListener('change', handler);
+        return () => mql.removeEventListener('change', handler);
+    }, [query]);
+    return matches;
+}

package/dist/hooks/use-network-status.d.ts

@@ -0,0 +1,10 @@
+interface NetworkStatus {
+    online: boolean;
+}
+/**
+ * Tracks browser online/offline status.
+ * SSR-safe: defaults to `true` on the server.
+ */
+export declare function useNetworkStatus(): NetworkStatus;
+export {};
+//# sourceMappingURL=use-network-status.d.ts.map

package/dist/hooks/use-network-status.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-network-status.d.ts","sourceRoot":"","sources":["../../src/hooks/use-network-status.ts"],"names":[],"mappings":"AAEA,UAAU,aAAa;IACrB,MAAM,EAAE,OAAO,CAAA;CAChB;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,IAAI,aAAa,CAmBhD"}

package/dist/hooks/use-network-status.js

@@ -0,0 +1,19 @@
+import { useEffect, useState } from 'react';
+/**
+ * Tracks browser online/offline status.
+ * SSR-safe: defaults to `true` on the server.
+ */
+export function useNetworkStatus() {
+    const [online, setOnline] = useState(typeof navigator !== 'undefined' ? navigator.onLine : true);
+    useEffect(() => {
+        const handleOnline = () => setOnline(true);
+        const handleOffline = () => setOnline(false);
+        window.addEventListener('online', handleOnline);
+        window.addEventListener('offline', handleOffline);
+        return () => {
+            window.removeEventListener('online', handleOnline);
+            window.removeEventListener('offline', handleOffline);
+        };
+    }, []);
+    return { online };
+}

package/dist/hooks/use-on-click-outside.d.ts

@@ -0,0 +1,3 @@
+import { type RefObject } from 'react';
+export declare function useOnClickOutside<T extends HTMLElement>(ref: RefObject<T | null>, handler: (event: MouseEvent | TouchEvent) => void): void;
+//# sourceMappingURL=use-on-click-outside.d.ts.map

package/dist/hooks/use-on-click-outside.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-on-click-outside.d.ts","sourceRoot":"","sources":["../../src/hooks/use-on-click-outside.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAa,MAAM,OAAO,CAAA;AAEjD,wBAAgB,iBAAiB,CAAC,CAAC,SAAS,WAAW,EACrD,GAAG,EAAE,SAAS,CAAC,CAAC,GAAG,IAAI,CAAC,EACxB,OAAO,EAAE,CAAC,KAAK,EAAE,UAAU,GAAG,UAAU,KAAK,IAAI,GAChD,IAAI,CAeN"}

package/dist/hooks/use-on-click-outside.js

@@ -0,0 +1,17 @@
+import { useEffect } from 'react';
+export function useOnClickOutside(ref, handler) {
+    useEffect(() => {
+        const listener = (event) => {
+            const el = ref.current;
+            if (!el || el.contains(event.target))
+                return;
+            handler(event);
+        };
+        document.addEventListener('mousedown', listener);
+        document.addEventListener('touchstart', listener);
+        return () => {
+            document.removeEventListener('mousedown', listener);
+            document.removeEventListener('touchstart', listener);
+        };
+    }, [ref, handler]);
+}

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

@@ -0,0 +1,2 @@
+export declare function usePrevious<T>(value: T): T | undefined;
+//# sourceMappingURL=use-previous.d.ts.map

package/dist/hooks/use-previous.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-previous.d.ts","sourceRoot":"","sources":["../../src/hooks/use-previous.ts"],"names":[],"mappings":"AAEA,wBAAgB,WAAW,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,GAAG,CAAC,GAAG,SAAS,CAQtD"}

package/dist/hooks/use-previous.js

@@ -0,0 +1,8 @@
+import { useEffect, useRef } from 'react';
+export function usePrevious(value) {
+    const ref = useRef(undefined);
+    useEffect(() => {
+        ref.current = value;
+    }, [value]);
+    return ref.current;
+}

package/dist/hooks/use-render-count.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Returns the number of times the component has rendered.
+ * Dev-only: logs to console when a label is provided.
+ * Use this to spot unexpected re-render loops before reaching for the profiler.
+ */
+export declare function useRenderCount(label?: string): number;
+//# sourceMappingURL=use-render-count.d.ts.map

package/dist/hooks/use-render-count.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-render-count.d.ts","sourceRoot":"","sources":["../../src/hooks/use-render-count.ts"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAUrD"}

package/dist/hooks/use-render-count.js

@@ -0,0 +1,15 @@
+import { useRef } from 'react';
+/**
+ * Returns the number of times the component has rendered.
+ * Dev-only: logs to console when a label is provided.
+ * Use this to spot unexpected re-render loops before reaching for the profiler.
+ */
+export function useRenderCount(label) {
+    const count = useRef(0);
+    count.current += 1;
+    if (process.env.NODE_ENV !== 'production' && label) {
+        // eslint-disable-next-line no-console
+        console.log(`[renders] ${label}: ${count.current}`);
+    }
+    return count.current;
+}

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

@@ -0,0 +1,6 @@
+/**
+ * Boolean state with stable toggle, setOn, and setOff callbacks.
+ * Returns `[value, toggle, setOn, setOff]`.
+ */
+export declare function useToggle(initialValue?: boolean): [boolean, () => void, () => void, () => void];
+//# sourceMappingURL=use-toggle.d.ts.map

package/dist/hooks/use-toggle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-toggle.d.ts","sourceRoot":"","sources":["../../src/hooks/use-toggle.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,wBAAgB,SAAS,CACvB,YAAY,UAAQ,GACnB,CAAC,OAAO,EAAE,MAAM,IAAI,EAAE,MAAM,IAAI,EAAE,MAAM,IAAI,CAAC,CAQ/C"}

package/dist/hooks/use-toggle.js

@@ -0,0 +1,12 @@
+import { useCallback, useState } from 'react';
+/**
+ * Boolean state with stable toggle, setOn, and setOff callbacks.
+ * Returns `[value, toggle, setOn, setOff]`.
+ */
+export function useToggle(initialValue = false) {
+    const [value, setValue] = useState(initialValue);
+    const toggle = useCallback(() => setValue((v) => !v), []);
+    const setOn = useCallback(() => setValue(true), []);
+    const setOff = useCallback(() => setValue(false), []);
+    return [value, toggle, setOn, setOff];
+}

package/dist/hooks/use-why-did-you-render.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Logs which props changed between renders.
+ * Dev-only (no-ops in production).
+ * Use before reaching for the React DevTools profiler — shows changed props
+ * inline in the console with before/after values.
+ */
+export declare function useWhyDidYouRender(name: string, props: Record<string, unknown>): void;
+//# sourceMappingURL=use-why-did-you-render.d.ts.map

package/dist/hooks/use-why-did-you-render.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-why-did-you-render.d.ts","sourceRoot":"","sources":["../../src/hooks/use-why-did-you-render.ts"],"names":[],"mappings":"AAEA;;;;;GAKG;AACH,wBAAgB,kBAAkB,CAChC,IAAI,EAAE,MAAM,EACZ,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAC7B,IAAI,CAmCN"}

package/dist/hooks/use-why-did-you-render.js

@@ -0,0 +1,38 @@
+import { useEffect, useRef } from 'react';
+/**
+ * Logs which props changed between renders.
+ * Dev-only (no-ops in production).
+ * Use before reaching for the React DevTools profiler — shows changed props
+ * inline in the console with before/after values.
+ */
+export function useWhyDidYouRender(name, props) {
+    const hasMounted = useRef(false);
+    const previousProps = useRef({});
+    useEffect(() => {
+        if (process.env.NODE_ENV === 'production')
+            return;
+        // Skip first render — nothing to diff against
+        if (!hasMounted.current) {
+            hasMounted.current = true;
+            previousProps.current = { ...props };
+            return;
+        }
+        const changed = {};
+        for (const key of Object.keys(props)) {
+            if (previousProps.current[key] !== props[key]) {
+                changed[key] = {
+                    from: previousProps.current[key],
+                    to: props[key],
+                };
+            }
+        }
+        if (Object.keys(changed).length > 0) {
+            console.group(`[why-render] ${name}`);
+            for (const [key, diff] of Object.entries(changed)) {
+                console.log(`  ${key}:`, diff);
+            }
+            console.groupEnd();
+        }
+        previousProps.current = { ...props };
+    });
+}

package/dist/index.d.ts

@@ -1,16 +1,18 @@
 /**
  * @teo-garcia/react-shared
  *
- * Shared React components, hooks, utilities, and adapters for fullstack web templates.
+ * Shared React hooks, utilities, and test helpers for the teo-garcia template portfolio.
  *
- * This package provides framework-agnostic React utilities that work across
- * Next.js, React Router, and other React-based frameworks.
+ * Exports:
+ * - Hooks: useDebounce, useIsomorphicLayoutEffect, useLocalStorage, useMediaQuery, useOnClickOutside, usePrevious
+ * - Components: ErrorBoundary
+ * - Utils: cn (clsx + tailwind-merge)
+ * - Test utilities: createWrapper, renderWithProviders (import from react-shared/test-utils)
  *
  * @packageDocumentation
  */
 export * from './components/index.js';
 export * from './hooks/index.js';
 export * from './utils/index.js';
-export * from './adapters/index.js';
 export * from './types.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAGH,cAAc,uBAAuB,CAAA;AAGrC,cAAc,kBAAkB,CAAA;AAGhC,cAAc,kBAAkB,CAAA;AAGhC,cAAc,qBAAqB,CAAA;AAGnC,cAAc,YAAY,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,cAAc,uBAAuB,CAAA;AACrC,cAAc,kBAAkB,CAAA;AAChC,cAAc,kBAAkB,CAAA;AAChC,cAAc,YAAY,CAAA"}

package/dist/index.js

@@ -1,20 +1,17 @@
 /**
  * @teo-garcia/react-shared
  *
- * Shared React components, hooks, utilities, and adapters for fullstack web templates.
+ * Shared React hooks, utilities, and test helpers for the teo-garcia template portfolio.
  *
- * This package provides framework-agnostic React utilities that work across
- * Next.js, React Router, and other React-based frameworks.
+ * Exports:
+ * - Hooks: useDebounce, useIsomorphicLayoutEffect, useLocalStorage, useMediaQuery, useOnClickOutside, usePrevious
+ * - Components: ErrorBoundary
+ * - Utils: cn (clsx + tailwind-merge)
+ * - Test utilities: createWrapper, renderWithProviders (import from react-shared/test-utils)
  *
  * @packageDocumentation
  */
-// Export all components
 export * from './components/index.js';
-// Export all hooks
 export * from './hooks/index.js';
-// Export all utilities
 export * from './utils/index.js';
-// Export all adapters
-export * from './adapters/index.js';
-// Export all types
 export * from './types.js';

package/dist/test-utils/index.d.ts

@@ -0,0 +1,14 @@
+import { QueryClient } from '@tanstack/react-query';
+import { type RenderOptions, type RenderResult } from '@testing-library/react';
+import { type ReactNode } from 'react';
+export interface WrapperOptions {
+    queryClient?: QueryClient;
+}
+export declare function createWrapper(options?: WrapperOptions): ({ children }: {
+    children: ReactNode;
+}) => import("react").FunctionComponentElement<import("@tanstack/react-query").QueryClientProviderProps>;
+export interface RenderWithProvidersOptions extends Omit<RenderOptions, 'wrapper'> {
+    queryClient?: QueryClient;
+}
+export declare function renderWithProviders(ui: React.ReactElement, options?: RenderWithProvidersOptions): RenderResult;
+//# sourceMappingURL=index.d.ts.map

package/dist/test-utils/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/test-utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAuB,MAAM,uBAAuB,CAAA;AACxE,OAAO,EAEL,KAAK,aAAa,EAClB,KAAK,YAAY,EAClB,MAAM,wBAAwB,CAAA;AAC/B,OAAO,EAAiB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAErD,MAAM,WAAW,cAAc;IAC7B,WAAW,CAAC,EAAE,WAAW,CAAA;CAC1B;AAED,wBAAgB,aAAa,CAAC,OAAO,GAAE,cAAmB,IAUhC,cAAc;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,wGAG9D;AAED,MAAM,WAAW,0BACf,SAAQ,IAAI,CAAC,aAAa,EAAE,SAAS,CAAC;IACtC,WAAW,CAAC,EAAE,WAAW,CAAA;CAC1B;AAED,wBAAgB,mBAAmB,CACjC,EAAE,EAAE,KAAK,CAAC,YAAY,EACtB,OAAO,GAAE,0BAA+B,GACvC,YAAY,CAMd"}

package/dist/test-utils/index.js

@@ -0,0 +1,22 @@
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { render, } from '@testing-library/react';
+import { createElement } from 'react';
+export function createWrapper(options = {}) {
+    const client = options.queryClient ??
+        new QueryClient({
+            defaultOptions: {
+                queries: { retry: false, gcTime: 0 },
+                mutations: { retry: false },
+            },
+        });
+    return function Wrapper({ children }) {
+        return createElement(QueryClientProvider, { client }, children);
+    };
+}
+export function renderWithProviders(ui, options = {}) {
+    const { queryClient, ...renderOptions } = options;
+    return render(ui, {
+        wrapper: createWrapper({ queryClient }),
+        ...renderOptions,
+    });
+}