JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/themes/base/jquery-ui.css">
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js"></script>
<div id="dialog" title="Basic dialog">
    <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>

CSS

body {
    height: 500px       
}
#dialog{
    background:#f00;
    height:200px;
}

JavaScript

$('body').click(function(e){
    console.log(e);
    $( "#dialog" ).dialog({ 
        position: [e.offsetX, e.offsetY]
    });
});