Bileşenler
AmountInput
Provider dilinde yazılan ve kuruş cinsinden kesin değer bildiren tutar alanı; kayan nokta kullanmaz.
- Storybook
- Storybook
- Kaynak kod
- Kaynak kod
Rol ve anlam
Bölüm başlığı “Rol ve anlam”AmountInput inputmode="decimal" taşıyan bir metin kutusudur; mobilde rakam klavyesi açılır. Etiket para biriminin adını gizli metin olarak içerir. Görünen simge aria-hidden taşır. Açıklama ve hata aria-describedby ile bağlıdır.
Klavye
Bölüm başlığı “Klavye”| Tuş | Davranış |
|---|---|
| Rakamlar, virgül, nokta | Tutarı yazar. |
| Tab | Alandan çıkar; tutar biçimlenir. |
Biçimleme odaktan çıkınca yapılır; yazarken imleç yerinde kalır.
Ekran okuyucu
Bölüm başlığı “Ekran okuyucu”| Örnek | Okunan |
|---|---|
| Alan | “Tutar (Türk lirası), metin kutusu” |
| Sınır dışında | “Geçersiz giriş. Tutar en fazla 50.000,00 ₺ olmalı.” |
Kontrast
Bölüm başlığı “Kontrast”Metin 4,5:1; sınır ve simge 3:1.
WCAG 2.2
Bölüm başlığı “WCAG 2.2”| Ölçüt | AmountInput nasıl karşılar | Ürün ekibi ne yapmalı |
|---|---|---|
| 1.3.5 Giriş amacını belirleme | autocomplete="off"; para birimi etikette. |
— |
| 3.3.1 Hata tanımlama | Fazla ondalık ve sınırlar metinle söylenir. | Sunucu hatalarını error ile verin. |
| 3.3.2 Etiketler veya talimatlar | Biçim yer tutucuda değil, açıklamadadır. | Sınırları açıklamada yazın. |