JSFiddle - React, Tailwind, and code Playground

Phone Number Masked Input

by Jennifer Perrin

HTML

<label>Phone Number</label>
<input id="phone" class="number" type="text" value="" />

JavaScript

/*
    Masked Input plugin for jQuery
    Copyright (c) 2007-2011 Josh Bush (digitalbush.com)
    Licensed under the MIT license (http://digitalbush.com/projects/masked-input-plugin/#license) 
    Version: 1.3
*/
(function(a) {
    var b = (a.browser.msie ? "paste" : "input") + ".mask",
        c = window.orientation != undefined;
    a.mask = {
        definitions: {
            9: "[0-9]",
            a: "[A-Za-z]",
            "*": "[A-Za-z0-9]"
        },
        dataName: "rawMaskFn"
    }, a.fn.extend({
        caret: function(a, b) {
            if (this.length != 0) {
                if (typeof a == "number") {
                    b = typeof b == "number" ? b : a;
                    return this.each(function() {
                        if (this.setSelectionRange) this.setSelectionRange(a, b);
                        else if (this.createTextRange) {
                            var c = this.createTextRange();
                            c.collapse(!0), c.moveEnd("character", b), c.moveStart("character", a), c.select()
                        }
                    })
                }
                if (this[0].setSelectionRange) a = this[0].selectionStart, b = this[0].selectionEnd;
                else if (document.selection && document.selection.createRange) {
                    var c = document.selection.createRange();
                    a = 0 - c.duplicate().moveStart("character", -1e5), b = a + c.text.length
                }
                return {
                    begin: a,
                    end: b
                }
            }
        },
        unmask: function() {
            return this.trigger("unmask")
        },
        mask: function(d, e) {
            if (!d && this.length > 0) {
                var f = a(this[0]);
                return f.data(a.mask.dataName)()
            }
            e = a.extend({
                placeholder: "_",
                completed: null
            }, e);
            var g = a.mask.definitions,
   ...