JSFiddle - React, Tailwind, and code Playground

CSS

html, body {
    min-height:100%;
    height:100%;
}
.selection-rectangle {
    display:none;
    position:absolute;
    border:1px solid #000;
    background-color:#ccc;
    height: 1px;
    width:1px;
    opacity:0.5;
    z-index:99999;
    cursor:default;
}

JavaScript

/*
---
description: Small script that helps the user select multiple elements on a given page.

authors:
  - Jean-Nicolas Boulay Desjardins (http://jean-nicolas.name/)

license:
  - MIT-style license

requires:
 - core/1.4:   '*'

provides:
  - SelectionRectangle
...
*/

var SelectionRectangle = new Class({
    
    Implements: [Options, Events],
    
    options: {
        className: 'selection-rectangle',
        fadeOut: true
    },
    
    /* initialization */
    initialize: function(container, options) {
        this.container = document.id(container);
        this.setOptions(options);
        this.selectionRectangleEl = null;
        this.attach();
        this.fireEvent('initialize', [this.selectionRectangleEl]);
    },
    
    addSelectable: function(){
        this.fireEvent('addedSelectable', [selectable]);
    },
    
    attach: function(){
        var pox = null;
        var poy = null;
        var height = null;
        var width = null;
        var newSelector = true;
        var mousedown = false;
        this.selectionRectangleEl = new Element('div', {
            'display': 'none',
            'position': 'absolute',
            'class': this.options.className
        }).inject(this.container);

        this.container.addEvents({
            'mousedown': function(e){
                e.stop();
                this.selectionRectangleEl.setStyles({
                    'display': 'block',
                    'height': 1,
                    'width': 1,
                    'top': e.page.y,
                    'left': e.page.x
                });
                poy = e.page.y;
                pox = e.page.x;
                mousedown = true;
                newSelector = false;
                this.fireEvent('display', [poy, pox]);
            }.bind(this),
            'mousemove': function(e){
                if (mousedown) {
                    var mx = e.page.x;
                    var my = e.page.y;
                if (pox < mx) {
            ...