JSFiddle - React, Tailwind, and code Playground
HTML
<input id="seuInput" type="text" />
<button id="fechar">fechar</button>
<div class="seuDatePicker">
<h3>Seu datepciker</h3>
</div>
<br>
<h1>Texto para teste :)</h1>
CSS
.seuDatePicker {
margin-top: 20px;
display: none;
border: 1px solid black;
width: 200px;
height: 200px;
position: absolute;
background-color: black;
}
h3 {
color: white;
}
JavaScript
/*Pega o evento de inicialização*/
$(document).ready(function () {
//seto o evento de click no input
$('#seuInput').click(function () {
//quando tiver um click no input ele exibira sua div
$('.seuDatePicker').show("slow");
});
//seto o evento de click no button
$('#fechar').click(function(){
//quando tiver um click no input ele sumira com sua div
$('.seuDatePicker').hide("slow");
});
});