{"id":4596,"url":"https://github.com/mkuczera/react-native-haptic-feedback","last_synced_at":"2025-04-10T04:49:39.238Z","repository":{"id":36966418,"uuid":"116181922","full_name":"mkuczera/react-native-haptic-feedback","owner":"mkuczera","description":"React-Native Haptic Feedback for iOS with Android similar behaviour.","archived":false,"fork":false,"pushed_at":"2024-03-12T15:41:36.000Z","size":597,"stargazers_count":827,"open_issues_count":24,"forks_count":100,"subscribers_count":10,"default_branch":"master","last_synced_at":"2024-05-21T22:16:19.418Z","etag":null,"topics":["android","haptic","haptic-feedback","ios","react-native"],"latest_commit_sha":null,"homepage":"","language":"Java","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mkuczera.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":["mkuczera"],"open_collective":"react-native-haptic-feedback"}},"created_at":"2018-01-03T21:05:31.000Z","updated_at":"2024-06-18T12:22:09.097Z","dependencies_parsed_at":"2024-05-01T18:33:37.791Z","dependency_job_id":null,"html_url":"https://github.com/mkuczera/react-native-haptic-feedback","commit_stats":{"total_commits":115,"total_committers":40,"mean_commits":2.875,"dds":0.7217391304347827,"last_synced_commit":"81e1e6b3274fbcbeee48e241fc0b68f5f655fff6"},"previous_names":["junina-de/react-native-haptic-feedback"],"tags_count":34,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mkuczera%2Freact-native-haptic-feedback","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mkuczera%2Freact-native-haptic-feedback/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mkuczera%2Freact-native-haptic-feedback/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mkuczera%2Freact-native-haptic-feedback/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mkuczera","download_url":"https://codeload.github.com/mkuczera/react-native-haptic-feedback/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248161243,"owners_count":21057552,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["android","haptic","haptic-feedback","ios","react-native"],"created_at":"2024-01-05T20:17:17.430Z","updated_at":"2025-04-10T04:49:38.973Z","avatar_url":"https://github.com/mkuczera.png","language":"Java","funding_links":["https://github.com/sponsors/mkuczera","https://opencollective.com/react-native-haptic-feedback"],"categories":["Components"],"sub_categories":["System"],"readme":"# react-native-haptic-feedback\n\n## Contributions Welcome\n\nThanks to all the amazing contributors for their support.\n\n[![Contributors](https://contrib.rocks/image?repo=mkuczera/react-native-haptic-feedback)](https://github.com/mkuczera/react-native-haptic-feedback/graphs/contributors)\n\nMade with [contrib.rocks](https://contrib.rocks).\n\n## Getting Started\n\nInstall the `react-native-haptic-feedback` package using npm or yarn:\n\n```bash\n$ npm install react-native-haptic-feedback --save # or use $ yarn add react-native-haptic-feedback\n```\n\n## Linking\n\n:information_source: **Note:** Starting from React Native version 0.60, native modules are auto-linked. For more details, refer to the [official documentation](https://facebook.github.io/react-native/blog/2019/07/03/version-60#native-modules-are-now-autolinked).\n\n### Automatic Linking (React Native 0.60+)\n\nFor React Native 0.60 and above, manual linking is generally unnecessary. Auto-linking handles the process automatically.\n\n### Manual Linking\n\nIf you're using an older React Native version or face issues with auto-linking, follow these manual linking steps:\n\n1. Link the module:\n   ```bash\n   $ react-native link react-native-haptic-feedback\n   ```\n2. For iOS, navigate to the iOS directory and install CocoaPods dependencies:\n   ```bash\n   $ cd ios \u0026\u0026 pod install\n   ```\n   If you encounter issues with the previous step on iOS, clean up and reinstall the dependencies using these commands:\n   ```bash\n   $ rm -rf ios/Pods \u0026\u0026 rm -rf ios/build \u0026\u0026 cd ios \u0026\u0026 pod install \u0026\u0026 cd ../\n   $ rm -rf node_modules \u0026\u0026 rm yarn.lock\n   $ yarn install   # or use $ npm install\n   ```\n   \n## Manual Setup Guide - iOS\n\n1. **Open Your Project in Xcode:** Launch Xcode and navigate to your project in the project navigator.\n\n2. **Add RNReactNativeHapticFeedback Project:** Right-click on the \"Libraries\" folder in the project navigator and select \"Add Files to [your project's name]\". Locate `RNReactNativeHapticFeedback.xcodeproj` in your project's `node_modules` directory and add it.\n\n3. **Navigate to Project Settings:** In Xcode, select your project from the project navigator to access project settings.\n\n4. **Select App Target:** Under the \"Targets\" section, choose the target corresponding to your app.\n\n5. **Link Binary With Libraries:** Go to the \"Build Phases\" tab and expand the \"Link Binary With Libraries\" section.\n\n6. **Add Library:** Click the \"+\" button to add a library.\n\n7. **Add libRNReactNativeHapticFeedback.a:** From the list of libraries, select `libRNReactNativeHapticFeedback.a` and add it.\n\n8. **Run Your Project:** Press `Cmd+R` to build and run your project in the iOS simulator or on a connected device.\n\n## Manual Setup Guide - Android\n\n1. **Configure MainApplication.java:** Open `android/app/src/main/java/[...]/MainApplication.java`.\n\n   - Add the following import at the top of the file:\n     ```java\n     import com.mkuczera.RNReactNativeHapticFeedbackPackage;\n     ```\n   - Inside the `getPackages()` method, add the instance of `RNReactNativeHapticFeedbackPackage()` to the list returned by the method:\n     ```java\n     @Override\n     protected List\u003cReactPackage\u003e getPackages() {\n       return Arrays.asList(\n           // ... other packages\n           new RNReactNativeHapticFeedbackPackage()\n       );\n     }\n     ```\n\n2. **Modify settings.gradle:** Append the following lines to `android/settings.gradle`:\n      ```gradle\n      include ':react-native-haptic-feedback'\n      project(':react-native-haptic-feedback').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-haptic-feedback/android')\n      ```\n## Usage\n\nTo use the library, import it in your JavaScript file:\n\n```javascript\nimport ReactNativeHapticFeedback from \"react-native-haptic-feedback\";\n\n// Optional configuration\nconst options = {\n  enableVibrateFallback: true,\n  ignoreAndroidSystemSettings: false,\n};\n\n// Trigger haptic feedback\nReactNativeHapticFeedback.trigger(\"impactLight\", options);\n```\n\nAlternatively, you can use the named import:\n\n```javascript\nimport { trigger } from \"react-native-haptic-feedback\";\n\n// Optional configuration\nconst options = {\n  enableVibrateFallback: true,\n  ignoreAndroidSystemSettings: false,\n};\n\n// Trigger haptic feedback\ntrigger(\"impactLight\", options);\n```\n\n## Available Methods\n\n### `trigger(method, options)`\n\nUse this method to trigger haptic feedback.\n\n| Argument                              | Description                                                                                                                                          |\n| ------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------- |\n| `method`                              | Specifies the type of haptic feedback. See the list of available methods below.                                                                     |\n| `options.enableVibrateFallback`       | :iphone: iOS only. If haptic feedback is unavailable (iOS \u003c 10 OR Device \u003c iPhone6s), vibrate with default method (heavy 1s) (default: false).   |\n| `options.ignoreAndroidSystemSettings` | :android: Android only. If haptic is disabled in the Android system settings, this allows ignoring the setting and triggering haptic feedback. (default: false). |\n\n## Method Overview\n\nHere's an overview of the available methods and their compatibility:\n\n|       Method        |      Android       |        iOS         |\n| :-----------------: | :----------------: | :----------------: |\n|     impactLight     |   ✅   |   ✅   |\n|    impactMedium     |   ✅   |   ✅   |\n|     impactHeavy     |   ✅   |   ✅   |\n|        rigid        |   ✅   |   ✅   |\n|        soft         |   ✅   |   ✅   |\n| notificationSuccess |   ✅   |   ✅   |\n| notificationWarning |   ✅   |   ✅   |\n|  notificationError  |   ✅   |   ✅   |\n|      selection      |   ❌   |   ✅   |\n|      clockTick      |   ✅   |   ❌   |\n|    contextClick     |   ✅   |   ❌   |\n|    keyboardPress    |   ✅   |   ❌   |\n|   keyboardRelease   |   ✅   |   ❌   |\n|     keyboardTap     |   ✅   |   ❌   |\n|      longPress      |   ✅   |   ❌   |\n|   textHandleMove    |   ✅   |   ❌   |\n|     virtualKey      |   ✅   |   ❌   |\n|  virtualKeyRelease  |   ✅   |   ❌   |\n|     effectClick     |   ✅   |   ❌   |\n|  effectDoubleClick  |   ✅   |   ❌   |\n|  effectHeavyClick   |   ✅   |   ❌   |\n|     effectTick      |   ✅   |   ❌   |\n\n## Available Methods (Version 1.6.0 and Prior)\n\nIf you're using version 1.6.0 or earlier, you can use this method:\n\n```javascript\nimport ReactNativeHapticFeedback from \"react-native-haptic-feedback\";\n\n// Trigger haptic feedback with vibrate fallback\nReactNativeHapticFeedback.trigger(\"method\", enableVibrateFallback);\n```\n\nWhere `method` can be one of: \"selection\", \"impactLight\", \"impactMedium\", \"impactHeavy\", \"notificationSuccess\", \"notificationWarning\", or \"notificationError\". The `enableVibrateFallback` option is for iOS devices without haptic feedback support.\n\nWe recommend using the newer approach for enhanced flexibility and improved compatibility.","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmkuczera%2Freact-native-haptic-feedback","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmkuczera%2Freact-native-haptic-feedback","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmkuczera%2Freact-native-haptic-feedback/lists"}