Skip to content

Commit c5678eb

Browse files
anveshmekalaanveshmekala
authored
feat(text-area): provide additional context for AT users when character limit exceeds (#7299)
**Related Issue:** #6630 ## Summary This PR will provide additional context for Assistive Technology users when character limit exceeds. After this change, an example error message looks like below: `The current character length is 14, which exceeds the maximum character length of 10.`
1 parent 569f387 commit c5678eb

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

43 files changed

+79
-94
lines changed

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Invalid",
3-
"tooLong": "Character limit exceeded",
4-
"longText": "The current character length is {currentLength}, which exceeds the maximum character length of {maxLength}."
3+
"tooLong": "The current character length is {currentLength}, which exceeds the maximum character length of {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_ar.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "غير صالح",
3-
"tooLong": "تم تجاوز حد الأحرف",
4-
"longText": "طول الأحرف الحالي هو {currentLength}، والذي يتجاوز الحد الأقصى لطول أحرف {maxLength}."
3+
"tooLong": "طول الأحرف الحالي هو {currentLength}، والذي يتجاوز الحد الأقصى لطول أحرف {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_bg.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Невалидно",
3-
"tooLong": "Превишен лимит за символи",
4-
"longText": "Текущата дължина на знака е{currentLength}, която надвишава максималната дължина на знака от{maxLength}."
3+
"tooLong": "Текущата дължина на знака е{currentLength}, която надвишава максималната дължина на знака от{maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_bs.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Nevažeće",
3-
"tooLong": "Premašeno je ograničenje znakova",
4-
"longText": "Trenutni broj znakova je {currentLength}, što premašuje maksimalni broj znakova od {maxLength}."
3+
"tooLong": "Trenutni broj znakova je {currentLength}, što premašuje maksimalni broj znakova od {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_ca.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "No vàlid",
3-
"tooLong": "S'ha excedit el límit de caràcters",
4-
"longText": "La longitud de caràcters actual és de {currentLength}, que supera la longitud de caràcters màxima de {maxLength}."
3+
"tooLong": "La longitud de caràcters actual és de {currentLength}, que supera la longitud de caràcters màxima de {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_cs.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Neplatný",
3-
"tooLong": "Překročen limit počtu znaků",
4-
"longText": "Aktuální počet znaků je {currentLength}, což překračuje maximální počet znaků {maxLength}."
3+
"tooLong": "Aktuální počet znaků je {currentLength}, což překračuje maximální počet znaků {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_da.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Ugyldig",
3-
"tooLong": "Grænsen for antallet af tegn er overskredet",
4-
"longText": "Den aktuelle tegnlængde er {currentLength}, hvilket overskrider den maksimale tegnlængde på {maxLength}."
3+
"tooLong": "Den aktuelle tegnlængde er {currentLength}, hvilket overskrider den maksimale tegnlængde på {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_de.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Ungültig",
3-
"tooLong": "Zeichenlimit wurde überschritten",
4-
"longText": "Die aktuelle Zeichenanzahl beträgt {currentLength} und überschreitet damit die maximal zulässige Anzahl von {maxLength} Zeichen."
3+
"tooLong": "Die aktuelle Zeichenanzahl beträgt {currentLength} und überschreitet damit die maximal zulässige Anzahl von {maxLength} Zeichen."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_el.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Μη έγκυρο",
3-
"tooLong": "Υπέρβαση ορίου χαρακτήρων",
4-
"longText": "Το τρέχον μήκος χαρακτήρων είναι {currentLength}, το οποίο υπερβαίνει το μέγιστο μήκος χαρακτήρων του {maxLength}."
3+
"tooLong": "Το τρέχον μήκος χαρακτήρων είναι {currentLength}, το οποίο υπερβαίνει το μέγιστο μήκος χαρακτήρων του {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_en.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Invalid",
3-
"tooLong": "Character limit exceeded",
4-
"longText": "The current character length is {currentLength}, which exceeds the maximum character length of {maxLength}."
3+
"tooLong": "The current character length is {currentLength}, which exceeds the maximum character length of {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_es.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "No válido",
3-
"tooLong": "Se superó el límite de caracteres",
4-
"longText": "La longitud de caracteres actual es de {currentLength}, lo cual supera la longitud de caracteres máxima de {maxLength}."
3+
"tooLong": "La longitud de caracteres actual es de {currentLength}, lo cual supera la longitud de caracteres máxima de {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_et.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Sobimatu",
3-
"tooLong": "Tähemärkide piirang on ületatud",
4-
"longText": "Praegune tähemärkide arv on {currentLength}, mis ületab tähemärkide maksimaalse arvu{maxLength}."
3+
"tooLong": "Praegune tähemärkide arv on {currentLength}, mis ületab tähemärkide maksimaalse arvu{maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_fi.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Virheellinen",
3-
"tooLong": "Merkkien määrä ylitetty",
4-
"longText": "Nykyinen merkkipituus on {currentLength}, joka ylittää {maxLength} merkkien enimmäispituuden."
3+
"tooLong": "Nykyinen merkkipituus on {currentLength}, joka ylittää {maxLength} merkkien enimmäispituuden."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_fr.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Non valide",
3-
"tooLong": "Limite de caractères dépassée",
4-
"longText": "La longueur actuelle de caractères est de {currentLength}, ce qui dépasse la longueur maximale de {maxLength} caractères."
3+
"tooLong": "La longueur actuelle de caractères est de {currentLength}, ce qui dépasse la longueur maximale de {maxLength} caractères."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_he.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "לא תקין",
3-
"tooLong": "חריגה ממגבלת מספר התווים",
4-
"longText": "אורך התו הנוכחי הוא {currentLength}, אשר חורג מאורך התו המרבי של {maxLength}."
3+
"tooLong": "אורך התו הנוכחי הוא {currentLength}, אשר חורג מאורך התו המרבי של {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_hr.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Nevažeće",
3-
"tooLong": "Premašeno je ograničenje znakova",
4-
"longText": "Trenutni broj znakova je {currentLength}, što premašuje maksimalni broj znakova od {maxLength}."
3+
"tooLong": "Trenutni broj znakova je {currentLength}, što premašuje maksimalni broj znakova od {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_hu.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Érvénytelen",
3-
"tooLong": "Karakterkorlát túllépve",
4-
"longText": "Az aktuális karakterhossz {currentLength}, ami meghaladja a maximális {maxLength} karakterhosszúságot."
3+
"tooLong": "Az aktuális karakterhossz {currentLength}, ami meghaladja a maximális {maxLength} karakterhosszúságot."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_id.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Tidak valid",
3-
"tooLong": "Batas karakter terlampaui",
4-
"longText": "Panjang karakter saat ini adalah {currentLength}, yang mana melebihi panjang karakter maksimum {maxLength}."
3+
"tooLong": "Panjang karakter saat ini adalah {currentLength}, yang mana melebihi panjang karakter maksimum {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_it.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Non valido",
3-
"tooLong": "Limite di caratteri superato",
4-
"longText": "La lunghezza in caratteri corrente è {currentLength}, superiore al limite massimo di {maxLength}."
3+
"tooLong": "La lunghezza in caratteri corrente è {currentLength}, superiore al limite massimo di {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_ja.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "無効",
3-
"tooLong": "文字制限を超えています",
4-
"longText": "現在の文字数は {currentLength} です。これは、文字数の最大値である {maxLength} 文字を超過しています。"
3+
"tooLong": "現在の文字数は {currentLength} です。これは、文字数の最大値である {maxLength} 文字を超過しています。"
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_ko.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "잘못됨",
3-
"tooLong": "문자 제한을 초과함",
4-
"longText": "현재 문자 길이({currentLength})가 최대 문자 길이({maxLength})를 초과합니다."
3+
"tooLong": "현재 문자 길이({currentLength})가 최대 문자 길이({maxLength})를 초과합니다."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_lt.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Neteisingas",
3-
"tooLong": "Viršytas simbolių limitas",
4-
"longText": "Dabartinis simbolių skaičius yra {currentLength}, o tai viršija maksimalų {maxLength} simbolių ilgį."
3+
"tooLong": "Dabartinis simbolių skaičius yra {currentLength}, o tai viršija maksimalų {maxLength} simbolių ilgį."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_lv.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Nederīgs",
3-
"tooLong": "Pārsniegts rakstzīmju skaita ierobežojums",
4-
"longText": "Pašreizējais rakstzīmju garums ir {currentLength}, kas pārsniedz maksimālo rakstzīmju garumu {maxLength}."
3+
"tooLong": "Pašreizējais rakstzīmju garums ir {currentLength}, kas pārsniedz maksimālo rakstzīmju garumu {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_nl.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Ongeldig",
3-
"tooLong": "Tekenlimiet overschreden",
4-
"longText": "Het huidige aantal tekens is {currentLength}, wat meer is dan het maximumaantal van {maxLength} tekens."
3+
"tooLong": "Het huidige aantal tekens is {currentLength}, wat meer is dan het maximumaantal van {maxLength} tekens."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_no.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Ugyldig",
3-
"tooLong": "Maksimumsgrensen for antall tegn er overskredet",
4-
"longText": "Den nåværende tegnlengden er {currentLength}, som overskrider den maksimalt tillatte tegnlengden på {maxLength}."
3+
"tooLong": "Den nåværende tegnlengden er {currentLength}, som overskrider den maksimalt tillatte tegnlengden på {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_pl.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Niepoprawny",
3-
"tooLong": "Przekroczono limit liczby znaków",
4-
"longText": "Bieżąca liczba znaków wynosi {currentLength}, co przekracza maksymalną liczbę znaków {maxLength}."
3+
"tooLong": "Bieżąca liczba znaków wynosi {currentLength}, co przekracza maksymalną liczbę znaków {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_pt-BR.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Inválido",
3-
"tooLong": "Limite de caracteres excedido",
4-
"longText": "O comprimento atual do caractere é {currentLength}, que exceda o comprimento máximo de caracteres de {maxLength}."
3+
"tooLong": "O comprimento atual do caractere é {currentLength}, que exceda o comprimento máximo de caracteres de {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_pt-PT.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Inválido",
3-
"tooLong": "Limite de carateres ultrapassado",
4-
"longText": "O comprimento atual dos caracteres é {currentLength}, o que excede o comprimento máximo de caracteres de {maxLength}."
3+
"tooLong": "O comprimento atual dos caracteres é {currentLength}, o que excede o comprimento máximo de caracteres de {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_ro.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Nevalid",
3-
"tooLong": "Limită de caractere depășită",
4-
"longText": "Lungimea maximă a caracterelor curentă este {currentLength}, ceea ce depășește lungimea maximă a caracterelor de maximum {maxLength}."
3+
"tooLong": "Lungimea maximă a caracterelor curentă este {currentLength}, ceea ce depășește lungimea maximă a caracterelor de maximum {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_ru.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Недопустимый",
3-
"tooLong": "Превышен лимит символов",
4-
"longText": "Текущая длина символов - {currentLength}, что превышает максимальную длину символов {maxLength}."
3+
"tooLong": "Текущая длина символов - {currentLength}, что превышает максимальную длину символов {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_sk.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Neplatné",
3-
"tooLong": "Bol prekročený limit počtu znakov",
4-
"longText": "Aktuálna dĺžka znaku je {currentLength}, čo presahuje maximálnu dĺžku {maxLength}."
3+
"tooLong": "Aktuálna dĺžka znaku je {currentLength}, čo presahuje maximálnu dĺžku {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_sl.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Neveljavno",
3-
"tooLong": "Presežena je omejitev znakov",
4-
"longText": "Trenutna dolžina znakov znaša {currentLength}, kar presega maksimalno dolžino znakov {maxLength}."
3+
"tooLong": "Trenutna dolžina znakov znaša {currentLength}, kar presega maksimalno dolžino znakov {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_sr.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Nevažeće",
3-
"tooLong": "Prekoračeno ograničenje znakova",
4-
"longText": "Trenutno ograničenje za broj karaktera je {currentLength}, što prekoračuje maksimalni broj dužine karaktera od {maxLength}."
3+
"tooLong": "Trenutno ograničenje za broj karaktera je {currentLength}, što prekoračuje maksimalni broj dužine karaktera od {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_sv.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Ogiltig",
3-
"tooLong": "Teckengränsen överskriden",
4-
"longText": "Den aktuella teckenlängden är {currentLength}, vilket överskrider den maximala teckenlängden på {maxLength}."
3+
"tooLong": "Den aktuella teckenlängden är {currentLength}, vilket överskrider den maximala teckenlängden på {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_th.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "ไม่ถูกต้อง",
3-
"tooLong": "เกินขีดจำกัดอักขระ",
4-
"longText": "ความยาวจำนวนอักขระในปัจจุบันคือ {currentLength} ซึ่งเกินความยาวจำนวนอักขระสูงสุดที่ {maxLength}"
3+
"tooLong": "ความยาวจำนวนอักขระในปัจจุบันคือ {currentLength} ซึ่งเกินความยาวจำนวนอักขระสูงสุดที่ {maxLength}"
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_tr.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Geçersiz",
3-
"tooLong": "Karakter sınırı aşıldı",
4-
"longText": "Mevcut karakter uzunluğu {currentLength} ve maksimum karakter uzunluğu {maxLength}'i aşıyor."
3+
"tooLong": "Mevcut karakter uzunluğu {currentLength} ve maksimum karakter uzunluğu {maxLength}'i aşıyor."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_uk.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Неприпустимий",
3-
"tooLong": "Перевищено обмеження кількості символів",
4-
"longText": "Поточна довжина символу становить {currentLength}, що перевищує максимальну довжину символів {maxLength}."
3+
"tooLong": "Поточна довжина символу становить {currentLength}, що перевищує максимальну довжину символів {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_vi.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "Không hợp lệ",
3-
"tooLong": "Đã vượt quá giới hạn ký tự",
4-
"longText": "Độ dài ký tự hiện tại là {currentLength}, vượt quá độ dài ký tự tối đa {maxLength}."
3+
"tooLong": "Độ dài ký tự hiện tại là {currentLength}, vượt quá độ dài ký tự tối đa {maxLength}."
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_zh-CN.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "无效",
3-
"tooLong": "超出字符限制",
4-
"longText": "当前字符长度为 {currentLength}，超过了最大字符长度 {maxLength}。"
3+
"tooLong": "当前字符长度为 {currentLength}，超过了最大字符长度 {maxLength}。"
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_zh-HK.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "無效",
3-
"tooLong": "已超過字元限制",
4-
"longText": "目前字元長度為 {currentLength}，超過了最大字元長度 {maxLength}。"
3+
"tooLong": "目前字元長度為 {currentLength}，超過了最大字元長度 {maxLength}。"
54
}

‎packages/calcite-components/src/components/text-area/assets/text-area/t9n/messages_zh-TW.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
22
"invalid": "無效",
3-
"tooLong": "已超過字元限制",
4-
"longText": "目前字元長度為 {currentLength}，超過了最大字元長度 {maxLength}。"
3+
"tooLong": "目前字元長度為 {currentLength}，超過了最大字元長度 {maxLength}。"
54
}

‎packages/calcite-components/src/components/text-area/interfaces.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
export interface CharacterLengthObj {
2+
currentLength: string;
3+
maxLength: string;
4+
}

‎packages/calcite-components/src/components/text-area/text-area.tsx

Lines changed: 34 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -45,6 +45,7 @@ import {
4545
InteractiveComponent,
4646
updateHostInteraction
4747
} from "../../utils/interactive";
48+
import { CharacterLengthObj } from "./interfaces";
4849

4950
/**
5051
* @slot - A slot for adding text.
@@ -363,6 +364,8 @@ export class TextArea
363364

364365
@State() effectiveLocale = "";
365366

367+
@State() localizedCharacterLengthObj: CharacterLengthObj;
368+
366369
@Watch("effectiveLocale")
367370
effectiveLocaleChange(): void {
368371
updateMessages(this, this.effectiveLocale);
@@ -402,26 +405,39 @@ export class TextArea
402405
}
403406
};
404407

405-
renderCharacterLimit = (): VNode => {
406-
return this.maxLength ? (
407-
<span class={CSS.characterLimit}>
408-
<span class={{ [CSS.characterOverLimit]: this.value?.length > this.maxLength }}>
409-
{this.getLocalizedCharacterLength()}
408+
renderCharacterLimit = (): VNode | null => {
409+
if (this.maxLength) {
410+
this.localizedCharacterLengthObj = this.getLocalizedCharacterLength();
411+
return (
412+
<span class={CSS.characterLimit}>
413+
<span class={{ [CSS.characterOverLimit]: this.value?.length > this.maxLength }}>
414+
{this.localizedCharacterLengthObj.currentLength}
415+
</span>
416+
{"/"}
417+
{this.localizedCharacterLengthObj.maxLength}
410418
</span>
411-
{"/"}
412-
{numberStringFormatter.localize(this.maxLength.toString())}
413-
</span>
414-
) : null;
419+
);
420+
}
421+
return null;
415422
};
416423

417-
getLocalizedCharacterLength(): string {
424+
getLocalizedCharacterLength(): CharacterLengthObj {
425+
const currentLength = this.value ? this.value.length.toString() : "0";
426+
const maxLength = this.maxLength.toString();
427+
if (this.numberingSystem === "latn") {
428+
return { currentLength, maxLength };
429+
}
430+
418431
numberStringFormatter.numberFormatOptions = {
419432
locale: this.effectiveLocale,
420433
numberingSystem: this.numberingSystem,
421434
signDisplay: "never",
422435
useGrouping: this.groupSeparator
423436
};
424-
return numberStringFormatter.localize(this.value ? this.value.length.toString() : "0");
437+
return {
438+
currentLength: numberStringFormatter.localize(currentLength),
439+
maxLength: numberStringFormatter.localize(maxLength)
440+
};
425441
}
426442

427443
resizeObserver = createObserver("resize", async () => {
@@ -439,10 +455,16 @@ export class TextArea
439455
syncHiddenFormInput(input: HTMLInputElement): void {
440456
input.setCustomValidity("");
441457
if (this.value?.length > this.maxLength) {
442-
input.setCustomValidity(this.messages.tooLong);
458+
input.setCustomValidity(this.replacePlaceHoldersInMessages());
443459
}
444460
}
445461

462+
private replacePlaceHoldersInMessages(): string {
463+
return this.messages.tooLong
464+
.replace("{maxLength}", this.localizedCharacterLengthObj.maxLength)
465+
.replace("{currentLength}", this.localizedCharacterLengthObj.currentLength);
466+
}
467+
446468
// height and width are set to auto here to avoid overlapping on to neighboring elements in the layout when user starts resizing.
447469
// throttle is used to avoid flashing of textarea when user resizes.
448470
private setHeightAndWidthToAuto = throttle(

0 commit comments

Comments
 (0)