chore: reduce bundle size by adapting material-icon imports

Reduce size of bundles by preferring path imports over named imports of React Material icons. Fixes #2350
eclipsesource · Jul 3, 2024 · 635faab · 635faab
1 parent c3cead7
commit 635faab
Show file tree

Hide file tree

Showing 6 changed files with 11 additions and 15 deletions.
diff --git a/packages/material-renderers/src/additional/ListWithDetailMasterItem.tsx b/packages/material-renderers/src/additional/ListWithDetailMasterItem.tsx
@@ -33,7 +33,7 @@ import {
   ListItemText,
   Tooltip,
 } from '@mui/material';
-import { Delete as DeleteIcon } from '@mui/icons-material';
+import DeleteIcon from '@mui/icons-material/Delete';
 import React from 'react';
 
 export const ListWithDetailMasterItem = ({

diff --git a/packages/material-renderers/src/complex/MaterialTableControl.tsx b/packages/material-renderers/src/complex/MaterialTableControl.tsx
@@ -57,11 +57,9 @@ import {
   encode,
   ArrayTranslations,
 } from '@jsonforms/core';
-import {
-  Delete as DeleteIcon,
-  ArrowDownward,
-  ArrowUpward,
-} from '@mui/icons-material';
+import DeleteIcon from '@mui/icons-material/Delete';
+import ArrowDownward from '@mui/icons-material/ArrowDownward';
+import ArrowUpward from '@mui/icons-material/ArrowUpward';
 
 import { WithDeleteDialogSupport } from './DeleteDialog';
 import NoBorderTableCell from './NoBorderTableCell';

diff --git a/packages/material-renderers/src/complex/TableToolbar.tsx b/packages/material-renderers/src/complex/TableToolbar.tsx
@@ -38,7 +38,7 @@ import {
   FormHelperText,
   Stack,
 } from '@mui/material';
-import { Add as AddIcon } from '@mui/icons-material';
+import AddIcon from '@mui/icons-material/Add';
 import ValidationIcon from './ValidationIcon';
 import NoBorderTableCell from './NoBorderTableCell';
 

diff --git a/packages/material-renderers/src/complex/ValidationIcon.tsx b/packages/material-renderers/src/complex/ValidationIcon.tsx
@@ -24,7 +24,7 @@
 */
 import React from 'react';
 
-import { ErrorOutline as ErrorOutlineIcon } from '@mui/icons-material';
+import ErrorOutlineIcon from '@mui/icons-material/ErrorOutline';
 import { Badge, Tooltip, styled } from '@mui/material';
 
 const StyledBadge = styled(Badge)(({ theme }: any) => ({

diff --git a/packages/material-renderers/src/layouts/ExpandPanelRenderer.tsx b/packages/material-renderers/src/layouts/ExpandPanelRenderer.tsx
@@ -40,12 +40,10 @@ import {
   IconButton,
   Tooltip,
 } from '@mui/material';
-import {
-  ExpandMore as ExpandMoreIcon,
-  Delete as DeleteIcon,
-  ArrowUpward,
-  ArrowDownward,
-} from '@mui/icons-material';
+import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
+import ArrowUpward from '@mui/icons-material/ArrowUpward';
+import ArrowDownward from '@mui/icons-material/ArrowDownward';
+import DeleteIcon from '@mui/icons-material/Delete';
 
 const iconStyle: any = { float: 'right' };
 

diff --git a/packages/material-renderers/src/mui-controls/MuiInputText.tsx b/packages/material-renderers/src/mui-controls/MuiInputText.tsx
@@ -32,7 +32,7 @@ import {
   useTheme,
 } from '@mui/material';
 import merge from 'lodash/merge';
-import { Close } from '@mui/icons-material';
+import Close from '@mui/icons-material/Close';
 import {
   JsonFormsTheme,
   WithInputProps,