Hacktoberfest 2026 : les issues que les mainteneurs ont marquées pour octobre, ouvertes et accessibles aux débutants. Parcourir les issues Hacktoberfest

feat: add shadcn/ui skill for AI-assisted component generation

Ouverte
#52 0 commentaires 0 réactions 0 personnes assignées Voir sur GitHub

Personne n'a encore pris cette issue.

Évaluation

Difficulté
3/5
Temps estimé
1-2 jours
Accessibilité débutants
50/100
Type d'issue
Fonctionnalité
Clarté
Plutôt claire
Activité
Calme
Stack technique
tailwindcss
Domaine
frontend

Piste de recherche

Start by checking the existing component setup and whether components.json is present. Review how the shadcn skill uses shadcn info --json, then add the skill so AI assistants receive the repository's framework, Tailwind, aliases, components, and icon-library context; done means detection and context injection work as described.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Description

Summary

Add a shadcn/ui skill to give Claude Code (and other AI assistants) deep contextual knowledge of shadcn/ui components, patterns, and best practices when working in this repo.

What are shadcn skills?

Skills equip AI assistants with project-aware knowledge of shadcn/ui. They work by:

  1. Project detection — activates automatically when components.json exists
  2. Context injection — runs shadcn info --json to gather project config (framework, Tailwind version, aliases, installed components, icon library)
  3. Pattern enforcement — the AI follows shadcn/ui composition rules when generating code

This enables natural language requests like:

  • "Add a login form with email and password fields"
  • "Create a settings page with profile update functionality"
  • "Build a dashboard with a sidebar, stats cards, and a data table"

Installation

pnpm dlx skills add shadcn/ui

Why

This project already uses Tailwind CSS and a component-based UI. Adding the shadcn skill would let AI assistants generate components that are consistent with shadcn/ui patterns, theming (CSS variables, OKLCH colors, dark mode), and the existing design system — reducing manual fixups after AI-generated code.

References

Langage dominant
TypeScript
Étoiles
1.6k
Forks
205
Métriques de merge des PR
Aucune PR mergée en 30 j

Préparer son environnement

Par où commencer

  1. Lisez l'issue en entier, puis le guide de contribution du projet.
  2. Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
  3. Forkez le dépôt et travaillez sur une branche.
  4. Ouvrez une pull request qui référence le numéro de l'issue.

Autres issues de CopilotKit/OpenGenerativeUI

Toutes les issues de CopilotKit/OpenGenerativeUI

Issues similaires

Plus d'issues TypeScript

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.