[V0_FILE]plaintext:file=".gitignore" # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. # dependencies /node_modules # next.js /.next/ /out/ # production /build # debug npm-debug.log* yarn-debug.log* yarn-error.log* .pnpm-debug.log* # env files .env* # vercel .vercel # typescript *.tsbuildinfo next-env.d.ts [V0_FILE]markdown:file="README.md" # Latex to text converter *Automatically synced with your [v0.app](https://v0.app) deployments* [![Deployed on Vercel](https://img.shields.io/badge/Deployed%20on-Vercel-black?style=for-the-badge&logo=vercel)](https://vercel.com/orcalexais-projects/v0-latex-to-text-converter) [![Built with v0](https://img.shields.io/badge/Built%20with-v0.app-black?style=for-the-badge)](https://v0.app/chat/r38hw8fBOI1) ## Overview This repository will stay in sync with your deployed chats on [v0.app](https://v0.app). Any changes you make to your deployed app will be automatically pushed to this repository from [v0.app](https://v0.app). ## Deployment Your project is live at: **[https://vercel.com/orcalexais-projects/v0-latex-to-text-converter](https://vercel.com/orcalexais-projects/v0-latex-to-text-converter)** ## Build your app Continue building your app on: **[https://v0.app/chat/r38hw8fBOI1](https://v0.app/chat/r38hw8fBOI1)** ## How It Works 1. Create and modify your project using [v0.app](https://v0.app) 2. Deploy your chats from the v0 interface 3. Changes are automatically pushed to this repository 4. Vercel deploys the latest version from this repository [V0_FILE]css:file="app/globals.css" @import "tailwindcss"; @import "tw-animate-css"; @import "katex/dist/katex.min.css"; @custom-variant dark (&:is(.dark *)); :root { --background: oklch(1 0 0); --foreground: oklch(0.145 0 0); --card: oklch(1 0 0); --card-foreground: oklch(0.145 0 0); --popover: oklch(1 0 0); --popover-foreground: oklch(0.145 0 0); --primary: oklch(0.205 0 0); --primary-foreground: oklch(0.985 0 0); --secondary: oklch(0.97 0 0); --secondary-foreground: oklch(0.205 0 0); --muted: oklch(0.97 0 0); --muted-foreground: oklch(0.556 0 0); --accent: oklch(0.97 0 0); --accent-foreground: oklch(0.205 0 0); --destructive: oklch(0.577 0.245 27.325); --destructive-foreground: oklch(0.577 0.245 27.325); --border: oklch(0.922 0 0); --input: oklch(0.922 0 0); --ring: oklch(0.708 0 0); --chart-1: oklch(0.646 0.222 41.116); --chart-2: oklch(0.6 0.118 184.704); --chart-3: oklch(0.398 0.07 227.392); --chart-4: oklch(0.828 0.189 84.429); --chart-5: oklch(0.769 0.188 70.08); --radius: 0.625rem; --sidebar: oklch(0.985 0 0); --sidebar-foreground: oklch(0.145 0 0); --sidebar-primary: oklch(0.205 0 0); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.97 0 0); --sidebar-accent-foreground: oklch(0.205 0 0); --sidebar-border: oklch(0.922 0 0); --sidebar-ring: oklch(0.708 0 0); } .dark { --background: oklch(0.145 0 0); --foreground: oklch(0.985 0 0); --card: oklch(0.145 0 0); --card-foreground: oklch(0.985 0 0); --popover: oklch(0.145 0 0); --popover-foreground: oklch(0.985 0 0); --primary: oklch(0.985 0 0); --primary-foreground: oklch(0.205 0 0); --secondary: oklch(0.269 0 0); --secondary-foreground: oklch(0.985 0 0); --muted: oklch(0.269 0 0); --muted-foreground: oklch(0.708 0 0); --accent: oklch(0.269 0 0); --accent-foreground: oklch(0.985 0 0); --destructive: oklch(0.396 0.141 25.723); --destructive-foreground: oklch(0.637 0.237 25.331); --border: oklch(0.269 0 0); --input: oklch(0.269 0 0); --ring: oklch(0.439 0 0); --chart-1: oklch(0.488 0.243 264.376); --chart-2: oklch(0.696 0.17 162.48); --chart-3: oklch(0.769 0.188 70.08); --chart-4: oklch(0.627 0.265 303.9); --chart-5: oklch(0.645 0.246 16.439); --sidebar: oklch(0.205 0 0); --sidebar-foreground: oklch(0.985 0 0); --sidebar-primary: oklch(0.488 0.243 264.376); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.269 0 0); --sidebar-accent-foreground: oklch(0.985 0 0); --sidebar-border: oklch(0.269 0 0); --sidebar-ring: oklch(0.439 0 0); } @theme inline { --font-sans: var(--font-geist-sans); --font-mono: var(--font-geist-mono); --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); } @layer base { * { @apply border-border outline-ring/50; } body { @apply bg-background text-foreground; } } /* Add a soft, token-based gradient utility for the hero backdrop */ .bg-soft-gradient { background: radial-gradient( 900px 600px at 10% -10%, color-mix(in oklch, var(--color-primary) 14%, transparent), transparent 60% ), radial-gradient(900px 600px at 110% 0%, color-mix(in oklch, var(--color-accent) 12%, transparent), transparent 55%), linear-gradient(180deg, color-mix(in oklch, var(--color-card) 94%, transparent), var(--color-card)); } [V0_FILE]typescriptreact:file="app/layout.tsx" import type { Metadata } from 'next' import { Geist, Geist_Mono } from 'next/font/google' import { Analytics } from '@vercel/analytics/next' import './globals.css' const _geist = Geist({ subsets: ["latin"] }); const _geistMono = Geist_Mono({ subsets: ["latin"] }); export const metadata: Metadata = { title: 'v0 App', description: 'Created with v0', generator: 'v0.app', icons: { icon: '/icon.svg', }, } export default function RootLayout({ children, }: Readonly<{ children: React.ReactNode }>) { return ( {children} ) } [V0_FILE]typescriptreact:file="app/page.tsx" "use client" import { useMemo, useState } from "react" import MarkdownWithMath from "@/components/markdown-with-math" import { markdownToPlain } from "@/lib/markdown-to-plain" import { Button } from "@/components/ui/button" import { Card, CardContent, CardHeader, CardTitle, CardDescription } from "@/components/ui/card" import { Input } from "@/components/ui/input" import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select" import QuestionsList from "@/components/questions-list" import { parseCsvFile, parseCsvText, type QuestionRow } from "@/lib/parse-questions" import { cn } from "@/lib/utils" const SAMPLE = `# LaTeX + Markdown Preview Inline math like $a^2 + b^2 = c^2$ and block math: $$ \\int_0^{\\infty} e^{-x^2} \\, dx = \\frac{\\sqrt{\\pi}}{2} $$ - Supports **bold**, _italics_, and tables: | Symbol | Meaning | |-------:|----------------| | $\\alpha$ | Alpha letter | | $\\sum$ | Summation sign | > Tip: Edit the text above to see changes below. Code: \`\`\`ts const area = (r: number) => Math.PI * r ** 2 \`\`\` ` export default function Page() { const [content, setContent] = useState(SAMPLE) const [plainText, setPlainText] = useState("") const [rows, setRows] = useState([]) const [q, setQ] = useState("") const [typedFilter, setTypedFilter] = useState<"all" | "Exercise" | "Solved">("all") const [parsing, setParsing] = useState(false) const [parseError, setParseError] = useState(null) useMemo(() => { // Fire and forget; update when content changes markdownToPlain(content).then(setPlainText) }, [content]) const filteredRows = useMemo(() => { const t = q.toLowerCase().trim() return rows.filter((r) => { const typedOk = typedFilter === "all" ? true : (r.typed || "").toLowerCase() === typedFilter.toLowerCase() const queryOk = !t ? true : [r.question, r.class_code, r.subject_code, r.topic_code, r.sub_topic_code, r.typed] .filter(Boolean) .join(" ") .toLowerCase() .includes(t) return typedOk && queryOk }) }, [rows, q, typedFilter]) async function onFileChange(file?: File | null) { if (!file) return setParsing(true) setParseError(null) try { const parsed = await parseCsvFile(file) setRows(parsed) } catch (err: any) { setParseError(err?.message || "Failed to parse file") } finally { setParsing(false) } } async function loadSample() { setParsing(true) setParseError(null) try { const text = await fetch("/data/sample-questions.tsv").then((r) => r.text()) const parsed = await parseCsvText(text, "\t") setRows(parsed) } catch (err: any) { setParseError(err?.message || "Failed to load sample") } finally { setParsing(false) } } const copy = async (text: string) => { try { await navigator.clipboard.writeText(text) } catch { // no-op } } return (

LaTeX to Text — with Markdown Preview

Type Markdown and LaTeX, preview beautifully with KaTeX, and extract clean plain text below.

{/* Editor */} Editor Write Markdown + LaTeX here Markdown + LaTeX Editor

setContent(e.target.value)}
                className={cn(
                  "w-full resize-y min-h-[180px] md:min-h-[220px] rounded-md",
                  "bg-card text-foreground placeholder:text-muted-foreground/70",
                  "border border-input focus:outline-none focus:ring-2 focus:ring-ring/60",
                  "p-4 leading-relaxed font-mono text-sm",
                )}
                placeholder="Type your Markdown + LaTeX here..."
                aria-label="Markdown and LaTeX input"
              />
              <div className="mt-3 flex flex-wrap gap-2">
                <Button
                  variant="secondary"
                  onClick={() => setContent((prev) => prev + "\n\n" + "$$\\frac{-b \\pm \\sqrt{b^2-4ac}}{2a}$$")}
                >
                  Insert Quadratic Formula
                </Button>
                <Button
                  variant="secondary"
                  onClick={() => setContent((prev) => prev + "\n\n" + "`E = mc^2` and $F = ma$")}
                >
                  Insert Physics
                </Button>
                <Button variant="default" onClick={() => copy(content)}>
                  Copy Input
                </Button>
              </div>
            </CardContent>
          </Card>

<Card className="mb-6 border-border/60 shadow-sm backdrop-blur supports-[backdrop-filter]:bg-card/80">
            <CardHeader>
              <CardTitle className="text-xl">Upload Questions (CSV / TSV)</CardTitle>
              <CardDescription>We autodetect comma or tab separated. Headers recommended.</CardDescription>
            </CardHeader>
            <CardContent className="space-y-3">
              <div className="flex flex-col md:flex-row md:items-center gap-3">
                <div className="flex-1">
                  <label htmlFor="csv-upload" className="sr-only">
                    Upload CSV or TSV file
                  </label>
                  <Input
                    id="csv-upload"
                    type="file"
                    accept=".csv,.tsv,text/csv,text/tab-separated-values"
                    onChange={(e) => onFileChange(e.target.files?.[0])}
                  />
                </div>
                <div className="flex gap-2">
                  <Button variant="secondary" onClick={loadSample} disabled={parsing}>
                    {parsing ? "Loading..." : "Load Sample Data"}
                  </Button>
                  <Button variant="outline" onClick={() => setRows([])} disabled={parsing || rows.length === 0}>
                    Clear
                  </Button>
                </div>
              </div>

<div className="flex flex-col md:flex-row md:items-center gap-3">
                <div className="flex-1">
                  <Input
                    value={q}
                    onChange={(e) => setQ(e.target.value)}
                    placeholder="Search questions or metadata…"
                    aria-label="Search questions"
                  />
                </div>
                <div className="w-full md:w-56">
                  <Select value={typedFilter} onValueChange={(v: any) => setTypedFilter(v)}>
                    <SelectTrigger aria-label="Filter by type">
                      <SelectValue placeholder="Filter by type" />
                    </SelectTrigger>
                    <SelectContent>
                      <SelectItem value="all">All types</SelectItem>
                      <SelectItem value="Exercise">Exercise</SelectItem>
                      <SelectItem value="Solved">Solved</SelectItem>
                    </SelectContent>
                  </Select>
                </div>
              </div>

<div className="text-sm text-muted-foreground">
                {parseError ? (
                  <span className="text-destructive-foreground">Error: {parseError}</span>
                ) : (
                  <span>
                    Loaded <strong className="text-foreground">{rows.length}</strong> row{rows.length === 1 ? "" : "s"}.
                    Showing <strong className="text-foreground">{filteredRows.length}</strong>.
                  </span>
                )}
              </div>
            </CardContent>
          </Card>

{/* Outputs */}
          <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
            <Card className="border-border/60 shadow-sm backdrop-blur supports-[backdrop-filter]:bg-card/80">
              <CardHeader className="flex-row items-center justify-between space-y-0">
                <div>
                  <CardTitle className="text-xl">Rendered Preview</CardTitle>
                  <CardDescription>Math via KaTeX + GFM</CardDescription>
                </div>
                <Button variant="outline" onClick={() => copy(content)}>
                  Copy Source
                </Button>
              </CardHeader>
              <CardContent>
                <MarkdownWithMath content={content} />
              </CardContent>
            </Card>

<Card className="border-border/60 shadow-sm backdrop-blur supports-[backdrop-filter]:bg-card/80">
              <CardHeader className="flex-row items-center justify-between space-y-0">
                <div>
                  <CardTitle className="text-xl">Plain Text</CardTitle>
                  <CardDescription>Markdown + LaTeX stripped</CardDescription>
                </div>
                <Button variant="outline" onClick={() => copy(plainText)}>
                  Copy Text
                </Button>
              </CardHeader>
              <CardContent>
                <pre className="whitespace-pre-wrap leading-relaxed text-sm">{plainText || "…"}</pre>
              </CardContent>
            </Card>
          </div>

<Card className="mt-6 border-border/60 shadow-sm backdrop-blur supports-[backdrop-filter]:bg-card/80">
            <CardHeader>
              <CardTitle className="text-xl">Questions</CardTitle>
              <CardDescription>Rendered with LaTeX support via KaTeX</CardDescription>
            </CardHeader>
            <CardContent>
              <QuestionsList rows={filteredRows} />
            </CardContent>
          </Card>
        </div>
      </section>
    </main>
  )
}
[V0_FILE]json:file="components.json"
{
  "$schema": "https://ui.shadcn.com/schema.json",
  "style": "new-york",
  "rsc": true,
  "tsx": true,
  "tailwind": {
    "config": "",
    "css": "app/globals.css",
    "baseColor": "neutral",
    "cssVariables": true,
    "prefix": ""
  },
  "aliases": {
    "components": "@/components",
    "utils": "@/lib/utils",
    "ui": "@/components/ui",
    "lib": "@/lib",
    "hooks": "@/hooks"
  },
  "iconLibrary": "lucide"
}
[V0_FILE]typescriptreact:file="components/markdown-with-math.tsx"
"use client"
import ReactMarkdown from "react-markdown"
import remarkMath from "remark-math"
import rehypeKatex from "rehype-katex"
import remarkGfm from "remark-gfm"

type Props = {
  content: string
  className?: string
}

export default function MarkdownWithMath({ content, className }: Props) {
  return (
    <div className={className}>
      <ReactMarkdown
        remarkPlugins={[remarkMath, remarkGfm]}
        rehypePlugins={[rehypeKatex]}
        components={{
          h1: (props) => <h1 className="text-2xl md:text-3xl font-semibold mb-4 text-pretty" {...props} />,
          h2: (props) => <h2 className="text-xl md:text-2xl font-semibold mb-3 text-pretty" {...props} />,
          h3: (props) => <h3 className="text-lg md:text-xl font-semibold mb-2 text-pretty" {...props} />,
          p: (props) => <p className="leading-relaxed mb-3" {...props} />,
          ul: (props) => <ul className="list-disc ps-5 space-y-1 mb-3" {...props} />,
          ol: (props) => <ol className="list-decimal ps-5 space-y-1 mb-3" {...props} />,
          code: ({ inline, className, children, ...rest }) =>
            inline ? (
              <code className="rounded bg-muted px-1 py-0.5 font-mono text-sm" {...rest}>
                {children}
              </code>
            ) : (
              <pre className="overflow-x-auto rounded-md bg-muted p-4 text-sm">
                <code className="font-mono">{children}</code>
              </pre>
            ),
          table: (props) => <table className="w-full text-left border-collapse mb-3" {...props} />,
          th: (props) => <th className="border-b border-border p-2 font-medium" {...props} />,
          td: (props) => <td className="border-b border-border p-2 align-top" {...props} />,
          a: (props) => <a className="underline decoration-dotted underline-offset-2 hover:text-primary" {...props} />,
        }}
      >
        {content}
      </ReactMarkdown>
    </div>
  )
}
[V0_FILE]typescriptreact:file="components/questions-list.tsx"
"use client"

import { useState, useMemo } from "react"
import MarkdownWithMath from "@/components/markdown-with-math"
import { Badge } from "@/components/ui/badge"
import { Button } from "@/components/ui/button"
import { parseSolutionSteps } from "@/lib/parse-solutions"
import { parseConcepts } from "@/lib/parse-concepts"

type Row = {
  class_code?: string
  subject_code?: string
  topic_code?: string
  sub_topic_code?: string
  question?: string
  question_image?: string
  typed?: string
  context?: string
  step_by_step_solution?: string
  concepts?: string
}

const ITEMS_PER_PAGE = 150

export default function QuestionsList({ rows }: { rows: Row[] }) {
  const [currentPage, setCurrentPage] = useState(1)

const totalPages = useMemo(() => Math.ceil(rows.length / ITEMS_PER_PAGE), [rows.length])

const paginatedRows = useMemo(() => {
    const startIdx = (currentPage - 1) * ITEMS_PER_PAGE
    const endIdx = startIdx + ITEMS_PER_PAGE
    return rows.slice(startIdx, endIdx)
  }, [rows, currentPage])

if (!rows?.length) {
    return (
      <p className="text-sm text-muted-foreground">
        Upload a CSV/TSV to see questions here. You can also try the sample data.
      </p>
    )
  }

return (
    <div className="space-y-6">
      <ul className="space-y-6">
      {paginatedRows.map((r, idx) => {
        const meta = [
          r.class_code ? `Class ${r.class_code}` : "",
          r.subject_code ? `Subject ${r.subject_code}` : "",
          r.topic_code ? `Topic ${r.topic_code}` : "",
          r.sub_topic_code ? `Sub-topic ${r.sub_topic_code}` : "",
        ]
          .filter(Boolean)
          .join(" · ")

const steps = parseSolutionSteps(r.step_by_step_solution || "")
        const concepts = parseConcepts(r.concepts || "")

return (
          <li key={idx} className="rounded-lg border border-border/60 p-5 bg-card/80 backdrop-blur space-y-4">
            <div className="flex flex-wrap items-center justify-between gap-2">
              <p className="text-xs text-muted-foreground">{meta || "—"}</p>
              {r.typed ? (
                <Badge variant="secondary" className="text-xs">
                  {r.typed}
                </Badge>
              ) : null}
            </div>

{r.context ? (
              <div className="p-3 rounded-md bg-muted/50 border border-border/40">
                <p className="text-xs font-semibold text-muted-foreground mb-2">Context</p>
                <MarkdownWithMath content={r.context} />
              </div>
            ) : null}

{r.question_image ? (
              <div>
                <img
                  src={r.question_image || "/placeholder.svg"}
                  alt="Question related"
                  className="max-h-64 rounded-md border border-border/50 object-contain"
                  crossOrigin="anonymous"
                />
              </div>
            ) : null}

<div>
              <p className="text-xs font-semibold text-muted-foreground mb-2">Question</p>
              <MarkdownWithMath content={r.question || ""} />
            </div>

{steps.length > 0 ? (
              <div className="p-3 rounded-md bg-blue-50/50 dark:bg-blue-950/20 border border-blue-200/50 dark:border-blue-800/50">
                <p className="text-xs font-semibold text-blue-900 dark:text-blue-200 mb-3">Step-by-Step Solution</p>
                <div className="space-y-3">
                  {steps.map((step, stepIdx) => (
                    <div key={stepIdx} className="flex gap-3">
                      <div className="flex-shrink-0 w-6 h-6 rounded-full bg-blue-200 dark:bg-blue-800 flex items-center justify-center">
                        <span className="text-xs font-semibold text-blue-900 dark:text-blue-200">{stepIdx + 1}</span>
                      </div>
                      <div className="flex-1 pt-0.5">
                        <MarkdownWithMath content={step.content} />
                      </div>
                    </div>
                  ))}
                </div>
              </div>
            ) : null}

{concepts.length > 0 ? (
              <div className="p-3 rounded-md bg-purple-50/50 dark:bg-purple-950/20 border border-purple-200/50 dark:border-purple-800/50">
                <p className="text-xs font-semibold text-purple-900 dark:text-purple-200 mb-3">Concepts</p>
                <div className="space-y-4">
                  {concepts.map((concept, conceptIdx) => (
                    <div key={conceptIdx} className="border-l-2 border-purple-300 dark:border-purple-700 pl-3">
                      {concept.concept && (
                        <p className="text-sm font-semibold text-purple-900 dark:text-purple-200 mb-1">
                          {concept.concept}
                        </p>
                      )}
                      {concept.explanation && (
                        <div className="text-sm text-muted-foreground mb-2">
                          <p className="font-medium text-xs mb-1">Explanation:</p>
                          <MarkdownWithMath content={concept.explanation} />
                        </div>
                      )}
                      {concept.example && (
                        <div className="text-sm text-muted-foreground mb-2">
                          <p className="font-medium text-xs mb-1">Example:</p>
                          <MarkdownWithMath content={concept.example} />
                        </div>
                      )}
                      {concept.application && (
                        <div className="text-sm text-muted-foreground mb-2">
                          <p className="font-medium text-xs mb-1">Application:</p>
                          <MarkdownWithMath content={concept.application} />
                        </div>
                      )}
                    </div>
                  ))}
                </div>
              </div>
            ) : null}
          </li>
        )
      })}
      </ul>

{/* Pagination Controls */}
      {totalPages > 1 && (
        <div className="flex flex-col md:flex-row items-center justify-between gap-4 pt-6 border-t border-border/60">
          <p className="text-sm text-muted-foreground">
            Page <strong className="text-foreground">{currentPage}</strong> of <strong className="text-foreground">{totalPages}</strong> · Showing <strong className="text-foreground">{paginatedRows.length}</strong> of <strong className="text-foreground">{rows.length}</strong> questions
          </p>
          
          <div className="flex items-center gap-2 flex-wrap justify-center md:justify-end">
            <Button
              variant="outline"
              size="sm"
              onClick={() => setCurrentPage((p) => Math.max(1, p - 1))}
              disabled={currentPage === 1}
              aria-label="Previous page"
            >
              Previous
            </Button>

<div className="flex gap-1">
              {Array.from({ length: totalPages }, (_, i) => i + 1)
                .filter((page) => {
                  // Show first page, last page, current page, and neighbors
                  if (page === 1 || page === totalPages) return true
                  if (Math.abs(page - currentPage) <= 1) return true
                  return false
                })
                .map((page, idx, arr) => (
                  <div key={page}>
                    {idx > 0 && arr[idx - 1] !== page - 1 && (
                      <span className="px-1 text-muted-foreground">…</span>
                    )}
                    <Button
                      variant={currentPage === page ? "default" : "outline"}
                      size="sm"
                      onClick={() => setCurrentPage(page)}
                      aria-label={`Go to page ${page}`}
                      aria-current={currentPage === page ? "page" : undefined}
                    >
                      {page}
                    </Button>
                  </div>
                ))}
            </div>

<Button
              variant="outline"
              size="sm"
              onClick={() => setCurrentPage((p) => Math.min(totalPages, p + 1))}
              disabled={currentPage === totalPages}
              aria-label="Next page"
            >
              Next
            </Button>
          </div>
        </div>
      )}
    </div>
  )
}
[V0_FILE]typescriptreact:file="components/theme-provider.tsx"
'use client'

import * as React from 'react'
import {
  ThemeProvider as NextThemesProvider,
  type ThemeProviderProps,
} from 'next-themes'

export function ThemeProvider({ children, ...props }: ThemeProviderProps) {
  return <NextThemesProvider {...props}>{children}</NextThemesProvider>
}
[V0_FILE]typescriptreact:file="components/ui/badge.tsx"
import * as React from 'react'
import { Slot } from '@radix-ui/react-slot'
import { cva, type VariantProps } from 'class-variance-authority'

import { cn } from '@/lib/utils'

const badgeVariants = cva(
  'inline-flex items-center justify-center rounded-md border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden',
  {
    variants: {
      variant: {
        default:
          'border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90',
        secondary:
          'border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90',
        destructive:
          'border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60',
        outline:
          'text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground',
      },
    },
    defaultVariants: {
      variant: 'default',
    },
  },
)

function Badge({
  className,
  variant,
  asChild = false,
  ...props
}: React.ComponentProps<'span'> &
  VariantProps<typeof badgeVariants> & { asChild?: boolean }) {
  const Comp = asChild ? Slot : 'span'

return (
    <Comp
      data-slot="badge"
      className={cn(badgeVariants({ variant }), className)}
      {...props}
    />
  )
}

export { Badge, badgeVariants }
[V0_FILE]typescriptreact:file="components/ui/button.tsx"
import * as React from 'react'
import { Slot } from '@radix-ui/react-slot'
import { cva, type VariantProps } from 'class-variance-authority'

import { cn } from '@/lib/utils'

const buttonVariants = cva(
  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
  {
    variants: {
      variant: {
        default: 'bg-primary text-primary-foreground hover:bg-primary/90',
        destructive:
          'bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60',
        outline:
          'border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50',
        secondary:
          'bg-secondary text-secondary-foreground hover:bg-secondary/80',
        ghost:
          'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',
        link: 'text-primary underline-offset-4 hover:underline',
      },
      size: {
        default: 'h-9 px-4 py-2 has-[>svg]:px-3',
        sm: 'h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5',
        lg: 'h-10 rounded-md px-6 has-[>svg]:px-4',
        icon: 'size-9',
        'icon-sm': 'size-8',
        'icon-lg': 'size-10',
      },
    },
    defaultVariants: {
      variant: 'default',
      size: 'default',
    },
  },
)

function Button({
  className,
  variant,
  size,
  asChild = false,
  ...props
}: React.ComponentProps<'button'> &
  VariantProps<typeof buttonVariants> & {
    asChild?: boolean
  }) {
  const Comp = asChild ? Slot : 'button'

return (
    <Comp
      data-slot="button"
      className={cn(buttonVariants({ variant, size, className }))}
      {...props}
    />
  )
}

export { Button, buttonVariants }
[V0_FILE]typescriptreact:file="components/ui/card.tsx"
import * as React from 'react'

import { cn } from '@/lib/utils'

function Card({ className, ...props }: React.ComponentProps<'div'>) {
  return (
    <div
      data-slot="card"
      className={cn(
        'bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm',
        className,
      )}
      {...props}
    />
  )
}

function CardHeader({ className, ...props }: React.ComponentProps<'div'>) {
  return (
    <div
      data-slot="card-header"
      className={cn(
        '@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-2 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6',
        className,
      )}
      {...props}
    />
  )
}

function CardTitle({ className, ...props }: React.ComponentProps<'div'>) {
  return (
    <div
      data-slot="card-title"
      className={cn('leading-none font-semibold', className)}
      {...props}
    />
  )
}

function CardDescription({ className, ...props }: React.ComponentProps<'div'>) {
  return (
    <div
      data-slot="card-description"
      className={cn('text-muted-foreground text-sm', className)}
      {...props}
    />
  )
}

function CardAction({ className, ...props }: React.ComponentProps<'div'>) {
  return (
    <div
      data-slot="card-action"
      className={cn(
        'col-start-2 row-span-2 row-start-1 self-start justify-self-end',
        className,
      )}
      {...props}
    />
  )
}

function CardContent({ className, ...props }: React.ComponentProps<'div'>) {
  return (
    <div
      data-slot="card-content"
      className={cn('px-6', className)}
      {...props}
    />
  )
}

function CardFooter({ className, ...props }: React.ComponentProps<'div'>) {
  return (
    <div
      data-slot="card-footer"
      className={cn('flex items-center px-6 [.border-t]:pt-6', className)}
      {...props}
    />
  )
}

export {
  Card,
  CardHeader,
  CardFooter,
  CardTitle,
  CardAction,
  CardDescription,
  CardContent,
}
[V0_FILE]typescriptreact:file="components/ui/input.tsx"
import * as React from 'react'

import { cn } from '@/lib/utils'

function Input({ className, type, ...props }: React.ComponentProps<'input'>) {
  return (
    <input
      type={type}
      data-slot="input"
      className={cn(
        'file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
        'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]',
        'aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive',
        className,
      )}
      {...props}
    />
  )
}

export { Input }
[V0_FILE]typescriptreact:file="components/ui/select.tsx"
'use client'

import * as React from 'react'
import * as SelectPrimitive from '@radix-ui/react-select'
import { CheckIcon, ChevronDownIcon, ChevronUpIcon } from 'lucide-react'

import { cn } from '@/lib/utils'

function Select({
  ...props
}: React.ComponentProps<typeof SelectPrimitive.Root>) {
  return <SelectPrimitive.Root data-slot="select" {...props} />
}

function SelectGroup({
  ...props
}: React.ComponentProps<typeof SelectPrimitive.Group>) {
  return <SelectPrimitive.Group data-slot="select-group" {...props} />
}

function SelectValue({
  ...props
}: React.ComponentProps<typeof SelectPrimitive.Value>) {
  return <SelectPrimitive.Value data-slot="select-value" {...props} />
}

function SelectTrigger({
  className,
  size = 'default',
  children,
  ...props
}: React.ComponentProps<typeof SelectPrimitive.Trigger> & {
  size?: 'sm' | 'default'
}) {
  return (
    <SelectPrimitive.Trigger
      data-slot="select-trigger"
      data-size={size}
      className={cn(
        "border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
        className,
      )}
      {...props}
    >
      {children}
      <SelectPrimitive.Icon asChild>
        <ChevronDownIcon className="size-4 opacity-50" />
      </SelectPrimitive.Icon>
    </SelectPrimitive.Trigger>
  )
}

function SelectContent({
  className,
  children,
  position = 'popper',
  ...props
}: React.ComponentProps<typeof SelectPrimitive.Content>) {
  return (
    <SelectPrimitive.Portal>
      <SelectPrimitive.Content
        data-slot="select-content"
        className={cn(
          'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md',
          position === 'popper' &&
            'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1',
          className,
        )}
        position={position}
        {...props}
      >
        <SelectScrollUpButton />
        <SelectPrimitive.Viewport
          className={cn(
            'p-1',
            position === 'popper' &&
              'h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1',
          )}
        >
          {children}
        </SelectPrimitive.Viewport>
        <SelectScrollDownButton />
      </SelectPrimitive.Content>
    </SelectPrimitive.Portal>
  )
}

function SelectLabel({
  className,
  ...props
}: React.ComponentProps<typeof SelectPrimitive.Label>) {
  return (
    <SelectPrimitive.Label
      data-slot="select-label"
      className={cn('text-muted-foreground px-2 py-1.5 text-xs', className)}
      {...props}
    />
  )
}

function SelectItem({
  className,
  children,
  ...props
}: React.ComponentProps<typeof SelectPrimitive.Item>) {
  return (
    <SelectPrimitive.Item
      data-slot="select-item"
      className={cn(
        "focus:bg-accent focus:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
        className,
      )}
      {...props}
    >
      <span className="absolute right-2 flex size-3.5 items-center justify-center">
        <SelectPrimitive.ItemIndicator>
          <CheckIcon className="size-4" />
        </SelectPrimitive.ItemIndicator>
      </span>
      <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
    </SelectPrimitive.Item>
  )
}

function SelectSeparator({
  className,
  ...props
}: React.ComponentProps<typeof SelectPrimitive.Separator>) {
  return (
    <SelectPrimitive.Separator
      data-slot="select-separator"
      className={cn('bg-border pointer-events-none -mx-1 my-1 h-px', className)}
      {...props}
    />
  )
}

function SelectScrollUpButton({
  className,
  ...props
}: React.ComponentProps<typeof SelectPrimitive.ScrollUpButton>) {
  return (
    <SelectPrimitive.ScrollUpButton
      data-slot="select-scroll-up-button"
      className={cn(
        'flex cursor-default items-center justify-center py-1',
        className,
      )}
      {...props}
    >
      <ChevronUpIcon className="size-4" />
    </SelectPrimitive.ScrollUpButton>
  )
}

function SelectScrollDownButton({
  className,
  ...props
}: React.ComponentProps<typeof SelectPrimitive.ScrollDownButton>) {
  return (
    <SelectPrimitive.ScrollDownButton
      data-slot="select-scroll-down-button"
      className={cn(
        'flex cursor-default items-center justify-center py-1',
        className,
      )}
      {...props}
    >
      <ChevronDownIcon className="size-4" />
    </SelectPrimitive.ScrollDownButton>
  )
}

export {
  Select,
  SelectContent,
  SelectGroup,
  SelectItem,
  SelectLabel,
  SelectScrollDownButton,
  SelectScrollUpButton,
  SelectSeparator,
  SelectTrigger,
  SelectValue,
}
[V0_FILE]typescript:file="lib/markdown-to-plain.ts"
import { unified } from "unified"
import remarkParse from "remark-parse"
import remarkGfm from "remark-gfm"
import remarkMath from "remark-math"
import strip from "strip-markdown"

// Create and freeze the processor once
const processor = unified()
  .use(remarkParse)
  .use(remarkGfm)
  .use(remarkMath)
  .use(strip, {
    // keep some whitespace structure
    remove: ["blockquote", "html", "image"],
  })
  .freeze()

export async function markdownToPlain(input: string): Promise<string> {
  // This will strip Markdown formatting while preserving readable text content,
  // including math as inline text where possible.
  const file = await processor.process(input)

// Normalize whitespace a bit for display
  return String(file)
    .replace(/\n{3,}/g, "\n\n")
    .trim()
}
[V0_FILE]typescript:file="lib/parse-concepts.ts"
export type Concept = {
  concept?: string
  chapter?: string
  explanation?: string
  example?: string
  application?: string
}

export function parseConcepts(input: string): Concept[] {
  if (!input) return []
  const trimmed = input.trim()

// Try parsing as JSON array first
  try {
    const parsed = JSON.parse(trimmed)
    if (Array.isArray(parsed)) {
      return parsed.map((item) => {
        if (typeof item === "object" && item !== null) {
          return {
            concept: item.concept || "",
            chapter: item.chapter || "",
            explanation: item.explanation || "",
            example: item.example || "",
            application: item.application || "",
          }
        }
        return { concept: String(item) }
      })
    }
  } catch (e) {
    // Not JSON, treat as plain text
  }

// Fallback: treat as plain text
  return [{ concept: trimmed }]
}
[V0_FILE]typescript:file="lib/parse-questions.ts"
import Papa from "papaparse"

export type QuestionRow = {
  class_code?: string
  subject_code?: string
  topic_code?: string
  sub_topic_code?: string
  question?: string
  question_image?: string
  typed?: string
  context?: string
  step_by_step_solution?: string
  concepts?: string
}

function toStr(v: unknown): string {
  return typeof v === "string" ? v.trim() : v == null ? "" : String(v).trim()
}

function normalizeKeys<T extends Record<string, unknown>>(row: T) {
  const out: Record<string, unknown> = {}
  Object.keys(row).forEach((k) => {
    const nk = k
      .replace(/\s+/g, "_")
      .replace(/[^\w_]/g, "")
      .toLowerCase()
    out[nk] = row[k]
  })
  return out as Record<string, unknown>
}

function processQuestionImage(imageStr: string): string {
  if (!imageStr) return ""
  // if already a data URL, return as-is
  if (imageStr.startsWith("data:")) return imageStr
  // if it looks like base64, convert to data URL
  if (/^[A-Za-z0-9+/=]+$/.test(imageStr.trim())) {
    return `data:image/png;base64,${imageStr.trim()}`
  }
  // otherwise assume it's a URL
  return imageStr
}

function normalizeRows(rows: any[]): QuestionRow[] {
  return rows
    .map((r) => normalizeKeys(r))
    .map((r) => ({
      class_code: toStr(r.class_code),
      subject_code: toStr(r.subject_code),
      topic_code: toStr(r.topic_code),
      sub_topic_code: toStr(r.sub_topic_code),
      question: toStr(r.question),
      question_image: processQuestionImage(toStr(r.question_image)),
      typed: toStr(r.typed),
      context: toStr(r.context),
      step_by_step_solution: toStr(r.step_by_step_solution),
      concepts: toStr(r.concepts),
    }))
    .filter((r) => r.question) // require a question string
}

export async function parseCsvFile(file: File): Promise<QuestionRow[]> {
  return new Promise((resolve, reject) => {
    Papa.parse(file, {
      header: true,
      skipEmptyLines: true,
      // delimiter: "" lets Papa autodetect comma/semicolon/tab
      delimiter: "",
      complete: (results) => {
        resolve(normalizeRows((results.data as any[]) || []))
      },
      error: (err) => reject(err),
    })
  })
}

export async function parseCsvText(text: string, explicitDelimiter?: string): Promise<QuestionRow[]> {
  const res = Papa.parse(text, {
    header: true,
    skipEmptyLines: true,
    delimiter: explicitDelimiter || "", // autodetect or explicit (e.g. "\t")
  })
  return normalizeRows((res.data as any[]) || [])
}
[V0_FILE]typescript:file="lib/parse-solutions.ts"
export type SolutionStep = {
  content: string
}

export function parseSolutionSteps(input: string): SolutionStep[] {
  if (!input) return []
  const trimmed = input.trim()

// Try parsing as JSON array first
  try {
    const parsed = JSON.parse(trimmed)
    if (Array.isArray(parsed)) {
      return parsed.map((item, idx) => ({
        content: typeof item === "string" ? item : JSON.stringify(item),
      }))
    }
  } catch (e) {
    // Not JSON, treat as plain text
  }

// Fallback: treat as plain text
  return [{ content: trimmed }]
}
[V0_FILE]typescript:file="lib/utils.ts"
import { clsx, type ClassValue } from 'clsx'
import { twMerge } from 'tailwind-merge'

export function cn(...inputs: ClassValue[]) {
  return twMerge(clsx(inputs))
}
[V0_FILE]javascript:file="next.config.mjs"
/** @type {import('next').NextConfig} */
const nextConfig = {
  typescript: {
    ignoreBuildErrors: true,
  },
  images: {
    unoptimized: true,
  },
 
  eslint: {
    ignoreDuringBuilds: true,
  },
}

export default nextConfig
[V0_FILE]json:file="package.json"
{
  "name": "my-v0-project",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "build": "next build",
    "dev": "next dev",
    "lint": "next lint",
    "start": "next start"
  },
  "dependencies": {
    "@hookform/resolvers": "^3.10.0",
    "@radix-ui/react-accordion": "1.2.2",
    "@radix-ui/react-alert-dialog": "1.1.4",
    "@radix-ui/react-aspect-ratio": "1.1.1",
    "@radix-ui/react-avatar": "1.1.2",
    "@radix-ui/react-checkbox": "1.1.3",
    "@radix-ui/react-collapsible": "1.1.2",
    "@radix-ui/react-context-menu": "2.2.4",
    "@radix-ui/react-dialog": "1.1.4",
    "@radix-ui/react-dropdown-menu": "2.1.4",
    "@radix-ui/react-hover-card": "1.1.4",
    "@radix-ui/react-label": "2.1.1",
    "@radix-ui/react-menubar": "1.1.4",
    "@radix-ui/react-navigation-menu": "1.2.3",
    "@radix-ui/react-popover": "1.1.4",
    "@radix-ui/react-progress": "1.1.1",
    "@radix-ui/react-radio-group": "1.2.2",
    "@radix-ui/react-scroll-area": "1.2.2",
    "@radix-ui/react-select": "2.1.4",
    "@radix-ui/react-separator": "1.1.1",
    "@radix-ui/react-slider": "1.2.2",
    "@radix-ui/react-slot": "1.1.1",
    "@radix-ui/react-switch": "1.1.2",
    "@radix-ui/react-tabs": "1.1.2",
    "@radix-ui/react-toast": "1.2.4",
    "@radix-ui/react-toggle": "1.1.1",
    "@radix-ui/react-toggle-group": "1.1.1",
    "@radix-ui/react-tooltip": "1.1.6",
    "@vercel/analytics": "1.3.1",
    "autoprefixer": "^10.4.20",
    "class-variance-authority": "^0.7.1",
    "clsx": "^2.1.1",
    "cmdk": "1.0.4",
    "date-fns": "4.1.0",
    "embla-carousel-react": "8.5.1",
    "geist": "^1.3.1",
    "input-otp": "1.4.1",
    "katex": "latest",
    "lucide-react": "^0.454.0",
    "next": "15.5.9",
    "next-themes": "^0.4.6",
    "papaparse": "latest",
    "react": "19.1.0",
    "react-day-picker": "9.8.0",
    "react-dom": "19.1.0",
    "react-hook-form": "^7.60.0",
    "react-markdown": "latest",
    "react-resizable-panels": "^2.1.7",
    "recharts": "2.15.4",
    "rehype-katex": "latest",
    "remark-gfm": "latest",
    "remark-math": "latest",
    "remark-parse": "latest",
    "sonner": "^1.7.4",
    "strip-markdown": "latest",
    "tailwind-merge": "^2.5.5",
    "tailwindcss-animate": "^1.0.7",
    "unified": "latest",
    "vaul": "^0.9.9",
    "zod": "3.25.76"
  },
  "devDependencies": {
    "@tailwindcss/postcss": "^4.1.9",
    "@types/node": "^22",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "postcss": "^8.5",
    "tailwindcss": "^4.1.9",
    "tw-animate-css": "1.3.3",
    "typescript": "^5"
  }
}
[V0_FILE]javascript:file="postcss.config.mjs"
/** @type {import('postcss-load-config').Config} */
const config = {
  plugins: {
    '@tailwindcss/postcss': {},
  },
}

export default config
[V0_FILE]plaintext:file="public/data/sample-questions.tsv"
class_code	subject_code	topic_code	sub_topic_code	question	question_image	typed
10	2	1	1	"Express each number as a product of its prime factors:
(i) 140
(ii) 156
(iii) 3825
(iv) 5005
(v) 7429"		Exercise
10	2	1	1	"Find the LCM and HCF of the following pairs of integers and verify that $\mathrm{LCM} \times \mathrm{HCF}=$ product of the two numbers.
(i) 26 and 91
(ii) 510 and 92
(iii) 336 and 54"		Exercise
10	2	1	1	"Find the LCM and HCF of the following integers by applying the prime factorisation method.
(i) 12,15 and 21
(ii) 17,23 and 29
(iii) 8,9 and 25"		Exercise
10	2	1	1	Given that $\operatorname{HCF}(306,657)=9$, find $\operatorname{LCM}(306,657)$.		Exercise
10	2	1	1	Check whether $6^{n}$ can end with the digit 0 for any natural number $n$.		Exercise
10	2	1	1	Explain why $7 \times 11 \times 13+13$ and $7 \times 6 \times 5 \times 4 \times 3 \times 2 \times 1+5$ are composite numbers.		Exercise
10	2	1	1	"There is a circular path around a sports field. Sonia takes 18 minutes to drive one round of the field, while Ravi takes 12 minutes for the same. Suppose they both start at the
same point and at the same time, and go in the same direction. After how many minutes will they meet again at the starting point?"		Exercise
10	2	1	2	Prove that $\sqrt{5}$ is irrational.		Exercise
10	2	1	2	Prove that $3+2 \sqrt{5}$ is irrational.		Exercise
10	2	1	2	"Prove that the following are irrationals :
(i) $\frac{1}{\sqrt{2}}$
(ii) $7 \sqrt{5}$
(iii) $6+\sqrt{2}$"		Exercise
10	2	1		Consider the numbers $4^{n}$, where $n$ is a natural number. Check whether there is any value of $n$ for which $4^{n}$ ends with the digit zero.		Solved
10	2	1		Find the LCM and HCF of 6 and 20 by the prime factorisation method.		Solved
10	2	1		Find the HCF of 96 and 404 by the prime factorisation method. Hence, find their LCM.		Solved
10	2	1		Find the HCF and LCM of 6, 72 and 120, using the prime factorisation method.		Solved
10	2	1		Prove that $\sqrt{3}$ is irrational.		Solved
10	2	1		Show that $5-\sqrt{3}$ is irrational.		Solved
10	2	1		Show that $3 \sqrt{2}$ is irrational.		Solved
[V0_FILE]css:file="styles/globals.css"
@import 'tailwindcss';
@import 'tw-animate-css';

@custom-variant dark (&:is(.dark *));

:root {
  --background: oklch(1 0 0);
  --foreground: oklch(0.145 0 0);
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.145 0 0);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.145 0 0);
  --primary: oklch(0.205 0 0);
  --primary-foreground: oklch(0.985 0 0);
  --secondary: oklch(0.97 0 0);
  --secondary-foreground: oklch(0.205 0 0);
  --muted: oklch(0.97 0 0);
  --muted-foreground: oklch(0.556 0 0);
  --accent: oklch(0.97 0 0);
  --accent-foreground: oklch(0.205 0 0);
  --destructive: oklch(0.577 0.245 27.325);
  --destructive-foreground: oklch(0.577 0.245 27.325);
  --border: oklch(0.922 0 0);
  --input: oklch(0.922 0 0);
  --ring: oklch(0.708 0 0);
  --chart-1: oklch(0.646 0.222 41.116);
  --chart-2: oklch(0.6 0.118 184.704);
  --chart-3: oklch(0.398 0.07 227.392);
  --chart-4: oklch(0.828 0.189 84.429);
  --chart-5: oklch(0.769 0.188 70.08);
  --radius: 0.625rem;
  --sidebar: oklch(0.985 0 0);
  --sidebar-foreground: oklch(0.145 0 0);
  --sidebar-primary: oklch(0.205 0 0);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.97 0 0);
  --sidebar-accent-foreground: oklch(0.205 0 0);
  --sidebar-border: oklch(0.922 0 0);
  --sidebar-ring: oklch(0.708 0 0);
}

.dark {
  --background: oklch(0.145 0 0);
  --foreground: oklch(0.985 0 0);
  --card: oklch(0.145 0 0);
  --card-foreground: oklch(0.985 0 0);
  --popover: oklch(0.145 0 0);
  --popover-foreground: oklch(0.985 0 0);
  --primary: oklch(0.985 0 0);
  --primary-foreground: oklch(0.205 0 0);
  --secondary: oklch(0.269 0 0);
  --secondary-foreground: oklch(0.985 0 0);
  --muted: oklch(0.269 0 0);
  --muted-foreground: oklch(0.708 0 0);
  --accent: oklch(0.269 0 0);
  --accent-foreground: oklch(0.985 0 0);
  --destructive: oklch(0.396 0.141 25.723);
  --destructive-foreground: oklch(0.637 0.237 25.331);
  --border: oklch(0.269 0 0);
  --input: oklch(0.269 0 0);
  --ring: oklch(0.439 0 0);
  --chart-1: oklch(0.488 0.243 264.376);
  --chart-2: oklch(0.696 0.17 162.48);
  --chart-3: oklch(0.769 0.188 70.08);
  --chart-4: oklch(0.627 0.265 303.9);
  --chart-5: oklch(0.645 0.246 16.439);
  --sidebar: oklch(0.205 0 0);
  --sidebar-foreground: oklch(0.985 0 0);
  --sidebar-primary: oklch(0.488 0.243 264.376);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.269 0 0);
  --sidebar-accent-foreground: oklch(0.985 0 0);
  --sidebar-border: oklch(0.269 0 0);
  --sidebar-ring: oklch(0.439 0 0);
}

@theme inline {
  --font-sans: 'Geist', 'Geist Fallback';
  --font-mono: 'Geist Mono', 'Geist Mono Fallback';
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --color-card: var(--card);
  --color-card-foreground: var(--card-foreground);
  --color-popover: var(--popover);
  --color-popover-foreground: var(--popover-foreground);
  --color-primary: var(--primary);
  --color-primary-foreground: var(--primary-foreground);
  --color-secondary: var(--secondary);
  --color-secondary-foreground: var(--secondary-foreground);
  --color-muted: var(--muted);
  --color-muted-foreground: var(--muted-foreground);
  --color-accent: var(--accent);
  --color-accent-foreground: var(--accent-foreground);
  --color-destructive: var(--destructive);
  --color-destructive-foreground: var(--destructive-foreground);
  --color-border: var(--border);
  --color-input: var(--input);
  --color-ring: var(--ring);
  --color-chart-1: var(--chart-1);
  --color-chart-2: var(--chart-2);
  --color-chart-3: var(--chart-3);
  --color-chart-4: var(--chart-4);
  --color-chart-5: var(--chart-5);
  --radius-sm: calc(var(--radius) - 4px);
  --radius-md: calc(var(--radius) - 2px);
  --radius-lg: var(--radius);
  --radius-xl: calc(var(--radius) + 4px);
  --color-sidebar: var(--sidebar);
  --color-sidebar-foreground: var(--sidebar-foreground);
  --color-sidebar-primary: var(--sidebar-primary);
  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
  --color-sidebar-accent: var(--sidebar-accent);
  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
  --color-sidebar-border: var(--sidebar-border);
  --color-sidebar-ring: var(--sidebar-ring);
}

@layer base {
  * {
    @apply border-border outline-ring/50;
  }
  body {
    @apply bg-background text-foreground;
  }
}
[V0_FILE]json:file="tsconfig.json"
{
  "compilerOptions": {
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "target": "ES6",
    "skipLibCheck": true,
    "strict": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "bundler",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "incremental": true,
    "plugins": [
      {
        "name": "next"
      }
    ],
    "paths": {
      "@/*": ["./*"]
    }
  },
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
  "exclude": ["node_modules"]
}
[V0_FILE]png:file="public/apple-icon.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_9cTMvDhYzsXw9smsfmWdmCFB3RiT/IbCKqe8aOyKCr3C9s15usz/public/apple-icon.png"
[V0_FILE]png:file="public/icon-dark-32x32.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_9cTMvDhYzsXw9smsfmWdmCFB3RiT/_NLAIkeVwoL6vEzK2uSXmZ/public/icon-dark-32x32.png"
[V0_FILE]png:file="public/icon-light-32x32.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_9cTMvDhYzsXw9smsfmWdmCFB3RiT/DVnRdScnZe8NA9byc6_b4H/public/icon-light-32x32.png"
[V0_FILE]xml:file="public/icon.svg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_9cTMvDhYzsXw9smsfmWdmCFB3RiT/l2-w3jDSPuRqpmK6lDq3GH/public/icon.svg"
[V0_FILE]png:file="public/placeholder-logo.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_9cTMvDhYzsXw9smsfmWdmCFB3RiT/1uv3SMJqY6_jxcFCTgTEak/public/placeholder-logo.png"
[V0_FILE]xml:file="public/placeholder-logo.svg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_9cTMvDhYzsXw9smsfmWdmCFB3RiT/XB_XF8ESrwbAjotfOd5Wmb/public/placeholder-logo.svg"
[V0_FILE]jpg:file="public/placeholder-user.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_9cTMvDhYzsXw9smsfmWdmCFB3RiT/ONejAluG3EJATcwwA61bXn/public/placeholder-user.jpg"
[V0_FILE]jpg:file="public/placeholder.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_9cTMvDhYzsXw9smsfmWdmCFB3RiT/BlrBc_c6JuPtjsBHFMcNJn/public/placeholder.jpg"
[V0_FILE]xml:file="public/placeholder.svg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_9cTMvDhYzsXw9smsfmWdmCFB3RiT/J0QvC3Vjlpi92ZtRdLC4Mx/public/placeholder.svg"</article></body></html>