Parcel is not liking importing named and exported functions sharing the same name

[jamesmcallister]

🐛 bug report

Parcel is not liking importing named and exported functions.

🎛 Configuration (.babelrc, package.json, cli command)

babel.rc

{
  "plugins": ["babel-plugin-styled-components"]
}

{
  "scripts": {
    "start": "parcel index.html",
    "build": "parcel build"
  },
  "devDependencies": {
    "parcel": "^2.0.0"
  },
  "dependencies": {
    "babel-plugin-styled-components": "^1.13.2",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "styled-components": "^5.3.1"
  }
}

🤔 Expected Behavior

Should be defined

😯 Current Behavior

Worked fine with 2.0.0-nightly.842

💻 Code Sample

https://github.com/jamesmcallister/parcel-bug

🌍 Your Environment

Software	Version(s)
Parcel	2.0.0
Node	16.11.1
npm/Yarn	8.0.0/N/A
Operating System

[mischnic]

Reproduction:

import { Foo } from "./media.item";  // actual value doesn't matter

const S = {
	Foo: () => <div>S</div>,
};

console.log(<S.Foo />);

Output:

console.log(/*#__PURE__*/ _jsxRuntime.jsx(S._mediaItem.Foo, {}));

Looks like we incorrectly traverse into member expressions if they are JSX tag names, and the "Foo" property name is treated as though it was an identifier (so S[Foo])

[ross-pfahler]

Ran into the same at https://github.com/ross-pfahler/parcel-2-demos/tree/react-context -- common use case is to have a component named "Provider" and have a context provider -- eg MyContext.Provider.