compound-components-migration

Plan, implement, and review admin page migrations to Compound Components and TabbedForm.

Updated Apr 3, 2026
One-click install
npx skills add https://github.com/OZVE/cuarta-avenida --skill compound-components-migration
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: compound-components-migration
Source: https://github.com/OZVE/cuarta-avenida/tree/main/.claude/skills/compound-components-migration-review
Command: npx skills add https://github.com/OZVE/cuarta-avenida --skill compound-components-migration

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Admin page migrations to Compound Components and TabbedForm are error-prone, risking behavioral regressions when refactoring forms, tabs, and context providers.

Core Features & Use Cases

  • Implementation mode for migrating list and detail pages to Compound Components
  • Review mode to verify diffs against regression checklists and known hotspots
  • Guidance for dynamic tabs, context typing, and submission guards to prevent regressions during migration

Quick Start

Initialize an implementation-mode migration for compound components and run the review checklist to ensure safety.

Frequently Asked Questions about compound-components-migration

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

FAQPage Schema
How do I safely migrate React admin forms to compound components without regressions?

To safely migrate React admin forms to compound components, use a structured migration plan covering list and detail pages, context boundaries, and tabbed form flows while validating diffs against a strict regression checklist to preserve behavior.

What is a TabbedForm migration and when do I need it for admin pages?

A TabbedForm migration refactors admin detail pages into modular tabbed form flows with dynamic tab visibility and keyboard submit safeguards. You need it when upgrading admin components to compound components while preventing behavioral regressions.

How do I prevent context boundary regressions when refactoring React admin components?

To prevent context boundary regressions during React admin component refactoring, align with repo-specific guidance covering context typing and known regression hotspots, then run a review mode to verify diffs against common regression checklists.

Can I review code diffs for dynamic tab visibility changes during a compound components migration?

Yes, you can review code diffs for dynamic tab visibility changes by running a review mode that checks diffs against known hotspots and regression checklists, ensuring dynamic tabs and keyboard submit safeguards function correctly post-migration.

What are common regressions when migrating to compound components in React admin panels?

Common regressions when migrating to compound components in React admin panels involve broken context boundaries, incorrect dynamic tab visibility, and failed keyboard submit safeguards, which are tracked and prevented using repo-specific common-regressions documentation.