# MotionRail

> A lightweight, smooth carousel library with momentum-based scrolling

## Overview

MotionRail is a modern carousel library built with CSS Grid and vanilla JavaScript. It provides momentum-based scrolling, snap alignment, responsive breakpoints, and first-class framework integrations.

- Repository: https://github.com/juji/motionrail
- Documentation: https://motionrail.jujiplay.com
- License: MIT

## Documentation Structure

### Getting Started
- **[installation.txt](./installation.txt)** - Installation
- **[quick-start.txt](./quick-start.txt)** - Quick Start

### Core Concepts
- **[configuration.txt](./configuration.txt)** - Configuration
- **[ssr-configuration.txt](./ssr-configuration.txt)** - SSR & FOUC-Free Styling
- **[breakpoints.txt](./breakpoints.txt)** - Breakpoints
- **[rtl.txt](./rtl.txt)** - RTL Support
- **[api.txt](./api.txt)** - API Methods

### Framework Integrations
- **[frameworks-react.txt](./frameworks-react.txt)** - React
- **[frameworks-preact.txt](./frameworks-preact.txt)** - Preact
- **[frameworks-solid.txt](./frameworks-solid.txt)** - Solid.js
- **[frameworks-vue.txt](./frameworks-vue.txt)** - Vue
- **[frameworks-svelte.txt](./frameworks-svelte.txt)** - Svelte
- **[frameworks-qwik.txt](./frameworks-qwik.txt)** - Qwik

### Extensions
- **[extensions-index.txt](./extensions-index.txt)** - Overview
- **[extensions-arrows.txt](./extensions-arrows.txt)** - Arrows
- **[extensions-dots.txt](./extensions-dots.txt)** - Dots
- **[extensions-thumbnails.txt](./extensions-thumbnails.txt)** - Thumbnails
- **[extensions-vistaview.txt](./extensions-vistaview.txt)** - VistaView
- **[extensions-logger.txt](./extensions-logger.txt)** - Logger
- **[extensions-custom.txt](./extensions-custom.txt)** - Creating Extensions

### API
- **[api-class-motionrail.txt](./api-class-motionrail.txt)** - MotionRail
- **[api-types-motionrail-options.txt](./api-types-motionrail-options.txt)** - MotionRailOptions
- **[api-types-motionrail-state.txt](./api-types-motionrail-state.txt)** - MotionRailState
- **[api-types-motionrail-breakpoint.txt](./api-types-motionrail-breakpoint.txt)** - MotionRailBreakpoint
- **[api-types-motionrail-extension.txt](./api-types-motionrail-extension.txt)** - MotionRailExtension

### AI Integration
- **[-llms.txt.txt](./-llms.txt.txt)** - llms.txt
- **[-llms-full.txt.txt](./-llms-full.txt.txt)** - llms-full.txt
- **[ai-mcp-readiness.txt](./ai-mcp-readiness.txt)** - MCP Readiness
- **[ai-markdown-for-agents.txt](./ai-markdown-for-agents.txt)** - Markdown for Agents

## Key Features

- Momentum-based scrolling with natural drag physics
- Responsive breakpoints for different screen sizes
- Automatic snap-to-item positioning
- Optional autoplay with pause on interaction
- Built-in RTL layout support
- CSS Grid-based modern layout
- Zero dependencies, minimal bundle size
- Full control API for programmatic navigation
- Modular extension system
- Framework integrations for React, Preact, Solid, Vue, Svelte, and Qwik

## Quick Example

```javascript
import MotionRail from 'motionrail';

const carousel = new MotionRail('.carousel', {
  columns: 3,
  gap: 16,
  snap: true
});
```

## Contact & Support

- Issues: https://github.com/juji/motionrail/issues
- Discussions: https://github.com/juji/motionrail/discussions