heroui-migration

Fetches and applies HeroUI v2-to-v3 breaking-change MDX guides via Node scripts.

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/junevm/avtoolz --skill heroui-migration-junevm
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: heroui-migration
Source: https://github.com/junevm/avtoolz/tree/main/.agents/skills/heroui-migration
Command: npx skills add https://github.com/junevm/avtoolz --skill heroui-migration-junevm

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires fetch, and includes scripts (resource) components.

What problem does it solve?

Migrating a HeroUI v2 application to HeroUI v3 is error-prone because the component APIs and runtime patterns change in breaking ways, causing build failures and incorrect UI behavior.

Core Features & Use Cases

  • Migration workflow guidance for agents: Covers how to plan, fetch, and apply full or incremental migration steps.
  • Component-specific migration docs retrieval: Fetches per-component MDX guides to upgrade usage (including API changes like flat props to compound components).
  • Styling and hooks migration support: Provides targeted steps for Tailwind v4 styling changes and hooks-to-compound migration (including removal of Provider patterns).

Quick Start

Tell your agent to fetch the full migration workflow and then retrieve the specific component guides for the components your codebase uses.

Frequently Asked Questions about heroui-migration

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

FAQPage Schema
How do I migrate a HeroUI v2 application to HeroUI v3?

To migrate HeroUI v2 to v3, you fetch breaking-change MDX documentation using bundled Node scripts and apply the v2-to-v3 transformation rules for component upgrades, event handler renaming, and styling changes. This workflow supports both full and incremental migration scenarios.

What breaking changes do I need to handle for HeroUI v3 component upgrades?

HeroUI v3 component upgrades involve transitioning from flat props to compound components, renaming event handlers, migrating Tailwind v4 styling, and removing hooks and Provider patterns. The Skill fetches per-component MDX guides detailing these specific API and runtime pattern transformations.

Can I incrementally migrate my HeroUI v2 app to v3?

Yes, you can perform an incremental HeroUI migration by fetching specific component guides and applying transformation rules individually. The migration workflow supports planning and executing targeted steps for each component your codebase uses, rather than requiring a single full migration.

Does the HeroUI migration workflow support Tailwind v4 styling changes?

Yes, the HeroUI v3 migration workflow provides targeted steps for Tailwind v4 styling changes. It fetches MDX guides that document how to update styling patterns from v2 to v3, ensuring your component styles remain compatible after the migration.

How do I remove hooks and Provider patterns when upgrading to HeroUI v3?

Removing hooks and Provider patterns during HeroUI v3 migration requires following the hooks-to-compound migration steps in the fetched MDX guides. The documentation provides specific transformation rules to replace removed Provider patterns with the new v3 compound component APIs.

Do I need Node scripts to fetch HeroUI migration documentation?

Yes, the HeroUI migration workflow requires using bundled Node scripts to fetch MDX guides from the configured documentation base. These scripts retrieve the per-component breaking-change documentation that agents follow to apply the correct v2-to-v3 transformations.