<!-- source-hash: 0335dfc7cb18e8aa8ef0306a01f8ca93 -->
A React carousel component built on top of Embla Carousel that provides a flexible, accessible carousel with navigation controls and keyboard support. The component uses React Context to manage carousel state and provides composable parts for building custom carousels.

## Key Components

- **Carousel** - Main wrapper component that provides carousel context and handles keyboard navigation
- **CarouselContent** - Container for carousel slides with overflow handling
- **CarouselItem** - Individual slide wrapper with proper ARIA attributes
- **CarouselPrevious/CarouselNext** - Navigation button components with automatic disable states
- **useCarousel** - Hook for accessing carousel context (scrolling functions, state, etc.)
- **CarouselApi** - Type for the underlying Embla carousel API instance

## Usage Example

```typescript
import {
  Carousel,
  CarouselContent,
  CarouselItem,
  CarouselPrevious,
  CarouselNext,
} from "./carousel"

function MyCarousel() {
  return (
    <Carousel className="w-full max-w-xs">
      <CarouselContent>
        <CarouselItem>
          <div className="p-1">
            <div className="flex aspect-square items-center justify-center p-6">
              <span className="text-4xl font-semibold">1</span>
            </div>
          </div>
        </CarouselItem>
        <CarouselItem>
          <div className="p-1">
            <div className="flex aspect-square items-center justify-center p-6">
              <span className="text-4xl font-semibold">2</span>
            </div>
          </div>
        </CarouselItem>
      </CarouselContent>
      <CarouselPrevious />
      <CarouselNext />
    </Carousel>
  )
}
```

The component supports both horizontal and vertical orientations, custom Embla options, plugins, and provides full keyboard accessibility with arrow key navigation.