শিডিউলার ও ডেটা গ্রিড @needless-ui/react-এ React কম্পোনেন্ট হিসেবেও আছে: Angular-এর মতোই ফিচার, কীবোর্ড ও অ্যাক্সেসিবিলিটি, একই স্টাইলশিট আর একই MIT লাইসেন্স। বাকি কম্পোনেন্টগুলো আসছে। এগুলোর জন্য React 19 লাগে, আর এগুলো Next.js App Router ও Vite-এর সঙ্গে কাজ করে।

ইনস্টল করুন

install.sh
pnpm add @needless-ui/react @needless-ui/css

স্টাইল ইমপোর্ট করুন

কম্পোনেন্টগুলোর সঙ্গে কোনো স্টাইল আসে না। আপনার অ্যাপের কোনো CSS ফাইল থেকে স্টাইলশিটটি একবার ইমপোর্ট করুন।

globals.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 API ও React-এ তার রূপ
AngularReact
মডেল, [(view)]অবস্থা: onViewChange-সহ view, অথবা কম্পোনেন্ট নিজেই রাখবে এমন defaultView
আউটপুট, (eventClick)কলব্যাক, onEventClick
টেমপ্লেট, <ng-template nuiSchedulerEvent>আঁকার ফাংশন, renderEvent
মেথড, scheduler.next()ref-এ মেথড, ref.current.next()
children, ট্রি ডেটার জন্যgetChildren: React-এ children এলিমেন্টের জন্য
locale, ডিফল্টভাবে অ্যাপের LOCALE_IDlocale, ডিফল্টভাবে en-US

সার্ভার রেন্ডারিং

দুটি কম্পোনেন্টই সার্ভারে রেন্ডার হয়, তারপর হাইড্রেট হয়। প্যাকেজটি এগুলোকে ক্লায়েন্ট কম্পোনেন্ট হিসেবে চিহ্নিত করে, তাই একটি Server Component সিরিয়ালাইজ করা যায় এমন প্রপ দিয়ে এগুলো রেন্ডার করতে পারে, আর nuiSchedulerFromIcs-এর মতো হেল্পার সার্ভারে চলে। কলব্যাক ব্রাউজারে যেতে পারে না: যে কম্পোনেন্ট সেগুলো নেয়, সেটি আপনার নিজের কোনো ক্লায়েন্ট কম্পোনেন্টে বসে, ওপরের দুটির মতো।

যা ব্যবহারকারীর ওপর নির্ভর করে, তা ঠিক হয় ব্রাউজারেই: শিডিউলারে এখনকার সময়ের রেখা, আর আজ কোন দিন। সার্ভার শিডিউলার রেন্ডার করলে একে একটি defaultDate দিন, কারণ সার্ভারের আজ ব্যবহারকারীর আজ না-ও হতে পারে।