Fix spreadVariantGroups regex

[mohammadsiyou]

Typically Tailwind detects '!' before class name and after all variants.

The ! always goes at the beginning of the utility name, after any variants, but before any prefix:

<div class="sm:hover:!tw-font-bold">

But twin just detect '!' at the end of class name.So lets compare the output of two same twin classes:

input:

tw`sm:block! sm:hover:block`

output:

({
  "@media (min-width: 640px)": {
    "display": "block !important",
    ":hover": {
      "display": "block"
    }
  }
});

and

input:

tw`sm:!block sm:hover:block`

output:

({
  "@media (min-width: 640px)": {
    "display": "block !important",
    "@media (min-width: 640px)": {
      ":hover": {
        "display": "block"
      }
    }
  }
});

so in order to twin works in both situation we must change regex at spreadVariantGroups a little bit!

[ben-rogerson]

Nice work finding and fixing this - it's going in!

[ben-rogerson]

Nice work finding and fixing this - it's going in!