TLUiMessageValues

Values for a message rendered as an element. Alongside the primitives a string message takes, a value may be an element, and a function may be given for a tag that appears in the message, which receives the text that tag encloses. Either way the markup stays out of the string, so a translator gets one whole sentence to reorder rather than fragments that can only be concatenated.

type TLUiMessageValues = Record<
  string,
  ((chunks: ReactNode) => ReactNode) | ReactNode | TLUiTranslationValues[string]
>;

Example

<F
  defaultMessage="<who>{name}</who> joined. {help}"
  id="example.joined"
  values={{
    name: "Ada",
    who: (chunks) => <strong>{chunks}</strong>,
    help: <a href="/help">Need help?</a>,
  }}
/>;