Description

When I set a spacing token as the value of size, I expect the spacer pattern to create a gap of that size. However, it generates invalid css without translating the spacing token.

The only way for it to work is to pass the raw token value to the size prop.

<>
  {/* This shows a type error but works */}
  <Spacer size={token('spacing.5')} />
</>

<>
  {/* This doesn't show a type error and doesn't work */}
  <Spacer size='5' />
</>

Link to Reproduction

https://play.panda-css.com/7mkpuWf-QN

Steps to reproduce

No response

JS Framework

No response

Panda CSS Version

v1.9.0

Browser

No response

Operating System

• macOS
• Windows
• Linux

Additional Information

No response