# Docs

## installation

- [Installation](/docs/installation): How to install dependencies and structure your app.

## introduction

- [Introduction](/docs/introduction): A comprehensive React Hooks Collection built with Shadcn

## skills

- [AI Skills](/docs/skills): Install AI Skills to help coding assistants understand and use hooks correctly.

## lib

- [createEffectWithTarget](/docs/lib/create-effect-with-target): A hook to create an effect with a target.
- [isBrowser](/docs/lib/is-browser): A library that checks if the code is running in a browser.
- [createContext](/docs/lib/create-context): Create a context object.

## hooks

- [useActiveElement](/docs/hooks/use-active-element): A hook to track the currently focused element in the document
- [useBattery](/docs/hooks/use-battery): A hook to monitor battery information
- [useBoolean](/docs/hooks/use-boolean): A hook to toggle a boolean value
- [useClickAnyWhere](/docs/hooks/use-click-any-where): A hook to click anywhere
- [useClickAway](/docs/hooks/use-click-away): A hook to click away from an element
- [useClipboard](/docs/hooks/use-clipboard): A hook to copy text to clipboard
- [useControllableValue](/docs/hooks/use-controllable-value): A hook to manage a controllable value
- [useCounter](/docs/hooks/use-counter): A hook that creates a counter.
- [useCreation](/docs/hooks/use-creation): A hook to create a value only once
- [useCustomCompareEffect](/docs/hooks/use-custom-compare-effect): A hook like useEffect but with a custom compare function
- [useDebounce](/docs/hooks/use-debounce): A hook to debounce a value
- [useDebounceEffect](/docs/hooks/use-debounce-effect): A hook to debounce an effect
- [useDebounceFn](/docs/hooks/use-debounce-fn): A hook to debounce a function
- [useDeepCompareEffect](/docs/hooks/use-deep-compare-effect): A hook to use a deep compare effect
- [useDeepCompareLayoutEffect](/docs/hooks/use-deep-compare-layout-effect): A hook to use a deep compare layout effect
- [useDocumentVisibility](/docs/hooks/use-document-visibility): A hook to track the document visibility state
- [useEffectEvent](/docs/hooks/use-effect-event): A hook to declare an effect event
- [useEffectWithTarget](/docs/hooks/use-effect-with-target): A hook to create an effect with a target element that re-runs when the target or dependencies change
- [useElementSize](/docs/hooks/use-element-size): A hook to track an element's width and height
- [useFps](/docs/hooks/use-fps): A hook to calculate the FPS
- [useEventListener](/docs/hooks/use-event-listener): A hook to attach event listeners to DOM elements, the window, or media query lists.
- [useFullscreen](/docs/hooks/use-fullscreen): A hook to manage fullscreen state
- [useHash](/docs/hooks/use-hash): A hook to get current hash
- [useHover](/docs/hooks/use-hover): A hook to check if the mouse is hovering over an element
- [useInViewport](/docs/hooks/use-in-viewport): A hook to check if an element is in the viewport
- [useInterval](/docs/hooks/use-interval): A hook that creates an interval.
- [useIsHydrated](/docs/hooks/use-is-hydrated): A hook to check if the component is hydrated
- [useIsOnline](/docs/hooks/use-is-online): A hook to check if the user is online
- [useIsMatchMedia](/docs/hooks/use-is-match-media): A hook to check if the media query matches
- [useIsomorphicLayoutEffect](/docs/hooks/use-isomorphic-layout-effect): A hook to use layout effect on the client side
- [useLatest](/docs/hooks/use-latest): A hook to get the latest value of a variable
- [useLockFn](/docs/hooks/use-lock-fn): A hook to lock a function until the previous promise is resolved
- [useMcp](/docs/hooks/use-mcp): A hook to get the latest value of a variable
- [useMemoizedFn](/docs/hooks/use-memoized-fn): A hook to declare a memoized function
- [useMount](/docs/hooks/use-mount): A hook to run a function when the component mounts
- [useMouse](/docs/hooks/use-mouse): A hook to track mouse position with optional touch support
- [useNetwork](/docs/hooks/use-network): A hook to get the network state
- [useOs](/docs/hooks/use-os): A hook to detect the current operating system
- [usePrevious](/docs/hooks/use-previous): A hook to get the previous value of a variable
- [useResetState](/docs/hooks/use-reset-state): A hook to reset a state
- [useQuery](/docs/hooks/use-query): useQuery is a hook that allows you to fetch data from an API and cache the results.
- [useScrollLock](/docs/hooks/use-scroll-lock): A hook to lock the scroll of the body
- [useStickToBottom](/docs/hooks/use-stick-to-bottom): A lightweight React Hook intended mainly for AI chat applications, for smoothly sticking to bottom of messages
- [useSWR](/docs/hooks/use-swr): A hook to get the latest value of a variable
- [useTextSelection](/docs/hooks/use-text-selection): A hook to get the text selection and its bounding rect from an element
- [useThrottle](/docs/hooks/use-throttle): A hook to throttle a value
- [useThrottleEffect](/docs/hooks/use-throttle-effect): A hook to throttle an effect
- [useThrottleFn](/docs/hooks/use-throttle-fn): A hook to throttle a function
- [useTimeout](/docs/hooks/use-timeout): A hook that creates a timeout.
- [useTitle](/docs/hooks/use-title): A hook to reactively manage document.title
- [useToggle](/docs/hooks/use-toggle): A hook to toggle a value
- [useUnmount](/docs/hooks/use-unmount): A hook to run a function when the component unmounts
- [useUpdateEffect](/docs/hooks/use-update-effect): A hook to run an effect only when the component updates
- [useUpdate](/docs/hooks/use-update): A hook to force a component to re-render
- [useWhyDidYouUpdate](/docs/hooks/use-why-did-you-update): A hook to log the props that changed in a component