JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://arshtepe.github.io/multiPopupJS/multiPopup.min.js"></script>
<link rel="stylesheet" href="https://arshtepe.github.io/multiPopupJS/popup-default.css">
<div id="loader-popup-window" class="loader-popup-window" style="transform: scale(0);">
    <div id='popup-body' class="popup-loader-body">
        <div class="loader-wrapper">
            <svg class="circular">
                <circle class="path" cx="50" cy="50" r="20" fill="none" stroke-width="2" stroke-miterlimit="10"/>
            </svg>
        </div>
            <span class="static-text"> Loading  </span> <span id="countdown-text" class="countdown-text" > </span>
    </div>
</div>


<div id="popup-window" class="popup-window" >
    <p>Some content</p>
    <paper-button class="popup-close-button"  data-popup-value = "cancel" >
      <core-icon icon="clear" aria-label="clear" role="img"> </core-icon>
        Cancel
    </paper-button>
    <paper-button class="colored custom popup-action-button" data-popup-value = "ok" >
        <core-icon icon="check" aria-label="check" role="img"></core-icon>
        Ok
    </paper-button>
</div>

<paper-button raised="" id="popup-button" noink="" role="button" tabindex="0"> popup Window </paper-button>

CSS

/* demo css */


html, body {
    margin: 0; padding: 0;
    height: 100%;
}

body {
    display: flex;
    justify-content: center;
    align-content: center ;
    flex-direction:  column;

}

.popup-window {

    display: none;
    width: 400px;
    height: 180px;
    background-color: white;
    overflow: auto;
    box-sizing: border-box;
    padding: 24px 24px 0 24px;
    text-align: left;
    -webkit-box-shadow: 0 0 15px #fff;
    -moz-box-shadow: 0 0 15px #fff;
    -o-box-shadow: 0 0 15px #fff;
    box-shadow: 0 0 15px #fff;


}

.popup-window p {
    margin-bottom: 60px;
}
.popup-window .accept-button {
    color:#4285f4;
}

.popup-window .colored {
    color: #4285f4;
}

.loader-popup-window {

    display: none;
    width: 300px;

    background-color: white;
    z-index: 100000;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #808080;
    margin: 0;
    color: #808080;
    font-size: 13px;
    font-weight: normal;
    line-height: 18px;
    background-color: #FFFFFF;
    border: 1px solid #EAEEFA;
    border: 1px solid rgba(234, 238, 250, 0.6);

    -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.6);
    -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.6);
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.6);
}

.popup-head {
    padding: 5px 15px;
    margin: 0;
}

.popup-head h2 {

    text-align: center;
}


.popup-loader-body {
    font-size: 15px;

    border-top: 1px solid #EEEEEE;
    -webkit-border-radius: 0 0 6px 6px;
    -moz-border-radius: 0 0 6px 6px;
    border-radius: 0 0 6px 6px;
    -webkit-box-shadow: inset 0 1px 0 #FFF;
    -moz-box-shadow: inset 0 1px 0 #FFF;
    box-shadow: inset 0 1px 0 #FFF;
    display: table;
    text-align: center;

}

paper-button[raised] {
    align-self: center;
}

paper-button[raised].colored {
    background: #4285f4;
    color: #fff;
}


.loader-wrapper {
    float: left;
}

.static-text, .countdown-text {
   ...

JavaScript

( function() {

        var win =  document.getElementById( "popup-window"),
            loaderWin = document.getElementById( "loader-popup-window"),
            btLoadingWin = document.getElementById( "loading-button"),
            btPopupWin = document.getElementById( "popup-button"),
            countdownElem = document.getElementById( "countdown-text" );

        var popup = new MultiPopup();
        win.style.transform = "scale(0)";


        popup.addWindow( "mWin", win, {
            opt_handlerClickCls: "popup-action-button",
            opt_hideButtonCls: "popup-close-button",
            opt_isOverlayClickHide: true
        });


        popup.on( "dataClick", function ( status ) {

            console.log( status );
            console.log( "click" );

            if( status == "ok" ) {
                alert( "ok" )
            }

        }, win );


        popup.on( "show", function ( ) {
            this.window.style.transform = "scale(1)";
        }, "mWin" );

        popup.on( "hide", function ( ) {
            this.window.style.transform = "scale(0)";
        }, "mWin" );

        btPopupWin.onclick = function () {
            popup.show( "mWin" );
        };



    } () );