Flow Player
Un componente de React de código abierto que explica un flujo de solicitud paso a paso, publicado como biblioteca independiente e integrado en este portafolio.
- Rol
- Responsable y líder del proyecto: definición del contrato y del alcance, decisiones de producto, y dirección y revisión de una implementación asistida por IA.
- Tecnologías
- React / TypeScript / Vite / Vitest / Playwright / npm / GitHub Actions
Problema
Explicar un flujo de solicitud sin exponer sistemas de clientes. Los ejemplos son ilustrativos, no telemetría de producción.
Contrato
El contrato v0.1, aceptado el 30 de septiembre de 2026, recibe de 2 a 6 nodos ordenados en un carril, conexiones direccionales solo entre nodos vecinos y pasos predefinidos. La reproducción se mantiene separada de cualquier ejecución del backend.
Reproducción
Reproducir, pausar, avanzar y reiniciar tienen estados explícitos. El sitio anfitrión aporta el flujo y el paquete gestiona la reproducción, por lo que la versión 0.1.0 no permite controlarla por completo desde fuera.
Accesibilidad
Los controles nativos, el movimiento reducido y una explicación legible de cada paso describen el proceso más allá de la animación. Este portafolio además muestra el flujo completo como texto renderizado en el servidor. La revisión manual con lector de pantalla sigue pendiente.
Paquete y verificación
La versión 0.1.0 se publicó en npm el 1 de octubre de 2026 con licencia MIT, con entradas ESM y CommonJS tipadas y estilos acotados. Está verificada con React 18.2 y 19.3, TypeScript 4.9.5 y 5.9.3, y pruebas de navegador en Chromium, Firefox y WebKit.
Integración
Este portafolio instala la versión exacta 0.1.0 de npm y adapta sus propios tokens de diseño y etiquetas traducidas mediante un adaptador. Los flujos de ejemplo y el contenido que los rodea pertenecen al portafolio.
Resultado y límites
Publicado, documentado e integrado: el código, la documentación y el entorno de pruebas son públicos. No se afirman métricas de adopción, uso ni impacto.