Haptics

foxui includes built-in haptic feedback using the Web Vibration API via web-haptics . On supported devices (primarily mobile), interactions like button taps will trigger a subtle vibration for tactile feedback.

Where haptics are used

Haptics are triggered on click for the following components:

• Button — all button variants trigger haptics when an onclick handler is provided
• ThemeToggle — uses Button internally, so haptics are included
• Any custom component that uses Button under the hood will also trigger haptics

Disabling haptics globally

To disable haptics across all foxui components at once, set hapticsConfig.enabled to false. This is typically done once in your root layout or app entry point:

		
<script>
	import { hapticsConfig } from '@foxui/core';

	hapticsConfig.enabled = false;
</script>

	

This takes effect immediately — any foxui component that would trigger haptics will skip the vibration.

Disabling haptics per component

You can also disable haptics on individual buttons using the haptics prop:

		
<Button onclick={handleClick} haptics={false}>No vibration</Button>

	

This overrides the global setting for that specific button.

Browser support

Haptic feedback works on both Android and iOS:

• Android — uses the Vibration API
• iOS Safari — uses a native switch control fallback to trigger the device's built-in haptic engine

On desktop browsers, haptics are silently ignored.