يعرض الأحداث والأنشطة ذات التسلسل الزمني من خلال المخططات الزمنية وموجزات الأنشطة ومخططات جانت وواجهات التقويم. يُستخدم عند عرض الأحداث التاريخية أو جداول المشروع أو الموجزات الاجتماعية أو الإشعارات أو سجلات التدقيق أو البيانات المستندة إلى الوقت. يوفر أنماط تنفيذ للجداول الزمنية الرأسية/الأفقية، والمرئيات التفاعلية، والتحديثات في الوقت الفعلي، والتصميمات سريعة الاستجابة مع إمكانية الوصول (WCAG/ARIA).
ثبّت مهارة الذكاء الاصطناعي displaying-timelines بسرعة في بيئة التطوير لديك عبر سطر الأوامر
المصدر: ancoleman/ai-design-components.
This skill enables systematic creation of timeline and activity components, from simple vertical timelines to complex interactive Gantt charts. It provides clear decision frameworks based on use case and data characteristics, ensuring optimal performance, real-time updates, and accessible implementations.
For detailed selection criteria, reference references/component-selection.md.
Reference references/accessibility-patterns.md for complete requirements.
يعرض الأحداث والأنشطة ذات التسلسل الزمني من خلال المخططات الزمنية وموجزات الأنشطة ومخططات جانت وواجهات التقويم. يُستخدم عند عرض الأحداث التاريخية أو جداول المشروع أو الموجزات الاجتماعية أو الإشعارات أو سجلات التدقيق أو البيانات المستندة إلى الوقت. يوفر أنماط تنفيذ للجداول الزمنية الرأسية/الأفقية، والمرئيات التفاعلية، والتحديثات في الوقت الفعلي، والتصميمات سريعة الاستجابة مع إمكانية الوصول (WCAG/ARIA). المصدر: ancoleman/ai-design-components.
حقول وأوامر مستقرة للاقتباس في أنظمة الذكاء الاصطناعي والبحث.
npx skills add https://github.com/ancoleman/ai-design-components --skill displaying-timelinesيعرض الأحداث والأنشطة ذات التسلسل الزمني من خلال المخططات الزمنية وموجزات الأنشطة ومخططات جانت وواجهات التقويم. يُستخدم عند عرض الأحداث التاريخية أو جداول المشروع أو الموجزات الاجتماعية أو الإشعارات أو سجلات التدقيق أو البيانات المستندة إلى الوقت. يوفر أنماط تنفيذ للجداول الزمنية الرأسية/الأفقية، والمرئيات التفاعلية، والتحديثات في الوقت الفعلي، والتصميمات سريعة الاستجابة مع إمكانية الوصول (WCAG/ARIA). المصدر: ancoleman/ai-design-components.
افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal انسخ ونفّذ هذا الأمر: npx skills add https://github.com/ancoleman/ai-design-components --skill displaying-timelines بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw
https://github.com/ancoleman/ai-design-components