AmountInput

Ne zaman kullanılır

Kullanıcıdan bir para tutarı istenen her yerde: limit, ücret, iade tutarı.

Ne zaman kullanılmaz

• Para olmayan sayılar için: Adet ve yüzde için NumberField kullanın.
• Tutarı yalnızca göstermek için: MoneyText kullanın.

Kuruş cinsinden tutar

Tutar her zaman en küçük birimde (kuruş, sent) bir bigint ya da tam sayı metni olarak taşınır: 123456n 1.234,56 ₺ demektir. Ondalıklı sayı (number) kabul edilmez; yuvarlama hatası olmaz. Ondalık basamak sayısı para biriminden gelir: TRY için 2, JPY için 0.

Anatomi

Tutar (Türk lirası)

₺

Kuruşu virgülle ayırın.

AçıkKoyu

Kodu kopyala

import { AmountInput } from '@bigbang/ui';

export default function Default() {
  return (
    <AmountInput label="Tutar" description="Kuruşu virgülle ayırın." placeholder="0,00" className="max-w-xs" />
  );
}

1. Etiket: Ekran okuyucuya para biriminin adıyla okunur: “Tutar (Türk lirası)”.
2. Kutu: Tutar metni ve para birimi.
3. Para birimi: Odakta koyulaşır.
4. Açıklama ve hata.

Davranış

• Yazarken yalnızca rakam, virgül ve nokta alınır (allowNegative ile eksi de); yapıştırılan “₺ 1.234,56 TL” sayısını korur.
• Dilin ondalık ayırıcısı kuruşu ayırır, diğer ayırıcı basamak gruplar. Türkçede “1234.56” gibi tek nokta ve ardından bir-iki rakam ondalık sayılır.
• Alandan çıkınca tutar dil biçimine gelir: 1.234,50.
• Fazla ondalık, min ve max için alan kendi mesajını gösterir; error verirseniz onun yerine geçer.
• Formla gönderilen değer kuruş cinsinden tam sayı metnidir (“123450”).

Yönergeler

• Etikette para birimini tekrar etmeyin; kutuda zaten görünür.
• Sınırları açıklamada önceden söyleyin.
• Yer tutucuyu yalnızca biçim ipucu olarak kullanın.

İçerik

Anahtar	TR	EN
ui.amount-input.decimals	En fazla {digits} ondalık basamak girin.	Enter up to {digits} decimal places.
ui.amount-input.invalid	Geçerli bir tutar girin.	Enter a valid amount.
ui.amount-input.min	Tutar en az {min} olmalı.	The amount must be at least {min}.
ui.amount-input.max	Tutar en fazla {max} olmalı.	The amount must be at most {max}.

İlgili bileşenler

• MoneyText: Tutarı gösterir.
• NumberField: Para olmayan sayılar.