AmountInput

Kurulum

Paket

@bigbang/ui

İçe aktarma

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

Kaynak

AmountInput.tsx

Storybook

AmountInput · Playground

AmountInput, @bigbang/ui paketindedir.

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

const [amount, setAmount] = useState<bigint | null>(null);

<AmountInput label="Tutar" value={amount} onValueChange={setAmount} min={1000n} name="amount" />;

Özellikler

labelZorunlu

Açıklama

Alanın görünen etiketi. Ekran okuyucular için para biriminin adı eklenir: 'Tutar (Türk lirası)'.

Tür

string

description

Açıklama

Alanın altındaki yardım metni; aria-describedby ile bağlanır.

Tür

ReactNode

error

Açıklama

Verildiğinde alan geçersiz işaretlenir ve bu mesaj yerleşik mesajların yerine geçer.

Tür

string

invalid

Açıklama

Alanı mesajsız geçersiz işaretler; örneğin mesaj bir hata özetindeyse.

Tür

boolean

Varsayılan

false

required

Açıklama

Değer zorunludur: giriş required alır ve etiket işaretlenir.

Tür

boolean

Varsayılan

false

necessityIndicator

Açıklama

Formun hangi alanları işaretlediği: required zorunluları, optional diğerlerini.

Tür

'required' | 'optional'

Varsayılan

'required'

size

Açıklama

Giriş yüksekliği: 32, 36 ve 40 px.

Tür

'sm' | 'md' | 'lg'

Varsayılan

'md'

currency

Açıklama

ISO 4217 para birimi kodu; simgeyi ve ondalık basamak sayısını belirler (TRY için 2, JPY için 0).

Tür

string

Varsayılan

'TRY'

currencyDisplay

Açıklama

Kutudaki para biriminin yazılışı: narrowSymbol (₺) ya da code (TRY).

Tür

'symbol' | 'narrowSymbol' | 'code'

Varsayılan

'narrowSymbol'

value

Açıklama

Kuruş cinsinden denetimli tutar (123456n 1.234,56) ya da boş için null. onValueChange ile birlikte verin.

Tür

MinorUnits | null

defaultValue

Açıklama

Denetimsiz alanda kuruş cinsinden başlangıç tutarı.

Tür

MinorUnits | null

onValueChange

Açıklama

Kuruş cinsinden bigint tutarla ya da alan boşaltılınca null ile çağrılır. Metin fazla ondalık içerirken çağrılmaz.

Tür

(value: bigint | null) => void

min

Açıklama

Kuruş cinsinden en küçük tutar; altında ui.amount-input.min gösterilir.

Tür

MinorUnits

max

Açıklama

Kuruş cinsinden en büyük tutar; üstünde ui.amount-input.max gösterilir.

Tür

MinorUnits

allowNegative

Açıklama

Düzeltme ve ayarlamalar için eksi tutara izin verir.

Tür

boolean

Varsayılan

false

placeholder

Açıklama

'0,00' gibi bir biçim ipucu; tek talimat olmamalı.

Tür

string

readOnly

Açıklama

Değer okunabilir, odaklanabilir ve kopyalanabilir ama değiştirilemez.

Tür

boolean

Varsayılan

false

disabled

Açıklama

Alanı ve etiketini devre dışı bırakır; değer formla gönderilmez.

Tür

boolean

Varsayılan

false

name

Açıklama

Alan adı; form tutarı kuruş cinsinden tam sayı metni olarak alır ('123456').

Tür

string

className

Açıklama

Kök öğeye eklenir; yalnızca yerleşim için kullanın.

Tür

string

Veri öznitelikleri

• data-component="amount-input".
• data-part: box, control, currency.