Agent Component
Créez des interfaces d'agents IA avec React
Créer des interfaces de chat IA nécessite une gestion complexe des états, du streaming et de la manipulation d'outils. Cette compétence fournit un composant agent prêt à l'emploi avec toutes les fonctionnalités intégrées.
스킬 ZIP 다운로드
Claude에서 업로드
설정 → 기능 → 스킬 → 스킬 업로드로 이동
토글을 켜고 사용 시작
테스트해 보기
"Agent Component" 사용 중입니다. Installez et configurez le composant agent avec des paramètres de base
예상 결과:
Une interface de chat entièrement fonctionnelle apparaît avec saisie de message, historique de conversation et réponses en streaming de Claude. Le composant gère automatiquement l'état de connexion, les erreurs et la reconnexion.
"Agent Component" 사용 중입니다. Ajoutez un outil nécessitant une approbation avant d'envoyer des emails
예상 결과:
Lorsque l'agent tente d'envoyer un email, un widget d'approbation apparaît affichant le destinataire, le sujet et le contenu du message. L'utilisateur peut approuver ou rejeter l'action avant exécution.
보안 감사
안전This is a documentation-only skill containing only SKILL.md with installation instructions and usage examples. No executable code, scripts, or network operations were detected. The skill provides guidance for integrating a React agent component from ui.inference.sh.
품질 점수
만들 수 있는 것
Intégration Copilote SaaS
Ajoutez un copilote IA à votre application SaaS avec une configuration minimale. Le composant gère le streaming, les appels d'outils et les approbations utilisateur dès le départ.
Automatisation de flux de travail interne
Créez des outils internes où les agents IA peuvent exécuter des actions avec supervision humaine. Les flux d'approbation garantissent que les opérations sensibles sont examinées avant exécution.
Chatbot de support client
Déployez un chatbot de support capable de récupérer des données, remplir des formulaires et escalader vers des humains si nécessaire. Le système de widgets fournit des réponses interactives enrichies.
이 프롬프트를 사용해 보세요
Créez un composant agent simple avec Claude Haiku qui répond aux questions des utilisateurs. Utilisez la configuration par défaut avec le streaming activé.
Configurez un composant agent avec un prompt système personnalisé pour la revue de code. L'agent doit analyser les diffs de pull request et suggérer des améliorations.
Configurez un agent avec des outils côté client pour l'interaction avec les formulaires. L'agent doit utiliser scan_ui pour lire les champs de formulaire et fill_field pour remplir des données selon les demandes de l'utilisateur.
Configurez un agent nécessitant une approbation humaine avant d'exécuter des opérations sensibles comme des écritures en base de données ou des appels API externes. Configurez des gestionnaires d'approbation qui affichent le contexte avant confirmation.
모범 사례
- Utilisez toujours une route proxy backend pour protéger votre clé API d'une exposition côté client
- Implémentez des flux d'approbation pour toute action modifiant des données ou déclenchant des systèmes externes
- Utilisez les outils côté client uniquement pour des opérations sécurisées pour le navigateur comme la lecture de valeurs de formulaire ou le défilement
피하기
- N'exposez jamais INFERENCE_API_KEY directement dans le code côté client et ne le commitez jamais dans le contrôle de version
- N'utilisez pas le composant agent sans route proxy car cela expose les identifiants
- Évitez d'accorder des permissions d'approbation pour des opérations sensibles sans interface de confirmation utilisateur appropriée