المزوّد
DgaProviderDgaProvider جذر كل تطبيق @dev-dga: يضبط الاتجاه والوضع الداكن وسمة العلامة، ويستضيف البوّابة لترثها الطبقات المنبثقة. غلّف مرّة واحدة.
استورد ملف الأنماط مرة واحدة (import '@dev-dga/css') ولف تطبيقك بـ DgaProvider واحد. يوفر الاتجاه والوضع الداكن والسمة لكل المكونات بما فيها النوافذ العائمة.
متى تستخدمه
استخدم DgaProvider مرّة واحدة في جذر تطبيقك بعد استيراد @dev-dga/css. اضبط dir="rtl" للعربية، وmode="dark" للوضع الداكن، وtheme لاختيار لوحة العلامة. يقرأ كل مكوّن هذه القيم من المزوّد، بما فيها الحوارات والقوائم المعروضة في البوّابات.
يمكن تداخل المزوّدات لمعاينة تختلف عن الصفحة، مثل الأمثلة في هذا الموقع.
أمثلة
الخصائص
الخصائص التي يعرّفها DgaProvider. سمات العنصر الأصلي تمرّ كما هي.
| الخاصية | النوع | الافتراضي | الوصف |
|---|---|---|---|
dir | "ltr" | "rtl" | ||
locale | string | ||
mode | "dark" | "light" | ||
theme | DgaTheme | Brand theme. theme.primary accepts a palette name ('lavender'),
any CSS color string ('#7C3AED' , hover/active auto-derived via
color-mix()), or an explicit { base, hover, active, foreground? }
triplet. The override-object pattern (style={{ '--ddga-color-primary': '...' }}) still works , style wins over theme. | |
as | DgaRootElement | ||
className | string | ||
style | react.CSSProperties | ||
childrenإلزامي | react.ReactNode |
إمكانية الوصول
يضبط المزوّد السمة dir ليتبع خوارزمية المتصفّح ثنائية الاتجاه والتقنيات المساعدة اتجاهَ القراءة. اضبط lang على المستند بنفسك ليبدّل قارئ الشاشة الصوت إلى العربية.
تُعرض الطبقات المنبثقة داخل بوّابة المزوّد، فترث الاتجاه والسمة وإعدادات التباين بدل الرجوع إلى إعدادات المستند الافتراضية.