@intlayer/docs 7.3.0 → 7.3.2-canary.0

package/docs/ru/compiler.md

@@ -0,0 +1,133 @@
+---
+createdAt: 2025-09-09
+updatedAt: 2025-09-09
+title: Intlayer Compiler | Автоматизированное извлечение контента для i18n
+description: Автоматизируйте процесс интернационализации с помощью Intlayer Compiler. Извлекайте контент напрямую из ваших компонентов для более быстрого и эффективного i18n в Vite, Next.js и других.
+keywords:
+  - Intlayer
+  - Compiler
+  - Интернационализация
+  - i18n
+  - Автоматизация
+  - Извлечение
+  - Скорость
+  - Vite
+  - Next.js
+  - React
+  - Vue
+  - Svelte
+slugs:
+  - doc
+  - compiler
+history:
+  - version: 7.3.1
+    date: 2025-11-27
+    changes: Выпуск Compiler
+---
+
+# Intlayer Compiler | Автоматизированное извлечение контента для i18n
+
+## Что такое Intlayer Compiler?
+
+**Intlayer Compiler** — это мощный инструмент, разработанный для автоматизации процесса интернационализации (i18n) в ваших приложениях. Он сканирует ваш исходный код (JSX, TSX, Vue, Svelte) на предмет объявлений контента, извлекает их и автоматически генерирует необходимые файлы словарей. Это позволяет вам хранить контент вместе с компонентами, в то время как Intlayer управляет и синхронизирует ваши словари.
+
+## Почему стоит использовать Intlayer Compiler?
+
+- **Автоматизация**: устраняет необходимость вручную копировать и вставлять контент в словари.
+- **Скорость**: оптимизированное извлечение контента обеспечивает быструю сборку.
+- **Опыт разработчика**: храните объявления контента прямо там, где они используются, что улучшает поддерживаемость.
+- **Живые обновления**: поддержка Hot Module Replacement (HMR) для мгновенной обратной связи во время разработки.
+
+См. блог-пост [Compiler vs. Declarative i18n](https://github.com/aymericzip/intlayer/blob/main/docs/blog/ru/compiler_vs_declarative_i18n.md) для более глубокого сравнения.
+
+## Почему не использовать Intlayer Compiler?
+
+Хотя компилятор предлагает отличный опыт "работает из коробки", он также вводит некоторые компромиссы, о которых вы должны знать:
+
+- **Эвристическая неоднозначность**: Компилятор должен угадывать, что является пользовательским контентом, а что — логикой приложения (например, `className="active"`, коды состояния, ID продуктов). В сложных кодовых базах это может привести к ложным срабатываниям или пропущенным строкам, которые требуют ручных аннотаций и исключений.
+- **Только статическое извлечение**: Извлечение на основе компилятора полагается на статический анализ. Строки, которые существуют только во время выполнения (коды ошибок API, поля CMS и т.д.), не могут быть обнаружены или переведены компилятором в одиночку, поэтому вам все еще нужна дополнительная стратегия i18n времени выполнения.
+
+Для более глубокого архитектурного сравнения см. блог-пост [Compiler vs. Declarative i18n](https://github.com/aymericzip/intlayer/blob/main/docs/blog/ru/compiler_vs_declarative_i18n.md).
+
+В качестве альтернативы, для автоматизации процесса i18n при сохранении полного контроля над контентом, Intlayer также предоставляет команду автоматического извлечения `intlayer transform` (см. [документацию CLI](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ru/cli/transform.md)) или команду `Intlayer: extract content to Dictionary` из расширения Intlayer VS Code (см. [документацию расширения VS Code](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ru/vs_code_extension.md)).
+
+## Использование
+
+### Vite
+
+Для приложений на базе Vite (React, Vue, Svelte и др.) самый простой способ использовать компилятор — через плагин `vite-intlayer`.
+
+#### Установка
+
+```bash
+npm install vite-intlayer
+```
+
+#### Конфигурация
+
+Обновите ваш `vite.config.ts`, чтобы включить плагин `intlayerCompiler`:
+
+```ts fileName="vite.config.ts"
+import { defineConfig } from "vite";
+import { intlayer, intlayerCompiler } from "vite-intlayer";
+
+export default defineConfig({
+  plugins: [
+    intlayer(),
+    intlayerCompiler(), // Добавляет плагин компилятора
+  ],
+});
+```
+
+#### Поддержка фреймворков
+
+Плагин Vite автоматически обнаруживает и обрабатывает различные типы файлов:
+
+- **React / JSX / TSX**: Обрабатывается нативно.
+- **Vue**: Требуется `@intlayer/vue-compiler`.
+- **Svelte**: Требуется `@intlayer/svelte-compiler`.
+
+Убедитесь, что установлен соответствующий пакет компилятора для вашего фреймворка:
+
+```bash
+# Для Vue
+npm install @intlayer/vue-compiler
+
+# Для Svelte
+npm install @intlayer/svelte-compiler
+```
+
+### Next.js (Babel)
+
+Для Next.js или других приложений на основе Webpack с использованием Babel вы можете настроить компилятор с помощью плагина `@intlayer/babel`.
+
+#### Установка
+
+```bash
+npm install @intlayer/babel
+```
+
+#### Конфигурация
+
+Обновите ваш файл `babel.config.js` (или `babel.config.json`), чтобы включить плагин извлечения. Мы предоставляем вспомогательную функцию `getExtractPluginOptions` для автоматической загрузки вашей конфигурации Intlayer.
+
+```js fileName="babel.config.js"
+const {
+  intlayerExtractBabelPlugin,
+  intlayerOptimizeBabelPlugin,
+  getExtractPluginOptions,
+  getOptimizePluginOptions,
+} = require("@intlayer/babel");
+
+module.exports = {
+  presets: ["next/babel"],
+  plugins: [
+    // Extract content from components into dictionaries
+    [intlayerExtractBabelPlugin, getExtractPluginOptions()],
+    // Optimize imports by replacing useIntlayer with direct dictionary imports
+    [intlayerOptimizeBabelPlugin, getOptimizePluginOptions()],
+  ],
+};
+```
+
+Эта конфигурация гарантирует, что контент, объявленный в ваших компонентах, автоматически извлекается и используется для генерации словарей во время процесса сборки.

package/docs/ru/vs_code_extension.md

@@ -42,6 +42,10 @@ history:
 
 ## Возможности
 
+![Извлечение контента](https://github.com/aymericzip/intlayer-vs-code-extension/blob/master/assets/vscode_extention_extract_content.gif?raw=true)
+
+- **Извлечение контента** – Извлекайте контент из ваших компонентов React / Vue / Svelte
+
 ![Заполнение словарей](https://github.com/aymericzip/intlayer-vs-code-extension/blob/master/assets/vscode_extention_fill_active_dictionary.gif?raw=true)
 
 - **Мгновенная навигация** – Быстрый переход к нужному файлу контента при клике на ключ `useIntlayer`.

package/docs/tr/bundle_optimization.md

@@ -0,0 +1,184 @@
+---
+createdAt: 2025-11-25
+updatedAt: 2025-11-25
+title: i18n Paket Boyutu ve Performansını Optimize Etme
+description: Uluslararasılaştırma (i18n) içeriğini optimize ederek uygulama paket boyutunu azaltın. Intlayer ile sözlüklerde tree shaking ve lazy loading nasıl kullanılır öğrenin.
+keywords:
+  - Paket Optimizasyonu
+  - İçerik Otomasyonu
+  - Dinamik İçerik
+  - Intlayer
+  - Next.js
+  - JavaScript
+  - React
+slugs:
+  - doc
+  - concept
+  - bundle-optimization
+history:
+  - version: 6.0.0
+    date: 2025-11-25
+    changes: Başlangıç geçmişi
+---
+
+# i18n Paket Boyutu ve Performansını Optimize Etme
+
+JSON dosyalarına dayanan geleneksel i18n çözümlerinde en yaygın zorluklardan biri içerik boyutunu yönetmektir. Geliştiriciler içeriği manuel olarak namespace'lere ayırmazsa, kullanıcılar genellikle tek bir sayfayı görüntülemek için her sayfanın ve potansiyel olarak her dilin çevirilerini indirirler.
+
+Örneğin, 10 sayfadan oluşan ve 10 dile çevrilmiş bir uygulamada, kullanıcı yalnızca **bir** sayfaya (mevcut dildeki mevcut sayfa) ihtiyaç duysa bile, 100 sayfanın içeriğini indirmek zorunda kalabilir. Bu durum, gereksiz bant genişliği kullanımına ve daha yavaş yükleme sürelerine yol açar.
+
+> Bunu tespit etmek için `rollup-plugin-visualizer` (vite), `@next/bundle-analyzer` (next.js) veya `webpack-bundle-analyzer` (React CRA / Angular / vb.) gibi bundle analizörleri kullanabilirsiniz.
+
+**Intlayer bu sorunu derleme zamanı optimizasyonu ile çözer.** Kodunuzu analiz ederek her bileşen için hangi sözlüklerin gerçekten kullanıldığını tespit eder ve yalnızca gerekli içeriği paketinizin içine yeniden enjekte eder.
+
+## İçindekiler
+
+<TOC />
+
+## Nasıl Çalışır
+
+Intlayer, **bileşen başına yaklaşım** kullanır. Küresel JSON dosyalarının aksine, içeriğiniz bileşenlerinizin yanında veya içinde tanımlanır. Derleme sürecinde Intlayer:
+
+1.  `useIntlayer` çağrılarını bulmak için kodunuzu **analiz eder**.
+2.  İlgili sözlük içeriğini **oluşturur**.
+3.  `useIntlayer` çağrısını yapılandırmanıza bağlı olarak optimize edilmiş kodla **değiştirir**.
+
+Bu, şunları garanti eder:
+
+- Bir bileşen içe aktarılmamışsa, içeriği pakete dahil edilmez (Ölü Kod Eliminasyonu).
+- Bir bileşen tembel yükleniyorsa, içeriği de tembel yüklenir.
+
+## Platforma Göre Kurulum
+
+### Next.js
+
+Next.js, dönüşümü yönetmek için `@intlayer/swc` eklentisini gerektirir, çünkü Next.js derlemeler için SWC kullanır.
+
+> Bu eklenti varsayılan olarak yüklüdür çünkü SWC eklentileri Next.js için hâlâ deneysel durumdadır. Gelecekte değişebilir.
+
+### Vite
+
+Vite, `vite-intlayer` bağımlılığı olarak dahil edilen `@intlayer/babel` eklentisini kullanır. Optimizasyon varsayılan olarak etkinleştirilmiştir.
+
+### Webpack
+
+Webpack üzerinde Intlayer ile paket optimizasyonunu etkinleştirmek için uygun Babel (`@intlayer/babel`) veya SWC (`@intlayer/swc`) eklentisini yükleyip yapılandırmanız gerekir.
+
+### Expo / Lynx
+
+Bu platform için paket optimizasyonu **henüz mevcut değildir**. Destek gelecekteki bir sürümde eklenecektir.
+
+## Yapılandırma
+
+Intlayer'ın paket optimizasyonunu `intlayer.config.ts` dosyanızdaki `build` özelliği aracılığıyla kontrol edebilirsiniz.
+
+```typescript fileName="intlayer.config.ts"
+import { Locales, type IntlayerConfig } from "intlayer";
+
+const config: IntlayerConfig = {
+  internationalization: {
+    locales: [Locales.ENGLISH, Locales.FRENCH],
+    defaultLocale: Locales.ENGLISH,
+  },
+  build: {
+    optimize: true,
+    importMode: "static", // veya 'dynamic'
+    traversePattern: ["**/*.{js,ts,mjs,cjs,jsx,tsx}", "!**/node_modules/**"],
+  },
+};
+
+export default config;
+```
+
+> `optimize` için varsayılan seçeneğin korunması çoğu durumda önerilir.
+
+> Daha fazla detay için doküman yapılandırmasına bakınız: [Configuration](https://github.com/aymericzip/intlayer/blob/main/docs/docs/tr/configuration.md)
+
+### Build Seçenekleri
+
+`build` yapılandırma nesnesi altında aşağıdaki seçenekler mevcuttur:
+
+| Özellik               | Tür                             | Varsayılan                      | Açıklama                                                                                                                                                                                                                                             |
+| :-------------------- | :------------------------------ | :------------------------------ | :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| **`optimize`**        | `boolean`                       | `undefined`                     | Derleme optimizasyonunun etkin olup olmadığını kontrol eder. `true` ise, Intlayer sözlük çağrılarını optimize edilmiş enjeksiyonlarla değiştirir. `false` ise optimizasyon devre dışı bırakılır. Üretimde ideal olarak `true` olarak ayarlanmalıdır. |
+| **`importMode`**      | `'static' , 'dynamic' , 'live'` | `'static'`                      | Sözlüklerin nasıl yükleneceğini belirler (detaylar aşağıda).                                                                                                                                                                                         |
+| **`traversePattern`** | `string[]`                      | `['**/*.{js,ts,jsx,tsx}', ...]` | Intlayer'ın optimizasyon için taraması gereken dosyaları tanımlayan glob desenleri. İlgisiz dosyaları hariç tutmak ve derlemeleri hızlandırmak için bunu kullanın.                                                                                   |
+| **`outputFormat`**    | `'esm', 'cjs'`                  | `'esm', 'cjs'`                  | Oluşturulan sözlüklerin çıktı formatını kontrol eder.                                                                                                                                                                                                |
+
+## İçe Aktarım Modları
+
+`importMode` ayarı, sözlük içeriğinin bileşeninize nasıl enjekte edileceğini belirler.
+
+### 1. Statik Mod (`default`)
+
+Statik modda, Intlayer `useIntlayer`'ı `useDictionary` ile değiştirir ve sözlüğü doğrudan JavaScript paketine enjekte eder.
+
+- **Avantajlar:** Anında render (eşzamanlı), hydration sırasında ekstra ağ isteği yok.
+- **Dezavantajlar:** Paket, o belirli bileşen için mevcut **tüm** dillerin çevirilerini içerir.
+- **En uygun:** Tek Sayfa Uygulamaları (SPA).
+
+**Dönüştürülmüş Kod Örneği:**
+
+```tsx
+// Kodunuz
+const content = useIntlayer("my-key");
+
+// Optimize edilmiş kod (Statik)
+const content = useDictionary({
+  key: "my-key",
+  content: {
+    nodeType: "translation",
+    translation: {
+      en: "My title",
+      fr: "Mon titre",
+    },
+  },
+});
+```
+
+### 2. Dinamik Mod
+
+Dinamik modda, Intlayer `useIntlayer`'ı `useDictionaryAsync` ile değiştirir. Bu, `import()` (Suspense benzeri mekanizma) kullanarak mevcut yerel ayar için JSON'u tembel yükler.
+
+- **Avantajlar:** **Yerel düzeyde tree shaking.** İngilizce sürümü görüntüleyen bir kullanıcı sadece İngilizce sözlüğü indirir. Fransızca sözlük asla yüklenmez.
+- **Dezavantajlar:** Hydration sırasında her bileşen için bir ağ isteği (varlık alma) tetikler.
+- **En uygun:** Paket boyutunun kritik olduğu, çok sayıda dili destekleyen büyük metin blokları, makaleler veya uygulamalar için.
+
+**Dönüştürülmüş Kod Örneği:**
+
+```tsx
+// Kodunuz
+const content = useIntlayer("my-key");
+
+// Optimize edilmiş kod (Dinamik)
+const content = useDictionaryAsync({
+  en: () =>
+    import(".intlayer/dynamic_dictionary/my-key/en.json").then(
+      (mod) => mod.default
+    ),
+  fr: () =>
+    import(".intlayer/dynamic_dictionary/my-key/fr.json").then(
+      (mod) => mod.default
+    ),
+});
+```
+
+> `importMode: 'dynamic'` kullanıldığında, tek bir sayfada `useIntlayer` kullanan 100 bileşen varsa, tarayıcı 100 ayrı fetch denemesi yapacaktır. Bu istek "şelalesi"nden kaçınmak için içeriği daha az sayıda `.content` dosyasına (örneğin, sayfa bölümü başına bir sözlük) gruplayın, atom bileşen başına değil.
+
+> Şu anda, `importMode: 'dynamic'` Vue ve Svelte için tam olarak desteklenmemektedir. Bu çerçeveler için ek güncellemelere kadar `importMode: 'static'` kullanılması önerilir.
+
+### 3. Canlı Mod (Live Mode)
+
+Dinamik moda benzer şekilde davranır ancak önce sözlükleri Intlayer Live Sync API'den getirmeye çalışır. Eğer API çağrısı başarısız olursa veya içerik canlı güncellemeler için işaretlenmemişse, dinamik import yöntemine geri döner.
+
+> Daha fazla detay için CMS dokümantasyonuna bakınız: [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/tr/intlayer_CMS.md)
+
+## Özet: Statik vs Dinamik
+
+| Özellik             | Statik Mod                                   | Dinamik Mod                             |
+| :------------------ | :------------------------------------------- | :-------------------------------------- |
+| **JS Paket Boyutu** | Daha büyük (bileşen için tüm dilleri içerir) | En küçük (sadece kod, içerik yok)       |
+| **İlk Yükleme**     | Anında (İçerik pakette)                      | Hafif gecikme (JSON çeker)              |
+| **Ağ İstekleri**    | Ekstra 0 istek                               | Her sözlük için 1 istek                 |
+| **Tree Shaking**    | Bileşen seviyesi                             | Bileşen seviyesi + Dil seviyesi         |
+| **En İyi Kullanım** | UI Bileşenleri, Küçük Uygulamalar            | Çok metin içeren sayfalar, Çoklu Diller |

package/docs/tr/compiler.md

@@ -0,0 +1,133 @@
+---
+createdAt: 2025-09-09
+updatedAt: 2025-09-09
+title: Intlayer Compiler | i18n için Otomatik İçerik Çıkarımı
+description: Uluslararasılaştırma sürecinizi Intlayer Compiler ile otomatikleştirin. İçeriği bileşenlerinizden doğrudan çıkararak Vite, Next.js ve daha fazlasında daha hızlı ve verimli i18n sağlayın.
+keywords:
+  - Intlayer
+  - Compiler
+  - Uluslararasılaştırma
+  - i18n
+  - Otomasyon
+  - Çıkarım
+  - Hız
+  - Vite
+  - Next.js
+  - React
+  - Vue
+  - Svelte
+slugs:
+  - doc
+  - compiler
+history:
+  - version: 7.3.1
+    date: 2025-11-27
+    changes: Compiler Yayınlandı
+---
+
+# Intlayer Compiler | i18n için Otomatik İçerik Çıkarımı
+
+## Intlayer Compiler Nedir?
+
+**Intlayer Compiler**, uygulamalarınızda uluslararasılaştırma (i18n) sürecini otomatikleştirmek için tasarlanmış güçlü bir araçtır. Kaynak kodunuzu (JSX, TSX, Vue, Svelte) içerik bildirimleri için tarar, bunları çıkarır ve gerekli sözlük dosyalarını otomatik olarak oluşturur. Bu sayede içeriğinizi bileşenlerinizle birlikte tutabilirken, Intlayer sözlüklerinizin yönetimi ve senkronizasyonunu üstlenir.
+
+## Neden Intlayer Compiler Kullanmalısınız?
+
+- **Otomasyon**: İçeriğin sözlüklere manuel olarak kopyalanıp yapıştırılmasını ortadan kaldırır.
+- **Hız**: Derleme sürecinizin hızlı kalmasını sağlayan optimize edilmiş içerik çıkarımı.
+- **Geliştirici Deneyimi**: İçerik bildirimlerini kullanıldıkları yerde tutarak bakım kolaylığı sağlar.
+- **Canlı Güncellemeler**: Geliştirme sırasında anlık geri bildirim için Hot Module Replacement (HMR) desteği sağlar.
+
+Daha derin bir karşılaştırma için [Compiler vs. Declarative i18n](https://github.com/aymericzip/intlayer/blob/main/docs/blog/en/compiler_vs_declarative_i18n.md) blog yazısına bakabilirsiniz.
+
+## Neden Intlayer Compiler Kullanmamalısınız?
+
+Derleyici mükemmel bir "hemen çalışır" deneyimi sunarken, aynı zamanda farkında olmanız gereken bazı ödünleşmeler de getirir:
+
+- **Sezgisel belirsizlik**: Derleyici, kullanıcıya yönelik içerik ile uygulama mantığı arasındaki farkı tahmin etmek zorundadır (örneğin, `className="active"`, durum kodları, ürün kimlikleri). Karmaşık kod tabanlarında, bu manuel açıklamalar ve istisnalar gerektiren yanlış pozitifler veya kaçırılan dizelerle sonuçlanabilir.
+- **Yalnızca statik çıkarım**: Derleyici tabanlı çıkarım statik analize dayanır. Yalnızca çalışma zamanında var olan dizeler (API hata kodları, CMS alanları vb.) derleyici tarafından tek başına keşfedilemez veya çevrilemez, bu nedenle hala tamamlayıcı bir çalışma zamanı i18n stratejisine ihtiyacınız vardır.
+
+Daha derin bir mimari karşılaştırma için [Compiler vs. Declarative i18n](https://github.com/aymericzip/intlayer/blob/main/docs/blog/en/compiler_vs_declarative_i18n.md) blog yazısına bakın.
+
+Alternatif olarak, içeriğiniz üzerinde tam kontrolü korurken i18n sürecinizi otomatikleştirmek için, Intlayer ayrıca otomatik çıkarım komutu `intlayer transform` (bkz. [CLI dokümantasyonu](https://github.com/aymericzip/intlayer/blob/main/docs/docs/tr/cli/transform.md)) veya Intlayer VS Code uzantısının `Intlayer: extract content to Dictionary` komutunu (bkz. [VS Code uzantı dokümantasyonu](https://github.com/aymericzip/intlayer/blob/main/docs/docs/tr/vs_code_extension.md)) sağlar.
+
+## Kullanım
+
+### Vite
+
+Vite tabanlı uygulamalar (React, Vue, Svelte, vb.) için derleyiciyi kullanmanın en kolay yolu `vite-intlayer` eklentisidir.
+
+#### Kurulum
+
+```bash
+npm install vite-intlayer
+```
+
+#### Konfigürasyon
+
+`vite.config.ts` dosyanızı `intlayerCompiler` eklentisini içerecek şekilde güncelleyin:
+
+```ts fileName="vite.config.ts"
+import { defineConfig } from "vite";
+import { intlayer, intlayerCompiler } from "vite-intlayer";
+
+export default defineConfig({
+  plugins: [
+    intlayer(),
+    intlayerCompiler(), // Derleyici eklentisini ekler
+  ],
+});
+```
+
+#### Framework Desteği
+
+Vite eklentisi farklı dosya türlerini otomatik olarak algılar ve işler:
+
+- **React / JSX / TSX**: Yerel olarak desteklenir.
+- **Vue**: `@intlayer/vue-compiler` gerektirir.
+- **Svelte**: `@intlayer/svelte-compiler` gerektirir.
+
+Framework'ünüz için uygun derleyici paketini kurduğunuzdan emin olun:
+
+```bash
+# Vue için
+npm install @intlayer/vue-compiler
+
+# Svelte için
+npm install @intlayer/svelte-compiler
+```
+
+### Next.js (Babel)
+
+Next.js veya Babel kullanan diğer Webpack tabanlı uygulamalar için, derleyiciyi `@intlayer/babel` eklentisi ile yapılandırabilirsiniz.
+
+#### Kurulum
+
+```bash
+npm install @intlayer/babel
+```
+
+#### Konfigürasyon
+
+`babel.config.js` (veya `babel.config.json`) dosyanızı, extraction (çıkarma) eklentisini içerecek şekilde güncelleyin. Intlayer yapılandırmanızı otomatik olarak yüklemek için bir yardımcı `getExtractPluginOptions` sağlıyoruz.
+
+```js fileName="babel.config.js"
+const {
+  intlayerExtractBabelPlugin,
+  intlayerOptimizeBabelPlugin,
+  getExtractPluginOptions,
+  getOptimizePluginOptions,
+} = require("@intlayer/babel");
+
+module.exports = {
+  presets: ["next/babel"],
+  plugins: [
+    // Extract content from components into dictionaries
+    [intlayerExtractBabelPlugin, getExtractPluginOptions()],
+    // Optimize imports by replacing useIntlayer with direct dictionary imports
+    [intlayerOptimizeBabelPlugin, getOptimizePluginOptions()],
+  ],
+};
+```
+
+Bu yapılandırma, bileşenlerinizde beyan edilen içeriğin otomatik olarak çıkarılmasını ve derleme süreciniz sırasında sözlüklerin oluşturulmasında kullanılmasını sağlar.

package/docs/tr/how_works_intlayer.md

@@ -142,7 +142,7 @@ Intlayer, çeviri sürecinde belirli bir rolü olan birkaç paketten oluşur. İ
 
 `nuxt-intlayer` paketi, Intlayer sözlüklerini Nuxt uygulamalarında kullanılabilir hale getirmek için bir Nuxt modülü olarak kullanılır. Çeviri ara yazılımı, yönlendirme veya `nuxt.config.js` dosyası konfigürasyonu gibi Intlayer'ı bir Nuxt ortamında çalışacak şekilde yapmak için gerekli özellikleri entegre eder.
 
-### svelte-intlayer (WIP)
+### svelte-intlayer
 
 `svelte-intlayer` paketi, Intlayer sözlüklerini yorumlamak ve Svelte uygulamalarında kullanılabilir hale getirmek için kullanılır.
 

package/docs/tr/vs_code_extension.md

@@ -42,6 +42,10 @@ Eklenti bağlantısı: [https://marketplace.visualstudio.com/items?itemName=Intl
 
 ## Özellikler
 
+![İçerik çıkar](https://github.com/aymericzip/intlayer-vs-code-extension/blob/master/assets/vscode_extention_extract_content.gif?raw=true)
+
+- **İçerik Çıkar** – React / Vue / Svelte bileşenlerinizden içerik çıkarın
+
 ![Sözlükleri doldur](https://github.com/aymericzip/intlayer-vs-code-extension/blob/master/assets/vscode_extention_fill_active_dictionary.gif?raw=true)
 
 - **Anında Gezinme** – `useIntlayer` anahtarına tıkladığınızda doğru içerik dosyasına hızlıca atlayın.