JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://getbootstrap.com/dist/css/bootstrap.css">
<!DOCTYPE html>
<div lang="en" ng-app="demo" class="no-js">


    <!-- Le css -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js"></script>



<div ng-controller="demoCtrl">

    <!-- workspace -->
    <div class="fill">
        <ng-html-window ng-repeat="wnd in windows" options="wnd.options">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris at nisi sed enim ornare dictum at et felis. Nam bibendum ultricies eros id dictum. Integer auctor nisi sem, a sodales diam tincidunt vel. Proin at elit convallis, efficitur libero nec, elementum erat. Curabitur fermentum, felis a dignissim ornare, nibh ex mollis tellus, at tristique nibh lorem posuere nulla. Nullam rutrum fermentum nunc nec condimentum. Maecenas erat purus, dignissim ac laoreet non, molestie viverra tellus. Sed vitae purus et massa maximus ultricies luctus at nisl.

            Vestibulum fringilla congue turpis, vel tempus massa faucibus a. Suspendisse sit amet tortor erat. Donec faucibus, arcu vitae auctor tempor, magna massa feugiat risus, eu rutrum lectus urna dignissim lacus. Duis faucibus justo ut nisl viverra, eu interdum turpis vehicula. Phasellus sit amet turpis sollicitudin, ultricies augue at, semper sapien. Duis fringilla bibendum diam, eget rhoncus magna luctus nec. Cras est mauris, egestas vitae arcu ac, faucibus gravida justo. Pellentesque quis aliquet quam. Suspendisse ut nunc sed diam volutpat varius.
        </ng-html-window>
    </div> <!-- /workspace -->

    <!-- Le javascript -->
    <script>
   
    </script>
    </div>   
   </div>

CSS

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

.fill {
    height: 100%;
    width: 100%;
}

.ng-window {
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 1px 1px 7px 1px rgba(128,128,128,0.2);
    background-color: #fff;
    position: absolute;
    padding-top: 29px;
    min-height: 30px;
    min-width: 90px;
}

.ng-window.active {
    box-shadow: 1px 1px 7px 1px rgba(51, 122, 183,0.2);
    border-color: rgba(51, 122, 183, 0.6);
}

.ng-window.active .ng-window-titlebar {
    background-color: #337ab7;
    border-color: #337ab7;
    color: #fff;
}

.ng-window-titlebar {
    border-bottom: 1px solid #ccc;
    border-radius: 4px 4px 0 0;
    background-color: #f5f5f5;
    position: relative;
    width: 100%;
    height: 29px;
    min-height: 29px;
    padding: .4em 0;
    margin-top: -29px;
    cursor: default;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.ng-window-title {
    position: absolute;
    left: 0.44em;
    right: 0.44em;
    overflow: hidden;
    cursor: inherit;
}

.ng-window-actions {
    position: absolute;
    top: 0;
    right: .4em;
    padding-top: .4em;
    font-size: 12pt;
    color: inherit;
}

.ng-window-content {
    position: relative;
    height: 100%;
    width: 100%;
    border-radius: 0 0 4px 4px;
}

.ng-window-content > div {
    height: 100%;
    width: 100%;
}

.ng-window-resize {
    position: absolute;
}

.ng-window-resize-n {
    top: -3px;
    width: 100%;
    height: 6px;
    cursor: n-resize;
}

.ng-window-resize-s {
    bottom: -3px;
    width: 100%;
    height: 6px;
    cursor: s-resize;
}

.ng-window-resize-e {
    height: 100%;
    width: 6px;
    top: 0;
    right: -3px;
    cursor: e-resize;
}

.ng-window-resize-w {
    height: 100%;
    width: 6px;
    top: 0;
    left: -3px;
    cursor: w-resize;
}

.ng-window-resize-se {
    height: 20px;
    width: 20px;
    bottom: -3px;
   ...

JavaScript

'use strict';

(function() {
    'use strict';

    angular.module('ngHtmlWindow', [])
        .service('ngWindowManager', ngWindowManager);

    function ngWindowManager() {

        var windows = [];

        var currentZ = null,
            baseZ = 1000,
            maxZ = 2000;

        return {
            getCurrentZValue: getCurrentZValue,
            addWindow: addWindow,
            closeWindow: closeWindow,
            focus: focus
        };

        //////////////////

        function getCurrentZValue() {
            if (!currentZ) {
                currentZ = baseZ;
            }
            return currentZ++;
        }

        function addWindow(win) {
            windows.push(win);
            win.focus();
        }

        function closeWindow(win) {
            //Remove window from array
            var id = windows.indexOf(win);
            windows.splice(id, 1);

            //Set new active window
            var length = windows.length;
            if (length > 0) {
                windows[windows.length - 1].focus();
            }
        }

        function focus(win) {

            //Remove window from array and add it to the top of it
            var index = windows.indexOf(win);
            windows.splice(index, 1);
            windows.push(win);

            for (var i = 0; i < windows.length; i++) {
                windows[i].blur();
            }

            win.z = getCurrentZValue();

            // Reset z values if it exceeds maxZ
            if (currentZ > maxZ) {

                currentZ = baseZ;

                for(var i = 0; i < windows.length; i++) {
                    windows[i].z = getCurrentZValue();
                }

            }


        }

    }

    angular.module('ngHtmlWindow')
        .directive('ngHtmlWindow', ['$document', '$window', '$timeout', 'ngWindowManager', ngHtmlWindow]);

    function ngHtmlWindow($document, $window, $timeout, ngWindowManager) {

        return {
            template: "<div...