number token identifiers get converted to string when strictTokens is turned on

[thecodrr]

Description

number token identifiers get converted to string when strictTokens is turned on. For example, this:

spacing: {
        0: { value: '0px' },
        1: { value: '5px' },
        2: { value: '10px' },
        3: { value: '15px' },
        4: { value: '20px' },
        5: { value: '25px' },
        6: { value: '30px' },
        7: { value: '35px' },
        8: { value: '40px' },
        9: { value: '45px' },
        10: { value: '50px' },
        11: { value: '55px' },
        12: { value: '60px' }
      }

Gets turned into the following type:

export type SpacingToken = "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "-0" | "-1" | "-2" | "-3" | "-4" | "-5" | "-6" | "-7" | "-8" | "-9" | "-10" | "-11" | "-12"

This means when I try to use these tokens in properties, I get a type error:

Type 'number' is not assignable to type 'ConditionalValue<WithEscapeHatch<"auto" | SpacingToken | `var(--${string})`>> | undefined'.

For the following code:

<Heading mb={1} size="h3">

Link to Reproduction

https://play.panda-css.com/dpPQkhbEls

Steps to reproduce

See this happening the the Panda Playground: https://play.panda-css.com/dpPQkhbEls

JS Framework

NextJS

Panda CSS Version

0.47.0

Browser

Mozilla Firefox 1.31.0.3

Operating System

• macOS
• Windows
• Linux

Additional Information

No response

[segunadebayo]

I discussed this with @astahmer, and we prefer to keep it as strings for now.

Two reasons:

• We're weary about increasing the generated types' size, primarily due to the impact it can have on the TS Server's perf.
• Using strings provides better autocompletion DX. Number tokens are harder to work it

Thanks for understanding.

I appreciate you taking the time to work on a PR as well. If you really want this, consider making it into a plugin
https://panda-css.com/docs/concepts/hooks