react-native-video-cut

A React Native video trimmer with native cutting and a ready-to-use UI component.

• iOS: AVAssetExportSession (passthrough, no re-encoding)
• Android: MediaExtractor + MediaMuxer (passthrough, no re-encoding)

Features

• Frame timeline with thumbnails
• Draggable start/end handles
• Playhead with tap-to-seek and drag-to-scrub
• Configurable min/max trim duration
• Play/pause preview within selected range
• Native trim (no FFmpeg, no re-encoding)

Installation

npm install react-native-video-cut
# or
yarn add react-native-video-cut

Peer dependencies

npm install react-native-video react-native-create-thumbnail react-native-safe-area-context

iOS

cd ios && pod install

Android

Auto-linked.

Usage

UI Component

import { VideoCut } from 'react-native-video-cut';

<VideoCut
  visible={visible}
  videoUri="file:///path/to/video.mp4"
  durationMs={30000}
  maxTrimMs={60000}
  title="Trim video"
  confirmLabel="Done"
  cancelLabel="Cancel"
  onConfirm={({ uri, durationMs }) => {
    console.log('Trimmed video:', uri, durationMs);
  }}
  onClose={() => setVisible(false)}
/>

Native trim only (no UI)

import { trimVideo } from 'react-native-video-cut';

const result = await trimVideo('file:///path/to/video.mp4', 5000, 20000);
console.log(result.uri, result.durationMs); // trimmed file

Props

| Prop | Type | Default | Description | |------|------|---------|-------------| | visible | boolean | required | Show/hide the modal | | videoUri | string | required | Video file URI | | durationMs | number | required | Video duration in ms | | onConfirm | (result) => void | required | Called with { uri, durationMs } | | onClose | () => void | required | Called when cancelled | | minTrimMs | number | 1000 | Minimum trim duration | | maxTrimMs | number | 60000 | Maximum trim duration | | title | string | 'Trim video' | Modal title | | confirmLabel | string | 'Confirm' | Confirm button text | | cancelLabel | string | 'Cancel' | Cancel button text |

License

MIT