@agent-native/core 0.79.25 → 0.79.27

package/docs/content/locales/hi-IN/tracking.mdx

@@ -19,13 +19,63 @@ track(
 );
 ```
 
-```an-diagram title="एक ट्रैक() कॉल, प्रत्येक प्रदाता" summary="सर्वर और क्लाइंट कॉलर्स एक ही रजिस्ट्री को हिट करते हैं, जो समानांतर में सभी सक्रिय प्रदाताओं को हर घटना को प्रसारित करता है।"
-{
-  "html": "<div class=\"trk\"><div class=\"diagram-col\"><div class=\"diagram-node\">सर्वर कोड<br><small class=\"diagram-muted\">actions &middot; plugins &middot; routes</small></div><div class=\"diagram-node\">ब्राउज़र कोड<br><small class=\"diagram-muted\">POST /_agent-native/track</small></div></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-panel center\"><span class=\"diagram-pill accent\">Provider registry</span><small class=\"diagram-muted\">fan-out, भेजकर छोड़ें</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-col\"><div class=\"diagram-box\">PostHog</div><div class=\"diagram-box\">Mixpanel</div><div class=\"diagram-box\">Amplitude</div><div class=\"diagram-box\">Webhook</div></div></div>",
-  "css": ".trk{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.trk .diagram-col{display:flex;flex-direction:column;gap:8px}.trk .diagram-arrow{font-size:22px;line-height:1}.trk .center{display:flex;flex-direction:column;align-items:center;gap:4px}"
+<Diagram id="doc-block-a5b7o9" title={"एक ट्रैक() कॉल, प्रत्येक प्रदाता"} summary={"सर्वर और क्लाइंट कॉलर्स एक ही रजिस्ट्री को हिट करते हैं, जो समानांतर में सभी सक्रिय प्रदाताओं को हर घटना को प्रसारित करता है।"}>
+
+```html
+<div class="trk">
+  <div class="diagram-col">
+    <div class="diagram-node">
+      सर्वर कोड<br /><small class="diagram-muted"
+        >actions &middot; plugins &middot; routes</small
+      >
+    </div>
+    <div class="diagram-node">
+      ब्राउज़र कोड<br /><small class="diagram-muted"
+        >POST /_agent-native/track</small
+      >
+    </div>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-panel center">
+    <span class="diagram-pill accent">Provider registry</span
+    ><small class="diagram-muted">fan-out, भेजकर छोड़ें</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-col">
+    <div class="diagram-box">PostHog</div>
+    <div class="diagram-box">Mixpanel</div>
+    <div class="diagram-box">Amplitude</div>
+    <div class="diagram-box">Webhook</div>
+  </div>
+</div>
+```
+
+```css
+.trk {
+  display: flex;
+  align-items: center;
+  gap: 14px;
+  flex-wrap: wrap;
+}
+.trk .diagram-col {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+.trk .diagram-arrow {
+  font-size: 22px;
+  line-height: 1;
+}
+.trk .center {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
 }
 ```
 
+</Diagram>
+
 ## अंतर्निहित प्रदाता {#built-in}
 
 एक env var सेट करें और प्रदाता सर्वर स्टार्टअप पर ऑटो-रजिस्टर करें। किसी कोड परिवर्तन की आवश्यकता नहीं है.

package/docs/content/locales/hi-IN/using-your-agent.mdx

@@ -9,13 +9,60 @@ description: "एजेंट के साथ काम करने का द
 
 एक सरल थ्रू-लाइन है। एजेंट **देखता** है कि आप क्या देख रहे हैं, आप उसे **निर्देशित** करते हैं जो आप चाहते हैं, आप उसे **एम्बेड** कहीं भी कर सकते हैं, आप पूरी तरह से **UI-लाइट** में जा सकते हैं जब यह बेहतर हो, और आप एक ही समय में समान दस्तावेज़ों को **सह-संपादित** कर सकते हैं। उनमें से प्रत्येक इस अनुभाग में एक पृष्ठ है।
 
-```an-diagram title="दिन-प्रतिदिन का चक्र" summary="डॉक किए गए एजेंट के साथ काम करने के पांच तरीके - प्रत्येक इस अनुभाग में एक पृष्ठ है।"
-{
-  "html": "<div class=\"diagram-loop\"><div class=\"diagram-card\"><strong>Sees</strong><small class=\"diagram-muted\">your view &amp; selection</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-card\"><strong>Direct</strong><small class=\"diagram-muted\">@-mentions &amp; voice</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-card\"><strong>Embed</strong><small class=\"diagram-muted\">drop into any app</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-card\"><strong>हल्की UI</strong><small class=\"diagram-muted\">chat is the product</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-card accent-card\"><span class=\"diagram-pill accent\">सह-संपादन</span><small class=\"diagram-muted\">लाइव, साथ-साथ</small></div></div>",
-  "css": ".diagram-loop{display:flex;align-items:stretch;gap:10px;flex-wrap:wrap}.diagram-loop .diagram-card{display:flex;flex-direction:column;gap:6px;padding:14px 16px;min-width:130px;flex:1}.diagram-loop .diagram-arrow{align-self:center;font-size:22px;line-height:1}"
+<Diagram id="doc-block-1rbe87n" title={"दिन-प्रतिदिन का चक्र"} summary={"डॉक किए गए एजेंट के साथ काम करने के पांच तरीके - प्रत्येक इस अनुभाग में एक पृष्ठ है।"}>
+
+```html
+<div class="diagram-loop">
+  <div class="diagram-card">
+    <strong>Sees</strong
+    ><small class="diagram-muted">your view &amp; selection</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-card">
+    <strong>Direct</strong
+    ><small class="diagram-muted">@-mentions &amp; voice</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-card">
+    <strong>Embed</strong><small class="diagram-muted">drop into any app</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-card">
+    <strong>हल्की UI</strong
+    ><small class="diagram-muted">chat is the product</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-card accent-card">
+    <span class="diagram-pill accent">सह-संपादन</span
+    ><small class="diagram-muted">लाइव, साथ-साथ</small>
+  </div>
+</div>
+```
+
+```css
+.diagram-loop {
+  display: flex;
+  align-items: stretch;
+  gap: 10px;
+  flex-wrap: wrap;
+}
+.diagram-loop .diagram-card {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  padding: 14px 16px;
+  min-width: 130px;
+  flex: 1;
+}
+.diagram-loop .diagram-arrow {
+  align-self: center;
+  font-size: 22px;
+  line-height: 1;
 }
 ```
 
+</Diagram>
+
 ## यह वही देखता है जो आप देख रहे हैं {#it-sees}
 
 एजेंट आपकी स्क्रीन से अनजान नहीं है। एक ईमेल खोलें और यह जानता है कि कौन सा थ्रेड है। एक चार्ट चुनें और यह जानता है कि कौन सा चार्ट है। किसी अनुच्छेद को हाइलाइट करें और यह उसी सीमा पर कार्य कर सकता है। वह साझा जागरूकता ही आपको हर बार संदर्भ बताए बिना "इसका उत्तर दें" या "चयन को सारांशित करें" कहने की सुविधा देती है।

package/docs/content/locales/hi-IN/voice-input.mdx

@@ -19,13 +19,52 @@ description: "एजेंट चैट कंपोजर में वॉय
 
 प्रदाता की पसंद को `voice-transcription-prefs` के तहत एप्लिकेशन स्थिति में संग्रहीत किया जाता है ताकि उपयोगकर्ता साइडबार सेटिंग्स में `"auto"` (डिफ़ॉल्ट - सर्वोत्तम उपलब्ध प्रदाता चुनता है), `"builder-gemini"`, `"builder"`, `"gemini"`, `"groq"`, `"openai"`, या `"browser"` को बाध्य कर सके।
 
-```an-diagram title="वॉयस ट्रांसक्रिप्शन प्रदाता फ़ॉलबैक" summary="कंपोज़र ऑडियो रिकॉर्ड करता है, फिर सर्वर प्रदाताओं को क्रम में चलाता है, ब्राउज़र वेब स्पीच API पर तभी छोड़ता है जब कोई सर्वर प्रदाता उपलब्ध नहीं होता है।"
-{
-  "html": "<div class=\"diagram-voice\"><div class=\"diagram-node\">माइक बटन<br><small class=\"diagram-muted\">webm/opus रिकॉर्ड करता है</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-card col\"><div class=\"diagram-pill accent\">1 &middot; Builder Gemini</div><small class=\"diagram-muted\">Builder कनेक्ट होने पर डिफ़ॉल्ट</small><div class=\"diagram-pill\">2 &middot; BYOK cloud</div><small class=\"diagram-muted\">Gemini &middot; Groq &middot; OpenAI Whisper</small></div><div class=\"diagram-arrow diagram-warn\" aria-hidden=\"true\">&darr;</div><div class=\"diagram-box diagram-warn\" data-rough>3 &middot; Browser Web Speech<br><small class=\"diagram-muted\">fallback on 400 &middot; streams live</small></div></div>",
-  "css": ".diagram-voice{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.diagram-voice .col{display:flex;flex-direction:column;gap:6px;padding:14px}.diagram-voice .diagram-arrow{font-size:22px;line-height:1}"
+<Diagram id="doc-block-b8d74q" title={"वॉयस ट्रांसक्रिप्शन प्रदाता फ़ॉलबैक"} summary={"कंपोज़र ऑडियो रिकॉर्ड करता है, फिर सर्वर प्रदाताओं को क्रम में चलाता है, ब्राउज़र वेब स्पीच API पर तभी छोड़ता है जब कोई सर्वर प्रदाता उपलब्ध नहीं होता है।"}>
+
+```html
+<div class="diagram-voice">
+  <div class="diagram-node">
+    माइक बटन<br /><small class="diagram-muted">webm/opus रिकॉर्ड करता है</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-card col">
+    <div class="diagram-pill accent">1 &middot; Builder Gemini</div>
+    <small class="diagram-muted">Builder कनेक्ट होने पर डिफ़ॉल्ट</small>
+    <div class="diagram-pill">2 &middot; BYOK cloud</div>
+    <small class="diagram-muted"
+      >Gemini &middot; Groq &middot; OpenAI Whisper</small
+    >
+  </div>
+  <div class="diagram-arrow diagram-warn" aria-hidden="true">&darr;</div>
+  <div class="diagram-box diagram-warn" data-rough>
+    3 &middot; Browser Web Speech<br /><small class="diagram-muted"
+      >fallback on 400 &middot; streams live</small
+    >
+  </div>
+</div>
+```
+
+```css
+.diagram-voice {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  flex-wrap: wrap;
+}
+.diagram-voice .col {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  padding: 14px;
+}
+.diagram-voice .diagram-arrow {
+  font-size: 22px;
+  line-height: 1;
 }
 ```
 
+</Diagram>
+
 मार्ग **केवल समान-मूल** है - क्रॉस-साइट पोस्ट अस्वीकार कर दिए जाते हैं ताकि कोई हमलावर किसी बाहरी पृष्ठ से ट्रांसक्रिप्शन क्रेडिट को बर्न न कर सके।
 
 ## प्रदाताओं को सक्षम करना {#enabling-providers}

package/docs/content/locales/hi-IN/what-is-agent-native.mdx

@@ -50,13 +50,57 @@ description: "अधिकांश AI ऐप्स आधे-अधूरे
 
 वह क्रमांक 3 है। वह एजेंट-नेटिव है।
 
-```an-diagram title="सीढ़ी सिद्धांत" summary="अधिकांश टीमें पायदान 1 या 2 पर रुकती हैं। एजेंट-नेटिव पायदान 3 है - एक वास्तविक ऐप और एक साझा कार्रवाई सतह पर एक वास्तविक एजेंट।"
-{
-  "html": "<div class=\"diagram-ladder\"><div class=\"diagram-card rung rung-3\"><span class=\"diagram-pill accent\">पायदान 3 · agent-native</span><strong>एजेंट + UI बराबर साझेदार</strong><small class=\"diagram-muted\">One action surface. Every agent tool is also a button; every button runs the same logic the agent uses.</small></div><div class=\"diagram-card rung rung-2\"><span class=\"diagram-pill\">पायदान 2</span><strong>टूल्स वाला चैट</strong><small class=\"diagram-muted\">एजेंट कार्य कर सकता है, लेकिन यह अभी भी सिर्फ चैट विंडो है। कोई डैशबोर्ड, सूचियां या शॉर्टकट नहीं।</small></div><div class=\"diagram-card rung rung-1\"><span class=\"diagram-pill warn\">पायदान 1</span><strong>एक LLM कॉल</strong><small class=\"diagram-muted\">Prompt in, string out. Impressive in a demo; breaks the moment reality gets messy.</small></div></div>",
-  "css": ".diagram-ladder{display:flex;flex-direction:column;gap:14px}.diagram-ladder .rung{display:flex;flex-direction:column;gap:6px;padding:16px 18px}.diagram-ladder .rung-2{margin-inline-end:48px}.diagram-ladder .rung-1{margin-inline-end:96px}"
+<Diagram id="doc-block-f0bx51" title={"सीढ़ी सिद्धांत"} summary={"अधिकांश टीमें पायदान 1 या 2 पर रुकती हैं। एजेंट-नेटिव पायदान 3 है - एक वास्तविक ऐप और एक साझा कार्रवाई सतह पर एक वास्तविक एजेंट।"}>
+
+```html
+<div class="diagram-ladder">
+  <div class="diagram-card rung rung-3">
+    <span class="diagram-pill accent">पायदान 3 · agent-native</span
+    ><strong>एजेंट + UI बराबर साझेदार</strong
+    ><small class="diagram-muted"
+      >One action surface. Every agent tool is also a button; every button runs
+      the same logic the agent uses.</small
+    >
+  </div>
+  <div class="diagram-card rung rung-2">
+    <span class="diagram-pill">पायदान 2</span><strong>टूल्स वाला चैट</strong
+    ><small class="diagram-muted"
+      >एजेंट कार्य कर सकता है, लेकिन यह अभी भी सिर्फ चैट विंडो है। कोई डैशबोर्ड,
+      सूचियां या शॉर्टकट नहीं।</small
+    >
+  </div>
+  <div class="diagram-card rung rung-1">
+    <span class="diagram-pill warn">पायदान 1</span><strong>एक LLM कॉल</strong
+    ><small class="diagram-muted"
+      >Prompt in, string out. Impressive in a demo; breaks the moment reality
+      gets messy.</small
+    >
+  </div>
+</div>
+```
+
+```css
+.diagram-ladder {
+  display: flex;
+  flex-direction: column;
+  gap: 14px;
+}
+.diagram-ladder .rung {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  padding: 16px 18px;
+}
+.diagram-ladder .rung-2 {
+  margin-inline-end: 48px;
+}
+.diagram-ladder .rung-1 {
+  margin-inline-end: 96px;
 }
 ```
 
+</Diagram>
+
 [Key Concepts — Protocols](/docs/key-concepts#protocols) देखें कि कैसे यह सब एक ही क्रिया परिभाषा पर आधारित है।
 
 ## प्रत्येक एजेंट को UI की आवश्यकता क्यों है {#why-every-agent-needs-a-ui}
@@ -89,13 +133,58 @@ description: "अधिकांश AI ऐप्स आधे-अधूरे
 >
 > **एजेंट से** - प्राकृतिक भाषा, A2A, Slack, टेलीग्राम के माध्यम से अन्य एजेंट। एजेंट डेटाबेस को लिखता है; UI स्वचालित रूप से अपडेट हो जाता है।
 
-```an-diagram title="एक प्रणाली, दो रास्ते" summary="एजेंट और यूआई समान क्रियाएं और समान डेटाबेस लिखते हैं। एक जो करता है, दूसरा देखता है."
-{
-  "html": "<div class=\"diagram-parity\"><div class=\"diagram-col\"><div class=\"diagram-node\">Human<br><small class=\"diagram-muted\">क्लिक, फॉर्म, शॉर्टकट</small></div><div class=\"diagram-node\">Agent<br><small class=\"diagram-muted\">प्राकृतिक भाषा · A2A · Slack</small></div></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-panel center\"><span class=\"diagram-pill accent\">Actions</span><small class=\"diagram-muted\">defined once</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\">SQL डेटाबेस</div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&#8635;</div><div class=\"diagram-box\">UI लाइव अपडेट होती है</div></div>",
-  "css": ".diagram-parity{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.diagram-parity .diagram-col{display:flex;flex-direction:column;gap:10px}.diagram-parity .diagram-arrow{font-size:22px;line-height:1}.diagram-parity .center{display:flex;flex-direction:column;align-items:center;gap:4px}"
+<Diagram id="doc-block-1rwmvy8" title={"एक प्रणाली, दो रास्ते"} summary={"एजेंट और यूआई समान क्रियाएं और समान डेटाबेस लिखते हैं। एक जो करता है, दूसरा देखता है."}>
+
+```html
+<div class="diagram-parity">
+  <div class="diagram-col">
+    <div class="diagram-node">
+      Human<br /><small class="diagram-muted">क्लिक, फॉर्म, शॉर्टकट</small>
+    </div>
+    <div class="diagram-node">
+      Agent<br /><small class="diagram-muted"
+        >प्राकृतिक भाषा · A2A · Slack</small
+      >
+    </div>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-panel center">
+    <span class="diagram-pill accent">Actions</span
+    ><small class="diagram-muted">defined once</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-box">SQL डेटाबेस</div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&#8635;</div>
+  <div class="diagram-box">UI लाइव अपडेट होती है</div>
+</div>
+```
+
+```css
+.diagram-parity {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  flex-wrap: wrap;
+}
+.diagram-parity .diagram-col {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+.diagram-parity .diagram-arrow {
+  font-size: 22px;
+  line-height: 1;
+}
+.diagram-parity .center {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
 }
 ```
 
+</Diagram>
+
 जब एजेंट एक ड्राफ्ट ईमेल बनाता है, तो यह UI में दिखाई देता है। जब आप "भेजें" पर क्लिक करते हैं, तो एजेंट को पता चल जाता है कि यह भेजा गया था। कोई अलग "एजेंट वर्ल्ड" और "UI वर्ल्ड" नहीं है - यह एक प्रणाली है। उस आर्किटेक्चर के लिए [Key Concepts](/docs/key-concepts) देखें जो यह काम करता है।
 
 ## अनुकूलन आमतौर पर बिजली उपकरणों के लिए आरक्षित होता है {#workspace-customization}

package/docs/content/locales/hi-IN/workspace-connections.mdx

@@ -16,13 +16,75 @@ description: "कनेक्ट-वन्स-यूज़-एवरीव्ह
 - **credentialRef** — एक वॉल्ट रहस्य का सूचक (`{ key: "SLACK_BOT_TOKEN", scope: "org" }`)। कनेक्शन बताता है कि टोकन कहाँ रहता है; तिजोरी मूल्य रखती है।
 - **तत्परता** - संयुक्त स्थिति जो एक ऐप देखता है: `connected` (मौजूद + क्रेडेंशियल्स), `needs_grant`, `needs_credentials`, `needs_attention`, या `not_configured`।
 
-```an-diagram title="एक बार कनेक्ट करें, ऐप्स प्रदान करें, क्रेडेंशियल्स का पुन: उपयोग करें" summary="एक कनेक्शन प्रदाता मेटाडेटा (कभी रहस्य नहीं) और क्रेडेंशियलरेफ्स रखता है जो वॉल्ट पर इंगित करता है। प्रति-ऐप अनुदान इसे अनलॉक करता है। ऐप्स एकल तत्परता स्थिति पढ़ते हैं।"
-{
-  "html": "<div class=\"diagram-conn\"><div class=\"diagram-panel col\" data-rough><span class=\"diagram-pill accent\">Connection</span><div class=\"diagram-box\" data-rough>named provider account<br><small class=\"diagram-muted\">provider, label, स्थिति, स्कोप, कॉन्फिग &middot; never stores secret values</small></div><div class=\"diagram-muted\">credentialRef &rarr; pointer to a vault secret</div></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-panel col\" data-rough><span class=\"diagram-pill\">Grant</span><div class=\"diagram-box\" data-rough>per-app permission<br><small class=\"diagram-muted\">no grant = no credential access</small></div></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-panel col\" data-rough><span class=\"diagram-pill ok\">Readiness</span><small class=\"diagram-muted\">what the app sees</small><div class=\"sev-row\"><span class=\"diagram-pill ok\">connected</span><span class=\"diagram-pill warn\">needs_grant</span></div><div class=\"sev-row\"><span class=\"diagram-pill warn\">needs_credentials</span><span class=\"diagram-pill warn\">needs_attention</span></div><div class=\"sev-row\"><span class=\"diagram-pill\">not_configured</span></div></div></div>",
-  "css": ".diagram-conn{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.diagram-conn .col{display:flex;flex-direction:column;gap:8px;padding:14px;min-width:220px}.diagram-conn .diagram-arrow{font-size:22px;line-height:1}.diagram-conn .sev-row{display:flex;gap:8px;flex-wrap:wrap}"
+<Diagram id="doc-block-ue6gpm" title={"एक बार कनेक्ट करें, ऐप्स प्रदान करें, क्रेडेंशियल्स का पुन: उपयोग करें"} summary={"एक कनेक्शन प्रदाता मेटाडेटा (कभी रहस्य नहीं) और क्रेडेंशियलरेफ्स रखता है जो वॉल्ट पर इंगित करता है। प्रति-ऐप अनुदान इसे अनलॉक करता है। ऐप्स एकल तत्परता स्थिति पढ़ते हैं।"}>
+
+```html
+<div class="diagram-conn">
+  <div class="diagram-panel col" data-rough>
+    <span class="diagram-pill accent">Connection</span>
+    <div class="diagram-box" data-rough>
+      named provider account<br /><small class="diagram-muted"
+        >provider, label, स्थिति, स्कोप, कॉन्फिग &middot; never stores secret
+        values</small
+      >
+    </div>
+    <div class="diagram-muted">
+      credentialRef &rarr; pointer to a vault secret
+    </div>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-panel col" data-rough>
+    <span class="diagram-pill">Grant</span>
+    <div class="diagram-box" data-rough>
+      per-app permission<br /><small class="diagram-muted"
+        >no grant = no credential access</small
+      >
+    </div>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-panel col" data-rough>
+    <span class="diagram-pill ok">Readiness</span
+    ><small class="diagram-muted">what the app sees</small>
+    <div class="sev-row">
+      <span class="diagram-pill ok">connected</span
+      ><span class="diagram-pill warn">needs_grant</span>
+    </div>
+    <div class="sev-row">
+      <span class="diagram-pill warn">needs_credentials</span
+      ><span class="diagram-pill warn">needs_attention</span>
+    </div>
+    <div class="sev-row"><span class="diagram-pill">not_configured</span></div>
+  </div>
+</div>
+```
+
+```css
+.diagram-conn {
+  display: flex;
+  align-items: center;
+  gap: 14px;
+  flex-wrap: wrap;
+}
+.diagram-conn .col {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding: 14px;
+  min-width: 220px;
+}
+.diagram-conn .diagram-arrow {
+  font-size: 22px;
+  line-height: 1;
+}
+.diagram-conn .sev-row {
+  display: flex;
+  gap: 8px;
+  flex-wrap: wrap;
 }
 ```
 
+</Diagram>
+
 ### कार्यशील उदाहरण: Slack
 
 Slack को एक बार कनेक्ट करें और इसे ब्रेन और एनालिटिक्स को प्रदान करें:
@@ -260,13 +322,71 @@ const brainCatalog = await listWorkspaceConnectionProviderCatalogForApp({
 
 वर्कस्पेस कनेक्शन प्रदाता मेटाडेटा उत्तर देता है: "यह कौन सा प्रदाता है, यह क्या कर सकता है, इसे किन क्रेडेंशियल कुंजियों की आवश्यकता हो सकती है, और इसे कौन से टेम्पलेट पेश करने चाहिए?"
 
-```an-diagram title="कनेक्शन स्टोर बनाम वॉल्ट" summary="तिजोरी का गुप्त मूल्य होता है। कनेक्शन प्रदाता मेटाडेटा प्लस क्रेडेंशियलरेफ्स (पॉइंटर्स) का मालिक है। निष्पादन के समय ऐप दिए गए कनेक्शन के माध्यम से रेफरी का समाधान करता है और वॉल्ट से मूल्य पढ़ता है।"
-{
-  "html": "<div class=\"diagram-vault\"><div class=\"diagram-panel col\" data-rough><span class=\"diagram-pill accent\">कनेक्शन स्टोर</span><div class=\"diagram-box\" data-rough>provider account + metadata<br><small class=\"diagram-muted\">स्थिति, स्कोप, कॉन्फिग</small></div><div class=\"diagram-box\" data-rough>credentialRef<br><small class=\"diagram-muted\">{ key: SLACK_BOT_TOKEN, scope: org }</small></div></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-card\"><span class=\"diagram-pill\">ऐप action</span><small class=\"diagram-muted\">resolves at execution time through a granted ref</small><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&darr;</div></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-panel col\" data-rough><span class=\"diagram-pill ok\">Vault</span><div class=\"diagram-box\" data-rough>secret value<br><small class=\"diagram-muted\">एजेंट या UI को कभी वापस नहीं किया जाता</small></div></div></div>",
-  "css": ".diagram-vault{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.diagram-vault .col{display:flex;flex-direction:column;gap:8px;padding:14px;min-width:220px}.diagram-vault .diagram-card{display:flex;flex-direction:column;gap:6px;padding:12px 14px}.diagram-vault .diagram-arrow{font-size:22px;line-height:1}"
+<Diagram id="doc-block-1bbbr8i" title={"कनेक्शन स्टोर बनाम वॉल्ट"} summary={"तिजोरी का गुप्त मूल्य होता है। कनेक्शन प्रदाता मेटाडेटा प्लस क्रेडेंशियलरेफ्स (पॉइंटर्स) का मालिक है। निष्पादन के समय ऐप दिए गए कनेक्शन के माध्यम से रेफरी का समाधान करता है और वॉल्ट से मूल्य पढ़ता है।"}>
+
+```html
+<div class="diagram-vault">
+  <div class="diagram-panel col" data-rough>
+    <span class="diagram-pill accent">कनेक्शन स्टोर</span>
+    <div class="diagram-box" data-rough>
+      provider account + metadata<br /><small class="diagram-muted"
+        >स्थिति, स्कोप, कॉन्फिग</small
+      >
+    </div>
+    <div class="diagram-box" data-rough>
+      credentialRef<br /><small class="diagram-muted"
+        >{ key: SLACK_BOT_TOKEN, scope: org }</small
+      >
+    </div>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-card">
+    <span class="diagram-pill">ऐप action</span
+    ><small class="diagram-muted"
+      >resolves at execution time through a granted ref</small
+    >
+    <div class="diagram-arrow diagram-muted" aria-hidden="true">&darr;</div>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-panel col" data-rough>
+    <span class="diagram-pill ok">Vault</span>
+    <div class="diagram-box" data-rough>
+      secret value<br /><small class="diagram-muted"
+        >एजेंट या UI को कभी वापस नहीं किया जाता</small
+      >
+    </div>
+  </div>
+</div>
+```
+
+```css
+.diagram-vault {
+  display: flex;
+  align-items: center;
+  gap: 14px;
+  flex-wrap: wrap;
+}
+.diagram-vault .col {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding: 14px;
+  min-width: 220px;
+}
+.diagram-vault .diagram-card {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  padding: 12px 14px;
+}
+.diagram-vault .diagram-arrow {
+  font-size: 22px;
+  line-height: 1;
 }
 ```
 
+</Diagram>
+
 दोनों का एक साथ उपयोग करें:
 
 1. डिस्पैच (या अन्य कार्यक्षेत्र सेटअप प्रवाह) अंतर्निहित वॉल्ट रहस्य या OAuth क्रेडेंशियल संदर्भ बनाता है।

package/docs/content/locales/hi-IN/workspace-management.mdx

@@ -9,13 +9,59 @@ description: "ब्रांचिंग, CODEOWNERS, पीआर समीक
 
 यह मार्गदर्शिका एजेंट-नेटिव वर्कस्पेस को चलाने के परिचालन पक्ष को कवर करती है - शाखा कैसे लगाएं, कौन क्या समीक्षा करता है, कोड स्वामित्व कैसे सेट करें, और डिस्पैच नियंत्रण विमान आपके शासन मॉडल में कैसे फिट बैठता है।
 
-```an-diagram title="दो शासन विमान" summary="Git कोड को नियंत्रित करता है; Dispatch रनटाइम को नियंत्रित करता है। वे पूरक हैं - एक को दूसरे के अंदर दोहराएँ नहीं।"
-{
-  "html": "<div class=\"gov\"><div class=\"diagram-card\"><span class=\"diagram-pill accent\">Git और GitHub</span><strong>कोड गवर्नेंस</strong><div class=\"gov-list\"><span class=\"diagram-pill\">CODEOWNERS</span><span class=\"diagram-pill\">branch protection</span><span class=\"diagram-pill\">PR समीक्षा</span><span class=\"diagram-pill\">git log / blame</span></div></div><div class=\"diagram-pill diagram-muted\">+</div><div class=\"diagram-card\"><span class=\"diagram-pill accent\">Dispatch</span><strong>Runtime governance</strong><div class=\"gov-list\"><span class=\"diagram-pill\">vault secrets &amp; grants</span><span class=\"diagram-pill\">workspace resources</span><span class=\"diagram-pill\">agent profiles</span><span class=\"diagram-pill\">approvals &amp; audit</span></div></div></div>",
-  "css": ".gov{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.gov .diagram-card{display:flex;flex-direction:column;gap:8px;padding:16px 18px;flex:1;min-width:240px}.gov .gov-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}"
+<Diagram id="doc-block-1xlc9n" title={"दो शासन विमान"} summary={"Git कोड को नियंत्रित करता है; Dispatch रनटाइम को नियंत्रित करता है। वे पूरक हैं - एक को दूसरे के अंदर दोहराएँ नहीं।"}>
+
+```html
+<div class="gov">
+  <div class="diagram-card">
+    <span class="diagram-pill accent">Git और GitHub</span
+    ><strong>कोड गवर्नेंस</strong>
+    <div class="gov-list">
+      <span class="diagram-pill">CODEOWNERS</span
+      ><span class="diagram-pill">branch protection</span
+      ><span class="diagram-pill">PR समीक्षा</span
+      ><span class="diagram-pill">git log / blame</span>
+    </div>
+  </div>
+  <div class="diagram-pill diagram-muted">+</div>
+  <div class="diagram-card">
+    <span class="diagram-pill accent">Dispatch</span
+    ><strong>Runtime governance</strong>
+    <div class="gov-list">
+      <span class="diagram-pill">vault secrets &amp; grants</span
+      ><span class="diagram-pill">workspace resources</span
+      ><span class="diagram-pill">agent profiles</span
+      ><span class="diagram-pill">approvals &amp; audit</span>
+    </div>
+  </div>
+</div>
+```
+
+```css
+.gov {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  flex-wrap: wrap;
+}
+.gov .diagram-card {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding: 16px 18px;
+  flex: 1;
+  min-width: 240px;
+}
+.gov .gov-list {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  margin-top: 4px;
 }
 ```
 
+</Diagram>
+
 ## शाखा बनाना
 
 ### फ़ीचर शाखाएँ