> ## Documentation Index
> Fetch the complete documentation index at: https://docs.vibely.sh/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# What's in the box

> The stack and starter setup every Vibely mobile app ships with.

Every mobile app starts from a working Expo project. Metro is already running, the web preview iframe is live, and Expo Go can scan the QR the moment your project page loads.

This page is the inventory of what's preinstalled, so you know what you can take for granted.

## The stack

| Layer       | Choice                                                                 |
| ----------- | ---------------------------------------------------------------------- |
| Framework   | Expo SDK 54 + React 19 + React Native 0.81                             |
| Routing     | Expo Router 6 (file-based; `app/_layout.tsx` is the root)              |
| Styling     | NativeWind 4 (Tailwind v3 syntax for RN) + `clsx` + `tailwind-merge`   |
| Icons       | `lucide-react-native`                                                  |
| Storage     | `@react-native-async-storage/async-storage`                            |
| Animation   | `react-native-reanimated` + `react-native-gesture-handler`             |
| Haptics     | `expo-haptics`                                                         |
| Web preview | `react-native-web` so the dashboard's Android DeviceFrame iframe works |

Everything in this table ships preinstalled. Other common picks (TanStack Query, Zustand, React Hook Form + Zod, Supabase, `expo-secure-store`, image picker, push, camera, charts) are **not** preinstalled — the agent adds them on demand via `add_dependency`, which under the hood runs `npx expo install` so versions stay pinned to SDK 54.

## What lands automatically

* File-based routes under `app/` (Expo Router) with a starter `(tabs)` layout
* `app/_layout.tsx` with the `lib/mana-preview-bridge` side-effect import that lets the dashboard's Android DeviceFrame back button drive the iframe — **do not delete this import**
* NativeWind set up so Tailwind utility classes work on every RN component
* Reanimated + Gesture Handler preinitialised so animations and gestures work without extra setup
* TypeScript, `lib/*` helpers at the project root (no `src/` directory)

## What gets added on demand

The agent adds anything else you need (resolved via `add_dependency`, which routes to `npx expo install` for SDK-pinned versions):

* **Backend** — `@supabase/supabase-js` whenever the prompt mentions auth, database, or storage
* **State / data** — `@tanstack/react-query`, `zustand`
* **Forms** — `react-hook-form` + `zod` + `@hookform/resolvers`
* **Secure storage** — `expo-secure-store` for tokens; `react-native-mmkv` for hot read paths
* **Native modules** — `expo-camera`, `expo-image-picker`, `expo-location`, `expo-notifications`, `expo-local-authentication`
* **Visual extras** — `expo-blur`, `expo-linear-gradient`, `lottie-react-native`
* **Maps** — `react-native-maps`

Ask for a feature; the dependencies follow.

## Why pre-installed matters

Three things you get for free:

1. **Metro is up before you finish typing your prompt.** No `npm install` between you and a preview.
2. **Expo Go scans into a running app.** The QR code is live the moment the project loads — not after a minute of build setup.
3. **Smaller, faster prompts.** The agent doesn't waste turns regenerating React Native boilerplate (entry point, navigators, providers). It writes only what varies.
