According to the mui docs they provide a modern folder with components written for modern browsers which they suggest could be used to target just those browsers. How can I (or do I not need to?) setup webpack so that it rewrites imports of the form import {Box} from "@mui/material" (as advised by option 2 in the docs using babel-plugin-direct-import) to use the modern version? Ideally, without having to change the import in each file to the form import Box from "@mui/material/modern/Box" What about producing a separate version for the modern browsers to serve it to those browsers?

Sorry to ask such a 'how do I' style question, but googling mui and modern wasn't a very productive search :-).