JSFiddle - React, Tailwind, and code Playground

HTML

<input type="search" placeholder="Enter info..."></input>

JavaScript

var inputWdith = '250px';
    var inputWdithReturn = '140px';     
    $(document).ready(function() {
        $('input').focus(function(){
            //clear the text in the box.
            $(this).val(function() {
                $(this).val(''); 
            });
            //animate the box
            $(this).animate({
                width: inputWdith
            }, 400 )
        }); 

        $('input').blur(function(){
            $(this).val('Enter info...');
            $(this).animate({
                width: inputWdithReturn
            }, 500 )
        });
    });