Bloxwap / Haptic

Give your interface
a physical response.

Wrap a React target in Haptic. Taps get feedback, and your button keeps its handlers, ref, focus, and accessibility.

Try the haptic board Read the docs
npm install @bloxwap/haptic

React 18+ · SSR-safe · ESM + CommonJS

The first npm release is in preparation. Follow the release plan.

your-button.tsxTSX
import { Haptic } from '@bloxwap/haptic';

// Add feedback. Keep your original button.
export function SaveButton() {
  return (
    <Haptic feedback="success">
      <button onClick={save}>
        Save changes
      </button>
    </Haptic>
  );
}

One component. Your original interaction.

11 presets · 1 component

Tap to feel it.

Choose a preset or try a custom pattern.

Actions: 0 · Last: none

Patterns need a vibration-capable device. Desktop audio preview lets you try the feedback without vibration hardware. Actions still work when feedback is off.

01

One target. Same action.

Your original element stays in place. Links navigate, forms submit, keyboard activation works, and refs point to the same host.

02

Feedback for the device.

Physical iOS taps use a native system tick. Vibration-capable browsers support eleven presets, intensity, and custom patterns.

03

Small package. Separate docs.

Typed React components, server-safe rendering, ESM and CommonJS. The website and its tooling stay outside your application bundle.