Re: [csswg-drafts] [css-values-5] What is the MVP for inline conditionals on custom properties? (#10064)

@LeaVerou @fantasai et al. this is amazing!  I'm a bit late to the party but I have two questions:

1) Can we change the keywords/names from `if`/`else`?  This feature is amazing but as a programmer those keywords just feels wrong in this context.  As we know, in most programming languages `if` is a keyword associated with a statement (or statement block) not an expression (value).  I think the `if` keyword would make sense if it had an associated declaration block (`if(){}`) like `@media(){}` or `@container(){}` but that's not what's going on here.  

So what could we call it?  I had a preprocessor based implementation called `ternary()` that was based on Ana Tudor's space toggles (and the ubiquitous programming language ternary expression i.e. `condition ? valueIfTrue : valueIfFalse`) that seems to perfectly match what's actually going on here (evaluating a conditional expression to a value):

```
--color: ternary( style(--type: success), var(--green-60), var(--red-60) );
```

But this has the issue you seemed to want to avoid where you need to nest multiple ternaries to evaluate multiple conditions (I didn't mind this because as a programmer I'm used to it and the use case was hidden in a library that rarely changed but I understand the motivation to avoid this):

```
--color: ternary(
  style(--type: success), var(--green-60), 
  ternary(
    style(--type: warning), var(--orange-60),
     var(--red-60)
  )
);
```

So what could the keywords be?

In a lot of ways your proposed syntax makes me think of `switch` (e.g. the colons and semicolons). I think using `default` instead of `else` makes sense but using `switch` would have the same issue that it's associated with statements not expressions and then the additional issue that the programming language `switch` does not allow for multiple conditions, just multiple cases (values).  My below suggestion probably doesn't work because of the loaded meaning of selection in CSS but throwing this out as it might lead to something better:

```
--color: select(
  style(--type: success): var(--green-60); 
  style(--type: warning): var(--orange-60),
  default:  var(--red-60)
);
```

Maybe `choose`?

```
--color: choose(
  style(--type: success): var(--green-60); 
  style(--type: warning): var(--orange-60),
  default:  var(--red-60)
);
```

That brings me to my second question which might illuminate a better keyword...

2) What exactly is meant by "empty token stream"?  There doesn't seem to be a definition in the draft and a google search for `site:https://csswg.org "empty token stream"` only brings up the draft itself so where is this term defined and what does it mean exactly?

Thanks for this amazing feature and for your consideration regarding not using a ubiquitous programming keyword with such a well established meaning.

-- 
GitHub Notification of comment by edbaafi
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/10064#issuecomment-2677437462 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Monday, 24 February 2025 04:56:40 UTC