@superdispatch/ui-lab 0.21.4 → 0.21.5-alpha.0

package/dist-node/index.js

@@ -4,8 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
 
-var icons = require('@material-ui/icons');
-var lab = require('@material-ui/lab');
+var iconsMaterial = require('@mui/icons-material');
+var lab = require('@mui/lab');
 var ui = require('@superdispatch/ui');
 var react = require('react');
 var styled = require('styled-components');
@@ -14,7 +14,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var _objectSpread = _interopDefault(require('@babel/runtime/helpers/objectSpread2'));
 var _objectWithoutProperties = _interopDefault(require('@babel/runtime/helpers/objectWithoutProperties'));
 var reactTransitionGroup = require('react-transition-group');
-var core = require('@material-ui/core');
+var material = require('@mui/material');
 var js = require('@mdi/js');
 var Dropzone = _interopDefault(require('react-dropzone'));
 var reactAnchorme = require('react-anchorme');
@@ -34,9 +34,9 @@ function toMaterialSeverity(severity) {
 }
 
 var iconMapping = {
-  success: /*#__PURE__*/jsxRuntime.jsx(icons.CheckCircle, {}),
-  info: /*#__PURE__*/jsxRuntime.jsx(icons.Info, {}),
-  error: /*#__PURE__*/jsxRuntime.jsx(icons.Error, {})
+  success: /*#__PURE__*/jsxRuntime.jsx(iconsMaterial.CheckCircle, {}),
+  info: /*#__PURE__*/jsxRuntime.jsx(iconsMaterial.Info, {}),
+  error: /*#__PURE__*/jsxRuntime.jsx(iconsMaterial.Error, {})
 };
 var Alert = /*#__PURE__*/react.forwardRef((_ref, ref) => {
   var {
@@ -275,7 +275,7 @@ var Box = /*#__PURE__*/styled__default.div.withConfig({
 });
 
 var _excluded$1 = ["icon", "children", "variant", "active", "disabled", "fullWidth"];
-var ButtonRoot = /*#__PURE__*/styled__default(core.ButtonBase).withConfig({
+var ButtonRoot = /*#__PURE__*/styled__default(material.ButtonBase).withConfig({
   displayName: "ButtonArea__ButtonRoot",
   componentId: "SD__sc-1czum63-0"
 })(["padding:12px 32px;border-width:1px;border-radius:4px;border-style:solid;border-color:", ";color:", ";background-color:", ";& svg{color:inherit;font-size:24px;}&[data-full-width='true']{width:100%;}&[data-disabled='true']{color:", ";border-color:", ";}&[data-variant='success']{&:hover{color:", ";box-shadow:0 0 0 2px ", ";border-color:", ";}&[data-active='true']{color:", ";border-color:", ";background-color:", ";}}&[data-variant='danger']{&:hover{color:", ";box-shadow:0 0 0 2px ", ";border-color:", ";}&[data-active='true']{color:", ";border-color:", ";background-color:", ";}}"], ui.Color.Silver500, ui.Color.Dark100, ui.Color.White, ui.Color.Silver500, ui.Color.Silver400, ui.Color.Green300, ui.Color.Green100, ui.Color.Green300, ui.Color.Green300, ui.Color.Green300, ui.Color.Green50, ui.Color.Red300, ui.Color.Red100, ui.Color.Red300, ui.Color.Red300, ui.Color.Red300, ui.Color.Red50);
@@ -301,7 +301,7 @@ var ButtonArea = /*#__PURE__*/react.forwardRef((_ref, ref) => {
     children: /*#__PURE__*/jsxRuntime.jsxs(ui.Stack, {
       align: "center",
       space: "xxsmall",
-      children: [icon, /*#__PURE__*/jsxRuntime.jsx(core.Typography, {
+      children: [icon, /*#__PURE__*/jsxRuntime.jsx(material.Typography, {
         variant: "h4",
         color: disabled ? 'inherit' : 'textPrimary',
         children: children
@@ -490,7 +490,7 @@ function useButtonProps(_ref3) {
       }), children, !!endIcon && /*#__PURE__*/jsxRuntime.jsx(ButtonEndIcon, {
         children: endIcon
       }), pending && /*#__PURE__*/jsxRuntime.jsx(ButtonPendingIndicator, {
-        children: /*#__PURE__*/jsxRuntime.jsx(core.CircularProgress, {
+        children: /*#__PURE__*/jsxRuntime.jsx(material.CircularProgress, {
           size: "1em",
           color: "inherit"
         })
@@ -815,7 +815,7 @@ function UploadRejection(_ref2) {
     align: "center",
     children: [/*#__PURE__*/jsxRuntime.jsx(ui.Column, {
       width: "content",
-      children: /*#__PURE__*/jsxRuntime.jsx(icons.Error, {})
+      children: /*#__PURE__*/jsxRuntime.jsx(iconsMaterial.Error, {})
     }), /*#__PURE__*/jsxRuntime.jsx(ui.Column, {
       children: error.code === 'file-too-large' ? maxSize == null ? 'Attachment size is too large' : "Attachment size should be less than ".concat(formatBytes(maxSize)) : error.message
     })]
@@ -828,7 +828,7 @@ var FileDropZone = /*#__PURE__*/react.forwardRef((props, ref) => {
     disabled = false,
     children: _children = 'Upload Attachments',
     hintText = 'or Drag & Drop files',
-    startIcon = /*#__PURE__*/jsxRuntime.jsx(core.SvgIcon, {
+    startIcon = /*#__PURE__*/jsxRuntime.jsx(material.SvgIcon, {
       children: /*#__PURE__*/jsxRuntime.jsx("path", {
         d: js.mdiUpload
       })
@@ -836,7 +836,7 @@ var FileDropZone = /*#__PURE__*/react.forwardRef((props, ref) => {
     fallback = /*#__PURE__*/jsxRuntime.jsx(ui.CardButton, {
       ref: ref,
       disabled: true,
-      startIcon: /*#__PURE__*/jsxRuntime.jsx(core.CircularProgress, {
+      startIcon: /*#__PURE__*/jsxRuntime.jsx(material.CircularProgress, {
         size: "1em",
         color: "inherit"
       }),
@@ -897,7 +897,7 @@ var FileListItemName = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "FileListItem__FileListItemName",
   componentId: "SD__sc-hxbsiy-0"
 })(["overflow:hidden;line-height:22px;white-space:nowrap;text-overflow:ellipsis;"]);
-var FileListItemProgress = /*#__PURE__*/styled__default(core.CircularProgress).withConfig({
+var FileListItemProgress = /*#__PURE__*/styled__default(material.CircularProgress).withConfig({
   displayName: "FileListItem__FileListItemProgress",
   componentId: "SD__sc-hxbsiy-1"
 })(["font-size:24px;", "{font-size:14px;}"], _ref => {
@@ -906,12 +906,12 @@ var FileListItemProgress = /*#__PURE__*/styled__default(core.CircularProgress).w
   } = _ref;
   return theme.breakpoints.up('sm');
 });
-var PdfIcon = /*#__PURE__*/react.memo(props => /*#__PURE__*/jsxRuntime.jsx(core.SvgIcon, _objectSpread(_objectSpread({}, props), {}, {
+var PdfIcon = /*#__PURE__*/react.memo(props => /*#__PURE__*/jsxRuntime.jsx(material.SvgIcon, _objectSpread(_objectSpread({}, props), {}, {
   children: /*#__PURE__*/jsxRuntime.jsx("path", {
     d: js.mdiFilePdfBox
   })
 })));
-var TextBoxIcon = /*#__PURE__*/react.memo(props => /*#__PURE__*/jsxRuntime.jsx(core.SvgIcon, _objectSpread(_objectSpread({}, props), {}, {
+var TextBoxIcon = /*#__PURE__*/react.memo(props => /*#__PURE__*/jsxRuntime.jsx(material.SvgIcon, _objectSpread(_objectSpread({}, props), {}, {
   children: /*#__PURE__*/jsxRuntime.jsx("path", {
     d: js.mdiTextBox
   })
@@ -952,13 +952,13 @@ var FileListItem = /*#__PURE__*/react.forwardRef((_ref2, ref) => {
       space: "xsmall",
       children: [/*#__PURE__*/jsxRuntime.jsx(ui.Column, {
         width: "content",
-        children: status === 'error' ? /*#__PURE__*/jsxRuntime.jsx(icons.Error, {
+        children: status === 'error' ? /*#__PURE__*/jsxRuntime.jsx(iconsMaterial.Error, {
           color: "error",
           fontSize: "small"
         }) : fileType === 'pdf' ? /*#__PURE__*/jsxRuntime.jsx(PdfIcon, {
           color: "action",
           fontSize: "small"
-        }) : fileType === 'image' ? /*#__PURE__*/jsxRuntime.jsx(icons.Image, {
+        }) : fileType === 'image' ? /*#__PURE__*/jsxRuntime.jsx(iconsMaterial.Image, {
           color: "action",
           fontSize: "small"
         }) : /*#__PURE__*/jsxRuntime.jsx(TextBoxIcon, {
@@ -969,7 +969,7 @@ var FileListItem = /*#__PURE__*/react.forwardRef((_ref2, ref) => {
         width: "fluid",
         children: /*#__PURE__*/jsxRuntime.jsx(FileListItemName, {
           id: uid,
-          children: !url ? name : /*#__PURE__*/jsxRuntime.jsx(core.Link, {
+          children: !url ? name : /*#__PURE__*/jsxRuntime.jsx(material.Link, {
             href: url,
             noWrap: true,
             target: "_blank",
@@ -979,36 +979,36 @@ var FileListItem = /*#__PURE__*/react.forwardRef((_ref2, ref) => {
         })
       }), status === 'error' && /*#__PURE__*/jsxRuntime.jsx(ui.Column, {
         width: "content",
-        children: /*#__PURE__*/jsxRuntime.jsx(core.Tooltip, {
+        children: /*#__PURE__*/jsxRuntime.jsx(material.Tooltip, {
           title: "Retry",
-          children: /*#__PURE__*/jsxRuntime.jsx(core.IconButton, {
+          children: /*#__PURE__*/jsxRuntime.jsx(material.IconButton, {
             size: "small",
             onClick: onRetry,
-            children: /*#__PURE__*/jsxRuntime.jsx(icons.Refresh, {
+            children: /*#__PURE__*/jsxRuntime.jsx(iconsMaterial.Refresh, {
               fontSize: "small"
             })
           })
         })
       }), /*#__PURE__*/jsxRuntime.jsx(ui.Column, {
         width: "content",
-        children: status === 'loading' ? /*#__PURE__*/jsxRuntime.jsx(core.IconButton, {
+        children: status === 'loading' ? /*#__PURE__*/jsxRuntime.jsx(material.IconButton, {
           size: "small",
           disabled: true,
           children: /*#__PURE__*/jsxRuntime.jsx(FileListItemProgress, {
             size: "1em"
           })
-        }) : !isHovered && status === 'success' ? /*#__PURE__*/jsxRuntime.jsx(core.IconButton, {
+        }) : !isHovered && status === 'success' ? /*#__PURE__*/jsxRuntime.jsx(material.IconButton, {
           size: "small",
-          children: /*#__PURE__*/jsxRuntime.jsx(icons.CheckCircle, {
+          children: /*#__PURE__*/jsxRuntime.jsx(iconsMaterial.CheckCircle, {
             fontSize: "small",
             htmlColor: ui.Color.Green300
           })
-        }) : canDelete ? /*#__PURE__*/jsxRuntime.jsx(core.Tooltip, {
+        }) : canDelete ? /*#__PURE__*/jsxRuntime.jsx(material.Tooltip, {
           title: "Delete",
-          children: /*#__PURE__*/jsxRuntime.jsx(core.IconButton, {
+          children: /*#__PURE__*/jsxRuntime.jsx(material.IconButton, {
             size: "small",
             onClick: onDelete,
-            children: /*#__PURE__*/jsxRuntime.jsx(icons.Delete, {
+            children: /*#__PURE__*/jsxRuntime.jsx(iconsMaterial.Delete, {
               fontSize: "small"
             })
           })
@@ -1029,7 +1029,7 @@ var DefaultLinkComponent = /*#__PURE__*/react.forwardRef((_ref, ref) => {
   } = _ref,
       props = _objectWithoutProperties(_ref, _excluded$6);
 
-  return /*#__PURE__*/jsxRuntime.jsx(core.Link, _objectSpread(_objectSpread({}, props), {}, {
+  return /*#__PURE__*/jsxRuntime.jsx(material.Link, _objectSpread(_objectSpread({}, props), {}, {
     ref: ref,
     rel: rel,
     target: target
@@ -1076,11 +1076,11 @@ function useNavbarContext() {
   return react.useContext(NavbarContext);
 }
 
-var StyledBottomNavigation = /*#__PURE__*/styled__default(core.BottomNavigation).withConfig({
+var StyledBottomNavigation = /*#__PURE__*/styled__default(material.BottomNavigation).withConfig({
   displayName: "NavbarBottomBar__StyledBottomNavigation",
   componentId: "SD__sc-9z6v3k-0"
 })(["background:", ";"], ui.Color.Dark500);
-var StyledBottomNavigationAction = /*#__PURE__*/styled__default(core.BottomNavigationAction).withConfig({
+var StyledBottomNavigationAction = /*#__PURE__*/styled__default(material.BottomNavigationAction).withConfig({
   displayName: "NavbarBottomBar__StyledBottomNavigationAction",
   componentId: "SD__sc-9z6v3k-1"
 })(["&&{background:#1b2638;color:", ";padding:6px 0 8px;line-height:20px;}&:first-child{padding-left:12px;}&:last-child{padding-right:12px;}&.Mui-selected{color:", ";.MuiBottomNavigationAction-label{font-size:0.75rem;}}"], ui.Color.Silver500, ui.Color.White);
@@ -1123,10 +1123,10 @@ function NavbarBottomBar(_ref) {
       value: "menu",
       label: "Menu",
       icon: hasMenuBadge ? /*#__PURE__*/jsxRuntime.jsxs(IconWrapper, {
-        children: [/*#__PURE__*/jsxRuntime.jsx(IconLabel, {}), /*#__PURE__*/jsxRuntime.jsx(icons.Menu, {
+        children: [/*#__PURE__*/jsxRuntime.jsx(IconLabel, {}), /*#__PURE__*/jsxRuntime.jsx(iconsMaterial.Menu, {
           fontSize: "small"
         })]
-      }) : /*#__PURE__*/jsxRuntime.jsx(icons.Menu, {
+      }) : /*#__PURE__*/jsxRuntime.jsx(iconsMaterial.Menu, {
         fontSize: "small"
       })
     })]
@@ -1187,7 +1187,7 @@ var NavbarAccordionLabel = /*#__PURE__*/styled__default.span.withConfig({
   displayName: "NavbarAccordion__NavbarAccordionLabel",
   componentId: "SD__sc-1s7g3kw-0"
 })(["flex-grow:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;&[data-expanded='false']{display:none;}"]);
-var NavbarAccordionRoot = /*#__PURE__*/styled__default(core.Accordion).withConfig({
+var NavbarAccordionRoot = /*#__PURE__*/styled__default(material.Accordion).withConfig({
   displayName: "NavbarAccordion__NavbarAccordionRoot",
   componentId: "SD__sc-1s7g3kw-1"
 })(_ref => {
@@ -1196,7 +1196,7 @@ var NavbarAccordionRoot = /*#__PURE__*/styled__default(core.Accordion).withConfi
   } = _ref;
   return styled.css(["width:100%;color:#c2c4c9;font-size:14px;font-weight:400;line-height:20px;text-decoration:none;outline:none;cursor:pointer;background-color:#1b2638;margin-top:", ";&[aria-current]{background-color:#2f394a;color:", ";}&.MuiAccordion-root:before{background-color:#1b2638;}&.MuiPaper-elevation0{border:0px;}&.MuiAccordion-root.Mui-expanded{margin-top:", ";}"], gutter ? '16px' : '0', ui.Color.White, gutter ? '16px' : '0');
 });
-var NavbarAccordionSummary = /*#__PURE__*/styled__default(core.AccordionSummary).withConfig({
+var NavbarAccordionSummary = /*#__PURE__*/styled__default(material.AccordionSummary).withConfig({
   displayName: "NavbarAccordion__NavbarAccordionSummary",
   componentId: "SD__sc-1s7g3kw-2"
 })(["border-left:4px solid transparent;padding-left:20px;&.MuiAccordionSummary-root{max-height:40px;min-height:40px;}&.MuiAccordionSummary-content{align-items:center;}&:hover,&[aria-current],&[data-active='true']{color:", ";background-color:#2f394a;border-left-color:", ";}&[data-expanded='false']{.MuiAccordionSummary-expandIcon{display:none;}}"], ui.Color.White, ui.Color.Blue300);
@@ -1237,7 +1237,7 @@ function NavbarAccordion(_ref2) {
     children: [/*#__PURE__*/jsxRuntime.jsxs(NavbarAccordionSummary, {
       "data-active": !isExpanded && items.some(item => item.active),
       "data-expanded": isNavbarExpanded,
-      expandIcon: /*#__PURE__*/jsxRuntime.jsx(icons.ExpandMore, {}),
+      expandIcon: /*#__PURE__*/jsxRuntime.jsx(iconsMaterial.ExpandMore, {}),
       children: [/*#__PURE__*/jsxRuntime.jsx(IconWrapper$2, {
         children: icon
       }), /*#__PURE__*/jsxRuntime.jsx(NavbarAccordionLabel, {
@@ -1294,7 +1294,7 @@ var Wrapper = /*#__PURE__*/styled__default.div.withConfig({
   } = _ref3;
   return isMobile ? '280px' : '72px';
 }, Header);
-var ExpandIconButton = /*#__PURE__*/styled__default(core.IconButton).withConfig({
+var ExpandIconButton = /*#__PURE__*/styled__default(material.IconButton).withConfig({
   displayName: "NavbarList__ExpandIconButton",
   componentId: "SD__sc-19zrmxc-2"
 })(["color:", ";&&:focus{background-color:inherit;}"], ui.Color.Silver500);
@@ -1361,7 +1361,7 @@ function NavbarList(_ref5) {
         onClick: () => {
           setMenuExpanded(!isMenuExpanded);
         },
-        children: isMenuExpanded ? /*#__PURE__*/jsxRuntime.jsx(icons.MenuOpen, {}) : /*#__PURE__*/jsxRuntime.jsx(icons.Menu, {})
+        children: isMenuExpanded ? /*#__PURE__*/jsxRuntime.jsx(iconsMaterial.MenuOpen, {}) : /*#__PURE__*/jsxRuntime.jsx(iconsMaterial.Menu, {})
       })]
     }), /*#__PURE__*/jsxRuntime.jsx(Content, {
       "aria-expanded": isSidebarOpened,
@@ -1415,11 +1415,11 @@ function Navbar(_ref) {
     containerStyle,
     hasExtraBadge
   } = _ref;
-  var theme = core.useTheme();
+  var theme = material.useTheme();
   var [isDrawerOpen, setDrawerOpen] = react.useState(false);
   var platform = ui.useResponsiveValue('mobile', 'tablet', 'desktop');
   var isMobile = platform === 'mobile';
-  var matches = core.useMediaQuery(theme.breakpoints.up('md'), {
+  var matches = material.useMediaQuery(theme.breakpoints.up('md'), {
     noSsr: true
   });
   var [isMenuExpanded, setMenuExpanded] = react.useState(matches);
@@ -1450,7 +1450,7 @@ function Navbar(_ref) {
       }), isMobile && /*#__PURE__*/jsxRuntime.jsx(NavbarBottomBar, {
         items: bottomItems,
         hasMenuBadge: hasBadge
-      }), /*#__PURE__*/jsxRuntime.jsx(core.Drawer, {
+      }), /*#__PURE__*/jsxRuntime.jsx(material.Drawer, {
         open: isDrawerOpen,
         anchor: "right",
         onClose: () => {
@@ -1473,7 +1473,7 @@ function Navbar(_ref) {
 }
 
 var _excluded$7 = ["title", "subtitle", "children"];
-var StyledTypography = /*#__PURE__*/styled__default(core.Typography).withConfig({
+var StyledTypography = /*#__PURE__*/styled__default(material.Typography).withConfig({
   displayName: "NavbarAvatar__StyledTypography",
   componentId: "SD__sc-19q2zd0-0"
 })(["color:", ";text-overflow:ellipsis;white-space:nowrap;overflow:hidden;&:hover{color:", ";}"], ui.Color.Silver500, ui.Color.White);
@@ -1490,7 +1490,7 @@ function NavbarAvatar(_ref) {
   } = useNavbarContext();
 
   if (!isNavbarExpanded) {
-    return /*#__PURE__*/jsxRuntime.jsx(core.Avatar, _objectSpread(_objectSpread({}, props), {}, {
+    return /*#__PURE__*/jsxRuntime.jsx(material.Avatar, _objectSpread(_objectSpread({}, props), {}, {
       children: children
     }));
   }
@@ -1500,7 +1500,7 @@ function NavbarAvatar(_ref) {
     align: "center",
     children: [/*#__PURE__*/jsxRuntime.jsx(ui.Column, {
       width: "content",
-      children: /*#__PURE__*/jsxRuntime.jsx(core.Avatar, _objectSpread(_objectSpread({}, props), {}, {
+      children: /*#__PURE__*/jsxRuntime.jsx(material.Avatar, _objectSpread(_objectSpread({}, props), {}, {
         children: children
       }))
     }), /*#__PURE__*/jsxRuntime.jsx(ui.Column, {
@@ -1522,7 +1522,7 @@ var Divider = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "NavbarMenu__Divider",
   componentId: "SD__sc-1c8icpt-0"
 })(["border-bottom:1px solid ", ";margin:8px -16px;"], ui.Color.Silver400);
-var StyledMenuItem = /*#__PURE__*/styled__default(core.MenuItem).withConfig({
+var StyledMenuItem = /*#__PURE__*/styled__default(material.MenuItem).withConfig({
   displayName: "NavbarMenu__StyledMenuItem",
   componentId: "SD__sc-1c8icpt-1"
 })(["& svg{font-size:24px;color:", ";}"], ui.Color.Dark100);
@@ -1559,7 +1559,7 @@ function NavbarMenu(_ref2) {
       onClick: showProfileMenu,
       active: !!anchor,
       children: children
-    }), /*#__PURE__*/jsxRuntime.jsx(core.Menu, {
+    }), /*#__PURE__*/jsxRuntime.jsx(material.Menu, {
       open: !!anchor,
       anchorEl: anchor,
       onClose: hideProfileMenu,
@@ -1578,7 +1578,7 @@ function NavbarMenu(_ref2) {
           children: /*#__PURE__*/jsxRuntime.jsxs(ui.Inline, {
             space: "small",
             verticalAlign: "center",
-            children: [item.icon, /*#__PURE__*/jsxRuntime.jsx(core.Typography, {
+            children: [item.icon, /*#__PURE__*/jsxRuntime.jsx(material.Typography, {
               style: {
                 color: ui.Color.Dark500
               },
@@ -1598,7 +1598,7 @@ var SidebarRoot = /*#__PURE__*/styled__default.aside.withConfig({
 var SidebarHeader = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "Sidebar__SidebarHeader",
   componentId: "SD__sc-b77o22-1"
-})(["top:0;z-index:1;position:sticky;padding-left:24px;padding-right:24px;padding-bottom:8px;background-color:", ";"], ui.Color.White);
+})(["top:0;z-index:2;position:sticky;padding-left:24px;padding-right:24px;padding-bottom:8px;background-color:", ";"], ui.Color.White);
 var SidebarTitle = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "Sidebar__SidebarTitle",
   componentId: "SD__sc-b77o22-2"
@@ -1705,7 +1705,7 @@ var _excluded$8 = ["onClick", "children"];
 function SidebarBackButton(_ref) {
   var {
     onClick: _onClick,
-    children = /*#__PURE__*/jsxRuntime.jsx(icons.ArrowBack, {
+    children = /*#__PURE__*/jsxRuntime.jsx(iconsMaterial.ArrowBack, {
       fontSize: "small"
     })
   } = _ref,
@@ -1720,7 +1720,7 @@ function SidebarBackButton(_ref) {
     return null;
   }
 
-  return /*#__PURE__*/jsxRuntime.jsx(core.IconButton, _objectSpread(_objectSpread({}, props), {}, {
+  return /*#__PURE__*/jsxRuntime.jsx(material.IconButton, _objectSpread(_objectSpread({}, props), {}, {
     size: "small",
     onClick: event => {
       _onClick === null || _onClick === void 0 ? void 0 : _onClick(event);
@@ -1733,7 +1733,7 @@ function SidebarBackButton(_ref) {
   }));
 }
 
-var SidebarAppBar = /*#__PURE__*/styled__default(core.AppBar).withConfig({
+var SidebarAppBar = /*#__PURE__*/styled__default(material.AppBar).withConfig({
   displayName: "SidebarContent__SidebarAppBar",
   componentId: "SD__sc-zpgf61-0"
 })(_ref => {
@@ -1789,7 +1789,7 @@ function SidebarContent(_ref2) {
   return /*#__PURE__*/jsxRuntime.jsxs(ui.Stack, {
     space: "none",
     children: [/*#__PURE__*/jsxRuntime.jsx(SidebarAppBar, {
-      children: /*#__PURE__*/jsxRuntime.jsx(core.Toolbar, {
+      children: /*#__PURE__*/jsxRuntime.jsx(material.Toolbar, {
         disableGutters: true,
         children: /*#__PURE__*/jsxRuntime.jsx(ToolbarContent, {
           children: /*#__PURE__*/jsxRuntime.jsxs(ui.Columns, {
@@ -1834,7 +1834,7 @@ var SidebarDividerRoot = /*#__PURE__*/styled__default.div.withConfig({
 var SidebarDivider = /*#__PURE__*/react.forwardRef((_, ref) => {
   return /*#__PURE__*/jsxRuntime.jsx(SidebarDividerRoot, {
     ref: ref,
-    children: /*#__PURE__*/jsxRuntime.jsx(core.Divider, {})
+    children: /*#__PURE__*/jsxRuntime.jsx(material.Divider, {})
   });
 });
 if (process.env.NODE_ENV !== "production") SidebarDivider.displayName = "SidebarDivider";
@@ -1925,7 +1925,7 @@ var SidebarMenuItem = /*#__PURE__*/react.forwardRef((_ref2, ref) => {
   return /*#__PURE__*/jsxRuntime.jsxs(SidebarMenuItemRoot, {
     ref: ui.mergeRefs(ref, rootRef),
     hasAvatar: !!avatar,
-    children: [/*#__PURE__*/jsxRuntime.jsx(core.ButtonBase, {
+    children: [/*#__PURE__*/jsxRuntime.jsx(material.ButtonBase, {
       disabled: disabled,
       "aria-current": selected,
       onClick: event => {
@@ -1963,7 +1963,7 @@ var SidebarMenuItem = /*#__PURE__*/react.forwardRef((_ref2, ref) => {
                   })
                 }), external && /*#__PURE__*/jsxRuntime.jsx(ui.Column, {
                   width: "content",
-                  children: /*#__PURE__*/jsxRuntime.jsx(icons.OpenInNew, {
+                  children: /*#__PURE__*/jsxRuntime.jsx(iconsMaterial.OpenInNew, {
                     color: "action",
                     fontSize: "small"
                   })
@@ -1993,7 +1993,7 @@ var SidebarMenuItem = /*#__PURE__*/react.forwardRef((_ref2, ref) => {
 });
 if (process.env.NODE_ENV !== "production") SidebarMenuItem.displayName = "SidebarMenuItem";
 
-var SidebarMenuItemActionRoot = /*#__PURE__*/styled__default(core.IconButton).withConfig({
+var SidebarMenuItemActionRoot = /*#__PURE__*/styled__default(material.IconButton).withConfig({
   displayName: "SidebarMenuItemAction__SidebarMenuItemActionRoot",
   componentId: "SD__sc-1n50gmv-0"
 })(["& .MuiSvgIcon-root{font-size:16px;}"]);
@@ -2003,7 +2003,7 @@ var SidebarMenuItemAction = /*#__PURE__*/react.forwardRef((_ref, ref) => {
     placement,
     children
   } = _ref;
-  return /*#__PURE__*/jsxRuntime.jsx(core.Tooltip, {
+  return /*#__PURE__*/jsxRuntime.jsx(material.Tooltip, {
     title: title,
     placement: placement,
     children: /*#__PURE__*/jsxRuntime.jsx(SidebarMenuItemActionRoot, {
@@ -2043,7 +2043,7 @@ var SidebarMenuItemAvatar = /*#__PURE__*/react.forwardRef((_ref, ref) => {
 
   if (value === true || hovered && value != null) {
     return /*#__PURE__*/jsxRuntime.jsx(SidebarMenuItemAvatarCheckbox, {
-      children: /*#__PURE__*/jsxRuntime.jsx(core.Checkbox, {
+      children: /*#__PURE__*/jsxRuntime.jsx(material.Checkbox, {
         color: "primary",
         checked: value,
         disabled: disabled,
@@ -2057,7 +2057,7 @@ var SidebarMenuItemAvatar = /*#__PURE__*/react.forwardRef((_ref, ref) => {
     });
   }
 
-  return /*#__PURE__*/jsxRuntime.jsx(core.Avatar, {
+  return /*#__PURE__*/jsxRuntime.jsx(material.Avatar, {
     ref: ref,
     "aria-hidden": true,
     children: initials