زمان‌بند و جدول داده کامپوننت‌های 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 بین لایهٔ base در Tailwind و یوتیلیتی‌های آن قرار می‌گیرد؛ همان‌طور که شروع کار نشان می‌دهد.
زمان‌بند
هر کامپوننت نقطهٔ ورود خودش را دارد. زمان‌بند رویدادهایی را که در events می‌دهید نشان می‌دهد، و وقتی کاربران رویدادی را جابه‌جا می‌کنند یا برای رویدادی تازه زمانی انتخاب می‌کنند، به شما خبر می‌دهد: رویدادها را خودتان نگه می‌دارید.
جدول داده
columns را بیرون از کامپوننت توصیف کنید تا جدول در هر رندر کارش را از نو انجام ندهد. هر ویرایش onRowsChange را با ردیف‌های جدید صدا می‌زند، و متدهایی مثل خروجی Excel روی ref جدول هستند.
API به زبان React
کامپوننت‌های 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 |
رندر سمت سرور
هر دو کامپوننت روی سرور رندر می‌شوند و در مرورگر hydrate می‌شوند. پکیج آن‌ها را کامپوننت کلاینت (client component) علامت زده است، پس یک Server Component می‌تواند آن‌ها را با پراپ‌های سریال‌پذیر رندر کند، و توابع کمکی‌ای مثل nuiSchedulerFromIcs روی سرور اجرا می‌شوند. کال‌بک‌ها نمی‌توانند به مرورگر منتقل شوند: کامپوننتی که آن‌ها را می‌گیرد، داخل یک کامپوننت کلاینتِ خودتان قرار می‌گیرد، مثل دو مثال بالا.
آنچه به خواننده بستگی دارد، منتظر مرورگر می‌ماند: خط زمان فعلی در زمان‌بند، و اینکه امروز چه روزی است. وقتی سرور زمان‌بند را رندر می‌کند، به آن defaultDate بدهید، چون «امروزِ» سرور ممکن است «امروزِ» خواننده نباشد.