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

# Référence de la bibliothèque de composants de portail

> Référence des composants pris en charge par les portails Universal : identifiants de type, serveurs de ressources, permissions et limites de configuration.

> [!WARNING]
>
> **La fonctionnalité Auth0 Universal Portals est en .**

Les portails Universal utilisent la bibliothèque [Universal Components](https://auth0.com/docs/fr-ca/get-started/universal-components/universal-components-overview.md) et y ajoutent leurs propres composants, comme [Auth0 Forms](https://auth0.com/docs/fr-ca/customize/forms.md) ainsi que des composants de contenu et de structure.

Chaque composant possède un identifiant de type. Pour ajouter un composant à une page de portail, insérez dans le tableau `components` de la page un objet contenant le `type` et, si le composant offre des options, un `config`. Pour en savoir plus, consultez [Configurer les portails Universal](https://auth0.com/docs/fr-ca/customize/portals/customize-portals.md).

## Aperçu des composants

| Composant | Groupe | Appelle |
| - | - | - |
| [Gestion de la MFA des utilisateurs](#user-mfa-management) | Universal Components | [API My Account](https://auth0.com/docs/fr-ca/manage-users/my-account-api.md) |
| [Gestion des clés d'identification](#passkey-management) | Universal Components | API My Account |
| [Modification des détails de l'Organization](#organization-details-edit) | Universal Components | [API My Organization](https://auth0.com/docs/fr-ca/manage-users/my-organization-api.md) |
| [Tableau des domaines](#domain-table) | Universal Components | API My Organization |
| [Form](#form) | Auth0 Forms | Côté serveur de Forms |

Les portails proposent également des [composants de contenu et de structure](#content-and-structure-components) : Titre, Texte enrichi, Image, Section et Séparateur.

## Universal Components

Les Universal Components appellent un serveur de ressources au nom de l'utilisateur. Pour chaque serveur de ressources, l'application du portail doit disposer d'une autorisation client et d'une politique de jeton d'actualisation, avec les permissions indiquées pour chaque composant. Pour en savoir plus, consultez [Configurer l'application](https://auth0.com/docs/fr-ca/customize/portals/configure-portal-application.md).

### Gestion de la MFA des utilisateurs

Type : `page:component:auth0:my_account:mfa_management`

| Appels | Configuration | Permissions |
| - | - | - |
| API My Account | Aucune | `read:me:factors` `read:me:authentication_methods` `create:me:authentication_methods` `delete:me:authentication_methods` |

### Gestion des clés d'identification

Type : `page:component:auth0:my_account:passkey_management`

| Appels | Configuration | Permissions |
| - | - | - |
| API My Account | Aucune | `read:me:authentication_methods` `create:me:authentication_methods` `delete:me:authentication_methods` |

### Modification des détails de l'Organization

Type : `page:component:auth0:my_organization:details_edit`

| Appels | Configuration | Permissions |
| - | - | - |
| API My Organization | Aucune | `read:my_org:details` `update:my_org:details` `read:my_org:configuration` |

### Tableau des domaines

Type : `page:component:auth0:my_organization:domain_table`

| Appels | Configuration | Permissions |
| - | - | - |
| API My Organization | Aucune | `read:my_org:domains` `create:my_org:domains` `update:my_org:domains` `delete:my_org:domains` `read:my_org:identity_providers` `create:my_org:identity_providers_domains` `delete:my_org:identity_providers_domains` |

Les composants My Organization (Modification des détails de l'Organization et Tableau des domaines) affichent ou masquent les actions selon les autorisations de l’utilisateur contenues dans le jeton d’ID. Dans un portail, un utilisateur qui n’a pas l’autorisation d’écriture ne voit pas de bouton désactivé : il reçoit plutôt un message d’erreur après avoir soumis une modification.

## Auth0 Forms

### Form

Type : `page:component:auth0:form`

| Propriété | Type | Obligatoire | Description |
| - | - | - | - |
| `form_id` | String, de 1 à 50 caractères | Oui | L’identifiant du Form à afficher. |
| `completion_message` | String, de 1 à 200 caractères | Oui | Le message qui s’affiche une fois que l’utilisateur a soumis le Form. |

### Variables de contexte des Forms

Un Form intégré à un portail obtient son [contexte](https://auth0.com/docs/fr-ca/customize/forms/variables.md#context-variables) à partir du [jeton d’ID](https://auth0.com/docs/fr-ca/secure/tokens/id-tokens.md) de l’utilisateur au chargement du portail. Le contexte de transaction complet que reçoivent les Forms lors de la connexion n’est pas disponible.

Toujours disponibles :

```text theme={null}
{{context.user.user_id}}
```

Les autres variables `{{context.user.*}}` dépendent des demandes contenues dans le jeton d’ID de l’utilisateur, lesquelles varient selon les permissions demandées à la connexion et les demandes ajoutées par vos [Actions](https://auth0.com/docs/fr-ca/customize/actions/actions-overview.md). Voici, par exemple, les demandes standards des permissions `openid`, `profile` et `email` :

```text theme={null}
{{context.user.name}}
{{context.user.given_name}}
{{context.user.family_name}}
{{context.user.nickname}}
{{context.user.email}}
{{context.user.email_verified}}
{{context.user.picture}}
```

Le portail définit les variables de contexte sur le serveur; un navigateur ne peut donc pas les modifier. Pour en savoir plus sur les variables prises en charge par les Forms, consultez [Variables](https://auth0.com/docs/fr-ca/customize/forms/variables.md).

## Composants de contenu et de structure

Les composants de contenu et de structure définissent la mise en page de vos pages de portail et assurent la cohérence de votre image de marque.

### Titre

Type : `page:component:auth0:typography:heading`

| Propriété | Type | Obligatoire | Description |
| - | - | - | - |
| `title` | String, de 1 à 50 caractères | Oui | Le texte du titre. |
| `description` | String, de 1 à 200 caractères | Non | Texte affiché sous le titre. Accepte les liens, le gras, l'italique et le soulignement. |

### Texte enrichi

Type : `page:component:auth0:typography:rich_text`

| Propriété | Type | Obligatoire | Description |
| - | - | - | - |
| `content` | String, de 1 à 10 000 caractères | Oui | Contenu HTML. Prend en charge les titres, le gras, l'italique, le soulignement, les liens, l'alignement du texte et les listes. |

### Section

Type : `page:component:auth0:structure:section`

| Propriété | Type | Obligatoire | Description |
| - | - | - | - |
| `variant` | `card` ou `none` | Oui | Le style du conteneur. |
| `children` | Tableau de 20 composants au maximum | Oui | Les composants contenus dans la section. Une section ne peut pas contenir d'autre section. |
| `title` | String, de 1 à 50 caractères | Non | Un titre affiché en haut de la section. |
| `description` | String, de 1 à 200 caractères | Non | Texte affiché sous le titre. |

### Séparateur

Type : `page:component:auth0:structure:separator`

| Propriété | Type | Obligatoire | Description |
| - | - | - | - |
| `variant` | `solid`, `dashed` ou `none` | Non | Le style de la ligne. La valeur par défaut est `solid`. |
| `text` | String, de 1 à 50 caractères | Non | Une étiquette affichée au centre de la ligne. Ignorée si `variant` est `none`. |

### Image

Type : `page:component:auth0:media:image`

| Propriété | Type | Obligatoire | Description |
| - | - | - | - |
| `src` | URL, jusqu'à 500 caractères | Oui | L'URL de l'image. |
| `position` | `left`, `center` ou `right` | Non | L'alignement horizontal. |
| `height` | Nombre entier, de 1 à 500 | Non | La hauteur, en pixels. La largeur s'ajuste automatiquement pour conserver les proportions. |

## Composants de la barre latérale

Les composants de la barre latérale définissent les liens de navigation du Portail. Ajoutez-les à `navigation.sidebar.components`, et non au tableau `components` d'une page.

| Type | Propriétés requises | Propriétés facultatives |
| - | - | - |
| `sidebar:component:auth0:internal_link:v2` | `label` (de 1 à 50 caractères), `page_slug` (de 1 à 50 caractères) | `icon` |
| `sidebar:component:auth0:external_link:v2` | `label` (de 1 à 50 caractères), `href` (URL, jusqu'à 200 caractères) | `icon` |

La propriété `icon` correspond au nom d'une [icône Lucide](https://lucide.dev/icons) en kebab-case, d'au plus 50 caractères.

## Limites

Voici les limites applicables aux portails Universal.

| Élément | Limite |
| - | - |
| `name` du portail | De 1 à 150 caractères |
| `slug` du portail et de la page | Lettres minuscules, chiffres et traits d'union; doit commencer par une lettre; jusqu'à 100 caractères |
| `title` de la page | De 1 à 150 caractères |
| Code personnalisé dans `custom_code.head` | De 1 à 10 000 caractères |

## Prochaines étapes

> [card] [Configurer les portails Universal](https://auth0.com/docs/fr-ca/customize/portals/customize-portals.md)
>
> Ajoutez ces composants aux pages et à la navigation de votre portail.