Hookas

Hookas is a registry for most popular React hooks based on the shadcn registry system.

How to use

Find the hook you want to use and copy the link to install the hook into your project. Please note you should have setup shadcn in your project to use this.

Hooks

• useIsOnline
• useAsyncEffect
• useElementSize

useIsOnline

Check if the user is online.

Usage

const isOnline = useIsOnline();

Install

npx shadcn@latest add https://hookas.letstri.dev/r/use-is-online.json

useAsyncEffect

Run an async effect.

Usage

useAsyncEffect(async () => {
  const res = await fetch("https://api.example.com/data");
  const data = await res.json();
  console.log(data);
}, []);

Install

npx shadcn@latest add https://hookas.letstri.dev/r/use-async-effect.json

useElementSize

Measure the size of an element.

Usage

const [ref, { width, height }] = useElementSize();

<div ref={ref}>
  <p>Width: {width}</p>
  <p>Height: {height}</p>
</div>;

Install

npx shadcn@latest add https://hookas.letstri.dev/r/use-element-size.json