JSFiddle - React, Tailwind, and code Playground

HTML

<button onclick="execCommand1('cut', event)">Cut</button>
<button onclick="execCommand1('copy', event)">Copy</button>
<button onclick="execCommand1('paste', event)">Paste</button>
<pre id=log></pre>

CSS

.permission-prompt {
    position: absolute;
    display: block;
    background-color: lightgray;
    padding: .3em .7em;
}
html, body {
    height: 100%;
    
}

JavaScript

window.execCommand1 = function(command, event) {
    console.log(event.currentTarget, event.target.offsetLeft);
    var permissionPrompt = document.createElement('a');
    permissionPrompt.classList.add('permission-prompt');
    permissionPrompt.style.top = event.currentTarget.offsetTop + event.target.offsetHeight + 3 + "px";
    permissionPrompt.style.left = event.currentTarget.offsetLeft + 3 + "px";
    permissionPrompt.textContent = command;
    permissionPrompt.href = "#";
    permissionPrompt.onclick = e => closePrompt(e, 'accepted');
    document.body.appendChild(permissionPrompt);
    permissionPrompt.focus();
    log.textContent += command + ' command requested\n';
    setTimeout(function() {
        document.body.onclick = e => closePrompt(e, 'rejected');
        document.body.onkeypress = e => void (e.key == "Escape" && closePrompt(e, 'rejected'));
    }, 0);
    function closePrompt(e, status) {
        e.preventDefault();
        document.body.removeChild(permissionPrompt);
        document.body.onclick = null;
        document.body.onkeypress = null;
        log.textContent += command + ' command ' + status + '\n';
    }
}
var log = document.querySelector('#log');