w

Herramienta Cursor Canvas

Pega un archivo .canvas.tsx de Cursor, previsualízalo en el navegador y publica un enlace corto compartible.

FAQ

¿Por qué se ve distinto de Cursor? Esta vista previa reimplementa la API pública de cursor/canvas en React. No es el runtime del IDE. Espaciado, gráficos y controles son cercanos, no idénticos al píxel.

¿Funcionan los botones de Agent? En parte. useCanvasAction abre Cursor mediante deeplink (cursor://). Los prompts de chat y las rutas de archivo absolutas funcionan; las relativas y los id de conversación de Agent no pueden apuntar al espacio de trabajo local, así que rellenan un prompt.

¿Caducan los enlaces cortos? Permanecen hasta que el propietario los elimine en Enlaces publicados. No son mensajes de un solo uso.

¿Por qué falló la publicación? El backend debe estar en marcha y el origen debe importar desde cursor/canvas. Archivos vacíos, de más de 200.000 caracteres e imports no permitidos se rechazan.

¿Por qué la vista previa está en blanco? El archivo necesita un export default que devuelva primitivas de canvas. Expande los ejemplos en vivo de la página de ejemplos.

¿Puedo importar lucide-react o archivos locales? No. Solo se permiten cursor/canvas y React. Si necesitas un icono, incrusta un SVG pequeño en IconButton.

¿El origen es privado? Solo hasta que crees un enlace corto. Después, cualquiera con la URL puede cargar el origen.

¿«Cargar ejemplo» coincide con esta documentación? No. Cargar ejemplo en la herramienta inyecta la galería completa del SDK. Esta documentación usa vistas previas más pequeñas para copiar una idea cada vez.

¿Te resultó útil esta página?