useHaptics

Preview

Installation

pnpm dlx shadcn@latest add https://pwaui.com/r/use-haptics.json

Usage

"use client"
import { useHaptics } from "@/hooks/use-haptics"
export function SaveButton() {  const haptics = useHaptics()
  function save() {    haptics.tap()    // Save from this same user gesture.  }
  return <button onClick={save}>Save</button>}

Returns

supported

Whether navigator.vibrate is available. A true value means the API exists, not that the user necessarily felt feedback.

vibrate(pattern)

Requests a custom duration or vibration/pause sequence and returns whether the browser accepted it.

tap()

A single 10ms acknowledgement.

success()

A 10–40–20ms success sequence.

warning()

A 30–40–30ms warning sequence.

error()

A 40–60–40ms error sequence.

Behavior notes

• Call a preset from a click, press, or other user activation. Browsers may reject vibration requested from background or automatic work.
• Use feedback sparingly: tap can acknowledge a deliberate TabBar selection; warning or error can reinforce a consequential ActionSheet choice. Do not wire every control by default.
• The methods return false when unsupported, blocked, or rejected and never substitute audio or another workaround.
• No preset is wired into existing components; consumers decide which actions deserve tactile feedback.

Platform support