AI Elements de Vercel queda obsoleto. Estas son las alternativas para interfaces de chat con IA con shadcn/ui
AI Elements de Vercel queda obsoleto a finales de noviembre de 2026. Qué lo sustituye, qué hacer con el código que copiaste y cinco opciones de chat con IA para shadcn/ui comparadas.
Preet Suthar · · 5 min de lectura
- AI
- shadcn/ui
- React
- Next.js
Si este año construiste un chat con IA con AI Elements de Vercel, el repositorio lleva ahora un aviso: la biblioteca quedará obsoleta a finales de noviembre de 2026, sustituida por AI Elements de shadcn/ui.
Este artículo cubre qué significa eso para tu código, cuál es el sustituto y las demás opciones si estás empezando una interfaz de chat con IA con shadcn/ui a finales de 2026. Mantengo una de esas opciones, HextaUI, así que diré dónde encaja y dónde no.
Primero: tu código sigue funcionando
AI Elements era un registro al estilo shadcn. Los componentes se copiaban en tu proyecto. No hay ningún paquete que deje de recibir actualizaciones, así que nada se rompe el 1 de diciembre. La obsolescencia significa que no habrá componentes nuevos ni correcciones de Vercel, y que los docs acabarán apuntando a otro sitio.
Tienes tiempo. No te apresures a migrar esta semana.
Qué lo sustituye
En octubre de 2026 shadcn/ui publicó su propio AI Elements: 21 patrones para interfaces agénticas construidos con componentes de shadcn/ui. Chat, Prompt Input, Reasoning, Tool, Plan, Subagent y más. Cada página de patrón muestra cómo renderizarlo a partir de partes de mensaje del AI SDK. No hay paquete. Copias cada patrón.
Llegan junto con dos componentes nuevos, Trace y Code Block, que funcionan con Base UI, React Aria y Radix.
La migración desde la biblioteca de Vercel está pensada para tener poca fricción. Los nombres de export y las props se conservan donde el patrón se reconstruyó, y cada página de patrón incluye un prompt de migración que puedes pasarle a un agente de IA para programar. Los elementos que no se reconstruyeron no están cubiertos, así que contrasta la lista con lo que usas.
La diferencia honesta entre piezas y pantallas
Cada opción de abajo cae en uno de dos bandos, y saber cuál quieres te ahorra una semana.
Las piezas te dan un Message, un Prompt Input, un componente Tool. Tú diseñas la pantalla y decides qué pasa cuando una respuesta falla, cuando se detiene un stream, cuando una herramienta necesita aprobación, cuando una subida muere. Las dos versiones de AI Elements, y prompt-kit, son piezas.
Las pantallas te dan el hilo del chat, el compositor, la lista de llamadas a herramientas y las páginas de ajustes con esas decisiones ya tomadas. Conectas los datos y las reestilizas con tus tokens de tema. Los bloques de HextaUI y las apps completas como la plantilla AI Chatbot de Vercel son pantallas.
Las piezas son gratuitas y flexibles. Las pantallas son más rápidas y vienen con criterio propio. Ninguna de las dos está mal.
Cinco opciones comparadas
1. AI Elements de shadcn/ui
Gratuito, MIT, mantenido por el equipo de shadcn, construido para Base UI, React Aria y Radix. Piezas, no pantallas. La opción natural por defecto si quieres componer lo tuyo y quedarte en el registro más usado. Es nuevo desde octubre de 2026, así que espera que la lista de patrones crezca y que las asperezas se vayan puliendo en los próximos meses.
2. prompt-kit
Gratuito, MIT, se instala con la CLI de shadcn. Prompt Input, Message, Reasoning, Chain of Thought, Tool, File Upload y bloques de ejemplo, incluida una app de chat con barra lateral de historial. Piezas, con buenos ejemplos. Construido sobre Radix, así que un proyecto con Base UI carga ambas capas de primitivas mientras lo usas.
3. assistant-ui
Gratuito, MIT, con una nube de pago opcional para hilos guardados. Este es distinto en naturaleza: es un framework de chat con su propio runtime que gestiona la conversación, más primitivas headless y componentes con estilo que leen de él. Adaptadores para el AI SDK, LangGraph, LangChain, AG-UI y otros. Elígelo si quieres que el runtime sea dueño del estado del chat. Descártalo si tu estado ya vive en useChat o en tu propio store y no quieres nada envolviendo tu app.
4. shadcn-chatbot-kit y la plantilla AI Chatbot
shadcn-chatbot-kit, de Blazity, es un conjunto más pequeño de componentes de chatbot. AI Chatbot, de Vercel, es una app completa de Next.js con inicio de sesión y base de datos, la referencia canónica si quieres ver todas las piezas conectadas. Las dos merece la pena leerlas aunque no las adoptes.
5. Bloques de HextaUI
Pantallas. Un Chat Thread donde las respuestas fallidas ofrecen Try again, las detenidas lo indican, y las ediciones y reintentos se convierten en versiones entre las que puedes alternar. Tool Calls con todos los estados de herramienta del AI SDK, incluidas aprobaciones con un motivo de "haz esto en su lugar". Streaming y Markdown que nunca muestran sintaxis a medio escribir. Un Prompt Input seguro con entrada en japonés y chino, que muestra progreso y reintento de subida, pone en cola los mensajes escritos durante una respuesta y conserva los borradores entre recargas. Más las pantallas alrededor de un producto de chat: ajustes, modelos, claves de API, facturación, equipo, seguridad.
Los componentes de debajo son gratuitos y MIT. Los bloques de IA son HextaUI Pro, un pago único con todos los bloques posteriores incluidos, y Prompt Input es gratuito. Construido sobre Base UI, lee partes de mensaje del AI SDK sin importar el SDK. No es para ti si lo quieres todo gratis, o si quieres Radix.
De un vistazo
| De un vistazo | Bando | Precio | Primitivos | AI SDK |
|---|---|---|---|---|
| AI Elements (shadcn/ui) | Piezas | Gratuito | Base UI, React Aria y Radix | Usado en los ejemplos |
| AI Elements (Vercel) | Piezas | Gratuito | Radix | Requerido por la configuración |
| prompt-kit | Piezas | Gratuito | Radix | Opcional |
| assistant-ui | Runtime | Gratuito, nube de pago | Propio | Adaptador |
| HextaUI | Pantallas | Componentes gratuitos, bloques con pago único | Base UI | Opcional, misma forma de partes |
Cómo decidir
- Empiezas desde cero y quieres componer lo tuyo: AI Elements de shadcn/ui.
- Ya tienes AI Elements de Vercel en tu árbol: consérvalo hasta que necesites algo nuevo, y entonces migra patrón a patrón usando los prompts de migración.
- Quieres un runtime que gestione por ti los hilos, las ramas y la persistencia: assistant-ui.
- Quieres el chat y las pantallas de producto a su alrededor ya hechos, con los estados de fallo resueltos, y no te importa pagar una vez: HextaUI.
Todas estas opciones copian el código fuente en tu proyecto y usan los tokens de tema de shadcn/ui, así que puedes mezclarlas pantalla a pantalla. La única precaución son las primitivas: mezclar un kit basado en Radix en un proyecto con Base UI funciona, pero envías ambas.
Mantengo una comparación más detallada con el mapeo completo pieza por pieza en hextaui.com/compare/ai-elements, y un repaso a siete opciones de plantillas de chat con IA para shadcn.
Preguntas frecuentes
¿Cuándo exactamente queda obsoleto AI Elements de Vercel? El repositorio dice que a finales de noviembre de 2026.
¿Se romperán mis componentes actuales de AI Elements? No. Viven en tu repositorio. Dejan de recibir actualizaciones.
¿El nuevo AI Elements es un paquete? No. Es un conjunto de patrones que copias con la CLI de shadcn, el mismo modelo que el propio shadcn/ui.
¿Puedo usar los bloques de HextaUI sin el AI SDK de Vercel? Sí. Reciben los mensajes como props con la forma de partes del AI SDK, y no importan el SDK.