JSFiddle - React, Tailwind, and code Playground

HTML

<a href="#" data-mini="false" data-theme="e" data-role="button" class="opensearch" data-icon="search" data-iconpos="right">Search</a>

    <div class="search_field" style="display:none;">
        <input name="search" id="search" value="" placeholder="Search Item...." type="search" data-theme="e" />
    </div>

JavaScript

$(function() {
	 
	$( ".opensearch" ).on( 'click', tapHandler );
		
	function tapHandler( event ) {
	  $('.search_field').slideToggle();
	  setTimeout(function(){
		 $('#search').focus().tap();
		},0);
	}
	
});