mui-component-mapper: Could not find module in path: '@mui/material/styled' [...] esm/dual-list-select/dual-list-select.js

[1dl3]

Scope: Material UI Component Mapper (Beta MUI migration)

Description:
I'm trying to use the material-ui mapper migration "@data-driven-forms/mui-component-mapper": "3.16.0-v5-beta" however I'm running into this issue. Am I missing something stupidly obvious ?

Codesandbox Sample

[Hyperkid123]

@rvsia i think its possible caused by the transform import paths. The module '@mui/material/styled' truly does not exist. We may have to exclude the @mui/material from the transformation.

[Hyperkid123]

@rvsia this could fix it. Can you try it out?

diff --git a/packages/mui-component-mapper/src/dual-list-select/dual-list-select.js b/packages/mui-component-mapper/src/dual-list-select/dual-list-select.js
index 732516d9..b9f63b7c 100644
--- a/packages/mui-component-mapper/src/dual-list-select/dual-list-select.js
+++ b/packages/mui-component-mapper/src/dual-list-select/dual-list-select.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { styled } from '@mui/material';
+import { styled } from '@mui/material/styles';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';

[rvsia]

@Hyperkid123 Yeah, this is definitely it!

[rvsia]

I will prepare a fix and new version.

[rvsia]

Fix released in 3.16.0-v5-beta-1, the example now works.

[rvsia]

@1dl3 Thank you so much for reporting this!

[1dl3]

oh wow thanks guys that was really fast!

[Hyperkid123]

🎉 This issue has been resolved in version 3.16.0 🎉

The release is available on

• react-form-renderer (@latest dist-tag)

• ant-component-mapper (@latest dist-tag)

• blueprint-component-mapper (@latest dist-tag)

• carbon-component-mapper (@latest dist-tag)

• mui-component-mapper (@latest dist-tag)

• pf4-component-mapper (@latest dist-tag)

• suir-component-mapper (@latest dist-tag)

Data-Driven-Forms.org!