---
createdAt: 2026-01-21
updatedAt: 2026-01-21
title: Документація пакета react-intlayer
description: Реалізація Intlayer для React, що надає хуки та провайдери для React-додатків.
keywords:
  - react-intlayer
  - react
  - internationalization
  - i18n
slugs:
  - doc
  - packages
  - react-intlayer
  - exports
history:
  - version: 7.5.14
    date: 2026-01-21
    changes: Уніфікована документація для всіх експортів
---

# Пакет react-intlayer

Пакет `react-intlayer` надає необхідні інструменти для інтеграції Intlayer у React-додатки. Він включає контекстні провайдери, хуки та компоненти для роботи з багатомовним контентом.

## Встановлення

```bash
npm install react-intlayer
```

## Експорти

### Провайдери

Імпорт:

```tsx
import "react-intlayer";
```

| Компонент                 | Опис                                                                                                                               | Пов'язаний документ                                                                                                           |
| ------------------------- | ---------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------- |
| `IntlayerProvider`        | Головний провайдер, який обгортає ваш застосунок і надає контекст Intlayer. За замовчуванням містить підтримку редактора.          | [IntlayerProvider](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/packages/react-intlayer/IntlayerProvider.md) |
| `IntlayerProviderContent` | Компонент-провайдер, орієнтований на контент без функцій редактора. Використовуйте його, коли вам не потрібен візуальний редактор. | -                                                                                                                             |
| `HTMLProvider`            | Провайдер для налаштувань інтернаціоналізації, пов'язаних з HTML. Дозволяє перевизначати компоненти для HTML-тегів.                | -                                                                                                                             |

### Хуки

Імпорт:

```tsx
import "react-intlayer";
```

| Хук                    | Опис                                                                                                                                 | Пов'язаний документ                                                                                                     |
| ---------------------- | ------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------- |
| `useIntlayer`          | Клієнтський hook, який вибирає словник за його ключем і повертає його вміст. Використовує локаль із контексту, якщо вона не вказана. | [useIntlayer](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/packages/react-intlayer/useIntlayer.md)     |
| `useDictionary`        | Хук, який перетворює об'єкт словника та повертає вміст для поточної локалі. Обробляє переклади `t()`, enumerations, тощо.            | [useDictionary](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/packages/react-intlayer/useDictionary.md) |
| `useDictionaryAsync`   | Хук, який обробляє асинхронні словники. Приймає мапу словників, що повертають Promise, і вирішує її для поточної локалі.             | -                                                                                                                       |
| `useDictionaryDynamic` | Хук, що обробляє динамічні словники, завантажувані за ключем. Використовує React Suspense для обробки станів завантаження.           | -                                                                                                                       |
| `useLocale`            | Клієнтський хук для отримання поточної локалі, локалі за замовчуванням, доступних локалей та функції для оновлення локалі.           | [useLocale](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/packages/react-intlayer/useLocale.md)         |
| `useLocaleBase`        | Хук для отримання поточної локалі та всіх пов'язаних полів (locale, defaultLocale, availableLocales, setLocale) з контексту.         | -                                                                                                                       |
| `useRewriteURL`        | Клієнтський хук для керування переписуванням URL. Якщо для поточного pathname і локалі існує правило переписування, він оновить URL. | [useRewriteURL](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/packages/react-intlayer/useRewriteURL.md) |
| `useI18n`              | Хук, що надає функцію перекладу `t()` для доступу до вкладених даних за ключем. Наслідує патерн i18next/next-intl.                   | [useI18n](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/packages/react-intlayer/useI18n.md)             |
| `useIntl`              | Хук, який надає об'єкт `Intl`, прив'язаний до локалі. Автоматично підставляє поточну локаль і використовує оптимізоване кешування.   | -                                                                                                                       |
| `useLocaleStorage`     | Хук, який забезпечує збереження локалі у local storage або cookies. Повертає функції отримання та встановлення.                      | -                                                                                                                       |
| `useLocaleCookie`      | Застарілий. Використовуйте натомість `useLocaleStorage`. Хук, який керує збереженням локалі в cookies.                               | -                                                                                                                       |
| `useLoadDynamic`       | Хук для завантаження динамічних словників за допомогою React Suspense. Приймає ключ і проміс, кешує результати.                      | -                                                                                                                       |
| `useIntlayerContext`   | Хук, який надає поточні значення контексту клієнта Intlayer (locale, setLocale тощо).                                                | -                                                                                                                       |
| `useHTMLContext`       | Хук для доступу до перевизначень HTML-компонентів із контексту HTMLProvider.                                                         | -                                                                                                                       |

### Функції

Імпорт:

```tsx
import "react-intlayer";
```

| Функція              | Опис                                                                                                                                         | Пов'язаний документ                                                                                 |
| -------------------- | -------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------- |
| `t`                  | Функція перекладу на стороні клієнта, що повертає переклад наданого багатомовного вмісту. Використовує локаль із контексту, якщо не вказано. | [переклад](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/dictionary/translation.md) |
| `getDictionary`      | Обробляє об'єкти словника та повертає вміст для вказаної локалі. Обробляє переклади `t()`, переліки, Markdown, HTML тощо.                    | -                                                                                                   |
| `getIntlayer`        | Отримує словник за його ключем із згенерованої декларації та повертає його вміст для вказаної локалі. Оптимізована версія `getDictionary`.   | -                                                                                                   |
| `setLocaleInStorage` | Встановлює локаль у сховищі (local storage або cookie залежно від конфігурації).                                                             | -                                                                                                   |
| `setLocaleCookie`    | Застаріло. Використовуйте `setLocaleInStorage` натомість. Встановлює локаль у cookie.                                                        | -                                                                                                   |
| `localeInStorage`    | Отримує локаль зі сховища (localStorage або cookie).                                                                                         | -                                                                                                   |
| `localeCookie`       | Застаріле. Використовуйте `localeInStorage` натомість. Отримує локаль з cookie.                                                              | -                                                                                                   |

### Компоненти

Імпорт:

```tsx
import "react-intlayer";
```

або

```tsx
import "react-intlayer/markdown";
```

| Компонент          | Опис                                                                                                                                          | Пов'язаний документ                                                                                                           |
| ------------------ | --------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------- |
| `MarkdownProvider` | Провайдер для контексту рендерингу Markdown. Дозволяє перевизначати компоненти для елементів markdown.                                        | -                                                                                                                             |
| `MarkdownRenderer` | Відтворює вміст markdown з користувацькими компонентами. Підтримує всі стандартні можливості markdown та синтаксис, специфічний для Intlayer. | [MarkdownRenderer](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/packages/react-intlayer/MarkdownRenderer.md) |

### Типи

Імпорт:

```tsx
import "react-intlayer";
```

| Тип            | Опис                                                                                                                        |
| -------------- | --------------------------------------------------------------------------------------------------------------------------- |
| `IntlayerNode` | Тип, що представляє вузол у дереві контенту Intlayer. Використовується для типобезпечної (type-safe) маніпуляції контентом. |

### Серверна сторона (react-intlayer/server)

Імпорт:

```tsx
import "react-intlayer/server";
```

| Експорт                  | Тип         | Опис                                                      |
| ------------------------ | ----------- | --------------------------------------------------------- |
| `IntlayerServerProvider` | `Component` | Провайдер для рендерингу на сервері.                      |
| `IntlayerServer`         | `Component` | Серверна обгортка для контенту Intlayer.                  |
| `t`                      | `Function`  | Серверна версія функції перекладу.                        |
| `useLocale`              | `Hook`      | Хук для доступу до локалі на серверній стороні.           |
| `useIntlayer`            | `Hook`      | Серверна версія `useIntlayer`.                            |
| `useDictionary`          | `Hook`      | Серверна версія `useDictionary`.                          |
| `useI18n`                | `Hook`      | Серверна версія `useI18n`.                                |
| `locale`                 | `Function`  | Функція для отримання або встановлення локалі на сервері. |
