@flozy/editor 5.4.5 → 5.4.7

package/dist/Editor/Elements/AI/PopoverAIInput.js

@@ -62,7 +62,7 @@ const getNextLine = editor => {
     } = editor;
     const {
       focus
-    } = selection;
+    } = selection || {};
     if (focus?.path?.length > 0) {
       const {
         text = ""
@@ -123,10 +123,10 @@ const updateAnchorEl = (setAnchorEl, editor, openAI, selectedElement) => {
     } = editor || {};
     const isHavingSelection = selection && !Range.isCollapsed(selection) && getSelectedText(editor).trim();
     const caret = isHavingSelection ? getSlateDom(editor, editor.selection) : getNextLineDom(editor);
-    const caretPos = caret?.getBoundingClientRect();
+    const caretPos = caret?.getBoundingClientRect() || {};
     const editorContainer = document.querySelector("#slate-wrapper-scroll-container")?.getBoundingClientRect();
     const sectionEle = selectedElement?.anchorEl || document.querySelector(".ed-section-inner");
-    const selectedSectionRect = sectionEle?.getBoundingClientRect();
+    const selectedSectionRect = sectionEle?.getBoundingClientRect() || {};
     const isAIInputReachTop = caretPos.height + caretPos.y <= editorContainer.y;
     const yValue = isAIInputReachTop ? "-500" : caretPos.y; // -500 is to hide the AI input if the toolbar reached the top
 

package/dist/Editor/Elements/DataView/Layouts/ColumnView.js

@@ -1,8 +1,8 @@
 import React, { useEffect, useRef, useState } from "react";
 import { Box, Checkbox, Popper, useTheme } from "@mui/material";
-import CheckBoxTwoToneIcon from "@mui/icons-material/CheckBoxTwoTone";
 import DataTypes from "./DataTypes";
 import useColumnStyles from "./colStyles";
+import Icon from "../../../common/Icon";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const ColumnView = props => {
@@ -19,12 +19,23 @@ const ColumnView = props => {
   const DataType = DataTypes[property?.type] || DataTypes["text"];
   const anchorRef = useRef(null);
   const [anchorEl, setAnchorEl] = useState(null);
+  const [popperRefresh, setPopperRefresh] = useState(new Date().getTime());
   const open = Boolean(anchorEl);
   const classes = useColumnStyles(theme);
+  const parentRef = useRef(null);
   useEffect(() => {
-    if (anchorRef?.current) {
-      setAnchorEl(anchorRef?.current);
-    }
+    if (!anchorRef?.current) return;
+    setAnchorEl(anchorRef?.current);
+    parentRef.current = anchorRef?.current.closest(".tv-d-wrapper");
+    const resizeObserver = new ResizeObserver(() => {
+      if (parentRef?.current) {
+        setPopperRefresh(new Date().getTime());
+      }
+    });
+    resizeObserver.observe(parentRef.current);
+    return () => {
+      resizeObserver.disconnect();
+    };
   }, [anchorRef?.current]);
   const handleSelect = id => e => {
     onSelect(id, e.target.checked);
@@ -59,9 +70,14 @@ const ColumnView = props => {
           mr: 0
         },
         checked: selected,
-        checkedIcon: /*#__PURE__*/_jsx(CheckBoxTwoToneIcon, {})
+        icon: /*#__PURE__*/_jsx(Icon, {
+          icon: "uncheckedIcon"
+        }),
+        checkedIcon: /*#__PURE__*/_jsx(Icon, {
+          icon: "checkedIcon"
+        })
       })
-    }) : null]
+    }, popperRefresh) : null]
   });
 };
 export default ColumnView;

package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/Select.js

@@ -4,6 +4,7 @@ import Autocomplete from "@mui/material/Autocomplete";
 import { Avatar, Box, Chip, useTheme } from "@mui/material";
 import { useEditorContext } from "../../../../../hooks/useMouseMove";
 import useCompStyles from "./styles";
+import { CloseIcon } from "../../../../../common/iconslist";
 import { jsx as _jsx } from "react/jsx-runtime";
 const AvatarIcon = props => {
   const {
@@ -34,7 +35,7 @@ export default function Select(props) {
   const {
     value: pValue,
     onChange,
-    options,
+    options: selectOptions,
     multiple = false,
     limitTags = 2,
     placeholder = "",
@@ -42,6 +43,7 @@ export default function Select(props) {
     optionAvatar = false
   } = props;
   const value = Array.isArray(pValue) ? pValue : [];
+  const options = selectOptions?.length ? selectOptions.filter(s => s.value) : [];
   return /*#__PURE__*/_jsx(Autocomplete, {
     disabled: disabled,
     className: "tv-ac-field",
@@ -101,6 +103,14 @@ export default function Select(props) {
     renderTags: (value, getTagProps) => {
       return /*#__PURE__*/_jsx(Box, {
         className: "tv-ms-tag-wrpr",
+        sx: {
+          '& svg': {
+            marginRight: '5px',
+            '& path': {
+              stroke: "#000"
+            }
+          }
+        },
         children: value?.map((option, index) => {
           const {
             key,
@@ -113,13 +123,17 @@ export default function Select(props) {
             label: option?.label || option?.value,
             ...tagProps,
             sx: {
-              background: option?.color || "#CCC",
-              border: "none"
+              background: option?.color || "#F6F6F6",
+              border: "none",
+              '& .MuiChip-label': {
+                paddingLeft: '12px !important'
+              }
             },
             avatar: /*#__PURE__*/_jsx(AvatarIcon, {
               option: option,
               avatar: optionAvatar
-            })
+            }),
+            deleteIcon: /*#__PURE__*/_jsx(CloseIcon, {})
           }, key) : null;
         })
       });
@@ -134,12 +148,16 @@ export default function Select(props) {
         children: /*#__PURE__*/_jsx(Chip, {
           label: option.label || option.value || "",
           sx: {
-            background: option.color || "#CCC"
+            background: option.color || appTheme?.palette?.editor?.tv_border1,
+            '& .MuiChip-label': {
+              paddingLeft: '12px !important'
+            }
           },
           avatar: /*#__PURE__*/_jsx(AvatarIcon, {
             option: option,
             avatar: optionAvatar
-          })
+          }),
+          deleteIcon: /*#__PURE__*/_jsx(CloseIcon, {})
         })
       }, key);
     },

package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/SimpleSelect.js

@@ -2,6 +2,7 @@ import React from "react";
 import { MenuItem, Select, useTheme } from "@mui/material";
 import { useEditorContext } from "../../../../../hooks/useMouseMove";
 import useCompStyles from "./styles";
+import KeyboardArrowDownRoundedIcon from '@mui/icons-material/KeyboardArrowDownRounded';
 import { jsx as _jsx } from "react/jsx-runtime";
 const SimpleSelect = props => {
   const theme = useTheme();
@@ -15,13 +16,27 @@ const SimpleSelect = props => {
     handleChange,
     disabled = false
   } = props;
-  console.log(classes);
   return /*#__PURE__*/_jsx(Select, {
     disabled: disabled,
     value: value,
     onChange: handleChange,
+    IconComponent: KeyboardArrowDownRoundedIcon,
     fullWidth: true,
     size: "small",
+    sx: {
+      color: appTheme?.palette?.editor?.tv_text,
+      fontSize: '14px',
+      marginTop: '4px',
+      padding: '3px 0px',
+      '& .MuiOutlinedInput-notchedOutline': {
+        border: `1px solid ${appTheme?.palette?.editor?.inputFieldBorder}`,
+        boxShadow: '0px 4px 18px 0px #0000000D'
+      },
+      "&:hover .MuiOutlinedInput-notchedOutline": {
+        border: `1px solid ${appTheme?.palette?.editor?.inputFieldBorder}`,
+        boxShadow: '0px 4px 18px 0px #0000000D'
+      }
+    },
     MenuProps: {
       PaperProps: {
         sx: classes.simpleselect,

package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/styles.js

@@ -2,7 +2,8 @@ const useCompStyles = (theme, appTheme) => ({
   simpleselect: {
     border: `1px solid ${appTheme?.palette?.editor?.tv_border}`,
     background: appTheme?.palette?.editor?.tv_pop_bg,
-    color: appTheme?.palette?.editor?.tv_text_primary,
+    color: appTheme?.palette?.editor?.tv_text,
+    fontSize: '14px',
     borderRadius: "8px",
     [theme?.breakpoints?.between("xs", "md")]: {},
     "& ul": {

package/dist/Editor/Elements/DataView/Layouts/FilterSort/SortOptions/index.js

@@ -1,10 +1,10 @@
 import React from "react";
 import { Box, List, ListItem, ListItemButton, ListItemIcon, ListItemText } from "@mui/material";
 import { useDataView } from "../../../Providers/DataViewProvider";
-import DeleteIcon from "@mui/icons-material/Delete";
 import ChooseSort from "./ChooseSort";
 import ChooseField from "./ChooseField";
 import ColumnsList from "../../Options/ColumnsList";
+import Icon from "../../../../../common/Icon";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const SortOptions = props => {
@@ -37,16 +37,19 @@ const SortOptions = props => {
   return sort?.length > 0 ? /*#__PURE__*/_jsxs(List, {
     className: "tv-opt-list",
     sx: {
-      p: 0
+      padding: '0px !important'
     },
     children: [sort?.map((m, i) => {
       return /*#__PURE__*/_jsx(ListItem, {
         sx: {
-          justifyContent: "space-between"
+          justifyContent: "space-between",
+          paddingLeft: 0,
+          paddingRight: 0
         },
         children: /*#__PURE__*/_jsxs(Box, {
           sx: {
-            display: "flex"
+            display: "flex",
+            padding: 0
           },
           children: [/*#__PURE__*/_jsx(ChooseField, {
             sort: m,
@@ -61,7 +64,16 @@ const SortOptions = props => {
     }), /*#__PURE__*/_jsxs(ListItemButton, {
       onClick: handleDelete,
       children: [/*#__PURE__*/_jsx(ListItemIcon, {
-        children: /*#__PURE__*/_jsx(DeleteIcon, {})
+        sx: {
+          minWidth: '25px !important',
+          '& svg': {
+            background: 'transparent !important',
+            padding: '0 !important'
+          }
+        },
+        children: /*#__PURE__*/_jsx(Icon, {
+          icon: 'trashIcon'
+        })
       }), /*#__PURE__*/_jsx(ListItemText, {
         children: "Delete Sort"
       })]

package/dist/Editor/Elements/DataView/Layouts/FilterSort/styles.js

@@ -5,7 +5,8 @@ const useFilterSortStyles = (theme, appTheme) => ({
       border: `1px solid ${appTheme?.palette?.editor?.tv_border}`,
       background: appTheme?.palette?.editor?.tv_pop_bg,
       color: appTheme?.palette?.editor?.tv_text_primary,
-      borderRadius: "12px",
+      borderRadius: "20px !important",
+      fontFamily: 'Inter !important',
       [theme?.breakpoints?.between("xs", "md")]: {
         borderRadius: "16px 16px 0px 0px",
         maxHeight: "50%"
@@ -51,18 +52,32 @@ const useFilterSortStyles = (theme, appTheme) => ({
               background: appTheme?.palette?.editor?.tv_ico_bg
             },
             color: `${appTheme?.palette?.editor?.tv_text} !important`,
-            "& svg": {
-              width: "16px"
+            // "& svg": {
+            //   width: "16px",
+            // },
+            '& svg': {
+              width: '14px',
+              height: '14px',
+              '& path': {
+                stroke: appTheme?.palette?.editor?.closeButtonSvgStroke
+              }
             }
           },
           "& .MuiTypography-root": {
-            fontSize: "14px"
+            fontSize: "14px",
+            fontFamily: 'Inter'
           },
           "&:hover": {
             background: appTheme?.palette?.editor?.tv_hover_bg,
             color: `${appTheme?.palette?.editor?.tv_hover_text} !important`,
             "& .MuiListItemIcon-root": {
-              color: `${appTheme?.palette?.editor?.tv_hover_text} !important`
+              color: `${appTheme?.palette?.editor?.tv_hover_text} !important`,
+              "& svg": {
+                color: `${appTheme?.palette?.editor?.tv_hover_text} !important`,
+                '& path': {
+                  stroke: `${appTheme?.palette?.editor?.tv_hover_text} !important`
+                }
+              }
             }
           }
         }
@@ -70,7 +85,7 @@ const useFilterSortStyles = (theme, appTheme) => ({
       "& .tv-cf": {
         "& .MuiInputBase-root": {
           color: appTheme?.palette?.editor?.tv_text_primary,
-          background: appTheme?.palette?.editor?.tv_input_bg,
+          // background: appTheme?.palette?.editor?.tv_input_bg,
           borderRadius: "8px",
           "& svg": {
             color: appTheme?.palette?.editor?.tv_text_primary
@@ -80,25 +95,37 @@ const useFilterSortStyles = (theme, appTheme) => ({
     }
   },
   contentWrapper: {
-    padding: "0px",
+    padding: '13px 16px 16px 20px',
     "& .tv-opt-list": {
-      minWidth: "250px"
+      minWidth: "230px",
+      '& .MuiListItemIcon-root': {
+        '& svg': {
+          background: appTheme?.palette?.editor?.tv_ico_bg,
+          padding: '6px',
+          borderRadius: '4px',
+          '& path': {
+            stroke: appTheme?.palette?.editor?.closeButtonSvgStroke
+          }
+        }
+      }
     },
     "& .opt-wrpr": {
-      padding: "8px 8px 8px 8px"
+      padding: "8px 0px 0px 0px"
     },
     "& .fe-dv-ap-title": {
       display: "flex",
       fontWeight: "bold",
-      padding: "8px 8px 8px 8px",
       justifyContent: "space-between",
+      fontFamily: 'Inter',
       fontSize: "14px",
       alignItems: "center",
       borderBottom: `1px solid ${appTheme?.palette?.editor?.tv_border}`,
       marginBottom: "0px",
+      padding: "0px 0px 8px 0px",
       "& span": {
         display: "flex",
-        alignItems: "center"
+        alignItems: "center",
+        fontFamily: 'Inter'
       }
     }
   }

package/dist/Editor/Elements/DataView/Layouts/FilterView.js

@@ -3,10 +3,9 @@ import { Box, IconButton, InputBase, Menu, MenuItem } from "@mui/material";
 import { useDataView } from "../Providers/DataViewProvider";
 import FilterSort from "./FilterSort";
 import DeleteIcon from "@mui/icons-material/Delete";
-import SearchIcon from "@mui/icons-material/Search";
-import SwapVertIcon from "@mui/icons-material/SwapVert";
 import MoreHorizIcon from "@mui/icons-material/MoreHoriz";
-import ContentCopyIcon from "@mui/icons-material/ContentCopy";
+import Icon from "../../../common/Icon";
+import { useEditorContext } from "../../../hooks/useMouseMove";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const FilterView = props => {
@@ -32,6 +31,9 @@ const FilterView = props => {
   const [toggle, setToggle] = useState(false);
   const open = Boolean(anchorEl);
   const openMore = Boolean(anchorMoreEl);
+  const {
+    theme
+  } = useEditorContext();
   const handleSortClick = e => {
     setAnchorEl(e?.currentTarget);
     setMode({
@@ -99,13 +101,27 @@ const FilterView = props => {
       }) : title || "Untitled"
     }), /*#__PURE__*/_jsxs(Box, {
       className: "tv-fi-wrpr",
+      sx: {
+        alignItems: 'center'
+      },
       children: [/*#__PURE__*/_jsxs(Box, {
         className: `tv-sb mr ${toggle ? "open" : ""}`,
+        sx: {
+          minHeight: '32px'
+        },
         children: [/*#__PURE__*/_jsx(IconButton, {
           type: "button",
+          sx: {
+            '& svg': {
+              width: '14px',
+              height: '14px'
+            }
+          },
           "aria-label": "search",
           onClick: toggleSearch,
-          children: /*#__PURE__*/_jsx(SearchIcon, {})
+          children: /*#__PURE__*/_jsx(Icon, {
+            icon: "SearchIcon"
+          })
         }), /*#__PURE__*/_jsx(InputBase, {
           sx: {
             paddingBottom: "0px"
@@ -119,9 +135,16 @@ const FilterView = props => {
           onChange: onSearch
         })]
       }), /*#__PURE__*/_jsx(IconButton, {
-        className: `mr ${sort?.length > 0 ? "active" : ""}`,
+        className: ` ${sort?.length > 0 ? "active" : ""}`,
         onClick: handleSortClick,
-        children: /*#__PURE__*/_jsx(SwapVertIcon, {})
+        sx: {
+          '& svg': {
+            strokeWidth: 1.2
+          }
+        },
+        children: /*#__PURE__*/_jsx(Icon, {
+          icon: 'sortBy'
+        })
       }), /*#__PURE__*/_jsx(FilterSort, {
         open: open,
         anchorEl: anchorEl,
@@ -129,12 +152,19 @@ const FilterView = props => {
         onClose: onClose
       }), !readOnly ? /*#__PURE__*/_jsx(IconButton, {
         className: "mr",
+        sx: {
+          '& svg': {
+            fill: theme?.palette?.editor?.tv_stroke
+          }
+        },
         onClick: handleMoreClick,
         children: /*#__PURE__*/_jsx(MoreHorizIcon, {})
       }) : null, selectedRows?.length > 0 && !readOnly ? /*#__PURE__*/_jsx(IconButton, {
         className: "mr",
         onClick: handleDeleteRow,
-        children: /*#__PURE__*/_jsx(DeleteIcon, {})
+        children: /*#__PURE__*/_jsx(Icon, {
+          icon: 'trashIcon'
+        })
       }) : null, !readOnly ? /*#__PURE__*/_jsxs(Menu, {
         sx: classes.basicMenu,
         className: "tv-basic-menu",
@@ -154,18 +184,28 @@ const FilterView = props => {
         },
         children: [/*#__PURE__*/_jsxs(MenuItem, {
           onClick: onMenuClick("Duplicate"),
-          children: [" ", /*#__PURE__*/_jsx(ContentCopyIcon, {
+          children: [" ", /*#__PURE__*/_jsx(Box, {
             sx: {
-              mr: 1
-            }
-          }), " Duplicate"]
+              marginRight: '5px',
+              display: ' flex',
+              alignItems: 'center'
+            },
+            children: /*#__PURE__*/_jsx(Icon, {
+              icon: 'duplicateIcon'
+            })
+          }), "Duplicate"]
         }), /*#__PURE__*/_jsxs(MenuItem, {
           onClick: onMenuClick("Delete"),
-          children: [" ", /*#__PURE__*/_jsx(DeleteIcon, {
+          children: [" ", /*#__PURE__*/_jsx(Box, {
             sx: {
-              mr: 1
-            }
-          }), " Delete"]
+              marginRight: '5px',
+              display: ' flex',
+              alignItems: 'center'
+            },
+            children: /*#__PURE__*/_jsx(Icon, {
+              icon: 'trashIcon'
+            })
+          }), "Delete"]
         })]
       }) : null]
     })]

package/dist/Editor/Elements/DataView/Layouts/Options/AddOptions.js

@@ -1,8 +1,7 @@
 import React, { useState } from "react";
 import { Box, List, ListItemButton, ListItemText, ListItemIcon, TextField, Chip } from "@mui/material";
-import AddIcon from "@mui/icons-material/Add";
-import KeyboardArrowRightIcon from "@mui/icons-material/KeyboardArrowRight";
 import { colors } from "../../../Color Picker/defaultColors";
+import Icon from "../../../../common/Icon";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const DEFAULT_COLORS = colors?.filter(f => !f.includes("linear"));
@@ -66,14 +65,13 @@ const AddOptions = props => {
       children: /*#__PURE__*/_jsxs(ListItemButton, {
         onClick: onAddBox,
         children: [/*#__PURE__*/_jsx(ListItemIcon, {
-          children: /*#__PURE__*/_jsx(AddIcon, {})
+          children: /*#__PURE__*/_jsx(Icon, {
+            icon: 'plusIcon'
+          })
         }), /*#__PURE__*/_jsx(ListItemText, {
           primary: "Add Options"
         })]
       })
-    }), /*#__PURE__*/_jsx(Box, {
-      className: "fe-dv-ap-desc",
-      children: "Choose an option or create one"
     }), addBox ? /*#__PURE__*/_jsx(Box, {
       children: /*#__PURE__*/_jsx(TextField, {
         className: "mt",
@@ -100,7 +98,9 @@ const AddOptions = props => {
             sx: {
               justifyContent: "flex-end"
             },
-            children: /*#__PURE__*/_jsx(KeyboardArrowRightIcon, {})
+            children: /*#__PURE__*/_jsx(Icon, {
+              icon: 'rightArrow'
+            })
           })]
         }, i);
       })

package/dist/Editor/Elements/DataView/Layouts/Options/AllProperties.js

@@ -5,6 +5,7 @@ import KeyboardArrowRightIcon from "@mui/icons-material/KeyboardArrowRight";
 import AddIcon from "@mui/icons-material/Add";
 import { TYPE_LABELS, PROPERTY_TYPES } from "./Constants";
 import { useDataView } from "../../Providers/DataViewProvider";
+import Icon from "../../../../common/Icon";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
@@ -56,13 +57,21 @@ const AllProperties = props => {
         className: "fe-dv-opt-list",
         children: shownProperties?.map((m, i) => {
           const {
-            Icon
+            Icon: iconType
           } = PROPERTY_TYPES?.find(f => f.type === m.type) || {};
           return /*#__PURE__*/_jsxs(ListItemButton, {
             onClick: onEditProperty(m),
             children: [/*#__PURE__*/_jsx(ListItemIcon, {
               className: "needBg",
-              children: /*#__PURE__*/_jsx(Icon, {})
+              sx: {
+                '& svg': {
+                  width: '14px !important',
+                  height: '14px !important'
+                }
+              },
+              children: /*#__PURE__*/_jsx(Icon, {
+                icon: iconType
+              })
             }), /*#__PURE__*/_jsx(ListItemText, {
               children: m?.label
             }), /*#__PURE__*/_jsx(ListItemIcon, {

package/dist/Editor/Elements/DataView/Layouts/Options/ChangeProperty.js

@@ -2,7 +2,7 @@ import React from "react";
 import { Box, IconButton } from "@mui/material";
 import CloseIcon from "@mui/icons-material/Close";
 import PropertyList from "./PropertyList";
-import ArrowBackIcon from "@mui/icons-material/ArrowBack";
+import Icon from "../../../../common/Icon";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const ChangeProperty = props => {
@@ -34,7 +34,9 @@ const ChangeProperty = props => {
           className: "tv-act-ico",
           size: "small",
           onClick: onBack,
-          children: /*#__PURE__*/_jsx(ArrowBackIcon, {})
+          children: /*#__PURE__*/_jsx(Icon, {
+            icon: 'leftArrow'
+          })
         }), "Change Property"]
       }), /*#__PURE__*/_jsx(IconButton, {
         className: "tv-act-ico bg br1",

package/dist/Editor/Elements/DataView/Layouts/Options/ColumnsList.js

@@ -1,6 +1,7 @@
 import React from "react";
 import { List, ListItemButton, ListItemIcon, ListItemText, Box } from "@mui/material";
 import { PROPERTY_TYPES } from "./Constants";
+import Icon from "../../../../common/Icon";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const ColumnsList = props => {
@@ -17,13 +18,15 @@ const ColumnsList = props => {
       className: "tv-opt-list",
       children: properties?.map((m, i) => {
         const {
-          Icon
+          Icon: iconType
         } = PROPERTY_TYPES?.find(f => f.type === m.type) || {};
         return /*#__PURE__*/_jsxs(ListItemButton, {
           className: selected?.type === m?.type ? "active" : "",
           onClick: onSelect(m),
           children: [/*#__PURE__*/_jsx(ListItemIcon, {
-            children: /*#__PURE__*/_jsx(Icon, {})
+            children: /*#__PURE__*/_jsx(Icon, {
+              icon: iconType
+            })
           }), /*#__PURE__*/_jsx(ListItemText, {
             primary: m?.label
           })]