fix(rtl): correctly picking up new values

e2e/rtl.test.ts

@@ -14,17 +14,18 @@ import {
     await addFontStyles(page);
     await page.evaluate(() => {
       document.dir = 'rtl';
-    })
+    });
   });
 
   test('dnd the thumb to right', async () => {
     await trackMouse(page);
+    expect(await page.screenshot()).toMatchImageSnapshot();
     await page.mouse.move(300, 80);
     await page.mouse.down();
     await page.mouse.move(460, 80);
     await page.mouse.up();
     await untrackMouse(page);
     const output = await page.$('#output');
-    expect(await page.evaluate(e => e.textContent, output)).toBe('20.4');
+    expect(await page.evaluate(e => e.textContent, output)).toBe('60.2');
     expect(await page.screenshot()).toMatchImageSnapshot();
   });

examples/Rtl.tsx

@@ -2,15 +2,15 @@ import * as React from 'react';
 import { Range, getTrackBackground } from '../src/index';
 
 const STEP = 0.1;
-const MIN = 0;
+const MIN = 50;
 const MAX = 100;
 
 class Basic extends React.Component {
   state = {
     values: [50]
   };
   render() {
-    return ( 
+    return (
       <div
         style={{
           display: 'flex',

src/Range.tsx

@@ -326,7 +326,7 @@ class Range extends React.Component<IProps> {
     }
     // invert for RTL
     if (rtl) {
-      newValue = max - newValue;
+      newValue = (max+min) - newValue;
     }
     if (Math.abs(values[draggedThumbIndex] - newValue) >= step) {
       onChange(