@everymatrix/pam-forgot-password 1.68.2 → 1.69.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{checkbox-group-input_14.cjs.entry.js → checkbox-group-input_15.cjs.entry.js} +572 -40
- package/dist/cjs/index-92e25484.js +2 -2
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/pam-forgot-password.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +2 -1
- package/dist/esm/{checkbox-group-input_14.entry.js → checkbox-group-input_15.entry.js} +572 -41
- package/dist/esm/index-6f00d158.js +2 -2
- package/dist/esm/loader.js +1 -1
- package/dist/esm/pam-forgot-password.js +1 -1
- package/dist/pam-forgot-password/{checkbox-group-input_14.entry.js → checkbox-group-input_15.entry.js} +221 -221
- package/dist/pam-forgot-password/pam-forgot-password.esm.js +1 -1
- package/package.json +1 -1
package/dist/cjs/{checkbox-group-input_14.cjs.entry.js → checkbox-group-input_15.cjs.entry.js}
RENAMED
|
@@ -10,6 +10,7 @@ const TRANSLATIONS = {
|
|
|
10
10
|
"en": {
|
|
11
11
|
"dateError": "The selected date should be between {min} and {max}",
|
|
12
12
|
"dateError2": "The selected date is not within the accepted range",
|
|
13
|
+
"dateFormatError": "The selected date has a different format then the one required.",
|
|
13
14
|
"numberLengthError": "The number should be between {min} and {max}",
|
|
14
15
|
"lengthError": "The length should be between {minLength} and {maxLength}",
|
|
15
16
|
"requiredError": "This input is required.",
|
|
@@ -25,12 +26,17 @@ const TRANSLATIONS = {
|
|
|
25
26
|
"MustIncludeNumber": "Password must include a number",
|
|
26
27
|
"MustContainCapital": "Password must include a capital letter",
|
|
27
28
|
"MustIncludePunctation": "Password must include punctuation",
|
|
28
|
-
"OnlyNumbers": "
|
|
29
|
+
"OnlyNumbers": "The input should contain only digits.",
|
|
29
30
|
"InvalidFieldSize": "The length must be exactly 11 digits.",
|
|
30
|
-
"InvalidDocumentNumber": "Only numerical characters are allowed."
|
|
31
|
+
"InvalidDocumentNumber": "Only numerical characters are allowed.",
|
|
32
|
+
"twofaDescription": "<p> We have sent the verification code to <p> {destination}. </p> </p> <p> Please insert the PIN below. </p>",
|
|
33
|
+
"twofaResendMessage": "Didn't receive the verification code?",
|
|
34
|
+
"twofaResendButton": "Resend",
|
|
31
35
|
},
|
|
32
36
|
"hu": {
|
|
33
37
|
"dateError": "A választott dátumnak {min} és {max} között kell lennie",
|
|
38
|
+
"dateError2": "A kiválasztott dátum nincs az elfogadott tartományon belül",
|
|
39
|
+
"dateFormatError": "A kiválasztott dátum formátuma eltér a szükségestől.",
|
|
34
40
|
"numberLengthError": "A számnak {min} és {max} között kell lennie",
|
|
35
41
|
"lengthError": "A hossznak {minLength} és {maxLength} között kell lennie",
|
|
36
42
|
"requiredError": "Ez a beviteli mező kötelező.",
|
|
@@ -46,13 +52,17 @@ const TRANSLATIONS = {
|
|
|
46
52
|
"MustIncludeNumber": "A jelszónak tartalmaznia kell egy számot",
|
|
47
53
|
"MustContainCapital": "A jelszónak tartalmaznia kell egy nagybetűt",
|
|
48
54
|
"MustIncludePunctation": "A jelszónak tartalmaznia kell írásjelet",
|
|
49
|
-
"OnlyNumbers": "Csak
|
|
55
|
+
"OnlyNumbers": "Csak számjegyeket tartalmazhat.",
|
|
50
56
|
"InvalidFieldSize": "A hosszúságnak pontosan 11 számjegynek kell lennie.",
|
|
51
57
|
"InvalidDocumentNumber": "Csak számjegyek engedélyezettek.",
|
|
58
|
+
"twofaDescription": "<p> A megerősítő kódot elküldtük a következő címre: <p> {destination}. </p> </p> <p> Kérjük, írja be az alábbi PIN-kódot. </p>",
|
|
59
|
+
"twofaResendMessage": "Nem kapta meg a megerősítő kódot?",
|
|
60
|
+
"twofaResendButton": "Újraküldés"
|
|
52
61
|
},
|
|
53
62
|
"hr": {
|
|
54
63
|
"dateError": "Odabrani datum treba biti između {min} i {max}",
|
|
55
64
|
"dateError2": "Odabrani datum nije unutar prihvaćenog raspona",
|
|
65
|
+
"dateFormatError": "Odabrani datum je u drugačijem formatu od potrebnog.",
|
|
56
66
|
"numberLengthError": "Broj bi trebao biti između {min} i {max}",
|
|
57
67
|
"lengthError": "Duljina bi trebala biti između {minLength} i {maxLength}",
|
|
58
68
|
"requiredError": "Ovaj unos je obavezan.",
|
|
@@ -68,13 +78,17 @@ const TRANSLATIONS = {
|
|
|
68
78
|
"MustIncludeNumber": "Lozinka mora sadržavati broj",
|
|
69
79
|
"MustContainCapital": "Lozinka mora sadržavati veliko slovo",
|
|
70
80
|
"MustIncludePunctation": "Lozinka mora sadržavati barem jedan znak",
|
|
71
|
-
"OnlyNumbers": "
|
|
81
|
+
"OnlyNumbers": "Smije sadržavati samo znamenke.",
|
|
72
82
|
"InvalidFieldSize": "Dužina mora biti točno 11 znamenki.",
|
|
73
|
-
"InvalidDocumentNumber": "Dopušteni su samo numerički znakovi."
|
|
83
|
+
"InvalidDocumentNumber": "Dopušteni su samo numerički znakovi.",
|
|
84
|
+
"twofaDescription": "<p> Poslali smo verifikacijski kod na: <p> {destination}. </p> </p> <p> Molimo unesite PIN ispod. </p>",
|
|
85
|
+
"twofaResendMessage": "Niste primili verifikacijski kod?",
|
|
86
|
+
"twofaResendButton": "Ponovno pošalji"
|
|
74
87
|
},
|
|
75
88
|
"tr": {
|
|
76
89
|
"dateError": "Seçilen tarih {min} ve {max} arasında olmalıdır",
|
|
77
90
|
"dateError2": "Seçilen tarih kabul edilen aralıkta değil",
|
|
91
|
+
"dateFormatError": "Seçilen tarihin formatı, gereken formattan farklı.",
|
|
78
92
|
"numberLengthError": "Sayı {min} ve {max} arasında olmalıdır",
|
|
79
93
|
"lengthError": "Uzunluk {minLength} ve {maxLength} arasında olmalıdır",
|
|
80
94
|
"requiredError": "Bu alan zorunludur.",
|
|
@@ -90,13 +104,17 @@ const TRANSLATIONS = {
|
|
|
90
104
|
"MustIncludeNumber": "bir sayı içermelidir",
|
|
91
105
|
"MustContainCapital": "büyük harf içermelidir",
|
|
92
106
|
"MustIncludePunctation": "noktalama işareti içermelidir",
|
|
93
|
-
"OnlyNumbers": "
|
|
107
|
+
"OnlyNumbers": "Yalnızca rakamlar içermelidir.",
|
|
94
108
|
"InvalidFieldSize": "Uzunluk tam olarak 11 rakam olmalıdır.",
|
|
95
|
-
"InvalidDocumentNumber": "Sadece sayısal karakterlere izin verilir."
|
|
109
|
+
"InvalidDocumentNumber": "Sadece sayısal karakterlere izin verilir.",
|
|
110
|
+
"twofaDescription": "<p> Doğrulama kodunu şu adrese gönderdik: <p> {destination}. </p> </p> <p> Lütfen aşağıya PIN kodunu girin. </p>",
|
|
111
|
+
"twofaResendMessage": "Doğrulama kodunu almadınız mı?",
|
|
112
|
+
"twofaResendButton": "Yeniden gönder"
|
|
96
113
|
},
|
|
97
114
|
"pt-br": {
|
|
98
115
|
"dateError": "A data selecionada deve estar entre {min} e {max}",
|
|
99
116
|
"dateError2": "A data selecionada não está dentro de um intervalo válido",
|
|
117
|
+
"dateFormatError": "A data selecionada está em um formato diferente do exigido.",
|
|
100
118
|
"numberLengthError": "O número deve estar entre {min} e {max}",
|
|
101
119
|
"lengthError": "O comprimento deve estar entre {minLength} e {maxLength}",
|
|
102
120
|
"requiredError": "Este campo é obrigatório",
|
|
@@ -112,13 +130,17 @@ const TRANSLATIONS = {
|
|
|
112
130
|
"MustIncludeNumber": "A senha deve incluir um número",
|
|
113
131
|
"MustContainCapital": "A senha deve incluir uma letra maiúscula",
|
|
114
132
|
"MustIncludePunctation": "A senha deve incluir um sinal de pontuação",
|
|
115
|
-
"OnlyNumbers": "Deve conter apenas
|
|
133
|
+
"OnlyNumbers": "Deve conter apenas dígitos.",
|
|
116
134
|
"InvalidFieldSize": "O comprimento deve ser exatamente 11 dígitos.",
|
|
117
|
-
"InvalidDocumentNumber": "Apenas caracteres numéricos são permitidos."
|
|
135
|
+
"InvalidDocumentNumber": "Apenas caracteres numéricos são permitidos.",
|
|
136
|
+
"twofaDescription": "<p> Enviamos o código de verificação para: <p> {destination}. </p> </p> <p> Por favor, insira o PIN abaixo. </p>",
|
|
137
|
+
"twofaResendMessage": "Não recebeu o código de verificação?",
|
|
138
|
+
"twofaResendButton": "Reenviar"
|
|
118
139
|
},
|
|
119
140
|
"es-mx": {
|
|
120
141
|
"dateError": "La fecha seleccionada debe ser entre {min} y {max}",
|
|
121
142
|
"dateError2": "La fecha seleccionada no está dentro de un rango válido",
|
|
143
|
+
"dateFormatError": "La fecha seleccionada tiene un formato diferente al requerido.",
|
|
122
144
|
"numberLengthError": "El número debe ser entre {min} y {max}",
|
|
123
145
|
"lengthError": "La longitud deber ser entre {minLength} y {maxLength}",
|
|
124
146
|
"requiredError": "Este campo es requerido",
|
|
@@ -134,9 +156,12 @@ const TRANSLATIONS = {
|
|
|
134
156
|
"MustIncludeNumber": "La contraseña debe incluir un número",
|
|
135
157
|
"MustContainCapital": "La contraseña debe incluir una letra mayúscula",
|
|
136
158
|
"MustIncludePunctation": "La contraseña debe incluir un signo de puntuación",
|
|
137
|
-
"OnlyNumbers": "
|
|
159
|
+
"OnlyNumbers": "Debe contener solo dígitos.",
|
|
138
160
|
"InvalidFieldSize": "La longitud debe ser exactamente de 11 dígitos.",
|
|
139
|
-
"InvalidDocumentNumber": "Solo se permiten caracteres numéricos."
|
|
161
|
+
"InvalidDocumentNumber": "Solo se permiten caracteres numéricos.",
|
|
162
|
+
"twofaDescription": "<p> Hemos enviado el código de verificación a: <p> {destination}. </p> </p> <p> Por favor, ingrese el PIN a continuación. </p>",
|
|
163
|
+
"twofaResendMessage": "¿No recibiste el código de verificación?",
|
|
164
|
+
"twofaResendButton": "Reenviar"
|
|
140
165
|
}
|
|
141
166
|
};
|
|
142
167
|
const translate = (key, customLang, values) => {
|
|
@@ -5468,6 +5493,303 @@ function isBefore(dirtyDate, dirtyDateToCompare) {
|
|
|
5468
5493
|
return date.getTime() < dateToCompare.getTime();
|
|
5469
5494
|
}
|
|
5470
5495
|
|
|
5496
|
+
/**
|
|
5497
|
+
* @name isMatch
|
|
5498
|
+
* @category Common Helpers
|
|
5499
|
+
* @summary validates the date string against given formats
|
|
5500
|
+
*
|
|
5501
|
+
* @description
|
|
5502
|
+
* Return the true if given date is string correct against the given format else
|
|
5503
|
+
* will return false.
|
|
5504
|
+
*
|
|
5505
|
+
* > ⚠️ Please note that the `format` tokens differ from Moment.js and other libraries.
|
|
5506
|
+
* > See: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
|
|
5507
|
+
*
|
|
5508
|
+
* The characters in the format string wrapped between two single quotes characters (') are escaped.
|
|
5509
|
+
* Two single quotes in a row, whether inside or outside a quoted sequence, represent a 'real' single quote.
|
|
5510
|
+
*
|
|
5511
|
+
* Format of the format string is based on Unicode Technical Standard #35:
|
|
5512
|
+
* https://www.unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table
|
|
5513
|
+
* with a few additions (see note 5 below the table).
|
|
5514
|
+
*
|
|
5515
|
+
* Not all tokens are compatible. Combinations that don't make sense or could lead to bugs are prohibited
|
|
5516
|
+
* and will throw `RangeError`. For example usage of 24-hour format token with AM/PM token will throw an exception:
|
|
5517
|
+
*
|
|
5518
|
+
* ```javascript
|
|
5519
|
+
* isMatch('23 AM', 'HH a')
|
|
5520
|
+
* //=> RangeError: The format string mustn't contain `HH` and `a` at the same time
|
|
5521
|
+
* ```
|
|
5522
|
+
*
|
|
5523
|
+
* See the compatibility table: https://docs.google.com/spreadsheets/d/e/2PACX-1vQOPU3xUhplll6dyoMmVUXHKl_8CRDs6_ueLmex3SoqwhuolkuN3O05l4rqx5h1dKX8eb46Ul-CCSrq/pubhtml?gid=0&single=true
|
|
5524
|
+
*
|
|
5525
|
+
* Accepted format string patterns:
|
|
5526
|
+
* | Unit |Prior| Pattern | Result examples | Notes |
|
|
5527
|
+
* |---------------------------------|-----|---------|-----------------------------------|-------|
|
|
5528
|
+
* | Era | 140 | G..GGG | AD, BC | |
|
|
5529
|
+
* | | | GGGG | Anno Domini, Before Christ | 2 |
|
|
5530
|
+
* | | | GGGGG | A, B | |
|
|
5531
|
+
* | Calendar year | 130 | y | 44, 1, 1900, 2017, 9999 | 4 |
|
|
5532
|
+
* | | | yo | 44th, 1st, 1900th, 9999999th | 4,5 |
|
|
5533
|
+
* | | | yy | 44, 01, 00, 17 | 4 |
|
|
5534
|
+
* | | | yyy | 044, 001, 123, 999 | 4 |
|
|
5535
|
+
* | | | yyyy | 0044, 0001, 1900, 2017 | 4 |
|
|
5536
|
+
* | | | yyyyy | ... | 2,4 |
|
|
5537
|
+
* | Local week-numbering year | 130 | Y | 44, 1, 1900, 2017, 9000 | 4 |
|
|
5538
|
+
* | | | Yo | 44th, 1st, 1900th, 9999999th | 4,5 |
|
|
5539
|
+
* | | | YY | 44, 01, 00, 17 | 4,6 |
|
|
5540
|
+
* | | | YYY | 044, 001, 123, 999 | 4 |
|
|
5541
|
+
* | | | YYYY | 0044, 0001, 1900, 2017 | 4,6 |
|
|
5542
|
+
* | | | YYYYY | ... | 2,4 |
|
|
5543
|
+
* | ISO week-numbering year | 130 | R | -43, 1, 1900, 2017, 9999, -9999 | 4,5 |
|
|
5544
|
+
* | | | RR | -43, 01, 00, 17 | 4,5 |
|
|
5545
|
+
* | | | RRR | -043, 001, 123, 999, -999 | 4,5 |
|
|
5546
|
+
* | | | RRRR | -0043, 0001, 2017, 9999, -9999 | 4,5 |
|
|
5547
|
+
* | | | RRRRR | ... | 2,4,5 |
|
|
5548
|
+
* | Extended year | 130 | u | -43, 1, 1900, 2017, 9999, -999 | 4 |
|
|
5549
|
+
* | | | uu | -43, 01, 99, -99 | 4 |
|
|
5550
|
+
* | | | uuu | -043, 001, 123, 999, -999 | 4 |
|
|
5551
|
+
* | | | uuuu | -0043, 0001, 2017, 9999, -9999 | 4 |
|
|
5552
|
+
* | | | uuuuu | ... | 2,4 |
|
|
5553
|
+
* | Quarter (formatting) | 120 | Q | 1, 2, 3, 4 | |
|
|
5554
|
+
* | | | Qo | 1st, 2nd, 3rd, 4th | 5 |
|
|
5555
|
+
* | | | QQ | 01, 02, 03, 04 | |
|
|
5556
|
+
* | | | QQQ | Q1, Q2, Q3, Q4 | |
|
|
5557
|
+
* | | | QQQQ | 1st quarter, 2nd quarter, ... | 2 |
|
|
5558
|
+
* | | | QQQQQ | 1, 2, 3, 4 | 4 |
|
|
5559
|
+
* | Quarter (stand-alone) | 120 | q | 1, 2, 3, 4 | |
|
|
5560
|
+
* | | | qo | 1st, 2nd, 3rd, 4th | 5 |
|
|
5561
|
+
* | | | qq | 01, 02, 03, 04 | |
|
|
5562
|
+
* | | | qqq | Q1, Q2, Q3, Q4 | |
|
|
5563
|
+
* | | | qqqq | 1st quarter, 2nd quarter, ... | 2 |
|
|
5564
|
+
* | | | qqqqq | 1, 2, 3, 4 | 3 |
|
|
5565
|
+
* | Month (formatting) | 110 | M | 1, 2, ..., 12 | |
|
|
5566
|
+
* | | | Mo | 1st, 2nd, ..., 12th | 5 |
|
|
5567
|
+
* | | | MM | 01, 02, ..., 12 | |
|
|
5568
|
+
* | | | MMM | Jan, Feb, ..., Dec | |
|
|
5569
|
+
* | | | MMMM | January, February, ..., December | 2 |
|
|
5570
|
+
* | | | MMMMM | J, F, ..., D | |
|
|
5571
|
+
* | Month (stand-alone) | 110 | L | 1, 2, ..., 12 | |
|
|
5572
|
+
* | | | Lo | 1st, 2nd, ..., 12th | 5 |
|
|
5573
|
+
* | | | LL | 01, 02, ..., 12 | |
|
|
5574
|
+
* | | | LLL | Jan, Feb, ..., Dec | |
|
|
5575
|
+
* | | | LLLL | January, February, ..., December | 2 |
|
|
5576
|
+
* | | | LLLLL | J, F, ..., D | |
|
|
5577
|
+
* | Local week of year | 100 | w | 1, 2, ..., 53 | |
|
|
5578
|
+
* | | | wo | 1st, 2nd, ..., 53th | 5 |
|
|
5579
|
+
* | | | ww | 01, 02, ..., 53 | |
|
|
5580
|
+
* | ISO week of year | 100 | I | 1, 2, ..., 53 | 5 |
|
|
5581
|
+
* | | | Io | 1st, 2nd, ..., 53th | 5 |
|
|
5582
|
+
* | | | II | 01, 02, ..., 53 | 5 |
|
|
5583
|
+
* | Day of month | 90 | d | 1, 2, ..., 31 | |
|
|
5584
|
+
* | | | do | 1st, 2nd, ..., 31st | 5 |
|
|
5585
|
+
* | | | dd | 01, 02, ..., 31 | |
|
|
5586
|
+
* | Day of year | 90 | D | 1, 2, ..., 365, 366 | 7 |
|
|
5587
|
+
* | | | Do | 1st, 2nd, ..., 365th, 366th | 5 |
|
|
5588
|
+
* | | | DD | 01, 02, ..., 365, 366 | 7 |
|
|
5589
|
+
* | | | DDD | 001, 002, ..., 365, 366 | |
|
|
5590
|
+
* | | | DDDD | ... | 2 |
|
|
5591
|
+
* | Day of week (formatting) | 90 | E..EEE | Mon, Tue, Wed, ..., Su | |
|
|
5592
|
+
* | | | EEEE | Monday, Tuesday, ..., Sunday | 2 |
|
|
5593
|
+
* | | | EEEEE | M, T, W, T, F, S, S | |
|
|
5594
|
+
* | | | EEEEEE | Mo, Tu, We, Th, Fr, Sa, Su | |
|
|
5595
|
+
* | ISO day of week (formatting) | 90 | i | 1, 2, 3, ..., 7 | 5 |
|
|
5596
|
+
* | | | io | 1st, 2nd, ..., 7th | 5 |
|
|
5597
|
+
* | | | ii | 01, 02, ..., 07 | 5 |
|
|
5598
|
+
* | | | iii | Mon, Tue, Wed, ..., Su | 5 |
|
|
5599
|
+
* | | | iiii | Monday, Tuesday, ..., Sunday | 2,5 |
|
|
5600
|
+
* | | | iiiii | M, T, W, T, F, S, S | 5 |
|
|
5601
|
+
* | | | iiiiii | Mo, Tu, We, Th, Fr, Sa, Su | 5 |
|
|
5602
|
+
* | Local day of week (formatting) | 90 | e | 2, 3, 4, ..., 1 | |
|
|
5603
|
+
* | | | eo | 2nd, 3rd, ..., 1st | 5 |
|
|
5604
|
+
* | | | ee | 02, 03, ..., 01 | |
|
|
5605
|
+
* | | | eee | Mon, Tue, Wed, ..., Su | |
|
|
5606
|
+
* | | | eeee | Monday, Tuesday, ..., Sunday | 2 |
|
|
5607
|
+
* | | | eeeee | M, T, W, T, F, S, S | |
|
|
5608
|
+
* | | | eeeeee | Mo, Tu, We, Th, Fr, Sa, Su | |
|
|
5609
|
+
* | Local day of week (stand-alone) | 90 | c | 2, 3, 4, ..., 1 | |
|
|
5610
|
+
* | | | co | 2nd, 3rd, ..., 1st | 5 |
|
|
5611
|
+
* | | | cc | 02, 03, ..., 01 | |
|
|
5612
|
+
* | | | ccc | Mon, Tue, Wed, ..., Su | |
|
|
5613
|
+
* | | | cccc | Monday, Tuesday, ..., Sunday | 2 |
|
|
5614
|
+
* | | | ccccc | M, T, W, T, F, S, S | |
|
|
5615
|
+
* | | | cccccc | Mo, Tu, We, Th, Fr, Sa, Su | |
|
|
5616
|
+
* | AM, PM | 80 | a..aaa | AM, PM | |
|
|
5617
|
+
* | | | aaaa | a.m., p.m. | 2 |
|
|
5618
|
+
* | | | aaaaa | a, p | |
|
|
5619
|
+
* | AM, PM, noon, midnight | 80 | b..bbb | AM, PM, noon, midnight | |
|
|
5620
|
+
* | | | bbbb | a.m., p.m., noon, midnight | 2 |
|
|
5621
|
+
* | | | bbbbb | a, p, n, mi | |
|
|
5622
|
+
* | Flexible day period | 80 | B..BBB | at night, in the morning, ... | |
|
|
5623
|
+
* | | | BBBB | at night, in the morning, ... | 2 |
|
|
5624
|
+
* | | | BBBBB | at night, in the morning, ... | |
|
|
5625
|
+
* | Hour [1-12] | 70 | h | 1, 2, ..., 11, 12 | |
|
|
5626
|
+
* | | | ho | 1st, 2nd, ..., 11th, 12th | 5 |
|
|
5627
|
+
* | | | hh | 01, 02, ..., 11, 12 | |
|
|
5628
|
+
* | Hour [0-23] | 70 | H | 0, 1, 2, ..., 23 | |
|
|
5629
|
+
* | | | Ho | 0th, 1st, 2nd, ..., 23rd | 5 |
|
|
5630
|
+
* | | | HH | 00, 01, 02, ..., 23 | |
|
|
5631
|
+
* | Hour [0-11] | 70 | K | 1, 2, ..., 11, 0 | |
|
|
5632
|
+
* | | | Ko | 1st, 2nd, ..., 11th, 0th | 5 |
|
|
5633
|
+
* | | | KK | 01, 02, ..., 11, 00 | |
|
|
5634
|
+
* | Hour [1-24] | 70 | k | 24, 1, 2, ..., 23 | |
|
|
5635
|
+
* | | | ko | 24th, 1st, 2nd, ..., 23rd | 5 |
|
|
5636
|
+
* | | | kk | 24, 01, 02, ..., 23 | |
|
|
5637
|
+
* | Minute | 60 | m | 0, 1, ..., 59 | |
|
|
5638
|
+
* | | | mo | 0th, 1st, ..., 59th | 5 |
|
|
5639
|
+
* | | | mm | 00, 01, ..., 59 | |
|
|
5640
|
+
* | Second | 50 | s | 0, 1, ..., 59 | |
|
|
5641
|
+
* | | | so | 0th, 1st, ..., 59th | 5 |
|
|
5642
|
+
* | | | ss | 00, 01, ..., 59 | |
|
|
5643
|
+
* | Seconds timestamp | 40 | t | 512969520 | |
|
|
5644
|
+
* | | | tt | ... | 2 |
|
|
5645
|
+
* | Fraction of second | 30 | S | 0, 1, ..., 9 | |
|
|
5646
|
+
* | | | SS | 00, 01, ..., 99 | |
|
|
5647
|
+
* | | | SSS | 000, 001, ..., 999 | |
|
|
5648
|
+
* | | | SSSS | ... | 2 |
|
|
5649
|
+
* | Milliseconds timestamp | 20 | T | 512969520900 | |
|
|
5650
|
+
* | | | TT | ... | 2 |
|
|
5651
|
+
* | Timezone (ISO-8601 w/ Z) | 10 | X | -08, +0530, Z | |
|
|
5652
|
+
* | | | XX | -0800, +0530, Z | |
|
|
5653
|
+
* | | | XXX | -08:00, +05:30, Z | |
|
|
5654
|
+
* | | | XXXX | -0800, +0530, Z, +123456 | 2 |
|
|
5655
|
+
* | | | XXXXX | -08:00, +05:30, Z, +12:34:56 | |
|
|
5656
|
+
* | Timezone (ISO-8601 w/o Z) | 10 | x | -08, +0530, +00 | |
|
|
5657
|
+
* | | | xx | -0800, +0530, +0000 | |
|
|
5658
|
+
* | | | xxx | -08:00, +05:30, +00:00 | 2 |
|
|
5659
|
+
* | | | xxxx | -0800, +0530, +0000, +123456 | |
|
|
5660
|
+
* | | | xxxxx | -08:00, +05:30, +00:00, +12:34:56 | |
|
|
5661
|
+
* | Long localized date | NA | P | 05/29/1453 | 5,8 |
|
|
5662
|
+
* | | | PP | May 29, 1453 | |
|
|
5663
|
+
* | | | PPP | May 29th, 1453 | |
|
|
5664
|
+
* | | | PPPP | Sunday, May 29th, 1453 | 2,5,8 |
|
|
5665
|
+
* | Long localized time | NA | p | 12:00 AM | 5,8 |
|
|
5666
|
+
* | | | pp | 12:00:00 AM | |
|
|
5667
|
+
* | Combination of date and time | NA | Pp | 05/29/1453, 12:00 AM | |
|
|
5668
|
+
* | | | PPpp | May 29, 1453, 12:00:00 AM | |
|
|
5669
|
+
* | | | PPPpp | May 29th, 1453 at ... | |
|
|
5670
|
+
* | | | PPPPpp | Sunday, May 29th, 1453 at ... | 2,5,8 |
|
|
5671
|
+
* Notes:
|
|
5672
|
+
* 1. "Formatting" units (e.g. formatting quarter) in the default en-US locale
|
|
5673
|
+
* are the same as "stand-alone" units, but are different in some languages.
|
|
5674
|
+
* "Formatting" units are declined according to the rules of the language
|
|
5675
|
+
* in the context of a date. "Stand-alone" units are always nominative singular.
|
|
5676
|
+
* In `format` function, they will produce different result:
|
|
5677
|
+
*
|
|
5678
|
+
* `format(new Date(2017, 10, 6), 'do LLLL', {locale: cs}) //=> '6. listopad'`
|
|
5679
|
+
*
|
|
5680
|
+
* `format(new Date(2017, 10, 6), 'do MMMM', {locale: cs}) //=> '6. listopadu'`
|
|
5681
|
+
*
|
|
5682
|
+
* `isMatch` will try to match both formatting and stand-alone units interchangably.
|
|
5683
|
+
*
|
|
5684
|
+
* 2. Any sequence of the identical letters is a pattern, unless it is escaped by
|
|
5685
|
+
* the single quote characters (see below).
|
|
5686
|
+
* If the sequence is longer than listed in table:
|
|
5687
|
+
* - for numerical units (`yyyyyyyy`) `isMatch` will try to match a number
|
|
5688
|
+
* as wide as the sequence
|
|
5689
|
+
* - for text units (`MMMMMMMM`) `isMatch` will try to match the widest variation of the unit.
|
|
5690
|
+
* These variations are marked with "2" in the last column of the table.
|
|
5691
|
+
*
|
|
5692
|
+
* 3. `QQQQQ` and `qqqqq` could be not strictly numerical in some locales.
|
|
5693
|
+
* These tokens represent the shortest form of the quarter.
|
|
5694
|
+
*
|
|
5695
|
+
* 4. The main difference between `y` and `u` patterns are B.C. years:
|
|
5696
|
+
*
|
|
5697
|
+
* | Year | `y` | `u` |
|
|
5698
|
+
* |------|-----|-----|
|
|
5699
|
+
* | AC 1 | 1 | 1 |
|
|
5700
|
+
* | BC 1 | 1 | 0 |
|
|
5701
|
+
* | BC 2 | 2 | -1 |
|
|
5702
|
+
*
|
|
5703
|
+
* Also `yy` will try to guess the century of two digit year by proximity with `referenceDate`:
|
|
5704
|
+
*
|
|
5705
|
+
* `isMatch('50', 'yy') //=> true`
|
|
5706
|
+
*
|
|
5707
|
+
* `isMatch('75', 'yy') //=> true`
|
|
5708
|
+
*
|
|
5709
|
+
* while `uu` will use the year as is:
|
|
5710
|
+
*
|
|
5711
|
+
* `isMatch('50', 'uu') //=> true`
|
|
5712
|
+
*
|
|
5713
|
+
* `isMatch('75', 'uu') //=> true`
|
|
5714
|
+
*
|
|
5715
|
+
* The same difference is true for local and ISO week-numbering years (`Y` and `R`),
|
|
5716
|
+
* except local week-numbering years are dependent on `options.weekStartsOn`
|
|
5717
|
+
* and `options.firstWeekContainsDate` (compare [setISOWeekYear]{@link https://date-fns.org/docs/setISOWeekYear}
|
|
5718
|
+
* and [setWeekYear]{@link https://date-fns.org/docs/setWeekYear}).
|
|
5719
|
+
*
|
|
5720
|
+
* 5. These patterns are not in the Unicode Technical Standard #35:
|
|
5721
|
+
* - `i`: ISO day of week
|
|
5722
|
+
* - `I`: ISO week of year
|
|
5723
|
+
* - `R`: ISO week-numbering year
|
|
5724
|
+
* - `o`: ordinal number modifier
|
|
5725
|
+
* - `P`: long localized date
|
|
5726
|
+
* - `p`: long localized time
|
|
5727
|
+
*
|
|
5728
|
+
* 6. `YY` and `YYYY` tokens represent week-numbering years but they are often confused with years.
|
|
5729
|
+
* You should enable `options.useAdditionalWeekYearTokens` to use them. See: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
|
|
5730
|
+
*
|
|
5731
|
+
* 7. `D` and `DD` tokens represent days of the year but they are ofthen confused with days of the month.
|
|
5732
|
+
* You should enable `options.useAdditionalDayOfYearTokens` to use them. See: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
|
|
5733
|
+
*
|
|
5734
|
+
* 8. `P+` tokens do not have a defined priority since they are merely aliases to other tokens based
|
|
5735
|
+
* on the given locale.
|
|
5736
|
+
*
|
|
5737
|
+
* using `en-US` locale: `P` => `MM/dd/yyyy`
|
|
5738
|
+
* using `en-US` locale: `p` => `hh:mm a`
|
|
5739
|
+
* using `pt-BR` locale: `P` => `dd/MM/yyyy`
|
|
5740
|
+
* using `pt-BR` locale: `p` => `HH:mm`
|
|
5741
|
+
*
|
|
5742
|
+
* Values will be checked in the descending order of its unit's priority.
|
|
5743
|
+
* Units of an equal priority overwrite each other in the order of appearance.
|
|
5744
|
+
*
|
|
5745
|
+
* If no values of higher priority are matched (e.g. when matching string 'January 1st' without a year),
|
|
5746
|
+
* the values will be taken from today's using `new Date()` date which works as a context of parsing.
|
|
5747
|
+
*
|
|
5748
|
+
* The result may vary by locale.
|
|
5749
|
+
*
|
|
5750
|
+
* If `formatString` matches with `dateString` but does not provides tokens, `referenceDate` will be returned.
|
|
5751
|
+
*
|
|
5752
|
+
*
|
|
5753
|
+
*
|
|
5754
|
+
* @param {String} dateString - the date string to verify
|
|
5755
|
+
* @param {String} formatString - the string of tokens
|
|
5756
|
+
* @param {Object} [options] - an object with options.
|
|
5757
|
+
* @param {Locale} [options.locale=defaultLocale] - the locale object. See [Locale]{@link https://date-fns.org/docs/Locale}
|
|
5758
|
+
* @param {0|1|2|3|4|5|6} [options.weekStartsOn=0] - the index of the first day of the week (0 - Sunday)
|
|
5759
|
+
* @param {1|2|3|4|5|6|7} [options.firstWeekContainsDate=1] - the day of January, which is always in the first week of the year
|
|
5760
|
+
* @param {Boolean} [options.useAdditionalWeekYearTokens=false] - if true, allows usage of the week-numbering year tokens `YY` and `YYYY`;
|
|
5761
|
+
* see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
|
|
5762
|
+
* @param {Boolean} [options.useAdditionalDayOfYearTokens=false] - if true, allows usage of the day of year tokens `D` and `DD`;
|
|
5763
|
+
* see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
|
|
5764
|
+
* @returns {Boolean}
|
|
5765
|
+
* @throws {TypeError} 2 arguments required
|
|
5766
|
+
* @throws {RangeError} `options.weekStartsOn` must be between 0 and 6
|
|
5767
|
+
* @throws {RangeError} `options.firstWeekContainsDate` must be between 1 and 7
|
|
5768
|
+
* @throws {RangeError} `options.locale` must contain `match` property
|
|
5769
|
+
* @throws {RangeError} use `yyyy` instead of `YYYY` for formatting years; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
|
|
5770
|
+
* @throws {RangeError} use `yy` instead of `YY` for formatting years; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
|
|
5771
|
+
* @throws {RangeError} use `d` instead of `D` for formatting days of the month; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
|
|
5772
|
+
* @throws {RangeError} use `dd` instead of `DD` for formatting days of the month; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
|
|
5773
|
+
* @throws {RangeError} format string contains an unescaped latin alphabet character
|
|
5774
|
+
*
|
|
5775
|
+
* @example
|
|
5776
|
+
* // Match 11 February 2014 from middle-endian format:
|
|
5777
|
+
* const result = isMatch('02/11/2014', 'MM/dd/yyyy')
|
|
5778
|
+
* //=> true
|
|
5779
|
+
*
|
|
5780
|
+
* @example
|
|
5781
|
+
* // Match 28th of February in Esperanto locale in the context of 2010 year:
|
|
5782
|
+
* import eo from 'date-fns/locale/eo'
|
|
5783
|
+
* const result = isMatch('28-a de februaro', "do 'de' MMMM", {
|
|
5784
|
+
* locale: eo
|
|
5785
|
+
* })
|
|
5786
|
+
* //=> true
|
|
5787
|
+
*/
|
|
5788
|
+
function isMatch(dateString, formatString, options) {
|
|
5789
|
+
requiredArgs(2, arguments);
|
|
5790
|
+
return isValid(parse(dateString, formatString, new Date(), options));
|
|
5791
|
+
}
|
|
5792
|
+
|
|
5471
5793
|
const dateInputCss = "*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}.date{font-family:\"Roboto\";font-style:normal}.date__wrapper{position:relative;width:100%;display:flex;flex-direction:column;gap:5px;height:100%}.date__wrapper--autofilled{pointer-events:none}.date__wrapper--autofilled .date__label{color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.date__wrapper--autofilled .date__input::part(input-field){color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.date__label{font-family:inherit;font-style:normal;font-weight:500;font-size:16px;line-height:20px;color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.date__label--required::after{content:\"*\";font-family:inherit;color:var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));margin-left:2px}.date__input{border:none;width:inherit;position:relative}.date__input[focused]::part(input-field){border-color:var(--emw--login-color-primary, var(--emw--color-primary, #22B04E))}.date__input[invalid]::part(input-field){border:1px solid var(--emw--color-error, var(--emw--color-red, #ed0909))}.date__input::part(input-field){border-radius:4px;background-color:var(--emw--color-white, #FFFFFF);border:1px solid var(--emw--color-gray-100, #E6E6E6);color:var(--emw--registration-typography, var(--emw--color-black, #000000));font-family:inherit;font-style:normal;font-size:16px;font-weight:300;line-height:1.5;padding:0;height:44px}.date__input>input{padding:5px 15px}.date__input::part(toggle-button){position:relative;right:10px}.date__error-message{position:absolute;top:calc(100% + 5px);left:0;color:var(--emw--color-error, var(--emw--color-red, #ed0909))}.date__tooltip-icon{position:absolute;right:0;bottom:10px}.date__tooltip{position:absolute;bottom:35px;right:10px;background-color:var(--emw--color-white, #FFFFFF);border:1px solid var(--emw--color-gray-100, #E6E6E6);color:var(--emw--registration-typography, var(--emw--color-black, #000000));padding:10px;border-radius:5px;opacity:0;transition:opacity 0.3s ease-in-out;z-index:10}.date__tooltip.visible{opacity:1}";
|
|
5472
5794
|
const DateInputStyle0 = dateInputCss;
|
|
5473
5795
|
|
|
@@ -5508,6 +5830,12 @@ const DateInput = class {
|
|
|
5508
5830
|
this.limitStylingAppends = false;
|
|
5509
5831
|
this.showTooltip = false;
|
|
5510
5832
|
}
|
|
5833
|
+
get formattedValue() {
|
|
5834
|
+
if (!this.value)
|
|
5835
|
+
return '';
|
|
5836
|
+
const parsedDate = parse(this.value, 'yyyy-MM-dd', new Date());
|
|
5837
|
+
return format(parsedDate, this.dateFormat || 'yyyy-MM-dd');
|
|
5838
|
+
}
|
|
5511
5839
|
handleStylingChange(newValue, oldValue) {
|
|
5512
5840
|
if (newValue !== oldValue)
|
|
5513
5841
|
this.setClientStyling();
|
|
@@ -5590,7 +5918,7 @@ const DateInput = class {
|
|
|
5590
5918
|
this.emitValueHandler(true);
|
|
5591
5919
|
}
|
|
5592
5920
|
setValidity() {
|
|
5593
|
-
if (isBefore(this.valueAsDate, this.minDate) || isAfter(this.valueAsDate, this.maxDate)) {
|
|
5921
|
+
if (isBefore(this.valueAsDate, this.minDate) || isAfter(this.valueAsDate, this.maxDate) || !isMatch(this.formattedValue, this.dateFormat)) {
|
|
5594
5922
|
return false;
|
|
5595
5923
|
}
|
|
5596
5924
|
else {
|
|
@@ -5607,6 +5935,9 @@ const DateInput = class {
|
|
|
5607
5935
|
if (isBefore(this.valueAsDate, this.minDate) || isAfter(this.valueAsDate, this.maxDate)) {
|
|
5608
5936
|
return translate('dateError2', this.language);
|
|
5609
5937
|
}
|
|
5938
|
+
if (!isMatch(this.formattedValue, this.dateFormat)) {
|
|
5939
|
+
return translate('dateFormatError', this.language);
|
|
5940
|
+
}
|
|
5610
5941
|
}
|
|
5611
5942
|
renderTooltip() {
|
|
5612
5943
|
if (this.showTooltip) {
|
|
@@ -5619,8 +5950,8 @@ const DateInput = class {
|
|
|
5619
5950
|
if (this.touched) {
|
|
5620
5951
|
invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'text__input--invalid';
|
|
5621
5952
|
}
|
|
5622
|
-
return index.h("div", { key: '
|
|
5623
|
-
index.h("img", { key: '
|
|
5953
|
+
return index.h("div", { key: '18b85f7647c376d5a99468df4978d178cd19d77b', class: `date__wrapper ${this.autofilled ? 'date__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, index.h("label", { key: 'e351963c25eecb2e5758dec54c9c2fb883b85912', class: `date__label ${this.validation.mandatory ? 'date__label--required' : ''}}`, htmlFor: `${this.name}__input` }, this.displayName, " ", this.validation.mandatory ? '*' : ''), index.h("vaadin-date-picker", { key: '471bb1c440213f764fe334309b262d44ac2ead7d', id: `${this.name}__input`, type: 'date', class: `date__input ${invalidClass}`, value: this.defaultValue, readOnly: this.autofilled, placeholder: `${this.placeholder}`, required: this.validation.mandatory, max: this.validation.max, min: this.validation.min, onChange: (e) => this.handleInput(e) }), index.h("small", { key: '14e5c4d34a3236907cd701d72a91c06d28b37c7e', class: 'date__error-message' }, this.errorMessage), this.tooltip &&
|
|
5954
|
+
index.h("img", { key: 'c3424b6076ec5a399054bf37eca774e4bd3e3644', class: 'date__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip());
|
|
5624
5955
|
}
|
|
5625
5956
|
get element() { return index.getElement(this); }
|
|
5626
5957
|
static get watchers() { return {
|
|
@@ -11449,6 +11780,8 @@ const GeneralInput = class {
|
|
|
11449
11780
|
this.dateFormat = undefined;
|
|
11450
11781
|
this.translationUrl = '';
|
|
11451
11782
|
this.emitOnClick = false;
|
|
11783
|
+
this.twofaDestination = undefined;
|
|
11784
|
+
this.twofaResendIntervalSeconds = 60;
|
|
11452
11785
|
}
|
|
11453
11786
|
connectedCallback() {
|
|
11454
11787
|
if (this.translationUrl) {
|
|
@@ -11480,12 +11813,14 @@ const GeneralInput = class {
|
|
|
11480
11813
|
return index.h("tel-input", { name: this.name, action: this.action, displayName: this.displayName, validation: this.validation, defaultValue: this.defaultValue, emitValue: this.emitValue, language: this.language, autofilled: this.autofilled, "client-styling": this.clientStyling, tooltip: this.tooltip, placeholder: this.placeholder });
|
|
11481
11814
|
case 'dropdown':
|
|
11482
11815
|
return index.h("select-input", { name: this.name, action: this.action, defaultValue: this.defaultValue, displayName: this.displayName, options: this.options, validation: this.validation, emitValue: this.emitValue, autofilled: this.autofilled, language: this.language, "client-styling": this.clientStyling, tooltip: this.tooltip, placeholder: this.placeholder });
|
|
11816
|
+
case 'twofa':
|
|
11817
|
+
return index.h("twofa-input", { name: this.name, displayName: this.displayName, validation: this.validation, emitValue: this.emitValue, language: this.language, "client-styling": this.clientStyling, tooltip: this.tooltip, destination: this.twofaDestination, "resend-interval-seconds": this.twofaResendIntervalSeconds });
|
|
11483
11818
|
default:
|
|
11484
11819
|
return index.h("p", null, "The ", this.type, " input type is not valid");
|
|
11485
11820
|
}
|
|
11486
11821
|
}
|
|
11487
11822
|
render() {
|
|
11488
|
-
return (index.h(index.Host, { key: '
|
|
11823
|
+
return (index.h(index.Host, { key: '575526a74f8739d530e0094238357e2a744cc463', class: `general-input--${this.name}`, onClick: this.handleClick }, this.renderInput()));
|
|
11489
11824
|
}
|
|
11490
11825
|
};
|
|
11491
11826
|
GeneralInput.style = GeneralInputStyle0;
|
|
@@ -12644,7 +12979,223 @@ const ToggleCheckboxInput = class {
|
|
|
12644
12979
|
};
|
|
12645
12980
|
ToggleCheckboxInput.style = ToggleCheckboxInputStyle0;
|
|
12646
12981
|
|
|
12647
|
-
const
|
|
12982
|
+
const twofaInputCss = "*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}.twofa{display:flex;flex-direction:column;gap:10px}.twofa__description{display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:center}.twofa__error-message{text-align:center;color:var(--emw--color-error, var(--emw--color-red, #ed0909))}.twofa__input-wrapper{display:flex;justify-content:center}.twofa__input-wrapper input{width:35px;height:35px;padding:10px;text-align:center;border-radius:var(--emw--border-radius-small, 5px);margin-left:5px;margin-right:5px;border:2px solid var(--emw--otp-border-color, #55525c);font-weight:var(--emw-font-weight-bold, 800);outline:none;transition:all 0.1s}.twofa__input-wrapper input:focus{border:2px solid var(--emw--color-primary, #22B04E);box-shadow:0 0 2px 2px var(--emw--color-primary, #22B04E)}.twofa__button-wrapper{justify-content:center;text-align:center}.twofa__button-wrapper button{border:none;background:none;font-weight:var(--emw-font-weight-bold, 800);color:var(--emw--color-primary, #22B04E);cursor:pointer}";
|
|
12983
|
+
const TwofaInputStyle0 = twofaInputCss;
|
|
12984
|
+
|
|
12985
|
+
const TwofaInput = class {
|
|
12986
|
+
constructor(hostRef) {
|
|
12987
|
+
index.registerInstance(this, hostRef);
|
|
12988
|
+
this.sendValidityState = index.createEvent(this, "sendValidityState", 7);
|
|
12989
|
+
this.sendInputValue = index.createEvent(this, "sendInputValue", 7);
|
|
12990
|
+
this.resendCode = index.createEvent(this, "resendCode", 7);
|
|
12991
|
+
this.validationPattern = '';
|
|
12992
|
+
this.stylingContainer = null;
|
|
12993
|
+
this.tooltipReference = null;
|
|
12994
|
+
this.tooltipIconReference = null;
|
|
12995
|
+
this.inputRefs = [];
|
|
12996
|
+
this.containerRef = null;
|
|
12997
|
+
this.resendInterval = null;
|
|
12998
|
+
this.resendCodeHandler = () => {
|
|
12999
|
+
this.triggerResendInterval();
|
|
13000
|
+
this.resendCode.emit();
|
|
13001
|
+
};
|
|
13002
|
+
this.setInputRef = (el, idx) => {
|
|
13003
|
+
if (el) {
|
|
13004
|
+
this.inputRefs[idx] = el;
|
|
13005
|
+
}
|
|
13006
|
+
};
|
|
13007
|
+
this.setContainerRef = (el) => {
|
|
13008
|
+
if (el) {
|
|
13009
|
+
this.containerRef = el;
|
|
13010
|
+
}
|
|
13011
|
+
};
|
|
13012
|
+
this.triggerResendInterval = () => {
|
|
13013
|
+
this.isResendButtonAvailable = false;
|
|
13014
|
+
if (this.resendInterval) {
|
|
13015
|
+
clearInterval(this.resendInterval);
|
|
13016
|
+
}
|
|
13017
|
+
this.resendInterval = setInterval(() => {
|
|
13018
|
+
if (--this.resendIntervalSecondsLeft <= 0) {
|
|
13019
|
+
clearInterval(this.resendInterval);
|
|
13020
|
+
this.resendIntervalSecondsLeft = this.resendIntervalSeconds;
|
|
13021
|
+
this.isResendButtonAvailable = true;
|
|
13022
|
+
}
|
|
13023
|
+
}, 1000);
|
|
13024
|
+
};
|
|
13025
|
+
this.formatTime = () => {
|
|
13026
|
+
const minutes = String(Math.floor(this.resendIntervalSecondsLeft / 60));
|
|
13027
|
+
let seconds = String(this.resendIntervalSecondsLeft % 60);
|
|
13028
|
+
if (seconds.length === 1) {
|
|
13029
|
+
seconds = '0' + seconds;
|
|
13030
|
+
}
|
|
13031
|
+
return `${minutes}:${seconds}`;
|
|
13032
|
+
};
|
|
13033
|
+
this.handleInput = (e, idx) => {
|
|
13034
|
+
const input = e.target;
|
|
13035
|
+
const value = input.value;
|
|
13036
|
+
if (value.length > 1) {
|
|
13037
|
+
input.value = value.charAt(1);
|
|
13038
|
+
}
|
|
13039
|
+
else {
|
|
13040
|
+
input.value = value.charAt(0);
|
|
13041
|
+
}
|
|
13042
|
+
if (!value) {
|
|
13043
|
+
return;
|
|
13044
|
+
}
|
|
13045
|
+
this.code[idx] = input.value;
|
|
13046
|
+
const nextInput = this.inputRefs[idx + 1];
|
|
13047
|
+
if (nextInput) {
|
|
13048
|
+
nextInput.focus();
|
|
13049
|
+
}
|
|
13050
|
+
this.setValidity();
|
|
13051
|
+
this.setErrorMessage();
|
|
13052
|
+
};
|
|
13053
|
+
this.setClientStyling = () => {
|
|
13054
|
+
let sheet = document.createElement('style');
|
|
13055
|
+
sheet.innerHTML = this.clientStyling;
|
|
13056
|
+
this.stylingContainer.prepend(sheet);
|
|
13057
|
+
};
|
|
13058
|
+
this.name = '';
|
|
13059
|
+
this.displayName = '';
|
|
13060
|
+
this.placeholder = '';
|
|
13061
|
+
this.validation = undefined;
|
|
13062
|
+
this.tooltip = '';
|
|
13063
|
+
this.language = 'en';
|
|
13064
|
+
this.emitValue = true;
|
|
13065
|
+
this.destination = '';
|
|
13066
|
+
this.resendIntervalSeconds = 60;
|
|
13067
|
+
this.clientStyling = '';
|
|
13068
|
+
this.limitStylingAppends = false;
|
|
13069
|
+
this.isValid = false;
|
|
13070
|
+
this.isResendButtonAvailable = true;
|
|
13071
|
+
this.showTooltip = false;
|
|
13072
|
+
this.errorMessage = '';
|
|
13073
|
+
this.code = [];
|
|
13074
|
+
this.resendIntervalSecondsLeft = this.resendIntervalSeconds;
|
|
13075
|
+
}
|
|
13076
|
+
handleStylingChange(newValue, oldValue) {
|
|
13077
|
+
if (newValue !== oldValue)
|
|
13078
|
+
this.setClientStyling();
|
|
13079
|
+
}
|
|
13080
|
+
validityChanged() {
|
|
13081
|
+
this.validityStateHandler({ valid: this.isValid, name: this.name });
|
|
13082
|
+
if (this.emitValue == true) {
|
|
13083
|
+
this.valueHandler({ name: this.name, value: this.code.join('') });
|
|
13084
|
+
}
|
|
13085
|
+
}
|
|
13086
|
+
emitValueHandler(newValue) {
|
|
13087
|
+
if (newValue == true && this.isValid) {
|
|
13088
|
+
this.valueHandler({ name: this.name, value: this.code.join('') });
|
|
13089
|
+
}
|
|
13090
|
+
}
|
|
13091
|
+
validityStateHandler(inputStateEvent) {
|
|
13092
|
+
this.sendValidityState.emit(inputStateEvent);
|
|
13093
|
+
}
|
|
13094
|
+
valueHandler(inputValueEvent) {
|
|
13095
|
+
this.sendInputValue.emit(inputValueEvent);
|
|
13096
|
+
}
|
|
13097
|
+
handleClickOutside(event) {
|
|
13098
|
+
if (event.composedPath()[0] === this.tooltipIconReference)
|
|
13099
|
+
return;
|
|
13100
|
+
if (event.composedPath()[0] !== this.tooltipReference)
|
|
13101
|
+
this.showTooltip = false;
|
|
13102
|
+
}
|
|
13103
|
+
connectedCallback() {
|
|
13104
|
+
this.validationPattern = this.setPattern();
|
|
13105
|
+
this.code = new Array(this.validation.maxLength).fill('');
|
|
13106
|
+
}
|
|
13107
|
+
componentDidRender() {
|
|
13108
|
+
if (!this.limitStylingAppends && this.stylingContainer) {
|
|
13109
|
+
if (this.clientStyling) {
|
|
13110
|
+
this.setClientStyling();
|
|
13111
|
+
}
|
|
13112
|
+
this.limitStylingAppends = true;
|
|
13113
|
+
}
|
|
13114
|
+
}
|
|
13115
|
+
componentDidLoad() {
|
|
13116
|
+
this.setValidity();
|
|
13117
|
+
}
|
|
13118
|
+
handleKeyDown(e, idx) {
|
|
13119
|
+
if (e.key === 'Backspace') {
|
|
13120
|
+
this.code[idx] = '';
|
|
13121
|
+
if (this.inputRefs[idx]) {
|
|
13122
|
+
this.inputRefs[idx].value = '';
|
|
13123
|
+
} // Clear input field
|
|
13124
|
+
const prevInput = this.inputRefs[idx - 1];
|
|
13125
|
+
if (prevInput) {
|
|
13126
|
+
prevInput === null || prevInput === void 0 ? void 0 : prevInput.focus();
|
|
13127
|
+
}
|
|
13128
|
+
}
|
|
13129
|
+
this.setValidity();
|
|
13130
|
+
this.setErrorMessage();
|
|
13131
|
+
}
|
|
13132
|
+
handlePaste(e) {
|
|
13133
|
+
var _a;
|
|
13134
|
+
e.preventDefault();
|
|
13135
|
+
const data = (_a = e.clipboardData) === null || _a === void 0 ? void 0 : _a.getData('text').trim();
|
|
13136
|
+
if (!data) {
|
|
13137
|
+
return;
|
|
13138
|
+
}
|
|
13139
|
+
const value = data.slice(0, this.validation.maxLength).split(''); // Limit to OTP length
|
|
13140
|
+
this.code = [...value, ...new Array(this.validation.maxLength - value.length).fill('')];
|
|
13141
|
+
value.forEach((char, index) => {
|
|
13142
|
+
this.inputRefs[index].value = char;
|
|
13143
|
+
});
|
|
13144
|
+
// Move focus to the last input or trigger submit
|
|
13145
|
+
const lastInput = this.inputRefs[Math.min(value.length, this.inputRefs.length - 1)];
|
|
13146
|
+
if (lastInput) {
|
|
13147
|
+
lastInput.focus();
|
|
13148
|
+
}
|
|
13149
|
+
this.setValidity();
|
|
13150
|
+
this.setErrorMessage();
|
|
13151
|
+
}
|
|
13152
|
+
setValidity() {
|
|
13153
|
+
const code = this.code.join('');
|
|
13154
|
+
const inputMatchLength = code.length === this.validation.maxLength;
|
|
13155
|
+
const inputMatchValidation = code.match(this.validationPattern) !== null;
|
|
13156
|
+
this.isValid = inputMatchLength && inputMatchValidation;
|
|
13157
|
+
}
|
|
13158
|
+
setPattern() {
|
|
13159
|
+
var _a, _b;
|
|
13160
|
+
if (((_a = this.validation.custom) === null || _a === void 0 ? void 0 : _a.length) > 0) {
|
|
13161
|
+
return (_b = this.validation.custom.find(customValidation => customValidation.rule === 'regex')) === null || _b === void 0 ? void 0 : _b.pattern;
|
|
13162
|
+
}
|
|
13163
|
+
}
|
|
13164
|
+
setErrorMessage() {
|
|
13165
|
+
var _a;
|
|
13166
|
+
const inputMatchValidation = this.code.join('').match(this.validationPattern) !== null;
|
|
13167
|
+
if (!inputMatchValidation) {
|
|
13168
|
+
const errorKey = (_a = this.validation.custom.find(customValidation => customValidation.rule === 'regex')) === null || _a === void 0 ? void 0 : _a.errorKey;
|
|
13169
|
+
if (errorKey) {
|
|
13170
|
+
this.errorMessage = translate(errorKey, this.language);
|
|
13171
|
+
}
|
|
13172
|
+
}
|
|
13173
|
+
else {
|
|
13174
|
+
this.errorMessage = '';
|
|
13175
|
+
}
|
|
13176
|
+
}
|
|
13177
|
+
renderTooltip() {
|
|
13178
|
+
if (this.showTooltip) {
|
|
13179
|
+
return index.h("div", { class: `text__tooltip ${this.showTooltip ? 'visible' : ''}`, ref: (el) => this.tooltipReference = el, innerHTML: this.tooltip });
|
|
13180
|
+
}
|
|
13181
|
+
return null;
|
|
13182
|
+
}
|
|
13183
|
+
render() {
|
|
13184
|
+
return (index.h("div", { key: 'cc140f18806c0cc8e4ff614a1a3448dbca667fa7', class: "twofa" }, index.h("div", { key: 'fc3b603e1d1a7187417301dfebe80dabfd8cda67', class: 'twofa__error-message' }, index.h("p", { key: '60e2cff194ec862de20aa443864861d784b8dc01' }, this.errorMessage)), index.h("div", { key: '244505408204938069dca1f60dbe051716f66f85', class: "twofa__description", innerHTML: translate('twofaDescription', this.language, { values: { destination: this.destination } }) }), index.h("div", { key: 'acb6b8e1676a884d1c7ceced800f6ba3a2e80bc7', class: "twofa__input-wrapper", ref: this.setContainerRef }, this.code.map((char, idx) => {
|
|
13185
|
+
return (index.h("input", { key: idx, ref: el => this.setInputRef(el, idx), id: `otp-input-${idx}`, type: "text", maxLength: 2, value: char, onInput: (event) => this.handleInput(event, idx), onKeyDown: (event) => this.handleKeyDown(event, idx), onPaste: (event) => this.handlePaste(event) }));
|
|
13186
|
+
})), index.h("div", { key: '446eba5a8fe3fb0ede66869642d395bac9c6b8d6', class: "twofa__button-wrapper" }, index.h("p", { key: '9f205fd87920d866d49eb98b2a8ab6f3764fd274', class: "twofa__resend-message" }, translate('twofaResendMessage', this.language)), index.h("button", { key: 'efd2294b1d85a78c0d65262cc2004b5e63a898ab', class: "twofa__resend-button", onClick: this.resendCodeHandler, disabled: !this.isResendButtonAvailable }, this.isResendButtonAvailable
|
|
13187
|
+
? translate('twofaResendButton', this.language)
|
|
13188
|
+
: this.formatTime()))));
|
|
13189
|
+
}
|
|
13190
|
+
static get watchers() { return {
|
|
13191
|
+
"clientStyling": ["handleStylingChange"],
|
|
13192
|
+
"isValid": ["validityChanged"],
|
|
13193
|
+
"emitValue": ["emitValueHandler"]
|
|
13194
|
+
}; }
|
|
13195
|
+
};
|
|
13196
|
+
TwofaInput.style = TwofaInputStyle0;
|
|
13197
|
+
|
|
13198
|
+
const uiSkeletonCss = ":host{display:block}.Skeleton{animation:skeleton-loading 1s linear infinite alternate}.Rectangle{background-color:var(--emw-skeleton-rectangle-background, #c2c2c2);width:var(--emw-skeleton-rectangle-width, 400px);height:var(--emw-skeleton-rectangle-height, 200px);border-radius:var(--emw-skeleton-rectangle-border-radius, 10px)}.Circle{background-color:var(--emw-skeleton-circle-background, #c2c2c2);width:var(--emw-skeleton-circle-size, 400px);height:var(--emw-skeleton-circle-size, 400px);border-radius:50%}.Text{background-color:var(--emw-skeleton-text-background, #c2c2c2);width:var(--emw-skeleton-text-width, 500px);height:var(--emw-skeleton-text-height, 20px);border-radius:var(--emw-skeleton-text-border-radius, 10px);margin-bottom:var(--emw-skeleton-text-margin-bottom, 5px)}.Text:last-child{width:calc(var(--emw-skeleton-text-width, 400px) - 100px)}.Title{background-color:var(--emw-skeleton-title-background, #c2c2c2);width:var(--emw-skeleton-title-width, 300px);height:var(--emw-skeleton-title-height, 30px);border-radius:var(--emw-skeleton-title-border-radius, 10px);margin-bottom:var(--emw-skeleton-title-margin-bottom, 5px)}.Image{background-color:var(--emw-skeleton-image-background, #c2c2c2);width:var(--emw-skeleton-image-width, 100%);height:var(--emw-skeleton-image-height, 100%);border-radius:var(--emw-skeleton-image-border-radius, unset)}.Logo{background-color:var(--emw-skeleton-logo-background, #c2c2c2);width:var(--emw-skeleton-logo-width, 120px);height:var(--emw-skeleton-logo-height, 75px);border-radius:var(--emw-skeleton-logo-border-radius, 10px)}@keyframes skeleton-loading{0%{background-color:var(--emw-skeleton-primary-color, #e0e0e0)}100%{background-color:var(--emw-skeleton-secondary-color, #f0f0f0)}}";
|
|
12648
13199
|
const UiSkeletonStyle0 = uiSkeletonCss;
|
|
12649
13200
|
|
|
12650
13201
|
const UiSkeleton = class {
|
|
@@ -12657,7 +13208,8 @@ const UiSkeleton = class {
|
|
|
12657
13208
|
marginBottom: this.handleStylingProps(this.marginBottom),
|
|
12658
13209
|
marginTop: this.handleStylingProps(this.marginTop),
|
|
12659
13210
|
marginLeft: this.handleStylingProps(this.marginLeft),
|
|
12660
|
-
marginRight: this.handleStylingProps(this.marginRight)
|
|
13211
|
+
marginRight: this.handleStylingProps(this.marginRight),
|
|
13212
|
+
size: this.handleStylingProps(this.size)
|
|
12661
13213
|
};
|
|
12662
13214
|
this.structure = undefined;
|
|
12663
13215
|
this.width = 'unset';
|
|
@@ -12670,9 +13222,6 @@ const UiSkeleton = class {
|
|
|
12670
13222
|
this.animation = true;
|
|
12671
13223
|
this.rows = 0;
|
|
12672
13224
|
this.size = '100%';
|
|
12673
|
-
this.color = '#c2c2c2';
|
|
12674
|
-
this.primaryColor = '#c2c2c2';
|
|
12675
|
-
this.secondaryColor = '#ffffff';
|
|
12676
13225
|
}
|
|
12677
13226
|
handleStructureChange(newValue, oldValue) {
|
|
12678
13227
|
if (oldValue !== newValue) {
|
|
@@ -12747,9 +13296,6 @@ const UiSkeleton = class {
|
|
|
12747
13296
|
--emw-skeleton-logo-margin-top: ${this.stylingValue.marginTop};
|
|
12748
13297
|
--emw-skeleton-logo-margin-left: ${this.stylingValue.marginLeft};
|
|
12749
13298
|
--emw-skeleton-logo-margin-right: ${this.stylingValue.marginRight};
|
|
12750
|
-
--emw-skeleton-logo-background: ${this.color};
|
|
12751
|
-
--emw-skeleton-primary-color: ${this.primaryColor};
|
|
12752
|
-
--emw-skeleton-secondary-color: ${this.secondaryColor};
|
|
12753
13299
|
}
|
|
12754
13300
|
`;
|
|
12755
13301
|
break;
|
|
@@ -12763,9 +13309,6 @@ const UiSkeleton = class {
|
|
|
12763
13309
|
--emw-skeleton-image-margin-top: ${this.stylingValue.marginTop};
|
|
12764
13310
|
--emw-skeleton-image-margin-left: ${this.stylingValue.marginLeft};
|
|
12765
13311
|
--emw-skeleton-image-margin-right: ${this.stylingValue.marginRight};
|
|
12766
|
-
--emw-skeleton-image-background: ${this.color};
|
|
12767
|
-
--emw-skeleton-primary-color: ${this.primaryColor};
|
|
12768
|
-
--emw-skeleton-secondary-color: ${this.secondaryColor};
|
|
12769
13312
|
}
|
|
12770
13313
|
`;
|
|
12771
13314
|
break;
|
|
@@ -12779,9 +13322,6 @@ const UiSkeleton = class {
|
|
|
12779
13322
|
--emw-skeleton-title-margin-top: ${this.stylingValue.marginTop};
|
|
12780
13323
|
--emw-skeleton-title-margin-left: ${this.stylingValue.marginLeft};
|
|
12781
13324
|
--emw-skeleton-title-margin-right: ${this.stylingValue.marginRight};
|
|
12782
|
-
--emw-skeleton-title-background: ${this.color};
|
|
12783
|
-
--emw-skeleton-primary-color: ${this.primaryColor};
|
|
12784
|
-
--emw-skeleton-secondary-color: ${this.secondaryColor};
|
|
12785
13325
|
}
|
|
12786
13326
|
`;
|
|
12787
13327
|
break;
|
|
@@ -12795,9 +13335,6 @@ const UiSkeleton = class {
|
|
|
12795
13335
|
--emw-skeleton-text-margin-top: ${this.stylingValue.marginTop};
|
|
12796
13336
|
--emw-skeleton-text-margin-left: ${this.stylingValue.marginLeft};
|
|
12797
13337
|
--emw-skeleton-text-margin-right: ${this.stylingValue.marginRight};
|
|
12798
|
-
--emw-skeleton-text-background: ${this.color};
|
|
12799
|
-
--emw-skeleton-primary-color: ${this.primaryColor};
|
|
12800
|
-
--emw-skeleton-secondary-color: ${this.secondaryColor};
|
|
12801
13338
|
}
|
|
12802
13339
|
`;
|
|
12803
13340
|
break;
|
|
@@ -12811,26 +13348,20 @@ const UiSkeleton = class {
|
|
|
12811
13348
|
--emw-skeleton-rectangle-margin-top: ${this.stylingValue.marginTop};
|
|
12812
13349
|
--emw-skeleton-rectangle-margin-left: ${this.stylingValue.marginLeft};
|
|
12813
13350
|
--emw-skeleton-rectangle-margin-right: ${this.stylingValue.marginRight};
|
|
12814
|
-
--emw-skeleton-rectangle-background: ${this.color};
|
|
12815
|
-
--emw-skeleton-primary-color: ${this.primaryColor};
|
|
12816
|
-
--emw-skeleton-secondary-color: ${this.secondaryColor};
|
|
12817
13351
|
}
|
|
12818
13352
|
`;
|
|
12819
13353
|
break;
|
|
12820
13354
|
case 'circle':
|
|
12821
13355
|
styleBlock = `
|
|
12822
13356
|
:host {
|
|
12823
|
-
--emw-skeleton-circle-size: ${this.size};
|
|
12824
|
-
--emw-skeleton-circle-background: ${this.color};
|
|
12825
|
-
--emw-skeleton-primary-color: ${this.primaryColor};
|
|
12826
|
-
--emw-skeleton-secondary-color: ${this.secondaryColor};
|
|
13357
|
+
--emw-skeleton-circle-size: ${this.stylingValue.size};
|
|
12827
13358
|
}
|
|
12828
13359
|
`;
|
|
12829
13360
|
break;
|
|
12830
13361
|
default:
|
|
12831
13362
|
styleBlock = '';
|
|
12832
13363
|
}
|
|
12833
|
-
return (index.h(index.Host, { key: '
|
|
13364
|
+
return (index.h(index.Host, { key: 'e6b885bfd985ce7663d990756fe9101e25eb97f0' }, index.h("style", { key: '06ae24c7bb74f4dacfc12ae58085333f9dc89da5' }, styleBlock), this.handleStructure(this.structure)));
|
|
12834
13365
|
}
|
|
12835
13366
|
static get watchers() { return {
|
|
12836
13367
|
"structure": ["handleStructureChange"]
|
|
@@ -12851,4 +13382,5 @@ exports.select_input = SelectInput;
|
|
|
12851
13382
|
exports.tel_input = TelInput;
|
|
12852
13383
|
exports.text_input = TextInput;
|
|
12853
13384
|
exports.toggle_checkbox_input = ToggleCheckboxInput;
|
|
13385
|
+
exports.twofa_input = TwofaInput;
|
|
12854
13386
|
exports.ui_skeleton = UiSkeleton;
|