Carousel controls
Prev and next buttons with animated position dots for any paged carousel.
API reference
Components
<ArrowIcon />
Inline chevron used by StepButton.
direction
Which way the chevron points. "prev" mirrors it horizontally.
className?
Merged onto the <svg> element.
<StepButton />
Bordered icon button with theme snap tap press.
direction
Which control this is.
onClick
Fired on click.
label
Accessible label for the icon-only button.
children?
Override the icon.
disabled?
Disable the button.
className?
Merged onto the button element.
<PositionDots />
Position indicator with one mark per slide.
index
Index of the active slide (0-based).
total
Total number of slides.
variant?
Active-dot visual style. Defaults to "bar".
onSelect?
Makes each dot a selectable tab.
label?
aria-label for the tablist when onSelect is set.
className?
Merged onto the track element.
<CarouselControls />
Assembled control strip: prev button, dots, next button.
index
Index of the active slide (0-based).
total
Total number of slides.
onPrev
Step to the previous slide.
onNext
Step to the next slide.
onSelect?
Makes dots selectable and calls onSelect(i) on click.
dots?
Dot indicator style. Defaults to "bar".
prevLabel?
Accessible label for the previous button.
nextLabel?
Accessible label for the next button.
dotsLabel?
aria-label for the dots tablist.
announcement?
Text announced in an aria-live region.
className?
Merged onto the control-strip root.
Featured in
See the carousel controls composed into full sections.
