hyva-ui-component

What problem does it solve?

This Skill enables developers to apply Hyva UI template-based components to a Hyvä theme by sourcing component files from a Hyva UI package and placing them into the theme directory, accelerating UI customization without manual file-by-file setup.

Core Features & Use Cases

• Theme-aware installation: Identify the target Hyvä theme under app/design/frontend and prepare it for component installation.
• Component discovery & variants: List available non-CMS components and their variants, read each component's README for dependencies and requirements, and present viable options.
• Safe file operations: Copy component source files into the theme while preserving existing files, merging XML/layout changes when necessary, and tracking which files were created vs updated.
• Dependency handling: Automatically apply required plugin and component dependencies, as documented by the component READMEs.
• Output & verification: Produce a clear summary of modified files and any new configuration options added to view.xml.

Quick Start

Use this skill to install a non-CMS Hyva UI component into your Hyvä theme by selecting your theme, choosing a component and variant, then following the prompts to copy files and apply dependencies. The skill will report created and updated files and will prompt about optional Tailwind or asset recompilation if applicable.

Note: this Quick Start is a high-level guide; follow on-screen prompts for exact commands and paths.

To see all steps, refer to the component README provided with the Hyva UI package.