@arshazar/react-custom-hooks

React Custom Hooks

Custom hooks for React to make life easy!

Installation

You can easily install React Custom Hooks by yarn, npm or pnpm.

yarn

yarn add @arshazar/react-custom-hooks

npm

npm i @arshazar/react-custom-hooks

pnpm

pnpm add @arshazar/react-custom-hooks

Table of Hooks

• useUpdate
• useDebounce
• useTimeout
• useThrottle
• useMobile
• useInterval
• useCursorPosition

useUpdate

usage: useUpdate(callback, [dependencies])

import { useUpdate } from "@arshazar/react-custom-hooks";

useUpdate(() => {
  setSource(images);
}, [images]);

useDebounce

usage: useDebounce(value, delay, callback)

import { useDebounce } from "@arshazar/react-custom-hooks";

const debounceValue = useDebounce(value, 1, handleChangeColor);

useTimeout

usage: useTimeout(callback, delay)

import { useTimeout } from "@arshazar/react-custom-hooks";

useTimeout(handleFadeAnimation, 200);

useThrottle

usage: useThrottle(callback, period, delay)

import { useThrottle } from "@arshazar/react-custom-hooks";

useThrottle(handleChangeCover, 5000, 10);

useMobile

usage: useMobile(smallDevicesOnly = false)

import { useMobile } from "@arshazar/react-custom-hooks";

const isMobile = useMobile();

useInterval

usage: useInterval(callback, delay)

import { useInterval } from "@arshazar/react-custom-hooks";

useInterval(handleScrollAnimation, 150);

useCursorPosition

usage: useCursorPosition()

import { useCursorPosition } from "@arshazar/react-custom-hooks";

const cursorPosition = useCursorPosition();