Negative value in classname and Outline offset.

[mickeyWoW]

Environment:

tailwindcss-classnames version: 3.0.5

Problem1 - Negative value

When I try to use negative value in classname, it says there is no matched types.
For example, when I set left to -16px, we can set in classname "-left-4" but it shows error in this module.

I was tried to find solution without modifying inside module. But there was no way.

Solution:

At first, I have changed npm module and it worked.

node_modules/tailwindcss-classnames/dist/bundle.ts

type TUtilityFunction = (
...args: Array<
| T
| `-${T}` // Added prefix here
| `!${T}`
| `${TPseudoClassVariants}${T}`
| `${TPseudoClassVariants}!${T}`
| null
| undefined
| {[key in T | `${TPseudoClassVariants}${T}` | `-${T}`/* Added prefix here */ | `!${T}` | `${TPseudoClassVariants}!${T}` | TTailwindString]?: boolean}
| TTailwindString
) => TTailwindString;

Or

After I did like first solution, I was tried to find another solution.
I generated custom module named tailwindcss-classnames.ts and made changes.

The same way as above

Problem2 - Outline offset

When I tried change outline offset in tailwind css, we should set outline-offset-2.
But there is no way to set outline offset.

Solution

export type TOutlineOffset =
| 'outline-offset-0' // Make change 'outline-0' to 'outline-offset-0'
| 'outline-offset-1'
| 'outline-offset-2'
| 'outline-offset-4'
| 'outline-offset-8'