I'll create a carousel with Instagram-style dot indicators that show a maximum of 6 dots with size variations for overflow indicators.

This carousel implementation features:

1. Instagram-style dot indicators that show a maximum of 6 dots at a time
2. Size variations for dots at the edges to indicate there are more slides
3. Responsive navigation with touch swipe support, arrow buttons, and keyboard controls
4. Smooth transitions between slides

The dot indicator logic works like this:

• When there are 6 or fewer slides, all dots are shown normally
• When there are more than 6 slides, the carousel shows dots centered around the current slide
• Dots at the edges appear smaller to indicate they're at the boundary of visible dots
• Additional smaller dots appear at the start/end to indicate there are more slides in that direction

You can customize the maxVisibleDots prop to change how many dots are shown at once. The carousel is fully responsive and works on both desktop and mobile devices.