Now let me search for the best approach for the document editor:

Good, Tiptap v3 is the latest and supports React 19. Now let me write the plan:

Let me read all the files I need to modify in parallel:

I now have full context of all 4 files. Let me also check mock data for the Flujo type to use in the detail page:

Good. Now let me start building everything. First, add Tiptap packages and create the two components simultaneously:

Now create the DocumentEditor component with a full Word-style ribbon toolbar:

Now create the DocumentViewer component for previewing uploaded files:

Tiptap packages added to package.json, DocumentEditor component created with a full Word-style ribbon toolbar (undo/redo, font family/size dropdowns, heading levels, bold/italic/underline/strikethrough, text color picker, highlight picker, 4 alignment options, lists, image/table/horizontal rule insertion) rendering inside an A4-style page with optional header/footer. DocumentViewer component created with file cards showing type-colored icons/badges and an iframe-based preview modal (native for PDF/images, Microsoft Office Online for DOCX/XLSX/PPTX).

Now I need to replace the Proyectar Respuesta tab in the radicado detail page. Let me replace the entire tab content with the new Tiptap editor and add a documents viewer sub-tab:

Now replace the state and the full Proyectar Respuesta tab content:

Now replace the entire Proyectar Respuesta TabsContent:

The Proyectar Respuesta tab now has two sub-tabs: "Editor de Documento" using the full Tiptap rich text editor with A4-style page layout, document header/footer, and Word-style ribbon toolbar, and "Documentos Adjuntos" using the DocumentViewer component with type-colored file cards and preview modal for PDF/DOCX/XLSX/PPTX files.

Now I need to: (1) update the flujos list page to remove the dialog and link to detail pages, (2) create the full-page detail view. Let me do both:

Now create the full-page flujo detail view:

Todos los cambios estan completos. Resumen de lo implementado:

Flujos sin modal: La pagina de flujos ahora usa <Link> en la tabla para navegar a /dashboard/flujos/[id], una pagina completa con tarjetas de resumen (etapas, radicados, fecha), el diagrama React Flow interactivo a ancho completo (400px de alto, con controles de zoom/pan), y un timeline detallado de etapas debajo.

Editor de documentos tipo Word: El textarea del tab "Proyectar Respuesta" fue reemplazado por un editor Tiptap completo con ribbon toolbar estilo Office (deshacer/rehacer, familia de fuentes, tamano, encabezados, negrita/cursiva/subrayado/tachado, color de texto, resaltador, 4 alineaciones, listas, insertar imagen/tabla/linea horizontal). El documento se renderiza dentro de una pagina A4 con header y footer institucional. Se agrego un sub-tab "Documentos Adjuntos" con el componente DocumentViewer que muestra tarjetas coloreadas por tipo de archivo (PDF, DOCX, XLSX, PPTX) y un visor con iframe para previsualizar.