JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://s3.amazonaws.com/ringcaptcha-test/widget/qualify-20171226/bundle.js"></script>
<script src="//cdn.rawgit.com/oauth-io/oauth-js/c5af4519/dist/oauth.js"></script>
<div id='widget-point'>
</div>

JavaScript

$(document).ready(function() {
    $('#widget-point').append(
      '<div id="xyz" data-widget data-locale="ja" data-mode="signup" data-type="dual"></div>'
    );

    $('#xyz').each(function() {
      var appKey = "hy2o7ujafi5ene6o4y7a";
      var settings = $(this).data();
      settings.app = appKey;
      settings.events = {
        ready: function(event) {
          console.log("Ready: event:", event);
          const dataString = localStorage.getItem('ringcaptcha.widget.' + appKey);
          const data = dataString ? JSON.parse(dataString) : null;
          console.log("Ready: data:", data);
        },
        verified: function(event) {
          console.log("Verified: event:", event);
          const dataString = localStorage.getItem('ringcaptcha.widget.' + appKey);
          const data = dataString ? JSON.parse(dataString) : null;
          console.log("Verified: data:", data);
        },
        signup: function(event, formValues) {
          console.log("Signup: event:", event);
          console.log("Signup: formValues:", formValues);
          const dataString = localStorage.getItem('ringcaptcha.widget.' + appKey);
          const data = dataString ? JSON.parse(dataString) : null;
          console.log("Signup: data:", data);
        }
      };

   settings.form = [
     {
       id: 'username',
       type: 'text',
       placeholder: 'ユーザーネーム',
       validations: {
         presence: 'ユーザーネームを入力して下さい'
       }
     },
     {
       id: 'email',
       type: 'email',
       placeholder: 'メール',
       validations: {
         presence: 'メール',
         format: { message: '無効なメールアドレスです' }
       }
     },
     {
       id: 'sms-budget-monthly',
       type: 'text',
       placeholder: '月間SMS予算',
       validations: {
         presence: '月間SMS予算を入力して下さい',
         format: {
             regex: '^[0-9]+\\.*[0-9]*$',
             message: '月間SMS予算は数字で入力して下さい'
           }
         }
       },
       {
         id: 'sms-volume-monthly',
         type:...