useHaptics

Trigger platform-native vibration patterns with throttling and graceful fallbacks when haptics are unavailable.

Feedback buttons

Map press, selection, and notification events to haptic helpers with built-in throttling.

Loading demo…

import
 
{
 
Block
,
 
Button
,
 
Row
,
 
Text
,
 useHaptics 
}
 
from
 
'@platform-blocks/react-ui-library'
;
 
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"
 
weight
=
"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-ui-library

100+ accessible, themeable components that work seamlessly across iOS, Android, and Web.

A Platform Blocks product.

Quick Links

Components Charts Hooks

Docs

Getting Started Localization llms.txt

Resources

FAQ Changelog Accessibility Sitemap