Dynamic styles (unknown at runtime)

[leonard-henriquez]

I have a component to resize images.
The user can choose the width of it's images, I store it in my database and I use it to apply this width on the image at runtime.
The width can be any value (from 1px to 1000px).
How can I do that with Panda?

[astahmer]

depends !

if that value is dynamically retrieved but still deterministic, meaning this will NOT change at runtime, then you could use config.staticCss with all the known values of width that you can prefetch and import in the config to pregenerate those classNames

---

if that value will change at runtime, then not everything has to be static css, so you can just use the style attribute on your component <div style={{ width: props.width }} />