fluent.js

fluent.js copied to clipboard

#230 made it possible to use <Localized> around text nodes rather than elements.

// BEFORE
<Localized id="...">
    <span>Hello</span>
</Localized>

// AFTER
<Localized id="...">
    Hello
</Localized>

Currently, if the wrapped node is a string, Localized always returns the translation as a simple string, too. As a consequence, the text-only form doesn't support any markup in translations.

If we allowed markup in text-only forms of Localized, the following would become possible:

<Localized id="..." em={<em/>}>
    {"Hello, <em>world</em>!"}
</Localized>

In order to achieve it, we might want to modify the return value of Localized to be a React.Fragment.