shadcn-ui-conventions

UI component conventions for 8-bit styled components. Use when working with shadcn/ui components or implementing retro-styled UI elements.

1. Zainstaluj skill w swoim projekcie, umieszczając go w katalogu .claude/skills/ lub zintegruj z systemem Claude/Copilot zgodnie z dokumentacją MCP.

2. Podczas tworzenia nowego komponentu UI w katalogu components/ui odwołaj się do skill, aby uzyskać prawidłową strukturę importów — najpierw biblioteki zewnętrzne (class-variance-authority, @radix-ui), potem utils wewnętrzne (@/lib/utils), następnie komponenty bazowe i arkusze stylów retro.

3. Dla komponentów 8-bitowych eksportuj interfejs typów osobno (np. export interface BitButtonProps) zamiast definiować props inline, aby zachować czytelność i zgodność z konwencją.

4. Pamiętaj, że katalog components/ui jest wyłączony z lintowania Biome — jeśli chcesz ręcznie sprawdzić formatowanie, uruchom npx biome check components/ui/.

5. Kiedy modyfikujesz istniejące komponenty shadcn/ui lub dodajesz retro-stylizację, upewnij się, że importujesz arkusz stylów retro (@/components/ui/8bit/styles/retro.css) na końcu listy importów.

6. Stosuj skill jako referencję przy każdym nowym komponencie — zapewnia spójność całego projektu i ułatwia współpracę zespołu nad interfejsem użytkownika.