useHaptics
Trigger platform-native vibration patterns with throttling and graceful fallbacks when haptics are unavailable.
Map press, selection, and notification events to haptic helpers with built-in throttling.
Loading demo…
import { Block, Button, Row, Text, useHaptics } from '@plocks/ui';
export function Demo() {
const { impactPressIn, impactPressOut, notifySuccess, notifyWarning, notifyError, selection } = useHaptics({ throttleMs: 80 });
return (
<Block align="flex-start">
<Row gap="sm" wrap="wrap">
<Button onPressIn={impactPressIn} onPressOut={impactPressOut}>Press feedback</Button>
<Button variant="outline" onPress={selection}>Selection feedback</Button>
</Row>
<Text size="sm" fw="semibold">Notifications</Text>
<Row gap="sm" wrap="wrap">
<Button size="sm" color="success" onPress={notifySuccess}>Success</Button>
<Button size="sm" color="warning" onPress={notifyWarning}>Warning</Button>
<Button size="sm" color="error" onPress={notifyError}>Error</Button>
</Row>
</Block>
);
}React Native design for iOS, Android, and Web.
Quick Links
Resources