# FlyCut Caption: a subtitle editor that ships as both an app and a React package

> Speech recognition, bilingual subtitle tracks and hard-burn export in one codebase, published to npm under a scoped name and wrapped in a Tauri desktop shell.

**x007xyz/flycut-caption** — A complete video subtitle editing React component with AI-powered speech recognition and visual editing capabilities.

- Repository: https://github.com/x007xyz/flycut-caption
- Website: https://caption.flycut.co
- Stars: 1,775 · Forks: 232
- Language: TypeScript
- License: NOASSERTION
- Published: 2026-10-07 · Updated: 2026-10-07 · Language: en
- Canonical page: https://hysenlabs.com/projects/x007xyz-flycut-caption

## Two ASR engines and one editor

Most caption tools make you pick one transcription path and live with it. FlyCut Caption ships two and switches between them by target platform. The browser build runs Whisper through Transformers.js, which means transcription happens in the page with no server call. The desktop build can use FunASR through a Tauri sidecar, which the README describes as higher quality on longer clips.

Whichever engine runs, the output has the same shape: timestamped subtitle segments carrying word-level timestamps. That word-level detail is what makes the visual editing modes possible. The editor can mark and remove at segment level or drill down to word level, and the timeline draws kept regions in green and removed regions in red so you can see the cut before committing to it.

The stack behind that is listed plainly under the README's technical features: React 19, TypeScript, Vite, Tailwind CSS 4 and Tauri. Long jobs are kept off the UI thread with web workers in the browser and sidecars on the desktop, which matters when recognition on a twenty minute clip would otherwise freeze the timeline you are trying to edit.

## Getting it running is four commands

The quick start asks for Node.js 18 or newer and prefers pnpm over npm. After that it is a clone, an install and a dev server:

```bash
git clone https://github.com/x007xyz/flycut-caption.git
cd flycut-caption
```

```bash
pnpm install
```

```bash
pnpm dev
```

Vite serves the result on port 5173, which is the address the README tells you to open. Production output comes from `pnpm build`, which the package manifest expands into `tsc -b && vite build`, and `pnpm preview` serves that build. Because the type check runs before the bundler, a type error fails the build rather than reaching the browser.

There is a sample video button in the upload panel, so you can exercise the full transcription, editing and export path without supplying your own footage. Supported inputs are MP4, WebM, AVI and MOV for video and MP3, WAV and OGG for audio, accepted by drag and drop or through a file picker.

## The npm package is the real product here

This is what separates FlyCut Caption from a desktop utility. The manifest publishes `@flycut/caption-react` at version 2.0.2, and the package is not marked private. The shipped file list is narrow on purpose: a JavaScript bundle, a type declaration file, a stylesheet, a source map and the two READMEs.

Consuming it means importing a component and passing a language:

```tsx
import { FlyCutCaption, zhCN, enUS } from '@flycut/caption-react'
```

```tsx
<FlyCutCaption
  config={{ language: 'zh' }}
/>
```

The export map carries two entries. The root entry resolves types, import and default to the same bundle, and a separate `./styles` entry points at the packaged stylesheet, which lets a host application control when and how the component CSS loads. Keywords in the manifest name the domain directly: react, video, subtitle, caption, editor, ai, asr, whisper, flycut, video-editing, speech-recognition.

Internationalization is part of the public API rather than a build flag. Built-in packs ship for Chinese and English, and the README shows a custom Japanese pack assembled from nested objects covering common labels, component labels and messages, passed through a `locale` prop. A separate document in the tree, INTERNATIONALIZATION.md, covers this in more depth, and a `useState` example demonstrates swapping packs at runtime when an external control changes the selected language.

## Desktop builds fetch ffmpeg and fonts as separate steps

The desktop path is not a single command, and the manifest is honest about why. The `tauri` script chains four things in order: building the FunASR sidecar in Rust, fetching ffmpeg, fetching shared assets, and only then invoking tauri.

```bash
cargo build --release --manifest-path src-tauri/sidecars/funasr-asr/Cargo.toml
```

That build produces a release binary, and the script goes on to create `src-tauri/binaries` and install the result into it, so the sidecar ends up staged where Tauri expects to find it at runtime. The three fetch scripts are separate files under `scripts/`, named for shared assets, subtitle fonts and ffmpeg. Keeping large binaries out of git is the right instinct, but it does mean a first desktop build is a multi-step process rather than one command and hope.

Hard-burn export is the feature that most justifies the desktop shell, because encoding does not happen in a browser tab at usable speed. The README notes hardware-accelerated encode on desktop when available, and treats keeping only the non-deleted segments as an option distinct from burning the subtitles in. Export outputs are SRT and JSON subtitle files, or video.

## Working files in the tree suggest an active codebase

Beyond the application source, the root of the tree holds a set of files that say how the project is run day to day. There is an AGENTS.md, an INTERNATIONALIZATION.md and a MESSAGE_CENTER_USAGE.md, three separate documents that are not part of any published package. TODO.md and debug-subtitle-overlap.md sit next to them, the kind of working notes that usually mean someone is actively chasing a layout bug rather than tidying up.

There are also directories you would not expect in a published library: `.omo/` and `.trae/`, which look like editor and agent tool directories, plus `designs/`, `docs/`, `tests/` and a `screenshots/` folder holding the gifs the README embeds. Two files at the root, contest-entry.html and contest-post.md, suggest the project was put forward for some showcase or hackathon, and esa.txt is likely an artifact of the same submission.

A `models.json` at the root and a `components.json` beside it suggest the ASR model list and the component configuration both live outside the source tree, so changing the available models or the component set is meant to be a configuration edit rather than a code change. The editor and build configuration follows the same pattern with eslint.config.js, vite.config.ts and three separate tsconfig files.

## License metadata disagrees with the package manifest

GitHub reports the license for this repository as NOASSERTION, meaning it could not map the repository to a standard license from its metadata. The package manifest declares MIT and carries an MIT copyright line, and a LICENSE file sits at the root of the tree. Those three signals agree, so the NOASSERTION result reads as a metadata detection failure rather than a different grant.

The caveat is scope. MIT terms cover the code. They do not cover the models. Whisper and FunASR carry their own licenses and the recognition weights are fetched at runtime rather than vendored, so anyone shipping this inside a commercial product should check the terms of the specific model they configure rather than assume the repository license covers the whole stack.

On maintenance signals, the repository is not archived, reports zero open issues, and was last pushed on 2026-07-10. Two releases exist, v2.0.1 and v2.0.2, both published on that date three hours apart, with release bodies that are nothing but full changelog comparison links. Two releases on one day reads more like a packaging fix after an initial publish than a considered release cadence, so it is worth watching rather than assuming a rhythm.

## Conclusion

FlyCut Caption is unusual in publishing the editor as an npm package rather than only as an application, which makes it embeddable in a larger video workflow instead of being a destination you visit. The transcription, the blank-cut pass and the bilingual track are the parts with real substance, and the browser path through Transformers.js means it works without a Python sidecar. Where it is thinner are the rough edges: the license field on GitHub disagrees with the package manifest, the ffmpeg binary and subtitle fonts are fetched by separate scripts, and the two published releases landed within three hours of each other on the same day. Start with the sample video button and the dev server if you are evaluating it, and read the package exports before assuming the application and the library are the same surface.

## FAQ

### Does FlyCut Caption work in the browser or does it need a desktop app?

Both. The browser build runs Whisper through Transformers.js so transcription happens in the page, and the Tauri desktop build can use a FunASR sidecar that the README describes as more accurate on longer clips. Desktop builds additionally get hardware-accelerated encoding for hard-burn export.

### Can I embed the subtitle editor in my own React application?

That is what the published package is for. It ships as `@flycut/caption-react` with a root export for the component and a separate `./styles` entry pointing at the packaged stylesheet. You pass a language through the `config` prop and can supply your own locale pack.

### What does the smart cut blank feature actually do?

It detects long silences in the recognized audio and marks those regions for removal. The timeline then shows kept regions in green and removed ones in red, and preview mode plays only the kept segments so you can judge the result before exporting.

### What license applies to FlyCut Caption?

The package manifest declares MIT and a LICENSE file sits at the repository root, while GitHub's own license field reports NOASSERTION, which usually means automatic detection failed. The code terms look permissive. The speech recognition models are fetched separately and carry their own licenses, so check those before commercial use.

## Sources

- [Issues](https://github.com/x007xyz/flycut-caption/issues)
- [Project website](https://caption.flycut.co)
- [README](https://github.com/x007xyz/flycut-caption/blob/main/README.md)
- [Releases](https://github.com/x007xyz/flycut-caption/releases)
- [x007xyz/flycut-caption on GitHub](https://github.com/x007xyz/flycut-caption)

---

Hysen Labs editorial analysis, written from the project's own repository and release notes. Cite the canonical page: https://hysenlabs.com/projects/x007xyz-flycut-caption