diff --git a/docs/.vitepress/config.mts b/docs/.vitepress/config.mts index 8f51ca1f..bde81daa 100644 --- a/docs/.vitepress/config.mts +++ b/docs/.vitepress/config.mts @@ -1,10 +1,27 @@ import { fileURLToPath } from 'node:url'; +import type { DefaultTheme } from 'vitepress'; import { defineConfig } from 'vitepress'; import { getHookItems } from '../src/utils'; export default async () => { - const sidebarHookItems = await getHookItems(); + const hookItems = await getHookItems(); + const sidebarHookItems = hookItems.reduce((categoryItems, hookItem) => { + const category = categoryItems.find((group) => group.text === hookItem.category); + + if (!category) { + categoryItems.push({ text: hookItem.category, items: [hookItem] }); + } else { + category.items!.push(hookItem); + } + + return categoryItems; + }, []); + const homePageFeatures = hookItems.map((item) => ({ + title: item.text, + details: item.description, + link: item.link + })); return defineConfig({ base: '/reactuse/', @@ -19,11 +36,7 @@ export default async () => { }, transformPageData: (pageData) => { if (pageData.relativePath === 'index.md') { - pageData.frontmatter.features = sidebarHookItems.map((item) => ({ - title: item.text, - details: item.description, - link: item.link - })) + pageData.frontmatter.features = homePageFeatures } if (pageData.relativePath.includes('hooks')) { @@ -73,10 +86,7 @@ export default async () => { text: 'Getting started', link: '/getting-started' }, - { - text: 'Hooks', - items: [...sidebarHookItems] - } + ...sidebarHookItems ] } } diff --git a/docs/functions/hooks/[name].md b/docs/functions/hooks/[name].md index e1d90295..3facda43 100644 --- a/docs/functions/hooks/[name].md +++ b/docs/functions/hooks/[name].md @@ -1,4 +1,5 @@ + + + + diff --git a/docs/src/utils/hooks/getHookFile.ts b/docs/src/utils/hooks/getHookFile.ts index 18a9a8cf..4251f3dd 100644 --- a/docs/src/utils/hooks/getHookFile.ts +++ b/docs/src/utils/hooks/getHookFile.ts @@ -2,8 +2,12 @@ import fs from 'node:fs'; export const getHookFile = async (name: string) => { try { - const fileContent = await fs.promises.readFile(`./src/hooks/${name}/${name}.ts`, 'utf-8'); - return fileContent; + const filePath = `./src/hooks/${name}/${name}.ts`; + + const stats = await fs.promises.stat(filePath); + const content = await fs.promises.readFile(filePath, 'utf-8'); + + return { stats, content }; } catch (error) { console.error(`Error reading file: ${error}`); throw error; diff --git a/docs/src/utils/hooks/getHookItems.ts b/docs/src/utils/hooks/getHookItems.ts index 08558adb..b1f745b5 100644 --- a/docs/src/utils/hooks/getHookItems.ts +++ b/docs/src/utils/hooks/getHookItems.ts @@ -5,6 +5,7 @@ import { getHooks } from './getHooks'; interface HookItem { text: string; + category: string; description: string; link: string; } @@ -14,10 +15,10 @@ export const getHookItems = async (): Promise => { const sidebar = await Promise.all( hooks.map(async (hook) => { - const file = await getHookFile(hook); + const { content } = await getHookFile(hook); const jsdocCommentRegex = /\/\*\*\s*\n([^\\*]|(\*(?!\/)))*\*\//; - const match = file.match(jsdocCommentRegex); + const match = content.match(jsdocCommentRegex); if (!match) { console.error(`No jsdoc comment found for ${hook}`); @@ -34,6 +35,7 @@ export const getHookItems = async (): Promise => { return { text: hook, description: jsdoc.description.description, + category: jsdoc.category?.name, link: `/functions/hooks/${hook}` }; }) diff --git a/docs/src/utils/parseHookJsdoc.ts b/docs/src/utils/parseHookJsdoc.ts index 5aca86aa..3cedbc05 100644 --- a/docs/src/utils/parseHookJsdoc.ts +++ b/docs/src/utils/parseHookJsdoc.ts @@ -5,9 +5,10 @@ export const parseHookJsdoc = (file: string) => { const description = jsdoc.tags.find(({ tag }) => tag === 'description'); const usage = jsdoc.tags.find(({ tag }) => tag === 'example'); const deprecated = jsdoc.tags.find(({ tag }) => tag === 'deprecated'); + const category = jsdoc.tags.find(({ tag }) => tag === 'category'); const apiParameters = jsdoc.tags.filter( ({ tag }) => tag === 'param' || tag === 'overload' || tag === 'returns' ); - return { description, usage, apiParameters, deprecated }; + return { description, usage, apiParameters, deprecated, category }; }; diff --git a/src/hooks/useBattery/useBattery.ts b/src/hooks/useBattery/useBattery.ts index 88704fbe..11cbd012 100644 --- a/src/hooks/useBattery/useBattery.ts +++ b/src/hooks/useBattery/useBattery.ts @@ -27,6 +27,7 @@ interface UseBatteryStateReturn { /** * @name useBattery * @description - Hook for getting information about battery status + * @category Browser * * @returns {UseBatteryStateReturn} Object containing battery information & Battery API support * diff --git a/src/hooks/useBoolean/useBoolean.ts b/src/hooks/useBoolean/useBoolean.ts index 730c7dbd..84ef6b48 100644 --- a/src/hooks/useBoolean/useBoolean.ts +++ b/src/hooks/useBoolean/useBoolean.ts @@ -11,6 +11,7 @@ type UseBooleanReturn = [ /** * @name useBoolean * @description - Hook provides a boolean state and a function to toggle the boolean value + * @category Utilities * * @param {boolean} [initialValue=false] The initial boolean value * @returns {UseBooleanReturn} An object containing the boolean state value and utility functions to manipulate the state diff --git a/src/hooks/useBrowserLanguage/useBrowserLanguage.ts b/src/hooks/useBrowserLanguage/useBrowserLanguage.ts index 29a9fdd8..38e39e58 100644 --- a/src/hooks/useBrowserLanguage/useBrowserLanguage.ts +++ b/src/hooks/useBrowserLanguage/useBrowserLanguage.ts @@ -10,6 +10,7 @@ const subscribe = (cb: () => void) => { /** * @name useBrowserLanguage * @description - Hook that returns the current browser language + * @category Browser * * @returns {string} The current browser language * diff --git a/src/hooks/useClickOutside/useClickOutside.ts b/src/hooks/useClickOutside/useClickOutside.ts index 63d69902..dc3e5245 100644 --- a/src/hooks/useClickOutside/useClickOutside.ts +++ b/src/hooks/useClickOutside/useClickOutside.ts @@ -38,6 +38,7 @@ export type UseClickOutside = { /** * @name useClickOutside * @description - Hook to handle click events outside the specified target element(s) + * @category Sensors * * @overload * @template Target The target element(s) diff --git a/src/hooks/useCopyToClipboard/useCopyToClipboard.ts b/src/hooks/useCopyToClipboard/useCopyToClipboard.ts index 3a9d994b..ae2c5714 100644 --- a/src/hooks/useCopyToClipboard/useCopyToClipboard.ts +++ b/src/hooks/useCopyToClipboard/useCopyToClipboard.ts @@ -20,6 +20,7 @@ interface UseCopyToClipboardReturn { /** * @name useCopyToClipboard * @description - Hook that manages a copy to clipboard + * @category Browser * * @returns {UseCopyToClipboardReturn} An object containing the boolean state value and utility functions to manipulate the state * diff --git a/src/hooks/useCounter/useCounter.ts b/src/hooks/useCounter/useCounter.ts index ab09f83a..1ee8a810 100644 --- a/src/hooks/useCounter/useCounter.ts +++ b/src/hooks/useCounter/useCounter.ts @@ -41,6 +41,7 @@ export type UseCounter = { /** * @name useCounter * @description - Hook that manages a counter with increment, decrement, reset, and set functionalities + * @category Utilities * * @overload * @param {number} [initialValue=0] The initial number value @@ -56,7 +57,7 @@ export type UseCounter = { * * @example * const { count, dec, inc, reset, set } = useCounter(5); - * + * * @example * const { count, dec, inc, reset, set } = useCounter({ initialValue: 5, min: 0, max: 10 }); */ diff --git a/src/hooks/useDebounceCallback/useDebounceCallback.ts b/src/hooks/useDebounceCallback/useDebounceCallback.ts index 763466f0..e176f3de 100644 --- a/src/hooks/useDebounceCallback/useDebounceCallback.ts +++ b/src/hooks/useDebounceCallback/useDebounceCallback.ts @@ -5,6 +5,7 @@ import { debounce } from '@/utils/helpers'; /** * @name useDebounceCallback * @description - Hook that creates a debounced callback and returns a stable reference of it + * @category Utilities * * @template Params The type of the params * @template Return The type of the return diff --git a/src/hooks/useDebounceValue/useDebounceValue.ts b/src/hooks/useDebounceValue/useDebounceValue.ts index d9e60b20..c0af4bf9 100644 --- a/src/hooks/useDebounceValue/useDebounceValue.ts +++ b/src/hooks/useDebounceValue/useDebounceValue.ts @@ -5,6 +5,7 @@ import { useDebounceCallback } from '../useDebounceCallback/useDebounceCallback' /** * @name useDebounceValue * @description - Hook that creates a debounced value and returns a stable reference of it + * @category Utilities * * @template Value The type of the value * @param {Value} value The value to be debounced diff --git a/src/hooks/useDefault/useDefault.ts b/src/hooks/useDefault/useDefault.ts index 38660a38..1335a4cb 100644 --- a/src/hooks/useDefault/useDefault.ts +++ b/src/hooks/useDefault/useDefault.ts @@ -3,6 +3,7 @@ import { useState } from 'react'; /** * @name useDefault * @description - Hook that returns the default value + * @category Utilities * * @template Value The type of the value * @param {Value} initialValue The initial value diff --git a/src/hooks/useDidUpdate/useDidUpdate.ts b/src/hooks/useDidUpdate/useDidUpdate.ts index e8f2dcfa..dd65f56b 100644 --- a/src/hooks/useDidUpdate/useDidUpdate.ts +++ b/src/hooks/useDidUpdate/useDidUpdate.ts @@ -6,6 +6,7 @@ import { useIsomorphicLayoutEffect } from '../useIsomorphicLayoutEffect/useIsomo /** * @name useDidUpdate * @description – Hook that behaves like useEffect, but skips the effect on the initial render + * @category Lifecycle * * @param {EffectCallback} effect The effect callback * @param {DependencyList} [deps] The dependencies list for the effect diff --git a/src/hooks/useDisclosure/useDisclosure.ts b/src/hooks/useDisclosure/useDisclosure.ts index ce0eda52..9b4d6b23 100644 --- a/src/hooks/useDisclosure/useDisclosure.ts +++ b/src/hooks/useDisclosure/useDisclosure.ts @@ -15,6 +15,7 @@ interface UseDisclosureReturn { /** * @name useDisclosure * @description - Hook that allows you to open and close a modal + * @category Utilities * * @param {boolean} initialValue The initial value of the component * @param {() => void} [options.onOpen] The callback function to be invoked on open diff --git a/src/hooks/useDocumentEvent/useDocumentEvent.ts b/src/hooks/useDocumentEvent/useDocumentEvent.ts index 009daad6..9fad155f 100644 --- a/src/hooks/useDocumentEvent/useDocumentEvent.ts +++ b/src/hooks/useDocumentEvent/useDocumentEvent.ts @@ -4,6 +4,7 @@ import { useEventListener } from '../useEventListener/useEventListener'; /** * @name useDocumentEvent * @description - Hook attaches an event listener to the document object for the specified event + * @category Browser * * @template Event Key of document event map. * @param {Event} event The event to listen for. diff --git a/src/hooks/useDocumentTitle/useDocumentTitle.ts b/src/hooks/useDocumentTitle/useDocumentTitle.ts index 3038ff1a..6af0122a 100644 --- a/src/hooks/useDocumentTitle/useDocumentTitle.ts +++ b/src/hooks/useDocumentTitle/useDocumentTitle.ts @@ -21,6 +21,7 @@ export type UseDocumentTitleReturn = [ /** * @name useDocumentTitle * @description - Hook that manages the document title and allows updating it + * @category Browser * * @param {string} [value] The initial title. If not provided, the current document title will be used * @param {boolean} [options.restoreOnUnmount] Restore the previous title on unmount diff --git a/src/hooks/useDocumentVisibility/useDocumentVisibility.ts b/src/hooks/useDocumentVisibility/useDocumentVisibility.ts index 56e072af..632f9220 100644 --- a/src/hooks/useDocumentVisibility/useDocumentVisibility.ts +++ b/src/hooks/useDocumentVisibility/useDocumentVisibility.ts @@ -12,6 +12,7 @@ const subscribe = (callback: () => void) => { /** * @name useDocumentVisibility * @description – Hook that provides the current visibility state of the document + * @category Browser * * @returns {DocumentVisibilityState} The current visibility state of the document, which can be 'visible' or 'hidden' * diff --git a/src/hooks/useEvent/useEvent.ts b/src/hooks/useEvent/useEvent.ts index e2762b90..2d7d9bf8 100644 --- a/src/hooks/useEvent/useEvent.ts +++ b/src/hooks/useEvent/useEvent.ts @@ -5,6 +5,7 @@ import { useIsomorphicLayoutEffect } from '../useIsomorphicLayoutEffect/useIsomo /** * @name useEvent * @description - Hook that creates an event and returns a stable reference of it + * @category Browser * * @template Params The type of the params * @template Return The type of the return diff --git a/src/hooks/useEyeDropper/useEyeDropper.ts b/src/hooks/useEyeDropper/useEyeDropper.ts index 6944a8f7..81797f04 100644 --- a/src/hooks/useEyeDropper/useEyeDropper.ts +++ b/src/hooks/useEyeDropper/useEyeDropper.ts @@ -23,6 +23,7 @@ export interface UseEyeDropperReturn { /** * @name useEyeDropper * @description - Hook that gives you access to the eye dropper + * @category Browser * * @param {string} [initialValue=undefined] The initial value for the eye dropper * @returns {UseEyeDropperReturn} An object containing the supported status, the value and the open method diff --git a/src/hooks/useFavicon/useFavicon.ts b/src/hooks/useFavicon/useFavicon.ts index 47560032..a8eace61 100644 --- a/src/hooks/useFavicon/useFavicon.ts +++ b/src/hooks/useFavicon/useFavicon.ts @@ -10,6 +10,7 @@ export type UseFaviconReturn = [string, Dispatch>]; /** * @name useFavicon * @description - Hook that manages the favicon + * @category Browser * * @param {string} [initialFavicon] The initial favicon. If not provided, the current favicon will be used * @returns {UseFaviconReturn} An array containing the current favicon and a function to update the favicon diff --git a/src/hooks/useField/useField.ts b/src/hooks/useField/useField.ts index f92fb043..6c997a51 100644 --- a/src/hooks/useField/useField.ts +++ b/src/hooks/useField/useField.ts @@ -82,8 +82,9 @@ export interface UseFieldReturn { } /** - * @name UseField + * @name useField * @description - Hook to manage a form field + * @category Utilities * * @template Value The input value * @template Type The input value type diff --git a/src/hooks/useFps/useFps.ts b/src/hooks/useFps/useFps.ts index e193a6bb..db8bf64a 100644 --- a/src/hooks/useFps/useFps.ts +++ b/src/hooks/useFps/useFps.ts @@ -3,6 +3,7 @@ import { useEffect, useState } from 'react'; /** * @name useFps * @description - Hook that measures frames per second + * @category Sensors * * @returns {number} A number which determines frames per second * diff --git a/src/hooks/useFullscreen/useFullscreen.ts b/src/hooks/useFullscreen/useFullscreen.ts index aa7a705e..e6dfd807 100644 --- a/src/hooks/useFullscreen/useFullscreen.ts +++ b/src/hooks/useFullscreen/useFullscreen.ts @@ -53,6 +53,7 @@ export type UseFullScreen = { /** * @name useFullscreen * @description - Hook to handle fullscreen events + * @category Browser * * @overload * @template Target The target element for fullscreen diff --git a/src/hooks/useHash/useHash.ts b/src/hooks/useHash/useHash.ts index 41cfa077..d6da29e4 100644 --- a/src/hooks/useHash/useHash.ts +++ b/src/hooks/useHash/useHash.ts @@ -8,6 +8,7 @@ type UseHashReturn = [string, (value: string) => void]; /** * @name useHash * @description - Hook that manages the hash value + * @category Browser * * @returns {UseHashReturn} An array containing the hash value and a function to set the hash value * diff --git a/src/hooks/useHotkeys/useHotkeys.ts b/src/hooks/useHotkeys/useHotkeys.ts index b2168c65..d737a9f1 100644 --- a/src/hooks/useHotkeys/useHotkeys.ts +++ b/src/hooks/useHotkeys/useHotkeys.ts @@ -39,6 +39,7 @@ export type UseHotkeysKey = { key: string; code: string; alias: string }; /** * @name useHotkeys * @description - Hook that listens for hotkeys + * @category Sensors * * @param {UseHotkeysHotkeys} hotkeys The key or keys to listen for * @param {(event: KeyboardEvent) => void} callback The callback function to be called when the hotkey is pressed diff --git a/src/hooks/useHover/useHover.ts b/src/hooks/useHover/useHover.ts index 87fb64e4..9371cab0 100644 --- a/src/hooks/useHover/useHover.ts +++ b/src/hooks/useHover/useHover.ts @@ -32,6 +32,7 @@ export type UseHover = { /** * @name useHover * @description - Hook that defines the logic when hovering an element + * @category Sensors * * @overload * @template Target The target element diff --git a/src/hooks/useIdle/useIdle.ts b/src/hooks/useIdle/useIdle.ts index 9cab3ba3..074797cd 100644 --- a/src/hooks/useIdle/useIdle.ts +++ b/src/hooks/useIdle/useIdle.ts @@ -28,6 +28,7 @@ export interface UseIdleReturn { /** * @name useIdle * @description - Hook that defines the logic when the user is idle + * @category Sensors * * @param {number} [milliseconds=ONE_MINUTE] The idle time in milliseconds * @param {boolean} [options.initialState=false] The options for the hook diff --git a/src/hooks/useInterval/useInterval.ts b/src/hooks/useInterval/useInterval.ts index 22426eb5..6cc200db 100644 --- a/src/hooks/useInterval/useInterval.ts +++ b/src/hooks/useInterval/useInterval.ts @@ -26,6 +26,7 @@ type UseInterval = { /** * @name useInterval * @description - Hook that makes and interval and returns controlling functions + * @category Time * * @overload * @param {() => void} callback Any callback function diff --git a/src/hooks/useIsFirstRender/useIsFirstRender.ts b/src/hooks/useIsFirstRender/useIsFirstRender.ts index 92a26000..2303041e 100644 --- a/src/hooks/useIsFirstRender/useIsFirstRender.ts +++ b/src/hooks/useIsFirstRender/useIsFirstRender.ts @@ -3,6 +3,7 @@ import { useRef } from 'react'; /** * @name useIsFirstRender * @description - Hook that returns true if the component is first render + * @category Lifecycle * * @returns {boolean} True if the component is first render * diff --git a/src/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.ts b/src/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.ts index 0bca22ab..1aa7bbe6 100644 --- a/src/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.ts +++ b/src/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.ts @@ -5,6 +5,7 @@ import { isClient } from '@/utils/helpers'; /** * @name useIsomorphicLayoutEffect * @description - Hook conditionally selects either `useLayoutEffect` or `useEffect` based on the environment + * @category Lifecycle * * @example * useIsomorphicLayoutEffect(() => console.log('effect'), []) diff --git a/src/hooks/useKeyPress/useKeyPress.ts b/src/hooks/useKeyPress/useKeyPress.ts index d471c729..0480a284 100644 --- a/src/hooks/useKeyPress/useKeyPress.ts +++ b/src/hooks/useKeyPress/useKeyPress.ts @@ -15,6 +15,7 @@ export type UseKeyPressOptions = { /** * @name useKeyPress * @description - Hook that listens for key press events + * @category Sensors * * @param {UseKeyPressKey} key The key or keys to listen for * @param {UseEventListenerTarget} [options.target=window] The target to attach the event listeners to diff --git a/src/hooks/useKeyboard/useKeyboard.ts b/src/hooks/useKeyboard/useKeyboard.ts index 768b4749..7aa557b8 100644 --- a/src/hooks/useKeyboard/useKeyboard.ts +++ b/src/hooks/useKeyboard/useKeyboard.ts @@ -14,6 +14,7 @@ export type UseKeyboardParams = { /** * @name useKeyboard * @description - Hook that help to listen for keyboard events + * @category Sensors * * @param {UseEventListenerTarget} [target=window] The target to attach the event listeners to * @param {(event: KeyboardEvent) => void} [onKeyDown] The callback function to be invoked on key down diff --git a/src/hooks/useKeysPressed/useKeysPressed.ts b/src/hooks/useKeysPressed/useKeysPressed.ts index b92e50ac..972d8380 100644 --- a/src/hooks/useKeysPressed/useKeysPressed.ts +++ b/src/hooks/useKeysPressed/useKeysPressed.ts @@ -16,6 +16,7 @@ interface UseKeysPressedParams { /** * @name useKeysPressed * @description - Hook for get keys that were pressed + * @category Sensors * * @param {UseEventListenerTarget} [params.target=window] The target to attach the event listeners to * @param {boolean} [params.enabled=bollean] Enable or disable the event listeners diff --git a/src/hooks/useList/useList.ts b/src/hooks/useList/useList.ts index 21d2449d..e7bd8a35 100644 --- a/src/hooks/useList/useList.ts +++ b/src/hooks/useList/useList.ts @@ -21,6 +21,7 @@ export interface UseListReturn { /** * @name useList * @description - Hook that defines the logic when unmounting a component + * @category Utilities * * @template Item The type of the item * @param {Item[] | (() => Item[])} initialList The initial list of items diff --git a/src/hooks/useLocalStorage/useLocalStorage.ts b/src/hooks/useLocalStorage/useLocalStorage.ts index 306c6047..4e23e8a9 100644 --- a/src/hooks/useLocalStorage/useLocalStorage.ts +++ b/src/hooks/useLocalStorage/useLocalStorage.ts @@ -4,6 +4,7 @@ import { useStorage } from '../useStorage/useStorage'; /** * @name useLocalStorage * @description - Hook that manages local storage value + * @category Browser * * @template Value The type of the value * @param {string} key The key of the storage diff --git a/src/hooks/useLogger/useLogger.ts b/src/hooks/useLogger/useLogger.ts index 60a7e7b4..06eb7b87 100644 --- a/src/hooks/useLogger/useLogger.ts +++ b/src/hooks/useLogger/useLogger.ts @@ -5,6 +5,7 @@ import { useDidUpdate } from '../useDidUpdate/useDidUpdate'; /** * @name useLogger * @description - Hook for debugging lifecycle + * @category Lifecycle * * @param {string} name The name or identifier for the logger * @param {unknown[]} params Additional arguments to be logged diff --git a/src/hooks/useLongPress/useLongPress.ts b/src/hooks/useLongPress/useLongPress.ts index 6feafe0e..b2b566d4 100644 --- a/src/hooks/useLongPress/useLongPress.ts +++ b/src/hooks/useLongPress/useLongPress.ts @@ -40,6 +40,7 @@ const DEFAULT_THRESHOLD_TIME = 400; /** * @name useLongPress * @description - Hook that defines the logic when long pressing an element + * @category Sensors * * @overload * @template Target The target element diff --git a/src/hooks/useMap/useMap.ts b/src/hooks/useMap/useMap.ts index 8e764aa1..251203bb 100644 --- a/src/hooks/useMap/useMap.ts +++ b/src/hooks/useMap/useMap.ts @@ -21,6 +21,7 @@ interface UseMapReturn { /** * @name useMap * @description - Hook that manages a map structure + * @category Utilities * * @template Value The type of the value * @param {Value[]} [values] The initial array of the map diff --git a/src/hooks/useMediaQuery/useMediaQuery.ts b/src/hooks/useMediaQuery/useMediaQuery.ts index da9a3247..b1e2a61a 100644 --- a/src/hooks/useMediaQuery/useMediaQuery.ts +++ b/src/hooks/useMediaQuery/useMediaQuery.ts @@ -5,6 +5,7 @@ const getServerSnapshot = () => false; /** * @name useMediaQuery * @description - Hook that manages a media query + * @category Browser * * @param {string} query The media query string * @returns {boolean} A boolean indicating if the media query matches diff --git a/src/hooks/useMemory/useMemory.ts b/src/hooks/useMemory/useMemory.ts index 816b83c1..0e2d14fc 100644 --- a/src/hooks/useMemory/useMemory.ts +++ b/src/hooks/useMemory/useMemory.ts @@ -22,6 +22,7 @@ export interface UseMemoryReturn { /** * @name useMemory * @description - Hook that gives you current memory usage + * @category Browser * * @returns {UseMemoryReturn} An object containing the current memory usage * diff --git a/src/hooks/useMount/useMount.ts b/src/hooks/useMount/useMount.ts index 2c436e0b..a979cf97 100644 --- a/src/hooks/useMount/useMount.ts +++ b/src/hooks/useMount/useMount.ts @@ -4,6 +4,7 @@ import { useEffect } from 'react'; /** * @name useMount * @description - Hook that executes a callback when the component mounts + * @category Lifecycle * * @param {EffectCallback} effect The callback to execute * diff --git a/src/hooks/useMouse/useMouse.ts b/src/hooks/useMouse/useMouse.ts index e65b6947..82526745 100644 --- a/src/hooks/useMouse/useMouse.ts +++ b/src/hooks/useMouse/useMouse.ts @@ -44,6 +44,7 @@ export type UseMouse = { /** * @name useMouse * @description - Hook that manages a mouse position + * @category Sensors * * @overload * @template Target The target element diff --git a/src/hooks/useMutation/useMutation.ts b/src/hooks/useMutation/useMutation.ts index 8c863d16..2da452b6 100644 --- a/src/hooks/useMutation/useMutation.ts +++ b/src/hooks/useMutation/useMutation.ts @@ -33,6 +33,7 @@ interface UseMutationReturn { /** * @name useMutation * @description - Hook that defines the logic when mutate data + * @category Utilities * * @template Body The type of the body * @template Data The type of the data diff --git a/src/hooks/useNetwork/useNetwork.ts b/src/hooks/useNetwork/useNetwork.ts index e04e6824..af1dda2f 100644 --- a/src/hooks/useNetwork/useNetwork.ts +++ b/src/hooks/useNetwork/useNetwork.ts @@ -40,6 +40,7 @@ export const getConnection = () => /** * @name useNetwork * @description - Hook to track network status + * @category Sensors * * @returns {UseNetworkReturn} An object containing the network status * diff --git a/src/hooks/useOnline/useOnline.ts b/src/hooks/useOnline/useOnline.ts index 54fe3895..9c3aba4d 100644 --- a/src/hooks/useOnline/useOnline.ts +++ b/src/hooks/useOnline/useOnline.ts @@ -14,6 +14,7 @@ const subscribe = (callback: () => void) => { /** * @name useOnline * @description - Hook that manages if the user is online + * @category Sensors * * @returns {boolean} A boolean indicating if the user is online * diff --git a/src/hooks/useOperatingSystem/useOperatingSystem.ts b/src/hooks/useOperatingSystem/useOperatingSystem.ts index f3973f6c..f86c0f4e 100644 --- a/src/hooks/useOperatingSystem/useOperatingSystem.ts +++ b/src/hooks/useOperatingSystem/useOperatingSystem.ts @@ -20,6 +20,7 @@ export const getOperatingSystem = (): OperatingSystem => { /** * @name useOperatingSystem * @description - Hook that returns the operating system of the current browser + * @category Browser * * @returns {OperatingSystem} The operating system * diff --git a/src/hooks/useOrientation/useOrientation.ts b/src/hooks/useOrientation/useOrientation.ts index 61b407a0..95099372 100644 --- a/src/hooks/useOrientation/useOrientation.ts +++ b/src/hooks/useOrientation/useOrientation.ts @@ -13,6 +13,7 @@ export interface UseOrientationReturn { /** * @name useOrientation * @description - Hook that returns the current screen orientation + * @category Browser * * @returns {UseOrientationReturn} An object containing the current screen orientation * diff --git a/src/hooks/usePageLeave/usePageLeave.ts b/src/hooks/usePageLeave/usePageLeave.ts index 3a568119..34509455 100644 --- a/src/hooks/usePageLeave/usePageLeave.ts +++ b/src/hooks/usePageLeave/usePageLeave.ts @@ -5,6 +5,7 @@ import { useEvent } from '../useEvent/useEvent'; /** * @name usePageLeave * @description - Hook what calls given function when mouse leaves the page + * @category Sensors * * @param {() => void} [callback] The callback function what calls then mouse leaves the page * @returns {boolean} A boolean which determines if the mouse left the page diff --git a/src/hooks/usePaint/usePaint.ts b/src/hooks/usePaint/usePaint.ts index 05980f17..c5102937 100644 --- a/src/hooks/usePaint/usePaint.ts +++ b/src/hooks/usePaint/usePaint.ts @@ -49,6 +49,7 @@ export type UsePaint = { /** * @name usePaint * @description - Hook that allows you to draw in a specific area + * @category Browser * * @overload * @template Target The target element diff --git a/src/hooks/usePermission/usePermission.ts b/src/hooks/usePermission/usePermission.ts index 863500d7..510d6b09 100644 --- a/src/hooks/usePermission/usePermission.ts +++ b/src/hooks/usePermission/usePermission.ts @@ -31,6 +31,7 @@ export interface UsePermissionReturn { /** * @name usePermission * @description - Hook that gives you the state of permission + * @category Browser * * @returns {UsePermissionReturn} An object containing the state and the supported status * diff --git a/src/hooks/usePreferredColorScheme/usePreferredColorScheme.ts b/src/hooks/usePreferredColorScheme/usePreferredColorScheme.ts index 3051e003..0222b9c4 100644 --- a/src/hooks/usePreferredColorScheme/usePreferredColorScheme.ts +++ b/src/hooks/usePreferredColorScheme/usePreferredColorScheme.ts @@ -6,6 +6,7 @@ export type UsePreferredColorSchemeReturn = 'dark' | 'light' | 'no-preference'; /** * @name usePreferredColorScheme * @description - Hook that returns user preferred color scheme + * @category Browser * * @returns {UsePreferredColorSchemeReturn} String of preferred color scheme * diff --git a/src/hooks/usePreferredLanguages/usePreferredLanguages.ts b/src/hooks/usePreferredLanguages/usePreferredLanguages.ts index 490cf242..b28024d4 100644 --- a/src/hooks/usePreferredLanguages/usePreferredLanguages.ts +++ b/src/hooks/usePreferredLanguages/usePreferredLanguages.ts @@ -12,6 +12,7 @@ const subscribe = (callback: () => void) => { /** * @name usePreferredLanguages * @description Hook that returns a browser preferred languages from navigator + * @category Browser * * @returns {readonly string[]} An array of strings representing the user's preferred languages * diff --git a/src/hooks/usePrevious/usePrevious.ts b/src/hooks/usePrevious/usePrevious.ts index 9fc688f7..b4075055 100644 --- a/src/hooks/usePrevious/usePrevious.ts +++ b/src/hooks/usePrevious/usePrevious.ts @@ -3,6 +3,7 @@ import { useEffect, useRef } from 'react'; /** * @name usePrevious * @description - Hook that returns the previous value + * @category Utilities * * @template Value The type of the value * @param {Value} value The value to get the previous value diff --git a/src/hooks/useQuery/useQuery.ts b/src/hooks/useQuery/useQuery.ts index 9ffd22a0..9b223796 100644 --- a/src/hooks/useQuery/useQuery.ts +++ b/src/hooks/useQuery/useQuery.ts @@ -44,6 +44,7 @@ interface UseQueryReturn { /** * @name useQuery * @description - Hook that defines the logic when query data + * @category Utilities * * @template Data The type of the data * @param {() => Promise} callback The callback function to be invoked diff --git a/src/hooks/useQueue/useQueue.ts b/src/hooks/useQueue/useQueue.ts index d6b6b87e..b0532f94 100644 --- a/src/hooks/useQueue/useQueue.ts +++ b/src/hooks/useQueue/useQueue.ts @@ -22,6 +22,7 @@ export interface UseQueueReturn { /** * @name useQueue * @description - Hook that manages a queue + * @category Utilities * * @template Value The type of the value * @param {Value[]} [initialValue=[]] The initial value of the queue diff --git a/src/hooks/useRenderCount/useRenderCount.ts b/src/hooks/useRenderCount/useRenderCount.ts index 4686414b..73f4193d 100644 --- a/src/hooks/useRenderCount/useRenderCount.ts +++ b/src/hooks/useRenderCount/useRenderCount.ts @@ -3,6 +3,7 @@ import { useEffect, useRef } from 'react'; /** * @name useRenderCount * @description - Hook returns count component render times + * @category Lifecycle * * @returns {number} A number which determines how many times component renders * diff --git a/src/hooks/useRenderInfo/useRenderInfo.ts b/src/hooks/useRenderInfo/useRenderInfo.ts index 438f4685..ebadc980 100644 --- a/src/hooks/useRenderInfo/useRenderInfo.ts +++ b/src/hooks/useRenderInfo/useRenderInfo.ts @@ -10,6 +10,7 @@ export interface UseRenderInfoReturn { /** * @name useRenderInfo * @description - Hook for getting information about component rerender + * @category Lifecycle * * @param {string} [name='Unknown'] Component name * @param {boolean} [log=true] Toggle logging diff --git a/src/hooks/useRerender/useRerender.ts b/src/hooks/useRerender/useRerender.ts index 1a7093dd..b8c58e9e 100644 --- a/src/hooks/useRerender/useRerender.ts +++ b/src/hooks/useRerender/useRerender.ts @@ -11,6 +11,7 @@ interface UseRerenderReturns { /** * @name useRerender * @description - Hook that defines the logic to force rerender a component + * @category Lifecycle * * @returns {UseRerenderReturns} An object containing the id and update function * diff --git a/src/hooks/useScript/useScript.ts b/src/hooks/useScript/useScript.ts index f10885f0..6ddbb98b 100644 --- a/src/hooks/useScript/useScript.ts +++ b/src/hooks/useScript/useScript.ts @@ -14,6 +14,7 @@ export interface UseScriptOptions extends ComponentProps<'script'> { /** * @name useScript * @description - Hook that manages a script with onLoad, onError, and removeOnUnmount functionalities + * @category Browser * * @param {string} src The source of the script * @param {UseScriptOptions} [options] The options of the script extends from attributes script tag diff --git a/src/hooks/useSessionStorage/useSessionStorage.ts b/src/hooks/useSessionStorage/useSessionStorage.ts index ee265a1c..2d75e3f2 100644 --- a/src/hooks/useSessionStorage/useSessionStorage.ts +++ b/src/hooks/useSessionStorage/useSessionStorage.ts @@ -4,6 +4,7 @@ import { useStorage } from '../useStorage/useStorage'; /** * @name useSessionStorage * @description - Hook that manages session storage value + * @category Browser * * @template Value The type of the value * @param {string} key The key of the storage diff --git a/src/hooks/useSet/useSet.ts b/src/hooks/useSet/useSet.ts index 70ac46ce..0cf9076b 100644 --- a/src/hooks/useSet/useSet.ts +++ b/src/hooks/useSet/useSet.ts @@ -43,6 +43,7 @@ interface UseSetReturn { /** * @name useSet * @description - Hook that manages a set structure + * @category Utilities * * @template Value The type of the value * @param {Value[]} [values] The initial array of the set diff --git a/src/hooks/useShare/useShare.ts b/src/hooks/useShare/useShare.ts index ad4b6b23..6bfe84b9 100644 --- a/src/hooks/useShare/useShare.ts +++ b/src/hooks/useShare/useShare.ts @@ -23,6 +23,7 @@ export interface UseShareReturn { /** * @name useShare * @description - Hook that utilizes the share api + * @category Browser * * @param {UseShareParams} [params] The use share options * @returns {UseShareReturn} diff --git a/src/hooks/useStep/useStep.ts b/src/hooks/useStep/useStep.ts index 0bba53ee..95acbab5 100644 --- a/src/hooks/useStep/useStep.ts +++ b/src/hooks/useStep/useStep.ts @@ -33,6 +33,7 @@ const FIRST_STEP_VALUE = 1; /** * @name useStep * @description - Hook that create stepper + * @category Utilities * * @overload * @param {number} max Maximum number of steps diff --git a/src/hooks/useTextSelection/useTextSelection.ts b/src/hooks/useTextSelection/useTextSelection.ts index 533ea30f..4d63c526 100644 --- a/src/hooks/useTextSelection/useTextSelection.ts +++ b/src/hooks/useTextSelection/useTextSelection.ts @@ -24,6 +24,7 @@ export interface UseTextSelectionReturn { /** * @name useTextSelection * @description - Hook that manages the text selection + * @category Sensors * * @returns {UseTextSelectionReturn} An object containing the current text selection * diff --git a/src/hooks/useTime/useTime.ts b/src/hooks/useTime/useTime.ts index 39c61885..a6c5a2ec 100644 --- a/src/hooks/useTime/useTime.ts +++ b/src/hooks/useTime/useTime.ts @@ -18,6 +18,7 @@ export interface UseTimeReturn { /** * @name useTime * @description - Hook that gives you current time in different values + * @category Time * * @returns {UseTimeReturn} An object containing the current time * diff --git a/src/hooks/useTimeout/useTimeout.ts b/src/hooks/useTimeout/useTimeout.ts index 90aab7b8..7b930e31 100644 --- a/src/hooks/useTimeout/useTimeout.ts +++ b/src/hooks/useTimeout/useTimeout.ts @@ -13,6 +13,7 @@ interface UseTimeoutReturn { /** * @name useTimeout * @description - Hook that executes a callback function after a specified delay + * @category Time * * @param {() => void} callback The function to be executed after the timeout * @param {number} delay The delay in milliseconds before the timeout executes the callback function diff --git a/src/hooks/useToggle/useToggle.ts b/src/hooks/useToggle/useToggle.ts index 101167d2..02873763 100644 --- a/src/hooks/useToggle/useToggle.ts +++ b/src/hooks/useToggle/useToggle.ts @@ -7,6 +7,7 @@ export type UseToggleReturn = readonly [Value, (value?: Value) => void]; /** * @name useToggle * @description - Hook that create toggle + * @category Utilities * * @template Value The type of the value * @param {Value[]} [values=[false, true]] The values to toggle diff --git a/src/hooks/useUnmount/useUnmount.ts b/src/hooks/useUnmount/useUnmount.ts index dabe63f6..f7d939ca 100644 --- a/src/hooks/useUnmount/useUnmount.ts +++ b/src/hooks/useUnmount/useUnmount.ts @@ -3,6 +3,7 @@ import { useEffect, useRef } from 'react'; /** * @name useUnmount * @description - Hook that defines the logic when unmounting a component + * @category Lifecycle * * @param {() => void} callback The callback function to be invoked on component unmount * @returns {void} diff --git a/src/hooks/useWebSocket/useWebSocket.ts b/src/hooks/useWebSocket/useWebSocket.ts index dd6eae12..1651b749 100644 --- a/src/hooks/useWebSocket/useWebSocket.ts +++ b/src/hooks/useWebSocket/useWebSocket.ts @@ -28,6 +28,7 @@ export interface UseWebSocketReturn { /** * @name useWebSocket * @description - Hook that connects to a WebSocket server and handles incoming and outgoing messages + * @category Network * * @param {UseWebSocketUrl} url The URL of the WebSocket server * @param {(webSocket: WebSocket) => void} [options.onConnected] The callback function that is called when the WebSocket connection is established diff --git a/src/hooks/useWindowEvent/useWindowEvent.ts b/src/hooks/useWindowEvent/useWindowEvent.ts index 46ece11c..7e0cdabb 100644 --- a/src/hooks/useWindowEvent/useWindowEvent.ts +++ b/src/hooks/useWindowEvent/useWindowEvent.ts @@ -4,6 +4,7 @@ import { useEventListener } from '../useEventListener/useEventListener'; /** * @name useWindowEvent * @description - Hook attaches an event listener to the window object for the specified event + * @category Browser * * @template Event Key of window event map. * @param {Event} event The event to listen for. diff --git a/src/hooks/useWindowSize/useWindowSize.ts b/src/hooks/useWindowSize/useWindowSize.ts index 55537f83..301b08c8 100644 --- a/src/hooks/useWindowSize/useWindowSize.ts +++ b/src/hooks/useWindowSize/useWindowSize.ts @@ -21,6 +21,7 @@ export interface UseWindowSizeReturn { /** * @name useWindowSize * @description - Hook that manages a window size + * @category Browser * * @param {number} [params.initialWidth=Number.POSITIVE_INFINITY] The initial window width * @param {number} [params.initialHeight=Number.POSITIVE_INFINITY] The initial window height diff --git a/src/hooks/useWizard/useWizard.ts b/src/hooks/useWizard/useWizard.ts index 1dedc2bf..ec18e1a0 100644 --- a/src/hooks/useWizard/useWizard.ts +++ b/src/hooks/useWizard/useWizard.ts @@ -8,6 +8,7 @@ export interface WizardItem { /** * @name useWizard * @description - Hook that manages a wizard + * @category Utilities * * @param {WizardItem[]} map The map of the wizard * @param {WizardStepId} [initialStepId] The initial step id