عن المشروع

Ark UI هي مكتبة مكونات مفتوحة المصدر وغير منسقة (headless) يشرف عليها فريق Chakra UI. وهي توفر المنطق وطبقة إمكانية الوصول لبناء أنظمة التصميم وتطبيقات الويب، تاركةً كافة التنسيقات المرئية للمطور. **النهج الأساسي** يفصل المشروع بين سلوك المكون ومظهره. يتم شحن كل مكون بدون أنماط افتراضية، بحيث يمكن للفرق تطبيق Tailwind أو Panda CSS أو حلول CSS-in-JS مثل Emotion أو Styled Components، أو CSS Modules، أو CSS العادي. والهدف المعلن هو منح مؤلفي أنظمة التصميم تحكماً كاملاً في العرض مع وراثة سلوكيات التفاعل وإمكانية الوصول المختبرة. **البنية التحتية** تم بناء منطق المكونات على آلات الحالة المحدودة (finite state machines) الخاصة بـ Zag.js. ووفقاً لملف README، فإن هذا يؤدي إلى انتقالات حالة يمكن التنبؤ بها وآمنة من حيث النوع، واختبار وتصحيح أخطاء أسهل، وحالات استثنائية أقل. يتم توفير نفس سلوك المكون من خلال حزم منفصلة لـ React و Solid و Vue و Svelte، بحيث يمكن لنظام التصميم مشاركة واجهة برمجة تطبيقات واحدة عبر الأطر المختلفة دون إعادة كتابة المنطق. الحزم مكتوبة بالكامل باستخدام TypeScript. **إمكانية الوصول** يذكر ملف README أن المكونات تتبع أنماط تصميم WAI-ARIA وتم اختبارها باستخدام التقنيات المساعدة. وتشمل الميزات المذكورة سمات وأدوار ARIA المناسبة، والتنقل عبر لوحة المفاتيح، وإدارة التركيز، وإعلانات قارئ الشاشة، ودعم RTL (من اليمين إلى اليسار). **المكونات** تروج Ark UI لأكثر من 45 مكوناً مقسمة تقريباً إلى: - التخطيط والتنقل: Accordion، Tabs، Splitter، Steps، Tree View، Tour - التراكبات: Dialog، Popover، Tooltip، Hover Card، Bottom Sheet، Floating Panel - النماذج والمدخلات: Checkbox، Radio Group، Select، Combobox، Number Input، Pin Input، Tags Input، Editable، File Upload، Color Picker، Date Picker، Password Input، Signature Pad، Slider، Angle Slider، Rating Group، Switch، Toggle و Toggle Group - عرض البيانات: Avatar، Highlight، Progress، QR Code، Format، JSON Tree View، Marquee - الأدوات المساعدة: Carousel، Clipboard، Collapsible، Field و Fieldset، Menu، Pagination، Portal، Presence، Scroll Area، Segment Group، Timer، Toast، Client Only، Download Trigger، Focus Trap، Frame، Collection، Listbox **التثبيت والاستخدام** لكل إطار عمل حزمة npm خاصة به (`@ark-ui/react` و `@ark-ui/solid` و `@ark-ui/vue` و `@ark-ui/svelte`). يتم استيراد المكونات بشكل فردي، على سبيل المثال `@ark-ui/react/dialog` وتتكون من عناصر أساسية مثل Root و Trigger و Backdrop و Positioner و Content و Title و Description و CloseTrigger. يعرض ملف README مثالاً لـ Dialog يتم رندرتُه بتنسيق متطابق تقريباً في جميع الأطر الأربعة. **النظام البيئي** تعتبر Ark UI الأساس لـ Chakra UI v3، كما يذكر ملف README أيضاً Park UI و Tark UI كمجموعات مكونات منسقة مبنية فوقها. يوفر مجلد تكاملات منفصل خادم MCP للتطوير بمساعدة الذكاء الاصطناعي. **التوثيق والمجتمع** توجد الأدلة، ومراجع واجهة برمجة التطبيقات لكل مكون، والأمثلة، ووصفات التنسيق في ark-ui.com. يمتلك المشروع مجتمع Discord، وخارطة طريق عامة على Canny لطلبات الميزات، ومدونة. يتم قبول المساهمات من خلال دليل المساهمة، ويتم تقديم الدعم عبر التوثيق و Discord وقضايا GitHub. يتم تمويل التطوير عبر Open Collective، ويتم إصدار المشروع بموجب رخصة MIT.