<Trans> breaks React JSX semantics with regards to booleans about js-lingui HOT 3 CLOSED

Thanks for report. I Actually have no idea how proper React code after transform should looks like. Currently your example would be transformed into:

<Text>
  <_Trans
    id={"ULdFKt"}
    message={"foo<0>{0}{1}</0>bar"}
    values={{
      0: false && "lol",
      1: true && "wut",
    }}
    components={{
      0: <span />,
    }}
  />
</Text>;

And these differences in semantics came from

values={{
      0: false && "lol",
      1: true && "wut",
    }}

Which are simply interpolated into the string like so:

`${false && "lol"}` // -≥ will print false

from js-lingui.

I probably found a solution:

If every value would be wrapped into JSX Fragment, than lingui/react's formatElements will treat them as JSX components and inline as children, thus JSX semantics would be preserved

values={{
-      0: false && "lol",
+      0: <>{false && "lol"}</>,
    }}

from js-lingui.

I think maybe it would be enough to do this for values that aren’t strings and numbers?

from js-lingui.