⚠️ Note: CVA support was added to Drupal core 11.4! If you're on 11.4 or later, you do not need this module; if you're a theme developer, you can use core's CVA support exactly as described below. This module will not be released for Drupal 12, and is no longer being worked on.

Exposes Twig's built-in html_cva function to Drupal templates, enabling Class Variance Authority (CVA) for managing component variants. Useful for building reusable components with Tailwind CSS and other utility-first frameworks. This helps manage component variants (size, color, style, etc.) in Twig templates using a CVA pattern, similar to shadcn/ui and other component libraries.

Usage Example

{% set button = html_cva(
  base: 'button',
  variants: {
    variant: { primary: 'bg-blue', secondary: 'bg-gray' },
    size: { sm: 'text-sm', md: 'text-base', lg: 'text-lg' }
  }
) %}

<button class="{{ button.apply({variant: 'primary', size: 'md'}) }}">
  Click me
</button>

Project information

Releases