<div class="flex flex-wrap flex-gap center center-tb">
    <div form="input" class="wm-25">
        <input type="text" class="copy" disabled="" style="cursor:auto" value="fdab37863626fa2bff95a428e6afa93b">
    </div>
    <button class="button clip-b" clip-b-t=".copy" clip-b-e="index"></button>
</div>
<div class="w-100 divider"></div>
<div class="flex flex-wrap flex-gap center center-tb">
    <div form="input" class="wm-25">
        <input type="text" class="copy" disabled="" style="cursor:auto" value="gilob koli">
    </div>
    <button class="button clip-b" align="icon" clip-b-t=".copy" clip-b-e="index"></button>
</div>

<div class="w-100 divider"></div>
<div class="h7 clip-event">Copy Text</div>
<div class="w-100"></div>
<div class="flex flex-wrap flex-gap center center-tb">
    <div form="input" class="wm-25">
        <input type="text" class="copy" disabled="" style="cursor:auto;opacity:1" value="HELLO 👋">
    </div>
    <button class="button clip-b clip-event-b" align="icon" align-l="y" clip-b-e="index" clip-b-t=".copy"></button>
</div>
<script>
    // Selecting elements
    var change = document.querySelector(".clip-event");
    var btn = document.querySelector(".clip-event-b");

    // Event listener for successful clipboard copy
    btn.addEventListener("clip-success", function () {
        change.textContent = "Copied!";
    });

    // Event listener for completion of clipboard operation
    btn.addEventListener("clip-after", function () {
        change.textContent = "Copy paragraph";
    });

    // Event listener for clipboard operation error
    btn.addEventListener("clip-error", function () {
        console.log("Error copying text to clipboard");
    });

</
script>