visual-architect — توثيق بصري تفاعلي أصيل
مُستلهَم من Archify (الفيديو 84K⭐، 2026-10-16) — مبني أصيلاً مستقراً بصفر تبعية.
ما يفعله
كود/فكرة/مشروع → HTML تفاعلي standalone (كل عقدة تنقرها تشرح + تربط بسطور الكود المصدري). يُفتح في أي متصفّح بلا تثبيت/CDN. يسدّ فجوة diagram-maker/graphify (رسوم ثابتة).الأوامر
python3 skills/visual-architect/visual_architect.py selftest
python3 skills/visual-architect/visual_architect.py scan <project_dir>
python3 skills/visual-architect/visual_architect.py render <project_dir> [--out x.html] [--title "..."] [--source-base "https://github.com/.../blob/main"]
python3 skills/visual-architect/visual_architect.py idea "<وصف نظام نصّي>" [--out x.html]
البنية (3 مراحل، أصيلة)
1. scan — يمسح مجلد مشروع → بنية (ملفات/دوال/كلاسات/استيرادات) عبر AST (python) + regex (باقي اللغات: js/ts/go/java/c/cpp/rust/ruby/shell). 2. graph — يبني عقداً وحواف (علاقات import الحقيقية بين ملفات المشروع). 3. render — HTML تفاعلي (SVG + JS مدمج، صفر CDN): عقد ملوّنة بـlang + قابلة للنقر + لوحة تفاصيل + روابط للكود المصدري (source-base).الأمان (خط أحمر)
- XSS محمي: كل المحتوى مُهرّب في HTML + JSON المدمج في
<script>يُهرّب<>&إلى\u003c...(منع</script>injection). - صفر تبعية/CDN: standalone كامل (يعمل offline).
الاستخدام
- توثيق مشاريعنا البرمجية + شرحها للعملاء/الفريق (KCPC).
- خرائط تعلّم + مخططات أنظمة + method statements بصرية.
- يُثري reverse-engineering (RE → رسم بنية) + delegate-unified.
selftest: 6/6 ALL PASS ✅
المحرّك:visual_architect.py (18KB، /usr/bin/python3، numpy سليم).