Group all the *ClassName props into a single prop classNames object

[zebateira]

In order to make the API simpler, we could group the className props into a single prop classNames object. Example:

Before

<Carousel
   wrapperClassName="wrap"
   carouselClassName="carousel"
   sliderClassName ="slider"
>
...
</Carousel>

After

<Carousel
   classNames={{
      wrapper: 'custom-style-wrap',
      carousel: 'custom-style-carousel',
      slider: 'custom-style-slider'
   }}
>
...
</Carousel>

const carouselClassNames = {
   wrapper: 'custom-style-wrap',
   carousel: 'custom-style-carousel',
   slider: 'custom-style-slider'
}

<Carousel
   classNames={carouselClassNames}
>
...
</Carousel>

This is just a suggestion for the API. Since it is subjective what the best experience is, here are my arguments:

• Possibility to use a local variable object for grouping all the custom classes (you can still do this using the original API, but you have to spread the props).
• Reduces the main props for custom styling of the component to a single prop.

To iterate again, this is very subjective, so the current implementation works just fine. This is just a suggestion.