Implements coss UI components with correct imports, composition, and accessibility patterns.
npx skills add https://github.com/sethdavis512/iridium --skill coss-sethdavis512
Please help me install this Agent Skill. Skill: coss Source: https://github.com/sethdavis512/iridium/tree/main/.agents/skills/coss Command: npx skills add https://github.com/sethdavis512/iridium --skill coss-sethdavis512
render-based trigger composition and array-valued Accordion state so migrated code behaves correctly. - Install and discovery workflow: Covers the shadcn CLI commands (npx shadcn@latest add @coss/<component>), preview modes, and manual install steps with required dependencies and theme tokens. - Use Case: When asked to build a settings dialog with a validated form, the Skill directs you to the Dialog and Form references, producing code with DialogPopup, DialogPanel, Field, and FieldError composed according to documented invariants. ## Quick Start Ask the assistant to build a UI element with coss, for example: create an accessible delete confirmation dialog using coss AlertDialog components.High-intent search queries and answers about installing and using this skill.
Install coss components with the shadcn CLI by running npx shadcn@latest add @coss/<component>, such as @coss/dialog or @coss/select. For new projects, npx shadcn@latest init @coss/style sets up fonts and the full theme automatically.
Migrate by replacing Radix-style APIs with coss equivalents, such as render-based trigger composition instead of asChild, and array values with the multiple prop on Accordion instead of type="single". The migration rules reference documents these patterns per primitive.
Yes, coss components are built on @base-ui/react and assume Tailwind CSS v4 conventions for styling and theme tokens. Manual installs must include the documented dependencies and additional theme tokens like destructive-foreground and info.
Select handles single-choice from a predefined list without search, Combobox adds searchable filtering over a strict option set, and Autocomplete allows free-text input with suggestions. Choose based on whether search and free text are required.
Dialog layout breaks when DialogHeader, DialogPanel, and DialogFooter are wrapped in extra containers. Keep the header outside the form and wrap only the panel and footer in Form with className="contents" so the popup flex layout treats them as direct sections.
Avoid inventing custom markup when a primitive exists, and do not use trigger-based overlays for simple inline content. The Skill also excludes maintaining coss monorepo internals and editing registry internals unless explicitly requested.
cosscomGuide React developers in selecting, using, and migrating coss UI components.
sao-codingDeploy Expo apps to iOS, Android, web, and API routes using EAS.
MARUCIEBuild and audit UI components for WCAG AA conformance with semantic HTML, ARIA, and keyboard support.
nthplusioConfigures and scaffolds shadcn/ui in React projects with Tailwind CSS v4.