[slider] Expose `getThumbIndex` prop + API to Slider component

Summary

(I admit I don't know if there's a way to do this in v6, or planned in v7, but putting it out here just in case).

With the v5 Slider, there's no way to tell it which thumb index should respond to a value change event – it automatically determines this using closest proximity, via the findClosest function. This is troublesome for cases where you need fine-grained control over this, e.g. if the left/right thumbs are "trim" controls for video playback, while the middle thumb handles scrubbing.

To solve this, I modified the original Slider v5 source here (Gist) where I exposed a getThumbIndex function prop to the Slider component and useSlider hook. Now I can pass this function into the slider so it can determine which thumb should be triggered. I've also augmented it to pass min/max values to this function so that I can determine the % of total slider position.

Would be nice to see this prop exposed in future versions!

Examples

Source code of example: https://gist.github.com/brandonscript/f8d1aa0ec648a5da7fc684fa860f27b0 (modified Slider v5)

Motivation

Search keywords: slider thumb index