JSFiddle - React, Tailwind, and code Playground

by ringcaptcha

HTML

<script src="https://cdn.ringcaptcha.com/widget/bitcoinblack/jwt-20190423/bundle.js"></script>
<script src="ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<div id='widget-point' style=''></div>

CSS

div.ringcaptcha.widget.no-brand {
  border: 0px; !important 
}

button.btn.btn-submit.btn-block.btn-verify.js-send-code {
  color: white; !important;
  background-color: green; !important
}

JavaScript

$(document).ready(function() {
         $('#widget-point').append(
             '<div id="xyz" data-recaptcha data-widget data-locale="en" data-mode="verification"></div>'
         );

         $('#xyz').each(function() {
             var appKey = "4aji2usi8onirynebe6i";
             var settings = $(this).data();
             settings.app = appKey;
             settings.events = {
                 ready: function(event, formValues) {

                 },
                 signup: function(event, formValues) {
                     const dataString = localStorage.getItem('ringcaptcha.widget.' + appKey);
                     const data = dataString ? JSON.parse(dataString) : null;
                     $('input#firstName').val(formValues.username);
                     $('input#emailAddress').val(formValues.email);
                     $('input#phone').val(formValues.phone);
                     $('input#password').val(formValues.password);

                     var searchParams = new URLSearchParams(window.location.search);
                     var required = "token,code,phone";
                     var fullName= formValues.username;
                     var email= formValues.email;
                     $.post("/register", {fullName: fullName, email: email, phone: formValues.phone, password: formValues.password
                         }).success(function(){$('form').submit()});
                  }
              };

            settings.form = [
                {
                    id: 'username',
                    type: 'text',
                    placeholder: 'Name',
                    validations: {
                        length: { min: 1, message: 'Name must be present.' }
                    }
                },
                {
                    id: 'email',
                    type: 'email',
                    placeholder: 'Email',
                    validations: {
                        presence: 'Your email must be present.',
                    ...