ESM import issue causing: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

[mo]

I have a project where I have used react-linkify successfully for several years. I'm currently upgrading this project to ESM (i.e. I'm putting "type": "module" into my own package.json file). I got most things in my app to work again using ESM but whenevert I open a page that renders a react linkify component I get this error:

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

I use the library like this:

import Linkify from 'react-linkify'
...
<Linkify>{comment}</Linkify>

If I print the Linkify like this: console.log('Linkify=', Linkify) it looks like this in the devtools:

I just to see if worked, I change the usage temporarily into <Linkify.default>{comment}</Linkify.default> and then it works.

However, Linkify.default is ugly... any ideas isn't my import working normally? Is it some kind of ESM/CJS interop layer used in react-linkify that is getting it the way here?

Does react-linkify support being imported in ESM projects?

Note: many other libraries can be imported just fine, like for example:
@stripe/react-stripe-js, @sentry/browser, @stripe/stripe-js/pure.js, react-router, react

[mo]

There is a tool to do quality checking on npm packages, i.e:

cd react-linkify
npm install @skypack/package-check --dev
npx package-check

This tool reports that react-linkify lacks an "ES Module Entrypoint" and points to this article:
//docs.skypack.dev/package-authors/package-checks#esm

I also found this article to be very very good for explaining ESM/CJS interop issues:
https://github.com/johnloy/esm-commonjs-interop-manual