@intlayer/docs 9.5.6 → 9.5.7

package/docs/hi/dictionary/html.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2026-01-20
-updatedAt: 2026-01-22
+updatedAt: 2026-09-21
 title: HTML सामग्री
 description: जानें कि Intlayer में कस्टम कॉम्पोनेंट्स के साथ HTML सामग्री कैसे घोषित और उपयोग की जाती है। अपनी अंतर्राष्ट्रीयकृत परियोजना में गतिशील कॉम्पोनेंट प्रतिस्थापन के साथ समृद्ध HTML-जैसी सामग्री एम्बेड करने के लिए इस दस्तावेज़ का पालन करें।
 keywords:
@@ -13,6 +13,8 @@ keywords:
   - React
   - Vue
   - Svelte
+  - Remix
+  - Astro
 slugs:
   - doc
   - concept
@@ -236,6 +238,83 @@ HTML नोड पर `.use()` विधि का उपयोग करते
     ```
 
   </Tab>
+  <Tab label="Remix" value="remix">
+    Remix 3 में, HTML नोड्स एक HTML स्ट्रिंग में हल होते हैं। इसे Remix JSX के `innerHTML` प्रॉप के साथ, या `html-template` दृश्य में `html.raw` के साथ इंजेक्ट करें।
+
+    ```tsx fileName="src/views/home.tsx"
+    import { useIntlayer } from "remix-intlayer";
+
+    export const HomePage = () => () => {
+      const { myHtmlContent } = useIntlayer("app");
+
+      return <div innerHTML={myHtmlContent.value} />;
+    };
+    ```
+
+    ```ts fileName="src/views/home.ts"
+    import { html } from "remix/html-template";
+    import { useIntlayer } from "remix-intlayer";
+
+    export const renderHomePage = () => {
+      const { myHtmlContent } = useIntlayer("app");
+
+      return html.raw`<div>${myHtmlContent.value}</div>`;
+    };
+    ```
+
+    > Remix डिफ़ॉल्ट रूप से इंटरपोलेटेड मानों को एस्केप करता है। `innerHTML` और `html.raw` दो ऑप्ट-आउट हैं, जो एक HTML स्ट्रिंग की आवश्यकता है।
+
+    टैग को ओवरराइड करने या कस्टम घटकों को मैप करने के लिए `.use()` विधि का उपयोग करें। ओवरराइड ऐसे फ़ंक्शन हैं जो एक HTML स्ट्रिंग लौटाते हैं:
+
+    ```tsx
+    <div
+      innerHTML={myHtmlContent.use({
+        p: ({ children }) => `<p class="prose">${children}</p>`,
+        CustomLink: ({ children }) => `<a href="/details">${children}</a>`,
+      })}
+    />
+    ```
+
+  </Tab>
+  <Tab label="Astro" value="astro">
+    Astro में, HTML नोड्स एक HTML स्ट्रिंग में हल होते हैं। इसे टेम्पलेट में `set:html` निर्देश के साथ, या क्लाइंट `<script>` में `innerHTML` के साथ इंजेक्ट करें।
+
+    ```astro fileName="src/pages/index.astro"
+    ---
+    import { useIntlayer } from "astro-intlayer";
+
+    const { myHtmlContent } = useIntlayer("app");
+    ---
+
+    <div set:html={myHtmlContent.value} />
+    ```
+
+    ```astro fileName="src/components/Content.astro"
+    <div id="content"></div>
+
+    <script>
+      import { useIntlayer } from "astro-intlayer";
+
+      const { myHtmlContent } = useIntlayer("app");
+
+      document.querySelector("#content")!.innerHTML = myHtmlContent.value;
+    </script>
+    ```
+
+    > Astro डिफ़ॉल्ट रूप से `{अभिव्यक्तियों}` को एस्केप करता है। `set:html` ऑप्ट-आउट है, जो एक HTML स्ट्रिंग की आवश्यकता है।
+
+    टैग को ओवरराइड करने या कस्टम घटकों को मैप करने के लिए `.use()` विधि का उपयोग करें। ओवरराइड ऐसे फ़ंक्शन हैं जो एक HTML स्ट्रिंग लौटाते हैं:
+
+    ```astro
+    <div
+      set:html={myHtmlContent.use({
+        p: ({ children }) => `<p class="prose">${children}</p>`,
+        CustomLink: ({ children }) => `<a href="/details">${children}</a>`,
+      })}
+    />
+    ```
+
+  </Tab>
 </Tabs>
 
 ## `HTMLProvider` के साथ वैश्विक कॉन्फ़िगरेशन
@@ -471,6 +550,41 @@ HTML नोड पर `.use()` विधि का उपयोग करते
     > अपने HTML renderer को dynamically import करना आपके application के bundle size को कम करने का एक अच्छा तरीका है।
 
   </Tab>
+  <Tab label="Remix" value="remix">
+
+    Remix में प्रोवाइडर रखने के लिए कोई कंपोनेंट ट्री नहीं है, इसलिए सर्वर प्रारंभ होने पर कॉन्फ़िगरेशन एक सिंगलटन के रूप में एक बार स्थापित होता है। यह `useHTMLRenderer()` द्वारा लौटाए गए रेंडरर को कॉन्फ़िगर करता है। `useIntlayer` द्वारा लौटाए गए `html` नोड्स यथावत प्रस्तुत किए जाते हैं; प्रति नोड उनके टैग को `.use()` के साथ ओवरराइड करें।
+
+    ```typescript fileName="src/router.ts"
+    import { installIntlayerHTML } from "remix-intlayer/html";
+
+    installIntlayerHTML({
+      renderHTML: (html) => html.replaceAll("<p>", '<p class="prose">'),
+    });
+    ```
+
+    > रेंडरर को लेज़ी लोड करने के लिए `installIntlayerHTMLDynamic(async () => …)` का उपयोग करें; लोडर केवल पहले कॉल पर चलता है।
+
+  </Tab>
+  <Tab label="Astro" value="astro">
+
+    Astro में प्रोवाइडर रखने के लिए कोई कंपोनेंट ट्री नहीं है, इसलिए कॉन्फ़िगरेशन मिडलवेयर (सर्वर) और क्लाइंट `<script>` (ब्राउज़र) में सिंगलटन के रूप में एक बार स्थापित होता है। यह `useHTMLRenderer()` द्वारा लौटाए गए रेंडरर को कॉन्फ़िगर करता है। `useIntlayer` द्वारा लौटाए गए `html` नोड्स यथावत प्रस्तुत किए जाते हैं; प्रति नोड उनके टैग को `.use()` के साथ ओवरराइड करें।
+
+    ```typescript fileName="src/middleware.ts"
+    import { installIntlayerHTML } from "astro-intlayer/html";
+    import { defineMiddleware } from "astro:middleware";
+
+    // सर्वर प्रारंभ होने पर एक बार चलता है; Intlayer मिडलवेयर स्वयं इस फ़ाइल से
+    // पहले एकीकरण द्वारा पंजीकृत होता है।
+    installIntlayerHTML({
+      renderHTML: (html) => html.replaceAll("<p>", '<p class="prose">'),
+    });
+
+    export const onRequest = defineMiddleware((_context, next) => next());
+    ```
+
+    > रेंडरर को लेज़ी लोड करने के लिए `installIntlayerHTMLDynamic(async () => …)` का उपयोग करें; लोडर केवल पहले कॉल पर चलता है।
+
+  </Tab>
 </Tabs>
 
 ### मैनुअल रेंडरिंग और उन्नत टूल्स
@@ -643,15 +757,69 @@ HTML नोड पर `.use()` विधि का उपयोग करते
     ```
 
   </Tab>
+  <Tab label="Remix" value="remix">
+    #### `useHTMLRenderer()` हुक
+
+    `installIntlayerHTML()` द्वारा पूर्व-कॉन्फ़िगर किया गया रेंडरर फ़ंक्शन प्राप्त करें। यह एक HTML स्ट्रिंग लौटाता है।
+
+    ```tsx
+    import { useHTMLRenderer } from "remix-intlayer/html";
+
+    const renderHTML = useHTMLRenderer();
+
+    return <div innerHTML={renderHTML("<p>Hello <strong>World</strong></p>")} />;
+    ```
+
+    #### `renderHTML()` यूटिलिटी
+
+    स्टैंडअलोन यूटिलिटी जो वैश्विक कॉन्फ़िगरेशन को अनदेखा करती है।
+
+    ```tsx
+    import { renderHTML } from "remix-intlayer/html";
+
+    const html = renderHTML("<p>Hello</p>");
+    ```
+
+  </Tab>
+  <Tab label="Astro" value="astro">
+    #### `useHTMLRenderer()` हुक
+
+    `installIntlayerHTML()` द्वारा पूर्व-कॉन्फ़िगर किया गया रेंडरर फ़ंक्शन प्राप्त करें। यह एक HTML स्ट्रिंग लौटाता है।
+
+    ```astro
+    ---
+    import { useHTMLRenderer } from "astro-intlayer/html";
+
+    const renderHTML = useHTMLRenderer();
+    ---
+
+    <div set:html={renderHTML("<p>Hello <strong>World</strong></p>")} />
+    ```
+
+    #### `renderHTML()` यूटिलिटी
+
+    स्टैंडअलोन यूटिलिटी जो वैश्विक कॉन्फ़िगरेशन को अनदेखा करती है।
+
+    ```astro
+    ---
+    import { renderHTML } from "astro-intlayer/html";
+
+    const html = renderHTML("<p>Hello</p>");
+    ---
+
+    <div set:html={html} />
+    ```
+
+  </Tab>
 </Tabs>
 
 ## विकल्प संदर्भ
 
 इन विकल्पों को `HTMLProvider`, `HTMLRenderer`, `useHTMLRenderer`, और `renderHTML` को पास किया जा सकता है।
 
-| विकल्प       | प्रकार                | डिफ़ॉल्ट | विवरण                                                                                                          |
-| :----------- | :-------------------- | :------- | :------------------------------------------------------------------------------------------------------------- |
-| `components` | `Record<string, any>` | `{}`     | HTML टैग्स या कस्टम कॉम्पोनेंट नामों को कॉम्पोनेंट्स से मैप करने वाला ऑब्जेक्ट।                                |
-| `renderHTML` | `Function`            | `null`   | डिफ़ॉल्ट HTML पार्सर को पूरी तरह से बदलने के लिए एक कस्टम रेंडरिंग फ़ंक्शन (केवल Vue/Svelte providers के लिए)। |
+| विकल्प       | प्रकार                | डिफ़ॉल्ट | विवरण                                                                                                             |
+| :----------- | :-------------------- | :------- | :---------------------------------------------------------------------------------------------------------------- |
+| `components` | `Record<string, any>` | `{}`     | HTML टैग्स या कस्टम कॉम्पोनेंट नामों को कॉम्पोनेंट्स से मैप करने वाला ऑब्जेक्ट।                                   |
+| `renderHTML` | `Function`            | `null`   | डिफ़ॉल्ट HTML पार्सर को पूरी तरह से बदलने के लिए एक कस्टम रेंडरिंग फ़ंक्शन (Vue, Svelte, Remix और Astro प्रदाता)। |
 
 > नोट: React और Preact के लिए, मानक HTML टैग्स स्वतः प्रदान किए जाते हैं। केवल तभी आपको `components` prop पास करने की आवश्यकता होती है जब आप उन्हें ओवरराइड करना या कस्टम कॉम्पोनेंट जोड़ना चाहें।

package/docs/hi/dictionary/markdown.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2025-02-07
-updatedAt: 2026-05-19
+updatedAt: 2026-09-21
 title: Markdown
 description: Intlayer के साथ अपनी बहुभाषी वेबसाइट में Markdown सामग्री घोषित करने और उसका उपयोग करने का तरीका जानें। अपने प्रोजेक्ट में Markdown को समेकित रूप से एकीकृत करने के लिए इस ऑनलाइन दस्तावेज़ में दिए गए चरणों का पालन करें।
 keywords:
@@ -11,6 +11,8 @@ keywords:
   - Next.js
   - JavaScript
   - React
+  - Remix
+  - Astro
 slugs:
   - doc
   - concept
@@ -487,6 +489,111 @@ Markdown रेंडरिंग **MDX** का समर्थन करता
     ```
 
   </Tab>
+  <Tab label="Remix" value="remix">
+    Remix 3 में, Markdown नोड्स सर्वर पर एक HTML स्ट्रिंग में रेंडर होते हैं। इसे Remix JSX के `innerHTML` प्रॉप के साथ, या `html-template` दृश्य में `html.raw` के साथ इंजेक्ट करें।
+
+    ```tsx fileName="src/views/home.tsx"
+    import { useIntlayer } from "remix-intlayer";
+
+    export const HomePage = () => () => {
+      const { myMarkdownContent } = useIntlayer("app");
+
+      return <div innerHTML={myMarkdownContent.value} />;
+    };
+    ```
+
+    ```ts fileName="src/views/home.ts"
+    import { html } from "remix/html-template";
+    import { useIntlayer } from "remix-intlayer";
+
+    export const renderHomePage = () => {
+      const { myMarkdownContent } = useIntlayer("app");
+
+      return html.raw`<div>${myMarkdownContent.value}</div>`;
+    };
+    ```
+
+    > Remix डिफ़ॉल्ट रूप से इंटरपोलेटेड मानों को एस्केप करता है। `innerHTML` और `html.raw` दो ऑप्ट-आउट हैं, जो एक रेंडर किए गए Markdown स्ट्रिंग की आवश्यकता है।
+
+    आप `.use()` विधि का उपयोग करके विशिष्ट टैग के लिए स्थानीय ओवरराइड भी प्रदान कर सकते हैं। ओवरराइड ऐसे फ़ंक्शन हैं जो एक HTML स्ट्रिंग लौटाते हैं:
+
+    ```tsx
+    <div
+      innerHTML={myMarkdownContent.use({
+        h1: ({ children }) => `<h1 class="text-3xl font-bold">${children}</h1>`,
+      })}
+    />
+    ```
+
+    `.value` रेंडर किया गया HTML स्ट्रिंग है, जबकि `String()` / `.toString()` कच्चा Markdown स्रोत वापस देते हैं:
+
+    ```tsx
+    myMarkdownContent.value // "<h1>…</h1>"
+    String(myMarkdownContent) // "# …"
+    myMarkdownContent.toString() // "# …"
+    ```
+
+    और आप अपने markdown मेटाडेटा को इस तरह एक्सेस कर सकते हैं:
+
+    ```tsx
+    myMarkdownContent.metadata
+    myMarkdownContent.metadata.title
+    ```
+
+  </Tab>
+  <Tab label="Astro" value="astro">
+    Astro में, Markdown नोड्स एक HTML स्ट्रिंग में रेंडर होते हैं। इसे टेम्पलेट में `set:html` निर्देश के साथ, या क्लाइंट `<script>` में `innerHTML` के साथ इंजेक्ट करें।
+
+    ```astro fileName="src/pages/index.astro"
+    ---
+    import { useIntlayer } from "astro-intlayer";
+
+    const { myMarkdownContent } = useIntlayer("app");
+    ---
+
+    <div set:html={myMarkdownContent.value} />
+    ```
+
+    ```astro fileName="src/components/Content.astro"
+    <div id="content"></div>
+
+    <script>
+      import { useIntlayer } from "astro-intlayer";
+
+      const { myMarkdownContent } = useIntlayer("app");
+
+      document.querySelector("#content")!.innerHTML = myMarkdownContent.value;
+    </script>
+    ```
+
+    > Astro डिफ़ॉल्ट रूप से `{अभिव्यक्तियों}` को एस्केप करता है। `set:html` ऑप्ट-आउट है, जो एक रेंडर किए गए Markdown स्ट्रिंग की आवश्यकता है।
+
+    आप `.use()` विधि का उपयोग करके विशिष्ट टैग के लिए स्थानीय ओवरराइड भी प्रदान कर सकते हैं। ओवरराइड ऐसे फ़ंक्शन हैं जो एक HTML स्ट्रिंग लौटाते हैं:
+
+    ```astro
+    <div
+      set:html={myMarkdownContent.use({
+        h1: ({ children }) => `<h1 class="text-3xl font-bold">${children}</h1>`,
+      })}
+    />
+    ```
+
+    `.value` रेंडर किया गया HTML स्ट्रिंग है, जबकि `String()` / `.toString()` कच्चा Markdown स्रोत वापस देते हैं:
+
+    ```astro
+    myMarkdownContent.value // "<h1>…</h1>"
+    String(myMarkdownContent) // "# …"
+    myMarkdownContent.toString() // "# …"
+    ```
+
+    और आप अपने markdown मेटाडेटा को इस तरह एक्सेस कर सकते हैं:
+
+    ```astro
+    myMarkdownContent.metadata
+    myMarkdownContent.metadata.title
+    ```
+
+  </Tab>
 </Tabs>
 
 ### 2. हेल्पर यूटिलिटीज (केवल Markdown स्ट्रिंग्स)
@@ -698,6 +805,60 @@ Markdown रेंडरिंग **MDX** का समर्थन करता
     ```
 
   </Tab>
+  <Tab label="Remix" value="remix">
+    #### `useMarkdownRenderer()` हुक
+
+    `installIntlayerMarkdown()` द्वारा पूर्व-कॉन्फ़िगर किया गया रेंडरर फ़ंक्शन प्राप्त करें। यह एक HTML स्ट्रिंग लौटाता है।
+
+    ```tsx
+    import { useMarkdownRenderer } from "remix-intlayer/markdown";
+
+    const renderMarkdown = useMarkdownRenderer({ forceBlock: true });
+
+    return <div innerHTML={renderMarkdown("# My Title")} />;
+    ```
+
+    #### `renderMarkdown()` यूटिलिटी
+
+    स्टैंडअलोन यूटिलिटी जो वैश्विक कॉन्फ़िगरेशन को अनदेखा करती है।
+
+    ```tsx
+    import { renderMarkdown } from "remix-intlayer/markdown";
+
+    const html = renderMarkdown("# My Title", { forceBlock: true });
+    ```
+
+  </Tab>
+  <Tab label="Astro" value="astro">
+    #### `useMarkdownRenderer()` हुक
+
+    `installIntlayerMarkdown()` द्वारा पूर्व-कॉन्फ़िगर किया गया रेंडरर फ़ंक्शन प्राप्त करें। यह एक HTML स्ट्रिंग लौटाता है।
+
+    ```astro
+    ---
+    import { useMarkdownRenderer } from "astro-intlayer/markdown";
+
+    const renderMarkdown = useMarkdownRenderer({ forceBlock: true });
+    ---
+
+    <div set:html={renderMarkdown("# My Title")} />
+    ```
+
+    #### `renderMarkdown()` यूटिलिटी
+
+    स्टैंडअलोन यूटिलिटी जो वैश्विक कॉन्फ़िगरेशन को अनदेखा करती है।
+
+    ```astro
+    ---
+    import { renderMarkdown } from "astro-intlayer/markdown";
+
+    const html = renderMarkdown("# My Title", { forceBlock: true });
+    ---
+
+    <div set:html={html} />
+    ```
+
+  </Tab>
 </Tabs>
 
 ## `MarkdownProvider` के साथ ग्लोबल कॉन्फ़िगरेशन
@@ -997,6 +1158,73 @@ Markdown रेंडरिंग **MDX** का समर्थन करता
     > अपने Markdown रेंडरर को गतिशील रूप से आयात करना आपके एप्लिकेशन के बंडल आकार को कम करने का एक शानदार तरीका है।
 
   </Tab>
+  <Tab label="Remix" value="remix">
+
+    Remix में प्रोवाइडर रखने के लिए कोई कंपोनेंट ट्री नहीं है, इसलिए सर्वर प्रारंभ होने पर कॉन्फ़िगरेशन एक सिंगलटन के रूप में एक बार स्थापित होता है। यह `useMarkdownRenderer()` द्वारा लौटाए गए रेंडरर को कॉन्फ़िगर करता है। `useIntlayer` द्वारा लौटाए गए `md` नोड्स डिफ़ॉल्ट कंपाइलर के साथ रेंडर किए जाते हैं; प्रति नोड उनके टैग को `.use()` के साथ ओवरराइड करें।
+
+    ```typescript fileName="src/router.ts"
+    import { installIntlayerMarkdown } from "remix-intlayer/markdown";
+
+    installIntlayerMarkdown({
+      forceBlock: true,
+      components: {
+        h1: ({ children }) => `<h1 class="text-2xl font-bold">${children}</h1>`,
+      },
+    });
+    ```
+
+    आप अपने स्वयं के markdown रेंडरर का भी उपयोग कर सकते हैं:
+
+    ```typescript fileName="src/router.ts"
+    import { installIntlayerMarkdown } from "remix-intlayer/markdown";
+
+    installIntlayerMarkdown({
+      renderMarkdown: async (md) => {
+        const { marked } = await import("marked");
+        return marked(md) as string;
+      },
+    });
+    ```
+
+    > रेंडरर को लेज़ी लोड करने के लिए `installIntlayerMarkdownDynamic(async () => …)` का उपयोग करें; लोडर केवल पहले कॉल पर चलता है।
+
+  </Tab>
+  <Tab label="Astro" value="astro">
+
+    Astro में प्रोवाइडर रखने के लिए कोई कंपोनेंट ट्री नहीं है, इसलिए कॉन्फ़िगरेशन मिडलवेयर (सर्वर) और क्लाइंट `<script>` (ब्राउज़र) में सिंगलटन के रूप में एक बार स्थापित होता है। यह `useMarkdownRenderer()` द्वारा लौटाए गए रेंडरर को कॉन्फ़िगर करता है। `useIntlayer` द्वारा लौटाए गए `md` नोड्स डिफ़ॉल्ट कंपाइलर के साथ रेंडर किए जाते हैं; प्रति नोड उनके टैग को `.use()` के साथ ओवरराइड करें।
+
+    ```typescript fileName="src/middleware.ts"
+    import { installIntlayerMarkdown } from "astro-intlayer/markdown";
+    import { defineMiddleware } from "astro:middleware";
+
+    // सर्वर प्रारंभ होने पर एक बार चलता है; Intlayer मिडलवेयर स्वयं इस फ़ाइल से
+    // पहले एकीकरण द्वारा पंजीकृत होता है।
+    installIntlayerMarkdown({
+      forceBlock: true,
+      components: {
+        h1: ({ children }) => `<h1 class="text-2xl font-bold">${children}</h1>`,
+      },
+    });
+
+    export const onRequest = defineMiddleware((_context, next) => next());
+    ```
+
+    आप अपने स्वयं के markdown रेंडरर का भी उपयोग कर सकते हैं:
+
+    ```typescript fileName="src/middleware.ts"
+    import { installIntlayerMarkdown } from "astro-intlayer/markdown";
+
+    installIntlayerMarkdown({
+      renderMarkdown: async (md) => {
+        const { marked } = await import("marked");
+        return marked(md) as string;
+      },
+    });
+    ```
+
+    > रेंडरर को लेज़ी लोड करने के लिए `installIntlayerMarkdownDynamic(async () => …)` का उपयोग करें; लोडर केवल पहले कॉल पर चलता है।
+
+  </Tab>
 </Tabs>
 
 ## सस्पेंस (Suspense)
@@ -1325,6 +1553,40 @@ export class MyComponent {
     ```
 
   </Tab>
+  <Tab label="Remix" value="remix">
+
+    Remix 3 सर्वर पर रेंडर करता है और HTML स्ट्रीम करता है, इसलिए किसी भी AST को क्लाइंट में जाने की आवश्यकता नहीं होती है। एक बार पार्स करें, और पृष्ठ जहां भी बनाया गया है वहां AST रेंडर करें:
+
+    ```tsx fileName="src/views/article.tsx"
+    import { parseMarkdown, renderMarkdown } from "remix-intlayer/markdown";
+
+    // 1. मार्कडाउन को क्रमबद्ध करने योग्य AST में पार्स करें (उदा. मॉड्यूल लोड होने पर एक बार)
+    const ast = parseMarkdown("## My title \n\nLorem Ipsum");
+
+    export const ArticlePage = () => () => (
+      // 2. AST रेंडर करें: रेंडरर कच्चा स्ट्रिंग या पार्स किया गया AST स्वीकार करता है
+      <article innerHTML={renderMarkdown(ast)} />
+    );
+    ```
+
+  </Tab>
+  <Tab label="Astro" value="astro">
+
+    Astro पृष्ठ सर्वर पर रेंडर किए जाते हैं, इसलिए किसी भी AST को क्लाइंट में जाने की आवश्यकता नहीं होती है। फ्रंटमैटर में Markdown को पार्स करें और इसे `set:html` के साथ रेंडर करें:
+
+    ```astro fileName="src/pages/article.astro"
+    ---
+    import { parseMarkdown, renderMarkdown } from "astro-intlayer/markdown";
+
+    // 1. मार्कडाउन को क्रमबद्ध करने योग्य AST में पार्स करें
+    const ast = parseMarkdown("## My title \n\nLorem Ipsum");
+    ---
+
+    <!-- 2. AST रेंडर करें: रेंडरर कच्चा स्ट्रिंग या पार्स किया गया AST स्वीकार करता है -->
+    <article set:html={renderMarkdown(ast)} />
+    ```
+
+  </Tab>
 </Tabs>
 
 यह पैटर्न यह सुनिश्चित करता है कि मार्कडाउन पार्सिंग लॉजिक पूरी तरह से सर्वर पर निष्पादित हो, जिससे क्लाइंट-साइड निष्पादन समय काफी कम हो जाता है और प्रारंभिक हाइड्रेशन गति में सुधार होता है।

package/docs/hi/intlayer_with_analog.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2025-04-18
-updatedAt: 2026-05-31
+updatedAt: 2026-09-21
 title: "Analog i18n - अपने ऐप को अनुवाद करने का पूर्ण गाइड"
 description: "अब i18next की जरूरत नहीं। 2026 में Analog ऐप को बहुभाषी (i18n) बनाने का गाइड। AI एजेंट्स से अनुवाद करें और बंडल साइज़, SEO और परफॉर्मेंस ऑप्टिमाइज़ करें।"
 keywords:
@@ -157,6 +157,28 @@ bun add intlayer angular-intlayer vite-intlayer
 </Step>
 <Step number={2} title="अपने प्रोजेक्ट का कॉन्फ़िगरेशन">
 
+### आर्किटेक्चर
+
+इस आर्किटेक्चर में, `angular-intlayer` `provideIntlayer()` प्रदान करता है, जो `src/app/app.config.ts` में पंजीकृत होता है ताकि प्रत्येक कंपोनेंट और फ़ाइल-आधारित पेज `useIntlayer` सिग्नल के माध्यम से अपनी सामग्री पढ़ सके। Analog Vite पर आधारित है, इसलिए आपकी कंटेंट घोषणाओं को देखने, फिर से बनाने और लोकेल प्रॉक्सी चलाने के लिए `vite.config.ts` में `analog()` के बगल में `vite-intlayer` का `intlayer()` प्लगइन जोड़ा जाता है। कंटेंट घोषणाएं `src/app/` में कंपोनेंट्स और पेजों के साथ रखी जाती हैं।
+
+```bash
+.
+├── src
+│   ├── app
+│   │   ├── pages
+│   │   │   └── index.page.ts         # File-based route using useIntlayer
+│   │   ├── app.config.ts             # Application config with provideIntlayer()
+│   │   ├── app.content.ts            # App content declaration
+│   │   └── locale-switcher.component.ts
+│   └── main.ts
+├── intlayer.config.ts
+├── package.json
+├── tsconfig.json
+└── vite.config.ts                    # analog() and intlayer() Vite plugins
+```
+
+### कॉन्फ़िगरेशन
+
 अपने एप्लिकेशन की भाषाओं को कॉन्फ़िगर करने के लिए एक कॉन्फ़िग फ़ाइल बनाएं:
 
 ```typescript fileName="intlayer.config.ts" codeFormat={["typescript", "esm", "commonjs"]}

package/docs/hi/intlayer_with_angular_19.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2025-04-18
-updatedAt: 2026-05-31
+updatedAt: 2026-09-21
 title: "Angular 19 i18n - अपने ऐप को अनुवाद करने का पूर्ण गाइड"
 description: "अब i18next की जरूरत नहीं। 2026 में Angular 19 ऐप को बहुभाषी (i18n) बनाने का गाइड। AI एजेंट्स से अनुवाद करें और बंडल साइज़, SEO और परफॉर्मेंस ऑप्टिमाइज़ करें।"
 keywords:
@@ -169,6 +169,29 @@ bun add @angular-builders/custom-webpack --dev
 </Step>
 <Step number={2} title="आपके प्रोजेक्ट का कॉन्फ़िगरेशन">
 
+### आर्किटेक्चर
+
+इस आर्किटेक्चर में, `angular-intlayer` `provideIntlayer()` प्रदान करता है, जो `src/app/app.config.ts` में पंजीकृत होता है ताकि प्रत्येक कंपोनेंट `useIntlayer` सिग्नल के माध्यम से अपनी कंटेंट पढ़ सके। Angular CLI को कस्टम Webpack बिल्डर पर स्विच किया जाता है, और `webpack.config.ts` आपकी कंटेंट घोषणाओं को देखने और फिर से बनाने के लिए Intlayer प्लगइन को बिल्ड में मर्ज करता है। कंटेंट घोषणाएं `src/app/` में कंपोनेंट्स के साथ रखी जाती हैं।
+
+```bash
+.
+├── src
+│   ├── app
+│   │   ├── app.component.html        # Root template reading the content signal
+│   │   ├── app.component.ts          # Root component using useIntlayer
+│   │   ├── app.config.ts             # Application config with provideIntlayer()
+│   │   ├── app.content.ts            # App content declaration
+│   │   └── locale-switcher.component.ts
+│   └── main.ts
+├── angular.json                      # Custom Webpack builder for build and serve
+├── intlayer.config.ts
+├── package.json
+├── tsconfig.json
+└── webpack.config.ts                 # mergeConfig() from angular-intlayer/webpack
+```
+
+### कॉन्फ़िगरेशन
+
 अपने एप्लिकेशन की भाषाओं को कॉन्फ़िगर करने के लिए एक कॉन्फ़िग फ़ाइल बनाएँ:
 
 ```typescript fileName="intlayer.config.ts" codeFormat={["typescript", "esm", "commonjs"]}

package/docs/hi/intlayer_with_angular_21.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2025-04-18
-updatedAt: 2026-05-31
+updatedAt: 2026-09-21
 title: "Angular 22 i18n - अपने ऐप को अनुवाद करने का पूर्ण गाइड"
 description: "अब i18next की जरूरत नहीं। 2026 में Angular 22 ऐप को बहुभाषी (i18n) बनाने का गाइड। AI एजेंट्स से अनुवाद करें और बंडल साइज़, SEO और परफॉर्मेंस ऑप्टिमाइज़ करें।"
 keywords:
@@ -166,6 +166,29 @@ bun add @angular-builders/custom-esbuild --dev
 </Step>
 <Step number={2} title="अपने प्रोजेक्ट का कॉन्फ़िगरेशन">
 
+### आर्किटेक्चर
+
+इस आर्किटेक्चर में, `angular-intlayer` `provideIntlayer()` प्रदान करता है, जो `src/app/app.config.ts` में पंजीकृत होता है ताकि प्रत्येक कंपोनेंट `useIntlayer` सिग्नल के माध्यम से अपनी कंटेंट पढ़ सके। Angular CLI को कस्टम esbuild बिल्डर पर स्विच किया जाता है, और `esbuild.plugins.ts` आपकी कंटेंट घोषणाओं को देखने और फिर से बनाने के लिए Intlayer प्लगइन को बिल्ड में पंजीकृत करता है। कंटेंट घोषणाएं `src/app/` में कंपोनेंट्स के साथ रखी जाती हैं।
+
+```bash
+.
+├── src
+│   ├── app
+│   │   ├── app.component.html        # Root template reading the content signal
+│   │   ├── app.component.ts          # Root component using useIntlayer
+│   │   ├── app.config.ts             # Application config with provideIntlayer()
+│   │   ├── app.content.ts            # App content declaration
+│   │   └── locale-switcher.component.ts
+│   └── main.ts
+├── angular.json                      # Custom esbuild builder for build and serve
+├── esbuild.plugins.ts                # intlayerEsbuildPlugin() from angular-intlayer/esbuild
+├── intlayer.config.ts
+├── package.json
+└── tsconfig.json
+```
+
+### कॉन्फ़िगरेशन
+
 अपने एप्लिकेशन की भाषाओं को कॉन्फ़िगर करने के लिए एक कॉन्फ़िगरेशन फ़ाइल बनाएँ:
 
 ```typescript fileName="intlayer.config.ts" codeFormat={["typescript", "esm", "commonjs"]}