diff --git a/workspaces/theme/plugins/bc-test/package.json b/workspaces/theme/plugins/bc-test/package.json index 5cf3ce442..0effc71eb 100644 --- a/workspaces/theme/plugins/bc-test/package.json +++ b/workspaces/theme/plugins/bc-test/package.json @@ -35,7 +35,8 @@ "dependencies": { "@backstage/core-components": "^0.15.1", "@backstage/core-plugin-api": "^1.10.0", - "@backstage/plugin-user-settings": "^0.8.16" + "@backstage/plugin-user-settings": "^0.8.16", + "@mui/material": "^5" }, "peerDependencies": { "react": "^16.13.1 || ^17.0.0 || ^18.0.0" diff --git a/workspaces/theme/plugins/bc-test/src/index.ts b/workspaces/theme/plugins/bc-test/src/index.ts index 636952634..5945eb96b 100644 --- a/workspaces/theme/plugins/bc-test/src/index.ts +++ b/workspaces/theme/plugins/bc-test/src/index.ts @@ -13,4 +13,12 @@ * See the License for the specific language governing permissions and * limitations under the License. */ +import { unstable_ClassNameGenerator as ClassNameGenerator } from '@mui/material/className'; + +ClassNameGenerator.configure(componentName => { + return componentName.startsWith('v5-') + ? componentName + : `v5-${componentName}`; +}); + export * from './plugin'; diff --git a/workspaces/theme/plugins/mui4-test/package.json b/workspaces/theme/plugins/mui4-test/package.json index e650092c3..84ce34917 100644 --- a/workspaces/theme/plugins/mui4-test/package.json +++ b/workspaces/theme/plugins/mui4-test/package.json @@ -38,7 +38,8 @@ "@backstage/plugin-user-settings": "^0.8.16", "@material-ui/core": "^4.9.13", "@material-ui/icons": "^4.9.1", - "@material-ui/lab": "^4.0.0-alpha.61" + "@material-ui/lab": "^4.0.0-alpha.61", + "@mui/material": "^5" }, "peerDependencies": { "react": "^16.13.1 || ^17.0.0 || ^18.0.0" diff --git a/workspaces/theme/plugins/mui4-test/src/index.ts b/workspaces/theme/plugins/mui4-test/src/index.ts index 636952634..5945eb96b 100644 --- a/workspaces/theme/plugins/mui4-test/src/index.ts +++ b/workspaces/theme/plugins/mui4-test/src/index.ts @@ -13,4 +13,12 @@ * See the License for the specific language governing permissions and * limitations under the License. */ +import { unstable_ClassNameGenerator as ClassNameGenerator } from '@mui/material/className'; + +ClassNameGenerator.configure(componentName => { + return componentName.startsWith('v5-') + ? componentName + : `v5-${componentName}`; +}); + export * from './plugin'; diff --git a/workspaces/theme/plugins/mui5-test/src/index.ts b/workspaces/theme/plugins/mui5-test/src/index.ts index 636952634..5945eb96b 100644 --- a/workspaces/theme/plugins/mui5-test/src/index.ts +++ b/workspaces/theme/plugins/mui5-test/src/index.ts @@ -13,4 +13,12 @@ * See the License for the specific language governing permissions and * limitations under the License. */ +import { unstable_ClassNameGenerator as ClassNameGenerator } from '@mui/material/className'; + +ClassNameGenerator.configure(componentName => { + return componentName.startsWith('v5-') + ? componentName + : `v5-${componentName}`; +}); + export * from './plugin'; diff --git a/workspaces/theme/yarn.lock b/workspaces/theme/yarn.lock index 99549c757..353c00419 100644 --- a/workspaces/theme/yarn.lock +++ b/workspaces/theme/yarn.lock @@ -10066,6 +10066,7 @@ __metadata: "@backstage/dev-utils": ^1.1.2 "@backstage/plugin-user-settings": ^0.8.16 "@backstage/test-utils": ^1.7.0 + "@mui/material": ^5 "@testing-library/jest-dom": ^6.0.0 "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0 @@ -10090,6 +10091,7 @@ __metadata: "@material-ui/core": ^4.9.13 "@material-ui/icons": ^4.9.1 "@material-ui/lab": ^4.0.0-alpha.61 + "@mui/material": ^5 "@testing-library/jest-dom": ^6.0.0 "@testing-library/react": ^14.0.0 "@testing-library/user-event": ^14.0.0