betteruse

Elegant React hooks for real-world problems.
SSR-safe, fully typed, and under 5kb gzipped.

npm install betteruse

App.tsx

import { useHold, echo } from 'betteruse'

function DeleteButton() {
  const { handlers, progress, isHolding } = useHold({
    duration: 500,
    onComplete: () => {
      deleteItem()
      echo('Item deleted')
    },
  })

  return (
    <button {...handlers}>
      {isHolding
        ? `Deleting... ${Math.round(progress * 100)}%`
        : 'Hold to Delete'}
    </button>
  )
}

Hooks for Every Need

A curated collection of hooks that solve common UI challenges.

echo

Screen reader announcements with a simple function-based API.

useHold

Long press detection with smooth progress animation.

useExitIntent

Detect when users are about to leave your page.

useIdle

Track user activity and detect idle states.

useSelection

Track text selection with positioning for tooltips.

useMeasure

Measure element dimensions with ResizeObserver.