@gridsuite/commons-ui 0.61.4 → 0.63.0

package/dist/components/TopBar/AboutDialog.js

@@ -8,7 +8,7 @@ import { LogoText } from "./GridLogo.js";
 const styles = {
   general: {
     ".MuiAccordion-root": {
-      //dunno why the theme has the background as black in dark mode
+      // dunno why the theme has the background as black in dark mode
       bgcolor: "unset"
     }
   },
@@ -37,7 +37,7 @@ const styles = {
 function getGlobalVersion(fnPromise, type, setData, setLoader) {
   if (fnPromise) {
     console.debug("Getting", type, "global version...");
-    return new Promise((resolve, reject) => {
+    return new Promise((resolve) => {
       if (setLoader) {
         setLoader(true);
       }
@@ -60,10 +60,10 @@ function getGlobalVersion(fnPromise, type, setData, setLoader) {
         setLoader(false);
       }
     });
-  } else {
-    console.debug("No getter for global version");
-    setData(null);
   }
+  console.debug("No getter for global version");
+  setData(null);
+  return Promise.resolve(null);
 }
 const moduleTypeSort = {
   app: 1,
@@ -73,7 +73,141 @@ const moduleTypeSort = {
 function compareModules(c1, c2) {
   return (moduleTypeSort[c1.type] || 100) - (moduleTypeSort[c2.type] || 100) || (c1.name || "").localeCompare(c2.name || "");
 }
-const AboutDialog = ({
+const moduleStyles = {
+  icons: {
+    flexGrow: 0,
+    position: "relative",
+    top: "4px",
+    flexShrink: 0
+  },
+  version: {
+    flexGrow: 0,
+    alignSelf: "flex-end",
+    flexShrink: 0
+  },
+  tooltip: (theme) => ({
+    [`& .${tooltipClasses.tooltip}`]: {
+      border: "1px solid #dadde9",
+      boxShadow: theme.shadows[1]
+    }
+  }),
+  tooltipDetails: {
+    display: "grid",
+    gridTemplateColumns: "max-content auto",
+    margin: 0,
+    dt: {
+      gridColumnStart: 1,
+      "&:after": {
+        content: '" :"'
+      }
+    },
+    dd: {
+      gridColumnStart: 2,
+      paddingLeft: "0.5em"
+    }
+  }
+};
+const ModuleTypesIcons = {
+  app: /* @__PURE__ */ jsx(
+    WidgetsOutlined,
+    {
+      sx: moduleStyles.icons,
+      fontSize: "small",
+      color: "primary"
+    }
+  ),
+  server: /* @__PURE__ */ jsx(
+    DnsOutlined,
+    {
+      sx: moduleStyles.icons,
+      fontSize: "small",
+      color: "secondary"
+    }
+  ),
+  other: /* @__PURE__ */ jsx(QuestionMark, { sx: moduleStyles.icons, fontSize: "small" })
+};
+function insensitiveCaseCompare(str, obj) {
+  return str.localeCompare(obj, void 0, {
+    sensitivity: "base"
+  });
+}
+function tooltipTypeLabel(type) {
+  if (insensitiveCaseCompare("app", type) === 0) {
+    return "about-dialog/module-tooltip-app";
+  }
+  if (insensitiveCaseCompare("server", type) === 0) {
+    return "about-dialog/module-tooltip-server";
+  }
+  return "about-dialog/module-tooltip-other";
+}
+function Module({ type, name, version, gitTag }) {
+  return /* @__PURE__ */ jsx(
+    Grid,
+    {
+      item: true,
+      xs: 12,
+      sm: 6,
+      md: 4,
+      sx: {
+        ".MuiTypography-root": {
+          minWidth: "3em"
+        }
+      },
+      children: /* @__PURE__ */ jsx(
+        Tooltip,
+        {
+          TransitionComponent: Zoom,
+          enterDelay: 2500,
+          enterNextDelay: 350,
+          leaveDelay: 200,
+          placement: "bottom-start",
+          arrow: true,
+          sx: moduleStyles.tooltip,
+          title: /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(Typography, { variant: "body1", children: name || "<?>" }),
+            /* @__PURE__ */ jsxs(Box, { component: "dl", sx: moduleStyles.tooltipDetails, children: [
+              /* @__PURE__ */ jsx(Typography, { variant: "body2", component: "dt", children: /* @__PURE__ */ jsx(FormattedMessage, { id: "about-dialog/label-type" }) }),
+              /* @__PURE__ */ jsx(Typography, { variant: "body2", component: "dd", children: /* @__PURE__ */ jsx(FormattedMessage, { id: tooltipTypeLabel(type) }) }),
+              version && /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx(Typography, { variant: "body2", component: "dt", children: /* @__PURE__ */ jsx(FormattedMessage, { id: "about-dialog/label-version" }) }),
+                /* @__PURE__ */ jsx(Typography, { variant: "body2", component: "dd", children: version })
+              ] }),
+              gitTag && /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx(Typography, { variant: "body2", component: "dt", children: /* @__PURE__ */ jsx(FormattedMessage, { id: "about-dialog/label-git-version" }) }),
+                /* @__PURE__ */ jsx(Typography, { variant: "body2", component: "dd", children: gitTag })
+              ] })
+            ] })
+          ] }),
+          children: /* @__PURE__ */ jsxs(
+            Stack,
+            {
+              direction: "row",
+              justifyContent: "flex-start",
+              alignItems: "baseline",
+              spacing: 1,
+              children: [
+                ModuleTypesIcons[type] || ModuleTypesIcons.other,
+                /* @__PURE__ */ jsx(Typography, { display: "inline", noWrap: true, children: name || "<?>" }),
+                /* @__PURE__ */ jsx(
+                  Typography,
+                  {
+                    variant: "caption",
+                    color: (theme) => theme.palette.text.secondary,
+                    display: "inline",
+                    noWrap: true,
+                    sx: moduleStyles.version,
+                    children: gitTag || version || null
+                  }
+                )
+              ]
+            }
+          )
+        }
+      )
+    }
+  );
+}
+function AboutDialog({
   open,
   onClose,
   globalVersionPromise,
@@ -83,9 +217,9 @@ const AboutDialog = ({
   appLicense,
   additionalModulesPromise,
   logo
-}) => {
+}) {
   const theme = useTheme();
-  const [isRefreshing, setRefreshState] = useState(false);
+  const [isRefreshing, setIsRefreshing] = useState(false);
   const [loadingGlobalVersion, setLoadingGlobalVersion] = useState(false);
   const [showGlobalVersion, setShowGlobalVersion] = useState(false);
   const [initialGlobalVersion, setInitialGlobalVersion] = useState(void 0);
@@ -94,8 +228,7 @@ const AboutDialog = ({
       getGlobalVersion(
         globalVersionPromise,
         "Initial",
-        setInitialGlobalVersion,
-        void 0
+        setInitialGlobalVersion
       );
     }
   }, [globalVersionPromise, initialGlobalVersion]);
@@ -121,14 +254,14 @@ const AboutDialog = ({
         name: `Grid${appName}`,
         type: "app",
         version: appVersion,
-        gitTag: appGitTag,
-        license: appLicense
+        gitTag: appGitTag
+        // license: appLicense,
       };
       (additionalModulesPromise ? Promise.resolve(setLoadingAdditionalModules(true)).then(
         () => additionalModulesPromise()
       ) : Promise.reject(new Error("no getter"))).then(
         (values) => Array.isArray(values) ? values : [],
-        (reason) => []
+        () => []
       ).then((values) => {
         setModules([currentApp, ...values]);
       }).finally(() => setLoadingAdditionalModules(false));
@@ -158,7 +291,7 @@ const AboutDialog = ({
       "aria-labelledby": "alert-dialog-title",
       "aria-describedby": "alert-dialog-description",
       TransitionProps: {
-        onExited: (node) => {
+        onExited: () => {
           setModules(null);
           setActualGlobalVersion(null);
         }
@@ -180,7 +313,7 @@ const AboutDialog = ({
                   loadingPosition: "start",
                   loading: isRefreshing,
                   onClick: () => {
-                    setRefreshState(true);
+                    setIsRefreshing(true);
                     window.location.reload();
                   },
                   children: /* @__PURE__ */ jsx(FormattedMessage, { id: "refresh" })
@@ -205,7 +338,7 @@ const AboutDialog = ({
                   in: loadingGlobalVersion,
                   appear: true,
                   unmountOnExit: true,
-                  onExited: (node) => setShowGlobalVersion(true),
+                  onExited: () => setShowGlobalVersion(true),
                   children: /* @__PURE__ */ jsx(CircularProgress, {})
                 }
               ),
@@ -291,14 +424,13 @@ const AboutDialog = ({
                     type: module.type,
                     name: module.name,
                     version: module.version,
-                    gitTag: module.gitTag,
-                    license: module.license
+                    gitTag: module.gitTag
                   },
                   `module-${idx}`
                 )) }) || /* @__PURE__ */ jsx(
                   Typography,
                   {
-                    color: (theme2) => theme2.palette.error.main,
+                    color: (selectedTheme) => selectedTheme.palette.error.main,
                     children: "Error"
                   }
                 ) }) })
@@ -310,141 +442,7 @@ const AboutDialog = ({
       ]
     }
   );
-};
-const moduleStyles = {
-  icons: {
-    flexGrow: 0,
-    position: "relative",
-    top: "4px",
-    flexShrink: 0
-  },
-  version: {
-    flexGrow: 0,
-    alignSelf: "flex-end",
-    flexShrink: 0
-  },
-  tooltip: (theme) => ({
-    [`& .${tooltipClasses.tooltip}`]: {
-      border: "1px solid #dadde9",
-      boxShadow: theme.shadows[1]
-    }
-  }),
-  tooltipDetails: {
-    display: "grid",
-    gridTemplateColumns: "max-content auto",
-    margin: 0,
-    dt: {
-      gridColumnStart: 1,
-      "&:after": {
-        content: '" :"'
-      }
-    },
-    dd: {
-      gridColumnStart: 2,
-      paddingLeft: "0.5em"
-    }
-  }
-};
-const ModuleTypesIcons = {
-  app: /* @__PURE__ */ jsx(
-    WidgetsOutlined,
-    {
-      sx: moduleStyles.icons,
-      fontSize: "small",
-      color: "primary"
-    }
-  ),
-  server: /* @__PURE__ */ jsx(
-    DnsOutlined,
-    {
-      sx: moduleStyles.icons,
-      fontSize: "small",
-      color: "secondary"
-    }
-  ),
-  other: /* @__PURE__ */ jsx(QuestionMark, { sx: moduleStyles.icons, fontSize: "small" })
-};
-function insensitiveCaseCompare(str, obj) {
-  return str.localeCompare(obj, void 0, {
-    sensitivity: "base"
-  });
-}
-function tooltipTypeLabel(type) {
-  if (insensitiveCaseCompare("app", type) === 0) {
-    return "about-dialog/module-tooltip-app";
-  } else if (insensitiveCaseCompare("server", type) === 0) {
-    return "about-dialog/module-tooltip-server";
-  } else {
-    return "about-dialog/module-tooltip-other";
-  }
 }
-const Module = ({ type, name, version, gitTag }) => {
-  return /* @__PURE__ */ jsx(
-    Grid,
-    {
-      item: true,
-      xs: 12,
-      sm: 6,
-      md: 4,
-      sx: {
-        ".MuiTypography-root": {
-          minWidth: "3em"
-        }
-      },
-      children: /* @__PURE__ */ jsx(
-        Tooltip,
-        {
-          TransitionComponent: Zoom,
-          enterDelay: 2500,
-          enterNextDelay: 350,
-          leaveDelay: 200,
-          placement: "bottom-start",
-          arrow: true,
-          sx: moduleStyles.tooltip,
-          title: /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx(Typography, { variant: "body1", children: name || "<?>" }),
-            /* @__PURE__ */ jsxs(Box, { component: "dl", sx: moduleStyles.tooltipDetails, children: [
-              /* @__PURE__ */ jsx(Typography, { variant: "body2", component: "dt", children: /* @__PURE__ */ jsx(FormattedMessage, { id: "about-dialog/label-type" }) }),
-              /* @__PURE__ */ jsx(Typography, { variant: "body2", component: "dd", children: /* @__PURE__ */ jsx(FormattedMessage, { id: tooltipTypeLabel(type) }) }),
-              version && /* @__PURE__ */ jsxs(Fragment, { children: [
-                /* @__PURE__ */ jsx(Typography, { variant: "body2", component: "dt", children: /* @__PURE__ */ jsx(FormattedMessage, { id: "about-dialog/label-version" }) }),
-                /* @__PURE__ */ jsx(Typography, { variant: "body2", component: "dd", children: version })
-              ] }),
-              gitTag && /* @__PURE__ */ jsxs(Fragment, { children: [
-                /* @__PURE__ */ jsx(Typography, { variant: "body2", component: "dt", children: /* @__PURE__ */ jsx(FormattedMessage, { id: "about-dialog/label-git-version" }) }),
-                /* @__PURE__ */ jsx(Typography, { variant: "body2", component: "dd", children: gitTag })
-              ] })
-            ] })
-          ] }),
-          children: /* @__PURE__ */ jsxs(
-            Stack,
-            {
-              direction: "row",
-              justifyContent: "flex-start",
-              alignItems: "baseline",
-              spacing: 1,
-              children: [
-                ModuleTypesIcons[type] || ModuleTypesIcons["other"],
-                /* @__PURE__ */ jsx(Typography, { display: "inline", noWrap: true, children: name || "<?>" }),
-                /* @__PURE__ */ jsx(
-                  Typography,
-                  {
-                    variant: "caption",
-                    color: (theme) => theme.palette.text.secondary,
-                    display: "inline",
-                    noWrap: true,
-                    sx: moduleStyles.version,
-                    children: gitTag || version || null
-                  }
-                )
-              ]
-            }
-          )
-        }
-      )
-    }
-  );
-};
 export {
   AboutDialog as default
 };

package/dist/components/TopBar/GridLogo.d.ts

@@ -4,7 +4,8 @@ import { SxProps } from '@mui/material';
 export interface GridLogoProps extends Omit<LogoTextProps, 'style'> {
     appLogo: ReactNode;
 }
-declare const GridLogo: ({ appLogo, appName, appColor, onClick, }: Partial<GridLogoProps>) => import("react/jsx-runtime").JSX.Element;
+export declare function LogoText({ appName, appColor, style, onClick, }: Partial<LogoTextProps>): import("react/jsx-runtime").JSX.Element;
+declare function GridLogo({ appLogo, appName, appColor, onClick, }: Partial<GridLogoProps>): import("react/jsx-runtime").JSX.Element;
 export default GridLogo;
 export interface LogoTextProps {
     appName: string;
@@ -12,4 +13,3 @@ export interface LogoTextProps {
     style: SxProps;
     onClick: () => void;
 }
-export declare const LogoText: ({ appName, appColor, style, onClick, }: Partial<LogoTextProps>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/TopBar/GridLogo.js

@@ -1,5 +1,5 @@
-import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { Box, Typography } from "@mui/material";
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import { Typography, Box } from "@mui/material";
 import { BrokenImage } from "@mui/icons-material";
 import { mergeSx } from "../../utils/styles.js";
 const styles = {
@@ -17,12 +17,31 @@ const styles = {
     cursor: "pointer"
   }
 };
-const GridLogo = ({
+function LogoText({
+  appName,
+  appColor,
+  style,
+  onClick
+}) {
+  return /* @__PURE__ */ jsxs(
+    Typography,
+    {
+      variant: "h4",
+      sx: mergeSx(style, onClick && styles.clickable),
+      onClick,
+      children: [
+        /* @__PURE__ */ jsx("span", { style: { fontWeight: "bold" }, children: "Grid" }),
+        /* @__PURE__ */ jsx("span", { style: { color: appColor }, children: appName })
+      ]
+    }
+  );
+}
+function GridLogo({
   appLogo,
   appName,
   appColor,
   onClick
-}) => {
+}) {
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(
       Box,
@@ -42,26 +61,7 @@ const GridLogo = ({
       }
     )
   ] });
-};
-const LogoText = ({
-  appName,
-  appColor,
-  style,
-  onClick
-}) => {
-  return /* @__PURE__ */ jsxs(
-    Typography,
-    {
-      variant: "h4",
-      sx: mergeSx(style, onClick && styles.clickable),
-      onClick,
-      children: [
-        /* @__PURE__ */ jsx("span", { style: { fontWeight: "bold" }, children: "Grid" }),
-        /* @__PURE__ */ jsx("span", { style: { color: appColor }, children: appName })
-      ]
-    }
-  );
-};
+}
 export {
   LogoText,
   GridLogo as default

package/dist/components/TopBar/TopBar.d.ts

@@ -1,9 +1,8 @@
 import { CommonMetadata } from '../../services';
-import { User } from 'oidc-client';
 import { LogoutProps } from '../Login/Logout';
 import { AboutDialogProps } from './AboutDialog';
 import { GridLogoProps } from './GridLogo';
-import { default as PropTypes } from 'prop-types';
+import { User } from 'oidc-client';
 import { PropsWithChildren, ReactNode } from 'react';
 
 export declare const DARK_THEME = "Dark";
@@ -28,29 +27,5 @@ export type TopBarProps = Omit<GridLogoProps, 'onClick'> & Omit<LogoutProps, 'di
     onLanguageClick: (value: GsLang) => void;
     language: GsLang;
 };
-declare const TopBar: {
-    ({ appName, appColor, appLogo, appVersion, appLicense, logoAboutDialog, onParametersClick, onLogoutClick, onLogoClick, user, children, appsAndUrls, onAboutClick, globalVersionPromise, additionalModulesPromise, onThemeClick, theme, onEquipmentLabellingClick, equipmentLabelling, onLanguageClick, language, }: PropsWithChildren<TopBarProps>): import("react/jsx-runtime").JSX.Element;
-    propTypes: {
-        onParametersClick: PropTypes.Requireable<(...args: any[]) => any>;
-        onLogoutClick: PropTypes.Requireable<(...args: any[]) => any>;
-        onLogoClick: PropTypes.Requireable<(...args: any[]) => any>;
-        appName: PropTypes.Requireable<string>;
-        appColor: PropTypes.Requireable<string>;
-        appLogo: PropTypes.Requireable<object>;
-        appVersion: PropTypes.Requireable<string>;
-        appLicense: PropTypes.Requireable<string>;
-        user: PropTypes.Requireable<object>;
-        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        appsAndUrls: PropTypes.Requireable<any[]>;
-        onThemeClick: PropTypes.Requireable<(...args: any[]) => any>;
-        theme: PropTypes.Requireable<string>;
-        onAboutClick: PropTypes.Requireable<(...args: any[]) => any>;
-        globalVersionPromise: PropTypes.Requireable<(...args: any[]) => any>;
-        additionalModulesPromise: PropTypes.Requireable<(...args: any[]) => any>;
-        onEquipmentLabellingClick: PropTypes.Requireable<(...args: any[]) => any>;
-        equipmentLabelling: PropTypes.Requireable<boolean>;
-        onLanguageClick: PropTypes.Validator<(...args: any[]) => any>;
-        language: PropTypes.Validator<string>;
-    };
-};
+declare function TopBar({ appName, appColor, appLogo, appVersion, appLicense, logoAboutDialog, onParametersClick, onLogoutClick, onLogoClick, user, children, appsAndUrls, onAboutClick, globalVersionPromise, additionalModulesPromise, onThemeClick, theme, onEquipmentLabellingClick, equipmentLabelling, onLanguageClick, language, }: PropsWithChildren<TopBarProps>): import("react/jsx-runtime").JSX.Element;
 export default TopBar;

package/dist/components/TopBar/TopBar.js

@@ -4,7 +4,6 @@ import { FormattedMessage } from "react-intl";
 import { Menu, MenuItem, ListItemIcon, AppBar, Toolbar, Box, IconButton, ListItemText, Button, Popper, Paper, ClickAwayListener, MenuList, Typography, ToggleButtonGroup, ToggleButton, darken } from "@mui/material";
 import { Apps, ArrowDropUp, ArrowDropDown, Person, WbSunny, Brightness3, Computer, Settings, HelpOutline, ExitToApp } from "@mui/icons-material";
 import { styled } from "@mui/system";
-import PropTypes from "prop-types";
 import GridLogo from "./GridLogo.js";
 import AboutDialog from "./AboutDialog.js";
 const styles = {
@@ -107,7 +106,7 @@ const LANG_ENGLISH = "en";
 const LANG_FRENCH = "fr";
 const EN = "EN";
 const FR = "FR";
-const TopBar = ({
+function TopBar({
   appName,
   appColor,
   appLogo,
@@ -129,7 +128,7 @@ const TopBar = ({
   equipmentLabelling,
   onLanguageClick,
   language
-}) => {
+}) {
   const [anchorElSettingsMenu, setAnchorElSettingsMenu] = useState(null);
   const [anchorElAppsMenu, setAnchorElAppsMenu] = useState(
     null
@@ -156,9 +155,8 @@ const TopBar = ({
     const tab = name.split(" ").map((x) => x.charAt(0));
     if (tab.length === 1) {
       return tab[0];
-    } else {
-      return tab[0] + tab[tab.length - 1];
     }
+    return tab[0] + tab[tab.length - 1];
   };
   const changeTheme = (_, value) => {
     if (onThemeClick && value !== null) {
@@ -184,7 +182,7 @@ const TopBar = ({
       setAboutDialogOpen(true);
     }
   };
-  const logo_clickable = useMemo(
+  const logoClickable = useMemo(
     () => /* @__PURE__ */ jsx(
       GridLogo,
       {
@@ -197,9 +195,9 @@ const TopBar = ({
     [onLogoClick, appLogo, appName, appColor]
   );
   return (
-    //@ts-ignore appBar style is not defined
+    // @ts-ignore appBar style is not defined
     /* @__PURE__ */ jsx(AppBar, { position: "static", color: "default", sx: styles.appBar, children: /* @__PURE__ */ jsxs(Toolbar, { children: [
-      logo_clickable,
+      logoClickable,
       /* @__PURE__ */ jsx(Box, { sx: styles.grow, children }),
       user && /* @__PURE__ */ jsxs(Box, { children: [
         /* @__PURE__ */ jsx(
@@ -274,10 +272,10 @@ const TopBar = ({
             sx: styles.showHideMenu,
             onClick: handleToggleSettingsMenu,
             color: "inherit",
-            style: Boolean(anchorElSettingsMenu) ? { cursor: "initial" } : { cursor: "pointer" },
+            style: anchorElSettingsMenu ? { cursor: "initial" } : { cursor: "pointer" },
             children: [
               /* @__PURE__ */ jsx(Box, { component: "span", sx: styles.name, children: user !== null ? abbreviationFromUserName(
-                //@ts-ignore name could be undefined, how to handle this case ?
+                // @ts-ignore name could be undefined, how to handle this case ?
                 user.profile.name
               ) : "" }),
               anchorElSettingsMenu ? /* @__PURE__ */ jsx(ArrowDropUp, { sx: styles.arrowIcon }) : /* @__PURE__ */ jsx(ArrowDropDown, { sx: styles.arrowIcon })
@@ -599,29 +597,7 @@ const TopBar = ({
       )
     ] }) })
   );
-};
-TopBar.propTypes = {
-  onParametersClick: PropTypes.func,
-  onLogoutClick: PropTypes.func,
-  onLogoClick: PropTypes.func,
-  appName: PropTypes.string,
-  appColor: PropTypes.string,
-  appLogo: PropTypes.object,
-  appVersion: PropTypes.string,
-  appLicense: PropTypes.string,
-  user: PropTypes.object,
-  children: PropTypes.node,
-  appsAndUrls: PropTypes.array,
-  onThemeClick: PropTypes.func,
-  theme: PropTypes.string,
-  onAboutClick: PropTypes.func,
-  globalVersionPromise: PropTypes.func,
-  additionalModulesPromise: PropTypes.func,
-  onEquipmentLabellingClick: PropTypes.func,
-  equipmentLabelling: PropTypes.bool,
-  onLanguageClick: PropTypes.func.isRequired,
-  language: PropTypes.string.isRequired
-};
+}
 export {
   DARK_THEME,
   LANG_ENGLISH,

package/dist/components/TopBar/index.d.ts

@@ -4,6 +4,6 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
-export { default } from './TopBar';
+export { default as TopBar } from './TopBar';
 export * from './GridLogo';
 export { default as AboutDialog } from './AboutDialog';

package/dist/components/TopBar/index.js

@@ -4,5 +4,5 @@ import { default as default3 } from "./AboutDialog.js";
 export {
   default3 as AboutDialog,
   LogoText,
-  default2 as default
+  default2 as TopBar
 };