hyva-alpine-component

What problem does it solve?

This skill helps Magento 2 developers craft CSP-safe Alpine.js components for Hyvä themes, ensuring interactivity without violating Content Security Policy.

Core Features & Use Cases

• CSP-safe patterns for Hyvä Alpine components that work with Alpine CSP builds.
• Guidance on secure registration with Alpine.data inside alpine:init and proper escaping of PHP values.
• Use Case: Add a small interactive widget (e.g., tabbed content or modal) to a Hyvä template while maintaining CSP compliance.

Quick Start

Create a CSP-safe Alpine component by defining a named constructor function and registering it with Alpine.data inside an alpine:init listener, using {once: true} and escaping values appropriately.