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

# Configuration du widget

> Personnalisez l'apparence et le comportement du widget

## Tous les attributs

| Attribut             | Par défaut                     | Description                                                                     |
| -------------------- | ------------------------------ | ------------------------------------------------------------------------------- |
| `data-api-key`       | *requis*                       | Votre clé API Orova                                                             |
| `data-agent-id`      | *requis*                       | ID de l'agent auquel se connecter                                               |
| `data-server-url`    | *requis*                       | URL du serveur API Orova                                                        |
| `data-mode`          | `chat`                         | Mode du widget : `chat`, `voice`, `video`, `multi`                              |
| `data-position`      | `bottom-right`                 | Position du bouton : `bottom-right` ou `bottom-left`                            |
| `data-theme`         | `light`                        | Thème de couleur : `light` ou `dark`                                            |
| `data-primary-color` | `#111111`                      | Couleur de la marque pour les boutons et les accents                            |
| `data-title`         | `Orova`                        | Texte du titre de l'en-tête                                                     |
| `data-subtitle`      | `We typically reply instantly` | Texte du sous-titre de l'en-tête                                                |
| `data-greeting`      | *(auto)*                       | Message d'accueil personnalisé. Si vide, récupère le premier message de l'agent |

## Modes expliqués

### Mode chat

Conversation textuelle uniquement. Les utilisateurs tapent des messages et reçoivent des réponses en streaming.

```html theme={null}
<script ... data-mode="chat"></script>
```

### Mode voix

Affiche un sélecteur avec les options Chat et Voix. Les utilisateurs choisissent leur méthode de communication préférée.

```html theme={null}
<script ... data-mode="voice"></script>
```

### Mode vidéo

Appel vidéo avec un avatar réaliste. Les utilisateurs voient l'avatar et peuvent éventuellement activer leur caméra.

```html theme={null}
<script ... data-mode="video"></script>
```

### Mode multi

Affiche un sélecteur avec les options Voix et Vidéo.

```html theme={null}
<script ... data-mode="multi"></script>
```

## Thèmes

### Thème clair (par défaut)

```html theme={null}
<script ...
  data-theme="light"
  data-primary-color="#312E56"
></script>
```

### Thème sombre

```html theme={null}
<script ...
  data-theme="dark"
  data-primary-color="#6C63FF"
></script>
```

Le `data-primary-color` affecte :

* L'arrière-plan du bouton d'action flottant
* Les bulles de messages utilisateur
* L'arrière-plan de l'en-tête
* Le bouton d'envoi
* Les états actifs et les accents

## Positionnement

```html theme={null}
<!-- En bas à droite (par défaut) -->
<script ... data-position="bottom-right"></script>

<!-- En bas à gauche -->
<script ... data-position="bottom-left"></script>
```

## Dimensions du panneau

Le panneau du widget mesure 400 px de large et 620 px de haut par défaut. Sur les écrans mobiles (moins de 440 px), il s'étend pour remplir la largeur de l'écran avec 80 % de la hauteur du viewport.

## Marque

Le widget affiche « Powered by Orova » en bas. Cela renvoie vers [orova.ai](https://orova.ai).
