شیڈولر اور ڈیٹا گرڈ React کمپوننٹس کے طور پر بھی موجود ہیں، @needless-ui/react میں: وہی فیچرز، وہی کی بورڈ سپورٹ اور وہی رسائی جو Angular میں ہے، وہی اسٹائل شیٹ اور وہی MIT لائسنس۔ باقی کمپوننٹس آ رہے ہیں۔ انہیں React 19 درکار ہے، اور یہ Next.js App Router اور Vite دونوں کے ساتھ کام کرتے ہیں۔
انسٹالیشن
pnpm add @needless-ui/react @needless-ui/cssاسٹائلز امپورٹ کریں
کمپوننٹس اپنے ساتھ کوئی اسٹائل نہیں لاتے۔ اپنی ایپ کی کسی CSS فائل سے اسٹائل شیٹ ایک بار امپورٹ کریں۔
/* app/globals.css in Next.js, src/index.css with Vite */
@layer reset, nui, app;
@import '@needless-ui/css';لیئرز Angular کی طرح کام کرتی ہیں: ری سیٹس nui سے پہلے کی لیئر میں جاتے ہیں، اور Tailwind CSS کے ساتھ nui کو Tailwind کی base لیئر اور اس کی یوٹیلٹیز کے درمیان رکھا جاتا ہے، جیسا کہ آغاز میں دکھایا گیا ہے۔
شیڈولر
ہر کمپوننٹ کا اپنا انٹری پوائنٹ ہے۔ شیڈولر وہ events دکھاتا ہے جو آپ پاس کرتے ہیں، اور جب لوگ کوئی ایونٹ منتقل کریں یا نئے ایونٹ کے لیے وقت چنیں تو آپ کو بتاتا ہے: ایونٹس آپ ہی کے پاس رہتے ہیں۔
ڈیٹا گرڈ
columns کو کمپوننٹ سے باہر بیان کریں، تاکہ گرڈ ہر رینڈر پر اپنا کام دوبارہ نہ کرے۔ ہر ترمیم نئی قطاروں کے ساتھ onRowsChange کو کال کرتی ہے، اور Excel ایکسپورٹ جیسے میتھڈز گرڈ کے ref پر ہیں۔
React کی اصطلاحات میں API
React کمپوننٹس انہی اسپیکس پر چلتے ہیں جن پر Angular والے، اس لیے ان کے API ایک جیسے ہیں، بس React کی اصطلاحات میں۔ API صفحات ہر پراپ کی فہرست دیتے ہیں: شیڈولر کا صفحہ اور ڈیٹا گرڈ کا صفحہ۔
| Angular | React |
|---|---|
ایک ماڈل، [(view)] | اسٹیٹ: view کے ساتھ onViewChange، یا defaultView تاکہ کمپوننٹ اسے خود رکھے |
ایک آؤٹ پٹ، (eventClick) | ایک کال بیک، onEventClick |
ایک ٹیمپلیٹ، <ng-template nuiSchedulerEvent> | بنانے والا فنکشن، renderEvent |
ایک میتھڈ، scheduler.next() | ref پر ایک میتھڈ، ref.current.next() |
children، ٹری ڈیٹا کے لیے | getChildren: React میں children ایلیمنٹس کے لیے مخصوص ہے |
locale، ڈیفالٹ طور پر ایپ کا LOCALE_ID | locale، ڈیفالٹ طور پر en-US |
سرور رینڈرنگ
دونوں کمپوننٹس سرور پر رینڈر ہوتے ہیں اور پھر براؤزر میں ہائیڈریٹ ہوتے ہیں۔ پیکیج انہیں کلائنٹ کمپوننٹس کے طور پر نشان زد کرتا ہے، اس لیے کوئی Server Component انہیں ایسے پراپس کے ساتھ رینڈر کر سکتا ہے جو سیریلائز ہو سکیں، اور nuiSchedulerFromIcs جیسے مددگار فنکشنز سرور پر چلتے ہیں۔ کال بیکس براؤزر تک نہیں جا سکتے: جو کمپوننٹ انہیں لیتا ہے وہ آپ کے اپنے کلائنٹ کمپوننٹ میں جاتا ہے، جیسے اوپر والے دونوں۔
جو کچھ پڑھنے والے پر منحصر ہے وہ براؤزر کا انتظار کرتا ہے: شیڈولر میں موجودہ وقت کی لکیر، اور یہ کہ آج کون سا دن ہے۔ جب سرور شیڈولر رینڈر کرے تو اسے defaultDate دیں، کیونکہ ضروری نہیں کہ سرور کا “آج” پڑھنے والے کا بھی “آج” ہو۔