JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
 <script>
function config(){
    $("#dialog").removeClass("hidediv")
    $( "#dialog" ).dialog();
}
</script>


<button onclick="config()">Configuration Features</button>

<div class="hidediv" id="dialog" title="Configuration">
  Choose Chart Type : 
    <select>
        <option></option>
        <option>Bar</option>
        <option>Scatter</option>
    </select>
    <br><br>
    <div style="text-align: center" ><button onclick="">Submit</button></div>
    
</div>

CSS

.hidediv{
        display: none;
    }