JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://el39.net/sltest/wNumb.js"></script>
<script src="https://el39.net/sltest/nouislider.min.js"></script>
<link rel="stylesheet" href="https://el39.net/sltest/nouislider.css">
<table>
	<tr>
		<td>
			<div style="width: 300px" id="slider1"></div>
		</td>
		<td>
			<span id="slider1-span"></span>
		</td>
	</tr>
	<tr>
		<td>
			<div style="width: 300px" id="slider2"></div>
		</td>
		<td>
			<span id="slider2-span"></span>
		</td>
	</tr>
</table>
<span id="slider3-span"></span>

JavaScript

// Store the locked state and slider values.
	var slider1 = document.getElementById('slider1'),
	slider2 = document.getElementById('slider2'),
	slider1Value = document.getElementById('slider1-span'),
	sliderSum = document.getElementById('slider3-span'),
	slider2Value = document.getElementById('slider2-span');
	
	function updateSlider1Range ( min ) {
		if(min < 10){
			slider1.noUiSlider.updateOptions({
				range: {
					'min': 10 - min,
					'max': 50
				}
			});
		}; 
		
	}		
	function updateSlider2Range ( min ) {
		if(min < 10){
			slider2.noUiSlider.updateOptions({
				range: {
					'min': 10 - min,
					'max': 20
				}
			});
		}; 
		
	}	
	noUiSlider.create(slider1, {
		start: 5,
		animate: true,
		connect: [true, false],
		step: 1,
		range: {
			min: 1,
			max: 50
		},
		format: wNumb({
			decimals: 0
		})
	});
	
	noUiSlider.create(slider2, {
		start: 5,
		animate: true,
		connect: [true, false],
		step: 1,
		range: {
			min: 1,
			max: 20
		},
		format: wNumb({
			decimals: 0
		})
	});
	
	slider1.noUiSlider.on('end', function( values, handle ){
		slider1Value.innerHTML = values[handle],
		updateSlider2Range(values[handle]),
		sum = +slider1.noUiSlider.get() + +slider2.noUiSlider.get(),
		sliderSum.innerHTML = sum + "00р/мес";
	});
	
	slider2.noUiSlider.on('end', function( values, handle ){
		slider2Value.innerHTML = values[handle],
		sum = +slider1.noUiSlider.get() + +slider2.noUiSlider.get(),
		sliderSum.innerHTML = sum + "00р/мес",
		updateSlider1Range(values[handle]);
	});
	
	slider.noUiSlider.get()