@agent-native/core 0.79.26 → 0.80.0

package/docs/content/locales/ar-SA/server.mdx

@@ -7,13 +7,79 @@ description: "مسارات خادم Nitro، والمكونات الإضافية
 
 تستخدم التطبيقات الأصلية للوكيل [Nitro](https://nitro.build) لمسارات الخادم والمكونات الإضافية. يجب أن تكون معظم سلوكيات المنتج موجودة في [Actions](/docs/actions)؛ المسارات المخصصة مخصصة لأسطح البروتوكول التي لا تناسبها actions: عمليات التحميل والبث والصفحات العامة وعمليات الاسترجاعات webhooks وOAuth وAPI الخاصة بالموفر.
 
-```an-diagram title="ما يعمل على الخادم" summary="الإجراءات هي الافتراضية. تشترك مسارات الملفات المخصصة والمسارات المثبتة على إطار العمل في نفس تطبيق Nitro ونفس قاعدة بيانات SQL."
-{
-  "html": "<div class=\"diagram-server\"><div class=\"diagram-col entry\"><div class=\"diagram-node\">المتصفح / واجهة المستخدم</div><div class=\"diagram-node\">حلقة الوكيل</div><div class=\"diagram-node\">العملاء الخارجيين<br><small class=\"diagram-muted\">HTTP · MCP · A2A</small></div></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-panel\" data-rough><strong>خادم Nitro</strong><div class=\"diagram-row\"><span class=\"diagram-pill accent\">Actions</span><small class=\"diagram-muted\">السطح الافتراضي</small></div><div class=\"diagram-row\"><span class=\"diagram-pill\">/_agent-native/*</span><small class=\"diagram-muted\">طرق الإطار</small></div><div class=\"diagram-row\"><span class=\"diagram-pill\">/api/*</span><small class=\"diagram-muted\">طرق الملفات المخصصة</small></div><div class=\"diagram-row\"><span class=\"diagram-pill\">plugins</span><small class=\"diagram-muted\">بدء التشغيل: الهجرات والوظائف</small></div></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\" data-rough>HTTP قاعدة البيانات<br><small class=\"diagram-muted\">Drizzle · نقطة التنسيق</small></div></div>",
-  "css": ".diagram-server{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.diagram-server .diagram-col{display:flex;flex-direction:column;gap:10px}.diagram-server .diagram-panel{display:flex;flex-direction:column;gap:8px;padding:14px 16px}.diagram-server .diagram-row{display:flex;align-items:center;gap:8px}.diagram-server .diagram-arrow{font-size:22px;line-height:1}"
+<Diagram id="doc-block-17ctnji" title={"ما يعمل على الخادم"} summary={"الإجراءات هي الافتراضية. تشترك مسارات الملفات المخصصة والمسارات المثبتة على إطار العمل في نفس تطبيق Nitro ونفس قاعدة بيانات SQL."}>
+
+```html
+<div class="diagram-server">
+  <div class="diagram-col entry">
+    <div class="diagram-node">المتصفح / واجهة المستخدم</div>
+    <div class="diagram-node">حلقة الوكيل</div>
+    <div class="diagram-node">
+      العملاء الخارجيين<br /><small class="diagram-muted"
+        >HTTP · MCP · A2A</small
+      >
+    </div>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-panel" data-rough>
+    <strong>خادم Nitro</strong>
+    <div class="diagram-row">
+      <span class="diagram-pill accent">Actions</span
+      ><small class="diagram-muted">السطح الافتراضي</small>
+    </div>
+    <div class="diagram-row">
+      <span class="diagram-pill">/_agent-native/*</span
+      ><small class="diagram-muted">طرق الإطار</small>
+    </div>
+    <div class="diagram-row">
+      <span class="diagram-pill">/api/*</span
+      ><small class="diagram-muted">طرق الملفات المخصصة</small>
+    </div>
+    <div class="diagram-row">
+      <span class="diagram-pill">plugins</span
+      ><small class="diagram-muted">بدء التشغيل: الهجرات والوظائف</small>
+    </div>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-box" data-rough>
+    HTTP قاعدة البيانات<br /><small class="diagram-muted"
+      >Drizzle · نقطة التنسيق</small
+    >
+  </div>
+</div>
+```
+
+```css
+.diagram-server {
+  display: flex;
+  align-items: center;
+  gap: 14px;
+  flex-wrap: wrap;
+}
+.diagram-server .diagram-col {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+.diagram-server .diagram-panel {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding: 14px 16px;
+}
+.diagram-server .diagram-row {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.diagram-server .diagram-arrow {
+  font-size: 22px;
+  line-height: 1;
 }
 ```
 
+</Diagram>
+
 ## المسارات المستندة إلى الملف {#file-based-routes}
 
 تقوم المسارات المباشرة في `server/routes/` وNitro بتعيين أسماء الملفات إلى الأساليب والمسارات:
@@ -185,13 +251,51 @@ export default runMigrations(
 
 يعمل هذا عبر عمليات النشر بدون خادم ومتعددة المثيلات لأن قاعدة البيانات هي نقطة التنسيق. إذا كتبت تغييرات مخصصة خارج actions، فاستخدم مساعدي إطار العمل أو قم بإصدار إبطال المزامنة المناسب، لذا افتح تحديث UI.
 
-```an-diagram title="SQL-backed حلقة المزامنة" summary="لا مراقبين، لا دولة لزجة. تصطدم الكتابة بإصدار في SQL؛ يقوم كل عميل باستقصاء الإصدار وإعادة جلبه."
-{
-  "html": "<div class=\"diagram-sync\"><div class=\"diagram-box\" data-rough>العمل / المساعد<br><small class=\"diagram-muted\">يحول البيانات</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-panel\" data-rough><strong>SQL قاعدة البيانات</strong><small class=\"diagram-muted\">زيادات إصدار المزامنة</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&larr;</div><div class=\"diagram-col\"><div class=\"diagram-node\">useDbSync()<br><small class=\"diagram-muted\">الاستطلاعات /_agent-native/poll</small></div><div class=\"diagram-pill ok\">invalidate caches &rarr; UI refreshes</div></div></div>",
-  "css": ".diagram-sync{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.diagram-sync .diagram-col{display:flex;flex-direction:column;gap:8px;align-items:flex-start}.diagram-sync .diagram-arrow{font-size:22px;line-height:1}"
+<Diagram id="doc-block-dkl55x" title={"SQL-backed حلقة المزامنة"} summary={"لا مراقبين، لا دولة لزجة. تصطدم الكتابة بإصدار في SQL؛ يقوم كل عميل باستقصاء الإصدار وإعادة جلبه."}>
+
+```html
+<div class="diagram-sync">
+  <div class="diagram-box" data-rough>
+    العمل / المساعد<br /><small class="diagram-muted">يحول البيانات</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-panel" data-rough>
+    <strong>SQL قاعدة البيانات</strong
+    ><small class="diagram-muted">زيادات إصدار المزامنة</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&larr;</div>
+  <div class="diagram-col">
+    <div class="diagram-node">
+      useDbSync()<br /><small class="diagram-muted"
+        >الاستطلاعات /_agent-native/poll</small
+      >
+    </div>
+    <div class="diagram-pill ok">invalidate caches &rarr; UI refreshes</div>
+  </div>
+</div>
+```
+
+```css
+.diagram-sync {
+  display: flex;
+  align-items: center;
+  gap: 14px;
+  flex-wrap: wrap;
+}
+.diagram-sync .diagram-col {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  align-items: flex-start;
+}
+.diagram-sync .diagram-arrow {
+  font-size: 22px;
+  line-height: 1;
 }
 ```
 
+</Diagram>
+
 <Endpoint id="doc-block-144aev0" title={"نقطة نهاية الاستقصاء"} method="GET" path="/_agent-native/poll" summary={"قم بإرجاع إصدارات مزامنة قاعدة البيانات الحالية لكل مصدر حتى يتمكن العميل من اكتشاف التغييرات."} auth="Session cookie (request-scoped identity)" responses={[
   {
     "status": "200",
@@ -213,13 +317,70 @@ export default runMigrations(
 4. إرجاع 200 على الفور.
 5. اسمح لتنفيذ المعالج الجديد بتشغيل حلقة الوكيل ونشر النتيجة.
 
-```an-diagram title="نمط قائمة انتظار التكامل" summary="يُرجع معالج webhook بالمللي ثانية؛ يؤدي التنفيذ الموقع المنفصل إلى تشغيل عمل الوكيل البطيء."
-{
-  "html": "<div class=\"diagram-webhook\"><div class=\"diagram-box\" data-rough>Webhook وارد<br><small class=\"diagram-muted\">Slack · Stripe · email</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-panel\" data-rough><strong>Handler</strong><div class=\"diagram-step\"><span class=\"diagram-pill\">1</span><small class=\"diagram-muted\">verify signature</small></div><div class=\"diagram-step\"><span class=\"diagram-pill\">2</span><small class=\"diagram-muted\">إدراج العمل في SQL</small></div><div class=\"diagram-step\"><span class=\"diagram-pill\">3</span><small class=\"diagram-muted\">self-fire processor</small></div><div class=\"diagram-step\"><span class=\"diagram-pill ok\">4</span><small class=\"diagram-muted\">return 200 now</small></div></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\" data-rough>Signed processor<br><small class=\"diagram-muted\">يشغل حلقة الوكيل وينشر النتيجة</small></div></div>",
-  "css": ".diagram-webhook{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.diagram-webhook .diagram-panel{display:flex;flex-direction:column;gap:6px;padding:14px 16px}.diagram-webhook .diagram-step{display:flex;align-items:center;gap:8px}.diagram-webhook .diagram-arrow{font-size:22px;line-height:1}"
+<Diagram id="doc-block-nz4s40" title={"نمط قائمة انتظار التكامل"} summary={"يُرجع معالج webhook بالمللي ثانية؛ يؤدي التنفيذ الموقع المنفصل إلى تشغيل عمل الوكيل البطيء."}>
+
+```html
+<div class="diagram-webhook">
+  <div class="diagram-box" data-rough>
+    Webhook وارد<br /><small class="diagram-muted"
+      >Slack · Stripe · email</small
+    >
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-panel" data-rough>
+    <strong>Handler</strong>
+    <div class="diagram-step">
+      <span class="diagram-pill">1</span
+      ><small class="diagram-muted">verify signature</small>
+    </div>
+    <div class="diagram-step">
+      <span class="diagram-pill">2</span
+      ><small class="diagram-muted">إدراج العمل في SQL</small>
+    </div>
+    <div class="diagram-step">
+      <span class="diagram-pill">3</span
+      ><small class="diagram-muted">self-fire processor</small>
+    </div>
+    <div class="diagram-step">
+      <span class="diagram-pill ok">4</span
+      ><small class="diagram-muted">return 200 now</small>
+    </div>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-box" data-rough>
+    Signed processor<br /><small class="diagram-muted"
+      >يشغل حلقة الوكيل وينشر النتيجة</small
+    >
+  </div>
+</div>
+```
+
+```css
+.diagram-webhook {
+  display: flex;
+  align-items: center;
+  gap: 14px;
+  flex-wrap: wrap;
+}
+.diagram-webhook .diagram-panel {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  padding: 14px 16px;
+}
+.diagram-webhook .diagram-step {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.diagram-webhook .diagram-arrow {
+  font-size: 22px;
+  line-height: 1;
 }
 ```
 
+</Diagram>
+
 > [!WARNING]
 > لا تعتمد على الوعود غير المنتظرة بعد إرجاع الرد - حيث يقوم المضيفون بدون خادم بتجميد التنفيذ. راجع [Messaging](/docs/messaging) للتعرف على قائمة انتظار التكامل الأساسية.
 

package/docs/content/locales/ar-SA/sharing.mdx

@@ -27,13 +27,54 @@ description: "المشاركة بأسلوب Google-Docs، المضمنة في إ
 
 `public` هو مستوى هادئ بشكل متعمد: يمكن الوصول إلى المورد العام عن طريق رابط مباشر، ولكنه **لا** يظهر في الأشرطة الجانبية أو القوائم أو عمليات البحث الخاصة بالمستخدمين الآخرين. وهذا يبقي "عامًا لمشاركة URL" منفصلاً عن "عامًا للاكتشاف عبر المستخدمين". يتم الاشتراك بشكل صريح في المعارض وكتالوجات النماذج التي تريد حقًا اكتشاف المستخدمين المتعددين.
 
-```an-diagram title="الرؤية، واتساع إلى الخارج" summary="الرؤية الخشنة للمورد تحدد الأرضية؛ تضيف منح المشاركة الصريحة في الجدول المصاحب أشخاصًا محددين في الأعلى."
-{
-  "html": "<div class=\"share-tiers\"><div class=\"diagram-card\"><span class=\"diagram-pill\">private</span><small class=\"diagram-muted\">owner + explicit grants only &middot; <strong>default</strong></small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&darr;</div><div class=\"diagram-card\"><span class=\"diagram-pill accent\">org</span><small class=\"diagram-muted\">+ anyone in the same org (read-only)</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&darr;</div><div class=\"diagram-card\"><span class=\"diagram-pill warn\">public</span><small class=\"diagram-muted\">+ anyone with the link (read-only) &middot; hidden from others' lists/search</small></div></div>",
-  "css": ".share-tiers{display:flex;flex-direction:column;align-items:stretch;gap:8px}.share-tiers .diagram-card{display:flex;flex-direction:column;gap:4px;padding:12px 16px}.share-tiers .diagram-arrow{text-align:center;font-size:20px;line-height:1}"
+<Diagram id="doc-block-1wqhwzj" title={"الرؤية، واتساع إلى الخارج"} summary={"الرؤية الخشنة للمورد تحدد الأرضية؛ تضيف منح المشاركة الصريحة في الجدول المصاحب أشخاصًا محددين في الأعلى."}>
+
+```html
+<div class="share-tiers">
+  <div class="diagram-card">
+    <span class="diagram-pill">private</span
+    ><small class="diagram-muted"
+      >owner + explicit grants only &middot; <strong>default</strong></small
+    >
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&darr;</div>
+  <div class="diagram-card">
+    <span class="diagram-pill accent">org</span
+    ><small class="diagram-muted">+ anyone in the same org (read-only)</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&darr;</div>
+  <div class="diagram-card">
+    <span class="diagram-pill warn">public</span
+    ><small class="diagram-muted"
+      >+ anyone with the link (read-only) &middot; hidden from others'
+      lists/search</small
+    >
+  </div>
+</div>
+```
+
+```css
+.share-tiers {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  gap: 8px;
+}
+.share-tiers .diagram-card {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  padding: 12px 16px;
+}
+.share-tiers .diagram-arrow {
+  text-align: center;
+  font-size: 20px;
+  line-height: 1;
 }
 ```
 
+</Diagram>
+
 ## الأدوار في منحة الأسهم {#roles}
 
 عند المشاركة مع مستخدم أو مؤسسة معينة، فإنك تختار دورًا:

package/docs/content/locales/ar-SA/skills-guide.mdx

@@ -13,13 +13,72 @@ Skills موجود في `.agents/skills/<name>/SKILL.md` ويحتوي على إر
 
 يتم دائمًا إدخال المادة الأمامية لكل مهارة `name` و`description` في كتلة skills الخاصة بموجه النظام حتى يعرف العميل ما هو skills الموجود. يتم تحميل جسم المهارة بالكامل عند الطلب عندما يقرر الوكيل أن المهارة ذات صلة بالمهمة (يتم عرضها أيضًا عبر `docs-search`). ولهذا السبب فإن إبقاء الأوصاف قصيرة ومحددة للمشغل أمر مهم: الوصف هو الشيء الوحيد الذي يقرأه الوكيل قبل أن يقرر تحميل الباقي أم لا.
 
-```an-diagram title="الكشف التدريجي" summary="فقط الاسم + الوصف لكل مهارة يكون دائمًا في السياق. يتم تحميل الجسم بالكامل عند الطلب عندما تتطابق المهمة."
-{
-  "html": "<div class=\"sk-flow\"><div class=\"diagram-card\"><span class=\"diagram-pill accent\">دائما في موجه النظام</span><div class=\"sk-list\"><span class=\"diagram-pill\">storing-data &mdash; <small class=\"diagram-muted\">add data models&hellip;</small></span><span class=\"diagram-pill\">real-time-sync &mdash; <small class=\"diagram-muted\">wire polling&hellip;</small></span><span class=\"diagram-pill\">create-skill &mdash; <small class=\"diagram-muted\">add a skill&hellip;</small></span></div><small class=\"diagram-muted\">just name + description (cheap)</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-panel center\"><small class=\"diagram-muted\">task matches a description</small><span class=\"diagram-pill accent\">load on demand</span></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\">Full <code>SKILL.md</code> body<br><small class=\"diagram-muted\">قواعد، كود، افعل ولا تفعل</small></div></div>",
-  "css": ".sk-flow{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.sk-flow .diagram-card{display:flex;flex-direction:column;gap:8px;padding:14px 16px;min-width:240px}.sk-flow .sk-list{display:flex;flex-direction:column;gap:6px}.sk-flow .center{display:flex;flex-direction:column;align-items:center;gap:6px}.sk-flow .diagram-arrow{font-size:22px}"
+<Diagram id="doc-block-dyws55" title={"الكشف التدريجي"} summary={"فقط الاسم + الوصف لكل مهارة يكون دائمًا في السياق. يتم تحميل الجسم بالكامل عند الطلب عندما تتطابق المهمة."}>
+
+```html
+<div class="sk-flow">
+  <div class="diagram-card">
+    <span class="diagram-pill accent">دائما في موجه النظام</span>
+    <div class="sk-list">
+      <span class="diagram-pill"
+        >storing-data &mdash;
+        <small class="diagram-muted">add data models&hellip;</small></span
+      ><span class="diagram-pill"
+        >real-time-sync &mdash;
+        <small class="diagram-muted">wire polling&hellip;</small></span
+      ><span class="diagram-pill"
+        >create-skill &mdash;
+        <small class="diagram-muted">add a skill&hellip;</small></span
+      >
+    </div>
+    <small class="diagram-muted">just name + description (cheap)</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-panel center">
+    <small class="diagram-muted">task matches a description</small
+    ><span class="diagram-pill accent">load on demand</span>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-box">
+    Full <code>SKILL.md</code> body<br /><small class="diagram-muted"
+      >قواعد، كود، افعل ولا تفعل</small
+    >
+  </div>
+</div>
+```
+
+```css
+.sk-flow {
+  display: flex;
+  align-items: center;
+  gap: 14px;
+  flex-wrap: wrap;
+}
+.sk-flow .diagram-card {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding: 14px 16px;
+  min-width: 240px;
+}
+.sk-flow .sk-list {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+.sk-flow .center {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 6px;
+}
+.sk-flow .diagram-arrow {
+  font-size: 22px;
 }
 ```
 
+</Diagram>
+
 ## إطار العمل skills {#framework-skills}
 
 هذه هي skills المجمعة مع **القالب الافتراضي**. تعتمد المجموعة المحددة المتوفرة في أي تطبيق معين على القالب الذي قمت بتركيبه منه — تحقق من دليل `.agents/skills/` الخاص بهذا القالب لمعرفة ما يتم شحنه بالفعل.
@@ -148,14 +207,64 @@ scope: dev
 
 يحل هذا محل الاختراق القديم المتمثل في الاعتماد على كود Claude الذي يقرأ `.claude/skills` فقط - `scope: dev` يجعل تقسيم وقت التشغيل مقابل التطوير خيارًا صريحًا من الدرجة الأولى.
 
-```an-diagram title="أي وكيل يقوم بتحميل أي مهارة" summary="يحدد النطاق ما إذا كان وكيل وقت التشغيل داخل التطبيق يرى مهارة أم لا. تكون مهارات التطوير مرئية فقط لوكيل البرمجة الخاص بك."
-{
-"html": "<div class=\"sc-grid\"><div class=\"diagram-card\"><span class=\"diagram-pill\">.agents/skills/</span><div class=\"sc-row\"><span class=\"diagram-pill ok\">scope: both</span><small class=\"diagram-muted\">default</small></div><div class=\"sc-row\"><span class=\"diagram-pill ok\">scope: runtime</span></div><div class=\"sc-row\"><span class=\"diagram-pill warn\">scope: dev</span></div></div><div class=\"sc-targets\"><div class=\"diagram-box\">Runtime agent<br><small class=\"diagram-muted\">reads <code>both</code> + <code>runtime</code></small></div><div class=\"diagram-box\">وكيل البرمجة<br><small class=\"diagram-muted\">Claude Code reads <code>.claude/skills/</code> + <code>dev</code></small></div></div></div>",
-"css": ".sc-grid{display:flex;gap:24px;flex-wrap:wrap;align-items:flex-start}.sc-grid .diagram-card{display:flex;flex-direction:column;gap:8px;padding:14px 16px}.sc-grid .sc-row{display:flex;align-items:center;gap:8px}.sc-grid .sc-targets{display:flex;flex-direction:column;gap:10px}"
-}
+<Diagram id="doc-block-1cyxyfn" title={"أي وكيل يقوم بتحميل أي مهارة"} summary={"يحدد النطاق ما إذا كان وكيل وقت التشغيل داخل التطبيق يرى مهارة أم لا. تكون مهارات التطوير مرئية فقط لوكيل البرمجة الخاص بك."}>
+
+```html
+<div class="sc-grid">
+  <div class="diagram-card">
+    <span class="diagram-pill">.agents/skills/</span>
+    <div class="sc-row">
+      <span class="diagram-pill ok">scope: both</span
+      ><small class="diagram-muted">default</small>
+    </div>
+    <div class="sc-row">
+      <span class="diagram-pill ok">scope: runtime</span>
+    </div>
+    <div class="sc-row"><span class="diagram-pill warn">scope: dev</span></div>
+  </div>
+  <div class="sc-targets">
+    <div class="diagram-box">
+      Runtime agent<br /><small class="diagram-muted"
+        >reads <code>both</code> + <code>runtime</code></small
+      >
+    </div>
+    <div class="diagram-box">
+      وكيل البرمجة<br /><small class="diagram-muted"
+        >Claude Code reads <code>.claude/skills/</code> +
+        <code>dev</code></small
+      >
+    </div>
+  </div>
+</div>
+```
 
+```css
+.sc-grid {
+  display: flex;
+  gap: 24px;
+  flex-wrap: wrap;
+  align-items: flex-start;
+}
+.sc-grid .diagram-card {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding: 14px 16px;
+}
+.sc-grid .sc-row {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.sc-grid .sc-targets {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
 ```
 
+</Diagram>
+
 > **راجع أيضًا:** [Writing Agent Instructions](/docs/writing-agent-instructions) للتعرف على كيفية صياغة أوصاف المهارات، وتطبيق الإفصاح التدريجي، والحفاظ على `AGENTS.md`.
 
 ## Skills مقابل AGENTS.md {#skills-vs-agents-md}

package/docs/content/locales/ar-SA/template-analytics.mdx

@@ -18,13 +18,55 @@ description: "اطرح أسئلة تحليلية باللغة الإنجليزي
 
 إنه بديل مفتوح المصدر لـ Amplitude وMixpanel وLooker - للفرق التي ترغب في امتلاك التعليمات البرمجية والاستعلامات والبيانات.
 
-```an-diagram title="سؤال للرسم البياني" summary="يراجع الوكيل قاموس البيانات، ويكتب SQL، ويتحقق من صحته مقابل المستودع، ثم يعرض مخططًا أو يحفظ لوحة."
-{
-  "html": "<div class=\"diagram-flow\"><div class=\"diagram-node\">بلغة بسيطة<br>question</div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-panel center\"><span class=\"diagram-pill accent\">Agent</span><small class=\"diagram-muted\">reads data dictionary</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\" data-rough>يكتب SQL</div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-col\"><div class=\"diagram-pill ok\">تحقق تجريبي dry-run</div><small class=\"diagram-muted\">BigQuery / المصدر</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\">مخطط، جدول، أو<br>saved panel</div></div>",
-  "css": ".diagram-flow{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.diagram-flow .diagram-col{display:flex;flex-direction:column;gap:6px;align-items:center}.diagram-flow .center{display:flex;flex-direction:column;align-items:center;gap:4px}.diagram-flow .diagram-arrow{font-size:22px;line-height:1}"
+<Diagram id="doc-block-7hth9v" title={"سؤال للرسم البياني"} summary={"يراجع الوكيل قاموس البيانات، ويكتب SQL، ويتحقق من صحته مقابل المستودع، ثم يعرض مخططًا أو يحفظ لوحة."}>
+
+```html
+<div class="diagram-flow">
+  <div class="diagram-node">بلغة بسيطة<br />question</div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-panel center">
+    <span class="diagram-pill accent">Agent</span
+    ><small class="diagram-muted">reads data dictionary</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-box" data-rough>يكتب SQL</div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-col">
+    <div class="diagram-pill ok">تحقق تجريبي dry-run</div>
+    <small class="diagram-muted">BigQuery / المصدر</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-box">مخطط، جدول، أو<br />saved panel</div>
+</div>
+```
+
+```css
+.diagram-flow {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  flex-wrap: wrap;
+}
+.diagram-flow .diagram-col {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  align-items: center;
+}
+.diagram-flow .center {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
+}
+.diagram-flow .diagram-arrow {
+  font-size: 22px;
+  line-height: 1;
 }
 ```
 
+</Diagram>
+
 ## ما يمكنك فعله به
 
 - **اطرح الأسئلة المتعلقة بالبيانات باللغة الإنجليزية البسيطة.** "ما النسبة المئوية لعمليات الاشتراك التي تم تحويلها الشهر الماضي إلى مدفوعة؟" أو "اعرض لي المستخدمين النشطين أسبوعيًا خلال الأشهر الستة الماضية." يختار الوكيل المصدر الصحيح، ويكتب SQL، ويعرض المخطط.

package/docs/content/locales/ar-SA/template-assets.mdx

@@ -18,13 +18,71 @@ description: "مدير أصول رقمية أصلي للوكيل وخدمة إن
 
 عند فتح التطبيق، تظل المكتبة المحددة والموجه والمراجع والمرشحون الذين تم إنشاؤهم في مساحة عمل واحدة. يمكن للوكيل تصفح كل الأصول والبحث فيها وإنشاءها وتحسينها وتصديرها من خلال نفس actions الذي يستخدمه UI.
 
-```an-diagram title="إنشاء ومراجعة وإعادة الاستخدام" summary="المراجع والمطالبات تغذي جلسة إنشاء واختيار؛ تصل الأصول المختارة إلى مكتبة وتتدفق إلى تطبيقات أخرى عبر المنتقي أو A2A."
-{
-  "html": "<div class=\"diagram-assets\"><div class=\"diagram-col\"><div class=\"diagram-node\">References<br><small class=\"diagram-muted\">الشعارات، صور المنتج، الأسلوب</small></div><div class=\"diagram-node\">اِسْتَدْعَى<br><small class=\"diagram-muted\">الدردشة أو عناصر تحكم Generate</small></div></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\" data-rough><span class=\"diagram-pill accent\">جلسة إنشاء</span><small class=\"diagram-muted\">image &amp; video candidates · audit log</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\" data-rough><span class=\"diagram-pill ok\">مكتبة</span><small class=\"diagram-muted\">assets مختارة ومتسقة مع العلامة</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-col\"><div class=\"diagram-node\">Picker<br><small class=\"diagram-muted\">iframe / تطبيق MCP</small></div><div class=\"diagram-node\">A2A<br><small class=\"diagram-muted\">شرائح · تصميم · محتوى</small></div></div></div>",
-  "css": ".diagram-assets{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.diagram-assets .diagram-col{display:flex;flex-direction:column;gap:10px}.diagram-assets .diagram-box{display:flex;flex-direction:column;gap:4px}.diagram-assets .diagram-arrow{font-size:20px;line-height:1}"
+<Diagram id="doc-block-1dgpq40" title={"إنشاء ومراجعة وإعادة الاستخدام"} summary={"المراجع والمطالبات تغذي جلسة إنشاء واختيار؛ تصل الأصول المختارة إلى مكتبة وتتدفق إلى تطبيقات أخرى عبر المنتقي أو A2A."}>
+
+```html
+<div class="diagram-assets">
+  <div class="diagram-col">
+    <div class="diagram-node">
+      References<br /><small class="diagram-muted"
+        >الشعارات، صور المنتج، الأسلوب</small
+      >
+    </div>
+    <div class="diagram-node">
+      اِسْتَدْعَى<br /><small class="diagram-muted"
+        >الدردشة أو عناصر تحكم Generate</small
+      >
+    </div>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-box" data-rough>
+    <span class="diagram-pill accent">جلسة إنشاء</span
+    ><small class="diagram-muted"
+      >image &amp; video candidates · audit log</small
+    >
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-box" data-rough>
+    <span class="diagram-pill ok">مكتبة</span
+    ><small class="diagram-muted">assets مختارة ومتسقة مع العلامة</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-col">
+    <div class="diagram-node">
+      Picker<br /><small class="diagram-muted">iframe / تطبيق MCP</small>
+    </div>
+    <div class="diagram-node">
+      A2A<br /><small class="diagram-muted">شرائح · تصميم · محتوى</small>
+    </div>
+  </div>
+</div>
+```
+
+```css
+.diagram-assets {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  flex-wrap: wrap;
+}
+.diagram-assets .diagram-col {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+.diagram-assets .diagram-box {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+.diagram-assets .diagram-arrow {
+  font-size: 20px;
+  line-height: 1;
 }
 ```
 
+</Diagram>
+
 ## متى يتم اختياره
 
 - **يحتاج فريقك إلى توجيه مرئي قابل لإعادة الاستخدام**، وليس مطالبات إعلامية عامة لمرة واحدة — اجمع الشعارات المعتمدة ولقطات المنتجات وأمثلة الأنماط حتى تظل الأجيال متمسكة بالعلامة التجارية.