# General Translation Integrations: Replayer API
URL: https://generaltranslation.com/en-GB/docs/integrations/rrweb/reference/replayer.mdx
Docs index: https://generaltranslation.com/llms.txt
Description: Play an rrweb bundle with localised text overlays and playback controls. API reference for the gt-rrweb replayer.

Import replayer values from `gt-rrweb/replay`. This entry point exports the React wrapper and requires React, React DOM 18 or later, and `@rrweb/types`, even when you use only `createGTReplayer`; the DOM player also requires the optional `@rrweb/replay` peer dependency.

## Overview [#overview]

| API                                       | Description                                  |
| ----------------------------------------- | -------------------------------------------- |
| [`createGTReplayer`](#create-gt-replayer) | Mounts a player in a DOM element.            |
| [`GTReplayer`](#gt-replayer)              | React wrapper for `createGTReplayer`.        |
| [`GTReplayerProps`](#replayer-props)      | Props accepted by `GTReplayer`.              |
| [`GTReplayerBundle`](#replayer-bundle)    | Event stream and optional locale data.       |
| [`GTReplayerOptions`](#replayer-options)  | Initial locale, switching and debug options. |
| [`GTReplayerHandle`](#replayer-handle)    | Destroys a mounted player.                   |

## `createGTReplayer` [#create-gt-replayer]

```ts
function createGTReplayer(
  container: HTMLElement,
  bundle: GTReplayerBundle,
  options?: GTReplayerOptions
): GTReplayerHandle;
```

The function mounts a self-contained player and starts playback. It includes a letterboxed stage, click-based cursor, scrubber, light and dark theme controls, full-screen control, and a locale switcher when supported by the bundle.

The container should be sized by its parent. Call `destroy()` before removing or reusing the container.

A bundle with fewer than two events displays an in-player error and returns a handle whose `destroy()` method safely does nothing.

## `GTReplayer` [#gt-replayer]

`GTReplayer` mounts `createGTReplayer` into a React-managed container and destroys it on unmount. It recreates the player when `bundle`, `initialLocale`, `switchLocalesAllowed`, or `debug` changes.

## `GTReplayerProps` [#replayer-props]

| Prop                   | Description                                       | Type               | Optional | Default             |
| ---------------------- | ------------------------------------------------- | ------------------ | -------- | ------------------- |
| `bundle`               | Recording to play.                                | `GTReplayerBundle` | No       | —                   |
| `initialLocale`        | Locale rendered at mount.                         | `string`           | Yes      | `bundle.locales[0]` |
| `switchLocalesAllowed` | Shows locale controls and permits live switching. | `boolean`          | Yes      | `true`              |
| `debug`                | Accepts dropped recording JSON files.             | `boolean`          | Yes      | `false`             |
| `className`            | Class applied to the host container.              | `string`           | Yes      | —                   |
| `style`                | Inline style applied to the host container.       | `CSSProperties`    | Yes      | —                   |

## `GTReplayerBundle` [#replayer-bundle]

| Field     | Description                                      | Type                | Optional | Default |
| --------- | ------------------------------------------------ | ------------------- | -------- | ------- |
| `events`  | rrweb event stream.                              | `eventWithTime[]`   | No       | —       |
| `locales` | Available locales, with the source locale first. | `readonly string[]` | Yes      | —       |
| `overlay` | Maps locales to rrweb node-ID text.              | `LocaleTextOverlay` | Yes      | —       |

A raw events-only bundle replays in the recorded source locale. Events emitted by `gt-rrweb` can also include locale and overlay metadata in the stream.

## `GTReplayerOptions` [#replayer-options]

| Option                 | Description                                                    | Type      | Optional | Default       |
| ---------------------- | -------------------------------------------------------------- | --------- | -------- | ------------- |
| `initialLocale`        | Locale rendered on mount; ignored if absent from the bundle.   | `string`  | Yes      | Source locale |
| `switchLocalesAllowed` | Enables the in-player locale switcher.                         | `boolean` | Yes      | `true`        |
| `debug`                | Enables drag-and-drop bundle replacement for local inspection. | `boolean` | Yes      | `false`       |

Changing locale replaces text in place without rebuilding playback. Invalid dropped files trigger an in-player notice.

## `GTReplayerHandle` [#replayer-handle]

`GTReplayerHandle` exposes one method, `destroy(): void`, which removes the player and its listeners from the container.

## Sitemap

See the full [sitemap](https://generaltranslation.com/sitemap.md) for all pages.