Créer des composants d’interface de chat IA
Les équipes ont besoin d’interfaces de chat IA cohérentes qui respectent les modèles d’AI Elements. Cette compétence guide la création de composants avec React, shadcn/ui et les conventions du Vercel AI SDK.
N’installez pas automatiquement ce Skill.
La politique de référence exige un examen par un opérateur avant toute action d’installation.
Copiez cette demande dans votre Agent. Elle contient la page Skill de référence et le manifeste.
Review the Skillstore skill "ai-elements" from https://skillstore.io/skills/vercel-ai-elements.md and its manifest at https://skillstore.io/api/skills/vercel-ai-elements/manifest. Verify the artifact. Do not auto-install. Inspect the skill and report your findings, then wait for an operator or manual installation decision.Votre Agent doit toujours présenter son plan et demander toute confirmation exigée par la politique de sécurité.
Utilisez ces liens lorsqu’un Agent IA, un crawler ou un script a besoin d’un contexte propre au lieu de lire toute la page.
Utilisation de « ai-elements ». Crée un composant qui affiche la sélection de modèle dans une application de chat IA.
Résultat attendu:
Un plan d’implémentation concis, une structure de composant React et des notes d’utilisation alignées sur les conventions d’AI Elements.
Utilisation de « ai-elements ». Ajoute de la documentation pour une nouvelle variante d’entrée de prompt.
Résultat attendu:
Un plan de page de référence avec les props, les conseils d’utilisation, les limitations et du contenu de démonstration sûr.
Utilisation de « ai-elements ». Examine ce composant IA généré pour vérifier sa cohérence.
Résultat attendu:
Most static findings are false positives from Markdown examples, React keys, template literals, ANSI terminal text, static URLs, and inline demo media. Real issues remain in the speech input examples, which risk exposing OpenAI keys from client code, and in the stack trace documentation, which recommends eval(code) in a backend route.
Il s’agit de capacités locales réelles qui peuvent être attendues pour cette compétence ; elles nécessitent donc un examen, mais ne sont pas comptabilisées comme comportement malveillant confirmé.
Partagez le rapport d’évaluation versionné, le badge neutre, la carte intégrable et les citations. Skillstore présente les preuves sans décider si ce Skill est sûr.
https://skillstore.io/skills/vercel-ai-elements/audits/4?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report[](https://skillstore.io/skills/vercel-ai-elements?utm_source=security_passport_badge)<a href="https://skillstore.io/skills/vercel-ai-elements?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/vercel-ai-elements/security.svg" alt="Skillstore security assessment" loading="lazy"></a><iframe src="https://skillstore.io/embed/skills/vercel-ai-elements.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>vercel. (2026). ai-elements security audit report (audit version 4) [Author version unspecified]. Skillstore. https://skillstore.io/skills/vercel-ai-elements/audits/4@techreport{vercel-vercel-ai-elements-2026,
author = {vercel},
title = {ai-elements security audit report (audit version 4)},
institution = {Skillstore},
year = {2026},
number = {4},
url = {https://skillstore.io/skills/vercel-ai-elements/audits/4},
note = {Author version unspecified}
}cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "ai-elements security audit report (audit version 4)"
version: "unspecified"
type: report
authors:
- name: "vercel"
date-released: "2026-07-07"
url: "https://skillstore.io/skills/vercel-ai-elements/audits/4"
identifiers:
- type: other
value: "skillstore:vercel-ai-elements:audit:4"
description: "Skillstore immutable audit report identifier"
Créer un composant de message IA réutilisable qui respecte les conventions de composition et de style d’AI Elements.
Créer un panneau d’état d’outil, de tâche ou de confirmation pour un prototype de workflow IA.
Créer des exemples et des notes de référence pour des composants d’interface natifs IA dans une bibliothèque de composants partagée.
Crée un nouveau composant AI Elements pour afficher de courts messages d’état de l’assistant. Suis les modèles existants de nommage et de composition des composants.
Ajoute un exemple d’utilisation du nouveau composant dans le répertoire scripts. Garde les données statiques et évite les vrais secrets ou les appels réseau non sûrs.
Examine cette API de composant AI Elements pour vérifier sa cohérence avec shadcn/ui, les classes Tailwind et les modèles d’utilisation du Vercel AI SDK.
Conçois un flux composable d’approbation d’outil IA avec les états pending, accepted, rejected et error. Inclue des libellés accessibles et des données d’exemple sûres.
Auteur
vercelLicence
MIT
Révision Skillstore
r1
Avis de version
L’auteur n’a déclaré aucune version.
Réf
36e07d5e13068e5be64447e8f20b427cf2cbd21a
Récence de maintenance
25/07/2026
Utilisation
35 téléchargements · 808 vues
Build eve Agents with Version-Matched Documentation
Agent development can fail when guidance does not match the installed eve version. This skill directs your assistant to bundled documentation before project changes.
Optimize Next.js Cache Component Navigation
Next.js routes can delay their static shell while dynamic data resolves. This skill builds verified instant-navigation tests and guides Cache Components refactors that preserve behavior.
Créer des fonctionnalités AI SDK avec une documentation à jour
Les API AI SDK évoluent rapidement, ce qui peut rendre le code généré obsolète. Cette compétence guide Claude, Codex et Claude Code vers la documentation actuelle et les modèles de migration.
Optimiser les monorepos Turborepo
La configuration de Turborepo peut être difficile lorsque les tâches, les entrées de cache, les filtres et les paramètres CI interagissent. Cette compétence fournit des conseils ciblés pour des builds de monorepo fiables et des pipelines plus rapides.
Adopt Next.js Cache Components Safely
Cache Components migrations can expose blocking routes and hidden rendering issues. This skill guides staged adoption, route fixes, browser checks, and final build verification.
Créer des applications fullstack avec un accompagnement senior
par alirezarezvani
Les projets fullstack nécessitent souvent une configuration cohérente, des choix d’architecture et des contrôles qualité. Cette compétence fournit des scripts et des références pour le travail avec React, Next.js, Node.js, GraphQL et PostgreSQL.
Implémenter les transitions de vue React
par vercel-labs
Les transitions de vue React sont faciles à mal placer, ce qui entraîne des animations silencieuses ou gênantes. Cette skill guide les choix d’animations de routes, de Suspense, de listes et d’éléments partagés.
Créer des composants React à typage sûr
par softaworks
Le travail avec React TypeScript nécessite souvent des types précis pour les événements, les hooks et les routes. Cette compétence fournit des modèles ciblés pour les composants typés, les API React 19 et le routage.
Créer des fonctionnalités frontend prêtes pour la production
par davila7
Les équipes frontend ont besoin de recommandations cohérentes sur React et Next.js dans l'ensemble de leurs projets. Cette compétence fournit des workflows de référence, des pratiques de qualité et des scripts utilitaires pour l'analyse frontend.
Optimiser les performances Next.js
par Atman36
Les applications Next.js peuvent devenir lentes à cause de bundles volumineux, d’une mise en cache insuffisante et de médias non optimisés. Cette compétence guide Claude, Codex et Claude Code dans des améliorations de performance ciblées pour les applications de production.
Optimiser les performances de React et Next.js
par vercel-labs
Les applications React et Next.js perdent souvent en vitesse à cause de waterfalls, de bundles volumineux et de re-renders évitables. Cette skill donne aux agents des règles concrètes pour des changements plus sûrs axés sur les performances.