// Örnek React artifact: pomodoro hesaplayıcı
import { useState } from "react";
 
export default function Pomodoro() {
  const [tasks, setTasks] = useState(2);
  const [minutes, setMinutes] = useState(25);
  const [breakMin, setBreakMin] = useState(5);
 
  const total = tasks * (minutes + breakMin);
 
  return (
    <div className="p-6 max-w-md mx-auto">
      <h1 className="text-xl font-bold mb-4">Pomodoro Planı</h1>
      <div className="space-y-3">
        <label className="block">
          Görev sayısı:
          <input type="number" value={tasks} onChange={e => setTasks(+e.target.value)} className="ml-2 border px-2 py-1 rounded" />
        </label>
        <label className="block">
          Pomodoro süresi (dk):
          <input type="number" value={minutes} onChange={e => setMinutes(+e.target.value)} className="ml-2 border px-2 py-1 rounded" />
        </label>
        <label className="block">
          Mola süresi (dk):
          <input type="number" value={breakMin} onChange={e => setBreakMin(+e.target.value)} className="ml-2 border px-2 py-1 rounded" />
        </label>
      </div>
      <p className="mt-6 font-semibold">Toplam süre: {total} dk</p>
    </div>
  );
}

Artifacts içinde _____ ve _____ Storage kullanılamaz. React artifact'lerinde _____ kullanılarak veri saklanır. Stil için Tailwind _____ utility'leri çalışır.