react didn't invent that syntax. This is a standard piece of C like syntax that most (but not all) languages with curly braces share. JSX/TSX used in react don't make this choice for you, you can use any javascript syntax which can be used when passing a value (eg in a function invocation, or variable declaration). If you don't like it, you are perfectly free to declare a variable and set its value using a regular if / else block and use it directly from the template.
My point is this is not a syntax decision that React made, but svelte's syntax was (as far as I can tell) a decision.
I mean, yeah, the ternary operator is part of JS syntax. But it WAS React’s choice to not include any alternative way to if/else add an element (there is an if/else but only for the entire component, not just for conditionally adding one element within a component). So indirectly this is React’s syntax decision.
And this is typically how conditionals work in SolidJS, which also uses JSX but adds extra core components to handle conditionals and iteration. In fairness, this is largely because they can better support the reactivity model that SolidJS uses, but it's a convenient side effect.
