@gridsuite/commons-ui 0.46.0 → 0.48.0

package/es/components/TopBar/TopBar.js

@@ -1,487 +0,0 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-/**
- * Copyright (c) 2020, RTE (http://www.rte-france.com)
- * This Source Code Form is subject to the terms of the Mozilla Public
- * 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/.
- */
-
-import React, { useMemo, useRef, useState } from 'react';
-import { FormattedMessage } from 'react-intl';
-import { AppBar, Box, Button, ClickAwayListener, IconButton, ListItemIcon, ListItemText, Menu, MenuItem, MenuList, Paper, Popper, ToggleButton, ToggleButtonGroup, Toolbar, Typography } from '@mui/material';
-import { Apps as AppsIcon, ArrowDropDown as ArrowDropDownIcon, ArrowDropUp as ArrowDropUpIcon, Brightness3 as Brightness3Icon, Computer as ComputerIcon, ExitToApp as ExitToAppIcon, Fullscreen as FullscreenIcon, FullscreenExit as FullscreenExitIcon, HelpOutline as HelpOutlineIcon, Person as PersonIcon, Settings as SettingsIcon, WbSunny as WbSunnyIcon } from '@mui/icons-material';
-import { darken } from '@mui/material/styles';
-import { styled } from '@mui/system';
-import PropTypes from 'prop-types';
-import FullScreen, { fullScreenSupported } from 'react-request-fullscreen';
-import GridLogo from './GridLogo';
-import AboutDialog from './AboutDialog';
-var styles = {
-  grow: {
-    flexGrow: 1,
-    display: 'flex',
-    overflow: 'hidden'
-  },
-  menuContainer: {
-    marginLeft: 1
-  },
-  link: {
-    textDecoration: 'none',
-    color: 'inherit'
-  },
-  name: function name(theme) {
-    return {
-      backgroundColor: darken(theme.palette.background.paper, 0.1),
-      paddingTop: '10px',
-      borderRadius: '100%',
-      fontWeight: '400',
-      textTransform: 'uppercase',
-      height: '48px',
-      width: '48px'
-    };
-  },
-  arrowIcon: {
-    fontSize: '40px'
-  },
-  userMail: {
-    fontSize: '14px',
-    display: 'block'
-  },
-  borderBottom: {
-    borderBottom: '1px solid #ccc'
-  },
-  borderTop: {
-    borderTop: '1px solid #ccc'
-  },
-  settingsMenu: {
-    maxWidth: '385px',
-    zIndex: 60
-  },
-  sizeLabel: {
-    fontSize: '16px'
-  },
-  showHideMenu: {
-    padding: '0',
-    borderRadius: '25px'
-  },
-  toggleButtonGroup: {
-    marginLeft: '15px',
-    pointerEvents: 'auto'
-  },
-  toggleButton: {
-    height: '30px',
-    width: '48px',
-    padding: '7px',
-    textTransform: 'capitalize'
-  },
-  languageToggleButton: {
-    height: '30px',
-    width: '48px'
-  }
-};
-var StyledMenu = styled(function (props) {
-  return /*#__PURE__*/React.createElement(Menu, _extends({
-    elevation: 0,
-    anchorOrigin: {
-      vertical: 'bottom',
-      horizontal: 'center'
-    },
-    transformOrigin: {
-      vertical: 'top',
-      horizontal: 'center'
-    }
-  }, props));
-})({
-  '& .MuiMenu-paper': {
-    border: '1px solid #d3d4d5'
-  }
-});
-var StyledMenuItem = styled(MenuItem)(function (_ref) {
-  var theme = _ref.theme;
-  return {
-    '&:focus': {
-      backgroundColor: theme.palette.primary.main,
-      '& .MuiListItemIcon-root, & .MuiListItemText-primary': {
-        color: theme.palette.common.white
-      }
-    }
-  };
-});
-var CustomListItemIcon = styled(ListItemIcon)({
-  minWidth: '30px',
-  paddingRight: '15px',
-  borderRadius: '25px'
-});
-export var DARK_THEME = 'Dark';
-export var LIGHT_THEME = 'Light';
-export var LANG_SYSTEM = 'sys';
-export var LANG_ENGLISH = 'en';
-export var LANG_FRENCH = 'fr';
-var EN = 'EN';
-var FR = 'FR';
-var TopBar = function TopBar(_ref2) {
-  var appName = _ref2.appName,
-    appColor = _ref2.appColor,
-    appLogo = _ref2.appLogo,
-    appVersion = _ref2.appVersion,
-    appLicense = _ref2.appLicense,
-    onParametersClick = _ref2.onParametersClick,
-    onLogoutClick = _ref2.onLogoutClick,
-    onLogoClick = _ref2.onLogoClick,
-    user = _ref2.user,
-    children = _ref2.children,
-    appsAndUrls = _ref2.appsAndUrls,
-    onAboutClick = _ref2.onAboutClick,
-    globalVersionPromise = _ref2.globalVersionPromise,
-    additionalModulesPromise = _ref2.additionalModulesPromise,
-    onThemeClick = _ref2.onThemeClick,
-    theme = _ref2.theme,
-    onEquipmentLabellingClick = _ref2.onEquipmentLabellingClick,
-    equipmentLabelling = _ref2.equipmentLabelling,
-    onLanguageClick = _ref2.onLanguageClick,
-    language = _ref2.language;
-  var _React$useState = React.useState(null),
-    anchorElSettingsMenu = _React$useState[0],
-    setAnchorElSettingsMenu = _React$useState[1];
-  var _React$useState2 = React.useState(null),
-    anchorElAppsMenu = _React$useState2[0],
-    setAnchorElAppsMenu = _React$useState2[1];
-  var fullScreenRef = useRef(null);
-  var _useState = useState(false),
-    isFullScreen = _useState[0],
-    setIsFullScreen = _useState[1];
-  var handleToggleSettingsMenu = function handleToggleSettingsMenu(event) {
-    setAnchorElSettingsMenu(event.currentTarget);
-  };
-  var handleCloseSettingsMenu = function handleCloseSettingsMenu() {
-    setAnchorElSettingsMenu(null);
-  };
-  var handleClickAppsMenu = function handleClickAppsMenu(event) {
-    setAnchorElAppsMenu(event.currentTarget);
-  };
-  var handleCloseAppsMenu = function handleCloseAppsMenu() {
-    setAnchorElAppsMenu(null);
-  };
-  var onParametersClicked = function onParametersClicked() {
-    setAnchorElSettingsMenu(null);
-    if (onParametersClick) {
-      onParametersClick();
-    }
-  };
-  function onFullScreenChange(isFullScreenValue) {
-    setAnchorElSettingsMenu(null);
-    setIsFullScreen(isFullScreen);
-  }
-  function requestOrExitFullScreen() {
-    setAnchorElSettingsMenu(null);
-    fullScreenRef.current.fullScreen();
-  }
-  var abbreviationFromUserName = function abbreviationFromUserName(name) {
-    var tab = name.split(' ').map(function (x) {
-      return x.charAt(0);
-    });
-    if (tab.length === 1) {
-      return tab[0];
-    } else {
-      return tab[0] + tab[tab.length - 1];
-    }
-  };
-  var changeTheme = function changeTheme(event, value) {
-    if (onThemeClick && value !== null) {
-      onThemeClick(value);
-    }
-  };
-  var changeEquipmentLabelling = function changeEquipmentLabelling(event, value) {
-    if (onEquipmentLabellingClick && value !== null) {
-      onEquipmentLabellingClick(value);
-    }
-  };
-  var changeLanguage = function changeLanguage(event, value) {
-    if (onLanguageClick && value !== null) {
-      onLanguageClick(value);
-    }
-  };
-  var _useState2 = useState(false),
-    isAboutDialogOpen = _useState2[0],
-    setAboutDialogOpen = _useState2[1];
-  var onAboutClicked = function onAboutClicked() {
-    setAnchorElSettingsMenu(false);
-    if (onAboutClick) {
-      onAboutClick();
-    } else {
-      setAboutDialogOpen(true);
-    }
-  };
-  var logo_clickable = useMemo(function () {
-    return /*#__PURE__*/React.createElement(GridLogo, {
-      onClick: onLogoClick,
-      appLogo: appLogo,
-      appName: appName,
-      appColor: appColor
-    });
-  }, [onLogoClick, appLogo, appName, appColor]);
-  return /*#__PURE__*/React.createElement(AppBar, {
-    position: "static",
-    color: "default",
-    sx: styles.appBar
-  }, /*#__PURE__*/React.createElement(FullScreen, {
-    ref: fullScreenRef,
-    onFullScreenChange: onFullScreenChange,
-    onFullScreenError: function onFullScreenError(e) {
-      return console.debug('full screen error : ' + e.message);
-    }
-  }), /*#__PURE__*/React.createElement(Toolbar, null, logo_clickable, /*#__PURE__*/React.createElement(Box, {
-    sx: styles.grow
-  }, children), user && /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(IconButton, {
-    "aria-label": "apps",
-    "aria-controls": "apps-menu",
-    "aria-haspopup": "true",
-    onClick: handleClickAppsMenu,
-    color: "inherit"
-  }, /*#__PURE__*/React.createElement(AppsIcon, null)), /*#__PURE__*/React.createElement(StyledMenu, {
-    id: "apps-menu",
-    anchorEl: anchorElAppsMenu,
-    keepMounted: true,
-    open: Boolean(anchorElAppsMenu),
-    onClose: handleCloseAppsMenu
-  }, appsAndUrls && appsAndUrls.filter(function (item) {
-    return !item.hiddenInAppsMenu;
-  }).map(function (item) {
-    return /*#__PURE__*/React.createElement(Box, {
-      component: "a",
-      key: item.name,
-      href: item.url,
-      sx: styles.link,
-      target: "_blank",
-      rel: "noopener noreferrer"
-    }, /*#__PURE__*/React.createElement(StyledMenuItem, {
-      onClick: handleCloseAppsMenu
-    }, /*#__PURE__*/React.createElement(ListItemText, null, /*#__PURE__*/React.createElement("span", {
-      style: {
-        fontWeight: 'bold'
-      }
-    }, "Grid"), /*#__PURE__*/React.createElement("span", {
-      style: {
-        color: item.appColor === undefined ? 'grey' : item.appColor,
-        fontWeight: 'bold'
-      }
-    }, item.name))));
-  }))), user && /*#__PURE__*/React.createElement(Box, {
-    sx: styles.menuContainerg
-  }, /*#__PURE__*/React.createElement(Button, {
-    "aria-controls": "settings-menu",
-    "aria-haspopup": "true",
-    sx: styles.showHideMenu,
-    onClick: handleToggleSettingsMenu,
-    color: "inherit",
-    style: Boolean(anchorElSettingsMenu) ? {
-      cursor: 'initial'
-    } : {
-      cursor: 'pointer'
-    }
-  }, /*#__PURE__*/React.createElement(Box, {
-    component: "span",
-    sx: styles.name
-  }, user !== null ? abbreviationFromUserName(user.profile.name) : ''), anchorElSettingsMenu ? /*#__PURE__*/React.createElement(ArrowDropUpIcon, {
-    sx: styles.arrowIcon
-  }) : /*#__PURE__*/React.createElement(ArrowDropDownIcon, {
-    sx: styles.arrowIcon
-  })), /*#__PURE__*/React.createElement(Popper, {
-    sx: styles.settingsMenu,
-    open: Boolean(anchorElSettingsMenu),
-    anchorEl: anchorElSettingsMenu
-  }, /*#__PURE__*/React.createElement(Paper, null, /*#__PURE__*/React.createElement(ClickAwayListener, {
-    onClickAway: handleCloseSettingsMenu
-  }, /*#__PURE__*/React.createElement(MenuList, {
-    id: "settings-menu"
-  }, /*#__PURE__*/React.createElement(StyledMenuItem, {
-    sx: styles.borderBottom,
-    disabled: true,
-    style: {
-      opacity: '1'
-    }
-  }, /*#__PURE__*/React.createElement(CustomListItemIcon, null, /*#__PURE__*/React.createElement(PersonIcon, {
-    fontSize: "small"
-  })), /*#__PURE__*/React.createElement(ListItemText, {
-    disabled: false
-  }, user !== null && /*#__PURE__*/React.createElement(Box, {
-    component: "span",
-    sx: styles.sizeLabel
-  }, user.profile.name, ' ', /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(Box, {
-    component: "span",
-    sx: styles.userMail
-  }, user.profile.email)))), /*#__PURE__*/React.createElement(StyledMenuItem, {
-    disabled: true,
-    style: {
-      opacity: '1',
-      paddingTop: '10px',
-      paddingBottom: '10px',
-      backgroundColor: 'transparent'
-    }
-  }, /*#__PURE__*/React.createElement(ListItemText, null, /*#__PURE__*/React.createElement(Typography, {
-    sx: styles.sizeLabel
-  }, /*#__PURE__*/React.createElement(FormattedMessage, {
-    id: "top-bar/displayMode",
-    defaultMessage: 'Display mode'
-  }))), /*#__PURE__*/React.createElement(ToggleButtonGroup, {
-    exclusive: true,
-    value: theme,
-    size: "large",
-    sx: styles.toggleButtonGroup,
-    onChange: changeTheme
-  }, /*#__PURE__*/React.createElement(ToggleButton, {
-    value: LIGHT_THEME,
-    "aria-label": LIGHT_THEME,
-    sx: styles.toggleButton
-  }, /*#__PURE__*/React.createElement(WbSunnyIcon, {
-    fontSize: "small"
-  })), /*#__PURE__*/React.createElement(ToggleButton, {
-    value: DARK_THEME,
-    "aria-label": DARK_THEME,
-    sx: styles.toggleButton
-  }, /*#__PURE__*/React.createElement(Brightness3Icon, {
-    fontSize: "small"
-  })))), onEquipmentLabellingClick && /*#__PURE__*/React.createElement(StyledMenuItem, {
-    disabled: true,
-    style: {
-      opacity: '1',
-      // padding: '0',
-      paddingTop: '10px',
-      paddingBottom: '10px',
-      backgroundColor: 'transparent'
-    }
-  }, /*#__PURE__*/React.createElement(ListItemText, null, /*#__PURE__*/React.createElement(Typography, {
-    sx: styles.sizeLabel
-  }, /*#__PURE__*/React.createElement(FormattedMessage, {
-    id: "top-bar/equipmentLabel",
-    defaultMessage: 'Equipment label'
-  }))), /*#__PURE__*/React.createElement(ToggleButtonGroup, {
-    exclusive: true,
-    value: equipmentLabelling,
-    sx: styles.toggleButtonGroup,
-    onChange: changeEquipmentLabelling
-  }, /*#__PURE__*/React.createElement(ToggleButton, {
-    value: false,
-    sx: styles.toggleButton
-  }, /*#__PURE__*/React.createElement(FormattedMessage, {
-    id: "top-bar/id",
-    defaultMessage: 'Id'
-  })), /*#__PURE__*/React.createElement(ToggleButton, {
-    value: true,
-    sx: styles.toggleButton
-  }, /*#__PURE__*/React.createElement(FormattedMessage, {
-    id: "top-bar/name",
-    defaultMessage: 'Name'
-  })))), /*#__PURE__*/React.createElement(StyledMenuItem, {
-    disabled: true,
-    style: {
-      opacity: '1',
-      paddingTop: '10px',
-      paddingBottom: '10px',
-      backgroundColor: 'transparent'
-    }
-  }, /*#__PURE__*/React.createElement(ListItemText, null, /*#__PURE__*/React.createElement(Typography, {
-    sx: styles.sizeLabel
-  }, /*#__PURE__*/React.createElement(FormattedMessage, {
-    id: "top-bar/language",
-    defaultMessage: 'Language'
-  }))), /*#__PURE__*/React.createElement(ToggleButtonGroup, {
-    exclusive: true,
-    value: language,
-    sx: styles.toggleButtonGroup,
-    onChange: changeLanguage
-  }, /*#__PURE__*/React.createElement(ToggleButton, {
-    value: LANG_SYSTEM,
-    "aria-label": LANG_SYSTEM,
-    sx: styles.languageToggleButton
-  }, /*#__PURE__*/React.createElement(ComputerIcon, null)), /*#__PURE__*/React.createElement(ToggleButton, {
-    value: LANG_ENGLISH,
-    "aria-label": LANG_ENGLISH,
-    sx: styles.languageToggleButton
-  }, EN), /*#__PURE__*/React.createElement(ToggleButton, {
-    value: LANG_FRENCH,
-    "aria-label": LANG_FRENCH,
-    sx: styles.toggleButton
-  }, FR))), onParametersClick && /*#__PURE__*/React.createElement(StyledMenuItem, {
-    onClick: onParametersClicked,
-    sx: styles.borderTop
-  }, /*#__PURE__*/React.createElement(CustomListItemIcon, null, /*#__PURE__*/React.createElement(SettingsIcon, {
-    fontSize: "small"
-  })), /*#__PURE__*/React.createElement(ListItemText, null, /*#__PURE__*/React.createElement(Typography, {
-    sx: styles.sizeLabel
-  }, /*#__PURE__*/React.createElement(FormattedMessage, {
-    id: "top-bar/settings",
-    defaultMessage: 'Settings'
-  })))), /*#__PURE__*/React.createElement(StyledMenuItem, {
-    sx: styles.borderBottom,
-    style: {
-      opacity: '1'
-    },
-    onClick: onAboutClicked
-  }, /*#__PURE__*/React.createElement(CustomListItemIcon, null, /*#__PURE__*/React.createElement(HelpOutlineIcon, {
-    fontSize: "small"
-  })), /*#__PURE__*/React.createElement(ListItemText, null, /*#__PURE__*/React.createElement(Typography, {
-    sx: styles.sizeLabel
-  }, /*#__PURE__*/React.createElement(FormattedMessage, {
-    id: "top-bar/about",
-    defaultMessage: 'About'
-  })))), fullScreenSupported() && /*#__PURE__*/React.createElement(StyledMenuItem, {
-    onClick: requestOrExitFullScreen
-  }, isFullScreen ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CustomListItemIcon, null, /*#__PURE__*/React.createElement(FullscreenExitIcon, {
-    fontSize: "small"
-  })), /*#__PURE__*/React.createElement(ListItemText, null, /*#__PURE__*/React.createElement(Typography, {
-    sx: styles.sizeLabel
-  }, /*#__PURE__*/React.createElement(FormattedMessage, {
-    id: "top-bar/exitFullScreen",
-    defaultMessage: 'Exit full screen mode'
-  })))) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CustomListItemIcon, null, /*#__PURE__*/React.createElement(FullscreenIcon, {
-    fontSize: "small"
-  })), /*#__PURE__*/React.createElement(ListItemText, null, /*#__PURE__*/React.createElement(Typography, {
-    sx: styles.sizeLabel
-  }, /*#__PURE__*/React.createElement(FormattedMessage, {
-    id: "top-bar/goFullScreen",
-    defaultMessage: 'Full screen'
-  }))))), /*#__PURE__*/React.createElement(StyledMenuItem, {
-    onClick: onLogoutClick
-  }, /*#__PURE__*/React.createElement(CustomListItemIcon, null, /*#__PURE__*/React.createElement(ExitToAppIcon, {
-    fontSize: "small"
-  })), /*#__PURE__*/React.createElement(ListItemText, null, /*#__PURE__*/React.createElement(Typography, {
-    sx: styles.sizeLabel
-  }, /*#__PURE__*/React.createElement(FormattedMessage, {
-    id: "top-bar/logout",
-    defaultMessage: 'Logout'
-  }))))))))), /*#__PURE__*/React.createElement(AboutDialog, {
-    open: isAboutDialogOpen,
-    onClose: function onClose() {
-      return setAboutDialogOpen(false);
-    },
-    appName: appName,
-    appVersion: appVersion,
-    appLicense: appLicense,
-    globalVersionPromise: globalVersionPromise,
-    additionalModulesPromise: additionalModulesPromise
-  })));
-};
-TopBar.propTypes = process.env.NODE_ENV !== "production" ? {
-  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 default TopBar;

package/es/components/TopBar/index.js

@@ -1,9 +0,0 @@
-/**
- * Copyright (c) 2020, RTE (http://www.rte-france.com)
- * This Source Code Form is subject to the terms of the Mozilla Public
- * 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 * from './GridLogo';
-export { default as AboutDialog } from './AboutDialog';