dev-dga
المكوّناتالتوافقإمكانية الوصولالعربية والاتجاهالتثبيتStorybook

الأزرار والإجراءات

زرزر عائمرابطزر تبديلمبدّل المحتوى

حقول الإدخال

حقل نصّيمنطقة نصّيةحقل رقميقائمة اختيارقائمة منسدلةمربّع اختيارزر اختيارمفتاح تبديلشريط تمريرتقييمرمز تحقّقحقل الوسوممربّع بحثرفع الملفّاتمنتقي التاريخمنتقي نطاق التاريخشريحة

عرض البيانات

بطاقةوسموسم الحالةصورة رمزيةفاصلقائمة وصفقائمةقائمة مُنظّمةمؤشّر أداءاقتباسمخطّط زمنيجدولنسبة الأبعادختم رقميمقتطف codeالريال السعودي

تمثيل البيانات

مخطّطات

التنبيهات والحالة

تنبيه مضمّنإشعارإشعار منبثقتلميحمؤشّر تحميلهيكل تحميلمؤشّر تقدّمحالة فارغة

الطبقات المنبثقة

نافذة حوارلوح جانبيلوح منبثققائمة منزلقةقائمة إجراءاتشريط قوائملوح تصفيةلوحة أوامر

التنقّل

تبويباتمسار تنقّلترقيم صفحاتأكورديونمؤشّر خطواتعنصر قابل للطيمنطقة تمريرمعرض متحرّك

هيكل التطبيق

شريط جانبي

المزوّد والأدوات

المزوّد
عرض البيانات

وسم الحالة

StatusTag

حبة بنقطة وتسمية لعرض الحالة.

افتح في ستوري بوك ↗import { StatusTag }from '@dev-dga/react'

يجمع StatusTag نقطة ملونة مع تسمية قصيرة. حدد tone للمعنى وstatus للتعبئة، وللتصنيفات استخدم Tag.

الدرجات

أنماط الحالة

الأحجام

السابقوسمالتاليصورة رمزية
dev-dga

كود منصّات هيئة الحكومة الرقمية، بمكوّنات React 19 قابلة للوصول.

استكشف

المكوّناتالتثبيتمنسّق السمةالكتلأمثلةStorybook

البراهين

التوافقإمكانية الوصولالعربية والاتجاه

المشروع

GitHubرخصة MITnpm · @dev-dga/react

تطبيق مستقل وحر الاستخدام برخصة MIT. غير تابع لهيئة الحكومة الرقمية السعودية الرسمية ولا مُعتمد منها.

من إنشاء Dhaifallah Alfarawi · @DevDhaif

MIT · مبني بـ @dev-dga

    نشِطقيد الانتظارفاشلقيد التنفيذمسودّة
    خفيفشبحيمعكوس
    قيد المراجعةقيد المراجعةقيد المراجعة