/
form-field-format.js
36 lines (29 loc) · 1.11 KB
/
form-field-format.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
import { PhoneFormatter, SocialSecurityNumberFormatter, TextField } from 'field-kit';
import DateFormatter from './modules/date-formatter';
import OtpCodeFormatter from './modules/otp-code-formatter';
import ZipCodeFormatter from './modules/zip-code-formatter';
function formatForm() {
const formats = [
['.dob', new DateFormatter()],
['[type=tel]', new PhoneFormatter()],
['.ssn', new SocialSecurityNumberFormatter()],
['.zipcode', new ZipCodeFormatter()],
['.mfa', new OtpCodeFormatter()],
];
formats.forEach(function(f) {
const [el, formatter] = f;
const input = document.querySelector(el);
if (input) {
/* eslint-disable no-new, no-shadow */
const field = new TextField(input, formatter);
// add date format placeholders only to .dob fields
if (el === '.dob') {
field.setFocusedPlaceholder('');
field.setUnfocusedPlaceholder('mm/dd/yyyy');
}
// removes focus set by field-kit bug https://github.com/square/field-kit/issues/62
document.activeElement.blur();
}
});
}
document.addEventListener('DOMContentLoaded', formatForm);