react-native-video-toolkit

My first ever real OSS project 😭. Be kind, I’m still figuring this out.
A flexible and customizable video player UI toolkit for React Native.

👉 Full Documentation: https://react-native-video-toolkit-docs.vercel.app/

src="https://img.shields.io/github/actions/workflow/status/2004durgesh/react-native-video-toolkit/ci.yml?label=ci"
alt="CI Workflow Status"
/>

src="https://img.shields.io/discord/1387063063223599265?color=7289da&label=discord&logo=discord&logoColor=7289d"
alt="discord"
/>

---

📑 Table of Contents

- 📱 Demo
- ✨ Features
- ✅ Platform Compatibility
- 🗺️ Roadmap
- 📦 Installation
- 🚀 Usage
- 🐛 Issues
- 🤝 Contributing
- 📜 License

---

📱 Demo

> [!TIP]
> The demo app is available in the example folder.
> Clone the repo and run yarn example start inside the example directory to see the latest changes.
> You can also download the demo app from the release builds.

| Mode | Preview |
| ----------------------------- | ----------------------------------------------------- |
| Portrait | |
| Landscape | |
| Landscape (with settings) | |

---

✨ Features

- Fully Customizable UI – Build your own video player experience with modular components.
- Theming Support – Light, dark, or your own custom theme.
- Pre-built Layouts – Includes DefaultLayout to get started quickly.
- Gesture Handling – Tap, double-tap, and other common playback gestures.
- Rich Component Library – Controls like PlayButton, ProgressBar, TimeDisplay, FullscreenButton, MuteButton, and more.
- Hooks-based API – Access player state and control playback, settings, and gestures.

---

✅ Platform Compatibility

| Platform | Tested |
| ---------- | :----: |
| Android | ✅ |
| iOS | ❌ |
| Android TV | ✅ |
| Apple TV | ❌ |
| Web | ✅ |

---

🗺️ Roadmap

- [x] Core Player component
- [x] Customizable controls
- [x] Theming support
- [x] Gesture handling
- [x] Settings menu
- [x] Layout presets (DefaultLayout)
- [x] Fullscreen support
- [x] Landscape mode support
- [ ] TV support (D-pad navigation)
- [ ] Picture-in-Picture (PiP) mode
- [ ] More advanced layouts (YouTube/Netflix-style)

---

📦 Installation

``bash
npm install react-native-video-toolkit


or

`tsx
import { VideoPlayer, DefaultLayout } from 'react-native-video-toolkit';

const App = () => {
return (



);
};
``

For more docs:
👉 Documentation website.

---

🐛 Issues

Yes, there are bugs. Probably lots.
👉 Open an issue.
It makes the project look active, so actually… thanks in advance.

---

🤝 Contributing

Wanna help? Please? 🙏
Check the contributing guide. I’ll try to review your PR before I spiral into existential dread.

---

📜 License

MIT – because lawyers are scary.

---

Made with create-react-native-library
Thanks to wuxnz for motivation (and maybe trauma)
Thanks to zach for the docs template

Made with ❤️, caffeine, and way too many Chrome tabs by Durgesh