From 14fd987822f062a6cb2d3d251e9b5c873773bb49 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20Dudak?= <michal@mui.com>
Date: Fri, 6 Sep 2024 12:35:45 +0200
Subject: [PATCH] [core] Remove Material UI dependency (#585)

---
 .../css/index.js                              |  25 +-
 .../css/index.tsx                             |  25 +-
 .../system/index.js                           |  19 +-
 .../system/index.tsx                          |  19 +-
 .../tailwind/index.js                         |  27 +-
 .../tailwind/index.tsx                        |  27 +-
 .../UnstyledCheckboxGroupNested.js            |  35 +-
 .../UnstyledCheckboxGroupNested.tsx           |  37 +-
 .../checkbox/UnstyledCheckboxIndeterminate.js |  16 +-
 .../UnstyledCheckboxIndeterminate.tsx         |  18 +-
 .../UnstyledCheckboxIndeterminateGroup.js     |  35 +-
 .../UnstyledCheckboxIndeterminateGroup.tsx    |  37 +-
 .../css-modules/index.js                      |  27 +-
 .../css-modules/index.tsx                     |  27 +-
 .../system/index.js                           |  19 +-
 .../system/index.tsx                          |  19 +-
 .../tailwind/index.js                         |  21 +-
 .../tailwind/index.tsx                        |  21 +-
 docs/next.config.mjs                          |   5 +-
 docs/package.json                             |   4 -
 docs/public/static/error-codes.json           |  23 +-
 docs/types/icons.d.ts                         |   2 -
 docs/types/material-ui.d.ts                   |  28 --
 package.json                                  |   1 -
 packages/mui-base/package.json                |   1 -
 pnpm-lock.yaml                                | 386 ------------------
 scripts/buildTypes.mjs                        | 157 -------
 scripts/sizeSnapshot/webpack.config.js        | 153 +------
 test/package.json                             |   2 -
 test/regressions/TestViewer.js                |  73 ++--
 test/regressions/webpack.config.js            |   2 -
 31 files changed, 434 insertions(+), 857 deletions(-)
 delete mode 100644 docs/types/icons.d.ts
 delete mode 100644 docs/types/material-ui.d.ts
 delete mode 100644 scripts/buildTypes.mjs

diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.js b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.js
index 31331694ff..4bb012eb2f 100644
--- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.js
+++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.js
@@ -4,7 +4,6 @@ import * as React from 'react';
 import * as Checkbox from '@base_ui/react/Checkbox';
 import * as CheckboxGroup from '@base_ui/react/CheckboxGroup';
 import * as Field from '@base_ui/react/Field';
-import Check from '@mui/icons-material/Check';
 
 export default function UnstyledCheckboxIndeterminateGroup() {
   return (
@@ -16,7 +15,7 @@ export default function UnstyledCheckboxIndeterminateGroup() {
             <Field.Root>
               <Checkbox.Root className="Checkbox" name="red">
                 <Checkbox.Indicator className="Checkbox-indicator">
-                  <Check className="Check" />
+                  <CheckIcon className="Check" />
                 </Checkbox.Indicator>
               </Checkbox.Root>
               <Field.Label className="Checkbox-label">Red</Field.Label>
@@ -24,7 +23,7 @@ export default function UnstyledCheckboxIndeterminateGroup() {
             <Field.Root>
               <Checkbox.Root className="Checkbox" name="green">
                 <Checkbox.Indicator className="Checkbox-indicator">
-                  <Check className="Check" />
+                  <CheckIcon className="Check" />
                 </Checkbox.Indicator>
               </Checkbox.Root>
               <Field.Label className="Checkbox-label">Green</Field.Label>
@@ -32,7 +31,7 @@ export default function UnstyledCheckboxIndeterminateGroup() {
             <Field.Root>
               <Checkbox.Root className="Checkbox" name="blue">
                 <Checkbox.Indicator className="Checkbox-indicator">
-                  <Check className="Check" />
+                  <CheckIcon className="Check" />
                 </Checkbox.Indicator>
               </Checkbox.Root>
               <Field.Label className="Checkbox-label">Blue</Field.Label>
@@ -150,3 +149,21 @@ function Styles() {
     </style>
   );
 }
+
+function CheckIcon(props) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path
+        d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.tsx b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.tsx
index 31331694ff..c535b250cc 100644
--- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.tsx
+++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/css/index.tsx
@@ -4,7 +4,6 @@ import * as React from 'react';
 import * as Checkbox from '@base_ui/react/Checkbox';
 import * as CheckboxGroup from '@base_ui/react/CheckboxGroup';
 import * as Field from '@base_ui/react/Field';
-import Check from '@mui/icons-material/Check';
 
 export default function UnstyledCheckboxIndeterminateGroup() {
   return (
@@ -16,7 +15,7 @@ export default function UnstyledCheckboxIndeterminateGroup() {
             <Field.Root>
               <Checkbox.Root className="Checkbox" name="red">
                 <Checkbox.Indicator className="Checkbox-indicator">
-                  <Check className="Check" />
+                  <CheckIcon className="Check" />
                 </Checkbox.Indicator>
               </Checkbox.Root>
               <Field.Label className="Checkbox-label">Red</Field.Label>
@@ -24,7 +23,7 @@ export default function UnstyledCheckboxIndeterminateGroup() {
             <Field.Root>
               <Checkbox.Root className="Checkbox" name="green">
                 <Checkbox.Indicator className="Checkbox-indicator">
-                  <Check className="Check" />
+                  <CheckIcon className="Check" />
                 </Checkbox.Indicator>
               </Checkbox.Root>
               <Field.Label className="Checkbox-label">Green</Field.Label>
@@ -32,7 +31,7 @@ export default function UnstyledCheckboxIndeterminateGroup() {
             <Field.Root>
               <Checkbox.Root className="Checkbox" name="blue">
                 <Checkbox.Indicator className="Checkbox-indicator">
-                  <Check className="Check" />
+                  <CheckIcon className="Check" />
                 </Checkbox.Indicator>
               </Checkbox.Root>
               <Field.Label className="Checkbox-label">Blue</Field.Label>
@@ -150,3 +149,21 @@ function Styles() {
     </style>
   );
 }
+
+function CheckIcon(props: React.SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path
+        d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.js b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.js
index 26b73c5315..db2d999f1f 100644
--- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.js
+++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.js
@@ -5,7 +5,6 @@ import { css, styled } from '@mui/system';
 import * as BaseCheckbox from '@base_ui/react/Checkbox';
 import * as CheckboxGroup from '@base_ui/react/CheckboxGroup';
 import * as Field from '@base_ui/react/Field';
-import Check from '@mui/icons-material/Check';
 
 export default function UnstyledCheckboxIndeterminateGroup() {
   return (
@@ -107,7 +106,23 @@ const Checkbox = styled(BaseCheckbox.Root)(
   `,
 );
 
-const CheckIcon = styled(Check)`
+const CheckIcon = styled(function CheckIcon(props) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path
+        d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+})`
   height: 100%;
   width: 100%;
 `;
diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.tsx b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.tsx
index 26b73c5315..f1ca4892d3 100644
--- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.tsx
+++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/system/index.tsx
@@ -5,7 +5,6 @@ import { css, styled } from '@mui/system';
 import * as BaseCheckbox from '@base_ui/react/Checkbox';
 import * as CheckboxGroup from '@base_ui/react/CheckboxGroup';
 import * as Field from '@base_ui/react/Field';
-import Check from '@mui/icons-material/Check';
 
 export default function UnstyledCheckboxIndeterminateGroup() {
   return (
@@ -107,7 +106,23 @@ const Checkbox = styled(BaseCheckbox.Root)(
   `,
 );
 
-const CheckIcon = styled(Check)`
+const CheckIcon = styled(function CheckIcon(props: React.SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path
+        d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+})`
   height: 100%;
   width: 100%;
 `;
diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.js b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.js
index 41a8de1373..36b79883be 100644
--- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.js
+++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.js
@@ -6,7 +6,6 @@ import { useTheme } from '@mui/system';
 import * as BaseCheckbox from '@base_ui/react/Checkbox';
 import * as CheckboxGroup from '@base_ui/react/CheckboxGroup';
 import * as Field from '@base_ui/react/Field';
-import Check from '@mui/icons-material/Check';
 
 function classNames(...classes) {
   return classes.filter(Boolean).join(' ');
@@ -41,7 +40,7 @@ export default function UnstyledCheckboxIntroduction() {
             <Label>
               <Checkbox name="red">
                 <Indicator>
-                  <Check className="w-full h-full" />
+                  <CheckIcon className="w-full h-full" />
                 </Indicator>
               </Checkbox>
               Red
@@ -49,7 +48,7 @@ export default function UnstyledCheckboxIntroduction() {
             <Label>
               <Checkbox name="green">
                 <Indicator>
-                  <Check className="w-full h-full" />
+                  <CheckIcon className="w-full h-full" />
                 </Indicator>
               </Checkbox>
               Green
@@ -57,7 +56,7 @@ export default function UnstyledCheckboxIntroduction() {
             <Label>
               <Checkbox name="blue">
                 <Indicator>
-                  <Check className="w-full h-full" />
+                  <CheckIcon className="w-full h-full" />
                 </Indicator>
               </Checkbox>
               Blue
@@ -113,7 +112,7 @@ const Indicator = React.forwardRef(function Indicator(props, ref) {
         )
       }
     >
-      <Check className="w-full h-full" />
+      <CheckIcon className="w-full h-full" />
     </BaseCheckbox.Indicator>
   );
 });
@@ -124,3 +123,21 @@ Indicator.propTypes = {
    */
   className: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
 };
+
+function CheckIcon(props) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path
+        d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.tsx b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.tsx
index e6f2e72b61..d7fff1317a 100644
--- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.tsx
+++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupIntroduction/tailwind/index.tsx
@@ -5,7 +5,6 @@ import { useTheme } from '@mui/system';
 import * as BaseCheckbox from '@base_ui/react/Checkbox';
 import * as CheckboxGroup from '@base_ui/react/CheckboxGroup';
 import * as Field from '@base_ui/react/Field';
-import Check from '@mui/icons-material/Check';
 
 function classNames(...classes: Array<string | undefined | null | false>) {
   return classes.filter(Boolean).join(' ');
@@ -40,7 +39,7 @@ export default function UnstyledCheckboxIntroduction() {
             <Label>
               <Checkbox name="red">
                 <Indicator>
-                  <Check className="w-full h-full" />
+                  <CheckIcon className="w-full h-full" />
                 </Indicator>
               </Checkbox>
               Red
@@ -48,7 +47,7 @@ export default function UnstyledCheckboxIntroduction() {
             <Label>
               <Checkbox name="green">
                 <Indicator>
-                  <Check className="w-full h-full" />
+                  <CheckIcon className="w-full h-full" />
                 </Indicator>
               </Checkbox>
               Green
@@ -56,7 +55,7 @@ export default function UnstyledCheckboxIntroduction() {
             <Label>
               <Checkbox name="blue">
                 <Indicator>
-                  <Check className="w-full h-full" />
+                  <CheckIcon className="w-full h-full" />
                 </Indicator>
               </Checkbox>
               Blue
@@ -108,8 +107,26 @@ const Indicator = React.forwardRef<HTMLSpanElement, BaseCheckbox.IndicatorProps>
           )
         }
       >
-        <Check className="w-full h-full" />
+        <CheckIcon className="w-full h-full" />
       </BaseCheckbox.Indicator>
     );
   },
 );
+
+function CheckIcon(props: React.SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path
+        d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.js b/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.js
index d7ce96b207..fdbe3794f7 100644
--- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.js
+++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.js
@@ -5,8 +5,6 @@ import * as BaseCheckbox from '@base_ui/react/Checkbox';
 import * as CheckboxGroup from '@base_ui/react/CheckboxGroup';
 import * as Field from '@base_ui/react/Field';
 import { styled } from '@mui/system';
-import HorizontalRule from '@mui/icons-material/HorizontalRule';
-import Check from '@mui/icons-material/Check';
 
 const colors = ['red', 'green', 'blue'];
 
@@ -99,12 +97,41 @@ const Checkbox = styled(BaseCheckbox.Root)(
   `,
 );
 
-const HorizontalRuleIcon = styled(HorizontalRule)`
+const HorizontalRuleIcon = styled(function HorizontalRuleIcon(props) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path d="M4 11h16v2H4z" fill="currentColor" />
+    </svg>
+  );
+})`
   height: 100%;
   width: 100%;
 `;
 
-const CheckIcon = styled(Check)`
+const CheckIcon = styled(function CheckIcon(props) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path
+        d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+})`
   height: 100%;
   width: 100%;
 `;
diff --git a/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.tsx b/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.tsx
index a19cf961c3..509faf68b5 100644
--- a/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.tsx
+++ b/docs/data/components/checkbox-group/UnstyledCheckboxGroupNested.tsx
@@ -5,8 +5,6 @@ import * as BaseCheckbox from '@base_ui/react/Checkbox';
 import * as CheckboxGroup from '@base_ui/react/CheckboxGroup';
 import * as Field from '@base_ui/react/Field';
 import { styled } from '@mui/system';
-import HorizontalRule from '@mui/icons-material/HorizontalRule';
-import Check from '@mui/icons-material/Check';
 
 const colors = ['red', 'green', 'blue'];
 
@@ -99,12 +97,43 @@ const Checkbox = styled(BaseCheckbox.Root)(
   `,
 );
 
-const HorizontalRuleIcon = styled(HorizontalRule)`
+const HorizontalRuleIcon = styled(function HorizontalRuleIcon(
+  props: React.SVGProps<SVGSVGElement>,
+) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path d="M4 11h16v2H4z" fill="currentColor" />
+    </svg>
+  );
+})`
   height: 100%;
   width: 100%;
 `;
 
-const CheckIcon = styled(Check)`
+const CheckIcon = styled(function CheckIcon(props: React.SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path
+        d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+})`
   height: 100%;
   width: 100%;
 `;
diff --git a/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.js b/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.js
index e8a8fe2acb..84c2d42668 100644
--- a/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.js
+++ b/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.js
@@ -3,7 +3,6 @@
 import * as React from 'react';
 import { styled } from '@mui/system';
 import * as BaseCheckbox from '@base_ui/react/Checkbox';
-import HorizontalRule from '@mui/icons-material/HorizontalRule';
 
 export default function UnstyledCheckboxIndeterminate() {
   return (
@@ -62,7 +61,20 @@ const Checkbox = styled(BaseCheckbox.Root)(
   `,
 );
 
-const HorizontalRuleIcon = styled(HorizontalRule)`
+const HorizontalRuleIcon = styled(function HorizontalRuleIcon(props) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path d="M4 11h16v2H4z" fill="currentColor" />
+    </svg>
+  );
+})`
   height: 100%;
   width: 100%;
 `;
diff --git a/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.tsx b/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.tsx
index e8a8fe2acb..e82b4c33ba 100644
--- a/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.tsx
+++ b/docs/data/components/checkbox/UnstyledCheckboxIndeterminate.tsx
@@ -3,7 +3,6 @@
 import * as React from 'react';
 import { styled } from '@mui/system';
 import * as BaseCheckbox from '@base_ui/react/Checkbox';
-import HorizontalRule from '@mui/icons-material/HorizontalRule';
 
 export default function UnstyledCheckboxIndeterminate() {
   return (
@@ -62,7 +61,22 @@ const Checkbox = styled(BaseCheckbox.Root)(
   `,
 );
 
-const HorizontalRuleIcon = styled(HorizontalRule)`
+const HorizontalRuleIcon = styled(function HorizontalRuleIcon(
+  props: React.SVGProps<SVGSVGElement>,
+) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path d="M4 11h16v2H4z" fill="currentColor" />
+    </svg>
+  );
+})`
   height: 100%;
   width: 100%;
 `;
diff --git a/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.js b/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.js
index 0cd0d808c6..c628e15173 100644
--- a/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.js
+++ b/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.js
@@ -3,8 +3,6 @@
 import * as React from 'react';
 import { styled } from '@mui/system';
 import * as BaseCheckbox from '@base_ui/react/Checkbox';
-import HorizontalRule from '@mui/icons-material/HorizontalRule';
-import Check from '@mui/icons-material/Check';
 
 const colors = ['Red', 'Green', 'Blue'];
 
@@ -111,12 +109,41 @@ const Checkbox = styled(BaseCheckbox.Root)(
   `,
 );
 
-const HorizontalRuleIcon = styled(HorizontalRule)`
+const HorizontalRuleIcon = styled(function HorizontalRuleIcon(props) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path d="M4 11h16v2H4z" fill="currentColor" />
+    </svg>
+  );
+})`
   height: 100%;
   width: 100%;
 `;
 
-const CheckIcon = styled(Check)`
+const CheckIcon = styled(function CheckIcon(props) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path
+        d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+})`
   height: 100%;
   width: 100%;
 `;
diff --git a/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.tsx b/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.tsx
index 0cd0d808c6..9c49ae6938 100644
--- a/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.tsx
+++ b/docs/data/components/checkbox/UnstyledCheckboxIndeterminateGroup.tsx
@@ -3,8 +3,6 @@
 import * as React from 'react';
 import { styled } from '@mui/system';
 import * as BaseCheckbox from '@base_ui/react/Checkbox';
-import HorizontalRule from '@mui/icons-material/HorizontalRule';
-import Check from '@mui/icons-material/Check';
 
 const colors = ['Red', 'Green', 'Blue'];
 
@@ -111,12 +109,43 @@ const Checkbox = styled(BaseCheckbox.Root)(
   `,
 );
 
-const HorizontalRuleIcon = styled(HorizontalRule)`
+const HorizontalRuleIcon = styled(function HorizontalRuleIcon(
+  props: React.SVGProps<SVGSVGElement>,
+) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path d="M4 11h16v2H4z" fill="currentColor" />
+    </svg>
+  );
+})`
   height: 100%;
   width: 100%;
 `;
 
-const CheckIcon = styled(Check)`
+const CheckIcon = styled(function CheckIcon(props: React.SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path
+        d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+})`
   height: 100%;
   width: 100%;
 `;
diff --git a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.js b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.js
index 98af321597..99c341de45 100644
--- a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.js
+++ b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.js
@@ -3,7 +3,6 @@
 import * as React from 'react';
 import * as Checkbox from '@base_ui/react/Checkbox';
 import { useTheme } from '@mui/system';
-import Check from '@mui/icons-material/Check';
 
 export default function UnstyledCheckboxIntroduction() {
   return (
@@ -14,7 +13,7 @@ export default function UnstyledCheckboxIntroduction() {
         defaultChecked
       >
         <Checkbox.Indicator className="Checkbox-indicator">
-          <Check className="Checkbox-icon" />
+          <CheckIcon className="Checkbox-icon" />
         </Checkbox.Indicator>
       </Checkbox.Root>
       <Checkbox.Root
@@ -22,7 +21,7 @@ export default function UnstyledCheckboxIntroduction() {
         aria-label="Basic checkbox, off by default"
       >
         <Checkbox.Indicator className="Checkbox-indicator">
-          <Check className="Checkbox-icon" />
+          <CheckIcon className="Checkbox-icon" />
         </Checkbox.Indicator>
       </Checkbox.Root>
       <Checkbox.Root
@@ -32,7 +31,7 @@ export default function UnstyledCheckboxIntroduction() {
         disabled
       >
         <Checkbox.Indicator className="Checkbox-indicator">
-          <Check className="Checkbox-icon" />
+          <CheckIcon className="Checkbox-icon" />
         </Checkbox.Indicator>
       </Checkbox.Root>
       <Checkbox.Root
@@ -41,7 +40,7 @@ export default function UnstyledCheckboxIntroduction() {
         disabled
       >
         <Checkbox.Indicator className="Checkbox-indicator">
-          <Check className="Checkbox-icon" />
+          <CheckIcon className="Checkbox-icon" />
         </Checkbox.Indicator>
       </Checkbox.Root>
       <Styles />
@@ -137,3 +136,21 @@ function Styles() {
     </style>
   );
 }
+
+function CheckIcon(props) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path
+        d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.tsx b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.tsx
index 98af321597..17b6f98355 100644
--- a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.tsx
+++ b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/css-modules/index.tsx
@@ -3,7 +3,6 @@
 import * as React from 'react';
 import * as Checkbox from '@base_ui/react/Checkbox';
 import { useTheme } from '@mui/system';
-import Check from '@mui/icons-material/Check';
 
 export default function UnstyledCheckboxIntroduction() {
   return (
@@ -14,7 +13,7 @@ export default function UnstyledCheckboxIntroduction() {
         defaultChecked
       >
         <Checkbox.Indicator className="Checkbox-indicator">
-          <Check className="Checkbox-icon" />
+          <CheckIcon className="Checkbox-icon" />
         </Checkbox.Indicator>
       </Checkbox.Root>
       <Checkbox.Root
@@ -22,7 +21,7 @@ export default function UnstyledCheckboxIntroduction() {
         aria-label="Basic checkbox, off by default"
       >
         <Checkbox.Indicator className="Checkbox-indicator">
-          <Check className="Checkbox-icon" />
+          <CheckIcon className="Checkbox-icon" />
         </Checkbox.Indicator>
       </Checkbox.Root>
       <Checkbox.Root
@@ -32,7 +31,7 @@ export default function UnstyledCheckboxIntroduction() {
         disabled
       >
         <Checkbox.Indicator className="Checkbox-indicator">
-          <Check className="Checkbox-icon" />
+          <CheckIcon className="Checkbox-icon" />
         </Checkbox.Indicator>
       </Checkbox.Root>
       <Checkbox.Root
@@ -41,7 +40,7 @@ export default function UnstyledCheckboxIntroduction() {
         disabled
       >
         <Checkbox.Indicator className="Checkbox-indicator">
-          <Check className="Checkbox-icon" />
+          <CheckIcon className="Checkbox-icon" />
         </Checkbox.Indicator>
       </Checkbox.Root>
       <Styles />
@@ -137,3 +136,21 @@ function Styles() {
     </style>
   );
 }
+
+function CheckIcon(props: React.SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path
+        d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.js b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.js
index 049b7a0aa5..71d289822f 100644
--- a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.js
+++ b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.js
@@ -3,7 +3,6 @@
 import * as React from 'react';
 import { styled } from '@mui/system';
 import * as BaseCheckbox from '@base_ui/react/Checkbox';
-import Check from '@mui/icons-material/Check';
 
 export default function UnstyledSwitchIntroduction() {
   return (
@@ -75,7 +74,23 @@ const Checkbox = styled(BaseCheckbox.Root)(
   `,
 );
 
-const CheckIcon = styled(Check)`
+const CheckIcon = styled(function CheckIcon(props) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path
+        d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+})`
   width: 100%;
   height: 100%;
 `;
diff --git a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.tsx b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.tsx
index 049b7a0aa5..8ee3705017 100644
--- a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.tsx
+++ b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/system/index.tsx
@@ -3,7 +3,6 @@
 import * as React from 'react';
 import { styled } from '@mui/system';
 import * as BaseCheckbox from '@base_ui/react/Checkbox';
-import Check from '@mui/icons-material/Check';
 
 export default function UnstyledSwitchIntroduction() {
   return (
@@ -75,7 +74,23 @@ const Checkbox = styled(BaseCheckbox.Root)(
   `,
 );
 
-const CheckIcon = styled(Check)`
+const CheckIcon = styled(function CheckIcon(props: React.SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path
+        d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+})`
   width: 100%;
   height: 100%;
 `;
diff --git a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.js b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.js
index d3d174a4b5..6834688918 100644
--- a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.js
+++ b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.js
@@ -4,7 +4,6 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import * as BaseCheckbox from '@base_ui/react/Checkbox';
 import { useTheme } from '@mui/system';
-import Check from '@mui/icons-material/Check';
 
 function classNames(...classes) {
   return classes.filter(Boolean).join(' ');
@@ -85,7 +84,7 @@ const Indicator = React.forwardRef(function Indicator(props, ref) {
         )
       }
     >
-      <Check className="w-full h-full" />
+      <CheckIcon className="w-full h-full" />
     </BaseCheckbox.Indicator>
   );
 });
@@ -96,3 +95,21 @@ Indicator.propTypes = {
    */
   className: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
 };
+
+function CheckIcon(props) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path
+        d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.tsx b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.tsx
index 25e27a7048..c7d4b5918c 100644
--- a/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.tsx
+++ b/docs/data/components/checkbox/UnstyledCheckboxIntroduction/tailwind/index.tsx
@@ -3,7 +3,6 @@
 import * as React from 'react';
 import * as BaseCheckbox from '@base_ui/react/Checkbox';
 import { useTheme } from '@mui/system';
-import Check from '@mui/icons-material/Check';
 
 function classNames(...classes: Array<string | undefined | null | false>) {
   return classes.filter(Boolean).join(' ');
@@ -80,8 +79,26 @@ const Indicator = React.forwardRef<HTMLSpanElement, BaseCheckbox.IndicatorProps>
           )
         }
       >
-        <Check className="w-full h-full" />
+        <CheckIcon className="w-full h-full" />
       </BaseCheckbox.Indicator>
     );
   },
 );
+
+function CheckIcon(props: React.SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+    >
+      <path
+        d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
diff --git a/docs/next.config.mjs b/docs/next.config.mjs
index 3eb062810f..97659e6bce 100644
--- a/docs/next.config.mjs
+++ b/docs/next.config.mjs
@@ -55,12 +55,15 @@ const nextConfig = {
     };
   },
   distDir: 'export',
-  transpilePackages: ['@mui/docs', '@mui/monorepo'],
+  transpilePackages: ['@mui/monorepo'],
   ...(process.env.NODE_ENV === 'production'
     ? {
         output: 'export',
       }
     : {}),
+  experimental: {
+    esmExternals: true,
+  },
 };
 
 export default withDocsInfra(nextConfig);
diff --git a/docs/package.json b/docs/package.json
index 2bc9c6f180..fdefa8d444 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -23,11 +23,7 @@
     "@emotion/server": "^11.11.0",
     "@emotion/styled": "^11.11.5",
     "@mdx-js/mdx": "^3.0.1",
-    "@mui/docs": "6.0.2",
-    "@mui/icons-material": "6.0.2",
-    "@mui/material": "6.0.2",
     "@mui/system": "6.0.2",
-    "@mui/types": "7.2.16",
     "@mui/utils": "6.0.2",
     "@react-spring/web": "^9.7.4",
     "@stefanprobst/rehype-extract-toc": "^2.2.0",
diff --git a/docs/public/static/error-codes.json b/docs/public/static/error-codes.json
index a6486f38f4..0967ef424b 100644
--- a/docs/public/static/error-codes.json
+++ b/docs/public/static/error-codes.json
@@ -1,22 +1 @@
-{
-  "1": "MUI: Expected valid input target. Did you use a custom `inputComponent` and forget to forward refs? See https://mui.com/r/input-component-ref-interface for more info.",
-  "2": "MUI: The `value` prop must be an array when using the `Select` component with `multiple`.",
-  "3": "MUI: Unsupported `%s` color.\nWe support the following formats: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla().",
-  "4": "MUI: The color provided to augmentColor(color) is invalid.\nThe color object needs to have a `main` property or a `%s` property.",
-  "5": "MUI: The color provided to augmentColor(color) is invalid.\n`color.main` should be a string, but `%s` was provided instead.\n\nDid you intend to use one of the following approaches?\n\nimport { green } from \"@mui/material/colors\";\n\nconst theme1 = createTheme({ palette: {\n  primary: green,\n} });\n\nconst theme2 = createTheme({ palette: {\n  primary: { main: green[500] },\n} });",
-  "6": "MUI: Unsupported non-unitless line height with grid alignment.\nUse unitless line heights instead.",
-  "7": "MUI: `capitalize(string)` expects a string argument.",
-  "8": "MUI: Unsupported `%s` color.\nWe support the following formats: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().",
-  "9": "MUI: Unsupported `%s` color.\nThe following formats are supported: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().",
-  "10": "MUI: unsupported `%s` color space.\nThe following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rgb, rec-2020.",
-  "11": "MUI: The color%s provided to augmentColor(color) is invalid.\nThe color object needs to have a `main` property or a `%s` property.",
-  "12": "MUI: The color%s provided to augmentColor(color) is invalid.\n`color.main` should be a string, but `%s` was provided instead.\n\nDid you intend to use one of the following approaches?\n\nimport { green } from \"@mui/material/colors\";\n\nconst theme1 = createTheme({ palette: {\n  primary: green,\n} });\n\nconst theme2 = createTheme({ palette: {\n  primary: { main: green[500] },\n} });",
-  "13": "Can not find utils in context. It looks like you forgot to wrap your component in LocalizationProvider, or pass dateAdapter prop directly.",
-  "14": "MUI: makeStyles is no longer exported from @mui/material/styles.\nYou have to import it from @mui/styles.\nSee https://mui.com/r/migration-v4/#mui-material-styles for more details.",
-  "15": "MUI: withStyles is no longer exported from @mui/material/styles.\nYou have to import it from @mui/styles.\nSee https://mui.com/r/migration-v4/#mui-material-styles for more details.",
-  "16": "MUI: withTheme is no longer exported from @mui/material/styles.\nYou have to import it from @mui/styles.\nSee https://mui.com/r/migration-v4/#mui-material-styles for more details.",
-  "17": "MUI: Expected valid input target. Did you use a custom `slots.input` and forget to forward refs? See https://mui.com/r/input-component-ref-interface for more info.",
-  "18": "MUI: `vars` is a private field used for CSS variables support.\nPlease use another name.",
-  "19": "MUI: `useColorScheme` must be called under <CssVarsProvider />",
-  "20": "MUI: The `experimental_sx` has been moved to `theme.unstable_sx`.For more details, see https://github.com/mui/material-ui/pull/35150."
-}
+{}
diff --git a/docs/types/icons.d.ts b/docs/types/icons.d.ts
deleted file mode 100644
index a233a9782c..0000000000
--- a/docs/types/icons.d.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-declare module '@mui/icons-material';
-declare module '@mui/icons-material/*';
diff --git a/docs/types/material-ui.d.ts b/docs/types/material-ui.d.ts
deleted file mode 100644
index faa100b8a8..0000000000
--- a/docs/types/material-ui.d.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-import type {
-  CssVarsTheme,
-  CssVarsPalette,
-  PaletteBackgroundChannel,
-  PaletteCommonChannel,
-  PaletteColorChannel,
-  PaletteTextChannel,
-  PaletteActionChannel,
-} from '@mui/material/styles/experimental_extendTheme';
-
-/**
- * Enhance the theme types to include new properties from the CssVarsProvider.
- * The theme is typed with CSS variables in `styled`, `sx`, `useTheme`, etc.
- */
-declare module '@mui/material/styles' {
-  // The palette must be extended in each node.
-  interface Theme extends Omit<CssVarsTheme, 'palette'> {}
-
-  // Extend the type that will be used in palette
-  interface CommonColors extends PaletteCommonChannel {}
-  interface PaletteColor extends PaletteColorChannel {}
-  interface TypeBackground extends PaletteBackgroundChannel {}
-  interface TypeText extends PaletteTextChannel {}
-  interface TypeAction extends PaletteActionChannel {}
-
-  // The extended Palette should be in sync with `extendTheme`
-  interface Palette extends CssVarsPalette {}
-}
diff --git a/package.json b/package.json
index 1314eaff74..922e1c73f9 100644
--- a/package.json
+++ b/package.json
@@ -80,7 +80,6 @@
     "@mui/internal-markdown": "^1.0.12",
     "@mui/internal-scripts": "^1.0.19",
     "@mui/internal-test-utils": "1.0.12",
-    "@mui/material": "6.0.2",
     "@mui/monorepo": "github:mui/material-ui#8094d0bf72a",
     "@mui/utils": "6.0.2",
     "@next/eslint-plugin-next": "^14.2.7",
diff --git a/packages/mui-base/package.json b/packages/mui-base/package.json
index 9fb7c50d51..e54b1dba8f 100644
--- a/packages/mui-base/package.json
+++ b/packages/mui-base/package.json
@@ -52,7 +52,6 @@
     "use-sync-external-store": "^1.2.2"
   },
   "devDependencies": {
-    "@mui/internal-babel-macros": "^1.0.1",
     "@mui/internal-test-utils": "1.0.12",
     "@testing-library/react": "^15.0.7",
     "@testing-library/user-event": "^14.5.2",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 3620b16c69..456e6f8c1b 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -67,9 +67,6 @@ importers:
       '@mui/internal-test-utils':
         specifier: 1.0.12
         version: 1.0.12(@babel/core@7.25.2)(@types/react-dom@18.3.0)(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
-      '@mui/material':
-        specifier: 6.0.2
-        version: 6.0.2(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       '@mui/monorepo':
         specifier: github:mui/material-ui#8094d0bf72a
         version: https://codeload.github.com/mui/material-ui/tar.gz/8094d0bf72a(encoding@0.1.13)
@@ -358,21 +355,9 @@ importers:
       '@mdx-js/mdx':
         specifier: ^3.0.1
         version: 3.0.1
-      '@mui/docs':
-        specifier: 6.0.2
-        version: 6.0.2(k43luvnjvbukxr2uxbgmdcf32i)
-      '@mui/icons-material':
-        specifier: 6.0.2
-        version: 6.0.2(@mui/material@6.0.2(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(@types/react@18.3.5)(react@18.3.1)
-      '@mui/material':
-        specifier: 6.0.2
-        version: 6.0.2(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       '@mui/system':
         specifier: 6.0.2
         version: 6.0.2(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1)
-      '@mui/types':
-        specifier: 7.2.16
-        version: 7.2.16(@types/react@18.3.5)
       '@mui/utils':
         specifier: 6.0.2
         version: 6.0.2(@types/react@18.3.5)(react@18.3.1)
@@ -588,9 +573,6 @@ importers:
         specifier: ^1.2.2
         version: 1.2.2(react@18.3.1)
     devDependencies:
-      '@mui/internal-babel-macros':
-        specifier: ^1.0.1
-        version: 1.0.1(@mui/utils@6.0.2(@types/react@18.3.5)(react@18.3.1))
       '@mui/internal-test-utils':
         specifier: 1.0.12
         version: 1.0.12(@babel/core@7.25.2)(@types/react-dom@18.3.0)(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@@ -661,12 +643,6 @@ importers:
       '@mui/internal-test-utils':
         specifier: 1.0.12
         version: 1.0.12(@babel/core@7.25.2)(@types/react-dom@18.3.0)(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
-      '@mui/joy':
-        specifier: 5.0.0-beta.48
-        version: 5.0.0-beta.48(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
-      '@mui/material':
-        specifier: 6.0.2
-        version: 6.0.2(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       '@playwright/test':
         specifier: 1.46.1
         version: 1.46.1
@@ -1936,68 +1912,6 @@ packages:
     peerDependencies:
       '@babel/core': ^7.25.2
 
-  '@mui/base@5.0.0-beta.40':
-    resolution: {integrity: sha512-I/lGHztkCzvwlXpjD2+SNmvNQvB4227xBXhISPjEaJUXGImOQ9f3D2Yj/T3KasSI/h0MLWy74X0J6clhPmsRbQ==}
-    engines: {node: '>=12.0.0'}
-    peerDependencies:
-      '@types/react': ^18.3.5
-      react: ^17.0.0 || ^18.0.0
-      react-dom: ^17.0.0 || ^18.0.0
-    peerDependenciesMeta:
-      '@types/react':
-        optional: true
-
-  '@mui/base@5.0.0-beta.53':
-    resolution: {integrity: sha512-WeLTX9zMQPxZ7w9oitDjxOZeQYDVx8JC/I81NUTdboyI7zp+K0ktpJ79gciruKf5Z9qD01+DfwzEisY05mk3QQ==}
-    engines: {node: '>=12.0.0'}
-    peerDependencies:
-      '@types/react': ^18.3.5
-      react: ^17.0.0 || ^18.0.0
-      react-dom: ^17.0.0 || ^18.0.0
-    peerDependenciesMeta:
-      '@types/react':
-        optional: true
-
-  '@mui/core-downloads-tracker@5.16.1':
-    resolution: {integrity: sha512-62Jq7ACYi/55Kjkh/nVfEL3F3ytTYTsdB8MGJ9iI+eRQv+Aoem5CPUAzQihUo25qqh1VkVu9/jQn3dFbyrXHgw==}
-
-  '@mui/core-downloads-tracker@6.0.2':
-    resolution: {integrity: sha512-Cg68oOlAfbJgMgvbCwcX3Y3HdygCl6X1nREYTdEWcEKUQhNarrC45Cc35mP+zA7p3ZXE/7FLiaTCCgwuSoef/Q==}
-
-  '@mui/docs@6.0.2':
-    resolution: {integrity: sha512-2iEOJbelGf+44CeRT1u7GuCui925Ot6nFIEDJEzcrvJFqw9+AMvzexjWe/emGQAGFAcjU1/4wZVUNKnW8SY8PQ==}
-    engines: {node: '>=14.0.0'}
-    peerDependencies:
-      '@mui/base': '*'
-      '@mui/icons-material': ^5.0.0 || ^6.0.0
-      '@mui/material': ^5.0.0 || ^6.0.0
-      '@mui/system': ^5.0.0 || ^6.0.0
-      '@types/react': ^18.3.5
-      chai: ^4.4.1
-      csstype: ^3.1.3
-      next: ^13.5.1 || ^14
-      react: ^17.0.0 || ^18.0.0 || ^19.0.0
-    peerDependenciesMeta:
-      '@types/react':
-        optional: true
-
-  '@mui/icons-material@6.0.2':
-    resolution: {integrity: sha512-WaTPSvKcx8X7NdWAHzJWDZv+YXvK0MUY8+JI/r4/q2GgIa5RW+n4+08CGX6jB7sWhU1R3zy28NfsDUwwQjOThw==}
-    engines: {node: '>=14.0.0'}
-    peerDependencies:
-      '@mui/material': ^6.0.2
-      '@types/react': ^18.3.5
-      react: ^17.0.0 || ^18.0.0 || ^19.0.0
-    peerDependenciesMeta:
-      '@types/react':
-        optional: true
-
-  '@mui/internal-babel-macros@1.0.1':
-    resolution: {integrity: sha512-Ixu0PibDw/i3yumvt0IY8FxmLdJy6lbfVosJ1MJymKdihhnTdOgQhyw+SHcn94ZMwJVF7E9kqPH8YmmZoGOhZA==}
-    engines: {node: '>=12.0.0'}
-    peerDependencies:
-      '@mui/utils': ^5.0.0
-
   '@mui/internal-docs-utils@1.0.12':
     resolution: {integrity: sha512-U5nkY88gi+a2MR6S2wXULPr7wscXFlLAatX2kn4S2bGGi/tLndSgmmzsvUKWMG/2bSnJ50F1frHnhgPkFM4znA==}
 
@@ -2013,58 +1927,11 @@ packages:
       react: ^18.2.0
       react-dom: ^18.2.0
 
-  '@mui/joy@5.0.0-beta.48':
-    resolution: {integrity: sha512-OhTvjuGl9I5IvpBr0BQyDehIW/xb2yteW6YglHJMdOb/279nItn76X1NBtPV9ImldNlBjReGwvpOXmBTTGER9w==}
-    engines: {node: '>=12.0.0'}
-    peerDependencies:
-      '@emotion/react': ^11.5.0
-      '@emotion/styled': ^11.3.0
-      '@types/react': ^18.3.5
-      react: ^17.0.0 || ^18.0.0
-      react-dom: ^17.0.0 || ^18.0.0
-    peerDependenciesMeta:
-      '@emotion/react':
-        optional: true
-      '@emotion/styled':
-        optional: true
-      '@types/react':
-        optional: true
-
-  '@mui/material@6.0.2':
-    resolution: {integrity: sha512-KrnkJFSyhsAh8V30DNUbWyRyxMi4ZHjFg1ikQGx+mUAIffFTYIEx9Q+Kxd3vCT0FUFGOmbsuh6F6yRhpybsjkg==}
-    engines: {node: '>=14.0.0'}
-    peerDependencies:
-      '@emotion/react': ^11.5.0
-      '@emotion/styled': ^11.3.0
-      '@mui/material-pigment-css': ^6.0.2
-      '@types/react': ^18.3.5
-      react: ^17.0.0 || ^18.0.0 || ^19.0.0
-      react-dom: ^17.0.0 || ^18.0.0 || ^19.0.0
-    peerDependenciesMeta:
-      '@emotion/react':
-        optional: true
-      '@emotion/styled':
-        optional: true
-      '@mui/material-pigment-css':
-        optional: true
-      '@types/react':
-        optional: true
-
   '@mui/monorepo@https://codeload.github.com/mui/material-ui/tar.gz/8094d0bf72a':
     resolution: {tarball: https://codeload.github.com/mui/material-ui/tar.gz/8094d0bf72a}
     version: 6.0.2
     engines: {pnpm: 9.7.1}
 
-  '@mui/private-theming@5.16.1':
-    resolution: {integrity: sha512-2EGCKnAlq9vRIFj61jNWNXlKAxXp56577OVvsts7fAqRx+G1y6F+N7Q198SBaz8jYQeGKSz8ZMXK/M3FqjdEyw==}
-    engines: {node: '>=12.0.0'}
-    peerDependencies:
-      '@types/react': ^18.3.5
-      react: ^17.0.0 || ^18.0.0
-    peerDependenciesMeta:
-      '@types/react':
-        optional: true
-
   '@mui/private-theming@6.0.2':
     resolution: {integrity: sha512-emddFcRhA0hPGVIwIbW5g0V8vtCgw2g/H/A7jTdGe7dpCWEPpp6jPIXRRKcEUWgmg91R6rBNfV+LFHxBxmZXOQ==}
     engines: {node: '>=14.0.0'}
@@ -2075,19 +1942,6 @@ packages:
       '@types/react':
         optional: true
 
-  '@mui/styled-engine@5.16.1':
-    resolution: {integrity: sha512-JwWUBaYR8HHCFefSeos0z6JoTbu0MnjAuNHu4QoDgPxl2EE70XH38CsKay66Iy0QkNWmGTRXVU2sVFgUOPL/Dw==}
-    engines: {node: '>=12.0.0'}
-    peerDependencies:
-      '@emotion/react': ^11.4.1
-      '@emotion/styled': ^11.3.0
-      react: ^17.0.0 || ^18.0.0
-    peerDependenciesMeta:
-      '@emotion/react':
-        optional: true
-      '@emotion/styled':
-        optional: true
-
   '@mui/styled-engine@6.0.2':
     resolution: {integrity: sha512-qd3Vlhted0SYVGotnCfVNcxff7vW2WN0fclbAexff60NeNS1qs/H/CImHEHUBiUGeNWMPRochbN6VF1arQ7/jA==}
     engines: {node: '>=14.0.0'}
@@ -2101,22 +1955,6 @@ packages:
       '@emotion/styled':
         optional: true
 
-  '@mui/system@5.16.1':
-    resolution: {integrity: sha512-VaFcClC+uhvIEzhzcNmh9FRBvrG9IPjsOokhj6U1HPZsFnLzHV7AD7dJcT6LxWoiIZj9Ej0GK+MGh/b8+BtSlQ==}
-    engines: {node: '>=12.0.0'}
-    peerDependencies:
-      '@emotion/react': ^11.5.0
-      '@emotion/styled': ^11.3.0
-      '@types/react': ^18.3.5
-      react: ^17.0.0 || ^18.0.0
-    peerDependenciesMeta:
-      '@emotion/react':
-        optional: true
-      '@emotion/styled':
-        optional: true
-      '@types/react':
-        optional: true
-
   '@mui/system@6.0.2':
     resolution: {integrity: sha512-AZv1/C4PuHgWFTA8YraIzl3FTVLdRz0RIMRwEADWZBdIhnuTHS/4+r8qE9+3CcpTHg1WsEu8btaO3AhQahSM9A==}
     engines: {node: '>=14.0.0'}
@@ -2141,26 +1979,6 @@ packages:
       '@types/react':
         optional: true
 
-  '@mui/utils@5.16.6':
-    resolution: {integrity: sha512-tWiQqlhxAt3KENNiSRL+DIn9H5xNVK6Jjf70x3PnfQPz1MPBdh7yyIcAyVBT9xiw7hP3SomRhPR7hzBMBCjqEA==}
-    engines: {node: '>=12.0.0'}
-    peerDependencies:
-      '@types/react': ^18.3.5
-      react: ^17.0.0 || ^18.0.0
-    peerDependenciesMeta:
-      '@types/react':
-        optional: true
-
-  '@mui/utils@6.0.0-beta.0':
-    resolution: {integrity: sha512-Slu5BBN7laJI5hZSQsksNz5DGJrftaDxuJx902Utu+W6Y8mv4dawc1lpYH13PXJHdO3Jw0JjQZwmYYTqMEqN5Q==}
-    engines: {node: '>=12.0.0'}
-    peerDependencies:
-      '@types/react': ^18.3.5
-      react: ^17.0.0 || ^18.0.0
-    peerDependenciesMeta:
-      '@types/react':
-        optional: true
-
   '@mui/utils@6.0.2':
     resolution: {integrity: sha512-TeFrYsxcmeoDSlkoPhX+LjIuuqC5Pyj+xz2kRceKCkUpwMNTEeVOfowXDPe+mboZwmpJ5ZxP4eiAgQMdeEasjg==}
     engines: {node: '>=14.0.0'}
@@ -2553,9 +2371,6 @@ packages:
   '@polka/url@1.0.0-next.25':
     resolution: {integrity: sha512-j7P6Rgr3mmtdkeDGTe0E/aYyWEWVtc5yFXtHCRHs28/jptDEWfaVOc5T7cblqy1XKPPfCxJc/8DwQ5YgLOZOVQ==}
 
-  '@popperjs/core@2.11.8':
-    resolution: {integrity: sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==}
-
   '@react-spring/animated@9.7.4':
     resolution: {integrity: sha512-7As+8Pty2QlemJ9O5ecsuPKjmO0NKvmVkRR1n6mEotFgWar8FKuQt2xgxz3RTgxcccghpx1YdS1FCdElQNexmQ==}
     peerDependencies:
@@ -2867,9 +2682,6 @@ packages:
   '@types/react-is@18.3.0':
     resolution: {integrity: sha512-KZJpHUkAdzyKj/kUHJDc6N7KyidftICufJfOFpiG6haL/BDQNQt5i4n1XDUL/nDZAtGLHDSWRYpLzKTAKSvX6w==}
 
-  '@types/react-transition-group@4.4.11':
-    resolution: {integrity: sha512-RM05tAniPZ5DZPzzNFP+DmrcOdD0efDUxMy3145oljWSl3x9ZV5vhme98gTxFrj2lhXvmGNnUiuDyJgY9IKkNA==}
-
   '@types/react@18.3.5':
     resolution: {integrity: sha512-WeqMfGJLGuLCqHGYRGHxnKrXcTitc6L/nBUWfWPcTarG3t9PsquqUMuVeXZeca+mglY4Vo5GZjCi0A3Or2lnxA==}
 
@@ -4191,9 +4003,6 @@ packages:
   dom-converter@0.2.0:
     resolution: {integrity: sha512-gd3ypIPfOMr9h5jIKq8E3sHOTCjeirnl0WK5ZdS1AW0Odt0b1PaWaHdJ4Qk4klv+YB9aJBS7mESXjFoDQPu6DA==}
 
-  dom-helpers@5.2.1:
-    resolution: {integrity: sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==}
-
   dom-serialize@2.2.1:
     resolution: {integrity: sha512-Yra4DbvoW7/Z6LBN560ZwXMjoNOSAN2wRsKFGc4iBeso+mpIA6qj1vfdf9HpMaKAqG6wXTy+1SYEzmNpKXOSsQ==}
 
@@ -6674,9 +6483,6 @@ packages:
     resolution: {integrity: sha512-ppwTtiJZq0O/ai0z7yfudtBpWIoxM8yE6nHi1X47eFR2EWORqfbu6CnPlNsjeN683eT0qG6H/Pyf9fCcvjnnnQ==}
     engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
 
-  nprogress@0.2.0:
-    resolution: {integrity: sha512-I19aIingLgR1fmhftnbWWO3dXc0hSxqHQHQb3H8m+K3TnEn/iSeTZZOyvKXWqQESMwuUVnatlCnZdLBZZt2VSA==}
-
   nth-check@2.1.1:
     resolution: {integrity: sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==}
 
@@ -7445,12 +7251,6 @@ packages:
       react: '*'
       react-dom: '*'
 
-  react-transition-group@4.4.5:
-    resolution: {integrity: sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==}
-    peerDependencies:
-      react: '>=16.6.0'
-      react-dom: '>=16.6.0'
-
   react@18.3.1:
     resolution: {integrity: sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==}
     engines: {node: '>=0.10.0'}
@@ -10357,74 +10157,6 @@ snapshots:
       '@babel/core': 7.25.2
       '@babel/helper-plugin-utils': 7.24.8
 
-  '@mui/base@5.0.0-beta.40(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
-    dependencies:
-      '@babel/runtime': 7.25.0
-      '@floating-ui/react-dom': 2.1.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
-      '@mui/types': 7.2.16(@types/react@18.3.5)
-      '@mui/utils': 5.16.6(@types/react@18.3.5)(react@18.3.1)
-      '@popperjs/core': 2.11.8
-      clsx: 2.1.1
-      prop-types: 15.8.1
-      react: 18.3.1
-      react-dom: 18.3.1(react@18.3.1)
-    optionalDependencies:
-      '@types/react': 18.3.5
-
-  '@mui/base@5.0.0-beta.53(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
-    dependencies:
-      '@babel/runtime': 7.25.0
-      '@floating-ui/react-dom': 2.1.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
-      '@mui/types': 7.2.16(@types/react@18.3.5)
-      '@mui/utils': 6.0.0-beta.0(@types/react@18.3.5)(react@18.3.1)
-      '@popperjs/core': 2.11.8
-      clsx: 2.1.1
-      prop-types: 15.8.1
-      react: 18.3.1
-      react-dom: 18.3.1(react@18.3.1)
-    optionalDependencies:
-      '@types/react': 18.3.5
-
-  '@mui/core-downloads-tracker@5.16.1': {}
-
-  '@mui/core-downloads-tracker@6.0.2': {}
-
-  '@mui/docs@6.0.2(k43luvnjvbukxr2uxbgmdcf32i)':
-    dependencies:
-      '@babel/runtime': 7.25.0
-      '@mui/base': 5.0.0-beta.53(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
-      '@mui/icons-material': 6.0.2(@mui/material@6.0.2(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(@types/react@18.3.5)(react@18.3.1)
-      '@mui/internal-markdown': 1.0.12
-      '@mui/material': 6.0.2(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
-      '@mui/system': 6.0.2(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1)
-      chai: 4.5.0
-      clipboard-copy: 4.0.1
-      clsx: 2.1.1
-      csstype: 3.1.3
-      next: 14.2.7(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
-      nprogress: 0.2.0
-      prop-types: 15.8.1
-      react: 18.3.1
-    optionalDependencies:
-      '@types/react': 18.3.5
-
-  '@mui/icons-material@6.0.2(@mui/material@6.0.2(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(@types/react@18.3.5)(react@18.3.1)':
-    dependencies:
-      '@babel/runtime': 7.25.0
-      '@mui/material': 6.0.2(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
-      react: 18.3.1
-    optionalDependencies:
-      '@types/react': 18.3.5
-
-  '@mui/internal-babel-macros@1.0.1(@mui/utils@6.0.2(@types/react@18.3.5)(react@18.3.1))':
-    dependencies:
-      '@babel/helper-module-imports': 7.24.7
-      '@babel/runtime': 7.25.0
-      '@mui/utils': 6.0.2(@types/react@18.3.5)(react@18.3.1)
-      babel-plugin-macros: 3.1.0
-    transitivePeerDependencies:
-      - supports-color
-
   '@mui/internal-docs-utils@1.0.12':
     dependencies:
       rimraf: 5.0.10
@@ -10485,44 +10217,6 @@ snapshots:
       - supports-color
       - utf-8-validate
 
-  '@mui/joy@5.0.0-beta.48(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
-    dependencies:
-      '@babel/runtime': 7.25.0
-      '@mui/base': 5.0.0-beta.40(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
-      '@mui/core-downloads-tracker': 5.16.1
-      '@mui/system': 5.16.1(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1)
-      '@mui/types': 7.2.16(@types/react@18.3.5)
-      '@mui/utils': 5.16.6(@types/react@18.3.5)(react@18.3.1)
-      clsx: 2.1.1
-      prop-types: 15.8.1
-      react: 18.3.1
-      react-dom: 18.3.1(react@18.3.1)
-    optionalDependencies:
-      '@emotion/react': 11.13.3(@types/react@18.3.5)(react@18.3.1)
-      '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1)
-      '@types/react': 18.3.5
-
-  '@mui/material@6.0.2(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
-    dependencies:
-      '@babel/runtime': 7.25.0
-      '@mui/core-downloads-tracker': 6.0.2
-      '@mui/system': 6.0.2(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1)
-      '@mui/types': 7.2.16(@types/react@18.3.5)
-      '@mui/utils': 6.0.2(@types/react@18.3.5)(react@18.3.1)
-      '@popperjs/core': 2.11.8
-      '@types/react-transition-group': 4.4.11
-      clsx: 2.1.1
-      csstype: 3.1.3
-      prop-types: 15.8.1
-      react: 18.3.1
-      react-dom: 18.3.1(react@18.3.1)
-      react-is: 18.3.1
-      react-transition-group: 4.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
-    optionalDependencies:
-      '@emotion/react': 11.13.3(@types/react@18.3.5)(react@18.3.1)
-      '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1)
-      '@types/react': 18.3.5
-
   '@mui/monorepo@https://codeload.github.com/mui/material-ui/tar.gz/8094d0bf72a(encoding@0.1.13)':
     dependencies:
       '@googleapis/sheets': 9.3.0(encoding@0.1.13)
@@ -10537,15 +10231,6 @@ snapshots:
       - supports-color
       - utf-8-validate
 
-  '@mui/private-theming@5.16.1(@types/react@18.3.5)(react@18.3.1)':
-    dependencies:
-      '@babel/runtime': 7.25.0
-      '@mui/utils': 5.16.6(@types/react@18.3.5)(react@18.3.1)
-      prop-types: 15.8.1
-      react: 18.3.1
-    optionalDependencies:
-      '@types/react': 18.3.5
-
   '@mui/private-theming@6.0.2(@types/react@18.3.5)(react@18.3.1)':
     dependencies:
       '@babel/runtime': 7.25.0
@@ -10555,17 +10240,6 @@ snapshots:
     optionalDependencies:
       '@types/react': 18.3.5
 
-  '@mui/styled-engine@5.16.1(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(react@18.3.1)':
-    dependencies:
-      '@babel/runtime': 7.25.0
-      '@emotion/cache': 11.13.1
-      csstype: 3.1.3
-      prop-types: 15.8.1
-      react: 18.3.1
-    optionalDependencies:
-      '@emotion/react': 11.13.3(@types/react@18.3.5)(react@18.3.1)
-      '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1)
-
   '@mui/styled-engine@6.0.2(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(react@18.3.1)':
     dependencies:
       '@babel/runtime': 7.25.0
@@ -10577,22 +10251,6 @@ snapshots:
       '@emotion/react': 11.13.3(@types/react@18.3.5)(react@18.3.1)
       '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1)
 
-  '@mui/system@5.16.1(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1)':
-    dependencies:
-      '@babel/runtime': 7.25.0
-      '@mui/private-theming': 5.16.1(@types/react@18.3.5)(react@18.3.1)
-      '@mui/styled-engine': 5.16.1(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(react@18.3.1)
-      '@mui/types': 7.2.16(@types/react@18.3.5)
-      '@mui/utils': 5.16.6(@types/react@18.3.5)(react@18.3.1)
-      clsx: 2.1.1
-      csstype: 3.1.3
-      prop-types: 15.8.1
-      react: 18.3.1
-    optionalDependencies:
-      '@emotion/react': 11.13.3(@types/react@18.3.5)(react@18.3.1)
-      '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1)
-      '@types/react': 18.3.5
-
   '@mui/system@6.0.2(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1))(@types/react@18.3.5)(react@18.3.1)':
     dependencies:
       '@babel/runtime': 7.25.0
@@ -10613,28 +10271,6 @@ snapshots:
     optionalDependencies:
       '@types/react': 18.3.5
 
-  '@mui/utils@5.16.6(@types/react@18.3.5)(react@18.3.1)':
-    dependencies:
-      '@babel/runtime': 7.25.0
-      '@mui/types': 7.2.16(@types/react@18.3.5)
-      '@types/prop-types': 15.7.12
-      clsx: 2.1.1
-      prop-types: 15.8.1
-      react: 18.3.1
-      react-is: 18.3.1
-    optionalDependencies:
-      '@types/react': 18.3.5
-
-  '@mui/utils@6.0.0-beta.0(@types/react@18.3.5)(react@18.3.1)':
-    dependencies:
-      '@babel/runtime': 7.25.0
-      '@types/prop-types': 15.7.12
-      prop-types: 15.8.1
-      react: 18.3.1
-      react-is: 18.3.1
-    optionalDependencies:
-      '@types/react': 18.3.5
-
   '@mui/utils@6.0.2(@types/react@18.3.5)(react@18.3.1)':
     dependencies:
       '@babel/runtime': 7.25.0
@@ -11127,8 +10763,6 @@ snapshots:
 
   '@polka/url@1.0.0-next.25': {}
 
-  '@popperjs/core@2.11.8': {}
-
   '@react-spring/animated@9.7.4(react@18.3.1)':
     dependencies:
       '@react-spring/shared': 9.7.4(react@18.3.1)
@@ -11504,10 +11138,6 @@ snapshots:
     dependencies:
       '@types/react': 18.3.5
 
-  '@types/react-transition-group@4.4.11':
-    dependencies:
-      '@types/react': 18.3.5
-
   '@types/react@18.3.5':
     dependencies:
       '@types/prop-types': 15.7.12
@@ -13027,11 +12657,6 @@ snapshots:
     dependencies:
       utila: 0.4.0
 
-  dom-helpers@5.2.1:
-    dependencies:
-      '@babel/runtime': 7.25.0
-      csstype: 3.1.3
-
   dom-serialize@2.2.1:
     dependencies:
       custom-event: 1.0.1
@@ -16397,8 +16022,6 @@ snapshots:
     dependencies:
       path-key: 4.0.0
 
-  nprogress@0.2.0: {}
-
   nth-check@2.1.1:
     dependencies:
       boolbase: 1.0.0
@@ -17224,15 +16847,6 @@ snapshots:
       react: 18.3.1
       react-dom: 18.3.1(react@18.3.1)
 
-  react-transition-group@4.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1):
-    dependencies:
-      '@babel/runtime': 7.25.0
-      dom-helpers: 5.2.1
-      loose-envify: 1.4.0
-      prop-types: 15.8.1
-      react: 18.3.1
-      react-dom: 18.3.1(react@18.3.1)
-
   react@18.3.1:
     dependencies:
       loose-envify: 1.4.0
diff --git a/scripts/buildTypes.mjs b/scripts/buildTypes.mjs
deleted file mode 100644
index f2a4e0d9e4..0000000000
--- a/scripts/buildTypes.mjs
+++ /dev/null
@@ -1,157 +0,0 @@
-import chalk from 'chalk';
-import glob from 'fast-glob';
-import fse from 'fs-extra';
-import path from 'path';
-import yargs from 'yargs';
-import { $ } from 'execa';
-
-const $$ = $({ stdio: 'inherit' });
-
-/**
- * Fixes a wrong import path caused by https://github.com/microsoft/TypeScript/issues/39117
- * @remarks Paths are hardcoded since it is unclear if all these broken import paths target "public paths".
- * @param {string} importPath - POSIX path
- */
-function rewriteImportPath(importPath) {
-  const coreSrcPath = path.posix.join('..', 'mui-material', 'src');
-  if (importPath.startsWith(coreSrcPath)) {
-    return importPath.replace(coreSrcPath, '@mui/material');
-  }
-
-  const stylesSrcPath = path.posix.join('..', 'mui-styles', 'src');
-  if (importPath.startsWith(stylesSrcPath)) {
-    return importPath.replace(stylesSrcPath, '@mui/styles');
-  }
-
-  const systemSrcPath = path.posix.join('..', 'mui-system', 'src');
-  if (importPath.startsWith(systemSrcPath)) {
-    return importPath.replace(systemSrcPath, '@mui/system');
-  }
-
-  throw new Error(`Don't know where to rewrite '${importPath}' to`);
-}
-
-async function rewriteImportPaths(declarationFile, publishDir) {
-  const code = await fse.readFile(declarationFile, { encoding: 'utf8' });
-  const basename = path.basename(declarationFile);
-
-  if (
-    // Only consider React components
-    basename[0] === basename[0].toUpperCase() &&
-    code.indexOf("import PropTypes from 'prop-types';") !== -1
-  ) {
-    throw new Error(
-      [
-        `${declarationFile} imports from 'prop-types', this is wrong.`,
-        "It's likely missing a cast to any on the propTypes declaration:",
-        'ComponentName.propTypes = { /* prop */ } as any;',
-      ].join('\n'),
-    );
-  }
-
-  let fixedCode = code;
-  const changes = [];
-
-  // find all type `import()`
-  // not to be confused with `import type`
-  const importTypeRegExp = /import\(([^)]+)\)/g;
-
-  let importTypeMatch;
-  // eslint-disable-next-line no-cond-assign -- Waiting for RegExp.prototype.matchAll
-  while ((importTypeMatch = importTypeRegExp.exec(code)) !== null) {
-    // First and last character are quotes.
-    // TypeScript mixes single and double quotes.
-    const importPath = importTypeMatch[1].slice(1, -1);
-    // In filesystem semantics `@mui/material` is a relative path.
-    // But when resolving imports these specifiers are considered "bare specifiers" and work differently.
-    // We're only interested in imports that are considered "relative path imports".
-    const isBareImportSpecifier = !importPath.startsWith('.');
-    if (!isBareImportSpecifier) {
-      const resolvedImport = path.resolve(declarationFile, importPath);
-      const importPathFromPublishDir = path.relative(publishDir, resolvedImport);
-      const isImportReachableWhenPublished = !importPathFromPublishDir.startsWith('.');
-
-      if (!isImportReachableWhenPublished) {
-        try {
-          const fixedImportPath = rewriteImportPath(
-            // ensure relative POSIX path
-            importPathFromPublishDir.replace(/\\/g, '/'),
-          );
-          const originalImportType = importTypeMatch[0];
-          const fixedImportType = importTypeMatch[0].replace(importPath, fixedImportPath);
-
-          // Make it easy to visually scan for the created lines.
-          changes.push(`-${chalk.bgRed(originalImportType)}\n+${chalk.bgGreen(fixedImportType)}`);
-          fixedCode = fixedCode.replace(originalImportType, fixedImportType);
-        } catch (error) {
-          throw new Error(`${declarationFile}: ${error}`);
-        }
-      }
-    }
-  }
-
-  const changed = changes.length > 0;
-  if (changed) {
-    await fse.writeFile(declarationFile, fixedCode);
-  }
-
-  return changes;
-}
-
-async function main() {
-  const packageRoot = process.cwd();
-
-  const tsconfigPath = path.join(packageRoot, 'tsconfig.build.json');
-  if (!fse.existsSync(tsconfigPath)) {
-    throw new Error(
-      'Unable to find a tsconfig to build this project. ' +
-        `The package root needs to contain a 'tsconfig.build.json'. ` +
-        `The package root is '${packageRoot}'`,
-    );
-  }
-
-  await $$`pnpm tsc -b ${tsconfigPath}`;
-
-  const publishDir = path.join(packageRoot, 'build');
-  const declarationFiles = await glob('**/*.d.ts', { absolute: true, cwd: publishDir });
-  if (declarationFiles.length === 0) {
-    throw new Error(`Unable to find declaration files in '${publishDir}'`);
-  }
-
-  let rewrittenTally = 0;
-  let errorTally = 0;
-  await Promise.all(
-    declarationFiles.map(async (declarationFile) => {
-      try {
-        const rewrites = await rewriteImportPaths(declarationFile, publishDir);
-        if (rewrites.length > 0) {
-          // eslint-disable-next-line no-console -- Verbose logging
-          console.log(`${chalk.bgYellow`FIXED`} '${declarationFile}':\n${rewrites.join('\n')}`);
-          rewrittenTally += 1;
-        } else {
-          // eslint-disable-next-line no-console -- Verbose logging
-          console.log(`${chalk.bgGreen`OK`} '${declarationFile}'`);
-        }
-      } catch (error) {
-        console.error(error);
-        errorTally += 1;
-        process.exitCode = 1;
-      }
-    }),
-  );
-
-  // eslint-disable-next-line no-console -- Verbose logging
-  console.log(`Fixed: ${rewrittenTally}\nFailed: ${errorTally}\nTotal: ${declarationFiles.length}`);
-}
-
-yargs(process.argv.slice(2))
-  .command({
-    command: '$0',
-    description:
-      'Builds a project with a fix for https://github.com/microsoft/TypeScript/issues/39117',
-    handler: main,
-  })
-  .help()
-  .strict(true)
-  .version(false)
-  .parse();
diff --git a/scripts/sizeSnapshot/webpack.config.js b/scripts/sizeSnapshot/webpack.config.js
index f6e2455d37..7531667d71 100644
--- a/scripts/sizeSnapshot/webpack.config.js
+++ b/scripts/sizeSnapshot/webpack.config.js
@@ -7,27 +7,8 @@ const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
 const workspaceRoot = path.join(__dirname, '..', '..');
 
 async function getWebpackEntries() {
-  const materialPackagePath = path.join(workspaceRoot, 'packages/mui-material/build');
-  const materialComponents = (await glob(path.join(materialPackagePath, '([A-Z])*/index.js'))).map(
-    (componentPath) => {
-      const componentName = path.basename(path.dirname(componentPath));
-      let entryName = componentName;
-      // adjust for legacy names
-      if (componentName === 'Paper') {
-        entryName = '@material-ui/core/Paper.esm';
-      } else if (componentName === 'TextareaAutosize') {
-        entryName = '@material-ui/core/Textarea';
-      }
-
-      return {
-        id: entryName,
-        path: path.relative(workspaceRoot, path.dirname(componentPath)),
-      };
-    },
-  );
-
-  const corePackagePath = path.join(workspaceRoot, 'packages/mui-base/build');
-  const coreComponents = (await glob(path.join(corePackagePath, '([A-Z])*/index.js'))).map(
+  const baseUiPackagePath = path.join(workspaceRoot, 'packages/mui-base/build');
+  const baseUiComponents = (await glob(path.join(baseUiPackagePath, '([A-Z])*/index.js'))).map(
     (componentPath) => {
       const componentName = path.basename(path.dirname(componentPath));
 
@@ -38,125 +19,12 @@ async function getWebpackEntries() {
     },
   );
 
-  const labPackagePath = path.join(workspaceRoot, 'packages/mui-lab/build');
-  const labComponents = (await glob(path.join(labPackagePath, '([A-Z])*/index.js'))).map(
-    (componentPath) => {
-      const componentName = path.basename(path.dirname(componentPath));
-
-      return {
-        id: componentName,
-        path: path.relative(workspaceRoot, path.dirname(componentPath)),
-      };
-    },
-  );
-
-  const materialNextPackagePath = path.join(workspaceRoot, 'packages/mui-material-next/build');
-  const materialNextComponents = (
-    await glob(path.join(materialNextPackagePath, '([A-Z])*/index.js'))
-  ).map((componentPath) => {
-    const componentName = path.basename(path.dirname(componentPath));
-
-    return {
-      id: `@mui/material-next/${componentName}`,
-      path: path.relative(workspaceRoot, path.dirname(componentPath)),
-    };
-  });
-
-  const joyPackagePath = path.join(workspaceRoot, 'packages/mui-joy/build');
-  const joyComponents = (await glob(path.join(joyPackagePath, '([A-Z])*/index.js'))).map(
-    (componentPath) => {
-      const componentName = path.basename(path.dirname(componentPath));
-
-      return {
-        id: `@mui/joy/${componentName}`,
-        path: path.relative(workspaceRoot, path.dirname(componentPath)),
-      };
-    },
-  );
-
   return [
+    ...baseUiComponents,
     {
-      // WARNING: Changing the name will break tracking of bundle size over time
-      // If the name of the package changes, rename its display name in https://github.com/eps1lon/mui-contributor-dashboard/blob/main/src/pages/SizeComparison.tsx
-      id: '@material-ui/core',
-      path: path.join(path.relative(workspaceRoot, materialPackagePath), 'index.js'),
-    },
-    ...materialComponents,
-    {
-      id: '@material-ui/lab',
-      path: path.join(path.relative(workspaceRoot, labPackagePath), 'index.js'),
-    },
-    ...labComponents,
-    {
-      id: '@material-ui/styles',
-      path: 'packages/mui-styles/build/index.js',
-    },
-    {
-      id: '@material-ui/private-theming',
-      path: 'packages/mui-private-theming/build/index.js',
-    },
-    {
-      id: '@material-ui/system',
-      path: 'packages/mui-system/build/esm/index.js',
-    },
-    {
-      id: 'createBox',
-      path: 'packages/mui-system/build/esm/createBox.js',
-    },
-    {
-      id: 'createStyled',
-      path: 'packages/mui-system/build/esm/createStyled.js',
-    },
-    {
-      id: '@material-ui/core/styles/createTheme',
-      path: 'packages/mui-material/build/styles/createTheme.js',
-    },
-    {
-      id: 'colorManipulator',
-      path: 'packages/mui-system/build/colorManipulator.js',
-    },
-    {
-      id: 'useAutocomplete',
-      path: 'packages/mui-lab/build/useAutocomplete/index.js',
-    },
-    {
-      id: '@material-ui/core/useMediaQuery',
-      path: 'packages/mui-material/build/useMediaQuery/index.js',
-    },
-    {
-      id: '@material-ui/core/useScrollTrigger',
-      path: 'packages/mui-material/build/useScrollTrigger/index.js',
-    },
-    {
-      id: '@material-ui/unstyled',
-      path: path.join(path.relative(workspaceRoot, corePackagePath), 'index.js'),
-    },
-    ...coreComponents,
-    {
-      id: '@material-ui/utils',
-      path: 'packages/mui-utils/build/index.js',
-    },
-    // TODO: Requires webpack v5
-    // Resolution of webpack/acorn to 7.x is blocked by nextjs (https://github.com/vercel/next.js/issues/11947)
-    // {
-    //   id: '@material-ui/core.modern',
-    //   webpack: true,
-    //   path: path.join(path.relative(workspaceRoot, materialPackagePath), 'modern/index.js'),
-    // },
-    {
-      id: '@material-ui/core.legacy',
-      path: path.join(path.relative(workspaceRoot, materialPackagePath), 'legacy/index.js'),
-    },
-    {
-      id: '@mui/material-next',
-      path: path.join(path.relative(workspaceRoot, materialNextPackagePath), 'index.js'),
-    },
-    ...materialNextComponents,
-    {
-      id: '@mui/joy',
-      path: path.join(path.relative(workspaceRoot, joyPackagePath), 'index.js'),
+      id: '@base_ui/react',
+      path: path.join(path.relative(workspaceRoot, baseUiPackagePath), 'index.js'),
     },
-    ...joyComponents,
   ];
 }
 
@@ -204,18 +72,7 @@ function createWebpackConfig(entry, environment) {
     ],
     resolve: {
       alias: {
-        '@mui/material': path.join(workspaceRoot, 'packages/mui-material/build'),
-        '@mui/lab': path.join(workspaceRoot, 'packages/mui-lab/build'),
-        '@mui/styled-engine': path.join(workspaceRoot, 'packages/mui-styled-engine/build'),
-        '@mui/styled-engine-sc': path.join(workspaceRoot, 'packages/mui-styles-sc/build'),
-        '@mui/styles': path.join(workspaceRoot, 'packages/mui-styles/build'),
-        '@mui/system': path.join(workspaceRoot, 'packages/mui-system/build'),
-        '@mui/private-theming': path.join(workspaceRoot, 'packages/mui-private-theming/build'),
-        '@mui/utils': path.join(workspaceRoot, 'packages/mui-utils/build'),
         '@base_ui/react': path.join(workspaceRoot, 'packages/mui-base/build'),
-        '@mui/material-next': path.join(workspaceRoot, 'packages/mui-material-next/build'),
-        '@mui/material-nextjs': path.join(workspaceRoot, 'packages/mui-material-nextjs/build'),
-        '@mui/joy': path.join(workspaceRoot, 'packages/mui-joy/build'),
       },
     },
     entry: { [entry.id]: path.join(workspaceRoot, entry.path) },
diff --git a/test/package.json b/test/package.json
index a1fcf58c05..b17884ebe8 100644
--- a/test/package.json
+++ b/test/package.json
@@ -11,8 +11,6 @@
     "@emotion/cache": "^11.13.1",
     "@emotion/react": "^11.13.3",
     "@mui/internal-test-utils": "1.0.12",
-    "@mui/joy": "5.0.0-beta.48",
-    "@mui/material": "6.0.2",
     "@playwright/test": "1.46.1",
     "@testing-library/dom": "^10.4.0",
     "@types/chai": "^4.3.19",
diff --git a/test/regressions/TestViewer.js b/test/regressions/TestViewer.js
index a4985b0849..24f569d141 100644
--- a/test/regressions/TestViewer.js
+++ b/test/regressions/TestViewer.js
@@ -1,10 +1,6 @@
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { useFakeTimers } from 'sinon';
-import Box from '@mui/material/Box';
-import GlobalStyles from '@mui/material/GlobalStyles';
-import JoyBox from '@mui/joy/Box';
-import { CssVarsProvider } from '@mui/joy/styles';
 
 function TestViewer(props) {
   const { children } = props;
@@ -48,48 +44,39 @@ function TestViewer(props) {
     };
   }, []);
 
+  const globalStyles = `
+    html {
+      --webkit-font-smoothing: antialiased;
+      --moz-osx-font-smoothing: grayscale;
+      /* Do the opposite of the docs in order to help catching issues. */
+      box-sizing: content-box;
+    }
+
+    *, *::before, *::after {
+      boxSizing: inherit;
+      /* Disable transitions to avoid flaky screenshots */
+      transition: none !important;
+      animation: none !important;
+    }
+
+    body {
+      margin: 0;
+      overflow-x: hidden;
+    }
+  `;
+
   return (
     <React.Fragment>
-      <GlobalStyles
-        styles={{
-          html: {
-            WebkitFontSmoothing: 'antialiased', // Antialiasing.
-            MozOsxFontSmoothing: 'grayscale', // Antialiasing.
-            // Do the opposite of the docs in order to help catching issues.
-            boxSizing: 'content-box',
-          },
-          '*, *::before, *::after': {
-            boxSizing: 'inherit',
-            // Disable transitions to avoid flaky screenshots
-            transition: 'none !important',
-            animation: 'none !important',
-          },
-          body: {
-            margin: 0,
-            overflowX: 'hidden',
-          },
-        }}
-      />
+      {/* eslint-disable-next-line react/no-danger */}
+      <style dangerouslySetInnerHTML={{ __html: globalStyles }} />
       <React.Suspense fallback={<div aria-busy />}>
-        {window.location.pathname.startsWith('/docs-joy') ? (
-          <CssVarsProvider>
-            <JoyBox
-              aria-busy={!ready}
-              data-testid="testcase"
-              sx={{ bgcolor: 'background.body', display: 'inline-block', p: 1 }}
-            >
-              {children}
-            </JoyBox>
-          </CssVarsProvider>
-        ) : (
-          <Box
-            aria-busy={!ready}
-            data-testid="testcase"
-            sx={{ bgcolor: 'background.default', display: 'inline-block', p: 1 }}
-          >
-            {children}
-          </Box>
-        )}
+        <div
+          aria-busy={!ready}
+          data-testid="testcase"
+          style={{ backgroundColor: '#fff', display: 'inline-block', padding: '8px' }}
+        >
+          {children}
+        </div>
       </React.Suspense>
     </React.Fragment>
   );
diff --git a/test/regressions/webpack.config.js b/test/regressions/webpack.config.js
index 5be826e340..6f13887685 100644
--- a/test/regressions/webpack.config.js
+++ b/test/regressions/webpack.config.js
@@ -22,8 +22,6 @@ module.exports = {
     new HtmlWebpackPlugin({
       template: path.resolve(__dirname, './template.html'),
     }),
-    // Avoid bundling the whole @mui/icons-material package. x2 the bundling speed.
-    new webpack.IgnorePlugin({ resourceRegExp: /material-icons\/SearchIcons\.js/ }),
     new webpack.ProvidePlugin({
       // required by code accessing `process.env` in the browser
       process: 'process/browser.js',