FormattedMessage react-intl breaks with Safari (not replacing dynamic values or tags)

Question

I'm testing on Macbook pro using Safari version 13.1.2 (13609.3.5.1.5). All testing is having display issues for Safari only. Chrome / FireFox / etc. work just fine.

What's displaying: Welcome, <b>{displayName}</b>

What it should be displaying: Welcome, Random Person

Here is the text (id).

"authenticated-subtitle-display-name": "Welcome, <b>{displayName}</b>",

Here is the message object being created with id.

import { defineMessages } from 'react-intl';

export default defineMessages({
  authenticatedSubtitleDisplayName: {
    id: `authenticated-subtitle-display-name`,
  },
});

Here is where it's used

<FormattedMessage
        values={{
          b: (chunks: React.ReactNode): React.ReactNode => <b>{chunks}</b>,
          displayName: name,
        }}
        {...messages.authenticatedSubtitleDisplayName}
      />

Here is how we have FormattedMessage setup in node_modules > react-intl > index.d.ts

import FormattedMessage from './src/components/message';
export { FormattedMessage };

Here is what's there re './src/components/message'

import * as React from 'react';
import type { Options as IntlMessageFormatOptions } from 'intl-messageformat';
import { MessageDescriptor } from '@formatjs/intl';
export interface Props<V extends Record<string, any> = Record<string, React.ReactNode>> extends MessageDescriptor {
    values?: V;
    tagName?: React.ElementType<any>;
    children?(nodes: React.ReactNodeArray): React.ReactElement | null;
    ignoreTag?: IntlMessageFormatOptions['ignoreTag'];
}
declare const MemoizedFormattedMessage: React.NamedExoticComponent<Props<Record<string, React.ReactNode>>>;
export default MemoizedFormattedMessage;

package.json

    "react-intl": "^5.24.4",