Get the token value as a number on web

[wcastand]

currently useCSSVariables makes little sense and can't be used on multiple platform app.
it return a different type based on platform.

for useCSSVariable("--spacing-4")
on native i get a number 16
on web i get a string 16px

since we don't want to add a class to handle the headerHeight in uniwind.
I get a custom layout hook to calculate the header and add it to the paddingTop but now then because of the inconsistency of useCSSVariables i can't do that on web or i would need to parse the output myself, which i find bad.

what would be your recommendation for this case? since i'm guessing you made the choice to have useCSSVariables change the return type per platform and not have it consistent :/

[Brentlok]

Hi! Thanks for the discussion.

We purposely rely on getComputedStyle to avoid bundling a heavy, complex parser to handle things like variables, calc, and viewport units.

Updating this logic would be a breaking change requiring us to build a new hook and deprecate the old one. Since this is essentially a fallback utility and not part of the core functionality, we don't have plans to change this behavior in the near future.

Your best bet here is to implement a custom hook on your end per platform to handle the web variable parsing.

[wcastand]

a hook like useToken is not even a consideration? to access the value?

[Brentlok]

Currently, we return the value exactly as the platform provides it (strings with "px" on web, numbers on native). Normalizing this across platforms isn't as simple as just parsing "px" into a number. If we did that, it would break as soon as someone used rem, percentages, or calc() and would open issue to add support for his exact case.

To do it right, we'd have to build and maintain a parser for all CSS units, which is a level of overhead we aren't looking to add to the library right now.