npm i react-recipes --save

yarn add react-recipes

🥘 Recipes Documentation

| Name | Returns | Arguments | | ----------------------------------------------------------- | ------------------------------------------------------------- | --------------------------------------------------------------------------------------- | | 🍡 useAdjustColor | color | (percentage, color1, color2: null, linearBlend: false) | | 🥟 useArray | { value, setValue, removeById, removeIndex, clear } | (initialValue) | | 🔄 useAsync | { error, execute, pending, value } | (asyncFunction, immediate: true) | | 🍪 useCookie | [cookieValue, updateCookie, deleteCookie] | (cookieName, initialValue) | | 🥠 useCopyClipboard | [isCopied, setIsCopied] | (duration: 2000) | | 🍩 useDarkMode | [enabled, setEnabledState] | - | | 🍜 useDebounce | debouncedValue | (value, delay) | | 🥡 useDimensions | [ref, dimensions, node] | (liveMeasure: true, delay: 250, initialDimensions: {}, effectDependencies: []) | | 🍳 useEventListener | - | (eventName, handle, element: window) | | 🌮 useFullScreen | { fullScreen, open, close, toggle } | (element: document.documentElement) | | 🌯 useGeolocation | { latitude, longitude, timestamp, accuracy, error } | (watch: false, settings: {enableHighAccuracy: false, timeout: Infinity, maximumAge: 0}) | | 🌭 useHover | [callbackRef, value] | - | | 🍦 useInterval | - | (callback, delay, runOnLoad: false, effectDependencies: []) | | 🍐 useIsClient | isClient | - | | 🥧 useKeyPress | keyPressed | (targetKey) | | 🍱 useLocalStorage | [storedValue, setValue] | (key, initialValue) | | 📍 useLocation | { push, replace, pathname, search } | - | | 🍋 useLockBodyScroll | - | - | | 🍉 useMedia | value | (queries, values, defaultValue) | | 🥭 useMultiKeyPress | keysPressed | (targetKey) | | 🔔 useNotification | fireNotify | (title, options) | | 🥑 useOnClickOutside | - | (ref, callback) | | 🥒 useOnlineStatus | onlineStatus | - | | 🍿 usePrevious | previous | (value) | | 🖨 usePrint | { ref, handlePrint } | (style = {}) | | :question: useQueryParams | { getParams, setParams } | - | | 🍣 useScript | [loaded, error] | (src) | | 🍖 useSpeechRecognition | { supported, listen, listening, stop } | ({ onEnd, onResult, onError }) | | 🍗 useSpeechSynthesis | { supported, speak, speaking, cancel, voices, pause, resume } | ({ onEnd, onResult, onError, onBoundary, onPause, onResume }) | | 🍏 useThrottle | throttledValue | (value, ms: 250) | | 🍷 useWhyDidYouUpdate | - | (name, props) | | 🥖 useWindowScroll | { x, y } | - | | 🥮 useWindowSize | { height, width } | (initialWidth, initialHeight) | | 🥝 useWorker | worker instance | (scriptPath, workerOptions, attributes) |