@intlayer/docs 9.0.0-canary.2 → 9.0.0-canary.20

package/docs/uk/intlayer_with_nuxt.md

@@ -97,7 +97,7 @@ Intlayer оптимізовано для ідеальної роботи з Nuxt
 
 <Tabs defaultTab="video">
   <Tab label="Відео" value="video">
-  
+
 <iframe title="Як перекласти ваш Nuxt і Vue додаток за допомогою Intlayer? Дізнайтеся про Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/nhUcUAVQ6eQ?autoplay=0&amp;origin=https://intlayer.org&amp;controls=0&amp;rel=1"/>
 
   </Tab>
@@ -133,28 +133,48 @@ Intlayer оптимізовано для ідеальної роботи з Nuxt
 
 Встановіть необхідні пакети за допомогою відповідного пакетного менеджера:
 
+```bash packageManager="npm"
+npx intlayer@canary init --interactive    # v9
+# npx intlayer init                       # v8
+```
+
+```bash packageManager="pnpm"
+pnpm dlx intlayer@canary init --interactive   # v9
+# pnpm dlx intlayer init                      # v8
+```
+
+```bash packageManager="yarn"
+yarn dlx intlayer@canary init --interactive   # v9
+# yarn dlx intlayer init                      # v8
+```
+
+```bash packageManager="bun"
+bunx intlayer@canary init --interactive   # v9
+# bunx intlayer init                      # v8
+```
+
+> прапорець `--interactive` не є обов'язковим. Використовуйте `intlayer-cli init`, якщо ви є ШІ-агентом.
+
+> Ця команда виявить ваше середовище та встановить необхідні пакети. Наприклад:
+
 ```bash packageManager="npm"
 npm install intlayer vue-intlayer
 npm install --save-dev nuxt-intlayer
-npx intlayer init
 ```
 
 ```bash packageManager="pnpm"
 pnpm add intlayer vue-intlayer
 pnpm add --save-dev nuxt-intlayer
-pnpm intlayer init
 ```
 
 ```bash packageManager="yarn"
 yarn add intlayer vue-intlayer
 yarn add --save-dev nuxt-intlayer
-yarn intlayer init
 ```
 
 ```bash packageManager="bun"
 bun add intlayer vue-intlayer
 bun add --dev nuxt-intlayer
-bun x intlayer init
 ```
 
 - **intlayer**
@@ -625,33 +645,6 @@ export default aboutPageContent;
 
 </Steps>
 
-### (Необов'язково) Крок 6b: Створіть layout з навігацією
-
-Nuxt layouts дозволяють визначити спільну структуру для ваших сторінок. Створіть default layout, який включає locale switcher та навігацію:
-
-```vue fileName="layouts/default.vue"
-<script setup lang="ts">
-import Links from "~/components/Links.vue";
-import LocaleSwitcher from "~/components/LocaleSwitcher.vue";
-</script>
-
-<template>
-  <div>
-    <header>
-      <LocaleSwitcher />
-    </header>
-    <main>
-      <slot />
-    </main>
-
-    <Links href="/">Головна</Links>
-    <Links href="/about">Про нас</Links>
-  </div>
-</template>
-```
-
-Компонент `Links` (показаний нижче) забезпечує автоматичну локалізацію внутрішніх навігаційних посилань.
-
 ### Конфігурація Git
 
 Рекомендується ігнорувати файли, згенеровані Intlayer. Це дозволяє уникнути їх коміту в ваш репозиторій Git.

package/docs/uk/intlayer_with_react_native+expo.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2025-06-18
-updatedAt: 2026-05-31
+updatedAt: 2026-06-25
 title: "Expo + React Native i18n - Повний посібник з перекладу вашого застосунку"
 description: "Більше ніякого i18next. Посібник 2026 зі створення багатомовного (i18n) застосунку Expo + React Native. Перекладайте за допомогою ШІ-агентів та оптимізуйте розмір бандлу, SEO та продуктивність."
 keywords:
@@ -17,6 +17,9 @@ slugs:
 applicationTemplate: https://github.com/aymericzip/intlayer-react-native-template
 applicationShowcase: https://intlayer-react-native.vercel.app
 history:
+  - version: 9.0.0
+    date: 2026-06-25
+    changes: "Імпорт провайдерів та хуків безпосередньо з react-native-intlayer; react-intlayer більше не потрібен як пряма залежність"
   - version: 8.9.0
     date: 2026-05-04
     changes: "Оновлення використання API useIntlayer у Solid для прямого доступу до властивостей"
@@ -40,7 +43,7 @@ author: aymericzip
 <iframe
   src="https://ide.intlayer.org/aymericzip/intlayer-react-native-template?file=intlayer.config.ts"
   className="m-auto overflow-hidden rounded-lg border-0 max-md:size-full max-md:h-[700px] md:aspect-16/9 md:w-full"
-  title="Демо CodeSandbox, як інтернаціоналізувати ваш застосунок за допомогою Intlayer"
+  title="Demo CodeSandbox - How to Internationalize your application using Intlayer"
   sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts"
   loading="lazy"
 />
@@ -83,13 +86,13 @@ Intlayer оптимізовано для ідеальної роботи з Reac
 
 <Accordion header="Агент AI">
 
-Спільне розміщення вмісту **зменшує контекст, необхідний** для великих мовних моделей (LLM). Intlayer також постачається з набором інструментів, наприклад **CLI** для перевірки відсутніх перекладів,**[LSP](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/lsp.md)**, **[MCP](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/mcp_server.md)** і **[навички агента](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/agent_skills.md)**, щоб зробити роботу розробника (DX) ще зручнішою для агентів ШІ.
+Спільне розміщення вмісту **зменшує контекст, необхідний** для великих мовних моделей (LLM). Intlayer також постачається з набором інструментів, наприклад **CLI** для перевірки відсутніх перекладів, **[LSP](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/lsp.md)**, **[MCP](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/mcp_server.md)** і **[навички агента](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/agent_skills.md)**, щоб зробити роботу розробника (DX) ще зручнішою для агентів ШІ.
 
 </Accordion>
 
 <Accordion header="Автоматизація">
 
-Використовуйте автоматизацію для перекладу в конвеєрі CI/CD за допомогою LLM за вашим вибором за рахунок вашого постачальника штучного інтелекту. Intlayer також пропонує **компілятор** для автоматизації екстракція вмісту, а також [веб-платформу](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_CMS.md), щоб допомогти **перекладати у фоновому режимі**.
+Використовуйте автоматизацію для перекладу в конвеєрі CI/CD за допомогою LLM за вашим вибором за рахунок вашого постачальника штучного інтелекту. Intlayer також пропонує **компілятор** для автоматизації екстракції вмісту, а також [веб-платформу](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_CMS.md), щоб допомогти **перекладати у фоновому режимі**.
 
 </Accordion>
 
@@ -121,72 +124,43 @@ Intlayer оптимізовано для ідеальної роботи з Reac
 Зі свого проекту React Native встановіть такі пакети:
 
 ```bash packageManager="npm"
-npm встановити intlayer react-intlayer
-npm install --save-dev react-native-intlayer
-npx intlayer ініціал
+npx intlayer@canary init --interactive    # v9
+# npx intlayer init                       # v8
 ```
 
 ```bash packageManager="pnpm"
-pnpm add intlayer react-intlayer
-pnpm add --save-dev react-native-intlayer
-pnpm intlayer ініціал
+pnpm dlx intlayer@canary init --interactive   # v9
+# pnpm dlx intlayer init                      # v8
 ```
 
-```bash packageManager="пряжа"
-пряжа add intlayer react-intlayer
-yarn add --save-dev react-native-intlayer
-yarn intlayer ініц
+```bash packageManager="yarn"
+yarn dlx intlayer@canary init --interactive   # v9
+# yarn dlx intlayer init                      # v8
 ```
 
-```bash packageManager="булочка"
-bun add intlayer react-intlayer
-bun add --dev react-native-intlayer
-bun x intlayer init
+```bash packageManager="bun"
+bunx intlayer@canary init --interactive   # v9
+# bunx intlayer init                      # v8
 ```
 
-### Пакети
+> Прапорець `--interactive` є необов'язковим. Використовуйте `intlayer-cli init`, якщо ви є ШІ-агентом.
 
-- **внутрішній шар**  
-  Основний набір інструментів i18n для налаштування, вмісту словника, генерації типів і команд CLI.
-
-- **react-intlayer**  
-  Інтеграція React, яка надає постачальників контексту та хуки React, які ви використовуватимете в React Native для отримання та перемикання локалей.
-
-- **react-native-intlayer**  
-  Інтеграція React Native, яка надає плагін Metro для інтеграції Intlayer із React Native bundler.
-
----
-
-</Step>
-
-<Step number={2} title="Встановіть залежності">
-
-Перегляньте [шаблон застосунку](https://github.com/aymericzip/intlayer-react-native-template) на GitHub.
-
-У вашому проекті React Native встановіть такі пакети:
+> Ця команда визначить ваше середовище та встановить необхідні пакети. Наприклад:
 
 ```bash packageManager="npm"
-npm install intlayer react-intlayer
-npm install --save-dev react-native-intlayer
-npx intlayer init
+npm install intlayer react-native-intlayer
 ```
 
 ```bash packageManager="pnpm"
-pnpm add intlayer react-intlayer
-pnpm add --save-dev react-native-intlayer
-pnpm intlayer init
+pnpm add intlayer react-native-intlayer
 ```
 
 ```bash packageManager="yarn"
-yarn add intlayer react-intlayer
-yarn add --save-dev react-native-intlayer
-yarn intlayer init
+yarn add intlayer react-native-intlayer
 ```
 
 ```bash packageManager="bun"
-bun add intlayer react-intlayer
-bun add --dev react-native-intlayer
-bun x intlayer init
+bun add intlayer react-native-intlayer
 ```
 
 ### Пакети
@@ -194,17 +168,14 @@ bun x intlayer init
 - **intlayer**  
   Основний i18n-набір інструментів для конфігурації, вмісту словників, генерації типів та команд CLI.
 
-- **react-intlayer**  
-  Інтеграція для React, яка надає провайдери контексту та React hooks, які ви використовуватимете в React Native для отримання та перемикання локалей.
-
 - **react-native-intlayer**  
-  Інтеграція для React Native, яка забезпечує плагін Metro для інтеграції Intlayer з бандлером React Native.
+  Інтеграція для React Native, яка надає провайдери контексту та React hooks для отримання та перемикання локалей, поліфіли React Native, а також плагін Metro для інтеграції Intlayer з бандлером React Native. Він реекспортує все з `react-intlayer`, тому у застосунку React Native достатньо лише цього одного пакету.
 
 ---
 
 </Step>
 
-<Step number={3} title="Створіть конфігурацію Intlayer">
+<Step number={2} title="Створіть конфігурацію Intlayer">
 
 У корені вашого проєкту (або в будь-якому зручному місці) створіть файл **Intlayer config**. Він може виглядати так:
 
@@ -232,15 +203,15 @@ export default config;
 У цій конфігурації ви можете:
 
 - Налаштувати ваш **список підтримуваних локалей**.
-- Встановіть локаль за **замовчуванням**.
+- Встановити локаль за **замовчуванням**.
 - Пізніше ви зможете додати більш просунуті опції (наприклад, логи, користувацькі директорії контенту тощо).
 - Див. [документацію конфігурації Intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/configuration.md) для детальнішої інформації.
 
 </Step>
 
-<Step number={4} title="Додайте плагін Metro">
+<Step number={3} title="Додайте плагін Metro">
 
-Metro, це бандлер для React Native. Він є бандлером за замовчуванням для проєктів React Native, створених за допомогою команди `react-native init`. Щоб використовувати Intlayer з Metro, потрібно додати плагін у файл `metro.config.js`:
+Metro — це бандлер для React Native. Він є бандлером за замовчуванням для проєктів React Native, створених за допомогою команди `react-native init`. Щоб використовувати Intlayer з Metro, потрібно додати плагін у файл `metro.config.js`:
 
 ```js fileName="metro.config.js"
 const { getDefaultConfig } = require("expo/metro-config");
@@ -253,16 +224,16 @@ module.exports = (async () => {
 })();
 ```
 
-> Примітка: `configMetroIntlayer`, це функція, яка повертає проміс. Використовуйте `configMetroIntlayerSync`, якщо хочете виконувати це синхронно, або уникайте IFFE (Immediately Invoked Function Expression).
+> Примітка: `configMetroIntlayer` — це функція, яка повертає проміс. Використовуйте `configMetroIntlayerSync`, якщо хочете виконувати це синхронно, або уникайте IIFE (Immediately Invoked Function Expression).
 > Примітка: `configMetroIntlayerSync` не дозволяє будувати словники intlayer під час запуску сервера
 
 </Step>
 
-<Step number={5} title="Додайте провайдер Intlayer">
+<Step number={4} title="Додайте провайдер Intlayer">
 
-Щоб синхронізувати мову користувача по всьому застосунку, потрібно обгорнути кореневий компонент компонентом `IntlayerProvider` з `react-intlayer-native`.
+Щоб синхронізувати мову користувача по всьому застосунку, потрібно обгорнути кореневий компонент компонентом `IntlayerProvider` з `react-native-intlayer`.
 
-> Переконайтеся, що використовуєте провайдер з `react-native-intlayer`, а не з `react-intlayer`. Експорт з `react-native-intlayer` включає поліфіли для Web API.
+> Завжди імпортуйте з `react-native-intlayer`. Його `IntlayerProvider` включає поліфіли для Web API, які використовує Intlayer, і пакет реекспортує всі хуки та утиліти з `react-intlayer`.
 
 Також потрібно додати функцію `intlayerPolyfill` у ваш файл `index.js`, щоб забезпечити правильну роботу Intlayer.
 
@@ -289,11 +260,13 @@ export default RootLayout;
 
 </Step>
 
-<Step number={6} title="Оголосіть свій контент">
+<Step number={5} title="Оголосіть свій контент">
 
 Створіть файли **декларації контенту** у будь-якому місці вашого проєкту (зазвичай у `src/`), використовуючи будь-який з форматів розширень, які підтримує Intlayer:
 
 - `.content.json`
+- `.content.jsonc`
+- `.content.json5`
 - `.content.ts`
 - `.content.tsx`
 - `.content.js`
@@ -301,9 +274,20 @@ export default RootLayout;
 - `.content.mjs`
 - `.content.mjx`
 - `.content.cjs`
-- `.content.cjx`
+- `.content.md`
+- `.content.mdx`
+- `.content.yaml`
+- `.content.yml`
 - тощо.
 
+> **Expo Router (веб): тримайте файли `.content.*` поза каталогом `app/`.** Expo Router розглядає кожен файл JavaScript/TypeScript всередині `app/` як маршрут. У вебверсії пошук маршрутів сканує файлову систему безпосередньо і **не** враховує `resolver.blockList` від Metro, тому розташований поруч `*.content.ts` реєструється як маршрут. Файл, такий як `app/(tabs)/_layout.content.ts`, навіть аналізується як макет (частина `.content` читається як суфікс платформи), що конфліктує зі справжнім `_layout.tsx` і викликає помилку:
+>
+> ```
+> The layouts "./(tabs)/_layout.content.ts" and "./(tabs)/_layout.tsx" conflict on the route "/(tabs)/_layout.content". Remove or rename one of these files.
+> ```
+>
+> Розміщуйте свої оголошення в каталозі поза межами `app/` (наприклад, `content/` або `src/content/`). Intlayer виявляє файли `.content.*` будь-де в проєкті, а словники посилаються за їхнім `key`, тому жодних змін імпорту не потрібно. У нативних програмах це не обов'язково (`blockList` від Metro вже приховує їх), але використання каталогу поза `app/` забезпечує роботу обох платформ.
+
 Приклад (TypeScript із TSX-нодами для React Native):
 
 ```tsx fileName="src/app.content.tsx" contentDeclarationFormat={["typescript", "esm", "commonjs"]}
@@ -354,7 +338,7 @@ export default homeScreenContent;
 
 </Step>
 
-<Step number={7} title="Використання Intlayer у ваших компонентах">
+<Step number={6} title="Використання Intlayer у ваших компонентах">
 
 Використовуйте хук `useIntlayer` у дочірніх компонентах, щоб отримувати локалізований контент.
 
@@ -362,7 +346,7 @@ export default homeScreenContent;
 
 ```tsx fileName="app/(tabs)/index.tsx" codeFormat={["typescript", "esm"]}
 import { Image, StyleSheet, Platform } from "react-native";
-import { useIntlayer } from "react-intlayer";
+import { useIntlayer } from "react-native-intlayer";
 import { HelloWave } from "@/components/HelloWave";
 import ParallaxScrollView from "@/components/ParallaxScrollView";
 import { ThemedText } from "@/components/ThemedText";
@@ -372,8 +356,6 @@ import { type FC } from "react";
 const HomeScreen = (): FC => {
   const { title, steps } = useIntlayer("home-screen");
 
-> Якщо ваш застосунок уже існує, ви можете скористатися [Intlayer Compiler](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/compiler.md) у поєднанні з [командой extract](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/cli/extract.md), щоб перетворити тисячі компонентів за одну секунду.
-
   return (
     <ParallaxScrollView
       headerBackgroundColor={{ light: "#A1CEDC", dark: "#1D3D47" }}
@@ -405,11 +387,13 @@ export default HomeScreen;
 
 > Коли ви використовуєте `content.someKey` у властивостях, які очікують рядок (наприклад, `title` кнопки або `children` компонента `Text`), **викликайте `content.someKey.value`**, щоб отримати фактичний рядок.
 
+> Якщо ваш застосунок уже існує, ви можете скористатися [Intlayer Compiler](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/compiler.md) у поєднанні з [командою extract](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/cli/extract.md), щоб перетворити тисячі компонентів за одну секунду.
+
 ---
 
 </Step>
 
-<Step number={8} title="Змінити локаль додатку">
+<Step number={7} title="Змінити локаль додатку" isOptional={true}>
 
 Щоб перемикати локалі зсередини ваших компонентів, ви можете використовувати метод `setLocale` хука `useLocale`:
 
@@ -417,7 +401,7 @@ export default HomeScreen;
 import { type FC } from "react";
 import { View, Text, TouchableOpacity, StyleSheet } from "react-native";
 import { getLocaleName } from "intlayer";
-import { useLocale } from "react-intlayer";
+import { useLocale } from "react-native-intlayer";
 
 export const LocaleSwitcher: FC = () => {
   const { setLocale, availableLocales } = useLocale();
@@ -484,17 +468,17 @@ Intlayer генерує визначення типів у прихованій
 
 Це дозволяє такі можливості, як:
 
-- **Autocompletion** для ключів вашого словника.
-- **Type checking**, що попереджає, якщо ви звертаєтеся до неіснуючого ключа або є невідповідність типів.
+- **Автодоповнення** для ключів вашого словника.
+- **Перевірка типів**, що попереджає, якщо ви звертаєтеся до неіснуючого ключа або є невідповідність типів.
 
 ---
 
-## Git Configuration
+## Конфігурація Git
 
 Щоб уникнути коміту автоматично згенерованих Intlayer файлів, додайте наступне до вашого `.gitignore`:
 
 ```bash
-#  Ігнорувати файли, згенеровані Intlayer
+# Ігнорувати файли, згенеровані Intlayer
 .intlayer
 ```
 
@@ -508,10 +492,10 @@ Intlayer генерує визначення типів у прихованій
 
 Це розширення надає:
 
-- **Autocompletion** для ключів перекладу.
-- **Real-time error detection** для відсутніх перекладів.
-- **Inline previews** перекладеного вмісту.
-- **Quick actions** для простого створення та оновлення перекладів.
+- **Автодоповнення** для ключів перекладу.
+- **Виявлення помилок у реальному часі** для відсутніх перекладів.
+- **Вбудований перегляд** перекладеного вмісту.
+- **Швидкі дії** для простого створення та оновлення перекладів.
 
 Для детальнішого опису використання розширення зверніться до [документації Intlayer VS Code Extension](https://intlayer.org/doc/vs-code-extension).
 
@@ -519,9 +503,9 @@ Intlayer генерує визначення типів у прихованій
 
 ## Додаткові ресурси
 
-- **Visual Editor**: Використовуйте [Intlayer Visual Editor](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/intlayer_visual_editor.md) для візуального керування перекладами.
-- **CMS Integration**: Ви також можете винести та отримувати вміст вашого словника з [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/intlayer_CMS.md).
-- **CLI Commands**: Ознайомтеся з [Intlayer CLI](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/cli/index.md) для завдань, таких як **extracting translations** або **checking missing keys**.
+- **Візуальний редактор**: Використовуйте [Intlayer Visual Editor](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/intlayer_visual_editor.md) для візуального керування перекладами.
+- **Інтеграція з CMS**: Ви також можете винести та отримувати вміст вашого словника з [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/intlayer_CMS.md).
+- **Команди CLI**: Ознайомтеся з [Intlayer CLI](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/cli/index.md) для завдань, таких як **вилучення перекладів** або **перевірка відсутніх ключів**.
 
 Насолоджуйтесь створенням ваших додатків на **React Native** з повноцінною i18n за допомогою **Intlayer**!
 
@@ -531,13 +515,13 @@ Intlayer генерує визначення типів у прихованій
 
 React Native може бути менш стабільним, ніж React для Web, тому приділяйте особливу увагу узгодженню версій.
 
-Intlayer в першу чергу орієнтований на Web Intl API; на React Native потрібно підключити відповідні polyfills.
+Intlayer в першу чергу орієнтований на Web Intl API; на React Native потрібно підключити відповідні поліфіли.
 
 Контрольний список:
 
-- Використовуйте останні версії `intlayer`, `react-intlayer` та `react-native-intlayer`.
-- Увімкніть Intlayer polyfill.
-- Якщо ви використовуєте `getLocaleName` або інші утиліти на базі Intl API, імпортуйте ці polyfills на ранньому етапі (наприклад, в `index.js` або `App.tsx`):
+- Використовуйте останні версії `intlayer` та `react-native-intlayer`.
+- Увімкніть Intlayer поліфіл.
+- Якщо ви використовуєте `getLocaleName` або інші утиліти на базі Intl API, імпортуйте ці поліфіли на ранньому етапі (наприклад, в `index.js` або `App.tsx`):
 
 ```ts
 import "intl";

package/docs/uk/intlayer_with_react_router_v7.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2025-09-04
-updatedAt: 2026-05-31
+updatedAt: 2026-06-23
 title: "React Router v7 i18n - Повний посібник з перекладу вашого застосунку"
 description: "Більше ніякого i18next. Посібник 2026 зі створення багатомовного (i18n) застосунку React Router v7. Перекладайте за допомогою ШІ-агентів та оптимізуйте розмір бандлу, SEO та продуктивність."
 keywords:
@@ -108,28 +108,48 @@ Intlayer оптимізовано для ідеальної роботи з Reac
 
 Встановіть необхідні пакети, використовуючи ваш улюблений package manager:
 
+```bash packageManager="npm"
+npx intlayer@canary init --interactive    # v9
+# npx intlayer init                       # v8
+```
+
+```bash packageManager="pnpm"
+pnpm dlx intlayer@canary init --interactive   # v9
+# pnpm dlx intlayer init                      # v8
+```
+
+```bash packageManager="yarn"
+yarn dlx intlayer@canary init --interactive   # v9
+# yarn dlx intlayer init                      # v8
+```
+
+```bash packageManager="bun"
+bunx intlayer@canary init --interactive   # v9
+# bunx intlayer init                      # v8
+```
+
+> прапорець `--interactive` не є обов'язковим. Використовуйте `intlayer-cli init`, якщо ви є ШІ-агентом.
+
+> Ця команда виявить ваше середовище та встановить необхідні пакети. Наприклад:
+
 ```bash packageManager="npm"
 npm install intlayer react-intlayer
 npm install vite-intlayer --save-dev
-npx intlayer init
 ```
 
 ```bash packageManager="pnpm"
 pnpm add intlayer react-intlayer
 pnpm add vite-intlayer --save-dev
-pnpm intlayer init
 ```
 
 ```bash packageManager="yarn"
 yarn add intlayer react-intlayer
 yarn add vite-intlayer --save-dev
-yarn intlayer init
 ```
 
 ```bash packageManager="bun"
 bun add intlayer react-intlayer
 bun add vite-intlayer --dev
-bun x intlayer init
 ```
 
 - **intlayer**
@@ -154,7 +174,7 @@ bun x intlayer init
 
 <Tabs defaultTab="video">
   <Tab label="Відео" value="video">
-  
+
 <iframe title="Як перекласти ваш застосунок React Router v7 за допомогою Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/dS9L7uJeak4?autoplay=0&amp;origin=https://intlayer.org&amp;controls=0&amp;rel=1"/>
 
   </Tab>
@@ -622,6 +642,8 @@ bun x intlayer extract
  </Tab>
  <Tab value='Компілятор Babel'>
 
+> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
+
 Оновіть свій `vite.config.ts`, щоб включити плагін `intlayerCompiler`:
 
 ```ts fileName="vite.config.ts"
@@ -631,7 +653,7 @@ import { intlayer, intlayerCompiler } from "vite-intlayer";
 export default defineConfig({
   plugins: [
     intlayer(),
-    intlayerCompiler(), // Додає плагін компілятора
+    intlayerCompiler(), // Adds the compiler plugin
   ],
 });
 ```
@@ -715,100 +737,6 @@ To go further, you can implement the [visual editor](https://github.com/aymericz
 
 ---
 
-## Documentation References
-
-- [Intlayer Documentation](https://intlayer.org)
-- [React Router v7 Documentation](https://reactrouter.com/)
-- [useIntlayer hook](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/packages/react-intlayer/useIntlayer.md)
-- [useLocale hook](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/packages/react-intlayer/useLocale.md)
-- [Content Declaration](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/dictionary/content_file.md)
-- [Configuration](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/configuration.md)
-
-This comprehensive guide provides everything you need to integrate Intlayer with React Router v7 for a fully internationalized application with locale-aware routing and TypeScript support.
-
-<Steps>
-
-<Step number={11} title="Додати middleware">
-
-Ви також можете використовувати `intlayerProxy` для додавання маршрутизації на серверній стороні у ваш застосунок. Цей плагін автоматично визначає поточну locale на основі URL і встановлює відповідний cookie для locale. Якщо locale не вказано, плагін визначить найбільш підходящу locale на основі мовних налаштувань браузера користувача. Якщо ж жодну locale не буде виявлено, відбудеться перенаправлення на локаль за замовчуванням.
-
-> Зауважте, що для використання `intlayerProxy` у production потрібно перемістити пакет `vite-intlayer` з `devDependencies` до `dependencies`.
-
-```typescript {3,7} fileName="vite.config.ts"
-import { defineConfig } from "vite";
-import react from "@vitejs/plugin-react-swc";
-import { intlayer, intlayerProxy } from "vite-intlayer";
-
-// https://vitejs.dev/config/
-export default defineConfig({
-  plugins: [
-    intlayerProxy(), // should be placed first
-    react(),
-    intlayer(),
-  ],
-});
-```
-
----
-
-</Step>
-
-</Steps>
-
-## Налаштування TypeScript
-
-Intlayer використовує module augmentation, щоб отримати переваги TypeScript і зробити вашу codebase надійнішою.
-
-Переконайтеся, що ваша конфігурація TypeScript включає автогенеровані типи:
-
-```json5 fileName="tsconfig.json"
-{
-  // ... ваші існуючі налаштування
-  include: [
-    // ... ваші існуючі includes
-    ".intlayer/**/*.ts", // Включити автогенеровані типи
-  ],
-}
-```
-
----
-
-## Конфігурація Git
-
-Рекомендується ігнорувати файли, згенеровані Intlayer. Це дозволить уникнути їх додавання до вашого репозиторію Git.
-
-Для цього ви можете додати наступні інструкції до файлу `.gitignore`:
-
-```plaintext fileName=".gitignore"
-# Ігнорувати файли, згенеровані Intlayer
-.intlayer
-```
-
----
-
-## Розширення VS Code
-
-Щоб покращити досвід розробки з Intlayer, ви можете встановити офіційне розширення **Intlayer VS Code Extension**.
-
-[Встановити з VS Code Marketplace](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
-
-Це розширення надає:
-
-- **Автодоповнення** для ключів перекладу.
-- **Виявлення помилок у режимі реального часу** для відсутніх перекладів.
-- **Вбудований перегляд** перекладеного вмісту.
-- **Швидкі дії** для простого створення та оновлення перекладів.
-
-Для отримання детальнішої інформації про використання розширення див. [документацію Intlayer VS Code Extension](https://intlayer.org/doc/vs-code-extension).
-
----
-
-## Подальші кроки
-
-Щоб рухатися далі, ви можете реалізувати [візуальний редактор](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/intlayer_visual_editor.md) або винести ваш контент, використовуючи [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/uk/intlayer_CMS.md).
-
----
-
 ## Посилання на документацію
 
 - [Документація Intlayer](https://intlayer.org)