React
Quiz
Render a quiz generated by createQuiz.
Renders a multiple-choice quiz from createQuiz().
Usage
import { Quiz } from "@edu-sdk/react";
import "@edu-sdk/react/styles.css";
<Quiz questions={quiz} />Props
type QuizProps = {
questions: QuizQuestion[];
className?: string;
classNames?: QuizClassNames;
};classNames
| Key | Part |
|---|---|
root | Root container |
progress | Question index |
question | Question text |
options | Options list |
option | Each option button |
selectedOption | Selected option |
correctOption | Correct option after submit |
incorrectOption | Incorrect selected option |
feedback | Correct / incorrect message |
result | Final score |
controls | Button row |
previousButton | Previous button |
nextButton | Next button |
submitButton | Submit button |
Example
<Quiz
questions={quiz}
className="my-quiz"
classNames={{
question: "my-question",
correctOption: "my-correct-answer"
}}
/>See Styling for styles.css and CSS variables.