react-native-interactable: a physics-driven Interactable.View for React Native

The gesture problem react-native-interactable was written to solve

React Native's bridge is asynchronous, and the README states plainly that this incurs an inherent performance penalty which traditionally prevents JavaScript code from running at high framerates. Animated solves part of that by declaring animations in JavaScript and executing them with a native driver. Gesture-driven views need more than a fixed animation: the view has to keep reacting while the finger is still down, and the motion has to feel physical. The README lists the target cases: a swipeable card springing back unless swiped with enough force, a drawer snapping between closed and open, a collapsible header, and chat heads that snap to screen corners. This is a library for engineers building one of those interactions, not a general animation toolkit.

How the physics runs: Interactable.View, snapPoints and the native engine

The public surface is a single component, Interactable.View, which wraps the view you want to make draggable. Instead of an imperative animation API you declare forces and targets as props, and the library hands them to a native physics engine. The README describes the props as groups of points: snapPoints lists positions the view snaps to after a drag, springPoints connects the view's center to constant springs with tension, damping and an influenceArea, gravityPoints attract or repel the center with strength and falloff, frictionAreas add damping inside a region, and alertAreas emit an event when the center enters or leaves a region. Because the interaction is declared once and evaluated natively, the JavaScript thread is not in the per-frame path. That is the whole architectural bet, and it is why the component exists rather than a set of helper hooks.

Installing react-native-interactable and wiring a first drawer

The README requires React Native 0.40 and above, and package.json declares peer dependencies of react and react-native at >= 15.4.1 and >= 0.40.0. Install the package from npm and link the native library:

npm install react-native-interactable --save
react-native link react-native-interactable

If you prefer manual linking, the README points at node_modules/react-native-interactable/ios/Interactable.xcodeproj. CocoaPods users add the podspec path to the Podfile and run pod update:

pod 'Interactable', :path => '../node_modules/react-native-interactable'

With the native side linked, the README's usage example wraps content in Interactable.View, restricts movement to the horizontal axis, and gives two snap targets:

import Interactable from 'react-native-interactable';

<Interactable.View
  horizontalOnly={true}
  snapPoints={[{x: 0}, {x: -200}]}
  onSnap={this.onDrawerSnap}>

  // the view that you wrap here will now support interactions

</Interactable.View>

After a drag the view should settle at x: 0 or x: -200 and fire onSnap. The README also ships a playground with swipeable card, drawer, collapsible header and chat heads examples under Basic examples. From the repository root, npm start then npm run ios builds it. The README warns that the simulator has poor performance and recommends a real device.

Where react-native-interactable stops being the right tool

The README opens by calling this an experimental implementation, and the project page carries a LOOKING FOR A MAINTAINER notice: the maintainers say they do not have enough time to work on it. That is a support statement, not a bug, and it should shape the decision more than any prop list. The npm package is at 2.0.1 while the newest release note shown is v0.1.3 from 2017-09-01, a gap worth understanding before you file an issue. There is also a hard platform boundary: linking is native, so the library is not usable in Expo Go or any environment where you cannot touch the iOS and Android projects. Finally, if your animation is time-driven rather than gesture-driven, a declarative physics engine adds a native dependency for something Animated already handles.

Interactable.View against Animated and Reanimated

Animated, which the README links as the modern declarative animation library for React Native, lets you declare an animation in JavaScript and run it on a native driver. It is a general timing and interpolation system: you describe where a value goes and how long it takes. react-native-interactable instead describes the forces acting on a view (springs, gravity wells, friction regions) and lets a physics engine decide the resulting motion frame by frame. Reanimated, which appears in the related searches, takes a third route: it moves worklets onto the UI thread so you can write imperative gesture logic that executes natively. Choosing between them is mostly about what you are expressing. A drawer that snaps to two positions is a snapPoints declaration here; the same drawer with a custom easing curve is Animated; a gesture handler with bespoke per-frame logic is Reanimated territory.

Maintenance, licensing and what an upgrade would cost

The licence is MIT, which permits commercial use and modification, and the LICENSE file sits at the repository root. Nothing here is legal advice; read the licence text yourself. The upgrade picture is the part that deserves attention. The package is at version 2.0.1, the last recorded release note is v0.1.3 from 2017-09-01, and the README asks for a maintainer. The last push to the repository was on 2026-06-24, so the code has been touched recently, but there is no published release cadence to plan against. Practically, that means an upgrade is a source review rather than a changelog read: check the diff against your pinned React Native version, and re-run the playground after any React Native upgrade, because the peer dependency floor of 0.40 says nothing about newer releases. If your team needs a dependency with a release schedule, this is the wrong shape of project.

Editorial conclusion

Adopt react-native-interactable when you need drag, snap or spring behaviour on a view and can pin React Native 0.40 or newer. Skip it for pure timing animations, for anything that needs a maintained dependency, or when you cannot verify native linking on your target devices. Before committing, confirm that react-native link wires the iOS and Android projects in your app, and open the playground to compare the simulator against a real device. The README still asks for a maintainer, and the npm release line sits at 2.0.1 while the newest GitHub release note is v0.1.3 from 2017-09-01; treat the package as a working reference implementation rather than a project with a support commitment.

Frequently asked questions

Official sources

1. Issues
2. License: MIT
3. README
4. Releases
5. wix-incubator/react-native-interactable on GitHub