title: How to get dynamic steps and dependencies in React input type range (slider)?
body: <p>I need to have two input-sliders of range type.</p>
  <p>Below is my sandbox for my variant, but I think it's not the exact way.</p>
  <p>So, the first slider should have: min value = 1000, max value 20000, and step = 1000. (pretty easy)</p>
  <p>The second one should have: min value = 3, max value = 70, and dynamic step [3, 7, 14, 54, 70]. How do I achieve dynamic step?</p>
  <p>Also those sliders have dependencies:</p>
  <p>If first input has value more than 10000, the second should have value 54 and it cannot be moved lower.</p>
  <p>If first input has value less than 10000, the second should have values 3,7,14 but cannot be moved higher to 54 and 70.</p>
  <p>Code for tests is here: <a href="https://codesandbox.io/s/ejll0" rel="nofollow noreferrer">Sandbox</a></p>
  <p>Thanks in advance for your suggestions.</p>