@intlayer/docs 9.0.0-canary.6 → 9.0.0-canary.8

package/docs/id/dynamic_dictionaries/index.md

@@ -1,13 +1,12 @@
 ---
 createdAt: 2026-06-12
-updatedAt: 2026-06-12
-title: Kamus Dinamis
-description: Gambaran umum tentang tiga fitur kamus dinamis Intlayer — koleksi, varian, dan catatan dinamis — untuk membangun konten i18n yang fleksibel dan didorong oleh runtime.
+updatedAt: 2026-06-26
+title: Kamus dinamis
+description: Ikhtisar fitur kamus dinamis Intlayer — koleksi dan varian — untuk membangun konten i18n yang fleksibel dan digerakkan saat runtime.
 keywords:
-  - Kamus Dinamis
+  - Kamus dinamis
   - Koleksi
   - Varian
-  - Catatan Dinamis
   - Intlayer
   - Internasionalisasi
 slugs:
@@ -18,31 +17,38 @@ history:
   - version: 9.0.0
     date: 2026-06-12
     changes: "Rilis fitur kamus dinamis"
+  - version: 9.1.0
+    date: 2026-06-26
+    changes: "Menggabungkan record dinamis ke dalam varian — `variant` kini menerima string atau objek"
 author: aymericzip
 ---
 
-# Kamus Dinamis
+# Kamus dinamis
 
-Intlayer mendukung tiga mekanisme untuk mengekspresikan konten yang melampaui satu kamus statis per kunci. Masing-masing dideklarasikan melalui **bidang metadata tingkat atas** dalam file konten; tidak ada fungsi pembungkus (wrapper) yang diperlukan.
+Intlayer mendukung dua mekanisme untuk mengekspresikan konten yang melampaui satu kamus statis per kunci. Masing-masing dideklarasikan melalui **field metadata tingkat atas** di file konten; tidak diperlukan fungsi pembungkus.
 
-| Fitur                                                                                                                    | Bidang metadata   | Selektor dalam `useIntlayer` |
-| ------------------------------------------------------------------------------------------------------------------------ | ----------------- | ---------------------------- |
-| [Koleksi](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/dynamic_dictionaries/collections.md)             | `item: N`         | `{ item: N }`                |
-| [Varian](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/dynamic_dictionaries/variants.md)                 | `variant: "name"` | `{ variant: "name" }`        |
-| [Catatan Dinamis](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/dynamic_dictionaries/dynamic_content.md) | `meta: { id, … }` | `{ id, … }`                  |
+| Fitur                                                                                                        | Field metadata                            | Selektor di `useIntlayer`                         |
+| ------------------------------------------------------------------------------------------------------------ | ----------------------------------------- | ------------------------------------------------- |
+| [Koleksi](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/dynamic_dictionaries/collections.md) | `item: N`                                 | `{ item: N }`                                     |
+| [Varian](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/dynamic_dictionaries/variants.md)     | `variant: "name"` _atau_ `variant: { … }` | `{ variant: "name" }` _atau_ `{ variant: { … } }` |
 
-Ketiganya disusun dengan argumen lokalitas dan mendukung pemuatan selektif / malas (lazy loading) melalui `importMode`.
+Keduanya dapat dikombinasikan dengan argumen locale dan mendukung pemuatan selektif / malas melalui `importMode`.
 
 ## Kapan menggunakan yang mana
 
-- **Koleksi** — daftar item terurut yang dikelola dalam file terpisah (entri FAQ, postingan blog, produk).
-- **Varian** — alternatif konten bernama untuk pengujian A/B, spanduk musiman, atau bendera fitur (feature flags).
-- **Catatan dinamis** — konten yang diambil saat runtime menggunakan ID buram (catatan CMS, salinan khusus pengguna).
+- **Koleksi** — daftar item terurut yang dikelola dalam file terpisah (entri FAQ, posting blog, produk).
+- **Varian** — alternatif konten bernama atau terstruktur:
+  - varian **string** untuk pengujian A/B, banner musiman, atau feature flag;
+  - varian **objek** untuk record CMS, konten khusus pengguna, atau konten apa pun yang dialamatkan oleh sekumpulan field ("record dinamis" sebelumnya).
 
-## Resolusi Konflik Selektor
+> Versi sebelumnya menyediakan field `meta` terpisah untuk konten berkunci record. Field ini telah digabungkan ke `variant`: berikan **objek** ke `variant` alih-alih menggunakan `meta`.
 
-Ketika ada beberapa selektor pada satu kamus, urutan resolusinya adalah:
+## Disambiguasi selektor
+
+Sebuah kunci dapat mendeklarasikan kedua dimensi sekaligus (mis. koleksi yang setiap itemnya memiliki varian). Keduanya diselesaikan dengan urutan:
 
 ```
-variant → meta → item
+variant → item
 ```
+
+Jadi `{ variant: "promo" }` pada kunci variant × item mengembalikan semua item promo sebagai array, dan menambahkan `{ item: 2 }` mempersempitnya menjadi satu entri.

package/docs/id/dynamic_dictionaries/variants.md

@@ -1,13 +1,15 @@
 ---
 createdAt: 2026-06-12
-updatedAt: 2026-06-12
+updatedAt: 2026-06-26
 title: Varian
-description: Gunakan bidang metadata variant dalam file konten Intlayer untuk mendeklarasikan alternatif konten bernama (pengujian A/B, spanduk musiman, salinan berbendera fitur) – dan beralih di antaranya saat runtime tanpa perubahan kode.
+description: Gunakan field metadata variant di file konten Intlayer untuk mendeklarasikan alternatif konten bernama atau terstruktur — pengujian A/B, banner musiman, teks ber-feature flag, record CMS, konten khusus pengguna — dan beralih di antaranya saat runtime tanpa perubahan kode.
 keywords:
   - Varian
   - Pengujian A/B
-  - Bendera Fitur
+  - Feature Flag
   - Konten Dinamis
+  - Record Dinamis
+  - CMS
   - Intlayer
   - Internasionalisasi
 slugs:
@@ -17,17 +19,27 @@ slugs:
 history:
   - version: 9.0.0
     date: 2026-06-12
-    changes: "Rilis fitur varian kamus"
+    changes: "Rilis fitur varian"
+  - version: 9.1.0
+    date: 2026-06-26
+    changes: "`variant` kini menerima string atau objek — `meta` / record dinamis sebelumnya dideklarasikan sebagai varian objek"
 author: aymericzip
 ---
 
 # Varian
 
-Sebuah **varian** (variant) adalah sekumpulan file konten yang memiliki kunci kamus (`key`) yang sama tetapi masing-masing membawa nama `variant` yang berbeda. Intlayer menyajikan file yang sesuai berdasarkan selektor yang diteruskan ke `useIntlayer`.
+Sebuah **varian** adalah sekumpulan file konten yang berbagi `key` kamus yang sama tetapi masing-masing membawa nilai `variant` yang berbeda. Intlayer menyajikan file yang sesuai berdasarkan selektor yang diberikan ke `useIntlayer`.
 
-## Mendeklarasikan varian
+Nilai `variant` dapat berupa **dua bentuk**:
 
-Setiap file mewakili satu alternatif bernama. Mengabaikan `variant` (atau menyetelnya ke `"default"`) menandainya sebagai fallback default.
+- **String** — satu alternatif bernama (pengujian A/B, banner musiman, feature flag).
+- **Objek** — diskriminator terstruktur yang dialamatkan oleh sekumpulan field (record CMS, konten khusus pengguna, konten apa pun yang dikunci oleh ID buram). Seluruh objek adalah identitasnya: selektor harus memberikan objek yang **sama** untuk menyelesaikan entri.
+
+> Bentuk objek menggantikan field `meta` sebelumnya. Di mana pun Anda dulu menulis `meta: { id, … }`, tulis `variant: { id, … }`, dan pilih dengan `{ variant: { id, … } }`.
+
+## Varian bernama (string)
+
+Setiap file mewakili satu alternatif bernama. Menghilangkan `variant` (atau mengaturnya ke `"default"`) menandainya sebagai fallback.
 
 ```ts fileName="hero-banner.content.ts" contentDeclarationFormat={["typescript", "esm", "commonjs"]}
 import { t, type Dictionary } from "intlayer";
@@ -65,9 +77,9 @@ const dictionary = {
 export default dictionary;
 ```
 
-## Mengonsumsi varian
+### Mengonsumsi varian bernama
 
-### Varian default
+#### Varian default
 
 <Tabs group="framework">
   <Tab label="React" value="react">
@@ -209,7 +221,7 @@ export default dictionary;
   </Tab>
 </Tabs>
 
-### Varian bernama
+#### Varian bernama
 
 ```tsx
 const { headline, cta } = useIntlayer("hero-banner", {
@@ -217,18 +229,264 @@ const { headline, cta } = useIntlayer("hero-banner", {
 });
 ```
 
-### Varian bernama dengan lokalitas eksplisit
+#### Varian bernama dengan locale eksplisit
 
 ```tsx
 const content = useIntlayer("hero-banner", {
   variant: "black_friday",
-  locale: "id",
+  locale: "fr",
 });
 ```
 
+## Varian objek (terstruktur)
+
+Varian objek mengalamatkan konten dengan sekumpulan pasangan key-value sewenang-wenang yang dideklarasikan di field `variant` — memungkinkan pemodelan record CMS, konten khusus pengguna, atau konten apa pun yang kuncinya berupa ID buram. **Seluruh objek** adalah identitasnya: selektor harus memberikan objek yang sama agar entri diselesaikan.
+
+```ts fileName="product.abc.content.ts" contentDeclarationFormat={["typescript", "esm", "commonjs"]}
+import { t, type Dictionary } from "intlayer";
+
+const dictionary = {
+  key: "product",
+  variant: { id: "prod_abc", userId: "user_123" },
+  content: {
+    name: t({ en: "Widget Pro", fr: "Widget Pro" }),
+    description: t({ en: "The best widget.", fr: "Le meilleur widget." }),
+  },
+} satisfies Dictionary;
+
+export default dictionary;
+```
+
+```ts fileName="product.abcd.content.ts" contentDeclarationFormat={["typescript", "esm", "commonjs"]}
+import { t, type Dictionary } from "intlayer";
+
+const dictionary = {
+  key: "product",
+  variant: { id: "prod_abcd", userId: "user_123" },
+  content: {
+    name: t({ en: "Widget Lite", fr: "Widget Lite" }),
+    description: t({ en: "A lighter option.", fr: "Une option plus légère." }),
+  },
+} satisfies Dictionary;
+
+export default dictionary;
+```
+
+### Mengonsumsi varian objek
+
+Berikan objek yang cocok ke `variant`. Setiap field yang dideklarasikan pada kamus harus disediakan dan sama; jika tidak, hasilnya `null`. Urutan field tidak penting.
+
+<Tabs group="framework">
+  <Tab label="React" value="react">
+    ```tsx fileName="Product.tsx" contentDeclarationFormat={["typescript", "esm", "commonjs"]}
+    import { useIntlayer } from "react-intlayer";
+
+    export const Product = ({
+      productId,
+      userId,
+    }: {
+      productId: string;
+      userId: string;
+    }) => {
+      const content = useIntlayer("product", {
+        variant: { id: productId, userId },
+      });
+
+      if (!content) return null;
+
+      return <p>{content.description}</p>;
+    };
+    ```
+
+  </Tab>
+  <Tab label="Next.js" value="nextjs">
+    ```tsx fileName="Product.tsx" contentDeclarationFormat={["typescript", "esm", "commonjs"]}
+    import { useIntlayer } from "next-intlayer";
+
+    export const Product = ({
+      productId,
+      userId,
+    }: {
+      productId: string;
+      userId: string;
+    }) => {
+      const content = useIntlayer("product", {
+        variant: { id: productId, userId },
+      });
+
+      if (!content) return null;
+
+      return <p>{content.description}</p>;
+    };
+    ```
+
+  </Tab>
+  <Tab label="Vue" value="vue">
+    ```vue fileName="Product.vue" contentDeclarationFormat={["typescript", "esm", "commonjs"]}
+    <script setup>
+    import { useIntlayer } from "vue-intlayer";
+
+    const props = defineProps({
+      productId: String,
+      userId: String,
+    });
+
+    const content = useIntlayer("product", {
+      variant: { id: props.productId, userId: props.userId },
+    });
+    </script>
+
+    <template>
+      <p v-if="content">{{ content.description }}</p>
+    </template>
+    ```
+
+  </Tab>
+  <Tab label="Svelte" value="svelte">
+    ```svelte fileName="Product.svelte" contentDeclarationFormat={["typescript", "esm", "commonjs"]}
+    <script lang="ts">
+    import { useIntlayer } from "svelte-intlayer";
+
+    export let productId: string;
+    export let userId: string;
+
+    const content = useIntlayer("product", {
+      variant: { id: productId, userId },
+    });
+    </script>
+
+    {#if $content}
+      <p>{$content.description}</p>
+    {/if}
+    ```
+
+  </Tab>
+  <Tab label="Preact" value="preact">
+    ```tsx fileName="Product.tsx" contentDeclarationFormat={["typescript", "esm", "commonjs"]}
+    import { useIntlayer } from "preact-intlayer";
+
+    export const Product = ({
+      productId,
+      userId,
+    }: {
+      productId: string;
+      userId: string;
+    }) => {
+      const content = useIntlayer("product", {
+        variant: { id: productId, userId },
+      });
+
+      if (!content) return null;
+
+      return <p>{content.description}</p>;
+    };
+    ```
+
+  </Tab>
+  <Tab label="Solid" value="solid">
+    ```tsx fileName="Product.tsx" contentDeclarationFormat={["typescript", "esm", "commonjs"]}
+    import { useIntlayer } from "solid-intlayer";
+
+    export const Product = (props: {
+      productId: string;
+      userId: string;
+    }) => {
+      const content = useIntlayer("product", {
+        variant: { id: props.productId, userId: props.userId },
+      });
+
+      return (
+        <>
+          {content() && <p>{content().description}</p>}
+        </>
+      );
+    };
+    ```
+
+  </Tab>
+  <Tab label="Angular" value="angular">
+    ```typescript fileName="product.component.ts" contentDeclarationFormat={["typescript", "esm", "commonjs"]}
+    import { Component, Input, OnInit } from "@angular/core";
+    import { useIntlayer } from "angular-intlayer";
+
+    @Component({
+      selector: "app-product",
+      template: `
+        @if (content()) {
+          <p>{{ content().description }}</p>
+        }
+      `,
+    })
+    export class ProductComponent implements OnInit {
+      @Input() productId!: string;
+      @Input() userId!: string;
+
+      content: any;
+
+      ngOnInit() {
+        this.content = useIntlayer("product", {
+          variant: { id: this.productId, userId: this.userId },
+        });
+      }
+    }
+    ```
+
+  </Tab>
+  <Tab label="Vanilla JS" value="vanilla">
+    ```javascript fileName="product.js"
+    import { useIntlayer } from "vanilla-intlayer";
+
+    const content = useIntlayer("product", {
+      variant: { id: "prod_abcd", userId: "user_123" },
+    });
+
+    if (content) {
+      document.body.innerHTML = `<p>${content.description}</p>`;
+    }
+    ```
+
+  </Tab>
+</Tabs>
+
+#### Dengan locale eksplisit
+
+```tsx
+const content = useIntlayer("product", {
+  variant: { id: "prod_abc", userId: "user_123" },
+  locale: "fr",
+});
+```
+
+#### Field hilang — tidak cocok
+
+```ts
+// Mengembalikan null: `userId` hilang, sehingga objek tidak cocok dengan varian yang dideklarasikan
+const content = useIntlayer("product", { variant: { id: "prod_abc" } });
+```
+
+## Mode pemuatan
+
+Varian objek sering dimuat secara malas. Atur `importMode` pada kamus untuk mengendalikannya:
+
+```ts contentDeclarationFormat={["typescript", "esm", "commonjs"]}
+const dictionary = {
+  key: "product",
+  importMode: "fetch", // or "dynamic"
+  variant: { id: "prod_abc", userId: "user_123" },
+  content: { … },
+} satisfies Dictionary;
+
+export default dictionary;
+```
+
+Lihat [optimasi bundle](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/bundle_optimization.md) untuk detail tentang mode `static`, `dynamic`, dan `fetch`.
+
 ## Kasus penggunaan umum
 
-- Pengujian salinan A/B yang didorong oleh kunci eksperimen
-- Spanduk musiman atau promosi
-- Pesan yang menggunakan bendera fitur (feature flags)
-- Kampanye pemasaran khusus wilayah
+- Pengujian A/B teks yang digerakkan oleh kunci eksperimen
+- Banner musiman atau promosi
+- Pesan ber-feature flag
+- Kampanye pemasaran spesifik locale
+- Teks pemasaran per-produk yang dikelola di CMS
+- Konten khusus pengguna atau akun
+- Konten apa pun yang dikunci oleh ID buram saat runtime

package/docs/id/intlayer_with_analog.md

@@ -207,7 +207,11 @@ import analog from "@analogjs/platform";
 export default defineConfig(() => ({
   plugins: [
     analog(),
-    intlayer(), // Tambahkan plugin Intlayer
+    intlayer({
+      proxy: {
+        ignore: (req) => req.url?.startsWith("/api"),
+      },
+    }),
   ],
 }));
 ```

package/docs/id/intlayer_with_astro.md

@@ -518,6 +518,8 @@ bun x intlayer extract
  </Tab>
  <Tab value='Compiler Babel'>
 
+> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
+
 Perbarui `vite.config.ts` Anda untuk menyertakan plugin `intlayerCompiler`:
 
 ```ts fileName="vite.config.ts"
@@ -527,7 +529,7 @@ import { intlayer, intlayerCompiler } from "vite-intlayer";
 export default defineConfig({
   plugins: [
     intlayer(),
-    intlayerCompiler(), // Menambahkan plugin compiler
+    intlayerCompiler(), // Adds the compiler plugin
   ],
 });
 ```

package/docs/id/intlayer_with_astro_lit.md

@@ -604,6 +604,8 @@ bun x intlayer extract
  </Tab>
  <Tab value='Compiler Babel'>
 
+> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
+
 Perbarui `vite.config.ts` Anda untuk menyertakan plugin `intlayerCompiler`:
 
 ```ts fileName="vite.config.ts"
@@ -613,7 +615,7 @@ import { intlayer, intlayerCompiler } from "vite-intlayer";
 export default defineConfig({
   plugins: [
     intlayer(),
-    intlayerCompiler(), // Menambahkan plugin compiler
+    intlayerCompiler(), // Adds the compiler plugin
   ],
 });
 ```

package/docs/id/intlayer_with_astro_preact.md

@@ -559,6 +559,8 @@ bun x intlayer extract
  </Tab>
  <Tab value='Compiler Babel'>
 
+> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
+
 Perbarui `vite.config.ts` Anda untuk menyertakan plugin `intlayerCompiler`:
 
 ```ts fileName="vite.config.ts"
@@ -568,7 +570,7 @@ import { intlayer, intlayerCompiler } from "vite-intlayer";
 export default defineConfig({
   plugins: [
     intlayer(),
-    intlayerCompiler(), // Menambahkan plugin compiler
+    intlayerCompiler(), // Adds the compiler plugin
   ],
 });
 ```

package/docs/id/intlayer_with_astro_react.md

@@ -555,6 +555,8 @@ bun x intlayer extract
  </Tab>
  <Tab value='Compiler Babel'>
 
+> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
+
 Perbarui `vite.config.ts` Anda untuk menyertakan plugin `intlayerCompiler`:
 
 ```ts fileName="vite.config.ts"
@@ -564,7 +566,7 @@ import { intlayer, intlayerCompiler } from "vite-intlayer";
 export default defineConfig({
   plugins: [
     intlayer(),
-    intlayerCompiler(), // Menambahkan plugin compiler
+    intlayerCompiler(), // Adds the compiler plugin
   ],
 });
 ```

package/docs/id/intlayer_with_astro_solid.md

@@ -555,6 +555,8 @@ bun x intlayer extract
  </Tab>
  <Tab value='Compiler Babel'>
 
+> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
+
 Perbarui `vite.config.ts` Anda untuk menyertakan plugin `intlayerCompiler`:
 
 ```ts fileName="vite.config.ts"
@@ -564,7 +566,7 @@ import { intlayer, intlayerCompiler } from "vite-intlayer";
 export default defineConfig({
   plugins: [
     intlayer(),
-    intlayerCompiler(), // Menambahkan plugin compiler
+    intlayerCompiler(), // Adds the compiler plugin
   ],
 });
 ```

package/docs/id/intlayer_with_astro_svelte.md

@@ -559,6 +559,8 @@ bun x intlayer extract
  </Tab>
  <Tab value='Compiler Babel'>
 
+> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
+
 Perbarui `vite.config.ts` Anda untuk menyertakan plugin `intlayerCompiler`:
 
 ```ts fileName="vite.config.ts"
@@ -568,7 +570,7 @@ import { intlayer, intlayerCompiler } from "vite-intlayer";
 export default defineConfig({
   plugins: [
     intlayer(),
-    intlayerCompiler(), // Menambahkan plugin compiler
+    intlayerCompiler(), // Adds the compiler plugin
   ],
 });
 ```

package/docs/id/intlayer_with_astro_vanilla.md

@@ -533,6 +533,8 @@ bun x intlayer extract
  </Tab>
  <Tab value='Compiler Babel'>
 
+> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
+
 Perbarui `vite.config.ts` Anda untuk menyertakan plugin `intlayerCompiler`:
 
 ```ts fileName="vite.config.ts"
@@ -542,7 +544,7 @@ import { intlayer, intlayerCompiler } from "vite-intlayer";
 export default defineConfig({
   plugins: [
     intlayer(),
-    intlayerCompiler(), // Menambahkan plugin compiler
+    intlayerCompiler(), // Adds the compiler plugin
   ],
 });
 ```

package/docs/id/intlayer_with_astro_vue.md

@@ -569,6 +569,8 @@ bun x intlayer extract
  </Tab>
  <Tab value='Compiler Babel'>
 
+> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
+
 Perbarui `vite.config.ts` Anda untuk menyertakan plugin `intlayerCompiler`:
 
 ```ts fileName="vite.config.ts"
@@ -578,7 +580,7 @@ import { intlayer, intlayerCompiler } from "vite-intlayer";
 export default defineConfig({
   plugins: [
     intlayer(),
-    intlayerCompiler(), // Menambahkan plugin compiler
+    intlayerCompiler(), // Adds the compiler plugin
   ],
 });
 ```

package/docs/id/intlayer_with_lynx+react.md

@@ -232,6 +232,8 @@ if (import.meta.webpackHot) {
 Buat file **deklarasi konten** di mana saja dalam proyek Anda (biasanya di dalam `src/`), menggunakan salah satu format ekstensi yang didukung oleh Intlayer:
 
 - `.content.json`
+- `.content.jsonc`
+- `.content.json5`
 - `.content.ts`
 - `.content.tsx`
 - `.content.js`
@@ -239,7 +241,10 @@ Buat file **deklarasi konten** di mana saja dalam proyek Anda (biasanya di dalam
 - `.content.mjs`
 - `.content.mjx`
 - `.content.cjs`
-- `.content.cjx`
+- `.content.md`
+- `.content.mdx`
+- `.content.yaml`
+- `.content.yml`
 - dll.
 
 Contoh:

package/docs/id/intlayer_with_nextjs_16.md

@@ -995,6 +995,8 @@ bun x intlayer extract
  </Tab>
  <Tab value='Compiler Babel'>
 
+> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
+
 ```bash packageManager="npm"
 npm install @intlayer/babel --save-dev
 ```

package/docs/id/intlayer_with_nextjs_compiler.md

@@ -559,6 +559,8 @@ bun x intlayer extract
  </Tab>
  <Tab value='Compiler Babel'>
 
+> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
+
 ```bash packageManager="npm"
 npm install @intlayer/babel --save-dev
 ```

package/docs/id/intlayer_with_react_native+expo.md

@@ -261,6 +261,8 @@ export default RootLayout;
 Buat file **deklarasi konten** di mana saja dalam proyek Anda (biasanya di dalam `src/`), menggunakan salah satu format ekstensi yang didukung Intlayer:
 
 - `.content.json`
+- `.content.jsonc`
+- `.content.json5`
 - `.content.ts`
 - `.content.tsx`
 - `.content.js`
@@ -268,7 +270,10 @@ Buat file **deklarasi konten** di mana saja dalam proyek Anda (biasanya di dalam
 - `.content.mjs`
 - `.content.mjx`
 - `.content.cjs`
-- `.content.cjx`
+- `.content.md`
+- `.content.mdx`
+- `.content.yaml`
+- `.content.yml`
 - dll.
 
 > **Expo Router (web): jauhkan file `.content.*` dari direktori `app/`.** Expo Router memperlakukan setiap file JavaScript/TypeScript di dalam `app/` sebagai rute. Di web, penemuan rutenya memindai sistem file secara langsung dan **tidak** menghormati `resolver.blockList` Metro, sehingga `*.content.ts` yang ditempatkan bersama terdaftar sebagai rute. File seperti `app/(tabs)/_layout.content.ts` bahkan diuraikan sebagai tata letak (bagian `.content` dibaca sebagai sufiks platform), yang bertabrakan dengan `_layout.tsx` asli dan menampilkan:

package/docs/id/intlayer_with_react_router_v7.md

@@ -633,6 +633,8 @@ bun x intlayer extract
  </Tab>
  <Tab value='Compiler Babel'>
 
+> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
+
 Perbarui `vite.config.ts` Anda untuk menyertakan plugin `intlayerCompiler`:
 
 ```ts fileName="vite.config.ts"
@@ -642,7 +644,7 @@ import { intlayer, intlayerCompiler } from "vite-intlayer";
 export default defineConfig({
   plugins: [
     intlayer(),
-    intlayerCompiler(), // Menambahkan plugin compiler
+    intlayerCompiler(), // Adds the compiler plugin
   ],
 });
 ```