# gt-next: General Translation Next.js SDK: LocaleSelector
URL: https://generaltranslation.com/fr/docs/next/api/components/locale-selector.mdx
---
title: LocaleSelector
description: Référence de l’API du composant LocaleSelector
---

{/* GÉNÉRÉ AUTOMATIQUEMENT : ne modifiez pas ce fichier directement. Modifiez plutôt le modèle dans content/docs-templates/. */}


## Vue d’ensemble

Le composant `<LocaleSelector>` permet de sélectionner le paramètre régional de l’utilisateur.
Il s’agit d’un composant côté client qui affiche une liste déroulante pour sélectionner le paramètre régional.

## Référence

### Renvoie

Un composant permettant à l’utilisateur de sélectionner son paramètre régional.

### Propriétés

* **`locales`** (facultatif) : `string[]`
  * Liste facultative de paramètres régionaux (par ex. `['en', 'es-MX', 'fr']`) pour alimenter la liste déroulante. Si elle n’est pas fournie, la liste des paramètres régionaux du contexte `<GTProvider>` est utilisée.
* **`customNames`** (facultatif) : `{[locale: string]: string}`
  * Objet facultatif permettant d’associer des codes de langue à des noms d’affichage personnalisés.
  * Exemple : `{{ 'en-US': 'English (United States)', 'es': 'Español' }}`

## Exemples

### Utilisation de base

```jsx
import { LocaleSelector } from 'gt-next';

export default function MyComponent() {
  return <LocaleSelector />;
}
```


### Utilisation de `customNames`

```jsx
import { LocaleSelector } from 'gt-next';

export default function MyComponent() {
  const myCustomNames = {
    en: 'English',
    es: 'Español',
    'fr-CA': 'Français (Canada)',
  };
  return <LocaleSelector customNames={myCustomNames} />;
}
```

***


## Remarques

* Le composant `<LocaleSelector>` vous permet de sélectionner un autre paramètre régional pour votre application.
* Le composant `<LocaleSelector>` n’est pas disponible dans un composant serveur.

## Étapes suivantes

* Découvrez le hook [`useLocale`](/docs/next/api/helpers/use-locale).
* Consultez le hook [`useLocaleSelector`](/docs/next/api/helpers/use-locale-selector) pour définir un sélecteur de paramètre régional personnalisé.
* Découvrez les [chaînes de paramètres régionaux](/docs/core/locales).