hyva-themes/hyva-ai-tools
12 skills8.7k installs936 starsGitHub
Install
npx skills add https://github.com/hyva-themes/hyva-ai-toolsSkills in this repo
1Hyva Exec Shell Cmdhyva-exec-shell-cmd is a utility skill from hyva-themes/hyva-ai-tools that other Magento agent skills reference before executing shell commands. It auto-detects whether the project runs under Warden, docker-magento, DDEV, or a plain local install, then supplies the appropriate command wrapper so bin/magento, composer, and module scripts run inside the correct container or host context. Developers reach for hyva-exec-shell-cmd when building or maintaining Hyvä-themed Magento stores with AI agents that would otherwise fail on environment-specific path and exec differences. The skill is designed as shared infrastructure: consuming skills call it first instead of hard-coding docker exec or warden shell prefixes.820installs2Hyva Alpine Componenthyva-alpine-component is a hyva-themes/hyva-ai-tools skill for writing CSP-compatible Alpine.js in Hyvä Magento 2 themes. The skill covers Alpine CSP patterns that operate without unsafe-inline eval, x-data component structure, and interactivity added to Hyvä PHTML templates. Trigger phrases include create alpine component, add interactivity, alpine for hyva, x-data component, and csp compatibility. Developers reach for hyva-alpine-component when Magento 2 storefronts on Hyvä need client-side behavior that passes strict Content Security Policy headers without breaking theme conventions.813installs3Hyva Child Themehyva-child-theme is a Magento 2 frontend scaffolding skill from hyva-themes/hyva-ai-tools that generates a complete Hyvä child theme in one workflow. The skill creates the proper theme directory layout, registers the theme with Magento, and wires Tailwind CSS compilation so styles build against the parent Hyvä theme. It chains three companion skills—hyva-exec-shell-cmd, hyva-theme-list, and hyva-compile-tailwind-css—to run shell commands inside the Magento container and validate the result. Developers reach for hyva-child-theme when starting a new custom Hyvä theme instead of hand-copying boilerplate from Hyvä docs. Trigger phrases include "create hyva child theme", "new hyva theme", and "initialize theme".796installs4Hyva Render Media Imagehyva-render-media-image is a hyva-themes/hyva-ai-tools skill for producing correct responsive image code in Hyvä Theme templates via the \Hyva\Theme\ViewModel\Media view model. Instead of manually crafting picture elements, srcset lists, and mobile-desktop breakpoints, the skill emits Hyvä-native markup for hero images, product photos, responsive banners, and template images triggered by phrases like render image, picture element, or banner image. Developers reach for hyva-render-media-image when building Magento 2 storefronts on Hyvä and need accessible, breakpoint-aware images that follow the theme's Media API. The skill targets PHTML or template additions where wrong srcset syntax breaks LCP on product and category pages.791installs5Hyva Ui Componenthyva-ui-component is a hyva-themes/hyva-ai-tools skill that applies template-based non-CMS Hyva UI components to a Hyvä Magento 2 theme. It lists available components such as headers, footers, galleries, menus, and minicarts with variants, displays component README instructions, and copies files from {hyva_ui_path}/components/ into app/design/frontend/{Vendor}/{Theme}/. The skill requires companion skills hyva-exec-shell-cmd, hyva-theme-list, hyva-child-theme, and hyva-compile-tailwind-css. Developers reach for hyva-ui-component when extending a Hyvä child theme with prebuilt UI blocks instead of authoring layouts from scratch. Tailwind CSS compilation integrates through the required hyva-compile-tailwind-css dependency.791installs6Hyva Compile Tailwind Csshyva-compile-tailwind-css is a Hyvä AI Tools skill that compiles Tailwind CSS for Hyvä themes running on Magento 2. It handles both development and production stylesheet generation when developers need to build styles, generate CSS, or fix Tailwind classes that stopped applying after template edits. The skill requires hyva-exec-shell-cmd and hyva-theme-list as prerequisites and triggers on phrases like compile tailwind, build styles, generate css, styles not working, or styles are missing. Developers on Magento 2 Hyvä storefronts reach for this skill whenever UI classes fail to render because the CSS pipeline was not recompiled after template changes.786installs7Hyva Theme Listhyva-theme-list is a Hyvä Themes skill that quickly finds every Hyvä theme directory inside a Magento 2 codebase. Themes are identified by the presence of web/tailwind/package.json, which signals a Hyvä Tailwind frontend setup. Developers run bash scripts/list_hyva_themes.sh from the Magento project root to print available theme paths, making it the first step before Tailwind builds, theme overrides, or chaining other Hyvä AI tools that need a theme location. Trigger phrases include list hyva themes, find themes, show themes, available themes, and theme paths. The skill is intentionally narrow and script-driven, optimized for agents that must locate Hyvä assets without manually grepping vendor and app/design directories. Reach for hyva-theme-list whenever a Magento 2 Hyvä customization session starts and the correct theme path is unknown.785installs8Hyva Create Modulehyva-create-module is a hyva-themes/hyva-ai-tools utility skill that creates new Magento 2 modules in app/code/ with configurable dependencies. The skill generates registration.php, composer.json, and module.xml boilerplate and is designed to be called by other Hyvä skills needing module scaffolding, requiring the hyva-exec-shell-cmd skill for command execution inside the development environment. Developers reach for hyva-create-module when they need to create, scaffold, or generate a custom Magento 2 module rather than hand-writing registration and composer files.781installs9Hyva Playwright Testhyva-playwright-test is a Playwright testing skill tailored to Hyvä Magento storefronts that replaced Luma KnockoutJS, RequireJS, and jQuery with Alpine.js and Tailwind CSS. Playwright strict mode rejects ambiguous locators, which clashes with Alpine.js DOM patterns where hidden elements persist on the page. The skill triggers on phrases like write playwright test, playwright alpine, test hyva page, e2e test, and playwright selector. Developers use it when creating page objects, debugging flaky locators, or adding E2E coverage for Hyvä checkout and component flows.780installs10Hyva Cms Componenthyva-cms-component is a skill from hyva-themes/hyva-ai-tools that scaffolds CMS-ready components for Magento storefronts using Hyvä theme conventions. It produces blocks, widgets, and Tailwind CSS plus Alpine.js UI patterns so merchandising content ships faster without fighting legacy Luma layouts. Developers reach for hyva-cms-component when CMS pages need hero banners, promo grids, or content modules that must match Hyvä performance and accessibility standards. The skill encodes theme conventions—utility classes, Alpine interactions, and Magento block structure—so generated components drop into Page Builder or custom layouts with minimal rework.525installs11Hyva Cms Custom Fieldhyva-cms-custom-field in hyva-themes/hyva-ai-tools walks developers through defining, registering, and rendering custom fields in the Hyvä CMS layer on Magento storefronts. The skill covers merchant-managed content blocks beyond default page builder fields, including supplemental metadata and merchandising data that must surface in Hyvä templates. Agents guide field schema creation, admin configuration, and Tailwind-friendly frontend rendering patterns consistent with Hyvä Theme conventions. Developers reach for hyva-cms-custom-field when a Magento shop needs flexible CMS-driven sections—promotional bands, spec tables, SEO metadata, or category merchandising slots—without hard-coding copy in layout XML or PHP blocks. Output includes field definitions wired into Hyvä CMS and template snippets that read those values on the storefront. Triggers include Hyvä CMS custom field, Magento content block extension, merchant-editable merchandising data, and rendering extra CMS attributes in Hyvä pages. The workflow assumes an existing Hyvä + Magento codebase rather than greenfield theme scaffolding.518installs12Hyva Cms Components Dumphyva-cms-components-dump is a skill from hyva-themes/hyva-ai-tools that exports Hyvä Magento CMS block and component definitions into machine-readable output. Instead of manually browsing Magento admin theme structure, developers and coding agents pull canonical CMS layouts, blocks, and component metadata for scaffolding new storefront sections, auditing existing Hyvä templates, or planning migrations between theme versions. Reach for hyva-cms-components-dump when automating Hyvä storefront work, onboarding agents to a Magento codebase, or diffing CMS configuration before a theme upgrade. The dump gives structured definitions agents can search, transform, or regenerate into Tailwind-based Hyvä components without spelunking the admin UI.507installs