[Feature request] Lint values in a object

[arekbartnik]

Is your feature request related to a problem? Please describe.
Can't lint values in an object passed to a callee.

My list of callees: ["clsx", "cva"].

This doesn't work:

const buttons = cva({
  variants: {
    variant: {
      primary: "bg-white text-black font-bold px-4",
      secondary: "bg-black text-white font-semibold px-5",
    },
  },
});

This does:

const buttons = cva({
  variants: {
    variant: {
      primary: clsx("bg-white text-black font-bold px-4"),
      secondary: clsx("bg-black text-white font-semibold px-5"),
    },
  },
});

Describe the solution you'd like
I would like for the first example to work.

[robotkutya]

any progress with this?

this would be awesome!

[francoismassart]

The MR #185 does not fix this specific issue

[dipsaus9]

@francoismassart It looks like bg-white and bg-red are no contradicting classes in the test setup. This is no different then
classNames or classes.

So linting in a object should be closed, a new issue should be opened for linting contradicting classes for background in tailwind.

[dipsaus9]

Found the issue in the example
bg-red is not a valid Tailwind class. This should be a gradient of red, for example red-50. If added red-50 eslint will give you an error.

[francoismassart]

Fixed in the latest release v3.8.0