Add mageforge:theme:tokens command for Hyvä design token generation

[Copilot]

Implements mageforge:theme:tokens command to generate Hyvä design tokens via npx hyva-tokens, supporting design.tokens.json, Figma tokens, inline configurations, and custom CSS selectors.

Implementation

• New Command: TokensCommand at src/Console/Command/Theme/TokensCommand.php

  • Command name: mageforge:theme:tokens (shortcode: m:t:t)
  • Validates theme is Hyvä before execution
  • Requires node_modules installation
  • Executes in theme's web/tailwind directory using Shell service
  • Interactive theme selection or direct argument support

• Registration: Added mageforge_theme_tokens to src/etc/di.xml

• Documentation: Updated README.md, docs/commands.md, and CHANGELOG.md with command details and token configuration examples

Usage

# Interactive selection
bin/magento mageforge:theme:tokens

# Direct theme specification
bin/magento mageforge:theme:tokens Vendor/theme

# Shortcode
bin/magento m:t:t

Token Configuration Examples

Supports multiple token sources in hyva.config.json:

// Default tokens file
{"tokens": {"src": "design.tokens.json"}}

// Figma tokens
{"tokens": {"src": "acme.figma-tokens.json", "format": "figma"}}

// Inline tokens
{"tokens": {"values": {"colors": {"primary": {"DEFAULT": "oklch(54.6% 0.245 262.881)"}}}}}

// Custom CSS selector for Tailwind v3
{"tokens": {"cssSelector": ":root"}}

Generates generated/hyva-tokens.css in the theme's tailwind directory.

Warning

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

• https://api.github.com/repos/magento/magento-coding-standard/zipball/f24dd98f46a98cd7081e4648b19299c27db35264
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/JEqquD /usr/bin/composer create-project magento/magento-coding-standard --stability=dev /tmp/magento-coding-standard (http block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to the custom allowlist in this repository's Copilot coding agent settings (admins only)

Original prompt

---

This section details on the original issue you should resolve

<issue_title>Feature-Request: hyva-tokens</issue_title>
<issue_description>Magento 2 Version
latest
Hyvä Version

1.2.3

Is your feature request related to a problem? Please describe.
no

Describe the solution you'd like
add a command to create a hyva token
https://www.npmjs.com/package/@hyva-themes/hyva-modules?activeTab=readme#:~:text=hyva%2Dinit.-,hyva%2Dtokens,-This%20command%20creates

Sub Informations

• This command creates a generated/hyva-tokens.css from a design token input.

To run it, use: npx hyva-tokens.

By default, this will look for a design.tokens.json, but if you use Figma, you can configure it in hyva.config.json to use this file instead:

{
    "tokens": {
        "src": "acme.figma-tokens.json",
        "format": "figma"
    }
}

Since the format of Figma is diffrent, you need to also pass the format key with the value figma.

If you only need a few simple tokens, you can also create the tokens directly in hyva.config.json:

{
    "tokens": {
        "values": {
            "colors": {
                "primary": {
                    "lighter": "oklch(62.3% 0.214 259.815)",
                    "DEFAULT": "oklch(54.6% 0.245 262.881)",
                    "darker": "oklch(37.9% 0.146 265.522)"
                }
            }
        }
    }
}

By default, generated/hyva-tokens.css will be created in the Tailwind v4 syntax. You can change the cssSelector to anything you want. For example, you could use :root to add support for Tailwind v3:

{
    "tokens": {
        "values": {
            "src": "...",
            "cssSelector": ":root"
        }
    }
}
```</issue_description>

## Comments on the Issue (you are @copilot in this section)

<comments>
</comments>

• Fixes Feature-Request: hyva-tokens #57

---

✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.