Preview live, install via shadcn or copy the source.
| Name | Type | Default | Required | Description |
|---|---|---|---|---|
| images | string[] | — | Yes | Array of image URLs placed around the rolling band (side of wheel laid flat, viewed from side – images curve at left/right edges via Three.js cylinder). Auto-repeats to fill if <10. |
| title | React.ReactNode | — | No | Optional header above wheel. |
| speed | number | 18 | No | Seconds per full 360° rotation. |
| direction | "clockwise" | "counterClockwise" | clockwise | No | Rotation direction (around vertical Y axis). |
| scale | number | 1 | No | Overall scale multiplier (0.5–2). Scales radius and thickness. |
| radius | string | number | 13.5em | No | Wheel radius – CSS string e.g. "13.5em" or world units e.g. 3.1. Drum radius laid flat. |
| thickness | string | number | — | No | Wheel thickness (height of band). CSS string or world units. If omitted, auto-derived from arc length to keep 4/3 image aspect. |
| wheelSize | string | number | — | No | Diameter override – radius = wheelSize/2. |
| stageHeight | string | 36em | No | Height of Three.js stage container. |
| gap | string | number | 2px | No | Tiny gap between images along circumference. CSS "2px" or radians/linear world gap. Mapped to angular gap = gap / radius. |
| pauseOnHover | boolean | false | No | Pause auto-rotation on hover. |
| mouseControl | boolean | true | No | Drag / swipe to spin with momentum (radians per pixel). Does NOT block page scroll. |
| dragSensitivity | number | 0.012 | No | Radians per pixel dragged (≈0.5°). Values >0.1 auto-converted from degrees to radians. |
| speedOnScroll | boolean | true | No | Accelerate on page scroll (observes window scroll, never prevents it). |
| scrollAcceleration | number | 2.6 | No | Multiplier while scrolling. |
| scrollResetDelay | number | 180 | No | Ms after last scroll before reverting. |
| speedingCurvature | boolean | false | No | When true, the entire cylindrical band bulges outward (barrel) proportionally to current speed (scroll/drag boost). Creates speed-dependent curvature. |
| speedingCurvatureAmount | number | 0.14 | No | Max outward bulge as fraction of radius when at max scroll boost (0.14 ≈ 14% radius). |
| wrapperClassName | string | — | No | Class for title wrapper. |
| className | string | — | No | Wrapper class. |