Here are some react-slide-select demos. This slider provides two features, and 2 features only. 1: You can swipe through a list of "slides". 2: You may "select" one of them, at which point a callback runs I suppose.
In this example, we see a "Product" styled slider. You may provide an `items` prop to this class, which should be an array of objects that you intend to have displayed. You should also provide your own function to the onSelect prop on the SlideSelect class. When the onSelect method is invoked, it will be passed the data from the item that you clicked on.
Please note that the custom inner-child class -must- implement a call to the `this.props.onClick` property for the internal element that you want to be listening to the click event. In this context, when the onSelect passed to the SlideSelect method is invoked, it will only receive the index of the child that you clicked on.
In this example, we see a "Hero" styled slider in the wild. This creature has 4 distinct parts of its body. The landing slide has multiple inner call-to-actions, the information only slide has no interactivity, the promotion slide is selectable from anywhere on its surface.
Click on the smaller selector to change the index of the top hero. Bam. Cross component communication.
Select a width percentage
Select a number of Kittens to display
Jump to a kitten using its index without the animated transition.