{"id":51552807,"url":"https://github.com/akesson/caprr","last_synced_at":"2026-07-10T01:01:37.340Z","repository":{"id":360143236,"uuid":"1248882889","full_name":"akesson/caprr","owner":"akesson","description":null,"archived":false,"fork":false,"pushed_at":"2026-05-25T08:22:26.000Z","size":233,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-05-25T08:23:42.775Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/akesson.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2026-05-25T06:24:54.000Z","updated_at":"2026-05-25T08:22:37.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/akesson/caprr","commit_stats":null,"previous_names":["akesson/caprr"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/akesson/caprr","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/akesson%2Fcaprr","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/akesson%2Fcaprr/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/akesson%2Fcaprr/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/akesson%2Fcaprr/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/akesson","download_url":"https://codeload.github.com/akesson/caprr/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/akesson%2Fcaprr/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":35316840,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-07-09T02:00:07.329Z","response_time":57,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2026-07-10T01:01:34.265Z","updated_at":"2026-07-10T01:01:37.334Z","avatar_url":"https://github.com/akesson.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# caprr — capture + rrweb\n\nDrop-in DOM session recorder for the browser. Captures rrweb DOM events alongside a pixel video of the tab, lets the reviewer annotate moments and regions, and saves the whole bundle as a single `.webm` file with an embedded JSON sidecar (EBML `Void` element). The same file plays in any video player and yields the structured data back to any tool that knows how to extract it.\n\nThis repository is a monorepo with two publishable packages:\n\n| Package | Source | Distributed as |\n|---|---|---|\n| `caprr` | `packages/core/` | npm — `import { createRecorder } from 'caprr'` |\n| `caprr-dioxus` | `packages/dioxus/` | crates.io — `\u003cRecorder/\u003e` Dioxus component |\n\nThe Rust crate vendors the built JS at publish time, so consumers of either package get a self-contained drop-in with rrweb + plugins bundled inside.\n\n## Status\n\nv0.1.0 — extracted from a [LeaveDates frontend spike](https://gitlab.com/leavedates.com/frontend). Builds and passes empirical smoke tests; not yet published to registries.\n\n## Usage\n\n### npm / TypeScript\n\n```ts\nimport { createRecorder } from 'caprr';\nimport 'caprr/styles.css';\n\nconst rec = createRecorder({\n  enabled: import.meta.env.DEV,\n  maxRecordingMs: 5 * 60_000,\n  captureNetwork: true,\n  captureConsole: true,\n  captureErrors: true,\n  // encoder: 'webcodecs', // opt-in: hardware AV1 via Mediabunny + WebCodecs\n});\n// rec.start() / rec.stop() / rec.discard() / rec.save() / rec.destroy()\n// rec.addEventListener('statechange', (e) =\u003e console.log(e.detail.from, '→', e.detail.to));\n```\n\n### Dioxus\n\n```rust\nuse caprr_dioxus::Recorder;\n\n#[component]\nfn App() -\u003e Element {\n    rsx! {\n        Recorder { enabled: cfg!(debug_assertions) }\n        // … the rest of your app\n    }\n}\n```\n\nBoth packages mount a floating \"record\" pill in the bottom-right of the page. Recording → Stop → review overlay with annotation. Saved files are `.webm` plus a `Void`-wrapped JSON sidecar containing rrweb events, viewport metadata, and annotations (each with both a pixel anchor and a DOM-element anchor when one resolves).\n\n## Browser support\n\nValidated end-to-end on Chromium ≥ 111, Firefox ≥ 110, Safari ≥ 17 — all produce WebM output. `createRecorder()` returns a no-op handle on unsupported browsers, so you can mount unconditionally.\n\n## Repo layout\n\n```\ncaprr/\n├── packages/\n│   ├── core/          # the JS library (TypeScript + Vite)\n│   └── dioxus/        # the Rust integration crate\n├── examples/\n│   ├── plain-html/    # Vite + vanilla TS demo\n│   └── dioxus-app/    # minimal Dioxus app\n├── scripts/\n│   └── vendor-dioxus-assets.mjs   # copies core/dist → dioxus/assets\n└── rrwebui.pen        # Pencil design source — review-screen UX mockup\n```\n\n## Development\n\n```sh\npnpm install\npnpm typecheck\npnpm build                       # → packages/core/dist\npnpm vendor:dioxus               # copy into packages/dioxus/assets\ncargo check --workspace\ncargo clippy --workspace --all-targets -- -D warnings\n\n# Run an example\npnpm --filter caprr-example-plain-html dev    # → http://localhost:5173\ncd examples/dioxus-app \u0026\u0026 dx serve            # → http://localhost:8080\n```\n\n## Publishing\n\n1. Bump versions in `packages/core/package.json` and `packages/dioxus/Cargo.toml`.\n2. Update `README.md` if needed.\n3. Commit + tag: `git commit -am 'chore: release v0.1.0' \u0026\u0026 git tag v0.1.0 \u0026\u0026 git push --follow-tags`.\n4. The `Release` workflow in `.github/workflows/release.yml` publishes to npm first (with provenance) and then to crates.io.\n\nRequired GitHub secrets:\n- `NPM_TOKEN` — npm publish token with publish rights to `caprr`.\n- `CRATES_IO_TOKEN` — crates.io API token with publish rights to `caprr-dioxus`.\n\n## License\n\nMIT — see [LICENSE](./LICENSE).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fakesson%2Fcaprr","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fakesson%2Fcaprr","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fakesson%2Fcaprr/lists"}