@capawesome/capacitor-haptics 0.0.1 → 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +113 -18
  2. package/package.json +9 -3
package/README.md CHANGED
@@ -23,9 +23,15 @@ Capacitor plugin to provide haptic feedback such as impacts, notifications, vibr
23
23
 
24
24
  Missing a feature? Just [open an issue](https://github.com/capawesome-team/capacitor-plugins/issues) and we'll take a look!
25
25
 
26
- ## Newsletter
26
+ ## Use Cases
27
27
 
28
- Stay up to date with the latest news and updates about the Capawesome, Capacitor, and Ionic ecosystem by subscribing to our [Capawesome Newsletter](https://cloud.capawesome.io/newsletter/).
28
+ The Haptics plugin is typically used to make an app feel more responsive and tactile, for example:
29
+
30
+ - **Button and gesture feedback**: Trigger impact feedback when user interface elements collide or a drag operation snaps into place.
31
+ - **Success and error feedback**: Use notification haptics to communicate that a task has succeeded, failed, or produced a warning.
32
+ - **Pickers and selection controls**: Give subtle selection feedback while the user scrolls through a picker.
33
+ - **Games and rich interactions**: Play custom haptic patterns with per-event intensity and sharpness for immersive experiences.
34
+ - **Alerts**: Vibrate the device with a custom duration to get the user's attention.
29
35
 
30
36
  ## Compatibility
31
37
 
@@ -69,30 +75,65 @@ No configuration required for this plugin.
69
75
 
70
76
  ## Usage
71
77
 
72
- ```typescript
73
- import {
74
- AndroidHapticType,
75
- Haptics,
76
- ImpactStyle,
77
- NotificationType,
78
- } from '@capawesome/capacitor-haptics';
78
+ The following examples show how to check if haptic feedback is available, trigger impact and notification feedback, give selection feedback, play a custom haptic pattern, perform an Android haptic effect, and vibrate the device.
79
79
 
80
- const impact = async () => {
81
- await Haptics.impact({ style: ImpactStyle.Medium });
82
- };
80
+ ### Check if haptic feedback is available
81
+
82
+ Check whether the device supports haptic feedback before using the other methods:
83
+
84
+ ```typescript
85
+ import { Haptics } from '@capawesome/capacitor-haptics';
83
86
 
84
87
  const isAvailable = async () => {
85
88
  const { available } = await Haptics.isAvailable();
86
89
  return available;
87
90
  };
91
+ ```
92
+
93
+ ### Trigger impact feedback
94
+
95
+ Simulate a physical impact, for example when user interface elements collide or a drag operation snaps into place. Five different styles are available, including the modern `Rigid` and `Soft` styles:
96
+
97
+ ```typescript
98
+ import { Haptics, ImpactStyle } from '@capawesome/capacitor-haptics';
99
+
100
+ const impact = async () => {
101
+ await Haptics.impact({ style: ImpactStyle.Medium });
102
+ };
103
+ ```
104
+
105
+ ### Trigger notification feedback
106
+
107
+ Communicate that a task or action has succeeded, failed, or produced a warning:
108
+
109
+ ```typescript
110
+ import { Haptics, NotificationType } from '@capawesome/capacitor-haptics';
88
111
 
89
112
  const notification = async () => {
90
113
  await Haptics.notification({ type: NotificationType.Success });
91
114
  };
115
+ ```
92
116
 
93
- const performAndroidHaptic = async () => {
94
- await Haptics.performAndroidHaptic({ type: AndroidHapticType.Confirm });
117
+ ### Give selection feedback
118
+
119
+ Give subtle feedback during picker-style interactions. Call `selectionStart()` when the interaction begins, `selectionChanged()` whenever the selection changes, and `selectionEnd()` when the interaction finishes:
120
+
121
+ ```typescript
122
+ import { Haptics } from '@capawesome/capacitor-haptics';
123
+
124
+ const selection = async () => {
125
+ await Haptics.selectionStart();
126
+ await Haptics.selectionChanged();
127
+ await Haptics.selectionEnd();
95
128
  };
129
+ ```
130
+
131
+ ### Play a custom haptic pattern
132
+
133
+ Play a custom pattern composed of individual haptic events with per-event intensity and sharpness. On iOS, the pattern is played using Core Haptics; on Android, it is approximated using vibration effects:
134
+
135
+ ```typescript
136
+ import { Haptics } from '@capawesome/capacitor-haptics';
96
137
 
97
138
  const playPattern = async () => {
98
139
  await Haptics.playPattern({
@@ -103,12 +144,26 @@ const playPattern = async () => {
103
144
  ],
104
145
  });
105
146
  };
147
+ ```
106
148
 
107
- const selection = async () => {
108
- await Haptics.selectionStart();
109
- await Haptics.selectionChanged();
110
- await Haptics.selectionEnd();
149
+ ### Perform an Android haptic effect
150
+
151
+ Perform a semantic Android haptic feedback effect that respects the user's haptic feedback settings. Only available on Android:
152
+
153
+ ```typescript
154
+ import { AndroidHapticType, Haptics } from '@capawesome/capacitor-haptics';
155
+
156
+ const performAndroidHaptic = async () => {
157
+ await Haptics.performAndroidHaptic({ type: AndroidHapticType.Confirm });
111
158
  };
159
+ ```
160
+
161
+ ### Vibrate the device
162
+
163
+ Vibrate the device. The `duration` option is only available on Android and Web:
164
+
165
+ ```typescript
166
+ import { Haptics } from '@capawesome/capacitor-haptics';
112
167
 
113
168
  const vibrate = async () => {
114
169
  await Haptics.vibrate({ duration: 500 });
@@ -448,6 +503,46 @@ The haptic capabilities of the platforms differ. This plugin maps every method t
448
503
 
449
504
  Custom haptic patterns are strongest on iOS, where Core Haptics supports per-event intensity and sharpness. On Android, patterns are approximated using vibration effect primitives (Android 11+ with supported hardware) or amplitude-controlled waveforms. On the web, patterns are approximated using the Vibration API, which only supports on/off timings.
450
505
 
506
+ ## FAQ
507
+
508
+ ### How is this plugin different from other similar plugins?
509
+
510
+ It covers the full range of haptic feedback through one fully typed API: impacts with five styles including the modern Rigid and Soft, notification and selection feedback, custom patterns with per-event intensity and sharpness via Core Haptics on iOS, semantic Android effects that respect the user's system settings, and an availability check — consistently across Android, iOS, and best-effort Web. It is actively maintained against the latest Capacitor and OS versions. If you only need a simple vibration, a minimal setup is fine; if you want rich, platform-aware haptics, this plugin is designed for exactly that.
511
+
512
+ ### How is this plugin different from the official Capacitor Haptics plugin?
513
+
514
+ This plugin is a drop-in replacement for the official `@capacitor/haptics` plugin with additional features: an `isAvailable()` method, semantic Android haptic effects via `performAndroidHaptic(...)`, custom haptic patterns via `playPattern(...)`, and the modern `Rigid` and `Soft` impact styles. Note that the default impact style is `ImpactStyle.Medium` instead of `ImpactStyle.Heavy`, see [Migrating from `@capacitor/haptics`](#migrating-from-capacitorhaptics).
515
+
516
+ ### Do I need to configure any permissions?
517
+
518
+ No, the plugin already declares the `android.permission.VIBRATE` permission in its own manifest, so no additional configuration is required on Android. On iOS and Web, no configuration is required either.
519
+
520
+ ### Why don't I feel any haptic feedback on my device?
521
+
522
+ First, use the `isAvailable()` method to check whether haptic feedback is available: on Android it checks whether the device has a vibrator, on iOS whether the device supports haptic event playback, and on the web whether the Vibration API is supported. Also keep in mind that on Android, the intensity of haptic events is only respected on devices with amplitude control, and that `performAndroidHaptic(...)` respects the user's haptic feedback settings.
523
+
524
+ ### Are custom haptic patterns supported on all platforms?
525
+
526
+ Custom patterns are strongest on iOS, where Core Haptics supports per-event intensity and sharpness; this requires a device with haptic event playback support (for example an iPhone with a Taptic Engine), otherwise the call rejects as unavailable. On Android, patterns are approximated using vibration effect primitives or amplitude-controlled waveforms. On the web, patterns are approximated using the Vibration API, which only supports on/off timings.
527
+
528
+ ### What is the difference between `vibrate` and `playPattern`?
529
+
530
+ The `vibrate(...)` method triggers a single vibration with a custom duration, whereby the duration is only respected on Android and Web (on iOS, a system vibration with a fixed duration is played). The `playPattern(...)` method plays a sequence of individual haptic events, each with its own time, intensity, sharpness, and duration.
531
+
532
+ ### Can I use this plugin with Ionic, React, Vue or Angular?
533
+
534
+ Yes, the plugin is framework-agnostic. It works in any Capacitor app regardless of the web framework, including Ionic with Angular, React, or Vue, as well as plain JavaScript projects.
535
+
536
+ ## Related Plugins
537
+
538
+ - [Shake](https://capawesome.io/docs/sdks/capacitor/shake/): Detect shake gestures, for example to respond with haptic feedback.
539
+ - [Silent Mode](https://capawesome.io/docs/sdks/capacitor/silent-mode/): Detect whether the device is in silent mode.
540
+ - [Volume](https://capawesome.io/docs/sdks/capacitor/volume/): Control the volume and observe hardware volume button presses.
541
+
542
+ ## Newsletter
543
+
544
+ Stay up to date with the latest news and updates about the Capawesome, Capacitor, and Ionic ecosystem by subscribing to our [Capawesome Newsletter](https://cloud.capawesome.io/newsletter/).
545
+
451
546
  ## Changelog
452
547
 
453
548
  See [CHANGELOG.md](https://github.com/capawesome-team/capacitor-plugins/blob/main/packages/haptics/CHANGELOG.md).
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@capawesome/capacitor-haptics",
3
- "version": "0.0.1",
4
- "description": "Capacitor plugin to provide haptic feedback such as impacts, notifications, vibrations and custom haptic patterns.",
3
+ "version": "0.1.0",
4
+ "description": "Capacitor plugin to provide haptic feedback such as impacts, notifications, vibrations and custom haptic patterns on Android, iOS, and Web.",
5
5
  "main": "dist/plugin.cjs.js",
6
6
  "module": "dist/esm/index.js",
7
7
  "types": "dist/esm/index.d.ts",
@@ -42,7 +42,13 @@
42
42
  "haptic feedback",
43
43
  "vibration",
44
44
  "taptic engine",
45
- "vibrate"
45
+ "vibrate",
46
+ "capacitor-plugin",
47
+ "core haptics",
48
+ "haptic pattern",
49
+ "impact feedback",
50
+ "notification feedback",
51
+ "vibration api"
46
52
  ],
47
53
  "scripts": {
48
54
  "verify": "npm run verify:ios && npm run verify:android && npm run verify:web",