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

package/docs/hi/compat/transloco.md

@@ -0,0 +1,45 @@
+---
+createdAt: 2026-06-13
+updatedAt: 2026-06-13
+title: "Transloco से Intlayer में माइग्रेट करें"
+description: "सीखें कि compat adapter का उपयोग करके अपने Angular एप्लिकेशन को Transloco से Intlayer में कैसे माइग्रेट करें।"
+keywords:
+  - transloco
+  - angular
+  - intlayer
+  - migration
+  - compat
+slugs:
+  - doc
+  - compatibility
+  - transloco
+history:
+  - version: 9.0.0
+    date: 2026-06-13
+    changes: "Init history"
+author: aymericzip
+---
+
+# Transloco से Intlayer में माइग्रेट करें
+
+यदि आपकी Angular एप्लिकेशन वर्तमान में `@jsverse/transloco` का उपयोग करती है, तो आप हमारे compat adapter का उपयोग करके Intlayer में माइग्रेट कर सकते हैं। यह संक्रमण आपको अपने मौजूदा template syntax को बनाए रखते हुए Intlayer की शक्तिशाली dictionary संरचना का उपयोग करने की अनुमति देता है।
+
+## क्या करें
+
+अपने प्रोजेक्ट में बस initialization command चलाएं:
+
+```bash
+npx intlayer init
+```
+
+यह आवश्यक `intlayer.config.ts` configuration generate करेगा। फिर आप अपने Transloco imports को `@intlayer/transloco` modules के साथ replace कर सकते हैं या build aliases पर निर्भर रह सकते हैं।
+
+## यह हुड के नीचे क्या करता है
+
+Transloco scopes और एक `TranslocoService` (`translate`, `selectTranslate`) का उपयोग करता है, साथ ही structural directives (`*transloco="let t"`) और pipes (`| transloco`)।
+
+हुड के नीचे:
+
+- **Scopes:** Intlayer dictionary keys के लिए स्वाभाविक रूप से मैप करते हैं, bundle optimization के लिए एक बेहतरीन pruning story प्रदान करते हैं।
+- **Service & Directives:** Intlayer का Angular adapter seamlessly providers को बदलता है, जिससे आपके मौजूदा template pipes और directives Intlayer dictionaries के विरुद्ध strings को resolve कर सकते हैं।
+- **Build time parsing:** TypeScript analyzer `instant/get` calls को पहचानता है, और fallback pruning सुनिश्चित करता है कि सही है यहां तक कि जब template usage statically trackable न हो।

package/docs/hi/compat/vue-i18n.md

@@ -0,0 +1,58 @@
+---
+createdAt: 2026-06-13
+updatedAt: 2026-06-13
+title: "Vue I18n से Intlayer में माइग्रेट करें"
+description: "सीखें कि compat adapter का उपयोग करके अपने Vue एप्लिकेशन को vue-i18n से Intlayer में कैसे माइग्रेट करें।"
+keywords:
+  - vue-i18n
+  - vue
+  - intlayer
+  - migration
+  - compat
+slugs:
+  - doc
+  - compatibility
+  - vue-i18n
+history:
+  - version: 9.0.0
+    date: 2026-06-13
+    changes: "Init history"
+author: aymericzip
+---
+
+# Vue I18n से Intlayer में माइग्रेट करें
+
+यदि आपका Vue एप्लिकेशन वर्तमान में `vue-i18n` का उपयोग करता है, तो आप अपने components को फिर से लिखे बिना या translating hooks के बिना Intlayer में माइग्रेट कर सकते हैं। Intlayer एक compat adapter प्रदान करता है जो `vue-i18n` के API को perfectly mirror करता है जबकि hood के तहत Intlayer की शक्तिशाली features का लाभ उठाता है।
+
+## क्या करें
+
+शुरुआत करने के लिए, बस अपने प्रोजेक्ट में initialization command चलाएं:
+
+```bash
+npx intlayer init
+```
+
+Initialization के दौरान, Intlayer आपकी configuration file (`intlayer.config.ts`) को सेट अप करेगा और आपके प्रोजेक्ट को migration के लिए तैयार करेगा। आपको बस Intlayer plugin को अपनी Vite configuration में जोड़ना होगा ताकि `vue-i18n` imports को स्वचालित रूप से alias किया जा सके।
+
+```typescript fileName="vite.config.ts"
+import { defineConfig } from "vite";
+import vue from "@vitejs/plugin-vue";
+import vueI18nVitePlugin from "@intlayer/vue-i18n/plugin";
+
+export default defineConfig({
+  plugins: [vue(), vueI18nVitePlugin()],
+});
+```
+
+## यह हुड के नीचे क्या करता है
+
+`vueI18nVitePlugin` आपके bundler में एक मॉड्यूल alias को inject करता है। आपके codebase में `vue-i18n` का कोई भी import पारदर्शी रूप से `@intlayer/vue-i18n` पर रीडायरेक्ट किया जाएगा।
+
+**हुड के नीचे, adapter जटिल `vue-i18n` syntax को natively संभालता है:**
+
+- **Interpolation & Plurals:** `{name}` और list `{0}` interpolations को resolve करता है। Pipe plurals (`"car | cars"`) को positional semantics के आधार पर Intlayer enumeration/plural nodes में परिवर्तित किया जाता है।
+- **Formats:** `d()` और `n()` जैसे functions हुड के नीचे `Intl` को wrap करते हैं, आपके options में परिभाषित `datetimeFormats` और `numberFormats` को honor करते हुए।
+- **Global & Local State:** `global.locale` को एक `WritableComputedRef` पर मैप किया जाता है जो Intlayer client द्वारा समर्थित है, इसलिए reactivity बिल्कुल अपेक्षित रूप से व्यवहार करता है (उदाहरण के लिए `locale.value = 'fr'`)।
+- **Directives:** `v-t` directive को register किया जाता है और सामान्य रूप से कार्य करता है।
+
+आपका application पहले की तरह ही बिल्कुल rendering करता रहता है, लेकिन content आपके Intlayer dictionaries द्वारा powered होता है, जो आपको type safety, बेहतर bundle optimization, और seamless CMS integration देता है।

package/docs/hi/compiler.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2025-09-09
-updatedAt: 2026-03-12
+updatedAt: 2026-06-23
 title: Intlayer Compiler | i18n के लिए स्वचालित सामग्री निष्कर्षण
 description: Intlayer Compiler के साथ अपने अंतरराष्ट्रीयकरण प्रक्रिया को स्वचालित करें। Vite, Next.js, और अन्य में तेज़, अधिक कुशल i18n के लिए सीधे अपने कंपोनेंट्स से सामग्री निकालें।
 keywords:
@@ -60,6 +60,8 @@ author: aymericzip
 
 ## उपयोग
 
+> The quickest way to wire the compiler in is the interactive setup: run `npx intlayer init --interactive` and select **Compiler**. On Vite there is nothing to configure — the compiler is plugged in directly through the `intlayerCompiler()` plugin. On Next.js the command scaffolds the `babel.config.js` shown below. The non-interactive `intlayer init` leaves the compiler setup untouched.
+
 <Tabs>
  <Tab value='vite'>
 

package/docs/hi/configuration.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2024-08-13
-updatedAt: 2026-06-17
+updatedAt: 2026-06-23
 title: कॉन्फ़िगरेशन (Configuration)
 description: जानें कि अपने एप्लिकेशन के लिए Intlayer को कैसे कॉन्फ़िगर करें। Intlayer को अपनी आवश्यकताओं के अनुसार अनुकूलित करने के लिए उपलब्ध विभिन्न सेटिंग्स और विकल्पों को समझें।
 keywords:
@@ -14,6 +14,9 @@ slugs:
   - concept
   - configuration
 history:
+  - version: 9.0.0
+    date: 2026-06-24
+    changes: "Add `enableProxy` option to the routing configuration"
   - version: 8.10.0
     date: 2026-06-17
     changes: "शब्दकोश कॉन्फ़िगरेशन में `format` विकल्प जोड़ा गया"
@@ -875,6 +878,21 @@ export default config;
 
 ---
 
+### System Configuration
+
+Intlayer के आंतरिक पथ और आउटपुट परिणामों से संबंधित सेटिंग्स। ये सेटिंग्स आम तौर पर आंतरिक हैं और उपयोगकर्ता द्वारा संशोधित करने की आवश्यकता नहीं होनी चाहिए।
+
+| Field                     | Description                                                                                 | Type     | Default                           | Example              | Note                                                                       |
+| ------------------------- | ------------------------------------------------------------------------------------------- | -------- | --------------------------------- | -------------------- | -------------------------------------------------------------------------- |
+| `baseDir`                 | प्रोजेक्ट के लिए बेस डायरेक्टरी।                                                            | `string` | `process.cwd()`                   | `'/path/to/project'` | सभी Intlayer-संबंधित डायरेक्टरी को resolve करने के लिए उपयोग किया जाता है। |
+| `dictionariesDir`         | लोकलाइजेशन डिक्शनरी को स्टोर करने के लिए डायरेक्टरी पथ।                                     | `string` | `'.intlayer/dictionary'`          |                      |                                                                            |
+| `moduleAugmentationDir`   | Module augmentation के लिए डायरेक्टरी, जो बेहतर IDE सुझाव और टाइप चेकिंग की अनुमति देती है। | `string` | `'.intlayer/types'`               | `'intlayer-types'`   | सुनिश्चित करें कि यह `tsconfig.json` में शामिल है।                         |
+| `unmergedDictionariesDir` | अनमर्ज्ड डिक्शनरी को स्टोर करने के लिए डायरेक्टरी।                                          | `string` | `'.intlayer/unmerged_dictionary'` |                      |                                                                            |
+| `typesDir`                | डिक्शनरी प्रकार को स्टोर करने के लिए डायरेक्टरी।                                            | `string` | `'.intlayer/types'`               |                      |                                                                            |
+| `mainDir`                 | डायरेक्टरी जहां मुख्य एप्लिकेशन फाइलें स्टोर की जाती हैं।                                   | `string` | `'.intlayer/main'`                |                      |                                                                            |
+| `configDir`               | डायरेक्टरी जहां कॉन्फ़िगरेशन फाइलें स्टोर की जाती हैं।                                      | `string` | `'.intlayer/config'`              |                      |                                                                            |
+| `cacheDir`                | डायरेक्टरी जहां कैश फाइलें स्टोर की जाती हैं।                                               | `string` | `'.intlayer/cache'`               |                      |                                                                            |
+
 ### डिक्शनरी कॉन्फ़िगरेशन (Dictionary)
 
 डिक्शनरी संचालन को नियंत्रित करने वाले मापदंड, जिसमें ऑटो-फिल व्यवहार और कंटेंट जनरेशन शामिल है।
@@ -983,22 +1001,6 @@ Intlayer आपके एप्लिकेशन के अंतर्रा
 
 ---
 
-### सिस्टम कॉन्फ़िगरेशन (System)
-
-ये सेटिंग्स उन्नत उपयोग के मामलों और Intlayer के आंतरिक कॉन्फ़िगरेशन के लिए अभिप्रेत हैं।
-
-| फ़ील्ड                    | विवरण                                                      | टाइप     | डिफ़ॉल्ट                          | उदाहरण | टिप्पणी |
-| ------------------------- | ---------------------------------------------------------- | -------- | --------------------------------- | ------ | ------- |
-| `dictionariesDir`         | संकलित डिक्शनरी के लिए निर्देशिका।                         | `string` | `'.intlayer/dictionary'`          |        |         |
-| `moduleAugmentationDir`   | TypeScript मॉड्यूल ऑगमेंटेशन के लिए निर्देशिका।            | `string` | `'.intlayer/types'`               |        |         |
-| `unmergedDictionariesDir` | बिना मर्ज किए गए डिक्शनरी संग्रहीत करने के लिए निर्देशिका। | `string` | `'.intlayer/unmerged_dictionary'` |        |         |
-| `typesDir`                | जेनरेट किए गए टाइप्स के लिए निर्देशिका।                    | `string` | `'.intlayer/types'`               |        |         |
-| `mainDir`                 | Intlayer की मुख्य फ़ाइल की निर्देशिका।                     | `string` | `'.intlayer/main'`                |        |         |
-| `configDir`               | संकलित कॉन्फ़िगरेशन फ़ाइलों की निर्देशिका।                 | `string` | `'.intlayer/config'`              |        |         |
-| `cacheDir`                | कैश फ़ाइलों के लिए निर्देशिका।                             | `string` | `'.intlayer/cache'`               |        |         |
-
----
-
 ### कंपाइलर कॉन्फ़िगरेशन (Compiler)
 
 Intlayer कंपाइलर को नियंत्रित करने वाली सेटिंग्स, जो आपके घटकों से सीधे डिक्शनरी निकालती है।

package/docs/hi/custom_domains.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2026-04-02
-updatedAt: 2026-04-02
+updatedAt: 2026-06-23
 title: कस्टम डोमेन (Custom Domains)
 description: समर्पित होस्टनेम से विभिन्न लोकेल (locales) की सेवा के लिए Intlayer में डोमेन-आधारित लोकेल रूटिंग कॉन्फ़िगर करना सीखें।
 keywords:

package/docs/hi/custom_url_rewrites.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2024-08-13
-updatedAt: 2026-01-26
+updatedAt: 2026-06-23
 title: कस्टम URL रीराइट्स
 description: यह जानें कि Intlayer में लोकल-विशिष्ट पथ निर्धारित करने के लिए कस्टम URL रीराइट्स को कैसे कॉन्फ़िगर और उपयोग करें।
 keywords:

package/docs/hi/dictionary/enumeration.md

@@ -468,193 +468,6 @@ document.getElementById("ranking")!.textContent = content.ordinal(lastDigit)({
   </Tab>
 </Tabs>
 
-## Combining Enumeration with Insert for Ordinal Numbers
-
-<Tabs group="framework">
-  <Tab label="React" value="react">
-
-To use enumeration in a React component, you can leverage the `useIntlayer` hook from the `react-intlayer` package. This hook retrieves the correct content based on the specified ID. Here's an example of how to use it:
-
-```tsx fileName="**/*.tsx" codeFormat={["typescript", "esm"]}
-import type { FC } from "react";
-import { useIntlayer } from "react-intlayer";
-
-const CarComponent: FC = () => {
-  const { numberOfCar } = useIntlayer("car_count");
-
-  return (
-    <div>
-      <p>
-        {
-          numberOfCar(0) // Output: No cars
-        }
-      </p>
-      <p>
-        {
-          numberOfCar(6) // Output: Some cars
-        }
-      </p>
-      <p>
-        {
-          numberOfCar(20) // Output: Many cars
-        }
-      </p>
-      <p>
-        {
-          numberOfCar(0.01) // Output: Fallback value
-        }
-      </p>
-    </div>
-  );
-};
-```
-
-  </Tab>
-  <Tab label="Next.js" value="nextjs">
-
-To use enumeration in Next.js Client Components, retrieve it via the `useIntlayer` hook. Here's an example:
-
-```tsx fileName="**/*.tsx" codeFormat={["typescript", "esm"]}
-"use client";
-
-import type { FC } from "react";
-import { useIntlayer } from "next-intlayer";
-
-const CarComponent: FC = () => {
-  const { numberOfCar } = useIntlayer("car_count");
-
-  return (
-    <div>
-      <p>{numberOfCar(6)}</p>
-    </div>
-  );
-};
-
-export default CarComponent;
-```
-
-  </Tab>
-  <Tab label="Vue" value="vue">
-
-To use enumeration in Vue components, retrieve it via the `useIntlayer` hook. Here's an example:
-
-```vue fileName="**/*.vue"
-<script setup lang="ts">
-import { useIntlayer } from "vue-intlayer";
-
-const { numberOfCar } = useIntlayer("car_count");
-</script>
-
-<template>
-  <div>
-    <p>{{ numberOfCar(6) }}</p>
-  </div>
-</template>
-```
-
-  </Tab>
-  <Tab label="Svelte" value="svelte">
-
-To use enumeration in Svelte components, retrieve it via the `useIntlayer` hook. The store is accessed with `$`. Here's an example:
-
-```svelte fileName="**/*.svelte"
-<script lang="ts">
-import { useIntlayer } from "svelte-intlayer";
-
-const content = useIntlayer("car_count");
-</script>
-
-<div>
-  <p>{$content.numberOfCar(6)}</p>
-</div>
-```
-
-  </Tab>
-  <Tab label="Preact" value="preact">
-
-To use enumeration in Preact components, retrieve it via the `useIntlayer` hook. Here's an example:
-
-```tsx fileName="**/*.tsx" codeFormat={["typescript", "esm"]}
-import type { FC } from "preact";
-import { useIntlayer } from "preact-intlayer";
-
-const CarComponent: FC = () => {
-  const { numberOfCar } = useIntlayer("car_count");
-
-  return (
-    <div>
-      <p>{numberOfCar(6)}</p>
-    </div>
-  );
-};
-
-export default CarComponent;
-```
-
-  </Tab>
-  <Tab label="Solid" value="solid">
-
-To use enumeration in SolidJS components, retrieve it via the `useIntlayer` hook. Here's an example:
-
-```tsx fileName="**/*.tsx" codeFormat={["typescript", "esm"]}
-import type { Component } from "solid-js";
-import { useIntlayer } from "solid-intlayer";
-
-const CarComponent: Component = () => {
-  const { numberOfCar } = useIntlayer("car_count");
-
-  return (
-    <div>
-      <p>{numberOfCar(6)}</p>
-    </div>
-  );
-};
-
-export default CarComponent;
-```
-
-  </Tab>
-  <Tab label="Angular" value="angular">
-
-To use enumeration in Angular components, retrieve it via the `useIntlayer` hook. Here's an example:
-
-```typescript fileName="app.component.ts" codeFormat="typescript"
-import { Component } from "@angular/core";
-import { useIntlayer } from "angular-intlayer";
-
-@Component({
-  selector: "app-car",
-  template: `
-    <div>
-      <p>{{ content().numberOfCar(6) }}</p>
-    </div>
-  `,
-})
-export class CarComponent {
-  content = useIntlayer("car_count");
-}
-```
-
-  </Tab>
-  <Tab label="Vanilla JS" value="vanilla">
-
-To use enumeration with `vanilla-intlayer`, retrieve it via the `useIntlayer` hook. Here's an example:
-
-```typescript fileName="**/*.ts" codeFormat={["typescript", "esm"]}
-import { installIntlayer, useIntlayer } from "vanilla-intlayer";
-
-installIntlayer();
-
-const content = useIntlayer("car_count").onChange((newContent) => {
-  document.getElementById("cars")!.textContent = newContent.numberOfCar(6);
-});
-
-// Initial render
-document.getElementById("cars")!.textContent = content.numberOfCar(6);
-```
-
-  </Tab>
-</Tabs>
 ## Additional Resources
 
 For more detailed information on configuration and usage, refer to the following resources:

package/docs/hi/dictionary/file.md

@@ -255,6 +255,14 @@ export default myMultilingualContent;
 
 यह सेटअप उपयोगकर्ता की भाषा प्राथमिकता के आधार पर सामग्री को गतिशील रूप से पुनः प्राप्त करने की अनुमति देता है। जब इसे Intlayer विज़ुअल एडिटर या CMS में उपयोग किया जाता है, तो सिस्टम यह पहचान लेगा कि सामग्री निर्दिष्ट Markdown फ़ाइलों से आती है और सुनिश्चित करेगा कि वे संपादन योग्य बनी रहें।
 
+## विभिन्न प्रकार के पाथ
+
+`file` फ़ंक्शन का उपयोग करते समय, आप एम्बेड करने के लिए फ़ाइल को निर्दिष्ट करने के लिए विभिन्न प्रकार के पाथ का उपयोग कर सकते हैं।
+
+- `file("./path/to/file.txt")` - वर्तमान फ़ाइल के सापेक्ष पाथ
+- `file("path/to/file.txt")` - प्रोजेक्ट रूट डायरेक्टरी के सापेक्ष पाथ
+- `file("/users/username/path/to/file.txt")` - पूर्ण पाथ
+
 ## Intlayer फ़ाइल सामग्री को कैसे संभालता है
 
 `file` फ़ंक्शन Node.js के `fs` मॉड्यूल पर आधारित है जो निर्दिष्ट फ़ाइल की सामग्री को पढ़ता है और इसे शब्दकोश में सम्मिलित करता है। जब इसे Intlayer विज़ुअल एडिटर या CMS के साथ संयोजन में उपयोग किया जाता है, तो Intlayer शब्दकोश और फ़ाइल के बीच संबंध को ट्रैक कर सकता है। इससे Intlayer को निम्नलिखित करने की अनुमति मिलती है:

package/docs/hi/dictionary/nesting.md

@@ -25,6 +25,45 @@ author: aymericzip
 
 Intlayer में, नेस्टिंग `nest` फ़ंक्शन के माध्यम से प्राप्त की जाती है, जो आपको किसी अन्य शब्दकोश से सामग्री को संदर्भित करने और पुन: उपयोग करने की अनुमति देता है। सामग्री को डुप्लिकेट करने के बजाय, आप मौजूदा सामग्री मॉड्यूल को उसकी कुंजी द्वारा इंगित कर सकते हैं।
 
+## नेस्टिंग सेटअप करना
+
+अपने Intlayer प्रोजेक्ट में नेस्टिंग सेटअप करने के लिए, आप पहले वह आधार सामग्री परिभाषित करते हैं जिसे आप दोबारा उपयोग करना चाहते हैं। फिर, एक अलग सामग्री मॉड्यूल में, आप उस सामग्री को import करने के लिए `nest` फ़ंक्शन का उपयोग करते हैं।
+
+### Base Dictionary
+
+नीचे एक base dictionary का उदाहरण दिया गया है जिसे किसी दूसरे dictionary में nest किया जा सकता है:
+
+```typescript fileName="firstDictionary.content.ts" contentDeclarationFormat={["typescript", "esm", "commonjs"]}
+import { type Dictionary } from "intlayer";
+
+const firstDictionary = {
+  key: "key_of_my_first_dictionary",
+  content: {
+    content: "content",
+    subContent: {
+      contentNumber: 0,
+      contentString: "string",
+    },
+  },
+} satisfies Dictionary;
+
+export default firstDictionary;
+```
+
+```json fileName="firstDictionary.content.json" contentDeclarationFormat="json"
+{
+  "$schema": "https://intlayer.org/schema.json",
+  "key": "key_of_my_first_dictionary",
+  "content": {
+    "content": "content",
+    "subContent": {
+      "contentNumber": 0,
+      "contentString": "string"
+    }
+  }
+}
+```
+
 ## नेस्टिंग सेट करना
 
 <Tabs group="framework">

package/docs/hi/dictionary/translation.md

@@ -259,64 +259,3 @@ document.getElementById("welcome-message")!.textContent = String(
 
   </Tab>
 </Tabs>
-
-## कस्टम कंटेंट ऑब्जेक्ट्स
-
-`intlayer` अनुवाद के लिए कस्टम कंटेंट ऑब्जेक्ट्स का समर्थन करता है, जिससे आप अधिक जटिल संरचनाओं को परिभाषित कर सकते हैं और टाइप सुरक्षा सुनिश्चित कर सकते हैं। यहाँ एक कस्टम ऑब्जेक्ट के साथ उदाहरण दिया गया है:
-
-```typescript fileName="**/*.content.ts" contentDeclarationFormat={["typescript", "esm", "commonjs"]}
-import { t, type Dictionary } from "intlayer";
-
-interface ICustomContent {
-  title: string;
-  content: string;
-}
-
-const customContent = {
-  key: "custom_content",
-  content: {
-    profileText: t<ICustomContent>({
-      en: {
-        title: "Page Title",
-        content: "Page Content",
-      },
-      fr: {
-        title: "Titre de la Page",
-        content: "Contenu de la Page",
-      },
-      es: {
-        title: "Título de la Página",
-        content: "Contenido de la Página",
-      },
-    }),
-  },
-} satisfies Dictionary;
-
-export default customContent;
-```
-
-```json fileName="**/*.content.json" contentDeclarationFormat="json"
-{
-  "$schema": "https://intlayer.org/schema.json",
-  "key": "custom_content",
-  "content": {
-    "profileText": {
-      "nodeType": "translation",
-      "translation": {
-        "en": {
-          "title": "Page Title",
-          "content": "पृष्ठ सामग्री"
-        },
-        "fr": {
-          "title": "पृष्ठ का शीर्षक",
-          "content": "पृष्ठ की सामग्री"
-        },
-        "es": {
-          "title": "पृष्ठ का शीर्षक",
-          "content": "पृष्ठ की सामग्री"
-        }
-      }
-    }
-  }
-}
-```

package/docs/hi/formatters.md

@@ -40,12 +40,16 @@ history:
 author: aymericzip
 ---
 
+# Intlayer Formatters
+
 # Intlayer फॉर्मेटर्स
 
 ## अवलोकन
 
 Intlayer नेटिव `Intl` APIs के ऊपर बनाए गए हल्के हेल्पर्स का एक सेट प्रदान करता है, साथ ही भारी फॉर्मेटर्स को बार-बार बनाने से बचने के लिए एक कैश्ड `Intl` रैपर भी शामिल है। ये यूटिलिटीज पूरी तरह से लोकल-आधारित हैं और मुख्य `intlayer` पैकेज से उपयोग की जा सकती हैं।
 
+## React Formatters
+
 ### आयात
 
 ```ts
@@ -133,6 +137,8 @@ const regionNames = new Intl.DisplayNames("fr", { type: "region" });
 regionNames.of("US"); // "États-Unis"
 ```
 
+## Vue Formatters
+
 ### `Intl.Collator`
 
 स्थानीय भाषा के अनुसार स्ट्रिंग की तुलना और क्रमबद्धता के लिए:
@@ -149,6 +155,61 @@ const words = ["äpfel", "zebra", "100", "20"];
 words.sort(collator.compare); // ["20", "100", "äpfel", "zebra"]
 ```
 
+### उपलब्ध Composables
+
+सभी composables computed refs return करते हैं जो injected `IntlayerProvider` से locale को स्वचालित रूप से उपयोग करते हैं।
+
+| Composable          | Description                                  | Example Output                |
+| ------------------- | -------------------------------------------- | ----------------------------- |
+| `useNumber()`       | grouping के साथ संख्याओं को format करें      | `"123,456.789"`               |
+| `useCurrency()`     | currency values को format करें               | `"€1,234.50"`                 |
+| `usePercentage()`   | प्रतिशत को format करें                       | `"25%"`                       |
+| `useDate()`         | तारीखों और समय को format करें                | `"Aug 2, 2025"`               |
+| `useRelativeTime()` | सापेक्ष समय को format करें                   | `"in 3 days"`                 |
+| `useUnit()`         | units के साथ values को format करें           | `"5 kilometers"`              |
+| `useCompact()`      | compact notation में संख्याओं को format करें | `"1.2K"`                      |
+| `useList()`         | arrays को lists के रूप में format करें       | `"apple, banana, and orange"` |
+| `useIntl()`         | locale-bound `Intl` object प्राप्त करें      | Full `Intl` API access        |
+
+### पूर्ण उदाहरण
+
+```vue
+<script setup>
+import {
+  useNumber,
+  useCurrency,
+  useDate,
+  usePercentage,
+  useCompact,
+  useList,
+  useRelativeTime,
+  useUnit,
+} from "vue-intlayer/format";
+
+const number = useNumber();
+const currency = useCurrency();
+const date = useDate();
+const percentage = usePercentage();
+const compact = useCompact();
+const list = useList();
+const relativeTime = useRelativeTime();
+const unit = useUnit();
+</script>
+
+<template>
+  <div>
+    <p>{{ number.value(123456.789) }}</p>
+    <p>{{ currency.value(1234.5, { currency: "EUR" }) }}</p>
+    <p>{{ date.value(new Date(), "short") }}</p>
+    <p>{{ percentage.value(0.25) }}</p>
+    <p>{{ compact.value(1200) }}</p>
+    <p>{{ list.value(["apple", "banana", "orange"]) }}</p>
+    <p>{{ relativeTime.value(new Date(), new Date(Date.now() + 86400000)) }}</p>
+    <p>{{ unit.value(5, { unit: "kilometer" }) }}</p>
+  </div>
+</template>
+```
+
 ### `Intl.PluralRules`
 
 विभिन्न स्थानीय भाषाओं में बहुवचन रूप निर्धारित करने के लिए:
@@ -164,6 +225,26 @@ pluralRules.select(3); // "few" (कुछ)
 pluralRules.select(11); // "many" (कई)
 ```
 
+## Vanilla JS / Node.js Formatters
+
+गैर-framework संदर्भों के लिए, `intlayer` से सीधे formatters को import करें। ध्यान दें कि आपको locale को manually pass करना होगा।
+
+### Import
+
+```ts
+import {
+  number,
+  percentage,
+  currency,
+  date,
+  relativeTime,
+  units,
+  compact,
+  list,
+  Intl,
+} from "intlayer";
+```
+
 ## स्थानीय उपयोगिताएँ
 
 ### `getLocaleName(displayLocale, targetLocale?)`
@@ -481,6 +562,10 @@ list(["red", "green", "blue"], { locale: "fr", type: "disjunction" }); // "rouge
 list([1, 2, 3], { type: "unit" }); // "1, 2, 3"
 ```
 
+## Content Handling Utilities
+
+सामग्री हैंडलिंग यूटिलिटीज
+
 ## नोट्स
 
 - सभी हेल्पर `string` इनपुट स्वीकार करते हैं; उन्हें आंतरिक रूप से संख्याओं या तिथियों में परिवर्तित किया जाता है।

package/docs/hi/how_works_intlayer.md

@@ -22,6 +22,8 @@ author: aymericzip
 
 # Intlayer कैसे काम करता है
 
+# Intlayer कैसे काम करता है
+
 ## अवलोकन
 
 Intlayer के पीछे मुख्य विचार यह है कि प्रति-कंपोनेंट सामग्री प्रबंधन को अपनाया जाए। तो Intlayer का विचार यह है कि आपको अपनी सामग्री को अपनी कोडबेस में कहीं भी घोषित करने की अनुमति दी जाए, जैसे कि आपके कंपोनेंट के समान डायरेक्टरी में।