JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/latest/TweenMax.min.js"></script>
<script src="https://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<div id="box1">
</div>

<div id="slider"></div>
<button id="play">Play</button>

CSS

#box1{
  width: 100px;
  height: 100px;
  background: red;
}
#slider{
  position:relative;  
  display:block;
  width:700px;
  top:20px;  
  left:25px;
}

.ui-slider .ui-slider-handle { 
  width: 40px !important; 
  margin-left: -20px !important; 
  height:40px !important; 
  margin-top:-10px !important;
}

#play {
  position: relative;
  display:block;
  margin-top: 100px;
  width:100px;
  height:30px;
  }

JavaScript

var __extends = (this && this.__extends) || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
var Springrk4 = (function (_super) {
    __extends(Springrk4, _super);
    // private drawAnimate: Springrk4GraphAnimateOnEaseVisualiser;
    function Springrk4(springrk4Data) {
        var _this = _super.call(this) || this;
        _this.inputData = springrk4Data;
        _this.tension = _this.normaliseInputs(_this.inputData.tension, "tension");
        _this.friction = _this.normaliseInputs(_this.inputData.friction, "friction");
        _this.velocity = _this.normaliseInputs(_this.inputData.velocity, "velocity");
        _this.velocityMultiplier = 1 + (_this.velocity * 0.0005);
        // this.showGraph = false;
        // this.animate = false;
        // this.duration = this.time() * 1000;
        _this.speed = 1 / 60.0;
        _this.tolerance = 0.002; // 1/500 is a change in pixel, so we set that as the tolerance
        _this.current = 0;
        _this.progress = 0;
        _this.moving = false;
        _this.time = _this.getduration();
        _this.duration = _this.time * 1000;
        _this.reset();
        return _this;
    }
    Springrk4.prototype.reset = function () {
        this.moving = true;
        this.velocity = this.velocity * this.velocityMultiplier;
        this.current = 0;
    };
    Springrk4.prototype.getRatio = function (progress) {
        // console.log(progress)
        return this.step();
    };
    Springrk4.prototype.normaliseInputs = function (input, inputType) {
        // Tension max: 1000
        // Tension min: 1
        if (inputType == "tension") {
            if (isNaN(input)) {
                input = input.toString();
                return input > 0 && input <= 1000 ? input : 200;
            }
            else if (!isNaN(input)) {
                return input > 0...