> For the complete documentation index, see [llms.txt](https://digitalsac.gitbook.io/digicalls/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://digitalsac.gitbook.io/digicalls/webphone-widget/primeiros-passos/inicializacao.md).

# Inicialização

### Bootstrap mínimo

```typescript
import { render } from "@digitalsac/digicalls-widget";

const wp = render({
  baseUrl: "https://calls.digitalsac.io",
  tokens: ["dev_token"],
});
```

Chamar `render()` mais de uma vez retorna o **mesmo** handle (não remonta).

### Opções (`WebphoneConfig`)

| Campo            | Tipo                                     | Descrição                                                              |
| ---------------- | ---------------------------------------- | ---------------------------------------------------------------------- |
| `baseUrl`        | `string`                                 | Servidor DigiCalls                                                     |
| `tokens`         | `string[]`                               | Device tokens                                                          |
| `deviceNames`    | `Record<string,string>`                  | Nomes no seletor                                                       |
| `lang`           | `"pt"` \| `"en"` \| `"es"`               | Idioma                                                                 |
| `theme`          | `"light"` \| `"dark"` \| `"system"`      | Tema                                                                   |
| `startMinimized` | `boolean`                                | Começa só com botão flutuante                                          |
| `to`             | `string`                                 | Disca ao montar                                                        |
| `filterOffer`    | `(offer) => boolean \| Promise<boolean>` | Se retornar `false`, esta aba ignora o toque (não rejeita no WhatsApp) |

Exemplo com discagem automática:

```typescript
render({
  baseUrl: "https://calls.digitalsac.io",
  tokens: ["dev_..."],
  to: "5511999998888",
  startMinimized: false,
});
```

Exemplo com filtro de ofertas (roteamento por operador/carteira):

```typescript
render({
  baseUrl: "https://calls.digitalsac.io",
  tokens: ["dev_..."],
  filterOffer: async (offer) => shouldRingForThisUser(offer),
});
```

### Reutilizar instância SDK

```typescript
import { DigiCalls } from "@digitalsac/digicalls-sdk";
import { render } from "@digitalsac/digicalls-widget";

const dc = new DigiCalls({ baseUrl, tokens: ["dev_a"] });
render({ baseUrl, theme: "dark" }, dc);
```

### Desmontagem

```typescript
wp.destroy();
// ou DigiCallsWebphone.destroy()
```

### Tokens na UI

O menu **Configurações → Números** permite adicionar tokens na sessão do navegador (efêmeros). Para persistência entre reloads, passe todos os tokens no `render()` a partir do seu backend.

### Sincronizar tema do CRM

```typescript
wp.setTheme("dark");  // quando seu app mudar de tema
```

Próximo: API pública.