Skip to content

Conversation

thecrypticace
Copy link
Contributor

@thecrypticace thecrypticace commented Aug 26, 2025

This PR fixes two issues:

  • When a variant is defined by matchVariant it could match unknown values but not apply the variant (because it's unknown). This would result in a utility being output that is the same as a bare utility without variants but a longer name. These were intended to be discarded but weren't done so correctly.
  • Similarly, when we encounter a known value but its not a string the same thing would happen where we'd output a utility without applying the variant. This was also intended to be discarded.

Basically given this code:

matchVariant(
  "foo",
  (value) => `&:is([data-foo='${value}'])`,
  {
    values: {
      DEFAULT: "",
      bar: "bar",
      obj: { some: "object" },
    },
  }
)

And this HTML:

<div class="foo-bar:bg-none foo-[baz]:bg-none foo-baz:bg-none foo-obj:bg-none"></div>

This CSS would be produced:

@layer utilities {
  .foo-bar\:bg-none {
    &:is([data-foo='bar']) {
      background-image: none;
    }
  }
  /* this one shouldn't be here */
  .foo-baz\:bg-none {
    background-image: none;
  }
  /* this one shouldn't be here */
  .foo-obj\:bg-none {
    background-image: none;
  }
  .foo-\[baz\]\:bg-none {
    &:is([data-foo='baz']) {
      background-image: none;
    }
  }
}

@thecrypticace thecrypticace marked this pull request as ready for review August 26, 2025 13:46
@thecrypticace thecrypticace requested a review from a team as a code owner August 26, 2025 13:46
@thecrypticace thecrypticace merged commit ee987e3 into main Aug 26, 2025
7 checks passed
@thecrypticace thecrypticace deleted the fix/match-variant-unknown-value branch August 26, 2025 14:21
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants