57 lines
1.4 KiB
TypeScript
57 lines
1.4 KiB
TypeScript
/**
|
|
* Haptic feedback utility for mobile interactions
|
|
* Provides tactile feedback for user actions
|
|
*/
|
|
|
|
type HapticStyle = "light" | "medium" | "heavy" | "success" | "warning" | "error";
|
|
|
|
/**
|
|
* Trigger haptic feedback (if supported by the device)
|
|
*/
|
|
export function haptic(style: HapticStyle = "medium") {
|
|
// Check if running in a mobile environment with haptic support
|
|
if (!("vibrate" in navigator)) {
|
|
return;
|
|
}
|
|
|
|
// Map haptic styles to vibration patterns
|
|
const patterns: Record<HapticStyle, number | number[]> = {
|
|
light: 10,
|
|
medium: 20,
|
|
heavy: 40,
|
|
success: [10, 50, 10], // Double tap pattern
|
|
warning: [20, 100, 20, 100, 20], // Triple tap pattern
|
|
error: 50,
|
|
};
|
|
|
|
try {
|
|
navigator.vibrate(patterns[style]);
|
|
} catch (error) {
|
|
// Silently fail if vibration is not supported or blocked
|
|
console.debug("Haptic feedback not available:", error);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Haptic feedback for common UI interactions
|
|
*/
|
|
export const haptics = {
|
|
/** Light tap (e.g., button press) */
|
|
tap: () => haptic("light"),
|
|
|
|
/** Selection change (e.g., toggle, checkbox) */
|
|
select: () => haptic("medium"),
|
|
|
|
/** Successful action (e.g., item added, saved) */
|
|
success: () => haptic("success"),
|
|
|
|
/** Warning or important action (e.g., delete confirmation) */
|
|
warning: () => haptic("warning"),
|
|
|
|
/** Error or failed action */
|
|
error: () => haptic("error"),
|
|
|
|
/** Heavy impact (e.g., drag and drop) */
|
|
impact: () => haptic("heavy"),
|
|
};
|