Skip to main content

Components API

<CarouselProvider />​

Component is used to initialize the carousel context with configuration options and wrap the other components.

PropTypeDefaultRequired
childrenReactNodeYes
slideHeightnumber0Yes
totalnumber0Yes
autoPlayDelaynumberfalseNo
slidesVisiblenumber1No
stepnumber1No
thresholdnumber0.25No
infinitebooleanfalseNo
disableTouchbooleanfalseNo
lazybooleantrueNo
autoPlaybooleanfalseNo

A carousel that wraps the slides and provides the core functionality, such as scrolling to the next or previous slide.

PropTypeDefaultRequired
childrenReactNodeYes
wrapperClassNamestringNo
carouselClassNamestringNo

<Slide />​

A single slide in a carousel.

PropTypeDefaultRequired
childrenReactNodeYes
indexnumberYes
classNamestringNo

<DotsGroup />​

A component that renders a group of dots, representing the slides in the carousel. It provides auto generated dots for the carousel.

PropTypeDefaultRequired
classNamestringNo
dotClassNamestringNo
colorActivestringNo
colorInactivestringNo
onClickFunctionNo

<Dot />​

A single dot.

PropTypeDefaultRequired
classNamestringNo
colorActivestringNo
colorInactivestringNo
indexnumberYes
disabledbooleanNo
onClickFunctionNo

<NextButton />​

PropTypeDefaultRequired
classNamestringNo
childrenReactNodeYes
onClickFunctionNo

<PrevButton />​

PropTypeDefaultRequired
classNamestringNo
childrenReactNodeYes
onClickFunctionNo

<Counter />​

PropTypeDefaultRequired
classNamestringNo