resolveConfig returns wrong TypeScript type for theme keys

[OpenSnack]

What version of Tailwind CSS are you using?

3.2.4

What build tool (or framework if it abstracts the build tool) are you using?

Vite 3.2.4

What version of Node.js are you using?

16.18.1

What browser are you using?

N/A

What operating system are you using?

Linux

Reproduction URL

Repro on CodeSandbox (may take a second or click in the editor for the IDE to pick up the type issue)

Describe your issue

Using the recently exposed resolveConfig types, many config keys (such as theme.colors) throw TS errors:

ResolvableTo<T> is an internal type that equals T | ((utils: PluginUtils) => T) - presumably a type that gets resolved during resolveConfig. The expected colour key (gray, in this case) doesn't exist on the function type, causing the issue. I suspect the resolved config should return the expected RecursiveKeyValuePair type with ResolvableTo removed.

[RobinMalfait]

Hey! Thank you for your bug report!
Much appreciated! 🙏

This should be fixed by #9972, and will be available in the next release.

You can already try it by using the insiders build npm install tailwindcss@insiders.

[curtgrimes]

I experienced this issue because I did not have the type annotation in my tailwind.config.js:

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    // ...
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}