Form Primitive

TaavInput

ورودی متنی استاندارد با variant، tone، prefix/suffix و حالت‌های invalid/disabled/loading.

import { TaavInput } from "@repo/ui/taav";

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

استفاده پایه

RTL Preview

<TaavInput placeholder="نام کسب‌وکار" />

پیش‌نمایش

پیش‌نمایش

پیش‌نمایش

پیش‌نمایش

+98

تومان

Prop	نوع	پیش‌فرض	توضیح
`size`	'sm' \| 'md' \| 'lg'	md	ارتفاع و padding
`variant`	'default' \| 'filled' \| 'soft' \| 'ghost'	default	پس‌زمینه سطح
`tone`	'neutral' \| 'success' \| 'warning' \| 'danger'	neutral	رنگ مرز معنادار
`width`	'auto' \| 'full'	full	عرض کنترل
`invalid`	boolean	false	حالت خطا
`loading`	boolean	false	اسپینر و غیرفعال‌سازی
`iconStart / iconEnd`	ReactNode	—	آیکون RTL
`prefix / suffix`	ReactNode	—	متن یا واحد کنار input

Height mdvar(--taav-input-height-md)

Paddingvar(--taav-input-px-md)

Focusvar(--taav-input-focus-ring)

Invalidvar(--taav-input-focus-ring-danger)