theo-ui

You enforce design token fidelity in React UI components by using library-aware governance that audits outputs against official token systems. This skill validates that components use library primitives and Violet Forge tokens instead of hand-rolled styling.

A slop-test is a 32-gate validation process that checks React component outputs for accessibility, responsiveness, and token compliance before handoff. It ensures assembled UIs meet design-system standards and library composite rules.

To migrate a React project to token-based components, use audit and migrate workflows that identify non-compliant UI code and replace it with official library composites. This enforces design-system rules while maintaining cross-surface compatibility.

Yes, this design-system governance skill works across agent-chat, cloud-dashboard, settings-form, marketing, and auth surfaces. It uses shared references and design-system sources to ensure consistent library composites and token fidelity across all UI surfaces.

Yes, you need a React project referencing @theokit/ui to use this skill effectively. The audit, migrate, and catalog workflows depend on library-aware primitives and composites from @theokit/ui to enforce token-based styling and design-system rules.

Using library composites instead of custom React components ensures token fidelity, accessibility compliance, and responsive constraints. This approach passes a 32-gate slop-test and guarantees UI outputs conform to design-system rules before handoff, reducing maintenance overhead.