[css-values] Emulate conditionals with discontinuous function(s) in calc()

[litherum]

calc() doesn't support conditionals (e.g. if statements) today, and that is a good thing. We shouldn't add conditionals.

However, it is pretty natural to want to write piecewise functions with calc(). Conditionals are certainly sufficient to express piecewise functions, but they aren't actually necessary - all you need is a discontinuous basis function. min() and max() are almost expressive enough, but not really. Edit: This could be polyfilled by max(), but we might want to do better here.

(This kind of thing is actually pretty common in GPU programming, where programmers often try to write branchless code because branches are particularly slow on many GPUs. I'm cribbing from common patterns in GPU software.)

One way to do this would be if we added a step() function, which looks like this:

For example, if the author wanted to express "use x^2 if x is positive but use 2*x if x is negative" they could do it like this:

calc(step(var(--x)) * pow(var(--x), 2) + (1 - step(var(--x))) * 2 * var(--x))

A simpler way for authors, but just as expressive, would be to add something like select(a, b, condition). This would result in a if condition is greater than 0, and b otherwise. The same example written this way would be:

calc(select(pow(var(--x), 2), 2 * var(--x), var(--x))

This seems like not much implementation burden, but a significant increase in power / flexibility for authors.

[litherum]

Oh, I guess step() could be polyfilled by max(0, var(--x)) / var(--x). That's kind of yucky, though.

[Loirooriol]

No, max(0, var(--x)) / var(--x) is NaN for 0. Use sign() instead, this usecase was the reason I proposed it in #4673

So "use x^2 if x is positive but use 2*x if x is negative (and use +0 if x is ±0)" is

calc(max(0, sign(var(--x))) * pow(var(--x), 2) - min(0, sign(var(--x))) * 2 * var(--x))

In #4731 (comment) I wrote a summary for writing if(cond, then, else) in terms of sign().

[litherum]

Yeah, sign() is almost sufficient, except for the 0 case.

[litherum]

I guess if you could use math in @when that would be sufficient 🤔 These rules are outside of a particular selector though, so I'm not sure how that would work...

@when var(--x) > 0 {
    --result: pow(var(--x), 2)
} @else {
    --result: calc(2 * var(--x));
}

[Loirooriol]

Yeah, sign() is almost sufficient, except for the 0 case.

What's the problem for 0? If you want something special for 0, you can use (1 - abs(sign(var(--x)))) * value

Having proper conditionals would be better of course, but for now sign() seems good enough.

[fantasai]

We added if() so this original request is no longer valid. If we need to add addition math functions, they should be filed as new issues for that purpose.