@intlayer/docs 8.12.5-canary.0 → 9.0.0-canary.11

package/docs/id/releases/v8.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2025-09-22
-updatedAt: 2026-01-26
+updatedAt: 2026-06-14
 title: Intlayer v8 Baru - Apa yang Baru?
 description: Temukan apa yang baru di Intlayer v8. Peningkatan besar pada pengalaman pengembang, validasi konten, dan pengelolaan kamus.
 keywords:
@@ -405,7 +405,17 @@ Kami telah memperkenalkan fungsi renderer dan komponen mandiri baru untuk member
   </Tab>
 </Tabs>
 
-Untuk detail lebih lanjut, lihat [Dokumentasi Konten HTML](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/dictionary/html.md) dan [Dokumentasi Markdown](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/dictionary/markdown.md).
+Untuk detail lebih lanjut, lihat [Dokumentasi Konten HTML](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/dictionary/html.md) and [Dokumentasi Markdown](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/dictionary/markdown.md).
+
+---
+
+## File Konten YAML & Markdown (v8.10.0)
+
+Anda sekarang dapat mendeklarasikan konten secara langsung menggunakan ekstensi file `.content.md` dan `.content.yaml`. Ini sangat cocok untuk konten panjang, blog, dokumentasi, dan kebijakan privasi.
+
+File-file ini sepenuhnya dapat diedit dari Visual Editor, menyediakan alur kerja yang efisien untuk anggota tim non-teknis.
+
+Untuk detail lebih lanjut, lihat [Dokumentasi File Konten YAML](https://intlayer.org/doc/concept/content#yaml-content-file) dan [Dokumentasi File Konten Markdown](https://intlayer.org/doc/concept/content/markdown).
 
 ---
 
@@ -753,6 +763,61 @@ export default {
   </Tab>
 </Tabs>
 
+## Aturan Jamak Unicode CLDR (v8.8.0)
+
+Helper node `plural` baru telah diperkenalkan berdasarkan aturan jamak yang didefinisikan oleh Unicode CLDR Project, meningkatkan dukungan untuk bahasa yang kompleks.
+
+```typescript fileName="src/openings.content.ts"
+import { plural, t, type Dictionary } from "intlayer";
+
+const openingsContent = {
+  key: "total_openings",
+  content: {
+    totalOpenings: t({
+      id: plural({
+        other: "{{count}} lowongan",
+      }),
+      en: plural({
+        one: "{{count}} opening",
+        other: "{{count}} openings",
+      }),
+      fr: plural({
+        one: "{{count}} offre",
+        other: "{{count}} offres",
+      }),
+    }),
+  },
+} satisfies Dictionary;
+
+export default openingsContent;
+```
+
+Anda kemudian dapat meneruskan jumlah (count) secara dinamis dalam komponen framework Anda:
+
+```tsx
+import type { FC } from "react";
+import { useIntlayer } from "react-intlayer";
+
+const OpeningsComponent: FC<{ count: number }> = ({ count }) => {
+  const { totalOpenings } = useIntlayer("total_openings");
+
+  return (
+    <div>
+      {/* Dalam bahasa Inggris:                       */}
+      {/*  count=0  → "0 openings"   (other)           */}
+      {/*  count=1  → "1 opening"    (one)             */}
+      {/*  count=2  → "2 openings"   (other)           */}
+      {/*  count=21 → "21 openings"  (other)           */}
+      <p>{totalOpenings(count)}</p>
+    </div>
+  );
+};
+```
+
+Untuk informasi lebih lanjut, lihat [Dokumentasi Pluralisasi](https://intlayer.org/doc/concept/content/plural).
+
+---
+
 ## Validasi Skema Konten
 
 Intlayer v8 memperkenalkan validasi skema untuk dictionaries. Sekarang Anda dapat mendefinisikan skema validasi yang dapat digunakan ulang dalam konfigurasi Anda menggunakan Zod dan menerapkannya pada file konten Anda. Ini memastikan konten Anda selalu sesuai dengan struktur yang diharapkan, sehingga menangkap kesalahan saat proses build.
@@ -797,6 +862,34 @@ Jika konten tidak cocok dengan skema (mis. judul terlalu pendek), proses build a
 
 ---
 
+## TypeScript: Aksesor Primitif IntlayerNode
+
+Tipe `IntlayerNode` telah diperbarui untuk memungkinkan pemanggilan metode JavaScript primitif secara langsung pada node konten. Ini memungkinkan Anda untuk berinteraksi dengan konten yang dilokalkan secara langsung seolah-olah itu adalah string, angka, boolean, atau array primitif standar.
+
+Didukung di React, Preact, Solid, Svelte, Vue, dan Angular.
+
+### Contoh String
+
+```typescript
+content.placeholder; // Mengembalikan IntlayerNode<string>
+content.placeholder.value; // Mengembalikan string
+content.placeholder.toString(); // Mengembalikan string
+content.placeholder.toLowerCase(); // Mengembalikan string
+String(content.placeholder); // Mengembalikan string
+content.placeholder.toUpperCase(); // Mengembalikan string yang diubah menjadi huruf besar
+content.placeholder.replace("a", "b"); // Mengembalikan string yang dimodifikasi
+```
+
+### Contoh Array
+
+```typescript
+content.myArrayOfString             // Mengembalikan IntlayerNode<Array<string>>
+content.myArrayOfString.find(...)   // Mengembalikan elemen
+content.myArrayOfString.join(', ')  // Mengembalikan string yang digabungkan
+```
+
+---
+
 ### Pendeteksian Konten Otomatis yang Ditingkatkan
 
 Di v8, Intlayer secara cerdas mendeteksi sintaks Markdown, tag HTML, dan penyisipan variabel dalam string konten Anda. Ini berarti Anda sering dapat menghilangkan fungsi pembantu seperti `md()`, `html()`, atau `insert()`.
@@ -1002,6 +1095,17 @@ Ekstensi Intlayer untuk VSCode menerima pembaruan besar di v8 untuk menyederhana
 
 ---
 
+## Tooling: C++ Watcher & LSP Berbasis OXC (v8.12.0)
+
+Intlayer v8.12.0 membawa peningkatan besar pada pengalaman pengembang:
+
+- **Parcel Watcher**: Pemantau konten (content watcher) telah dimigrasikan dari `chokidar` ke `@parcel/watcher`, memanfaatkan pemantauan file C++ asli untuk memberikan pembaruan yang lebih cepat dan konsumsi memori yang jauh lebih rendah.
+- **Language Server Protocol (LSP) Baru**: LSP yang benar-benar baru kini telah tersedia. Dibangun dengan parsing berbasis OXC, ini membantu IDE dan agen AI Anda menghubungkan panggilan `useIntlayer('my-key')` secara mulus dengan file `.content` yang sesuai, dan sebaliknya.
+
+Untuk detail lebih lanjut, lihat [Dokumentasi LSP](https://intlayer.org/doc/lsp).
+
+---
+
 ## Optimisasi Kompiler
 
 Intlayer v8 menyertakan lapisan caching baru untuk compiler Markdown dan HTML. Ini memastikan bahwa string konten yang identik dengan konfigurasi yang sama hanya diparse sekali, secara signifikan mengurangi overhead selama re-render atau saat menggunakan konten yang sama di beberapa tempat.
@@ -1057,6 +1161,48 @@ Intlayer v8 menyertakan lapisan caching baru untuk compiler Markdown dan HTML. I
 
 ---
 
+## Optimisasi Build Eksperimental: Minify & Purge (v8.7.0)
+
+Intlayer v8.7.0 memperkenalkan fitur build eksperimental baru di `intlayer.config.ts` Anda yang dirancang untuk mengoptimalkan bundle produksi Anda:
+
+- **Minifikasi Kamus (Dictionary Minification)**: Meminimalkan file kamus untuk memperkecil ukuran.
+- **Pembersihan Kunci yang Tidak Digunakan (Unused Key Purging)**: Memindai dan menghapus kunci terjemahan yang tidak digunakan dari kamus, mengubah nama kunci aktif menjadi karakter pendek (mis. `"products" -> "a"`, `"pricing" -> "b"`). Ini mengurangi ukuran bundle hingga 5%.
+- **Menonaktifkan Pemeriksaan TypeScript**: Mempercepat proses build dengan menonaktifkan typechecking TypeScript selama langkah kompilasi.
+
+```typescript fileName="intlayer.config.ts"
+import { Locales, type IntlayerConfig } from "intlayer";
+
+const config: IntlayerConfig = {
+  internationalization: {
+    locales: [Locales.ENGLISH, Locales.FRENCH],
+    defaultLocale: Locales.ENGLISH,
+  },
+  dictionary: {
+    importMode: "dynamic",
+  },
+  build: {
+    /**
+     * Minifikasi kamus untuk mengurangi ukuran bundle.
+     */
+    minify: true,
+
+    /**
+     * Bersihkan kunci yang tidak digunakan dalam kamus
+     */
+    purge: true,
+
+    /**
+     * Menunjukkan apakah build harus memeriksa tipe TypeScript
+     */
+    checkTypes: false,
+  },
+};
+
+export default config;
+```
+
+---
+
 ## Fleksibilitas: Mode Impor Terpadu
 
 Properti boolean `live` telah usang (deprecated) digantikan oleh properti `importMode` yang lebih komprehensif. Ini memungkinkan definisi eksplisit tentang bagaimana dictionary harus dimuat: secara statis, dinamis, atau melalui sinkronisasi langsung.
@@ -1204,6 +1350,49 @@ Konten Markdown dan HTML di Svelte sekarang secara otomatis di-parse menjadi HTM
 
 ---
 
+## Dukungan Angular: Vite Bundler (v8.11.0)
+
+Untuk pengguna Angular, Intlayer sekarang secara native mendukung bundler Vite melalui plugin esbuild kustom baru, mempercepat waktu pengembangan dan build.
+
+Untuk detail tentang konfigurasi, lihat [Dokumentasi Lingkungan Angular](https://intlayer.org/doc/environment/angular).
+
+---
+
+## Pembuatan Sitemap (v8.6.0)
+
+Intlayer sekarang menghasilkan sitemap secara otomatis berdasarkan locale dan mode routing Anda. Ini sangat berguna untuk optimisasi SEO dalam arsitektur router seperti TanStack Router:
+
+```typescript fileName="src/routes/sitemap.xml.ts"
+import { createFileRoute } from "@tanstack/react-router";
+import { generateSitemap } from "intlayer";
+
+const SITE_URL = (
+  import.meta.env.VITE_SITE_URL ?? "http://localhost:3000"
+).replace(/\/$/, "");
+
+export const Route = createFileRoute("/sitemap.xml")({
+  server: {
+    handlers: {
+      GET: async () => {
+        const sitemap = generateSitemap(
+          [
+            { path: "/", changefreq: "daily", priority: 1.0 },
+            { path: "/about", changefreq: "monthly", priority: 0.8 },
+          ],
+          { siteUrl: SITE_URL }
+        );
+
+        return new Response(sitemap, {
+          headers: { "Content-Type": "application/xml" },
+        });
+      },
+    },
+  },
+});
+```
+
+---
+
 ## Catatan migrasi dari v7
 
 ### Perubahan Konfigurasi

package/docs/id/releases/v9.md

@@ -0,0 +1,346 @@
+---
+createdAt: 2026-06-14
+updatedAt: 2026-06-29
+title: Intlayer v9 Baru - Apa yang baru?
+description: Temukan apa yang baru di Intlayer v9. Memperkenalkan paket kompatibilitas drop-in untuk pustaka i18n populer dan dukungan untuk Collections dan Variants.
+keywords:
+  - Intlayer
+  - Kompatibilitas
+  - Migrasi
+  - Collections
+  - Variants
+  - CMS SDK
+  - i18next
+  - next-intl
+  - vue-i18n
+slugs:
+  - doc
+  - releases
+  - v9
+author: aymericzip
+---
+
+# Intlayer v9 Baru - Apa yang baru?
+
+Selamat datang di Intlayer v9! Rilis besar ini menandai tonggak sejarah besar dalam menyederhanakan jalur migrasi ke Intlayer dengan **Compat Adapter Packages** untuk pustaka i18n utama (`react-i18next`, `next-intl`, `vue-i18n`, dll.) dan menambahkan dukungan untuk struktur konten yang kaya: **Collections** dan **Variants**.
+
+## Daftar Isi
+
+<TOC levels={[2]} maxDepth={1} />
+
+---
+
+## Compat Adapter Packages
+
+Migrasi ke Intlayer dari pustaka i18n populer kini lebih mudah dari sebelumnya. Kami telah membuat lima paket kompatibilitas (compat packages) yang mengekspos **API publik yang persis sama** dengan pustaka i18n standar tetapi mendelegasikan semua pekerjaan penerjemahan ke Intlayer pada saat runtime.
+
+### Mengekspos API Publik yang Sama dengan Strict Typing
+
+Dengan mengganti impor, Anda mendapatkan semua manfaat Intlayer (termasuk type safety pada saat compile-time terhadap dictionary Anda yang sebenarnya) dengan perubahan kode yang minimal:
+
+- `@intlayer/i18next`
+- `@intlayer/react-i18next`
+- `@intlayer/next-intl`
+- `@intlayer/react-intl`
+- `@intlayer/next-i18next`
+- `@intlayer/vue-i18n`
+- `@intlayer/lingui`
+
+Sebagai contoh, cukup ubah:
+
+```ts
+import { useTranslation } from "react-i18next";
+```
+
+menjadi:
+
+```ts
+import { useTranslation } from "@intlayer/react-i18next";
+```
+
+Key Anda sekarang akan bertipe ketat (**strictly typed**) terhadap dictionary Intlayer Anda, menawarkan auto-completion dot-path lengkap di IDE Anda!
+
+### Plugin Alias Bundler (Vite, Next.js, Turbopack)
+
+Untuk memungkinkan migrasi tanpa menulis ulang semua pernyataan impor Anda secara manual, setiap paket compat adapter menyertakan **plugin bundler kustom** (Vite atau Next.js) di bawah subpath `/plugin`.
+
+Plugin ini secara otomatis menulis ulang impor yang ada (misalnya `react-i18next` atau `next-intl`) ke padanannya di `@intlayer/*` pada saat build time.
+
+#### Contoh Next.js (Webpack / Turbopack)
+
+Alih-alih `withIntlayer`, bungkus konfigurasi Next.js Anda dengan plugin kompatibilitas:
+
+```ts fileName="next.config.ts"
+import { createNextI18nPlugin } from "@intlayer/next-i18next/plugin";
+import type { NextConfig } from "next";
+
+const withIntlayer = createNextI18nPlugin();
+const nextConfig: NextConfig = {};
+
+export default withIntlayer(nextConfig);
+```
+
+#### Contoh Vite (React, Vue, Solid, Svelte)
+
+```ts fileName="vite.config.ts"
+import vueI18nVitePlugin from "@intlayer/vue-i18n/plugin";
+
+export default defineConfig({
+  plugins: [vueI18nVitePlugin()],
+});
+```
+
+---
+
+## Mutualized Runtime Resolver
+
+Semua compat adapter sekarang merutekan resolusi terjemahan melalui satu parser runtime yang sangat dioptimalkan: `@intlayer/core/messageFormat`.
+
+- **Interpolate Message**: Menyelesaikan `{{var}}` standar (whitespace & dot-path), argumen berformat ICU (`{v, number, percent}` dll.), dan templat `{var}` polos.
+- **Message Node Resolver**: Menyelesaikan node bersarang: `insert()`, `plural()` (aturan jamak CLDR), `enu()` (enumerasi), `gender()`, tag HTML, array, dan node fungsi yang dapat dipanggil (callable function nodes).
+- **Tokenized Tag Parser**: Mendukung tag XML/HTML inline dan tag bernomor (misalnya, `<1>children</1>`) untuk mendukung rendering rich-text secara langsung (out of the box).
+
+---
+
+## Spesifikasi Fitur: Collections & Variants
+
+Intlayer v9 berkembang melampaui objek key-value statis, memungkinkan dictionary untuk mendeklarasikan struktur tata letak dinamis yang sepenuhnya bertipe (fully typed) dari ujung ke ujung (end-to-end).
+
+### 1. Collections
+
+Definisikan daftar item terurut yang dikelola CMS (misalnya FAQ, produk, atau daftar blog):
+
+```ts fileName="faq.1.content.ts"
+import { t, type Dictionary } from "intlayer";
+
+export default {
+  key: "faq",
+  item: 1,
+  content: {
+    question: t({ en: "What is Intlayer?", fr: "Qu'est-ce qu'Intlayer ?" }),
+    answer: t({ en: "An i18n toolkit.", fr: "Une boîte à outils i18n." }),
+  },
+} satisfies Dictionary;
+```
+
+```ts fileName="faq.2.content.ts"
+import { t, type Dictionary } from "intlayer";
+
+export default {
+  key: "faq",
+  item: 2,
+  content: {
+    question: t({ en: "Is it free?", fr: "Est-ce gratuit ?" }),
+    answer: t({ en: "Yes, open-source.", fr: "Oui, open-source." }),
+  },
+} satisfies Dictionary;
+```
+
+#### Penggunaan:
+
+```ts
+// Fetch all items as an array
+const allFaqs = useIntlayer("faq"); // -> { question: string, answer: string }[]
+
+// Fetch a single item by index
+const faq = useIntlayer("faq", { item: 2 }); // -> { question: string, answer: string }
+```
+
+### 2. Variants
+
+Sajikan pengujian A/B (A/B tests), header musiman, feature flags, atau landing page kustom:
+
+#### Varian string (misal, pengujian A/B)
+
+```ts fileName="hero.content.ts"
+import { t, type Dictionary } from "intlayer";
+
+export default {
+  key: "hero-banner",
+  variant: "default",
+  content: {
+    control: t({ id: "Selamat datang", en: "Welcome", fr: "Bienvenue" }),
+    black_friday: t({
+      id: "Belanja sekarang",
+      en: "Shop now",
+      fr: "Acheter maintenant",
+    }),
+  },
+} satisfies Dictionary;
+```
+
+#### Penggunaan:
+
+```ts
+const banner = useIntlayer("hero-banner", { variant: "black_friday" });
+```
+
+#### Varian objek (misal, Dynamic Records)
+
+```ts fileName="product.content.ts"
+import { t, type Dictionary } from "intlayer";
+
+export default {
+  key: "product-copy",
+  variant: {
+    id: "prod_123",
+    category: "books",
+  },
+  content: {
+    title: t({ id: "Clean Code", en: "Clean Code", fr: "Code Propre" }),
+  },
+} satisfies Dictionary;
+```
+
+#### Penggunaan:
+
+```ts
+// Memuat hanya item yang diminta secara dinamis (memerlukan Suspense)
+const product = useIntlayer("product-copy", {
+  variant: { id: "prod_123", category: "books" },
+});
+```
+
+---
+
+## Dynamic Loading & Optimisasi Ukuran Bundle
+
+Untuk menjaga ukuran bundle tetap sangat kecil, Intlayer v9 mendukung dynamic lazy loading.
+
+Dalam konfigurasi Anda, atur `importMode` ke `'dynamic'` atau `'fetch'`:
+
+```ts fileName="intlayer.config.ts"
+export default {
+  dictionary: {
+    importMode: "dynamic", // "static" | "dynamic" | "fetch"
+  },
+};
+```
+
+Pada saat build time, `@intlayer/swc` and `@intlayer/babel` memindai file Anda dan mengganti panggilan `useIntlayer` / `getIntlayer` dengan wrapper yang mendukung tree-shaking (`useDictionary` / `useDictionaryDynamic`). Hanya konten yang diperlukan untuk item koleksi, varian, atau locale terpilih yang dimuat, mencegah bundle produksi Anda berisi terjemahan yang tidak digunakan.
+
+---
+
+## Vite Plugin: Bundled Compiler & Proxy
+
+Plugin Vite `intlayer()` sekarang menggabungkan **compiler** dan **locale-routing proxy** secara langsung, sehingga sebagian besar proyek hanya memerlukan satu plugin di `vite.config.ts`:
+
+```ts fileName="vite.config.ts"
+import { defineConfig } from "vite";
+import { intlayer } from "vite-intlayer";
+
+export default defineConfig({
+  plugins: [intlayer()],
+});
+```
+
+- **Compiler**: Diaktifkan secara otomatis ketika `compiler.enabled` diatur ke `true` dan jalur `compiler.output` dikonfigurasi. Anda tidak lagi perlu mendaftarkan `intlayerCompiler()` secara terpisah.
+- **Proxy**: Diaktifkan secara otomatis berdasarkan opsi `routing.enableProxy` yang baru (`true` secara default). Ini menghubungkan middleware deteksi locale / redirect / rewrite dalam pengembangan, preview, dan SSR produksi. Anda tidak lagi perlu mendaftarkan `intlayerProxy()` secara terpisah.
+
+### Opsi `routing.enableProxy`
+
+Opsi baru `routing.enableProxy` mengontrol apakah proxy locale-routing dipasang. Defaultnya adalah `true`. Nonaktifkan ketika Anda ingin menangani locale routing sendiri:
+
+```ts fileName="intlayer.config.ts"
+import type { IntlayerConfig } from "intlayer";
+
+const config: IntlayerConfig = {
+  routing: {
+    enableProxy: false, // Default: true
+  },
+};
+
+export default config;
+```
+
+Plugin standalone `intlayerCompiler()` dan `intlayerProxy()` tetap diekspor untuk setup lanjutan. Mendaftarkan mereka bersama dengan `intlayer()` aman — setiap plugin menghilangkan duplikat dirinya sendiri dan hanya berjalan sekali.
+
+---
+
+## Compiler dinonaktifkan secara default
+
+Mulai dari Intlayer v9, **compiler dinonaktifkan secara default** (`compiler.enabled` sekarang default-nya `false`). Untuk mengaktifkan ekstraksi file `.content.ts` Anda pada saat build, atur `compiler.enabled: true` di konfigurasi Anda:
+
+```ts fileName="intlayer.config.ts"
+import type { IntlayerConfig } from "intlayer";
+
+const config: IntlayerConfig = {
+  compiler: {
+    enabled: true, // Default: false — diperlukan untuk mengaktifkan compiler sejak v9
+    output: ({ fileName }) => `./${fileName}.content.ts`,
+  },
+};
+
+export default config;
+```
+
+Ketika compiler dinonaktifkan, Intlayer melewati langkah ekstraksi saat build dan mengandalkan dictionary yang sudah Anda deklarasikan. Aktifkan hanya ketika Anda ingin plugin bundler (`@intlayer/swc`, `@intlayer/babel`, atau plugin Vite `intlayer()`) mengekstrak konten secara otomatis.
+
+---
+
+## React Native: impor paket tunggal
+
+Dalam aplikasi React Native atau Expo, Anda tidak perlu lagi beralih antara `react-intlayer` dan `react-native-intlayer`. Paket `react-native-intlayer` sekarang **mengekspor ulang seluruh API `react-intlayer`** (hooks, utilitas, dan subjalur `/format`, `/html`, dan `/markdown`), dan `IntlayerProvider`-nya secara otomatis menerapkan polyfill React Native.
+
+Impor semuanya dari paket tunggal `react-native-intlayer`:
+
+```tsx
+import {
+  IntlayerProvider,
+  useIntlayer,
+  useLocale,
+} from "react-native-intlayer";
+```
+
+```bash
+npm install intlayer react-native-intlayer
+```
+
+> Mengimpor dari `react-intlayer` tetap berfungsi, tetapi `react-native-intlayer` sekarang adalah titik masuk tunggal yang direkomendasikan untuk React Native — provider-nya menyediakan polyfill yang tidak dimiliki oleh provider `react-intlayer` yang berorientasi web.
+
+---
+
+## SDK CMS: gunakan Intlayer sebagai basis data konten headless
+
+Intlayer v9 menyertakan SDK yang bersih dan mengautentikasi sendiri di `@intlayer/api` untuk berinteraksi dengan CMS secara terprogram — mengambil proyek, mengambil kamus, serta mengirim atau memperbaruinya dari server, skrip, atau CI Anda sendiri. Autentikasi (OAuth2 `client_credentials`) ditangani dan disegarkan untuk Anda.
+
+SDK dibagi menjadi **dua impor terpisah** sehingga bundel Anda hanya menyertakan domain yang benar-benar Anda gunakan:
+
+1. `createIntlayerCMS` — sebuah **autentikator** ringan yang menyimpan kredensial dan token yang dikelola (tanpa menyertakan klien domain).
+2. `dictionaryEndpoint`, `projectEndpoint`, … — **pengikat endpoint** per domain, masing-masing diimpor dari subpath-nya sendiri.
+
+```ts fileName="cms.ts"
+import { createIntlayerCMS } from "@intlayer/api";
+import { dictionaryEndpoint } from "@intlayer/api/dictionary";
+
+// Konfigurasi bersifat opsional: kredensial kembali ke INTLAYER_CLIENT_ID /
+// INTLAYER_CLIENT_SECRET yang diselesaikan oleh `@intlayer/config/built`.
+const cms = createIntlayerCMS();
+
+// Baca
+const { data: dictionaries } = await dictionaryEndpoint(cms).getDictionaries();
+
+// Tulis — gunakan CMS seperti basis data
+await dictionaryEndpoint(cms).pushDictionaries([myDictionary]);
+```
+
+> Keamanan: kredensial CMS memberikan akses tulis ke konten Anda. Selalu buat autentikator hanya di **sisi server** — jangan pernah mengirim `clientId` / `clientSecret` ke browser.
+
+---
+
+## Catatan migrasi dari v8
+
+Jika Anda memperbarui dari v8, perhatikan bahwa v9 tidak menyertakan breaking changes (perubahan yang merusak). Namun berikut adalah perubahan utamanya:
+
+- **Compiler dinonaktifkan secara default**: `compiler.enabled` sekarang default-nya `false`. Jika Anda mengandalkan ekstraksi file `.content.ts` saat build, atur `compiler.enabled: true` di `intlayer.config.ts` Anda.
+- **Locales & Dialects**: Jika menggunakan dependensi i18n eksternal, tambahkan plugin compat adapter masing-masing dalam konfigurasi atau pengaturan bundler Anda untuk menulis ulang impor secara otomatis.
+- **Custom Selectors**: Saat memanggil `useIntlayer`, parameter kedua sekarang dicadangkan untuk objek opsi yang berisi `{ locale, item, variant }`. Jika sebelumnya Anda meneruskan string locale secara langsung, Anda masih dapat melakukannya, tetapi menggunakan objek opsi sangat direkomendasikan untuk pemilihan tingkat lanjut.
+
+---
+
+## Tautan berguna
+
+- [Panduan Compat Adapter Packages](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/compat/index.md)
+- [Dynamic Dictionaries - Collections & Variants](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/dynamic_dictionaries/index.md)
+- [Referensi Konfigurasi](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/configuration.md)
+- [SDK CMS - Akses terprogram dengan @intlayer/api](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_CMS.md)

package/docs/id/roadmap.md

@@ -340,22 +340,6 @@ Intlayer mendukung **TypeScript** (juga JavaScript) dan **JSON** untuk mendeklar
 
 ## 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!