نوار پیشرفت

import { Progress, Spinner } from "@kashi-ui/react";

نمونه

<Progress value={35} label="آپلود گزارش.pdf" showValue />
<Progress value={100} tone="success" label="پشتیبان‌گیری" showValue size="sm" />
<Progress aria-label="در حال پردازش" size="sm" />   // بدون value: نامعین
<Spinner size="sm" />

دایره‌ای

<Progress variant="circular" value={72} showValue aria-label="پیشرفت پروژه" />
<Progress variant="circular" size="sm" aria-label="در حال پردازش" />

variant="circular" با همان value، size، tone و showValue. متغیرهای CSS: --k-progress-height، --k-progress-color، --k-progress-ring-size.

ویژگی‌ها

دسترس‌پذیری

• role="progressbar" با aria-valuenow و aria-valuetext فارسی («۳۵٪»)؛ در حالت نامعین aria-valuenow حذف می‌شود.
• اسپینر role="status" با متن «در حال بارگذاری» برای صفحه‌خوان دارد. با prefers-reduced-motion انیمیشن‌ها کند یا متوقف می‌شوند.