@znemz/react-use
v9.7.2-2
Published
Collection of React Hooks
Downloads
1
Readme
- Sensors
useBattery— tracks device battery state.
useGeolocation— tracks geo location state of user's device.useHoveranduseHoverDirty— tracks mouse hover state of some element.useIdle— tracks whether user is being inactive.useKey,useKeyPress,useKeyboardJs, anduseKeyPressEvent— track keys.useLocation— tracks page navigation bar location state.useMedia— tracks state of a CSS media query.useMediaDevices— tracks state of connected hardware devices.useMotion— tracks state of device's motion sensor.useMouseanduseMouseHovered— tracks state of mouse position.useNetwork— tracks state of user's internet connection.useOrientation— tracks state of device's screen orientation.usePageLeave— triggers when mouse leaves page boundaries.useScroll— tracks an HTML element's scroll position.useScrolling— tracks whether HTML element is scrolling.useSize— tracks an HTML element's dimensions.useStartTyping— detects when user starts typing.useWindowScroll— tracksWindowscroll position.useWindowSize— tracksWindowdimensions.
- UI
useAudio— plays audio and exposes its controls.useClickAway— triggers callback when user clicks outside target area.useCss— dynamically adjusts CSS.useDropanduseDropArea— tracks file, link and copy-paste drops.useFullscreen— display an element or video full-screen.useSpeech— synthesizes speech from a text string.useVideo— plays video, tracks its state, and exposes playback controls.useWait— complex waiting management for UIs.
- Animations
useRaf— re-renders component on eachrequestAnimationFrame.useSpring— interpolates number over time according to spring dynamics.useTimeout— returns true after a timeout.useTween— re-renders component, while tweening a number from 0 to 1.useUpdate— returns a callback, which re-renders component when called.
- Side-effects
useAsync— resolves anasyncfunction.useAsyncFn— state management for an async functionuseAsyncRetry—useAsyncwithretry()method.useBeforeUnload— shows browser alert when user try to reload or close the page.useCopyToClipboard— copies text to clipboard.useDebounce— debounces a function.useFavicon— sets favicon of the page.useLocalStorage— manages a value inlocalStorage.useLockBodyScroll— lock scrolling of the body element.useSessionStorage— manages a value insessionStorage.useThrottleanduseThrottleFn— throttles a function.useTitle— sets title of the page.
- Lifecycles
useEffectOnce— a modifieduseEffecthook that only runs once.useEvent— subscribe to events.useLifecycles— callsmountandunmountcallbacks.useRefMounted— tracks if component is mounted.usePromise— resolves promise only while component is mounted.useLogger— logs in console as component goes through life-cycles.useMount— callsmountcallbacks.useUnmount— callsunmountcallbacks.useUpdateEffect— run aneffectonly on updates.useDeepCompareEffect— run aneffectdepending on deep comparison of its dependencies
- State
createMemo— factory of memoized hooks.createReducer— factory of reducer hooks with custom middleware.useGetSet— returns state getterget()instead of raw state.useGetSetState— as ifuseGetSetanduseSetStatehad a baby.usePrevious— returns the previous state or props.useObservable— tracks latest value of anObservable.useSetState— createssetStatemethod which works likethis.setState.useToggleanduseBoolean— tracks state of a boolean.useCounteranduseNumber— tracks state of a number.useList— tracks state of an array.useMap— tracks state of an object.