TaavUI Lab
Components

switch

کامپوننت دوحالته برای فعال‌سازی یا غیرفعال‌سازی تنظیمات در رابط کاربری روشن.

import { TaavActivationSwitch } from "@repo/ui/taav/business";

کامپوننت اصلی

توکن compact

ساختار توکن compact

<CompactSwitchToken value="active" />
<CompactSwitchToken value="inactive" />

فقط از props رسمی TaavUI استفاده کنید. unsafeClassName و escape hatchهای مشابه فقط برای موارد نادر هستند و نباید در مثال‌های عادی دیده شوند.

ساختار استاندارد

<TaavActivationSwitch
  defaultValue="active"
  activeLabel="فعال"
  inactiveLabel="غیرفعال"
  onValueChange={setValue}
/>

Props

Propنوعتوضیح
value / defaultValue'active' | 'inactive'مقدار کنترل‌شده یا مقدار اولیه سوییچ
onValueChange(value) => voidتابع دریافت تغییر وضعیت
activeLabel / inactiveLabelReactNodeعنوان وضعیت فعال و غیرفعال
size'sm' | 'md' | 'lg'اندازه سوییچ
tone'brand' | 'success' | 'warning' | 'danger' | 'neutral'رنگ وضعیت انتخاب‌شده

دسترسی‌پذیری

راهنمای استفاده در DastRanj / VahedYek

  • سوییچ با نقش radiogroup و radio، وضعیت فعال یا غیرفعال را برای فناوری‌های کمکی اعلام می‌کند.
  • برای هر سوییچ ariaLabel معنادار تنظیم کنید.
  • برای کنترل فرم، مقدار را با value و onValueChange مدیریت کنید.