Shadcn Code Review
Catches the subtle mistakes that break shadcn/ui components: CVA variants bleeding into className props, asChild composition without proper Slot usage, missing focus-visible states, and data-slot attributes that should be there but aren't. Built around four reference documents covering CVA patterns, composition, accessibility, and data-slot usage. The hard gates are strict, you can't draft findings until you've verified location evidence and exemption checks for each issue. Useful when you're reviewing React components that use shadcn, Radix primitives, or Tailwind and want to enforce the patterns that make these libraries actually composable. The valid patterns list is smart, it won't flag correct Tailwind v4 syntax or standard shadcn internals.
- skills.sh installs
- 204
- GitHub stars
- 87
- last updated
- Aug 21, 2026
Install
$ npx -y skills add existential-birds/beagle --skill shadcn-code-review --agent claude-codeInstalls into .claude/skills of the current project.
Files
shadcn/ui Code Review
Quick Reference
| Issue Type | Reference |
|---|---|
| className in CVA, missing VariantProps, compound variants | references/cva-patterns.md |
| asChild without Slot, missing Context, component composition | references/composition.md |
| Missing focus-visible, aria-invalid, disabled states | references/accessibility.md |
| Missing data-slot, incorrect CSS targeting | references/data-slot.md |
Review Checklist
Sponsors
Agent CaffeineSponsoredClose your lid, come back to finished work
SnugSponsoredThe clipboard manager for the AI eraPromote your product hereReach 125k+ visitors monthly
WaxSponsoredBlock anything with supervision, without erasing your iPhonePromote your product hereReach 125k+ visitors monthly
knobsSponsoredSee your site on any phone, any day, in any languageDetails
- Repository
- github.com/existential-birds/beagle
- Categories
- Frontend Development, Git & Pull Requests, Code Review & Quality, Design & UI/UX
- First seen
- Jun 3, 2026
More from existential-birds/beagle
All 40- Swift Testing Code Review194
- Sqlite Vec171
- Pydantic Ai Tool System161
- Deepagents Architecture160
- Langgraph Implementation160
- Pydantic Ai Testing146
- Pydantic Ai Dependency Injection141
- Deepagents Implementation140
- Deepagents Code Review132
- Github Projects120
- Pydantic Ai Model Integration120
- React Flow1.3K
- Python Code Review928
- Langgraph Code Review887
- Tailwind V4817
- React Flow Advanced643
- React Router V7577
- React Flow Architecture536
- Vitest Testing471
- Docling431
- Fastapi Code Review387
- React Flow Implementation374
- Shadcn Ui356
- React Flow Code Review324
Recommended
More Frontend Development
frontendmiles990/claude-software-skillsModern frontend development with React, Vue, and web technologies194skills.sh installs
frontend-internationalization-best-practicessergiodxa/agent-skillsInternationalization best practices for React Router framework mode using remix-i18next. Use when setting up locales, middleware, resource routes, or language s193skills.sh installs
svelteepicenterhq/epicenterSvelte 5 component and state-module patterns for Epicenter apps. Use when editing `.svelte`, `.svelte.ts`, or Svelte UI state code involving runes, `$props`, sn192skills.sh installs
angular-lifecycleoguzhan18/angular-ecosystem-skillsALWAYS use when working with Angular Lifecycle Hooks, ngOnInit, ngOnChanges, ngAfterViewInit, or component lifecycle in Angular.176skills.sh installs
frontend-developmentsamhvw8/dotfilesMulti-framework frontend development. Frameworks: React 18+ (Suspense, hooks, TanStack), Vue 3 (Composition API, Pinia, Nuxt), Svelte 5 (Runes, SvelteKit), Angu174skills.sh installs
tailwind-patternssrbhr/resume-matcherProduction-ready Tailwind CSS patterns for common website components: responsive layouts, cards, navigation, forms, buttons, and typography. Includes spacing sc170skills.sh installs