feat: Make the second argument to tipFormatter the index of the handle (#167)

README.md

@@ -168,7 +168,7 @@ ReactDOM.render(<Slider />, container);
           <td>tipFormatter</td>
           <td>function or `null`</td>
           <td></td>
-          <td>Format the value of the tooltip if it shows. If `null` the tooltip will always be hidden.</td>
+          <td>Format the value of the tooltip if it shows. If `null` the tooltip will always be hidden. When given a function, the first argument will be the value and the second will be the index of the slider handle.</td>
         </tr>
         <tr>
           <td>dots</td>

src/Handle.jsx

@@ -34,6 +34,7 @@ export default class Handle extends React.Component {
       value,
       dragging,
       noTip,
+      index,
     } = this.props;
 
     const style = vertical ? { bottom: `${offset}%` } : { left: `${offset}%` };
@@ -55,7 +56,7 @@ export default class Handle extends React.Component {
         prefixCls={tooltipPrefixCls || `${prefixCls}-tooltip`}
         placement="top"
         visible={isTooltipVisible}
-        overlay={<span>{tipFormatter(value)}</span>}
+        overlay={<span>{tipFormatter(value, index)}</span>}
         delay={0}
         transitionName={tipTransitionName}
       >
@@ -76,4 +77,5 @@ Handle.propTypes = {
   value: React.PropTypes.number,
   dragging: React.PropTypes.bool,
   noTip: React.PropTypes.bool,
+  index: React.PropTypes.number,
 };

src/Slider.jsx

@@ -486,6 +486,7 @@ class Slider extends React.Component {
       value: v,
       offset: offsets[i],
       dragging: handle === i,
+      index: i,
       key: i,
       ref: `handle-${i}`,
     }));