JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<head>
  <meta charset="utf-8" />
  <meta name="description" content="jQuery-Mask-Plugin - A jQuery plugin to make field masks" />
  <meta name="author" content="Igor Escobar" />
  <title>jQuery-Mask-Plugin - A jQuery plugin to make field masks.</title>

  <link rel="stylesheet" href="http://igorescobar.github.com/jQuery-Mask-Plugin/css/bootstrap.min.css" type="text/css" media="screen">

  <script type="text/javascript" src="http://igorescobar.github.com/jQuery-Mask-Plugin/jquery.mask.js"></script>
</head>
<body>
  <div class="container">
  <h2>Nova mascara para telefones de São Paulo com jQuery Mask Plugin</h1>
  <span> A jQuery Plugin for field masks. </span>
  <h2>Demos</h2>

  <form>
    <label>Mascara para Telefones de São Paulo</label>
    <input type="text" class="sao_paulo_phone_number"/>
  </form>
  
  <p>jQuery Mask Plugin on <a href="https://github.com/igorescobar/jQuery-Mask-Plugin" target="_blank">GitHub</a> & Author <a href="http://blog.igorescobar.com/" rel="author" target="_blank">Igor Escobar</a> </p>
</div>
<br clear="all" />

</div>
</body>
</html>

JavaScript

$('.sao_paulo_phone_number').mask('(00) 0000-0000', 
    {onKeyPress: function(phone, e, currentField, options){
     var new_sp_phone = phone.match(/^(\(11\) 9(5[0-9]|6[0-9]|7[01234569]|8[0-9]|9[0-9])[0-9]{1})/g);
     new_sp_phone ? $(currentField).mask('(00) 00000-0000', options) : $(currentField).mask('(00) 0000-0000', options)
   }
 });