Renders a carousel of slides.

<.carousel id="hero" label="Featured posts" loop>
  <:slide :for={post <- @posts}><.card>…</.card></:slide>
</.carousel>

<.carousel id="logos" label="Customers" per_view={3} autoplay={4000}>…</.carousel>

The track is a native scroll-snap container, so it scrolls by touch, wheel and keyboard without JavaScript; the hook adds previous/next buttons, dot tabs, wrap-around (loop) and autoplay. Autoplay (milliseconds per slide) pauses while hovered or focused, has a visible pause button (WCAG 2.2.2), and never starts for users who prefer reduced motion. The current slide is announced politely on user-driven changes.

Keyboard: Left/Right (or Up/Down) move a slide, Home/End jump, on the track or any control; the dots are a tab list with the same arrow keys.

Attributes

• id (:string) (required)
• label (:string) (required) - accessible name of the carousel.
• per_view (:integer) - slides visible at once. Defaults to 1.
• loop (:boolean) - Defaults to false.
• autoplay (:integer) - milliseconds per slide; nil disables. Defaults to nil.
• dots (:boolean) - Defaults to true.
• controls (:boolean) - previous/next buttons. Defaults to true.
• style (:string) - Defaults to nil.
• class (:any) - Defaults to nil.
• Global attributes are accepted.

Slots

• slide (required) - Accepts attributes:
  • label (:string) - accessible name; defaults to "n of m".