Manage shadcn/ui components and projects with components.json context.
npx skills add https://github.com/chef0111/physthink --skill shadcn-chef0111
Please help me install this Agent Skill. Skill: shadcn Source: https://github.com/chef0111/physthink/tree/main/.agents/skills/shadcn Command: npx skills add https://github.com/chef0111/physthink --skill shadcn-chef0111
This Skill streamlines the process of working with shadcn/ui components, ensuring consistency, adherence to best practices, and efficient UI development.
components.json and CLI info to understand project-specific configurations like aliases, Tailwind version, and base library.Card component to your Next.js app, this Skill will guide you through the npx shadcn@latest add card command, ensure correct import paths, and verify its structure against established rules.Use the shadcn skill to add the button and dialog components to the project.
High-intent search queries and answers about installing and using this skill.
To add shadcn/ui components, use the command `npx shadcn@latest add [component]` within your project directory. The Skill ensures correct import paths, verifies the component structure, and updates your project context based on its `components.json` configuration.
Managing shadcn/ui styling involves adhering to best practices for Tailwind CSS utility classes and component composition rules. The Skill guides you on proper styling, form integration, and icon usage to ensure UI consistency and adherence to shadcn/ui principles.
Yes, shadcn/ui works with your existing Tailwind CSS configuration by reading the `components.json` file. This allows the Skill to understand project-specific setups, including your Tailwind version, base UI library, and path aliases.
Import path failures often occur when project aliases in `components.json` are misconfigured. The Skill utilizes CLI info and project context to verify correct import paths, debug issues, and ensure the component structure aligns with your project's specific configuration.
Yes, you can use shadcn/ui for debugging and fixing existing React UI components. The Skill helps search, fix, and debug UI elements by applying established rules and providing component documentation and usage examples.
You need a `components.json` file for shadcn/ui development to define project-specific configurations like aliases and base libraries. The Skill triggers for actions related to component registries and uses this file to provide accurate project context.
netprtonyAutomate shadcn/ui component setup and usage in React and Next.js projects.
aresbitCreate React web applications with TypeScript, Vite, Tailwind CSS, and shadcn/ui.
hopeovertureGenerate React forms with React Hook Form, Zod validation, and shadcn/ui controls.
yashvinthanCreate user interfaces with shadcn/ui components and Tailwind CSS.