@intlayer/docs 7.0.7 → 7.0.8-canary.0

package/docs/id/roadmap.md

@@ -0,0 +1,362 @@
+---
+createdAt: 2025-03-01
+updatedAt: 2025-06-29
+title: Roadmap
+description: Temukan roadmap Intlayer. Lihat semua fitur yang telah diimplementasikan Intlayer, dan yang direncanakan untuk diimplementasikan.
+keywords:
+  - Roadmap
+  - Intlayer
+  - Internasionalisasi
+  - CMS
+  - Sistem Manajemen Konten
+  - Editor Visual
+slugs:
+  - doc
+  - roadmap
+history:
+  - version: 5.5.10
+    date: 2025-06-30
+    changes: Menambahkan dukungan Preact dan Nuxt, Server MCP, memperbarui CLI
+  - version: 5.5.11
+    date: 2025-06-29
+    changes: Menambahkan perintah `docs`
+  - version: 5.5.10
+    date: 2025-06-29
+    changes: Inisialisasi riwayat
+---
+
+# Intlayer: Ikhtisar Fitur & Roadmap
+
+Intlayer adalah solusi manajemen konten dan internasionalisasi yang dirancang untuk mempermudah cara Anda mendeklarasikan, mengelola, dan memperbarui konten di seluruh aplikasi Anda. Solusi ini menawarkan fitur-fitur kuat seperti deklarasi konten terpusat atau terdistribusi, opsi internasionalisasi yang luas, dukungan Markdown, rendering kondisional, integrasi TypeScript/JavaScript/JSON, dan banyak lagi. Berikut adalah gambaran menyeluruh tentang apa yang saat ini disediakan oleh Intlayer, diikuti dengan fitur-fitur roadmap yang akan datang.
+
+---
+
+## Daftar Isi
+
+<TOC/>
+
+---
+
+## Fitur Saat Ini
+
+### 1. Deklarasi Konten
+
+#### Terpusat atau Terdistribusi
+
+- **Terpusat**: Deklarasikan semua konten Anda dalam satu file besar di dasar aplikasi Anda, mirip dengan i18next, sehingga Anda dapat mengelola semuanya di satu tempat.
+- **Terdistribusi**: Sebagai alternatif, pisahkan konten Anda ke dalam file-file terpisah pada tingkat komponen atau fitur untuk pemeliharaan yang lebih baik. Ini menjaga konten Anda tetap dekat dengan kode yang relevan (komponen, pengujian, Storybook, dll.). Menghapus sebuah komponen memastikan konten terkait juga dihapus, mencegah data sisa yang mengacaukan basis kode Anda.
+
+> Sumber Daya:
+>
+> - [Deklarasi Konten](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/dictionary/content_file.md)
+
+### 2. Internasionalisasi
+
+- Mendukung **230 bahasa dan lokal** (termasuk varian regional seperti Prancis (Perancis), Inggris (Kanada), Inggris (UK), Portugis (Portugal), dll.).
+- Kelola terjemahan untuk semua lokal ini dengan mudah dari satu tempat.
+
+> Sumber Daya:
+>
+> - [Internasionalisasi](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/dictionary/translation.md)
+
+### 3. Dukungan Markdown
+
+- Deklarasikan konten menggunakan **Markdown**, memungkinkan Anda secara otomatis memformat teks dengan paragraf, judul, tautan, dan lainnya.
+- Ideal untuk posting blog, artikel, halaman dokumentasi, atau skenario apa pun yang membutuhkan pemformatan teks kaya.
+
+> Sumber Daya:
+>
+> - [Markdown](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/dictionary/markdown.md)
+
+### 4. Dukungan file eksternal
+
+- Impor konten dari file eksternal dalam format teks, seperti TXT, HTML, JSON, YAML, atau CSV.
+- Gunakan fungsi `file` di Intlayer untuk menyematkan konten file eksternal ke dalam dictionary, memastikan integrasi mulus dengan Intlayer Visual Editor dan CMS.
+- Mendukung pembaruan konten dinamis, artinya ketika file sumber dimodifikasi, konten akan diperbarui secara otomatis di dalam Intlayer.
+- Memungkinkan manajemen konten multibahasa dengan menghubungkan file Markdown spesifik bahasa secara dinamis.
+
+> Sumber Daya:
+>
+> - [Penyisipan Konten File](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/dictionary/file.md)
+
+### 5. Konten Dinamis & Pengambilan Fungsi
+
+Intlayer menyediakan berbagai metode untuk menyisipkan dan mengelola konten dinamis, memastikan fleksibilitas dan adaptabilitas dalam penyampaian konten. Ini mencakup fungsi untuk penyisipan konten dinamis, rendering kondisional, enumerasi, penanaman, dan pengambilan fungsi.
+
+1. Penyisipan Konten Dinamis
+
+   Gunakan fungsi insert untuk mendefinisikan konten dengan placeholder ({{name}}, {{age}}, dll).
+
+   Memungkinkan konten seperti template yang beradaptasi berdasarkan input pengguna, respons API, atau sumber data dinamis lainnya.
+
+   Bekerja dengan mulus dengan konfigurasi TypeScript, ESM, CommonJS, dan JSON.
+
+   Mudah diintegrasikan dengan React Intlayer dan Next Intlayer menggunakan useIntlayer.
+
+2. Rendering Kondisional
+
+   Mendefinisikan konten yang beradaptasi berdasarkan kondisi spesifik pengguna, seperti bahasa atau status autentikasi.
+
+   Menyesuaikan pengalaman personal tanpa menduplikasi konten di beberapa file.
+
+3. Enumerasi & Pluralisasi
+
+   Gunakan fungsi enu untuk mendefinisikan variasi konten berdasarkan nilai numerik, rentang, atau kunci khusus.
+
+   Memastikan pemilihan otomatis frasa yang tepat berdasarkan nilai yang diberikan.
+
+   Mendukung aturan pengurutan, memastikan perilaku yang dapat diprediksi.
+
+4. Nesting & Referensi Sub-Konten
+
+   Gunakan fungsi nest untuk mereferensikan dan menggunakan kembali konten dari kamus lain, mengurangi duplikasi.
+
+   Mendukung manajemen konten yang terstruktur dan hierarkis untuk pemeliharaan yang lebih baik.
+
+5. Pengambilan Fungsi
+
+   Intlayer memungkinkan konten dideklarasikan sebagai fungsi, memungkinkan pengambilan konten secara sinkron dan asinkron.
+
+   Fungsi Sinkron: Konten dihasilkan secara dinamis saat build time.
+
+   Fungsi Asinkron: Mengambil data dari sumber eksternal (misalnya, API, basis data) secara dinamis.
+
+   Integrasi: Bekerja dengan TypeScript, ESM, dan CommonJS tetapi tidak didukung dalam file konten JSON atau remote.
+
+### 6. Format Deklarasi Konten
+
+Intlayer mendukung **TypeScript** (juga JavaScript) dan **JSON** untuk mendeklarasikan konten.
+
+- **TypeScript**:
+  - Memastikan struktur konten Anda benar dan tidak ada terjemahan yang hilang.
+  - Menawarkan mode validasi yang ketat atau lebih fleksibel.
+  - Memungkinkan pengambilan data dinamis dari variabel, fungsi, atau API eksternal.
+
+- **JSON**:
+  - Memudahkan integrasi dengan alat eksternal (seperti editor visual) karena formatnya yang standar.
+
+  > Sumber Daya:
+  >
+  > - [Format Deklarasi Konten](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/dictionary/content_file.md)
+
+### 7. Purging, optimasi bundle, dan impor dinamis
+
+- Intlayer mengintegrasikan plugin `Babel` dan `SWC` untuk mengoptimalkan bundle Anda dan meningkatkan performa. Plugin ini menggantikan impor, sehingga hanya kamus yang digunakan yang diimpor ke dalam bundle.
+- Dengan mengaktifkan opsi ini, Intlayer juga memungkinkan untuk mengimpor konten kamus secara dinamis hanya untuk locale saat ini.
+
+> Sumber Daya:
+>
+> - [Konfigurasi Build](https://intlayer.org/doc/concept/configuration#build-configuration)
+
+---
+
+## Integrasi dengan Framework & Lingkungan
+
+### 1. Next.js
+
+#### a. Komponen Server dan Client
+
+- Menyediakan **pendekatan manajemen konten terpadu** untuk komponen server dan client.
+- Menawarkan konteks bawaan untuk komponen server, mempermudah implementasi dibandingkan solusi lain.
+
+#### b. Metadata, Sitemap, dan robots.txt
+
+- Mengambil dan menyuntikkan konten secara dinamis untuk menghasilkan metadata, sitemap, atau file `robots.txt`.
+
+#### c. Middleware
+
+- Menambahkan middleware untuk **mengalihkan pengguna** ke konten berdasarkan bahasa pilihan mereka.
+
+#### d. Kompatibilitas Turbopack dan Webpack
+
+- Sepenuhnya kompatibel dengan Turbopack Next.js yang baru serta Webpack tradisional.
+
+> Sumber Daya:
+>
+> - [Next.js](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_with_nextjs_15.md)
+
+### 2. Vite
+
+- Serupa dengan Next.js, Anda dapat mengintegrasikan Intlayer dengan Vite dan menggunakan **middleware** untuk mengarahkan pengguna ke konten berdasarkan bahasa pilihan mereka.
+
+> Sumber Daya:
+>
+> - [Vite](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_with_vite+react.md)
+
+### 3. Express
+
+- Mengelola konten dan melakukan internasionalisasi layanan backend yang dibangun dengan Express.
+- Personalisasi email, pesan kesalahan, notifikasi push, dan lainnya dengan teks yang dilokalkan.
+
+> Sumber Daya:
+>
+> - [Express](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_with_express.md)
+
+### 4. React Native
+
+- Integrasikan Intlayer dengan React Native untuk mengelola konten dan menginternasionalkan aplikasi mobile Anda.
+- Mendukung platform iOS dan Android.
+
+> Sumber Daya:
+>
+> - [React Native](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_with_react_native.md)
+
+### 5. Lynx
+
+- Integrasikan Intlayer dengan Lynx untuk mengelola konten dan menginternasionalkan aplikasi mobile Anda.
+- Mendukung platform iOS dan Android.
+
+> Sumber Daya:
+>
+> - [Lynx](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_with_lynx.md)
+
+### 6. Vue
+
+- Integrasikan Intlayer dengan Vue untuk mengelola konten dan menginternasionalkan aplikasi Vite / Vue.js Anda.
+
+> Sumber Daya:
+>
+> - [Vue](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_with_vue.md)
+
+### 7. Nuxt
+
+- Integrasikan Intlayer dengan Nuxt untuk mengelola konten dan menginternasionalkan aplikasi Nuxt / Vue.js Anda.
+- Mendukung komponen server dan klien.
+- Mengintegrasikan routing dan middleware untuk mengarahkan pengguna ke konten berdasarkan bahasa pilihan mereka.
+
+> Sumber Daya:
+>
+> - [Nuxt](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_with_nuxt.md)
+
+### 8. Preact
+
+- Integrasikan Intlayer dengan Preact untuk mengelola konten dan menginternasionalkan aplikasi Preact Anda.
+
+> Sumber Daya:
+>
+> - [Preact](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_with_preact.md)
+
+---
+
+## Editor Visual dan CMS
+
+### 1. Editor Visual Lokal
+
+- Editor visual lokal **gratis** yang memungkinkan Anda mengedit konten aplikasi dengan langsung memilih elemen di halaman.
+- Mengintegrasikan fitur AI untuk membantu:
+  - Menghasilkan atau memperbaiki terjemahan
+  - Memeriksa sintaks dan ejaan
+  - Menyarankan perbaikan
+- Dapat dihosting secara lokal atau dideploy di server jarak jauh.
+
+> Sumber daya:
+>
+> - [Editor Visual](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_visual_editor.md)
+
+### 2. Intlayer CMS (Remote)
+
+- Solusi **CMS yang dihosting** yang memungkinkan Anda mengelola konten aplikasi secara online, tanpa menyentuh codebase Anda.
+- Menyediakan fitur berbantuan AI untuk mendeklarasikan konten, mengelola terjemahan, dan memperbaiki kesalahan sintaks atau ejaan.
+- Berinteraksi dengan konten Anda melalui antarmuka aplikasi langsung Anda.
+
+> Sumber daya:
+>
+> - [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_CMS.md)
+
+---
+
+## Ekstensi IDE
+
+- Ekstensi untuk IDE utama yang menyediakan **antarmuka grafis** untuk mengelola terjemahan lokal dan jarak jauh.
+- Fitur dapat mencakup pembuatan otomatis file deklarasi konten untuk komponen, integrasi langsung dengan Intlayer CMS, dan validasi waktu nyata.
+
+---
+
+## Server MCP
+
+- Sebuah **server MCP** yang memungkinkan Anda mengelola konten dan terjemahan menggunakan alat terintegrasi di IDE Anda.
+
+---
+
+## Intlayer CLI
+
+- **Terjemahan dan pembuatan file**: Jalankan audit pada file konten Anda untuk menghasilkan terjemahan yang hilang dan meninjau inkonsistensi.
+- **Interaksi Jarak Jauh**: Dorong konten lokal Anda ke CMS jarak jauh atau tarik konten jarak jauh untuk diintegrasikan ke dalam aplikasi lokal Anda.
+- **Terjemahan dan review dokumen**: Terjemahkan dan tinjau dokumentasi / file Anda, dll.
+
+> Sumber daya:
+>
+> - [CLI](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_cli.md)
+
+---
+
+## Lingkungan
+
+- Gunakan **variabel lingkungan** untuk mengonfigurasi Intlayer secara berbeda di lingkungan produksi, pengujian, dan lokal.
+- Tentukan editor visual atau proyek CMS jarak jauh mana yang akan ditargetkan tergantung pada lingkungan Anda.
+
+---
+
+## Pembaruan Konten Hot
+
+- Saat menggunakan kamus jarak jauh dan Intlayer CMS, Anda dapat **memperbarui konten aplikasi Anda secara langsung**, tanpa perlu melakukan redeploy.
+
+> Sumber daya:
+>
+> - [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_CMS.md)
+
+---
+
+## Fitur Mendatang
+
+### 1. Pengujian A/B & Personalisasi
+
+- **Pengujian Multivariat**: Uji berbagai versi dari sebuah konten untuk melihat mana yang berkinerja terbaik (misalnya, tingkat klik yang lebih tinggi).
+- **Personalisasi Berbasis Data**: Tampilkan konten yang berbeda berdasarkan demografi pengguna (jenis kelamin, usia, lokasi, dll.), atau pola perilaku lainnya.
+- **Iterasi Otomatis**: Memungkinkan AI untuk secara otomatis menguji beberapa versi dan memilih yang terbaik atau merekomendasikan opsi untuk persetujuan admin.
+
+### 2. Versi
+
+- Pulihkan versi sebelumnya dari konten Anda dengan **versi konten**.
+- Lacak perubahan dari waktu ke waktu dan kembalikan ke keadaan sebelumnya jika diperlukan.
+
+### 3. Terjemahan Otomatis
+
+- Untuk pengguna CMS jarak jauh, **pembuatan terjemahan dengan satu klik** untuk bahasa yang didukung.
+- Sistem akan menghasilkan terjemahan di latar belakang dan kemudian meminta Anda untuk validasi atau pengeditan.
+
+### 4. Peningkatan SEO
+
+- Alat untuk **menganalisis kata kunci**, niat pencarian pengguna, dan tren yang sedang berkembang.
+- Menyarankan konten yang ditingkatkan untuk peringkat yang lebih baik, dan melacak kinerja jangka panjang.
+
+### 5. Kompatibilitas dengan Lebih Banyak Framework
+
+- Upaya sedang dilakukan untuk mendukung **Solid, Svelte, Angular**, dan lainnya.
+- Bertujuan agar Intlayer kompatibel dengan **aplikasi berbasis JavaScript apa pun**.
+
+---
+
+## Kesimpulan
+
+- Sistem akan menghasilkan terjemahan di latar belakang dan kemudian meminta Anda untuk validasi atau suntingan.
+
+### 4. Peningkatan SEO
+
+- Alat untuk **menganalisis kata kunci**, niat pencarian pengguna, dan tren yang sedang berkembang.
+- Menyarankan konten yang ditingkatkan untuk peringkat yang lebih baik, dan melacak kinerja jangka panjang.
+
+### 5. Kompatibilitas dengan Lebih Banyak Framework
+
+- Upaya sedang dilakukan untuk mendukung **Solid, Svelte, Angular**, dan lainnya.
+- Bertujuan agar Intlayer kompatibel dengan **aplikasi berbasis JavaScript apa pun**.
+
+---
+
+## Kesimpulan
+
+Intlayer bertujuan menjadi solusi satu atap untuk manajemen konten dan internasionalisasi. Fokusnya pada fleksibilitas (file terpusat atau terdistribusi), dukungan bahasa yang luas, integrasi mudah dengan framework dan bundler modern, serta fitur bertenaga AI yang kuat. Seiring dengan hadirnya kemampuan baru, seperti pengujian A/B, versioning, dan terjemahan otomatis, Intlayer akan terus menyederhanakan alur kerja konten dan meningkatkan pengalaman pengguna di berbagai platform.
+
+Tetap nantikan rilis berikutnya, dan jangan ragu untuk menjelajahi fitur yang ada untuk melihat bagaimana Intlayer dapat membantu memusatkan dan mengoptimalkan proses manajemen konten Anda hari ini!
+
+---

package/docs/id/testing.md

@@ -0,0 +1,202 @@
+---
+createdAt: 2025-03-01
+updatedAt: 2025-10-05
+title: Menguji konten Anda
+description: Temukan cara menguji konten Anda dengan Intlayer.
+keywords:
+  - Pengujian
+  - Intlayer
+  - Internasionalisasi
+  - CMS
+  - Sistem Manajemen Konten
+  - Editor Visual
+slugs:
+  - doc
+  - testing
+history:
+  - version: 6.0.1
+    date: 2025-10-05
+    changes: Membuat pengujian asinkron dan menambahkan opsi build
+  - version: 6.0.0
+    date: 2025-09-20
+    changes: Pengenalan pengujian
+---
+
+# Menguji konten Anda
+
+Panduan ini menunjukkan cara memverifikasi secara otomatis bahwa kamus Anda lengkap, menangkap terjemahan yang hilang sebelum pengiriman, dan menguji UI yang dilokalisasi dalam aplikasi Anda.
+
+---
+
+## Apa yang bisa Anda uji
+
+- **Terjemahan yang hilang**: gagal CI jika ada locale yang diperlukan hilang untuk kamus apa pun.
+- **Rendering UI yang dilokalisasi**: render komponen dengan penyedia locale tertentu dan pastikan teks/atribut yang terlihat.
+- **Audit saat build**: jalankan audit cepat secara lokal melalui CLI.
+
+---
+
+## Mulai cepat: audit melalui CLI
+
+Jalankan audit dari root proyek Anda:
+
+```bash
+npx intlayer content test
+```
+
+Flag yang berguna:
+
+- `--env-file [path]`: memuat variabel lingkungan dari sebuah file.
+- `-e, --env [name]`: memilih profil lingkungan.
+- `--base-dir [path]`: menetapkan direktori dasar aplikasi untuk resolusi.
+- `--verbose`: menampilkan log secara detail.
+- `--prefix [label]`: menambahkan prefix pada baris log.
+- `--build [build]`: membangun kamus sebelum pengujian untuk memastikan konten terbaru. True akan memaksa build, false akan melewati build, undefined akan menggunakan cache build.
+
+Catatan: CLI mencetak laporan terperinci tetapi tidak keluar dengan kode non-zero saat terjadi kegagalan. Untuk pengujian CI, tambahkan unit test (di bawah) yang memastikan tidak ada locale wajib yang hilang.
+
+---
+
+## Pengujian programatik (Vitest/Jest)
+
+Gunakan Intlayer CLI API untuk memastikan tidak ada terjemahan yang hilang untuk locale wajib Anda.
+
+```ts fileName=i18n.test.ts
+/* @vitest-environment node */
+import { listMissingTranslations } from "intlayer/cli";
+import { describe, expect, it } from "vitest";
+
+describe("translations", () => {
+  it("has no missing required locales", async () => {
+    const result = await listMissingTranslations();
+
+    if (result.missingRequiredLocales.length > 0) {
+      // Berguna saat pengujian gagal secara lokal atau di CI
+      console.log(result.missingTranslations);
+    }
+
+    expect(result.missingRequiredLocales).toHaveLength(0);
+  });
+});
+```
+
+Setara Jest:
+
+```ts fileName=i18n.test.ts
+import { listMissingTranslations } from "intlayer/cli";
+
+test("tidak ada locale wajib yang hilang", async () => {
+  const result = await listMissingTranslations();
+
+  if (result.missingRequiredLocales.length > 0) {
+    // Berguna saat pengujian gagal secara lokal atau di CI
+    console.log(result.missingTranslations);
+  }
+
+  expect(result.missingRequiredLocales).toHaveLength(0);
+});
+```
+
+Cara kerjanya:
+
+- Intlayer membaca konfigurasi Anda (locales, requiredLocales) dan kamus yang dideklarasikan, lalu melaporkan:
+  - `missingTranslations`: per kunci, locale mana yang hilang dan dari file mana.
+  - `missingLocales`: gabungan dari semua locale yang hilang.
+  - `missingRequiredLocales`: subset terbatas pada `requiredLocales` (atau semua locales jika `requiredLocales` tidak disetel).
+
+---
+
+## Menguji UI yang dilokalkan (React / Next.js)
+
+Render komponen di bawah penyedia Intlayer dan lakukan assert pada konten yang terlihat.
+
+Contoh React (Testing Library):
+
+```tsx
+import { IntlayerProvider } from "react-intlayer/client";
+import { render, screen } from "@testing-library/react";
+import { MyComponent } from "./MyComponent";
+
+test("menampilkan judul yang dilokalkan dalam bahasa Inggris", () => {
+  render(
+    <IntlayerProvider locale="en-US">
+      <MyComponent />
+    </IntlayerProvider>
+  );
+
+  expect(screen.getByText("Expected English title")).toBeInTheDocument();
+});
+```
+
+Contoh Next.js (App Router): gunakan pembungkus framework:
+
+```tsx
+import { IntlayerClientProvider } from "next-intlayer/client";
+import { render, screen } from "@testing-library/react";
+import { MyPage } from "./MyPage";
+
+test("menampilkan heading yang dilokalkan dalam bahasa Prancis", () => {
+  render(
+    <IntlayerClientProvider locale="fr-FR">
+      <MyPage />
+    </IntlayerClientProvider>
+  );
+  expect(
+    screen.getByRole("heading", { name: "Titre attendu" })
+  ).toBeInTheDocument();
+});
+```
+
+Tips:
+
+- Saat Anda membutuhkan nilai string mentah untuk atribut (misalnya, `aria-label`), akses field `.value` yang dikembalikan oleh `useIntlayer` di React.
+- Simpan kamus berdekatan dengan komponen untuk memudahkan pengujian unit dan pembersihan.
+
+---
+
+## Integrasi Berkelanjutan
+
+Tambahkan pengujian yang akan membuat build gagal ketika terjemahan yang dibutuhkan hilang.
+
+`package.json`:
+
+```json
+{
+  "scripts": {
+    "test:i18n": "vitest run -c"
+  }
+}
+```
+
+Contoh GitHub Actions:
+
+```yaml
+name: CI
+on: [push, pull_request]
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+      - run: npm ci
+      - run: npm run test:i18n
+```
+
+Opsional: jalankan audit CLI untuk ringkasan yang mudah dibaca manusia bersamaan dengan pengujian:
+
+```bash
+npx intlayer content test --verbose
+```
+
+---
+
+## Pemecahan Masalah
+
+- Pastikan konfigurasi Intlayer Anda mendefinisikan `locales` dan (opsional) `requiredLocales`.
+- Jika aplikasi Anda menggunakan kamus dinamis atau jarak jauh, jalankan pengujian di lingkungan di mana kamus tersebut tersedia.
+- Untuk monorepo campuran, gunakan `--base-dir` untuk mengarahkan CLI ke root aplikasi yang benar.
+
+---

package/docs/id/vs_code_extension.md

@@ -0,0 +1,126 @@
+---
+createdAt: 2025-03-17
+updatedAt: 2025-09-30
+title: Ekstensi VS Code Resmi
+description: Pelajari cara menggunakan ekstensi Intlayer di VS Code untuk meningkatkan alur kerja pengembangan Anda. Navigasi cepat antar konten yang dilokalisasi dan kelola kamus Anda dengan efisien.
+keywords:
+  - Ekstensi VS Code
+  - Intlayer
+  - Lokalisasi
+  - Alat Pengembangan
+  - React
+  - Next.js
+  - JavaScript
+  - TypeScript
+slugs:
+  - doc
+  - vs-code-extension
+history:
+  - version: 6.1.5
+    date: 2025-09-30
+    changes: Menambahkan gif demo
+  - version: 6.1.0
+    date: 2025-09-24
+    changes: Menambahkan bagian pemilihan lingkungan
+  - version: 6.0.0
+    date: 2025-09-22
+    changes: Tab Intlayer / Perintah Isi & Uji
+  - version: 5.5.10
+    date: 2025-06-29
+    changes: Inisialisasi riwayat
+---
+
+# Ekstensi VS Code Resmi
+
+## Ikhtisar
+
+[**Intlayer**](https://marketplace.visualstudio.com/items?itemName=Intlayer.intlayer-vs-code-extension) adalah ekstensi resmi Visual Studio Code untuk **Intlayer**, yang dirancang untuk meningkatkan pengalaman pengembang saat bekerja dengan konten yang dilokalisasi dalam proyek Anda.
+
+![Ekstensi Intlayer VS Code](https://github.com/aymericzip/intlayer/blob/main/docs/assets/vs_code_extension_demo.gif?raw=true)
+
+Tautan ekstensi: [https://marketplace.visualstudio.com/items?itemName=Intlayer.intlayer-vs-code-extension](https://marketplace.visualstudio.com/items?itemName=Intlayer.intlayer-vs-code-extension)
+
+## Fitur
+
+![Isi kamus](https://github.com/aymericzip/intlayer-vs-code-extension/blob/master/assets/vscode_extention_fill_active_dictionary.gif?raw=true)
+
+- **Navigasi Instan** – Melompat dengan cepat ke file konten yang benar saat mengklik kunci `useIntlayer`.
+- **Isi Kamus** – Mengisi kamus dengan konten dari proyek Anda.
+
+![Daftar perintah](https://github.com/aymericzip/intlayer-vs-code-extension/blob/master/assets/vscode_extention_list_commands.gif?raw=true)
+
+- **Akses Mudah ke Perintah Intlayer** – Membangun, mendorong, menarik, mengisi, menguji kamus konten dengan mudah.
+
+![Buat file konten](https://github.com/aymericzip/intlayer-vs-code-extension/blob/master/assets/vscode_extention_create_content_file.gif?raw=true)
+
+- **Generator Deklarasi Konten** – Membuat file konten kamus dalam berbagai format (`.ts`, `.esm`, `.cjs`, `.json`).
+
+![Uji kamus](https://github.com/aymericzip/intlayer-vs-code-extension/blob/master/assets/vscode_extention_test_missing_dictionary.gif?raw=true)
+
+- **Uji Kamus** – Uji kamus untuk terjemahan yang hilang.
+
+![Bangun ulang kamus](https://github.com/aymericzip/intlayer-vs-code-extension/blob/master/assets/vscode_extention_rebuild_dictionary.gif?raw=true)
+
+- **Perbarui kamus Anda** – Perbarui kamus Anda dengan konten terbaru dari proyek Anda.
+
+![Tab Intlayer (Activity Bar)](https://github.com/aymericzip/intlayer-vs-code-extension/blob/master/assets/vscode_extention_search_dictionary.gif?raw=true)
+
+- **Tab Intlayer (Activity Bar)** – Jelajahi dan cari kamus dari tab samping khusus dengan toolbar dan aksi konteks (Build, Pull, Push, Fill, Refresh, Test, Create File).
+
+## Penggunaan
+
+### Navigasi Cepat
+
+1. Buka proyek yang menggunakan **react-intlayer**.
+2. Temukan pemanggilan `useIntlayer()`, seperti:
+
+   ```tsx
+   const content = useIntlayer("app");
+   ```
+
+3. **Command-click** (`⌘+Click` di macOS) atau **Ctrl+Click** (di Windows/Linux) pada kunci (misalnya, `"app"`).
+4. VS Code akan secara otomatis membuka file kamus yang sesuai, misalnya, `src/app.content.ts`.
+
+### Tab Intlayer (Activity Bar)
+
+Gunakan tab samping untuk menjelajahi dan mengelola kamus:
+
+- Buka ikon Intlayer di Activity Bar.
+- Di **Search**, ketik untuk memfilter kamus dan entri secara real time.
+- Di **Dictionaries**, jelajahi environment, kamus, dan file. Gunakan toolbar untuk Build, Pull, Push, Fill, Refresh, Test, dan Create Dictionary File. Klik kanan untuk aksi konteks (Pull/Push pada kamus, Fill pada file). File editor saat ini akan otomatis terlihat di pohon saat berlaku.
+
+### Mengakses perintah
+
+Anda dapat mengakses perintah dari **Command Palette**.
+
+```sh
+Cmd + Shift + P (macOS) / Ctrl + Shift + P (Windows/Linux)
+```
+
+- **Build Dictionaries**
+- **Push Dictionaries**
+- **Pull Dictionaries**
+- **Fill Dictionaries**
+- **Test Dictionaries**
+- **Create Dictionary File**
+
+### Memuat Variabel Lingkungan
+
+Intlayer menyarankan untuk menyimpan kunci API AI Anda, serta client ID dan secret Intlayer dalam variabel lingkungan.
+
+Ekstensi dapat memuat variabel lingkungan dari workspace Anda untuk menjalankan perintah Intlayer dengan konteks yang benar.
+
+- **Urutan pemuatan (berdasarkan prioritas)**: `.env.<env>.local` → `.env.<env>` → `.env.local` → `.env`
+- **Non-destruktif**: nilai `process.env` yang sudah ada tidak akan ditimpa.
+- **Lingkup**: file diselesaikan dari direktori dasar yang dikonfigurasi (default ke root workspace).
+
+#### Memilih environment aktif
+
+- **Command Palette**: buka palette dan jalankan `Intlayer: Select Environment`, lalu pilih environment (misalnya, `development`, `staging`, `production`). Ekstensi akan mencoba memuat file pertama yang tersedia dalam daftar prioritas di atas dan menampilkan notifikasi seperti “Loaded env from .env.<env>.local”.
+- **Settings**: buka `Settings → Extensions → Intlayer`, dan atur:
+  - **Environment**: nama environment yang digunakan untuk menyelesaikan file `.env.<env>*`.
+  - (Opsional) **Env File**: jalur eksplisit ke file `.env`. Jika disediakan, ini akan memiliki prioritas lebih tinggi daripada daftar yang diinferensikan.
+
+#### Monorepos dan direktori kustom
+
+Jika file `.env` Anda berada di luar root workspace, atur **Base Directory** di `Settings → Extensions → Intlayer`. Loader akan mencari file `.env` relatif terhadap direktori tersebut.

package/docs/it/component_i18n.md

@@ -181,6 +181,6 @@ Consulta i confronti e i modelli nel riepilogo focalizzato su Next.js: https://i
 - React Router v7: https://intlayer.org/doc/environment/vite-and-react/react-router-v7
 - TanStack Start: https://intlayer.org/doc/environment/vite-and-react/tanstack-start
 - Configurazione Next.js: https://intlayer.org/doc/environment/nextjs
-- Perché Intlayer vs. next-intl vs. next-i18next: https://intlayer.org/blog/next-i18next-vs-next-intl-vs-intlayer
+- Perché Intlayer vs. next-intl vs. next-i18next - https://intlayer.org/blog/next-i18next-vs-next-intl-vs-intlayer
 
 Queste pagine includono la configurazione end-to-end, i provider, il routing e gli helper SEO.