feat: Auto-detect expo-haptics when available

Add an optional expo-haptics adapter that reads the native module from the
Expo runtime registry (globalThis.expo.modules.ExpoHaptics) instead of
importing the package. This way it is picked up automatically in any Expo
app (including Expo Go) without breaking Metro bundling for bare React
Native apps that don't have it installed.

Haptics now prefer expo-haptics and fall back to react-native-haptic-feedback
for bare React Native setups.

Author: MatiPl01

packages/react-native-sortables/src/integrations/haptics/adapters/expo-haptics.ts

@@ -0,0 +1,49 @@
+/**
+ * Optional expo-haptics adapter.
+ *
+ * We never import `expo-haptics` directly, because a static import would break
+ * Metro bundling for bare React Native apps that don't have it installed.
+ * Instead we read its native module from the Expo runtime registry, so it's
+ * picked up automatically in any Expo app (including Expo Go) and ignored
+ * everywhere else.
+ */
+
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/* eslint-disable @typescript-eslint/no-unsafe-call */
+/* eslint-disable @typescript-eslint/no-unsafe-member-access */
+/* eslint-disable @typescript-eslint/no-unsafe-assignment */
+
+import { runOnJS } from 'react-native-reanimated';
+
+const load = () => {
+  const expoHaptics = (globalThis as any).expo?.modules?.ExpoHaptics;
+
+  if (!expoHaptics?.impactAsync) {
+    return null;
+  }
+
+  const impact = (style: string) => {
+    try {
+      // expo-haptics' native method is async; fire-and-forget and swallow
+      // rejections (e.g. when haptics are unsupported on the device)
+      const result = expoHaptics.impactAsync(style);
+      result?.catch?.(() => {
+        // ignore rejection
+      });
+    } catch {
+      // ignore
+    }
+  };
+
+  const trigger = (type = 'impactLight') => {
+    'worklet';
+    // expo-haptics runs on the JS thread, so hop over from the UI worklet
+    runOnJS(impact)(type === 'impactMedium' ? 'medium' : 'light');
+  };
+
+  return trigger;
+};
+
+const ExpoHaptics = { load };
+
+export default ExpoHaptics;

packages/react-native-sortables/src/integrations/haptics/adapters/index.native.ts

@@ -1 +1,8 @@
-export { default as ReactNativeHapticFeedback } from './react-native-haptic-feedback';
+import ExpoHaptics from './expo-haptics';
+import ReactNativeHapticFeedback from './react-native-haptic-feedback';
+
+export const Haptics = {
+  // Prefer expo-haptics (available in any Expo app, including Expo Go) and
+  // fall back to react-native-haptic-feedback for bare React Native apps.
+  load: () => ExpoHaptics.load() ?? ReactNativeHapticFeedback.load()
+};

packages/react-native-sortables/src/integrations/haptics/adapters/index.ts

@@ -1,7 +1,5 @@
-import type { HapticOptions } from 'react-native-haptic-feedback';
-
-export const ReactNativeHapticFeedback = {
-  load: () => (_type: string, _options?: HapticOptions) => {
-    // noop
+export const Haptics = {
+  load: () => (_type?: string) => {
+    // noop on web
   }
 };

packages/react-native-sortables/src/integrations/haptics/hooks/useHaptics.ts

@@ -2,22 +2,21 @@ import { useCallback, useMemo } from 'react';
 import { useDerivedValue } from 'react-native-reanimated';
 
 import { IS_WEB } from '../../../constants';
-import { ReactNativeHapticFeedback } from '../adapters';
+import { Haptics } from '../adapters';
 
 type HapticImpact = {
   light(): void;
   medium(): void;
 };
 
-let hapticFeedback: null | ReturnType<typeof ReactNativeHapticFeedback.load> =
-  null;
+let hapticFeedback: null | ReturnType<typeof Haptics.load> = null;
 
 export default function useHaptics(enabled: boolean): HapticImpact {
   const isEnabled = !IS_WEB && enabled;
   const enabledValue = useDerivedValue(() => isEnabled);
 
   if (isEnabled && !hapticFeedback) {
-    hapticFeedback = ReactNativeHapticFeedback.load();
+    hapticFeedback = Haptics.load();
   }
 
   const light = useCallback(() => {