Un explorador de proyectos estilo VS Code dentro del editor

La v0.5.10 de DiagramaHub agrega un explorador persistente al editor: crea diagramas dentro de carpetas, renombra carpetas y mueve diagramas arrastrando y soltando.

Cuando un proyecto pasa de cinco diagramas a treinta, el problema deja de ser dibujar y pasa a ser encontrar. Saltar del editor a la lista de proyectos, buscar el diagrama y volver rompe la concentración. En la versión 0.5.10 llevamos la estructura del proyecto al lugar donde trabajas: el editor.

Un explorador que se queda contigo

Si usas VS Code, esto te va a resultar familiar. El editor de diagramas de escritorio ahora tiene un explorador de proyecto persistente con el árbol de tu proyecto: los diagramas de la raíz y tus carpetas con su contenido. Abres otro diagrama sin salir del editor y sin perder el contexto de dónde está cada cosa.

También corregimos un detalle que hacía incómodo usarlo: las interacciones dentro del explorador ya no cierran el panel como si fueran clics fuera de él.

Organiza sin salir del editor

Además de navegar, desde el explorador puedes ordenar tu proyecto:

Crear diagramas directamente dentro de una carpeta, sin tener que crearlo en la raíz y moverlo después.
Renombrar carpetas cuando el nombre que elegiste al inicio ya no describe lo que contienen.
Mover diagramas con arrastrar y soltar entre la raíz del proyecto y las carpetas.

Las carpetas siguen siendo de un solo nivel. Es una decisión a propósito: una jerarquía plana se mantiene fácil de recorrer y evita los árboles profundos donde nadie encuentra nada.

flowchart TD
    P[Proyecto] --> R1[Diagrama en la raíz]
    P --> C1[Carpeta Backend]
    P --> C2[Carpeta Base de datos]
    C1 --> D1[Secuencia de login]
    C1 --> D2[Arquitectura de servicios]
    C2 --> D3[Esquema DBML]
    R1 -. arrastrar y soltar .-> C1

Ajustar a pantalla, ahora bien centrado

Otro cambio que se nota al trabajar: ajustar a pantalla ahora calcula el encuadre con los límites reales del SVG renderizado. En la práctica, los diagramas de D2 se centran correctamente, algo que antes no siempre pasaba.

Página "Acerca de"

Agregamos una página Acerca de dentro de la aplicación con los detalles del producto, el enlace al repositorio de GitHub, nuestra cuenta de X y el correo de contacto. Si quieres reportar algo, proponer una idea o simplemente ver el código, ahí tienes todos los caminos en un solo lugar.

Dependencias al día

En esta versión también actualizamos las dependencias del frontend, entre ellas Mermaid a la 11.16.0 y DOMPurify a la 3.4.12, y renovamos las dependencias transitivas. Con eso, npm audit reporta 0 vulnerabilidades tanto en dependencias de producción como de desarrollo.

Pruébalo

Abre cualquier diagrama en DiagramaHub Cloud y organiza tu proyecto desde el explorador. Si usas la versión self-host, actualiza a la 0.5.10. Los detalles técnicos están en el changelog.