[SelectField] Introduce new component

Minimum example of React Material-UI with the only TextField component imported - result bundle size is 250Kb!

https://github.com/pqr/react-mui-treeshake-does-not-work

webpack-bundle-analyzer shows everything is imported, nothing is tree shaked.

According to documentation https://material-ui.com/guides/minimizing-bundle-size/ tree-shaking should work, quote:

Tree-shaking of Material-UI works out of the box in modern frameworks. Material-UI exposes its full API on the top-level material-ui import. If you're using ES6 modules and a bundler that supports tree-shaking (webpack >= 2.x, parcel with a flag) you can safely use named imports and still get an optimised bundle size automatically:

import { Button, TextField } from '@material-ui/core';

But as shown in this minimum example it does not work out of the box.
I did several experiments, read through issues and StackOverflow and failed to find a solution.

• [+] The issue is present in the latest release.
• [+] I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

Bundle size of minimum app with the only TextField imported is about 250Kb, everything is included into bundle (analized with webpack-bundle-analyzer

Expected Behavior 🤔

Bundle should not contain any code not related to the only imported TextField, tree shake to be working

Steps to Reproduce 🕹

git clone git@github.com:pqr/react-mui-treeshake-does-not-work.git
cd react-mui-treeshake-does-not-work
npm install
npm run build
npm run analyze

Your Environment 🌎

Start by cloning the linked reproduction repository and running npm install, npm run build, and npm run analyze. Use webpack-bundle-analyzer to confirm which Material-UI code is included when only TextField is imported, then trace the related import and bundling behavior. Done means identifying the cause and establishing that unrelated code is excluded or documenting the limitation.