RFC: Support for boolean variant aliases

ivoilic commented 6 months ago

Description

This PR is a proof of concept for a feature: I often find myself creating variants using a series of mutually exclusive boolean aliases for brevity and readability.

For example, in the case of a React component I'd much rather have: <Component primary /> than <Component intent="primary" />.

This feature would allow variants to function as such when prefixed with an underscore:

const example = cva({
  variants: {
    _intent: { primary: "class-a", secondary: "class-b" },
    size: { sm: "class-s", md: "class-m", lg: "class-l" },
  },
});

example({ _intent: "primary",  size: "md" });  // Outputs "class-a class-m"
example({ primary: true,  size: "md" });  // Also outputs "class-a class-m"

The mutually exclusive nature of the variants is enforced with typing:

example({ primary: true,  secondary: true});  // Causes a typescript error

example({ _intent: "primary",  secondary: true});  
// Valid but the alias will override the variant resulting in "class-b"

Additional context

My naming for this pattern is all over the place, I wasn't sure what to call it. (Exclusive variant aliases?) I've added a basic rough implementation with typescript enforcement and some tests. I'm of course open to any feedback or suggestions.

What is the purpose of this pull request?

[ ] Bug fix
[X] New Feature
[ ] Documentation update
[ ] Other

Before submitting the PR, please make sure you do the following

[X] Read the Contributing Guidelines.
[X] Follow the Style Guide.
[X] Check that there isn't already a PR that solves the problem the same way to avoid creating a duplicate.
[X] Provide a description in this PR that addresses what the PR is solving, or reference the issue that it solves (e.g. fixes #123).

vercel[bot] commented 6 months ago

@ivoilic is attempting to deploy a commit to the cva Team on Vercel.

A member of the Team first needs to authorize it.

joe-bell commented 5 months ago

Really appreciate you getting involved @ivoilic, but I'm going to choose not to go with this approach for now as I don't fully understand the benefits. Happy to revisit another time 🙏

ming-codes commented 2 months ago

I believe the benefit is to enable shorthands.

joe-bell / cva