Integration guide for shadcn/ui components with OKLCH design tokens. Use when setting up shadcn, customizing themes, or adding components to Next.js projects. Auto-trigger on /init --tokens --shadcn flag.
Implement WCAG compliance using semantic HTML, ARIA, keyboard navigation, and screen reader support. Use when building inclusive applications for all users.
Use for React integration patterns and best practices in dojo.js. Triggers: dojo react, react hooks, effect atoms, Result.match, infinite scroll dojo, DojoSdkProvider, useDojoSDK, react patterns
Use when managing game state with Zustand in dojo.js. Triggers: dojo state, zustand dojo, game state, createDojoStore, optimistic update, getEntity, mergeEntities, state management, revert transaction
Resolves React hook violations (rules of hooks, useEffect dependencies, hook ordering).
Standardize typed forms in this repo. Use whenever a feature needs a form or an existing form is being refactored. Prefer SchemaForm + formFields + zod for typed inputs and consistent UI/validation; use react-hook-form Controller only for custom fields that SchemaForm cannot render.
Guidelines for formatting TypeScript code in the fx-fetch package.
Convert UI screenshots and designs to working code. Use when translating visual designs, mockups, or screenshots into HTML/CSS/React components.
Guide for implementing Tailwind CSS - a utility-first CSS framework for rapid UI development. Use when styling applications with responsive design, dark mode, custom themes, or building design systems with Tailwind's utility classes.
Core JavaScript language features, patterns, and best practices including ES6+ syntax, async/await, closures, prototypes, and modern development patterns
Comprehensive Vue.js development skill covering Composition API, reactivity system, components, directives, and modern Vue 3 patterns based on official Vue.js documentation
Comprehensive Angular framework development covering components, directives, services, dependency injection, routing, and reactive programming based on official Angular documentation
Mobile-first responsive design covering fluid layouts, media queries, flexbox, grid, viewport units, and responsive images
Comprehensive React development with hooks, components, state management, context, effects, and performance optimization based on official React documentation
Enforces Modular CSS Architecture, requiring specific CSS files for Filament components instead of global styles.
Best practices for Livewire 3 components, focusing on performance attributes and Flux UI integration.
Guide for working with gomponents, a pure Go HTML component library. Use this skill when reading or writing gomponents code, or when building HTML views in Go applications.
Provides React/Next.js component guidelines focusing on testability, Server Components, entity/gateway pattern, and directory structure. Use when implementing components, refactoring code, organizing project structure, extracting conditional branches, or ensuring code quality standards.
Data visualization with Recharts 3.x including responsive charts, custom tooltips, animations, and accessibility for React applications
Keyboard focus management patterns for accessibility. Covers focus traps, roving tabindex, focus restore, skip links, and FocusScope components for WCAG-compliant interactive widgets.
shadcn/ui component patterns including CVA variants, OKLCH theming, cn() utility, and composition. Use when adding shadcn components, building variant systems, or customizing themes.
Use this skill for internationalization (i18n) in React applications. Covers ALL user-facing strings, date/time handling, locale-aware formatting (useFormatting hook), ICU MessageFormat, Trans component, and RTL/LTR support.
