JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css">
<div id="container">
  <div class="obj" id="obj1"></div>
  <div class="obj" id="obj2"></div>
  <div class="obj" id="obj3"></div>
  <div class="obj" id="obj4"></div>
</div>

CSS

#container{
  position:absolute;
  width:400px;
  height:400px;
  background:#eee;
}

.obj{
  position:absolute;
  background:#ccc;
}

.ui-selected{
  background: #1C90F3;
}

#obj1{
  width:50px;
  height:50px;
  left:50px;
  top:50px;
}

#obj2{
  width:50px;
  height:50px;
  left:150px;
  top:50px;
}

#obj3{
  width:50px;
  height:50px;
  left:50px;
  top:250px;
}

#obj4{
  width:50px;
  height:50px;
  left:150px;
  top:250px;
}

JavaScript

/*! Drag Multiple Plugin - v0.1.1 - 2014-05-14
* https://github.com/javadoug/jquery.drag-multiple
* Copyright (c) 2014 Doug Ross; Licensed MIT */
!function(a){"use strict";function b(){return!1}function c(b){return a.extend({},h,b.options.multiple)}function d(b,c,d,e){return a.isFunction(b)?b.call(c,d,e):void 0}function e(a,b,c,e){return d(b.beforeStart,a,c,e)}function f(a,b,c,e){return d(b.beforeDrag,a,c,e)}function g(a,b,c,e){return d(b.beforeStop,a,c,e)}var h={items:function(){return a(".ui-draggable.ui-selected")},beforeStart:function(){return this.is(".ui-draggable")&&this.is(".ui-selected")?void 0:(a(".ui-draggable").removeClass("ui-selected"),!1)},beforeDrag:a.noop,beforeStop:a.noop};a.ui.plugin.add("draggable","multiple",{start:function(d,f){var g,h,i,j;return g=this,h=g.data("draggable")||g.data("ui-draggable"),h.multiple={},j=h.multiple.options=c(h),i=j.items(),!1===e(g,j,d,f)?(j.dragCanceled=!0,!1):(i.each(function(){var b=a(this).position();a(this).data("dragmultiple:originalPosition",a.extend({},b))}),h.originalRevert=j.revert=h.options.revert,void(h.options.revert=b))},drag:function(c,d){var e,g,h;return e=this,g=e.data("draggable")||e.data("ui-draggable"),h=g.multiple.options,h.dragCanceled?!1:(f(e,h,c,d),b!==g.options.revert&&(h.revert=g.options.revert,g.options.revert=b),void h.items().each(function(){var b=a(this).data("dragmultiple:originalPosition");a(this).css({top:b.top+(d.position.top-d.originalPosition.top),left:b.left+(d.position.left-d.originalPosition.left)})}))},stop:function(b,c){var d,e,f;return d=this,e=d.data("draggable")||d.data("ui-draggable"),f=e.multiple.options,f.dragCanceled?!1:(g(d,f,b,c),f.revert===!0&&f.items().each(function(){var b=a(this).data("dragmultiple:originalPosition");a(this).css(b)}),f.items().each(function(){a(this).removeData("dragmultiple:originalPosition")}),void(e.options.revert=e.originalRevert))}})}(jQuery);

var mousemovedetect = false;
var disableclick = false;

$(document).mouseleave(function() {
 ...