# Onboarding (onboarding)

> Module onboarding : Pages d'accueil au premier lancement (icône, titre, texte), affichées une fois.

Pages d'accueil au premier lancement (icône, titre, texte), affichées une fois.

:::note[Page générée]
Générée depuis `modules/onboarding/README.md`, `module.json`, `config.ts`, `index.ts` à chaque build du site : modifier la source, pas cette page.
:::

## Fiche technique

| | |
|---|---|
| Paquet | `@daroms/module-onboarding` |
| Activer | `bun daroms module add onboarding` |
| Requiert | aucun module |
| Dépendances natives | aucune |
| Routes ajoutées | `app/onboarding.tsx` (`OnboardingScreen`) |
| Onglets | aucun |
| Migrations | aucune |
| Edge functions | aucune |
| Variables d'environnement | aucune |
| Gate de navigation | oui (décide de la redirection au démarrage) |
| Section de réglages | non |

## Mise en place et usage

Pages d'accueil au premier lancement, affichées une seule fois par `version`.

- Activer : `bun daroms module add onboarding` (route `app/onboarding.tsx`).
- Textes : ajouter les clés `onboarding.page1Title`... dans `locales/*.json` de l'app (namespace app).
- Config : `pages` (icône Lucide + clés), `version` (incrémenter pour réafficher).

## Configuration

Dans `app.manifest.ts > modules['onboarding']`, validée par `modules/onboarding/config.ts` au démarrage.

| Clé | Schéma zod | Rôle |
|---|---|---|
| `version` | `z.number().int().positive().default(1)` | Incrémenter pour réafficher l'onboarding après une refonte. |
| `pages` | `z.array(z.object({ icon: z.string(), titleKey: z.string(), descriptionKey: z.string() })).min(1).default([{ icon: 'Sparkles', titleKey: 'onboarding.page1Title', descriptionKey: 'onboarding.page1Description' }])` | Pages : icône Lucide + clés i18n du namespace app (locales/*.json). |

Valeurs écrites par `module add` :

```json
{
  "version": 1,
  "pages": [
    {
      "icon": "Sparkles",
      "titleKey": "onboarding.page1Title",
      "descriptionKey": "onboarding.page1Description"
    },
    {
      "icon": "Zap",
      "titleKey": "onboarding.page2Title",
      "descriptionKey": "onboarding.page2Description"
    },
    {
      "icon": "Heart",
      "titleKey": "onboarding.page3Title",
      "descriptionKey": "onboarding.page3Description"
    }
  ]
}
```

## Exports

```ts
import { OnboardingScreen, markOnboardingDone, useOnboardingDone } from '@daroms/module-onboarding'
```

- Valeurs : `OnboardingScreen`, `markOnboardingDone`, `useOnboardingDone`

---

Page HTML : https://daromsartof.github.io/daroms-speedapp/reference/modules/onboarding/
Index de la documentation : https://daromsartof.github.io/daroms-speedapp/llms.txt