code-quality

Name: code-quality
Availability: InStock
Author: perceptlabs

Enforce React and UI quality rules for Wiggum projects.

Updated Jan 17, 2026

Search Tags:#code quality #theming #best practices #accessibility #react #ui standards

Ready to run

npx skills add https://github.com/PerceptLabs/wiggum --skill code-quality-perceptlabs

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: code-quality
Source: https://github.com/PerceptLabs/wiggum/tree/main/apps/ide/src/skills/code-quality
Command: npx skills add https://github.com/PerceptLabs/wiggum --skill code-quality-perceptlabs

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill enforces critical code quality, accessibility, and theming standards to ensure consistency and maintainability across Wiggum projects.

Core Features & Use Cases

React Best Practices: Guides on state management, performance, and imports.
Accessibility: Ensures forms, interactive elements, and modals are usable by everyone.
Theming: Mandates correct usage of CSS variables for dark mode and theming.
Use Case: When developing a new feature, this skill acts as a linter and guide, preventing common mistakes related to accessibility, performance, and theming before they are committed.

Quick Start

Apply the code-quality skill to review the current project's adherence to Wiggum's coding standards.

Frequently Asked Questions about code-quality

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I enforce React and UI quality standards for accessibility and theming?▼

You can enforce React and UI quality standards by applying rules that validate state management, accessibility, dark mode theming, and CSS syntax. This prevents common mistakes before code is committed.

What are the best practices for managing React state and performance in component development?▼

Best practices for React state and performance involve following strict guidelines on imports, context provider implementation, and state management patterns to ensure consistency and maintainability across projects.

How do I ensure my forms and modals meet accessibility requirements?▼

To meet accessibility requirements, apply non-negotiable standards for form inputs, interactive elements, and overlay components. This ensures forms and modals are usable by everyone.

How do I implement dark mode theming using CSS variables correctly?▼

Implement dark mode theming by mandating correct usage of CSS variables for theming. This includes adhering to strict CSS comment formatting to maintain consistent styling across the project.

Does this code quality tool require any specific dependencies or setup to run?▼

No specific dependencies are required to run this code quality tool. It operates as a standalone linter and guide, reviewing your project's adherence to established coding standards.

Why does my React context provider implementation fail quality checks?▼

React context provider implementations fail quality checks if they do not adhere to correct setup rules. Enforcing these standards ensures proper state management and performance across your application.