Business Components

TaavCurrencyInput

ورودی مبلغ تخصصی فرم‌های کسب‌وکار — عدد سه‌رقمی جدا می‌شود و واحد پول (ریال/تومان) داخل فیلد نمایش داده می‌شود. برای قرارداد، حقوق، وام و تنظیمات مالی.

import { TaavCurrencyInput } from "@repo/ui/taav/forms";

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

نمای مرجع (RTL)

Screenshot-like demo — قرارداد و حقوق

مبلغ ثابت

مبلغ ثابت قرارداد به ریال

پیش‌پرداخت

مبلغ پیش‌پرداخت به تومان

استفاده پایه

پیش‌نمایش

<TaavCurrencyInput defaultValue={2500000} currency="rial" />

Controlled

پیش‌نمایشvalue: 2500000

Min / Max

پیش‌نمایش

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

• در حین تایپ، مقادیر خارج از بازه با border خطا مشخص می‌شوند
• در blur مقدار به min/max محدود می‌شود

States

پیش‌نمایش

Light / Dark

Props

Prop	نوع	پیش‌فرض	توضیح
`value / defaultValue`	number \| string	—	مقدار کنترل‌شده یا اولیه
`onValueChange`	(value: number \| null) => void	—	عدد خام بدون جداکننده
`currency`	'rial' \| 'toman'	rial	واحد پول پیش‌فرض
`currencyLabel`	ReactNode	—	جایگزین برچسب واحد
`min / max`	number	—	محدودیت عددی — clamp در blur
`size`	'sm' \| 'md' \| 'lg'	md	ارتفاع کنترل
`tone`	'neutral' \| 'success' \| 'warning' \| 'danger'	neutral	رنگ مرز
`invalid`	boolean	false	خطای خارجی یا خارج از بازه
`inputMode`	'numeric' \| 'decimal'	numeric	نوع ورودی موبایل
`disabled / readOnly`	boolean	—	حالت غیرفعال یا فقط خواندنی

Design Specs

Affix colorvar(--taav-input-affix-color)

Radiusvar(--taav-input-radius-xl)

Height lgvar(--taav-input-height-lg)

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

Do / Don't

انجام دهید

✓ با TaavFieldBlock برای label و tooltip در فرم‌های کسب‌وکار استفاده کنید
✓ onValueChange عدد خام بدون جداکننده برمی‌گرداند
✓ currency را صریح (rial / toman) مشخص کنید

انجام ندهید

✕ مبلغ را با suffix دستی روی TaavInput نسازید
✕ validation یا business logic داخل کامپوننت ننویسید