> ## Documentation Index
> Fetch the complete documentation index at: https://docs.qirtaas.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Renderer

> Display a saved document read-only, with per-read auth.

The renderer shows a document without editing. Mount it with
`client.mountRenderer(el, options)`. Unlike the editor, the renderer's auth is
**per read** and supplied on the mount call — the client only lends its
`apiUrl`.

```ts theme={null}
qirtaas.mountRenderer("#viewer", {
  documentId: "b1f2…",
  shareToken: "…",
  theme: "light",
  onReady: () => console.log("rendered"),
});
```

## Auth modes

Supply exactly **one** auth source:

<ParamField path="shareToken" type="string">
  Public read: an existing share token that resolves the document by token.
</ParamField>

<ParamField path="getToken" type="() => Promise<string> | string">
  Own-document read: returns a short-lived embed token (the same kind the
  editor uses).
</ParamField>

<ParamField path="getSignature" type="() => Promise<{ signature: string; exp: number }>">
  Cross-user read (enrolment-gated): returns a per-document HMAC signature and
  its expiry.
</ParamField>

## RendererMountOptions

<ParamField path="documentId" type="string">
  Document to render. With `shareToken`, the token resolves the document.
</ParamField>

<ParamField path="locale" type="&#x22;en&#x22; | &#x22;ar&#x22;" />

<ParamField path="theme" type="&#x22;light&#x22; | &#x22;dark&#x22;" />

<ParamField path="onReady" type="() => void" />

<ParamField path="onError" type="(code: ErrorCode, detail?: unknown) => void">
  Fired on errors with a stable [error code](/sdk/types#errorcode).
</ParamField>

## RendererInstance

<ResponseField name="setTheme(theme)" type="void">
  Switch theme live.
</ResponseField>

<ResponseField name="destroy()" type="void">
  Tear down the renderer. Call this on unmount.
</ResponseField>

## Example: public share view

```ts theme={null}
const viewer = qirtaas.mountRenderer("#viewer", {
  shareToken: new URLSearchParams(location.search).get("t")!,
  theme: "light",
});

window.addEventListener("beforeunload", () => viewer.destroy());
```