D
design-context
Refresh UI/UX context from design system, Storybook, and codebase
Installation
Pick a client and clone the repository into its skills directory.
Installation
About this skill
Refresh UI/UX context from design system, Storybook, and codebase
How to use
- Zainstaluj skill design-context w swoim środowisku pracy (Cursor, Copilot lub innym agencie wspierającym MCP). 2. Przed rozpoczęciem pracy nad wireframe'ami lub zmianami UI uruchom skill w trybie DIVERGE, aby odświeżyć kontekst designu. 3. W fazie pierwszej przeczytaj dokumentację systemu designu — zwróć uwagę na design tokeny (np. h-13, px-4), warianty komponentów (Button, DataTable, Dialog) oraz konwencje spacing (p-4 dla kart, gap-6 dla sekcji). 4. W fazie drugiej przeszukaj Storybook w ścieżkach /src/stories/ i /features//components/.stories.tsx, aby znaleźć komponenty pasujące do Twoich potrzeb i sprawdzić ich dostępne warianty oraz stany (loading, error, empty). 5. W fazie trzeciej użyj semantic search, aby znaleźć w kodzie podobne już zaimplementowane wzorce, reusable hooks i utility'e. 6. W fazie czwartej, jeśli napotkasz nieznaną bibliotekę (Radix UI, TanStack Query, TanStack Table), zapytaj dokumentację za pośrednictwem Context7 MCP, aby potwierdzić dostępne opcje i best practices.