منصوبے کے بارے میں
Ark UI ایک اوپن سورس، headless کمپوننٹ لائبریری ہے جسے Chakra UI ٹیم برقرار رکھتی ہے۔ یہ ڈیزائن سسٹمز اور ویب ایپلی کیشنز بنانے کے لیے unstyled لاجک اور accessibility لیئر فراہم کرتی ہے، جبکہ تمام بصری اسٹائلنگ ڈویلپر پر چھوڑ دیتی ہے۔
**بنیادی طریقہ کار**
یہ پروجیکٹ کمپوننٹ کے رویے (behaviour) کو اس کی ظاہری شکل سے الگ کرتا ہے۔ ہر کمپوننٹ بغیر کسی ڈیفالٹ اسٹائل کے آتا ہے، تاکہ ٹیمیں Tailwind، Panda CSS، CSS-in-JS حل جیسے Emotion یا Styled Components، CSS Modules، یا سادہ CSS استعمال کر سکیں۔ اس کا مقصد ڈیزائن سسٹم کے مصنفین کو پریزنٹیشن پر مکمل کنٹرول دینا ہے جبکہ وہ آزمودہ انٹرایکشن اور accessibility رویوں سے فائدہ اٹھا سکیں۔
**آرکیٹیکچر**
کمپوننٹ لاجک Zag.js finite state machines پر مبنی ہے۔ README کے مطابق، اس سے قابل پیش گوئی اور type-safe اسٹیٹ ٹرانزیشنز، آسان ٹیسٹنگ اور ڈیبگنگ، اور کم edge cases حاصل ہوتے ہیں۔ ایک ہی کمپوننٹ رویہ React، Solid، Vue اور Svelte کے لیے الگ الگ پیکیجز کے ذریعے فراہم کیا جاتا ہے، تاکہ ایک ڈیزائن سسٹم لاجک کو دوبارہ لکھے بغیر مختلف فریم ورکس میں ایک ہی API استعمال کر سکے۔ یہ پیکیجز TypeScript کے ساتھ مکمل طور پر typed ہیں۔
**Accessibility**
README کے مطابق، کمپوننٹس WAI-ARIA ڈیزائن پیٹرنز پر عمل کرتے ہیں اور انہیں معاون ٹیکنالوجیز (assistive technologies) کے ساتھ ٹیسٹ کیا گیا ہے۔ دعویٰ کردہ خصوصیات میں مناسب ARIA attributes اور roles، کی بورڈ نیویگیشن، فوکس مینجمنٹ، اسکرین ریڈر اعلانات اور 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 جیسے primitives سے ترتیب دیا جاتا ہے۔ README میں ایک Dialog کی مثال دکھائی گئی ہے جو چاروں فریم ورکس میں تقریباً یکساں مارک اپ کے ساتھ رینڈر ہوتی ہے۔
**ایکوسسٹم**
Ark UI، Chakra UI v3 کی بنیاد ہے، اور README میں Park UI اور Tark UI کا ذکر بھی ہے جو اس کے اوپر بنائے گئے styled کمپوننٹ سیٹس ہیں۔ ایک علیحدہ integrations فولڈر AI-assisted ڈویلپمنٹ کے لیے MCP سرور فراہم کرتا ہے۔
**دستاویزات اور کمیونٹی**
گائیڈز، فی کمپوننٹ API ریفرنسز، مثالیں اور اسٹائلنگ ریسیپیز ark-ui.com پر دستیاب ہیں۔ پروجیکٹ کی ایک Discord کمیونٹی، فیچر درخواستوں کے لیے ایک عوامی Canny روڈ میپ اور ایک بلاگ ہے۔ شراکت داری (contributions) ایک کنٹری بیوٹنگ گائیڈ کے ذریعے قبول کی جاتی ہے، اور سپورٹ دستاویزات، Discord اور GitHub issues کے ذریعے فراہم کی جاتی ہے۔ ڈویلپمنٹ Open Collective کے ذریعے فنڈڈ ہے، اور پروجیکٹ MIT لائسنس کے تحت جاری کیا گیا ہے۔
Comments
0 Rating appears after 10 ratings
Sign in to join the discussion.