Modal nativo con <dialog>: animación fluida con IA

Este prompt solicita la creación de un modal nativo utilizando el elemento HTML dialog, combinado con animaciones fluidas de entrada y salida mediante GSAP. Es ideal para desarrolladores web que desean evitar librerías pesadas de interfaz y aprovechar las capacidades semánticas del navegador moderno, sin renunciar a transiciones visuales elegantes. El resultado incluye personalización del fondo oscurecido, trampa de foco accesible y botón de cierre funcional.

Este tipo de prompt es especialmente útil en proyectos donde la accesibilidad y el rendimiento son prioritarios, ya que el elemento dialog nativo gestiona automáticamente atributos ARIA y el manejo del teclado. Se puede reproducir fácilmente en modelos como GPT-4 o Claude, especificando el framework de animación preferido o incluso solicitando variaciones sin dependencias externas. Una posible adaptación sería reemplazar GSAP por animaciones CSS puras, o añadir soporte para múltiples modales apilados en pantalla.