@vibehooks/react 0.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,101 @@
+<p align="center">
+    <img src="./public/logo.png" alt="useful-react-hooks" height="40px">
+</p>
+
+<p align="center" style="font-size: 1.2rem; font-weight: bold;">
+Modern React and Next.js hooks, unopinionated and focused on developer experience.
+</p>
+
+### **Release: Monday, February 9 2025**
+
+## **Installation**
+
+You can install the package with the following command:
+
+Using `npm`:
+
+```bash
+npm install @vibehooks/react
+```
+
+Using `pnpm`:
+
+```bash
+pnpm add @vibehooks/react
+```
+
+That package is fully typed with TypeScript and comes with all the types you need.
+You can use the types just by importing them from the package like this:
+
+```ts
+import { useToggle, type UseToggleReturn } from '@vibehooks/react';
+```
+
+## **Contributing**
+
+Contributions are always welcome!
+
+See [`Contributing`](https://github.com/SebastianUrdaneguiBisalaya/vibehooks?tab=contributing-ov-file) for ways to get started.
+
+If you do not want create your custom hook, you can also contribute to the package by mentioning the name and purpose of the hook you would like to see in this package in the [issues](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/issues) section.
+
+## **API Docs**
+
+| **Hook**                                                                                                                          | **Description**                                                                                                                                  |
+| --------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------ |
+| [**useAsyncState**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useAsyncState.ts)                       | A robust React hook for managing asynchronous operations and remote data fetching with integrated state tracking and retry logic.                |
+| [**useAudio**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useAudio.ts)                                 | A React hook providing a declarative and unopinionated interface to manage the HTML5 Audio API lifecycle.                                        |
+| [**useAutoScroll**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useAutoScroll.ts)                       | A custom hook that automatically manages scrolling to the bottom of a container while respecting manual user navigation.                         |
+| [**useBarcode**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useBarcode.ts)                             | A React hook that provides a high-level interface for detecting barcodes and QR codes in real-time using the browser's Barcode Detection API.    |
+| [**useBatteryStatus**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useBatteryStatus.ts)                 | A hardware-integration hook that provides real-time access to the system's battery levels, charging state, and timing estimates.                 |
+| [**useBodyScrollFreeze**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useBodyScrollFreeze.ts)           | An imperative hook to disable body scrolling on specific axes while maintaining the user's current scroll position.                              |
+| [**useCookies**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useCookies.ts)                             | A React hook that provides an unopinionated interface for managing browser cookies with standard configuration options.                          |
+| [**useCameraCapture**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useCameraCapture.ts)                 | A hook that manages camera access and simplifies capturing still images from a live video stream via a canvas element.                           |
+| [**useCopyToClipboard**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useCopyToClipboard.ts)             | A hook to copy text to the system clipboard using the modern Clipboard API.                                                                      |
+| [**useCountDown**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useCountDown.ts)                         | High-precision React hook for managing synchronized countdown timers with manual lifecycle controls and drift-correction.                        |
+| [**useDebouncedState**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useDebouncedState.ts)               | A state management hook that tracks immediate value changes while providing a delayed update for performance-heavy operations.                   |
+| [**useExternalNotifications**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useExternalNotifications.ts) | Manages and synchronizes system notifications across multiple contexts using a global external store.                                            |
+| [**useGeolocation**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useGeolocation.ts)                     | A comprehensive, SSR-safe hook for interfacing with the Geolocation API and Permissions API to track device coordinates and access status.       |
+| [**useHoverIntent**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useHoverIntent.ts)                     | A detection hook that distinguishes between accidental mouse-overs and intentional user hovers.                                                  |
+| [**useFile**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useFile.ts)                                   | Manages file selection state and provides input-ready props for uploads and drag-and-drop.                                                       |
+| [**useFullscreen**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useFullScreen.ts)                       | A declarative interface for managing the browser Fullscreen API on a specific DOM element.                                                       |
+| [**useIdle**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useIdle.ts)                                   | An SSR-safe hook to monitor user inactivity by tracking browser interaction events and exposing real-time idle status based on a custom timeout. |
+| [**useIndexedDB**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useIndexedDB.ts)                         | A React hook that abstracts the boilerplate of the IndexedDB API, facilitating database connections and transaction management.                  |
+| [**useIntersectionObserver**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useIntersectionObserver.ts)   | A hook that monitors the visibility and intersection of a DOM element within a viewport.                                                         |
+| [**useIntervalSafe**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useIntervalSafe.ts)                   | A declarative and robust React hook for managing **setInterval** lifecycles with execution limits and manual controls.                           |
+| [**useIsClient**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useIsClient.ts)                           | Returns true if the code is running in the browser and false if it is running on the server.                                                     |
+| [**useIsDesktop**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useIsDesktop.ts)                         | Determines if the current viewport width meets or exceeds a specified desktop breakpoint.                                                        |
+| [**useIsFirstRender**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useIsFirstRender.ts)                 | Tracks whether the current render cycle is the initial mount of the component.                                                                   |
+| [**useList**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useList.ts)                                   | A stateful array management hook providing memoized utility functions for CRUD operations on lists.                                              |
+| [**useLocalStorage**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useLocalStorage.ts)                   | A typed React hook for interacting with the Web Storage API, providing automatic JSON serialization and fallback support.                        |
+| [**useLocaleNotifications**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useLocalNotifications.ts)      | Provides a direct interface to trigger browser system notifications within a component.                                                          |
+| [**useNetworkInformation**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useNetworkInformation.ts)       | A performance-aware hook that provides real-time network telemetry and user connectivity preferences to adapt application behavior.              |
+| [**usePageVisibility**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/usePageVisibility.ts)               | Provides the current visibility state of the document using the Page Visibility API.                                                             |
+| [**usePermissions**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/usePermissions.ts)                     | A reactive hook that observes and synchronizes browser permission statuses in real-time.                                                         |
+| [**usePictureInPicture**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/usePictureInPicture.ts)           | A specialized hook to manage the Picture-in-Picture (PiP) Web API for floating video playback.                                                   |
+| [**usePopover**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/usePopover.ts)                             | A lifecycle management hook for popover UI elements that handles visibility and "click-outside" logic.                                           |
+| [**usePreferredTheme**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/usePreferredTheme.ts)               | Resolves the effective theme by reconciling system preferences and manual user selection.                                                        |
+| [**usePreferredLanguage**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/usePreferredLanguage.ts)         | Manages and resolves the application language based on system settings and user overrides.                                                       |
+| [**usePreviousDistinct**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/usePreviousDistinct.ts)           | A utility hook that captures the last distinct value of a variable, filtering out redundant consecutive updates.                                 |
+| [**useResettableState**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useResettableState.ts)             | Extends standard state management with a memoized reset mechanism to revert to the initial value.                                                |
+| [**useScreenOrientation**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useScreenOrientation.ts)         | A React hook that provides real-time access to the device's screen orientation state and control methods via the Screen Orientation API.         |
+| [**useScreenSize**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useScreenSize.ts)                       | Returns the current inner dimensions of the browser window.                                                                                      |
+| [**useScreenWakeLock**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useScreenWakeLock.ts)               | A React hook that provides unopinionated access to the Screen Wake Lock API to prevent devices from dimming or locking the screen.               |
+| [**useServerSentEvent**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useServerSentEvent.ts)             | A React hook that provides unopinionated access to the EventSource Web API for receiving real-time server-side updates.                          |
+| [**useShoppingCart**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useShoppingCart.ts)                   | A generic, domain-agnostic hook for managing complex shopping cart logic and calculations.                                                       |
+| [**useSmartVideo**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useSmartVideo.ts)                       | An advanced video hook that combines intersection logic with playback control for automated "smart" behavior.                                    |
+| [**useSpeech**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useSpeech.ts)                               | Provides unopinionated, high-level access to the Web Speech API for speech-to-text recognition.                                                  |
+| [**useSummarizer**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useSummarizer.ts)                       | Provides low-level access to the browser's built-in AI Summarizer API.                                                                           |
+| [**useTaskQueue**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useTaskQueue.ts)                         | A React hook for managing and executing a sequential queue of asynchronous tasks with automatic concurrency control.                             |
+| [**useTimeout**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useTimeout.ts)                             | A declarative React hook for managing the lifecycle of single-execution timers with manual controls and SSR safety.                              |
+| [**useThrottledCallback**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useThrottledCallback.ts)         | A performance-optimization hook that limits the execution frequency of a callback to one per specified time window.                              |
+| [**useTraceUpdates**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useTraceUpdates.ts)                   | Logs property changes to the console whenever the component updates.                                                                             |
+| [**useTranslator**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useTranslator.ts)                       | Enables AI-powered text translation directly within the browser via the Translator API.                                                          |
+| [**useToggle**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useToggle.ts)                               | A lightweight, unopinionated hook to manage boolean state toggling with memoized handlers.                                                       |
+| [**useUserActivation**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useUserActivation.ts)               | A React hook that tracks the browser's User Activation state to determine if a user has interacted with the page.                                |
+| [**useVibration**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useVibration.ts)                         | A React hook that provides an SSR-safe interface to interact with the device's physical vibration hardware.                                      |
+| [**useWebsocket**](https://github.com/SebastianUrdaneguiBisalaya/vibehooks/blob/main/src/useWebsocket.ts)                         | A comprehensive React hook for managing WebSocket connections with built-in auto-reconnection logic, message history, and SSR safety.            |
+
+## License
+
+[MIT](https://github.com/SebastianUrdaneguiBisalaya/vibehooks?tab=MIT-1-ov-file)

package/dist/index.d.ts

@@ -0,0 +1,54 @@
+import { useAudio } from "./useAudio.js";
+import { useAsyncState } from "./useAsyncState.js";
+import { useAutoScroll } from "./useAutoScroll.js";
+import { useBarcode } from "./useBarcode.js";
+import { useBatteryStatus } from "./useBatteryStatus.js";
+import { useBodyScrollFreeze } from "./useBodyScrollFreeze.js";
+import { useCameraCapture } from "./useCameraCapture.js";
+import { useCookies } from "./useCookies.js";
+import { useCopyToClipboard } from "./useCopyToClipboard.js";
+import { useCountDown } from "./useCountDown.js";
+import { useDebouncedState } from "./useDebouncedState.js";
+import { useExternalNotifications } from "./useExternalNotifications.js";
+import { useGeolocation } from "./useGeolocation.js";
+import { useHoverIntent } from "./useHoverIntent.js";
+import { useFile } from "./useFile.js";
+import { useFullscreen } from "./useFullScreen.js";
+import { useIdle } from "./useIdle.js";
+import { useIndexedDB } from "./useIndexedDB.js";
+import { useIntersectionObserver } from "./useIntersectionObserver.js";
+import { useIntervalSafe } from "./useIntervalSafe.js";
+import { useIsClient } from "./useIsClient.js";
+import { useIsDesktop } from "./useIsDesktop.js";
+import { useIsFirstRender } from "./useIsFirstRender.js";
+import { useList } from "./useList.js";
+import { useLocalStorage } from "./useLocalStorage.js";
+import { useLocalNotifications } from "./useLocalNotifications.js";
+import { useNetworkInformation } from "./useNetworkInformation.js";
+import { usePageVisibility } from "./usePageVisibility.js";
+import { usePermissions } from "./usePermissions.js";
+import { usePictureInPicture } from "./usePictureInPicture.js";
+import { usePopover } from "./usePopover.js";
+import { usePreferredTheme } from "./usePreferredTheme.js";
+import { usePreferredLanguage } from "./usePreferredLanguage.js";
+import { usePreviousDistinct } from "./usePreviousDistinct.js";
+import { useResettableState } from "./useResettableState.js";
+import { useScreenOrientation } from "./useScreenOrientation.js";
+import { useScreenSize } from "./useScreenSize.js";
+import { useScreenWakeLock } from "./useScreenWakeLock.js";
+import { useServerSentEvent } from "./useServerSentEvent.js";
+import { useShoppingCart } from "./useShoppingCart.js";
+import { useSmartVideo } from "./useSmartVideo.js";
+import { useSpeech } from "./useSpeech.js";
+import { useSummarizer } from "./useSummarizer.js";
+import { useTaskQueue } from "./useTaskQueue.js";
+import { useTimeout } from "./useTimeout.js";
+import { useThrottledCallback } from "./useThrottledCallback.js";
+import { useTraceUpdates } from "./useTraceUpdates.js";
+import { useTranslator } from "./useTranslator.js";
+import { useToggle } from "./useToggle.js";
+import { useOnline } from "./useOnline.js";
+import { useUserActivation } from "./useUserActivation.js";
+import { useVibration } from "./useVibration.js";
+import { useWebsocket } from "./useWebsocket.js";
+export { useAsyncState, useAudio, useAutoScroll, useBarcode, useBatteryStatus, useBodyScrollFreeze, useCameraCapture, useCookies, useCopyToClipboard, useCountDown, useDebouncedState, useExternalNotifications, useFile, useFullscreen, useGeolocation, useHoverIntent, useIdle, useIndexedDB, useIntersectionObserver, useIntervalSafe, useIsClient, useIsDesktop, useIsFirstRender, useList, useLocalNotifications, useLocalStorage, useNetworkInformation, useOnline, usePageVisibility, usePermissions, usePictureInPicture, usePopover, usePreferredLanguage, usePreferredTheme, usePreviousDistinct, useResettableState, useScreenOrientation, useScreenSize, useScreenWakeLock, useServerSentEvent, useShoppingCart, useSmartVideo, useSpeech, useSummarizer, useTaskQueue, useThrottledCallback, useTimeout, useToggle, useTraceUpdates, useTranslator, useUserActivation, useVibration, useWebsocket };

package/dist/index.js

@@ -0,0 +1,55 @@
+import { useAudio } from "./useAudio.js";
+import { useAsyncState } from "./useAsyncState.js";
+import { useAutoScroll } from "./useAutoScroll.js";
+import { useBarcode } from "./useBarcode.js";
+import { useBatteryStatus } from "./useBatteryStatus.js";
+import { useBodyScrollFreeze } from "./useBodyScrollFreeze.js";
+import { useCameraCapture } from "./useCameraCapture.js";
+import { useCookies } from "./useCookies.js";
+import { useCopyToClipboard } from "./useCopyToClipboard.js";
+import { useCountDown } from "./useCountDown.js";
+import { useDebouncedState } from "./useDebouncedState.js";
+import { useExternalNotifications } from "./useExternalNotifications.js";
+import { useGeolocation } from "./useGeolocation.js";
+import { useHoverIntent } from "./useHoverIntent.js";
+import { useFile } from "./useFile.js";
+import { useFullscreen } from "./useFullScreen.js";
+import { useIdle } from "./useIdle.js";
+import { useIndexedDB } from "./useIndexedDB.js";
+import { useIntersectionObserver } from "./useIntersectionObserver.js";
+import { useIntervalSafe } from "./useIntervalSafe.js";
+import { useIsClient } from "./useIsClient.js";
+import { useScreenSize } from "./useScreenSize.js";
+import { useIsDesktop } from "./useIsDesktop.js";
+import { useIsFirstRender } from "./useIsFirstRender.js";
+import { useList } from "./useList.js";
+import { useLocalStorage } from "./useLocalStorage.js";
+import { useLocalNotifications } from "./useLocalNotifications.js";
+import { useNetworkInformation } from "./useNetworkInformation.js";
+import { usePageVisibility } from "./usePageVisibility.js";
+import { usePermissions } from "./usePermissions.js";
+import { usePictureInPicture } from "./usePictureInPicture.js";
+import { usePopover } from "./usePopover.js";
+import { usePreferredTheme } from "./usePreferredTheme.js";
+import { usePreferredLanguage } from "./usePreferredLanguage.js";
+import { usePreviousDistinct } from "./usePreviousDistinct.js";
+import { useResettableState } from "./useResettableState.js";
+import { useScreenOrientation } from "./useScreenOrientation.js";
+import { useScreenWakeLock } from "./useScreenWakeLock.js";
+import { useServerSentEvent } from "./useServerSentEvent.js";
+import { useShoppingCart } from "./useShoppingCart.js";
+import { useSmartVideo } from "./useSmartVideo.js";
+import { useSpeech } from "./useSpeech.js";
+import { useSummarizer } from "./useSummarizer.js";
+import { useTaskQueue } from "./useTaskQueue.js";
+import { useTimeout } from "./useTimeout.js";
+import { useThrottledCallback } from "./useThrottledCallback.js";
+import { useTraceUpdates } from "./useTraceUpdates.js";
+import { useTranslator } from "./useTranslator.js";
+import { useToggle } from "./useToggle.js";
+import { useOnline } from "./useOnline.js";
+import { useUserActivation } from "./useUserActivation.js";
+import { useVibration } from "./useVibration.js";
+import { useWebsocket } from "./useWebsocket.js";
+
+export { useAsyncState, useAudio, useAutoScroll, useBarcode, useBatteryStatus, useBodyScrollFreeze, useCameraCapture, useCookies, useCopyToClipboard, useCountDown, useDebouncedState, useExternalNotifications, useFile, useFullscreen, useGeolocation, useHoverIntent, useIdle, useIndexedDB, useIntersectionObserver, useIntervalSafe, useIsClient, useIsDesktop, useIsFirstRender, useList, useLocalNotifications, useLocalStorage, useNetworkInformation, useOnline, usePageVisibility, usePermissions, usePictureInPicture, usePopover, usePreferredLanguage, usePreferredTheme, usePreviousDistinct, useResettableState, useScreenOrientation, useScreenSize, useScreenWakeLock, useServerSentEvent, useShoppingCart, useSmartVideo, useSpeech, useSummarizer, useTaskQueue, useThrottledCallback, useTimeout, useToggle, useTraceUpdates, useTranslator, useUserActivation, useVibration, useWebsocket };

package/dist/useAsyncState.d.ts

@@ -0,0 +1,52 @@
+//#region src/useAsyncState.d.ts
+type AsyncState<T> = {
+  data: T | null;
+  error: Error | null;
+  isError: boolean;
+  isIdle: boolean;
+  isLoading: boolean;
+  isSuccess: boolean;
+};
+type FetchConfig = RequestInit & {
+  onError?: (error: Error) => void;
+  onSuccess?: (data: unknown) => void;
+  params?: Record<string, string | number | boolean>;
+  retries?: number;
+  retryDelay?: number;
+  timeout?: number;
+};
+type UseAsyncStateReturn<T> = AsyncState<T> & {
+  execute: (url: string, config?: FetchConfig) => Promise<T | null>;
+  mutate: (data: T) => void;
+  reset: () => void;
+  retry: () => Promise<T | null>;
+};
+interface UseAsyncStateOptions<T> {
+  initialData?: T | null;
+  onError?: (error: Error) => void;
+  onSuccess?: (data: T) => void;
+}
+/**
+ * `useAsyncState` is a comprehensive hook for managing asynchronous fetch operations with built-in state management.
+ * This hook eliminates the need to manually manage loading state, errors, retries, and data handling for fetch requests.
+ *
+ * @example
+ * ```tsx
+ * function UserProfile() {
+ *   const { data, isLoading, isError, error, execute } = useAsyncState<User>();
+ *
+ *   React.useEffect(() => {
+ *     execute('https://api.example.com/user/123');
+ *   }, []);
+ *
+ *   if (isLoading) return <div>Loading...</div>;
+ *   if (isError) return <div>Error: {error?.message}</div>;
+ *   if (!data) return null;
+ *
+ *   return <div>Welcome, {data.name}!</div>;
+ * }
+ * ```
+ */
+declare function useAsyncState<T>(options?: UseAsyncStateOptions<T>): UseAsyncStateReturn<T>;
+//#endregion
+export { useAsyncState };

package/dist/useAsyncState.js

@@ -0,0 +1,173 @@
+import * as React from "react";
+
+//#region src/useAsyncState.ts
+var FetchError = class extends Error {
+	constructor(message, status, statusText, response) {
+		super(message);
+		this.status = status;
+		this.statusText = statusText;
+		this.response = response;
+		this.name = "FetchError";
+	}
+};
+/**
+* `useAsyncState` is a comprehensive hook for managing asynchronous fetch operations with built-in state management.
+* This hook eliminates the need to manually manage loading state, errors, retries, and data handling for fetch requests.
+*
+* @example
+* ```tsx
+* function UserProfile() {
+*   const { data, isLoading, isError, error, execute } = useAsyncState<User>();
+*
+*   React.useEffect(() => {
+*     execute('https://api.example.com/user/123');
+*   }, []);
+*
+*   if (isLoading) return <div>Loading...</div>;
+*   if (isError) return <div>Error: {error?.message}</div>;
+*   if (!data) return null;
+*
+*   return <div>Welcome, {data.name}!</div>;
+* }
+* ```
+*/
+function useAsyncState(options) {
+	const { initialData = null, onError, onSuccess } = options || {};
+	const [state, setState] = React.useState({
+		data: initialData,
+		error: null,
+		isError: false,
+		isIdle: true,
+		isLoading: false,
+		isSuccess: false
+	});
+	const lastRequestRef = React.useRef(null);
+	const abortControllerRef = React.useRef(null);
+	const buildUrl = React.useCallback((url, params) => {
+		if (!params || Object.keys(params).length === 0) return url;
+		const urlObj = new URL(url);
+		Object.entries(params).forEach(([key, value]) => {
+			urlObj.searchParams.append(key, value.toString());
+		});
+		return urlObj.toString();
+	}, []);
+	const performFetch = React.useCallback(async (url, config, attemptNumber = 1) => {
+		const { onError: configOnError, onSuccess: configOnSuccess, params, retries = 0, retryDelay = 1e3, timeout = 3e4, ...fetchConfig } = config || {};
+		abortControllerRef.current = new AbortController();
+		const { signal } = abortControllerRef.current;
+		const fullUrl = buildUrl(url, params);
+		const timeoutPromise = new Promise((_, reject) => {
+			setTimeout(() => {
+				abortControllerRef.current?.abort();
+				reject(new FetchError("Request timeout", void 0, "Timeout"));
+			}, timeout);
+		});
+		try {
+			const response = await Promise.race([fetch(fullUrl, {
+				...fetchConfig,
+				signal
+			}), timeoutPromise]);
+			if (!response.ok) throw new FetchError(await response.text().catch(() => response.statusText) || `HTTP Error ${response.status}`, response.status, response.statusText, response);
+			const contentType = response.headers.get("Content-Type");
+			let data;
+			if (contentType?.includes("application/json")) data = await response.json();
+			else if (contentType?.includes("text/")) data = await response.text();
+			else data = await response.blob();
+			configOnSuccess?.(data);
+			onSuccess?.(data);
+			return data;
+		} catch (err) {
+			const error = err instanceof Error ? err : new Error(String(err));
+			if (attemptNumber <= retries && error.name !== "AbortError") {
+				await new Promise((resolve) => setTimeout(resolve, retryDelay));
+				return performFetch(url, config, attemptNumber + 1);
+			}
+			configOnError?.(error);
+			onError?.(error);
+			throw error;
+		}
+	}, [
+		buildUrl,
+		onSuccess,
+		onError
+	]);
+	const execute = React.useCallback(async (url, config) => {
+		abortControllerRef.current?.abort();
+		lastRequestRef.current = {
+			config,
+			url
+		};
+		setState((prev) => ({
+			...prev,
+			error: null,
+			isError: false,
+			isIdle: false,
+			isLoading: true,
+			isSuccess: false
+		}));
+		try {
+			const data = await performFetch(url, config);
+			setState({
+				data,
+				error: null,
+				isError: false,
+				isIdle: false,
+				isLoading: false,
+				isSuccess: true
+			});
+			return data;
+		} catch (err) {
+			const error = err instanceof Error ? err : new Error(String(err));
+			if (error.name !== "AbortError") return null;
+			setState((prev) => ({
+				...prev,
+				error,
+				isError: true,
+				isLoading: false,
+				isSuccess: false
+			}));
+			return null;
+		}
+	}, [performFetch]);
+	const reset = React.useCallback(() => {
+		abortControllerRef.current?.abort();
+		lastRequestRef.current = null;
+		setState({
+			data: initialData,
+			error: null,
+			isError: false,
+			isIdle: true,
+			isLoading: false,
+			isSuccess: false
+		});
+	}, [initialData]);
+	const mutate = React.useCallback((newData) => {
+		setState((prev) => ({
+			...prev,
+			data: newData
+		}));
+	}, []);
+	const retry = React.useCallback(async () => {
+		if (!lastRequestRef.current) {
+			console.warn("No previous request to retry.");
+			return null;
+		}
+		const { config, url } = lastRequestRef.current;
+		return execute(url, config);
+	}, [execute]);
+	React.useEffect(() => {
+		return () => {
+			abortControllerRef.current?.abort();
+		};
+	}, []);
+	return {
+		...state,
+		execute,
+		mutate,
+		reset,
+		retry
+	};
+}
+
+//#endregion
+export { useAsyncState };

package/dist/useAudio.d.ts

@@ -0,0 +1,26 @@
+//#region src/useAudio.d.ts
+type AudioStatus = 'idle' | 'loading' | 'playing' | 'paused' | 'ended' | 'error';
+interface UseAudioOptions {
+  loop?: boolean;
+  src?: string;
+  volume?: number;
+}
+interface UseAudioReturn {
+  audio: HTMLAudioElement | null;
+  error: Error | null;
+  pause: () => void;
+  play: () => Promise<void>;
+  status: AudioStatus;
+}
+/**
+ * `useAudio` is a React hook that provides unopinionated access to the HTML5 Audio API.
+ *
+ * @example
+ * ```tsx
+ * const audio = useAudio({ src: '/sound.mp3' });
+ * audio.play();
+ * ```
+ */
+declare function useAudio(options?: UseAudioOptions): UseAudioReturn;
+//#endregion
+export { useAudio };

package/dist/useAudio.js

@@ -0,0 +1,64 @@
+import * as React from "react";
+
+//#region src/useAudio.ts
+/**
+* `useAudio` is a React hook that provides unopinionated access to the HTML5 Audio API.
+*
+* @example
+* ```tsx
+* const audio = useAudio({ src: '/sound.mp3' });
+* audio.play();
+* ```
+*/
+function useAudio(options = {}) {
+	const audioRef = React.useRef(null);
+	const mountedRef = React.useRef(false);
+	const [status, setStatus] = React.useState("idle");
+	const [error, setError] = React.useState(null);
+	const play = React.useCallback(async () => {
+		if (!audioRef.current) return;
+		try {
+			await audioRef.current.play();
+			setStatus("playing");
+		} catch (error$1) {
+			setError(error$1);
+			setStatus("error");
+		}
+	}, []);
+	const pause = React.useCallback(() => {
+		audioRef.current?.pause();
+		setStatus("paused");
+	}, []);
+	React.useEffect(() => {
+		mountedRef.current = true;
+		const audio = new Audio(options.src ?? "");
+		audio.loop = options.loop ?? false;
+		audio.volume = options.volume ?? 1;
+		audio.onended = () => mountedRef.current && setStatus("ended");
+		audio.onerror = () => {
+			if (!mountedRef.current) return;
+			setError(/* @__PURE__ */ new Error("Audio error"));
+			setStatus("error");
+		};
+		audioRef.current = audio;
+		return () => {
+			mountedRef.current = false;
+			audio.pause();
+			audioRef.current = null;
+		};
+	}, [
+		options.src,
+		options.loop,
+		options.volume
+	]);
+	return {
+		audio: audioRef.current,
+		error,
+		pause,
+		play,
+		status
+	};
+}
+
+//#endregion
+export { useAudio };

package/dist/useAutoScroll.d.ts

@@ -0,0 +1,47 @@
+import * as React from "react";
+
+//#region src/useAutoScroll.d.ts
+interface UseAutoScrollOptions {
+  behavior?: 'auto' | 'smooth';
+  enabled?: boolean;
+  threshold?: number;
+}
+/**
+ * `useAutoScroll` is a custom hook for automatically scrolling to the bottom of a container element.
+ * It keeps the scroll at the bottom of the container while new content is generated, but only if the user is near the bottom. If the user scrolls up to read previous content, auto-scrolling is automatically disabled so as not to interrupt their reading.
+ *
+ * @example
+ * ```tsx
+ * function ChatInterface() {
+ *   const { ref, isAtBottom, scrollToBottom } = useAutoScroll({
+ *     threshold: 50,
+ *     behavior: 'smooth'
+ *   });
+ *
+ *   return (
+ *     <div>
+ *       <div ref={ref} className="chat-container">
+ *         {messages.map(msg => (
+ *           <Message key={msg.id} content={msg.content} />
+ *         ))}
+ *       </div>
+ *       {!isAtBottom && (
+ *         <button onClick={scrollToBottom}>
+ *           Ir al final ↓
+ *         </button>
+ *       )}
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+declare function useAutoScroll(options?: UseAutoScrollOptions): {
+  autoScrollEnabled: boolean;
+  disableAutoScroll: () => void;
+  enableAutoScroll: () => void;
+  isAtBottom: boolean;
+  ref: React.RefObject<HTMLDivElement | null>;
+  scrollToBottom: (forceSmooth?: boolean) => void;
+};
+//#endregion
+export { useAutoScroll };