JSFiddle - React, Tailwind, and code Playground

HTML

<p>
  <input id="hours" name="value" value=0 size=3/> hours
  <input id="minutes" name="value" value=0 size=2/> minutes
  <input id="seconds" name="value" value=10 size=2/> seconds
</p>

JavaScript

$(function() {
   $('#seconds').spinner({
     spin: function(event, ui) {
       if (ui.value >= 60) {
         $(this).spinner('value', ui.value - 60);
         $('#minutes').spinner('stepUp');
         return false;
       } else if (ui.value < 0) {
         $(this).spinner('value', ui.value + 60);
         $('#minutes').spinner('stepDown');
         return false;
       }
     }
   });
   $('#minutes').spinner({
     spin: function(event, ui) {
       if (ui.value >= 60) {
         $(this).spinner('value', ui.value - 60);
         $('#hours').spinner('stepUp');
         return false;
       } else if (ui.value < 0) {
         $(this).spinner('value', ui.value + 60);
         $('#hours').spinner('stepDown');
         return false;
       }
     }
   });
   $('#hours').spinner({
     min: 0
   });
 });