Sizing Prefs should be settable in a value other than number (of pixels)

[JayPanoz]

At the moment the helper for transforming the Playground preferences into CSS custom properties assumes everything is set in px (and actually adds the unit for type number when turning it into a string).

In theory, you could set the value as a string e.g. 16px, 1rem, 1em, etc. w/o too many issues for most of these properties, although the value will be set AS-IS, without any validity check – which is consistent with CSS, actually.

But things may not ba as easy as adding string as an accepted input, since we may need to handle these sizes programmatically at some point, or maybe not, it is unclear at the moment.

Assuming line-length properties aren’t impacted; what’s for sure at the moment is:

• Breakpoints would have to be updated, since the hook hardcodes px, but that shouldn’t be a major problem.
• Another issue is one of consistency, since offsets can only be numbers due to the fact they are mapped to the React Aria tooltip component, so any other value would have to be computed to a number first.

This may warrant an helper that handles unit values, etc. but there is a lot of unknowns, which is why I’m opening this issue to not forget about it, and possibly discuss what would be best as it impacts preferences, with the potential to entirely mess up the Playground if some value is not valid.