Tom UI Playground

Sobre este proyecto

Tom UI Playground es un sandbox React + Tailwind en el navegador inspirado en VS Code, construido con React, TypeScript, Vite y Tailwind CSS. La superficie de edición usa Monaco Editor (el motor detrás de VS Code) con resaltado de sintaxis para TSX, TypeScript y CSS, autocompletado y formateo. El código JSX/TSX se transpila en tiempo real dentro del navegador vía Sucrase, así que la vista previa se actualiza sin paso de build. Un sistema de archivos virtual soporta hasta 20 archivos .tsx, .ts y .css con imports relativos y una paleta QuickOpen (Cmd+P) para navegación rápida. La persistencia pasa por localStorage con hasta 30 espacios de guardado con nombre, auto-save periódico e import/export JSON. La app incluye una biblioteca de 15+ plantillas, una consola que captura log/warn/error/info, una hoja resumen de Tailwind y paneles redimensionables. La vista previa corre dentro de un iframe sandbox que resuelve imports relativos, monta React 19 y Tailwind vía CDN, y reenvía la consola al padre.