JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<div id="viewPort">
    <div id="draggable">drag me</div>
</div>

CSS

#viewPort {
    width: 300px;
    height: 300px;
    background: #fff;
    overflow:scroll;
    border:1px solid #ccc;
}
#draggable {
    color: #fff;
    width: 75px;
    height: 75px;
    padding: 10px;
    background: #333399;
    border:1px solid #ccc;
    margin:5px;
}

JavaScript

//current count of how often we got the mouse positon
var count = 0;
//position of mouse at last function call
var lastPositionX;
var lastPositionY;
//how often we moved in one direction in the last intervall
var movedX;
var movedY;
//intervall to check movement again
var countIntervall = 30;

$("#draggable").draggable({
    scrollSensitivity: 1000,
    scrollSpeed: 40,
    revert: function (event, ui) {
        $("#draggable").originalPosition = {
            top: 0,
            left: 0
        };
        return !event;
    },
    drag: function (e) {
       setScrollSensivity();
    }
});

//init first mousepostion
$("#draggable").on('click', function() {
    lastPositionX = event.pageX;
    lastPositionY = event.pageY;
});

function setScrollSensivity(){
    count++;
    
    //get current mousepostion
    var currentPositionX = event.pageX; 
    var currentPositionY = event.pageY; 
    
    //increase if moved on chose axis
    if ( currentPositionX != lastPositionX ){
        movedX++;
    }
    
    if ( currentPositionY != lastPositionY ){
        movedY++;
    }
    
    //if moved more on x axis decrease sensivity, else increase.
    if (count == countIntervall){
        if (movedX > movedY){
            console.log("moving on X axis");
            $( "#draggable" ).draggable( "option", "scrollSensitivity", 10 );
        } else {
            console.log("moving on Y axis");
            $( "#draggable" ).draggable( "option", "scrollSensitivity", 200 );
        }
        //reset all the counters and start again
        count = 0;
        movedX = 0;
        movedY = 0;
    }
    //set last position for our next function call
    lastPositionX = currentPositionX;
    lastPositionY = currentPositionY;
}