# AppSwiper Wrapper

Use this layer for all in-app carousel/slider behavior.

## Components

- `useAppSwiper`: shared carousel state and controls (`activeIndex`, `next`, `prev`, `goTo`, autoplay controls).
- `AppSwiper`: centralized Swiper setup (A11y, Keyboard, Autoplay, EffectCreative defaults).
- `AppSwiperSlide`: slide component export from wrapper.
- `CarouselControls`: reusable arrows + dots UI.

## Rules

- Do not import from `swiper/react`, `swiper/modules`, or `@/hooks/useCarousel` outside `src/components/swiper`.
- Keep domain-specific slide markup in feature components; keep shared slider logic in wrapper files.
- For new carousels, prefer:

```tsx
const controller = useAppSwiper({ slideCount: items.length });

<AppSwiper slideCount={items.length} controller={controller}>
  {items.map((item) => (
    <AppSwiperSlide key={item.id}>...</AppSwiperSlide>
  ))}
</AppSwiper>;
```