agent-ui
Crea interfaces de agente para React y Next.js
Los equipos de React necesitan interfaces de agente que gestionen streaming, herramientas, aprobaciones y respuestas enriquecidas sin infraestructura personalizada. Esta skill muestra cómo añadir un componente de agente listo para usar, una ruta proxy y patrones de herramientas con alcance delimitado.
Instalar con mi Agente
Copia esta solicitud en tu Agente. Incluye la página canónica del Skill y el manifiesto.
Review the Skillstore skill "agent-ui" from https://skillstore.io/skills/inferen-sh-agent-ui.md and its manifest at https://skillstore.io/api/skills/inferen-sh-agent-ui/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.Tu Agente debe seguir mostrando su plan y solicitar cualquier confirmación exigida por la política de seguridad.
Recursos legibles por agentes
Usa estos enlaces cuando un agente de IA, crawler o script necesite contexto limpio en vez de leer la página completa.
Pruébalo
Usando "agent-ui". Necesito un panel de chat de agente para un panel de administración de React.
Resultado esperado:
- Un plan de configuración con pasos de instalación del componente.
- Una lista de verificación de ruta proxy para acceso a API del lado del servidor.
- Una lista breve de props para configurar streaming, archivos, imágenes y el nombre del agente.
Usando "agent-ui". Quiero que el asistente ayude a los usuarios a completar un formulario de soporte.
Resultado esperado:
- Un plan de herramientas con alcance delimitado que limite el acceso a una sola referencia de formulario.
- Un punto de aprobación humana antes de modificar campos.
- Una advertencia para bloquear campos sensibles salvo que estén permitidos explícitamente.
Usando "agent-ui". Necesito una lista de verificación de lanzamiento para un copiloto de agente.
Resultado esperado:
- Revisar los archivos del componente remoto antes de la instalación.
- Mantener las claves de API solo del lado del servidor.
- Probar el progreso de herramientas, estados de aprobación, cargas y manejo de errores.
Auditoría de seguridad
Riesgo medioMost static findings are false positives caused by markdown code fences, inline prop names, documentation links, and placeholder environment variable examples. Two command examples and one remote registry URL are confirmed as medium or low risk because they direct users to execute external package or skill installation commands. A semantic review also found a medium-risk workflow concern around agent-driven form filling with client-side tools.
Preocupaciones de seguridad confirmadas (1)
Elementos de revisión de capacidades (3)
Estas son capacidades locales reales que pueden esperarse para esta habilidad, por lo que requieren revisión, pero no se cuentan como comportamiento malicioso confirmado.
Factores de riesgo
⚙️ Comandos externos (16)
🌐 Acceso a red (9)
🔑 Variables de entorno (1)
Compartir y citar este informe
Comparte el informe de evaluación versionado, la insignia neutral, la tarjeta insertable y las citas. Skillstore presenta evidencias sin decidir si este Skill es seguro.
Copiar enlace del informe
https://skillstore.io/skills/inferen-sh-agent-ui/audits/4?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportInsignia Markdown
[](https://skillstore.io/skills/inferen-sh-agent-ui?utm_source=security_passport_badge)Insignia HTML
<a href="https://skillstore.io/skills/inferen-sh-agent-ui?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/inferen-sh-agent-ui/security.svg" alt="Skillstore security assessment" loading="lazy"></a>Tarjeta para insertar
<iframe src="https://skillstore.io/embed/skills/inferen-sh-agent-ui.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>Citas académicas (APA · BibTeX · CFF)
Cita APA
inferen-sh. (2026). agent-ui security audit report (audit version 4) [Author version unspecified]. Skillstore. https://skillstore.io/skills/inferen-sh-agent-ui/audits/4Cita BibTeX
@techreport{inferen-sh-inferen-sh-agent-ui-2026,
author = {inferen-sh},
title = {agent-ui security audit report (audit version 4)},
institution = {Skillstore},
year = {2026},
number = {4},
url = {https://skillstore.io/skills/inferen-sh-agent-ui/audits/4},
note = {Author version unspecified}
}CITATION.cff
cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "agent-ui security audit report (audit version 4)"
version: "unspecified"
type: report
authors:
- name: "inferen-sh"
date-released: "2026-07-05"
url: "https://skillstore.io/skills/inferen-sh-agent-ui/audits/4"
identifiers:
- type: other
value: "skillstore:inferen-sh-agent-ui:audit:4"
description: "Skillstore immutable audit report identifier"
Comparar variantes
3 variantes instalablesCada autor sigue siendo un skill instalable independiente. La variante recomendada se ordena según la evidencia de Skillstore.
Por qué esta variante es la primera
inference-sh-9-agent-ui
2026-09-09
inference-sh-agent-ui
2026-09-09
inferen-sh-agent-ui
2026-09-09
Puntuación de Skillstore
Por qué esta puntuación Confianza de la evidencia: AltoLo que puedes crear
Añadir un copiloto SaaS
Inserta una interfaz de agente que transmita respuestas en streaming, solicite aprobaciones y muestre el progreso de herramientas dentro de un panel de producto.
Prototipar flujos de trabajo de agentes
Prueba cómo un asistente guiado puede completar formularios, presentar widgets y solicitar confirmación humana antes de realizar acciones.
Estandarizar patrones de interfaz de agente
Usa un patrón de componente compartido para enrutamiento proxy, configuración de modelos, cargas, herramientas y estados de aprobación.
Prueba estos prompts
Muéstrame cómo añadir el componente de interfaz de agente a una nueva app de Next.js. Incluye los pasos necesarios de paquete y registro.
Ayúdame a crear la ruta proxy de Inference para una app de Next.js y explícame dónde debería residir la clave de API.
Diseña una configuración de herramienta del lado del cliente con alcance delimitado que permita al agente inspeccionar un formulario y sugerir valores de campos con aprobación del usuario.
Revisa mi flujo de trabajo planificado para la interfaz de agente en busca de acceso inseguro a herramientas, manejo de cargas, exposición del proxy y brechas de aprobación.
Mejores prácticas
- Revisa la salida del registro remoto y los cambios de paquetes antes de fusionar comandos de instalación.
- Mantén las claves de API en variables de entorno del lado del servidor y enruta todas las llamadas a proveedores a través del proxy.
- Delimita estrechamente el alcance de las herramientas del lado del cliente y exige aprobación del usuario antes de cambiar datos de formularios.
Evitar
- Ejecutar comandos npx remotos en una rama de producción sin revisar los archivos generados.
- Pasar claves de API o credenciales de proveedores a componentes del navegador.
- Dar a las herramientas del agente acceso amplio a formularios, archivos, cargas o estado de la página sin controles.
Preguntas frecuentes
¿Qué me ayuda a crear esta skill?
¿Incluye lógica de backend?
¿Requiere una clave de API?
¿Puede el agente usar herramientas?
¿Se admite la carga de archivos?
¿Qué debo revisar antes de instalar?
Detalles del desarrollador
Autor
inferen-shLicencia
MIT
Revisión de Skillstore
r1
Aviso de versión
El autor no declaró una versión.
Ref.
30c73eac2afe762f6aa9c4553158769369d47351
Actualidad del mantenimiento
22/7/2026
Uso
2 descargas · 157 vistas
Estructura de archivos
📄 SKILL.md