ahks

a[ll]h[oo]ks

All-in-one high-quality and reliable React Hooks:

• use-callback-ref
• use-composed-ref
• use-debounce
• use-deep-compare-effect
• use-is-mounted-ref
• use-isomorphic-layout-effect
• use-latest
• use-memo-one

and own unopinionated at their best implementations:

Lifecycle:

• useMount — useEffect with constant dependencies list.

• useLayoutMount — useLayoutEffect with constant dependencies list.

• useUnmount — useMount but only with destructor.

• useLayoutUnmount — useLayoutMount but only with destructor.

• useRenderEffect — almost same to useEffect, but not deferred (like useAction).

Handlers:

• useHandler — more effective alternative to useCallback with constant dependencies list.

• useStableHandler — React RFC (like useEventCallback).

• useScrollHandler — use scroll position.

Events:

• useChangeCommit — commit native change event to <input /> (usually needed for UI libraries).

• useValueCommit — useChangeCommit but with custom value.

• useCheckCommit — useChangeCommit but with custom checked state.

• usePassiveEvent — add passive event listener (feature not provided by react).

Memo:

• useCreation — useMemo with constant dependencies list.

Promise:

• usePromise — handle promise (like usePromise).

Loaders:

• useLoadImage — usePromise with image loader.

• useLoadBlob — usePromise with blob loader.

Refs:

• useFirstRenderRef — ref object which determines first render (like useIsFirstRender).

• useStableRef — store latest value in ref object.

Renders:

• useRender — cast ReactNode to ReactElement without Fragment hack.

State:

• useUpdate — forceUpdate for functional components.

• useUpdateState — useUpdate with generation.

• useTrackState — state with dependency-tracking (idea from useSWR).

Installation

We recommend to use yarn for dependency management:

yarn add ahks

Contributing

Development of ahks happens in the open on GitHub, and we are grateful to the community for contributing bugfixes and improvements.

License

ahks is MIT licensed.