rooks

Complete Documentationβ
List of all hooksβ
- useBoundingclientrectRef - A hook that tracks the boundingclientrect of an element. It returns a callbackRef so that the element node if changed is easily tracked.
- useBoundingclientrect - A React Hooks package for boundingclientrect
- useCountdown - Count down to a target timestamp and call callbacks every second (or provided peried)
- useCounter - A React Hooks package for counter
- useDebounce - Debounce hook for react
- useDidMount - A React hooks package for componentDidMount
- useDidUpdate - componentDidUpdate hook for react
- useDocumentEventListener - A react hook to an event listener to the document object
- useEffectOnceWhen - Runs a callback effect atmost one time when a condition becomes true
- useEventListenerRef - A react hook to add an event listener to a ref
- useForkRef - A hook that can combine two refs(mutable or callbackRefs) into a single callbackRef
- useFreshRef - Avoid stale state in callbacks with this hook. Auto updates values using a ref.
- useFreshTick - Like useFreshRef but specifically for functions
- useFullscreen - A React Hooks package for fullscreen.
- useInViewRef - Simple hook that monitors element enters or leave the viewport.
- useGeolocation - A hook to provide the geolocation info on client side.
- useInput - A React Hooks package for input
- useIntersectionObserverRef - A hook to register an intersection observer listener
- useIntervalWhen - Sets an interval immediately when a condition is true
- useInterval - A react hook for using setInterval
- useIsomorphicEffect - Resolves to useEffect when window is not in scope and useLayout effect in the browser
- useKeyRef - Very similar to useKey but it returns a ref
- useKey - Keyboard key handler hook for react
- useKeys - A hook which allows to setup callbacks on multiple keypresses at the same time
- useLocalstorageState - UseState but auto updates values to localStorage
- useLocalstorage - Local Storage hook for React
- useMapState - A react hook to manage state in a key value pair map.
- useMergeRefs - Merges any number of refs into a single ref
- useMouse - A React Hooks package for mouse
- useMultiSelectableList - A custom hook to easily select multiple values from a list
- useMutationObserverRef - A hook that tracks mutations of an element. It returns a callbackRef.
- useMutationObserver - A React Hooks package for mutation-observer
- useNavigatorLanguage - A React Hooks package for navigator-language
- useOnWindowResize - A React hook for window on resize event
- useOnWindowScroll - A React hook for window on scroll event
- useOnline - A React Hooks package for online
- useOutsideClickRef - A hook that can track a click event outside a ref. Returns a callbackRef.
- useOutsideClick - React hook for tracking clicks outside a ref
- usePreviousDifferent - usePreviousDifferent hooks returns the last different value of a variable
- usePreviousImmediate - usePreviousImmediate returns the previous value of a variable even if it was the same or different
- usePrevious - Access the previous value of a variable with this React hook
- useQueueState - A React hook that manages state in the form of a queue
- useRaf - A continuously running requestAnimationFrame hook for React
- useSelect - A React Hooks package for select
- useSelectableList - Easily select a single value from a list of values. very useful for radio buttons, select inputs etc.
- useSessionstorageState - useState but syncs with sessionstorage
- useSessionstorage - Session storage react hook. Easily manage session storage values
- useStackState - A React hook that manages state in the form of a stack
- useThrottle - A throttle hook for react
- useTimeAgo - A React Hook to get time ago for timestamp millisecond value
- useTimeoutWhen - Takes a callback and fires it when a condition is true
- useTimeout - A React Hooks package for timeout
- useToggle - A React Hooks package for toggle
- useUndoState - Drop in replacement for useState hook but with undo functionality.
- useUpdateEffect - An useEffect that does not run on first render
- useVisibilitySensor - A React Hooks package for visibility-sensor
- useWillUnmount - A React hook for componentWillUnmount lifecycle method
- useWindowEventListener - Adds an event listener to window
- useWindowScrollPosition - A React hook to get the scroll position of the window
- useWindowSize - A React Hooks package for window-size
- useWorker - A React Hooks package for worker
Aboutβ
Standalone build for all rooks. This package contains all the hooks built as part of the rooks project.
Note: If you only need a few hooks from the rooks package, it's prefereable to install individiual hooks from npm instead of the standalone rooks build. In other words, install @rooks/useDidMount
instead of rooks
if you only need the useDidMount
functionality.
Installationβ
npm i - s rooks
Import any hook from "rooks" and start using them!
import { useDidMount } from 'rooks';
Usageβ
function App() {
useDidMount(() => {
alert('mounted');
});
return (
<div className="App">
<h1>Hello CodeSandbox</h1>
<h2>Start editing to see some magic happen!</h2>
</div>
);
}
Licenseβ
MIT
Join Bhargav's discord serverβ
You can click on the floating discord icon at the bottom right of the screen and talk to us in our server.