{
  "id": "math-tutor",
  "name": "Math Tutor",
  "category": "education",
  "tags": ["math", "tutor", "practice", "quiz", "arithmetic", "education"],
  "description": "Random math practice problems with difficulty levels and score tracking.",
  "triggers": ["math tutor", "practice math", "math quiz", "arithmetic", "math problems"],
  "defaultSize": { "w": 4, "h": 5 },
  "source": "function MathTutor() {\n  const [difficulty, setDifficulty] = React.useState('easy');\n  const [problem, setProblem] = React.useState(null);\n  const [answer, setAnswer] = React.useState('');\n  const [score, setScore] = React.useState({correct:0,total:0});\n  const [feedback, setFeedback] = React.useState(null);\n\n  const generate = ()=>{\n    let a,b,op,ans;\n    if(difficulty==='easy'){a=Math.floor(Math.random()*10)+1;b=Math.floor(Math.random()*10)+1;}\n    else if(difficulty==='medium'){a=Math.floor(Math.random()*50)+1;b=Math.floor(Math.random()*50)+1;}\n    else{a=Math.floor(Math.random()*100)+10;b=Math.floor(Math.random()*100)+10;}\n    const ops = ['+','-','×'];\n    op = ops[Math.floor(Math.random()*ops.length)];\n    if(op==='+')ans=a+b;\n    else if(op==='-')ans=a-b;\n    else ans=a*b;\n    setProblem({a,b,op,ans});\n    setAnswer('');\n    setFeedback(null);\n  };\n\n  React.useEffect(()=>generate(),[difficulty]);\n\n  const check = ()=>{\n    const correct = parseInt(answer)===problem.ans;\n    setScore(s=>({correct:s.correct+(correct?1:0),total:s.total+1}));\n    setFeedback(correct?'correct':'wrong');\n    setTimeout(()=>generate(),800);\n  };\n\n  return (\n    <div style={{padding:20,fontFamily:'system-ui',height:'100%',display:'flex',flexDirection:'column',alignItems:'center'}}>\n      <div style={{fontSize:18,fontWeight:700,marginBottom:8}}>Math Tutor</div>\n      <div style={{display:'flex',gap:6,marginBottom:16}}>\n        {['easy','medium','hard'].map(d=> (\n          <button key={d} onClick={()=>setDifficulty(d)}\n            style={{padding:'4px 12px',borderRadius:6,border:'1px solid #ccc',background:difficulty===d?'#007AFF':'#fff',color:difficulty===d?'#fff':'#000',cursor:'pointer',fontSize:12,textTransform:'capitalize'}}>\n            {d}\n          </button>\n        ))}\n      </div>\n      <div style={{fontSize:14,color:'#888',marginBottom:16}}>Score: {score.correct}/{score.total}</div>\n      {problem && (\n        <div style={{textAlign:'center'}}>\n          <div style={{fontSize:36,fontWeight:200,marginBottom:20,fontVariantNumeric:'tabular-nums'}}>\n            {problem.a} {problem.op} {problem.b} = ?\n          </div>\n          <input type=\"number\" value={answer} onChange={e=>setAnswer(e.target.value)} onKeyDown={e=>e.key==='Enter'&&check()}\n            style={{width:100,padding:'10px',borderRadius:8,border:'1px solid #ccc',fontSize:20,textAlign:'center',marginBottom:12}}\n            autoFocus/>\n          <div style={{marginBottom:12}}>\n            <button onClick={check}\n              style={{padding:'8px 24px',borderRadius:8,background:'#34C759',color:'#fff',border:'none',cursor:'pointer',fontSize:16}}>\n              Check\n            </button>\n          </div>\n          {feedback==='correct'&&<div style={{color:'#34C759',fontWeight:600}}>✓ Correct!</div>}\n          {feedback==='wrong'&&<div style={{color:'#FF3B30',fontWeight:600}}>✗ Try again</div>}\n        </div>\n      )}\n    </div>\n  );\n}\nrender(<MathTutor/>);",
  "placeholders": []
}