import { useState, useEffect } from "react"; import { Resizable } from "re-resizable"; import { Card, CardContent } from "@/components/ui/card"; import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"; import { Button } from "@/components/ui/button"; import { Play, Trash } from "lucide-react"; import { Editor } from "@monaco-editor/react"; export default function CodeEditor() { const [html, setHtml] = useState("

Hello, World!

"); const [css, setCss] = useState("h1 { color: blue; }"); const [js, setJs] = useState("console.log('Hello, World!');"); const [srcDoc, setSrcDoc] = useState(""); useEffect(() => { const timeout = setTimeout(() => { setSrcDoc( ` ${html}