Quiz

npx shadcn@latest add https://lmscn.vercel.app/r/quiz.json

npx shadcn@latest add button card progress badge

import { Quiz } from "@/components/lms/quiz"
import type { QuizData, QuizResult } from "@/components/lms/quiz"

const data: QuizData = {
  title: "JavaScript Basics",
  description: "Test your knowledge of JS fundamentals.",
  passingScore: 80,
  showExplanations: true,
  questions: [
    {
      id: "q1",
      type: "single",
      question: "What does `typeof null` return?",
      options: [
        { id: "a", label: "null" },
        { id: "b", label: "object", explanation: "A historical quirk in the JS spec." },
        { id: "c", label: "undefined" },
      ],
      correctIds: ["b"],
      hint: "It's a well-known JavaScript oddity.",
    },
    {
      id: "q2",
      type: "multiple",
      question: "Which are falsy values in JavaScript?",
      options: [
        { id: "a", label: "0" },
        { id: "b", label: '""' },
        { id: "c", label: '"false"' },
        { id: "d", label: "null" },
      ],
      correctIds: ["a", "b", "d"],
      points: 2,
    },
  ],
}

export function MyQuiz() {
  return (
    <Quiz
      quizData={data}
      onComplete={(result: QuizResult) => {
        console.log(`${result.percentage}% — ${result.passed ? "Passed" : "Failed"}`)
      }}
    />
  )
}