Modèle de Questionnaire d'Archétype

Le composant ArchetypeQuiz permet de créer des questionnaires où les réponses mappent à des « types » ou archétypes. Le résultat final est déterminé par l’archétype qui reçoit le plus de votes.

Utilisation

Pour créer un nouveau questionnaire d’archétype, créez un fichier markdown (ex. docs/fr/quizzes/mon-nouveau-quiz.md) et utilisez le composant ainsi :

<ArchetypeQuiz 
  :questions="questions" 
  :archetypes="archetypes" 
  emailEndpoint="/.netlify/functions/record-quiz"
  quizName="Mon nouveau quiz"
>
  <template #intro>
    <div class="intro-content">
      <h1>Découvrez Votre Type</h1>
      <p>Répondez pour découvrir votre archétype.</p>
    </div>
  </template>
</ArchetypeQuiz>

<script setup>
const questions = [
  {
    id: 'q1',
    prompt: 'Quelle est votre couleur préférée ?',
    options: [
      { value: 'red', label: 'Rouge' },
      { value: 'blue', label: 'Bleu' }
    ]
  }
];

const archetypes = {
  red: {
    title: 'Archétype Rouge',
    description: 'Passionné et énergique.',
    action: 'Canalisez votre énergie dans l’action.'
  },
  blue: {
    title: 'Archétype Bleu',
    description: 'Calme et analytique.',
    action: 'Utilisez votre analyse pour résoudre les problèmes.'
  }
};
</script>

Props

Prop	Type	Obligatoire	Description
questions	Array	Oui	Tableau d’objets question.
archetypes	Object	Oui	Dictionnaire des définitions d’archétypes.
emailEndpoint	String	Non	URL pour envoyer les résultats par POST.
quizName	String	Non	Nom du quiz pour le suivi.

Structures de données

Objet Question

{
  id: 'unique_id',
  prompt: 'Texte de question',
  options: [
    { value: 'archetype_key', label: 'Texte de l’option' }
  ]
}

Objet Archétype

{
  title: 'Titre affiché',
  description: 'Description détaillée de l’archétype.',
  action: 'Prochaine action recommandée.'
}