how to use ternary operator in sx material ui conditions

Question

I get a variable depending on its value, I want to set 0 or 3, I wrote the conditions, but it doesn't work for me, how can I fix it?

<Box sx={{ p: {withPadding ? '3' : '0'} }}>{children}</Box>

Answer 1

You have object for the value of p but should be just number, try this:

Box sx={{ p: withPadding ? 3 : 0 }}