> ## Documentation Index
> Fetch the complete documentation index at: https://docs-dev-eval-flywheel-swift-quickstart.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Lock Internationalization

> Lock v11 prend en charge plusieurs langues et permet d’ajouter d’autres fichiers de langues personnalisés, ainsi que de définir les valeurs d’éléments de texte particuliers qui sont affichés dans le gadget logiciel Lock.

export const AuthCodeBlock = ({filename, icon, language, highlight, children}) => {
  const [displayText, setDisplayText] = useState(children);
  const [copyText, setCopyText] = useState(children);
  const wrapperRef = React.useRef(null);
  useEffect(() => {
    let unsubscribe = null;
    function init() {
      if (!window.autorun || !window.rootStore) {
        return;
      }
      unsubscribe = window.autorun(() => {
        let processedChildrenForDisplay = children;
        let processedChildrenForCopy = children;
        for (const [key, value] of window.rootStore.variableStore.values.entries()) {
          const escapedKey = key.replaceAll(/[.*+?^${}()|[\]\\]/g, (String.raw)`\$&`);
          let displayValue = value;
          if (key === "{yourClientSecret}" && value !== "{yourClientSecret}") {
            displayValue = value.substring(0, 3) + "*****MASKED*****";
          }
          processedChildrenForDisplay = processedChildrenForDisplay.replaceAll(new RegExp(escapedKey, "g"), displayValue);
          processedChildrenForCopy = processedChildrenForCopy.replaceAll(new RegExp(escapedKey, "g"), value);
        }
        setDisplayText(processedChildrenForDisplay);
        setCopyText(processedChildrenForCopy);
      });
    }
    if (window.rootStore) {
      init();
    } else {
      window.addEventListener("adu:storeReady", init);
    }
    return () => {
      window.removeEventListener("adu:storeReady", init);
      unsubscribe?.();
    };
  }, [children]);
  useEffect(() => {
    if (!wrapperRef.current) return;
    const originalWriteText = navigator.clipboard.writeText.bind(navigator.clipboard);
    let isOverriding = false;
    const handleClick = e => {
      const button = e.target.closest('[data-testid="copy-code-button"]');
      if (!button || !wrapperRef.current.contains(button)) return;
      isOverriding = true;
      navigator.clipboard.writeText = text => {
        if (isOverriding) {
          isOverriding = false;
          navigator.clipboard.writeText = originalWriteText;
          return originalWriteText(copyText);
        }
        return originalWriteText(text);
      };
      setTimeout(() => {
        if (isOverriding) {
          isOverriding = false;
          navigator.clipboard.writeText = originalWriteText;
        }
      }, 100);
    };
    const wrapper = wrapperRef.current;
    wrapper.addEventListener('click', handleClick, true);
    return () => {
      wrapper.removeEventListener('click', handleClick, true);
      if (navigator.clipboard.writeText !== originalWriteText) {
        navigator.clipboard.writeText = originalWriteText;
      }
    };
  }, [copyText]);
  return <div ref={wrapperRef}>
      <CodeBlock filename={filename} icon={icon} language={language} lines highlight={highlight}>
        {displayText}
      </CodeBlock>
    </div>;
};

Vous pouvez changer la langue de Lock en utilisant l’option de configuration de la `language`. Le fichier de langue correspondant sera extrait du directory `i18n` de Lock.

## Langues proposées

Jetez un coup d’œil au [répertoire i18n](https://github.com/auth0/lock/blob/master/src/i18n/) pour les fichiers de langue.

| Langue              | Code      | Source                                                                  |
| ------------------- | --------- | ----------------------------------------------------------------------- |
| Afrikaans           | `'af'`    | [af.js](https://github.com/auth0/lock/blob/master/src/i18n/af.js)       |
| Allemand            | `'de'`    | [de.js](https://github.com/auth0/lock/blob/master/src/i18n/de.js)       |
| Anglais             | `'en'`    | [en.js](https://github.com/auth0/lock/blob/master/src/i18n/en.js)       |
| Catalan             | `'ca'`    | [ca.js](https://github.com/auth0/lock/blob/master/src/i18n/ca.js)       |
| Chinois             | `'zh'`    | [zh.js](https://github.com/auth0/lock/blob/master/src/i18n/zh.js)       |
| Chinois (Taïwan)    | `'zh-tw'` | [zh-tw.js](https://github.com/auth0/lock/blob/master/src/i18n/zh-tw.js) |
| Coréen              | `'ko'`    | [ko.js](https://github.com/auth0/lock/blob/master/src/i18n/ko.js)       |
| Croate              | `'hr'`    | [hr.js](https://github.com/auth0/lock/blob/master/src/i18n/hr.js)       |
| Danois              | `'da'`    | [da.js](https://github.com/auth0/lock/blob/master/src/i18n/da.js)       |
| Espagnol            | `'es'`    | [es.js](https://github.com/auth0/lock/blob/master/src/i18n/es.js)       |
| Estonien            | `'et'`    | [et.js](https://github.com/auth0/lock/blob/master/src/i18n/et.js)       |
| Farsi (perse)       | `'fa'`    | [fa.js](https://github.com/auth0/lock/blob/master/src/i18n/fa.js)       |
| Finnois             | `'fi'`    | [fi.js](https://github.com/auth0/lock/blob/master/src/i18n/fi.js)       |
| Français            | `'fr'`    | [fr.js](https://github.com/auth0/lock/blob/master/src/i18n/fr.js)       |
| Grec                | `'el`     | [el.js](https://github.com/auth0/lock/blob/master/src/i18n/el.js)       |
| Hébreu              | `'he'`    | [he.js](https://github.com/auth0/lock/blob/master/src/i18n/he.js)       |
| Hongrois            | `'hu'`    | [hu.js](https://github.com/auth0/lock/blob/master/src/i18n/hu.js)       |
| Italien             | `'it'`    | [it.js](https://github.com/auth0/lock/blob/master/src/i18n/it.js)       |
| Japonais            | `'ja'`    | [ja.js](https://github.com/auth0/lock/blob/master/src/i18n/ja.js)       |
| Lituanien           | `'lt'`    | [lt.js](https://github.com/auth0/lock/blob/master/src/i18n/lt.js)       |
| Néerlandais         | `'nl'`    | [nl.js](https://github.com/auth0/lock/blob/master/src/i18n/nl.js)       |
| Norvégien           | `'no'`    | [no.js](https://github.com/auth0/lock/blob/master/src/i18n/no.js)       |
| Norvégien (Bokmål)  | `'nb'`    | [nb.js](https://github.com/auth0/lock/blob/master/src/i18n/nb.js)       |
| Norvégien (Nynorsk) | `'nn'`    | [nn.js](https://github.com/auth0/lock/blob/master/src/i18n/nn.js)       |
| Polonais            | `'pl'`    | [pl.js](https://github.com/auth0/lock/blob/master/src/i18n/pl.js)       |
| Portugais (Brésil)  | `'pt-br'` | [pt-br.js](https://github.com/auth0/lock/blob/master/src/i18n/pt-br.js) |
| Roumain             | `'ro'`    | [ro.js](https://github.com/auth0/lock/blob/master/src/i18n/ro.js)       |
| Russe               | `'ru'`    | [ru.js](https://github.com/auth0/lock/blob/master/src/i18n/ru.js)       |
| Slovaque            | `'sk'`    | [sk.js](https://github.com/auth0/lock/blob/master/src/i18n/sk.js)       |
| Slovène             | `'sl'`    | [sl.js](https://github.com/auth0/lock/blob/master/src/i18n/sl.js)       |
| Suédois             | `'sv'`    | [sv.js](https://github.com/auth0/lock/blob/master/src/i18n/sv.js)       |
| Tchèque             | `'cs'`    | [cs.js](https://github.com/auth0/lock/blob/master/src/i18n/cs.js)       |
| Turc                | `'tr'`    | [tr.js](https://github.com/auth0/lock/blob/master/src/i18n/tr.js)       |
| Ukrainien           | `'ua'`    | [ua.js](https://github.com/auth0/lock/blob/master/src/i18n/uk.js)       |
| Vietnamien          | `'vi'`    | [vi.js](https://github.com/auth0/lock/blob/master/src/i18n/vi.js)       |

## Définir l’option de langue

To use the following examples, you’ll need to first include Lock in your page:

`<script src="https://cdn.auth0.com/js/lock/11.14/lock.min.js"></script>`

Définissez ensuite votre objet `options` et incluez l’option `language`. L’option `language` doit être une chaîne de caractères dont le nom correspond à celui du fichier approprié dans le répertoire `i18n`[de Lock](https://github.com/auth0/lock/tree/master/src/i18n). Puis instanciez Lock.

export const codeExample1 = `// Select a supported language
var options = {
  language: 'es'
};

// Initiating our Auth0Lock
var lock = new Auth0Lock(
  '{yourClientId}',
  '{yourDomain}',
  options
);`;

<AuthCodeBlock children={codeExample1} language="javascript" />

Les données de traduction pour Lock proviennent de fichiers linguistiques qui contiennent des paires clé-valeur représentant diverses traductions. Pour quelques langues, certaines valeurs peuvent être manquantes, auquel cas un avertissement s’affiche : `language does not have property <missing prop>`. Nous vous encourageons à soumettre une [requête pull](https://github.com/auth0/lock/tree/master/src/i18n) pour ajouter ces valeurs manquantes. Vous pouvez également définir les valeurs manquantes dans vos `options` Lock (voir ci-dessous).

## Remplacer des termes du dictionnaire

Vous pouvez également personnaliser vos propres éléments de dictionnaire particuliers à l’aide de l’option `languageDictionary`. Cette fonction est utile si vous utilisez l’une des langues prises en charge, mais que vous modifiez le libellé de quelques éléments. Par exemple, vous pouvez reformuler le `title` ou modifier la façon dont d’autres étiquettes s’affichent pour l’utilisateur tout en laissant intact le reste du texte sur le gadget logiciel.

export const codeExample2 = `// Customize some languageDictionary attributes
var options = {
  languageDictionary: {
    emailInputPlaceholder: "something@youremail.com",
    title: "Log me in"
  },
};

// Initiating our Auth0Lock
var lock = new Auth0Lock(
  '{yourClientId}',
  '{yourDomain}',
  options
);`;

<AuthCodeBlock children={codeExample2} language="javascript" />

Pour un exemple de noms de propriétés possibles de `languageDictionary` et de la manière de structurer un fichier de `language`, voir le [Fichier dictionnaire anglais pour Lock](https://github.com/auth0/lock/blob/master/src/i18n/en.js).

The `languageBaseUrl` option, which takes a string value (a URL), overrides the language source URL for Auth0’s provided translations. By default, it uses the Auth0’s CDN URL `https://cdn.auth0.com` because that is where the provided language translations are stored. By providing another value, you can use your own source for the language translations as needed for your applications. Your language source should be a JavaScript file.
