@intlayer/docs 9.3.3 → 9.4.0

package/docs/fr/packages/intlayer/getIntlayer.md

@@ -0,0 +1,196 @@
+---
+createdAt: 2026-08-23
+updatedAt: 2026-08-23
+title: Documentation de la fonction getIntlayer | intlayer
+description: Découvrez comment utiliser la fonction getIntlayer pour le package intlayer
+keywords:
+  - getIntlayer
+  - dictionary
+  - content
+  - selector
+  - Intlayer
+  - intlayer
+  - Internationalization
+  - Documentation
+  - JavaScript
+  - TypeScript
+slugs:
+  - doc
+  - packages
+  - intlayer
+  - getIntlayer
+history:
+  - version: 9.4.0
+    date: 2026-08-23
+    changes: "Documentation initiale"
+author: aymericzip
+---
+
+# Documentation : Fonction `getIntlayer` dans `intlayer`
+
+## Description
+
+La fonction `getIntlayer` récupère un dictionnaire par sa clé et retourne son contenu interprété pour une locale donnée. C'est l'équivalent agnostique du framework du hook `useIntlayer` : même contenu, mêmes sélecteurs, mais utilisable n'importe où où un contexte React n'est pas disponible — scripts Node, fonctions serveur, chargeurs de routes, constructeurs de métadonnées, gestionnaires Express/Fastify, tests.
+
+Elle lit les dictionnaires générés par Intlayer dans `.intlayer/`, donc l'argument `key` est typé et autocompléé à partir de vos propres déclarations de contenu, et l'objet retourné est entièrement typé jusqu'à chaque feuille.
+
+**Fonctionnalités principales :**
+
+- Clés de dictionnaire typées et contenu retourné typé
+- Interprète chaque nœud de contenu (`t()`, `enu()`, `cond()`, `insert()`, `nest()`, `md()`, `html()`, `file()`, `gender()`)
+- Accepte une locale ou un objet sélecteur (collections, variantes)
+- Les résultats sont mémorisés par `key + locale + selector`
+- Bascule vers un proxy sûr en développement quand un dictionnaire est manquant, au lieu de planter
+
+---
+
+## Signature de la fonction
+
+```typescript
+getIntlayer(
+  key: DictionaryKeys,                        // Requis
+  localeOrSelector?: LocalesValues | DictionarySelector, // Optionnel
+  plugins?: Plugins[]                         // Optionnel
+): DeepTransformContent<...>
+```
+
+---
+
+## Paramètres
+
+- `key: DictionaryKeys`
+  - **Description**: La clé du dictionnaire à lire, telle que déclarée dans vos fichiers de contenu.
+  - **Type**: `DictionaryKeys` — une union de chaque clé de dictionnaire déclarée.
+  - **Required**: Yes
+
+- `localeOrSelector: LocalesValues | DictionarySelector`
+  - **Description**: La locale pour interpréter le contenu avec, ou un objet sélecteur pour [les dictionnaires dynamiques](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/dynamic_dictionaries/index.md).
+    - `'fr'` — une locale
+    - `{ item: 2 }` — un élément de [collection](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/dynamic_dictionaries/collections.md) (omettez `item` pour obtenir chaque élément sous forme de tableau)
+    - `{ variant: 'black-friday' }` — une [variante](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/dynamic_dictionaries/variants.md) nommée (omettez pour la variante `default`)
+    - `{ variant: { id: 'prod_abc', userId: '123' } }` — une variante structurée
+    - Tout sélecteur peut porter une locale: `{ item: 2, locale: 'fr' }`
+  - **Type**: `LocalesValues | DictionarySelector`
+  - **Required**: No (Optional) — defaults to the configured `defaultLocale`.
+
+- `plugins: Plugins[]`
+  - **Description**: Des transformateurs de nœuds personnalisés remplaçant les plugins interpréteur de base. Usage avancé uniquement; omettez-le pour conserver le comportement par défaut.
+  - **Type**: `Plugins[]`
+  - **Required**: No (Optional)
+
+### Retours
+
+- **Type** : Le contenu interprété du dictionnaire, typé à partir de votre déclaration.
+- **Description** : Un objet simple miroir du champ `content` de votre dictionnaire, où chaque nœud Intlayer a été résolu à sa valeur finale pour la locale demandée.
+
+---
+
+## Exemple d'utilisation
+
+### Utilisation de base
+
+```typescript fileName="src/app.content.ts" codeFormat="typescript"
+import { t, type Dictionary } from "intlayer";
+
+const appContent = {
+  key: "app",
+  content: {
+    title: t({
+      fr: "Bonjour",
+      en: "Hello",
+    }),
+  },
+} satisfies Dictionary;
+
+export default appContent;
+```
+
+```typescript codeFormat={["typescript", "esm", "commonjs"]}
+import { getIntlayer } from "intlayer";
+
+const { title } = getIntlayer("app", "fr"); // "Bonjour"
+```
+
+### Sans locale
+
+Omettre la locale interprète le contenu avec la `defaultLocale` déclarée dans votre [configuration](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/configuration.md).
+
+```typescript
+import { getIntlayer } from "intlayer";
+
+const { title } = getIntlayer("app"); // Interprété avec la locale par défaut
+```
+
+### À l'intérieur d'un gestionnaire de serveur
+
+```typescript fileName="src/routes/greeting.ts" codeFormat="typescript"
+import { getIntlayer, getLocale } from "intlayer";
+
+export const greetingHandler = async (request: Request) => {
+  const locale = await getLocale({
+    getHeader: (name) => request.headers.get(name) ?? undefined,
+  });
+
+  const { title } = getIntlayer("app", locale);
+
+  return Response.json({ title });
+};
+```
+
+### Avec un sélecteur (collections et variantes)
+
+```typescript
+import { getIntlayer } from "intlayer";
+
+// Un seul élément de collection
+const secondPost = getIntlayer("blog-post", { item: 2, locale: "fr" });
+
+// Tous les éléments de la collection, sous forme de tableau ordonné
+const allPosts = getIntlayer("blog-post", { locale: "fr" });
+
+// Une variante nommée
+const banner = getIntlayer("banner", { variant: "black-friday", locale: "fr" });
+```
+
+---
+
+## Notes de comportement
+
+### Mise en cache
+
+Les résultats sont mémorisés dans un cache au niveau du module, indexé par `key + locale + selector`. L'appel répété de `getIntlayer("app", "fr")` interprète le dictionnaire une seule fois et retourne le même objet par la suite.
+
+### Dictionnaires manquants
+
+En développement, demander une clé qui n'a pas de dictionnaire généré enregistre un avertissement une seule fois et retourne un proxy de secours sûr : lire `content.title` produit la chaîne `"app.title"` au lieu de lever une exception. Cela maintient une page utilisable pendant que la déclaration manquante est corrigée. Exécutez la construction Intlayer (ou le serveur de développement) afin que le dictionnaire soit généré.
+
+### Taille du bundle
+
+`getIntlayer` lit le dictionnaire fusionné, qui contient **toutes** les locales. Dans les bundles client, les [plugins de build](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/bundle_optimization.md) réécrivent l'appel afin que seul le contenu nécessaire soit livré. Quand vous lisez du contenu en dehors du rendu (métadonnées, loaders, fonctions serveur) et que vous souhaitez charger une seule locale à la demande, utilisez [`getIntlayerAsync`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/packages/intlayer/getIntlayerAsync.md) à la place.
+
+---
+
+## Fonctions associées
+
+- [`getIntlayerAsync`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/packages/intlayer/getIntlayerAsync.md): Équivalent asynchrone chargeant un seul chunk de locale.
+- [`getDictionary`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/packages/intlayer/getDictionary.md): Interprète un objet dictionnaire que vous transmettez vous-même, au lieu d'un objet recherché par clé.
+- [`useIntlayer`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/packages/react-intlayer/useIntlayer.md): L'équivalent React hook, lisant la locale du provider.
+
+---
+
+## TypeScript
+
+```typescript
+function getIntlayer<
+  const T extends DictionaryKeys,
+  const A extends LocalesValues | DictionarySelector = DeclaredLocales,
+>(
+  key: T,
+  localeOrSelector?: A,
+  plugins?: Plugins[]
+): DeepTransformContent<
+  DictionaryRegistryResult<T, A>,
+  IInterpreterPluginState,
+  ExtractSelectorLocale<A>
+>;
+```

package/docs/fr/packages/intlayer/getIntlayerAsync.md

@@ -0,0 +1,141 @@
+---
+createdAt: 2026-08-23
+updatedAt: 2026-08-23
+title: Documentation de la fonction getIntlayerAsync | intlayer
+description: Découvrez comment utiliser la fonction getIntlayerAsync du package intlayer
+keywords:
+  - getIntlayerAsync
+  - dictionary
+  - dynamic import
+  - metadata
+  - bundle optimization
+  - Intlayer
+  - intlayer
+  - Internationalization
+  - Documentation
+  - JavaScript
+  - TypeScript
+slugs:
+  - doc
+  - packages
+  - intlayer
+  - getIntlayerAsync
+history:
+  - version: 9.4.0
+    date: 2026-08-23
+    changes: "Initial documentation"
+author: aymericzip
+---
+
+# Documentation : Fonction `getIntlayerAsync` dans `intlayer`
+
+## Description
+
+La fonction `getIntlayerAsync` sélectionne un dictionnaire par sa clé et résout son contenu pour une locale donnée, **en chargeant cette locale seule**.
+
+C'est l'équivalent asynchrone de [`getIntlayer`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/packages/intlayer/getIntlayer.md), destiné aux endroits où un dictionnaire est lu en dehors du rendu — constructeurs de `head` / métadonnées de route, loaders, fonctions serveur.
+
+Où `getIntlayer` récupère le dictionnaire fusionné contenant chaque locale, les [plugins de build](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/bundle_optimization.md) (`@intlayer/babel`, `@intlayer/swc`) réécrivent cet appel en `getDictionaryAsync(loaderMap, key, locale)`, le pointant vers les chunks par locale dans `.intlayer/dynamic_dictionaries/`. Le bundle ne porte donc que la locale réellement demandée.
+
+Sans ces plugins — une build non optimisée — l'appel se résout à travers le registre de dictionnaire synchrone à la place : le même contenu, sans la division par locale.
+
+**Fonctionnalités clés :**
+
+- Mêmes clés typées, sélecteurs et contenu retourné que `getIntlayer`
+- Charge uniquement le chunk de la locale demandée dans les builds optimisées
+- Les appels concurrents pour le même chunk partagent un seul chargement
+- Sûr à utiliser dans les constructeurs de métadonnées `async`, loaders et fonctions serveur
+
+---
+
+## Signature de fonction
+
+```typescript
+getIntlayerAsync(
+  key: DictionaryKeys,                        // Requis
+  localeOrSelector?: LocalesValues | DictionarySelector, // Optionnel
+  plugins?: Plugins[]                         // Optionnel
+): Promise<DeepTransformContent<...>>
+```
+
+---
+
+## Paramètres
+
+- `key: DictionaryKeys`
+  - **Description**: La clé du dictionnaire à lire, telle que déclarée dans vos fichiers de contenu.
+  - **Type**: `DictionaryKeys` — une union de chaque clé de dictionnaire déclarée.
+  - **Required**: Yes
+
+- `localeOrSelector: LocalesValues | DictionarySelector`
+  - **Description**: La locale pour interpréter le contenu avec, ou un objet sélecteur pour les [dictionnaires dynamiques](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/dynamic_dictionaries/index.md).
+    - `'fr'` — une locale
+    - `{ item: 2 }` — un élément de [collection](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/dynamic_dictionaries/collections.md) (omettez `item` pour obtenir chaque élément en tant que tableau)
+    - `{ variant: 'black-friday' }` — une [variante](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/dynamic_dictionaries/variants.md) nommée (omettez pour celle par `default`)
+    - `{ variant: { id: 'prod_abc', userId: '123' } }` — une variante structurée
+    - N'importe quel sélecteur peut porter une locale: `{ item: 2, locale: 'fr' }`
+  - **Type**: `LocalesValues | DictionarySelector`
+  - **Required**: No (Optional) — defaults to the configured `defaultLocale`.
+
+- `plugins: Plugins[]`
+  - **Description**: Des transformateurs de nœuds personnalisés remplaçant les plugins d'interpréteur de base. Utilisation avancée uniquement.
+  - **Type**: `Plugins[]`
+  - **Required**: No (Optional)
+
+### Retours
+
+- **Type**: `Promise<Content>` — une promise qui se résout avec le contenu interprété du dictionnaire, typé à partir de votre déclaration.
+
+---
+
+## Exemple d'utilisation
+
+### Utilisation de base
+
+```typescript codeFormat={["typescript", "esm", "commonjs"]}
+import { getIntlayerAsync } from "intlayer";
+
+const { title } = await getIntlayerAsync("app", "fr"); // "Bonjour"
+```
+
+---
+
+## `getIntlayer` vs `getIntlayerAsync`
+
+|                    | [`getIntlayer`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/packages/intlayer/getIntlayer.md) | `getIntlayerAsync`                                          |
+| ------------------ | --------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------- |
+| Returns            | Le contenu                                                                                                      | Une promesse du contenu                                     |
+| Dictionary loaded  | Le dictionnaire fusionné (toutes les locales)                                                                   | Le chunk de la locale demandée uniquement                   |
+| Best suited for    | Rendu, chemins de code synchrone                                                                                | Métadonnées, loaders, fonctions serveur                     |
+| Requires a plugin? | Non                                                                                                             | Non — la division par locale nécessite les plugins de build |
+
+Both accept the same arguments and return the same content: switching from one to the other only changes **when** and **how much** is loaded.
+
+---
+
+## Fonctions Associées
+
+- [`getIntlayer`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/packages/intlayer/getIntlayer.md): Équivalent synchrone lisant le dictionnaire fusionné.
+- [`getDictionaryAsync`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/packages/intlayer/getDictionaryAsync.md): La fonction de bas niveau que les plugins de build réécrivent dans cet appel.
+- [`getLocale`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/packages/intlayer/getLocale.md): Détecte la locale d'une requête entrante.
+
+---
+
+## TypeScript
+
+```typescript
+function getIntlayerAsync<
+  const T extends DictionaryKeys,
+  const A extends LocalesValues | DictionarySelector = DeclaredLocales,
+>(
+  key: T,
+  localeOrSelector?: A,
+  plugins?: Plugins[]
+): Promise<
+  DeepTransformContent<
+    DictionaryRegistryResult<T, A>,
+    IInterpreterPluginState,
+    ExtractSelectorLocale<A>
+  >
+>;
+```

package/docs/fr/packages/intlayer/getLocalizedPath.md

@@ -31,6 +31,8 @@ author: aymericzip
 
 La fonction `getLocalizedPath` résout un chemin canonique (chemin interne de l'application) en son équivalent localisé en fonction de la locale fournie et des règles de réécriture. Elle est particulièrement utile pour générer des URLs optimisées pour le SEO qui varient selon la langue.
 
+C'est l'équivalent relatif de [`getLocalizedUrl`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/packages/intlayer/getLocalizedUrl.md) — pour une entrée relative, les deux retournent la même valeur. Contrairement à `getLocalizedUrl`, il ne retourne jamais une URL absolue : la configuration `domains` est ignorée, donc une locale servie depuis son propre domaine produit quand même un chemin. Une entrée absolue est acceptée, mais son origine est supprimée — seuls son chemin, sa chaîne de requête et son hash sont conservés.
+
 **Fonctionnalités clés :**
 
 - Prend en charge les paramètres de route dynamiques en utilisant la syntaxe `[param]`.
@@ -60,13 +62,17 @@ getLocalizedPath(
   - **Type** : `string`
   - **Required** : Oui
 
-- `locale: Locales`
-  - **Description** : La locale cible pour laquelle le chemin doit être localisé.
-  - **Type** : `Locales`
-  - **Required** : Oui
-
 ### Paramètres optionnels
 
+- `locale?: Locales`
+  - **Description**: La locale cible pour laquelle le chemin doit être localisé.
+  - **Type**: `Locales`
+  - **Default**: La locale par défaut de la configuration de votre projet.
+
+- `options?: object`
+  - **Description**: Overrides de routage. Chaque entrée utilise par défaut la configuration de votre projet.
+  - **Type**: `object`
+
 - `rewriteRules?: RoutingConfig['rewrite']`
   - **Description** : Un objet définissant des règles de réécriture personnalisées. Si non fourni, il prend par défaut la propriété `routing.rewrite` de la configuration de votre projet.
   - **Type** : `RoutingConfig['rewrite']`
@@ -79,6 +85,28 @@ getLocalizedPath(
 - **Type** : `string`
 - **Description** : Le chemin localisé pour la locale spécifiée.
 
+Le type est affiné à partir des règles de réécriture déclarées dans votre configuration, donc l'éditeur affiche le chemin résolu plutôt qu'une simple `string` :
+
+```typescript codeFormat="typescript"
+// Configuration: mode 'prefix-no-default', defaultLocale 'en',
+//                { '/about': { fr: '/a-propos' }, '/product/[id]': { fr: '/produit/[id]' } }
+const about = getLocalizedPath("/about", Locales.FRENCH);
+//    ^? '/fr/a-propos'
+const product = getLocalizedPath("/product/123", Locales.FRENCH);
+//    ^? '/fr/produit/123'
+const contact = getLocalizedPath("/contact", Locales.FRENCH);
+//    ^? '/fr/contact'  (aucune règle de réécriture ne correspond, seul le préfixe est appliqué)
+const home = getLocalizedPath("/", Locales.FRENCH);
+//    ^? '/fr'
+```
+
+Le même narrowing s'écoule dans [`getLocalizedUrl`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/packages/intlayer/getLocalizedUrl.md), qui applique les règles de réécriture avant de préfixer la locale.
+
+Deux cas restent élargis à `string`, car ils ne peuvent pas être résolus au moment de la compilation :
+
+- un chemin qui n'est pas une chaîne de caractères littérale (par exemple, construite à partir d'une variable) ;
+- un chemin correspondant à une règle utilisant un paramètre multi-segment ou optionnel (`[...slug]`, `[[...slug]]`, `:param?`).
+
 ---
 
 ## Exemple d'utilisation
@@ -126,6 +154,18 @@ getLocalizedPath("/contact", Locales.FRENCH, manualRules);
 // Sortie : "/contactez-nous"
 ```
 
+### Omission de la locale
+
+Quand aucune locale n'est donnée, le chemin est localisé pour la locale par défaut configurée :
+
+```typescript codeFormat="typescript"
+import { getLocalizedPath } from "intlayer";
+
+// Configuration: defaultLocale = Locales.ENGLISH, { '/about': { en: '/about', fr: '/a-propos' } }
+getLocalizedPath("/about");
+// Output: "/about"
+```
+
 ---
 
 ## Fonctions associées

package/docs/fr/packages/intlayer/getLocalizedUrl.md

@@ -143,36 +143,6 @@ getLocalizedUrl(
 // Résultat : "/about" pour la locale par défaut (anglais)
 ```
 
-```javascript codeFormat="esm"
-import { getLocalizedUrl, Locales } from "intlayer";
-
-getLocalizedUrl(
-  "/about",
-  Locales.FRENCH,
-  [Locales.ENGLISH, Locales.FRENCH],
-  Locales.ENGLISH,
-  false
-);
-
-// Résultat : "/fr/about" pour la locale française
-// Résultat : "/about" pour la locale par défaut (anglais)
-```
-
-```javascript codeFormat="commonjs"
-const { getLocalizedUrl, Locales } = require("intlayer");
-
-getLocalizedUrl(
-  "/about",
-  Locales.FRENCH,
-  [Locales.ENGLISH, Locales.FRENCH],
-  Locales.ENGLISH,
-  false
-);
-
-// Résultat : "/fr/about" pour la locale française
-// Résultat : "/about" pour la locale par défaut (anglais)
-```
-
 ### Remplacement Partiel de la Configuration
 
 Vous pouvez également fournir uniquement certains paramètres optionnels. La fonction utilisera la configuration de votre projet pour tous les paramètres que vous ne spécifiez pas :
@@ -249,6 +219,12 @@ getLocalizedUrl(
 - **Locales non supportées :**
   - Pour les locales non listées dans `locales`, la fonction n'applique aucun préfixe.
 
+- **Modes de routage :**
+  - `'prefix-no-default'` : La locale par défaut n'a pas de préfixe, les autres en ont (par ex., `/about`, `/fr/about`)
+  - `'prefix-all'` : Toutes les locales ont des préfixes (par ex., `/en/about`, `/fr/about`)
+  - `'no-prefix'` : Pas de préfixes de locale dans les URLs (locale gérée ailleurs)
+  - `'search-params'` : Locale spécifiée via paramètre de requête (par ex., `/about?locale=fr`)
+
 ---
 
 ## Utilisation dans les applications

package/docs/fr/packages/intlayer/getMultilingualUrls.md

@@ -138,8 +138,6 @@ getMultilingualUrls(
 // }
 ```
 
----
-
 ### Différents Modes de Routage
 
 ```typescript
@@ -205,6 +203,12 @@ getMultilingualUrls("/dashboard", {
 - **Langues non prises en charge :**
   - Seules les langues fournies dans le tableau `locales` sont prises en compte pour générer les URLs.
 
+- **Modes de routage :**
+  - `'prefix-no-default'`: La locale par défaut n'a pas de préfixe, les autres en ont (ex. : `/dashboard`, `/fr/dashboard`)
+  - `'prefix-all'`: Toutes les locales ont des préfixes (ex. : `/en/dashboard`, `/fr/dashboard`)
+  - `'no-prefix'`: Aucun préfixe de locale dans les URLs (toutes les locales retournent la même URL)
+  - `'search-params'`: Locale spécifiée via un paramètre de requête (ex. : `/dashboard?locale=fr`)
+
 ---
 
 ## Utilisation dans les applications

package/docs/fr/packages/intlayer/getTranslation.md

@@ -31,6 +31,8 @@ author: aymericzip
 
 La fonction `getTranslationContent` récupère le contenu correspondant à une locale spécifique à partir d'un ensemble de contenus linguistiques personnalisables. Si la locale spécifiée n'est pas trouvée, elle retourne par défaut le contenu de la locale par défaut configurée dans le projet.
 
+Pour plus de détails sur la façon de déclarer les traductions, consultez la [documentation Translation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/dictionary/translation.md).
+
 ## Paramètres
 
 - `languageContent: CustomizableLanguageContent<Content>`

package/docs/fr/packages/next-intlayer/t.md

@@ -158,6 +158,23 @@ Dans `next-intlayer`, la langue courante est gérée via des fournisseurs de con
 
 #### Exemple :
 
+<Tabs>
+ <Tab label='Intlayer >=9.4' value='>=9.4'>
+
+```tsx codeFormat={["typescript", "esm", "commonjs"]}
+import type { FC, ReactNode } from "react";
+import type { Locales } from "intlayer";
+import { IntlayerProvider } from "next-intlayer/server";
+
+const Page: FC<{ locale: Locales; children: ReactNode }> = ({
+  locale,
+  children,
+}) => <IntlayerProvider locale={locale}>{children}</IntlayerProvider>;
+```
+
+ </Tab>
+ <Tab label='Intlayer <9.4' value='<9.4'>
+
 ```tsx codeFormat={["typescript", "esm", "commonjs"]}
 import type { FC } from "react";
 import type { Locales } from "intlayer";
@@ -173,6 +190,9 @@ const Page: FC<{ locale: Locales }> = ({ locale }) => (
 );
 ```
 
+ </Tab>
+</Tabs>
+
 ---
 
 ## Erreurs courantes et dépannage

package/docs/fr/packages/next-intlayer/useIntlayer.md

@@ -79,6 +79,34 @@ Les instructions pour configurer les fichiers de déclaration de contenu sont di
 
 Voici comment vous pouvez implémenter le hook `useIntlayer` dans une page Next.js pour charger dynamiquement le contenu localisé en fonction de la locale actuelle de l'application :
 
+<Tabs>
+ <Tab label='Intlayer >=9.4' value='>=9.4'>
+
+```tsx fileName="src/pages/[locale]/index.tsx" codeFormat={["typescript", "esm"]}
+import { ClientComponentExample } from "@components/ClientComponentExample";
+import { ServerComponentExample } from "@components/ServerComponentExample";
+import { type NextPageIntlayer } from "next-intlayer";
+import { useIntlayer } from "next-intlayer";
+import { IntlayerProvider } from "next-intlayer/server";
+
+const HomePage: NextPageIntlayer = async ({ params }) => {
+  const { locale } = await params;
+
+  const content = useIntlayer("homepage", locale);
+
+  return (
+    <IntlayerProvider locale={locale}>
+      <p>{content.introduction}</p>
+      <ClientComponentExample />
+      <ServerComponentExample />
+    </IntlayerProvider>
+  );
+};
+```
+
+ </Tab>
+ <Tab label='Intlayer <9.4' value='<9.4'>
+
 ```tsx fileName="src/pages/[locale]/index.tsx" codeFormat={["typescript", "esm"]}
 import { ClientComponentExample } from "@components/ClientComponentExample";
 import { ServerComponentExample } from "@components/ServerComponentExample";
@@ -104,6 +132,9 @@ const HomePage: NextPageIntlayer = async ({ params }) => {
 };
 ```
 
+ </Tab>
+</Tabs>
+
 ```tsx fileName="src/components/ClientComponentExample.tsx" codeFormat={["typescript", "esm"]}
 "use-client";
 

package/docs/fr/packages/next-intlayer/useLocale.md

@@ -104,6 +104,8 @@ Le hook `useLocale` accepte les paramètres suivants :
 
 ## Valeurs de retour
 
+Lorsque vous invoquez le hook `useLocale`, il retourne un objet contenant les propriétés suivantes :
+
 - **`locale`** : La langue actuelle telle que définie dans le contexte React.
 - **`defaultLocale`** : La langue principale définie dans la configuration.
 - **`availableLocales`** : Une liste de toutes les langues disponibles telles que définies dans la configuration.

package/docs/fr/packages/react-intlayer/useI18n.md

@@ -77,6 +77,34 @@ Toutes les clés du dictionnaire doivent être déclarées dans des fichiers de
 
 Exemples d'utilisation du hook `useI18n` dans des composants React :
 
+<Tabs>
+ <Tab label='Intlayer >=9.4' value='>=9.4'>
+
+```tsx fileName="src/App.tsx" codeFormat={["typescript", "esm"]}
+import type { FC } from "react";
+import { ClientComponentExample, ServerComponentExample } from "@components";
+import { IntlayerProvider } from "react-intlayer";
+import { useI18n } from "react-intlayer/server";
+import { Locales } from "intlayer";
+
+const App: FC<{ locale: Locales }> = ({ locale }) => {
+  const t = useI18n("home-page", locale);
+
+  return (
+    <>
+      <p>{t("introduction")}</p>
+      <IntlayerProvider locale={locale}>
+        <ClientComponentExample />
+      </IntlayerProvider>
+      <ServerComponentExample />
+    </>
+  );
+};
+```
+
+ </Tab>
+ <Tab label='Intlayer <9.4' value='<9.4'>
+
 ```tsx fileName="src/App.tsx" codeFormat={["typescript", "esm"]}
 import type { FC } from "react";
 import { ClientComponentExample, ServerComponentExample } from "@components";
@@ -101,6 +129,9 @@ const App: FC<{ locale: Locales }> = ({ locale }) => {
 };
 ```
 
+ </Tab>
+</Tabs>
+
 ```tsx fileName="src/components/ComponentExample.tsx" codeFormat={["typescript", "esm"]}
 import type { FC } from "react";
 import { useI18n } from "react-intlayer";