JSFiddle - React, Tailwind, and code Playground

HTML

<dialog>
    <p>I am a dialog</p>
    <p>If you press Esc I will close</p>
    <button id="close">Close</button>
</dialog>

JavaScript

let dialog = document.querySelector('dialog');

const openDialog = () => dialogo.showModal();
document.querySelector('body').onload = () => {
	  dialog.showModal();
};

dialog.addEventListener('cancel', (event) => {
    event.preventDefault();
});

let closeButton = document.querySelector('#close');
closeButton.addEventListener('click', (event) => {
	  dialog.close();
});