Skip to main content

Haptics

Haptics

Trigger tactile feedback and vibrations

Tags: vibration feedback tactile touch

View Demo

The useHaptics composable provides haptic feedback capabilities for tactile responses. It supports different impact styles (light, medium, heavy), notification types (success, warning, error), and selection feedback for UI interactions.

Import​

<script>
  import { useHaptics } from '@classic-homes/native/svelte';
</script>
// React
import { useHaptics } from '@classic-homes/native/react';

Basic Usage​

<script lang="ts">
  import { useHaptics } from '@classic-homes/native/svelte';

  const haptics = useHaptics();
</script>

<button onclick={() => haptics.impact('medium')}>Medium Impact</button>
<button onclick={() => haptics.notification('success')}>Success</button>
<button onclick={() => haptics.vibrate(500)}>Vibrate 500ms</button>

API Reference​

Property Type Description
isAvailable boolean | null Whether haptics are available
error Error | null Current error if any
impact (style?: 'light' | 'medium' | 'heavy') => Promise<void> Trigger impact feedback
notification (type?: 'success' | 'warning' | 'error') => Promise<void> Trigger notification feedback
selectionStart () => Promise<void> Start selection feedback
selectionChanged () => Promise<void> Continue selection feedback
selectionEnd () => Promise<void> End selection feedback
vibrate (duration?: number) => Promise<void> Trigger vibration for specified duration

Accessibility​

  • Works with screen readers and assistive technologies
  • Provides loading and error states for accessible status updates
  • Keyboard accessible controls
  • Device - Get device information, battery status, and language
On this page