عن المشروع

Flowbite هي مكتبة مكونات واجهة مستخدم (UI) وإطار عمل للواجهات الأمامية مفتوح المصدر مبني على Tailwind CSS. تهدف المكتبة إلى تسريع تطوير المواقع الإلكترونية من خلال توفير مجموعة جاهزة من مكونات الويب التي تستخدم فئات Tailwind المساعدة، مما يتيح للمطورين تجميع الواجهات من أنماط موجودة بدلاً من كتابة كل عنصر من الصفر. **التثبيت والاستخدام** يمكن إضافة المكتبة كإضافة (plugin) إلى مشروع Tailwind CSS الحالي عبر npm (`npm install flowbite`). يتضمن الإعداد الموثق استيراد متغيرات سمات Flowbite إلى ملف CSS الرئيسي، وتسجيل الإضافة، وتكوين ملفات المصدر داخل node_modules، وتحميل ملف JavaScript المجمع الذي يشغل العناصر التفاعلية. تمت الإشارة إلى عدة سمات مدمجة في ملف README، بما في ذلك الخيارات الافتراضية، والبسيطة (minimal)، والمؤسسية (enterprise)، والمرحة (playful)، والأحادية (mono)، حيث يقترن كل منها بخط ويب محدد. كما تم وصف مسار CDN لإضافة ملفات CSS وJS المصغرة بسرعة إلى الصفحة. **نموذج التفاعل** تعتمد المكونات التفاعلية بشكل أساسي على واجهة سمات البيانات (data-attribute): حيث تقوم سمات مثل `data-modal-target` و `data-modal-toggle` بربط عناصر التشغيل بالمكونات دون الحاجة إلى برمجة مخصصة، وتتبع معظم أمثلة التوثيق هذه الاستراتيجية. لمزيد من التحكم، تتيح دالة `initFlowbite()` (أو المساعدات الخاصة بكل فئة مثل `initDropdowns` و `initModals`) لأطر العمل مثل Vue و Nuxt تسجيل مستمعي الأحداث بأنفسهم. **واجهات برمجة التطبيقات البرمجية والمحددة النوع** توفر الحزمة المكونات كفئات JavaScript تدعم كلاً من ESM و CJS. على سبيل المثال، يمكن إنشاء نافذة منبثقة (modal) مع خيارات تغطي الموضع، وسلوك الخلفية، وعمليات استدعاء مثل `onShow` و `onHide` و `onToggle`. كما تتوفر تعريفات أنواع TypeScript، بما في ذلك واجهات مثل `ModalOptions` و `ModalInterface` لضمان تحديد أنواع كائنات الخيارات والمثيلات. **كتالوج المكونات** يسرد ملف README مجموعة واسعة من المكونات، من بينها التنبيهات، والشارات، ومسارات التنقل (breadcrumbs)، والأزرار ومجموعات الأزرار، والبطاقات، والقوائم المنسدلة، والنماذج، ومجموعات القوائم، وتنسيقات النصوص، والنوافذ المنبثقة، وعلامات التبويب، وأشرطة التنقل، والترقيم، والجداول الزمنية، وأشرطة التقدم، والجداول، وإشعارات الـ toast، وتلميحات الأدوات (tooltips)، ومنتقيات التاريخ، والمؤشرات الدوارة (spinners)، والتذييلات، والقوائم المنسدلة (accordions)، والأشرطة الجانبية، والمنزلقات (carousels)، والصور الرمزية (avatars)، والتقييمات، ومجموعة متنوعة من مدخلات النماذج (حقل الإدخال، إدخال الملفات، إدخال البحث، الاختيار، منطقة النص، مربع الاختيار، الراديو، التبديل، ومنزلق النطاق). **دعم أطر العمل والمنصات** تتمتع مكونات Flowbite UI بدعم أصلي للغات التي تكتب من اليمين إلى اليسار (RTL)، والذي يتم تفعيله من خلال سمة `dir="rtl"`. توجد مكتبات مستقلة يديرها المجتمع لـ React و Vue و Svelte و Angular و Qwik. كما تتوفر أدلة تكامل لأطر عمل مثل Next.js و Remix و Nuxt و Astro و MeteorJS و Gatsby و SolidJS و Qwik، ولأطر عمل الواجهات الخلفية بما في ذلك Laravel و Symfony و Ruby on Rails 7 و Phoenix (Elixir) و Django و Flask، نظرًا لأن المكتبة تعتمد على JavaScript الخام (vanilla JS). **الموارد ذات الصلة** يشير المشروع إلى موارد إضافية ضمن نفس النظام البيئي: نظام تصميم Figma، وأقسام "Flowbite Blocks" مسبقة الصنع، ومجموعة أيقونات، ومساعد GPT. تتوفر نسخة Pro تجارية إلى جانب الحزمة مفتوحة المصدر، ويربط المستودع بقنوات المجتمع مثل Discord وشارات تحميل/إصدار npm. الترخيص المعتمد هو MIT.