Carousel.mdx

route	menu
/components/carousel	Components

import { Playground, Props } from 'docz'; import { Carousel } from './Carousel.tsx';

Carousel

It displays a sliding carousel

Properties

MML string

<mml>
  <carousel>
    <item>
        <image src="https://getstream.github.io/mml-react/public/door.jpg" />
        <md>**Door**</md>
        <text>Locks, hinges, screens, stuck...</text>
        <button name="action" value="door">Select</button>
    </item>
    <item>
        <image src="https://getstream.github.io/mml-react/public/window.jpg" />
        <md>**Window**</md>
        <text>Glass, slide, locks, broken, damage...</text>
        <button name="action" value="window">Select</button>
    </item>
    <item>
        <image src="https://getstream.github.io/mml-react/public/sliding-door.jpg" />
        <md>**Sliding door**</md>
        <text>Locks, hinges, screens, stuck...</text>
        <button name="action" value="sliding-door">Select</button>
    </item>
  </carousel>
</mml>

Basic usage

**Door** Locks, hinges, screens, stuck... Select

**Window** Glass, slide, locks, broken, damage... Select

**Sliding door** Locks, hinges, screens, stuck... Select `} />

With custom slides width

**Door** Locks, hinges, screens, stuck... Select

**Window** Glass, slide, locks, broken, damage... Select

**Sliding door** Locks, hinges, screens, stuck... Select `} />