Transform key values

[sarjanen]

Hi!

Would love to be able to transform keys and values with a custom function, maybe pass it in to createdStyled? If I havent missed anything it shouldn't be too much work, can gladly help.

I knwo that we have withTransform but i need to transform keys and values before deepMerge is called and the only workaround ive seen is to write my own custom createStyledElementComponent function.

[sarjanen]

Okey I could transform my styles in driver function.

[sarjanen]

Seems like useStyletron css doesn't goes through driver so this issue is still relevant.

[tajo]

Could you wrap/reexport useStyletron() and apply the transform there?

[sarjanen]

Could you wrap/reexport useStyletron() and apply the transform there?

Smart! Then I don’t need to create a new hook. Still think this issue is a good feature tho. My primary goal with transform is to extract shorthand’s and I think that’s something most people want to do if they want to get as much as possible out of styletron.

[tajo]

What do you mean by extracting shorthands?

[sarjanen]

What do you mean by extracting shorthands?

I’m extracting padding, margin, flex and border shorthands to long hands. padding: 0 24px for example becomes paddingTop: 0, paddingRight: 24px, ... and so on. This way we minimize the amount of classes we possible can create.

[bonzali]

If you have a theme as implemented in the baseui library, you can solve this by creating in the theme objects a Theme.mixin.margin function and either pass in a string , or parameters to apply to the shorthand properties