@gridsuite/commons-ui 0.282.0 → 0.283.0

package/dist/features/side-bar/AppSideBar.js

@@ -55,7 +55,8 @@ function AppSideBar({
         component: "aside",
         sx: {
           width: isMinimized ? 64 : 224,
-          height: "100%"
+          height: "100%",
+          overflow: "hidden"
         },
         children: [
           /* @__PURE__ */ jsx(

package/dist/features/side-bar/AppSideBarHeader.js

@@ -35,8 +35,8 @@ function AppSideBarHeader({
             isMinimized && /* @__PURE__ */ jsx(EnvironmentChip, { environment, variant: "minimized" })
           ] }),
           !isMinimized && /* @__PURE__ */ jsxs(Box, { sx: { position: "relative", display: "inline-block" }, children: [
-            /* @__PURE__ */ jsxs(Typography, { variant: "h6", children: [
-              "Grid",
+            /* @__PURE__ */ jsxs(Typography, { fontSize: 18, children: [
+              /* @__PURE__ */ jsx(Box, { component: "span", style: { fontWeight: "bold" }, children: "Grid" }),
               /* @__PURE__ */ jsx(Box, { component: "span", sx: { color: appNameColor }, children: appName })
             ] }),
             /* @__PURE__ */ jsx(EnvironmentChip, { environment, variant: "expanded" })
@@ -55,7 +55,7 @@ function AppSideBarHeader({
                 "V",
                 appVersion
               ] }),
-              /* @__PURE__ */ jsx(Tooltip, { title: `V${appVersion}`, disableHoverListener: !isMinimized, children: /* @__PURE__ */ jsx(IconButton, { sx: { padding: 0 }, onClick: () => setOpenDialog(SideBarDialogType.ABOUT), children: /* @__PURE__ */ jsx(Info, { fontSize: "small", color: "disabled" }) }) })
+              /* @__PURE__ */ jsx(Tooltip, { title: `V${appVersion}`, disableHoverListener: !isMinimized, children: /* @__PURE__ */ jsx(IconButton, { sx: { padding: 0 }, onClick: () => setOpenDialog(SideBarDialogType.ABOUT), children: /* @__PURE__ */ jsx(Info, { fontSize: "small", sx: { color: "text.secondary" } }) }) })
             ] })
           }
         ),

package/dist/features/side-bar/footer/AppSideBarFooter.js

@@ -35,6 +35,7 @@ function AppSideBarFooter({
       /* @__PURE__ */ jsx(
         SideBarMenuItem,
         {
+          tooltip: isMinimized ? "top-bar/logout" : void 0,
           label: "top-bar/logout",
           icon: /* @__PURE__ */ jsx(Logout, {}),
           onClick: onLogoutClick,
@@ -46,6 +47,7 @@ function AppSideBarFooter({
     /* @__PURE__ */ jsx(
       SideBarMenuItem,
       {
+        tooltip: isMinimized ? "top-bar/expand" : void 0,
         label: "top-bar/minimize",
         icon: isMinimized ? /* @__PURE__ */ jsx(KeyboardDoubleArrowRight, {}) : /* @__PURE__ */ jsx(KeyboardDoubleArrowLeft, {}),
         onClick: toggleSideBarMinimized,

package/dist/features/side-bar/footer/common/SideBarMenuItem.d.ts

@@ -5,6 +5,7 @@ interface SideBarMenuItemProps {
     onClick?: () => void;
     showLabel?: boolean;
     disabled?: boolean;
+    tooltip?: string;
 }
-export declare function SideBarMenuItem({ label, icon, onClick, showLabel, disabled, }: Readonly<SideBarMenuItemProps>): import("react").JSX.Element;
+export declare function SideBarMenuItem({ label, icon, onClick, tooltip, showLabel, disabled, }: Readonly<SideBarMenuItemProps>): import("react").JSX.Element;
 export {};

package/dist/features/side-bar/footer/common/SideBarMenuItem.js

@@ -1,5 +1,5 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { Typography } from "@mui/material";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Tooltip, Typography } from "@mui/material";
 import { useIntl } from "react-intl";
 import { submenuFooterStyle } from "./submenu-footer.style.js";
 import "@mui/icons-material";
@@ -61,15 +61,16 @@ function SideBarMenuItem({
   label,
   icon,
   onClick,
+  tooltip = "",
   showLabel = true,
   disabled = false
 }) {
   const intl = useIntl();
-  return /* @__PURE__ */ jsxs(CustomMenuItem, { disabled, onClick, sx: submenuFooterStyle.subMenu, children: [
+  return /* @__PURE__ */ jsx(Tooltip, { placement: "right-start", title: tooltip && intl.formatMessage({ id: tooltip }), children: /* @__PURE__ */ jsxs(CustomMenuItem, { disabled, onClick, sx: submenuFooterStyle.subMenu, children: [
     icon,
     " ",
     showLabel && /* @__PURE__ */ jsx(Typography, { px: 1, children: intl.formatMessage({ id: label }) })
-  ] });
+  ] }) });
 }
 export {
   SideBarMenuItem

package/dist/features/side-bar/footer/profile/ProfileMenu.js

@@ -72,7 +72,7 @@ function ProfileMenu({ isMinimized, userProfile }) {
     CustomNestedMenuItem,
     {
       label: !isMinimized ? profileLabel : "",
-      leftIcon: /* @__PURE__ */ jsx(UserAvatarIcon, { label: userProfile?.name ?? "" }),
+      leftIcon: /* @__PURE__ */ jsx(UserAvatarIcon, { sx: { backgroundColor: "text.secondary" }, label: userProfile?.name ?? "" }),
       sx: submenuFooterStyle.subMenu,
       children: [
         isMinimized && /* @__PURE__ */ jsx(MinimizedSubMenuHeader, { label: profileLabel }),

package/dist/features/side-bar/footer/profile/UserIcon.d.ts

@@ -1,9 +1,5 @@
-/**
- * Copyright (c) 2026, 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 declare function UserAvatarIcon({ label }: Readonly<{
+import { SxProps, Theme } from '@mui/material';
+export declare function UserAvatarIcon({ label, sx }: Readonly<{
     label: string;
+    sx?: SxProps<Theme>;
 }>): import("react").JSX.Element;

package/dist/features/side-bar/footer/profile/UserIcon.js

@@ -4,6 +4,7 @@ import "../../../../utils/conversionUtils.js";
 import "../../../../utils/types/equipmentType.js";
 import { isEmpty } from "../../../../utils/functions.js";
 import "@mui/icons-material";
+import { mergeSx } from "../../../../utils/styles.js";
 function getAbbreviationFromUserName(name) {
   if (isEmpty(name)) {
     return "";
@@ -14,16 +15,19 @@ function getAbbreviationFromUserName(name) {
   }
   return firstName[0];
 }
-function UserAvatarIcon({ label }) {
+function UserAvatarIcon({ label, sx }) {
   return /* @__PURE__ */ jsx(
     Avatar,
     {
-      sx: (theme) => ({
-        height: "24px",
-        width: "24px",
-        fontSize: theme.typography.pxToRem(11),
-        textTransform: "uppercase"
-      }),
+      sx: mergeSx(
+        (theme) => ({
+          height: "24px",
+          width: "24px",
+          fontSize: theme.typography.pxToRem(11),
+          textTransform: "uppercase"
+        }),
+        { ...sx }
+      ),
       children: getAbbreviationFromUserName(label)
     }
   );

package/dist/features/side-bar/footer/settings/SettingsMenu.js

@@ -85,7 +85,7 @@ function SettingsMenu({
             sx: submenuFooterStyle.subMenuChildren,
             renderLabel: () => /* @__PURE__ */ jsxs(Box, { children: [
               intl.formatMessage({ id: "top-bar/language" }),
-              /* @__PURE__ */ jsxs(Typography, { component: "span", fontSize: 12, sx: { color: "text.disabled" }, children: [
+              /* @__PURE__ */ jsxs(Typography, { component: "span", fontSize: 12, sx: { color: "text.secondary" }, children: [
                 " - ",
                 intl.formatMessage({
                   id: `top-bar/language/${selectedLanguage}`

package/dist/translations/en/topBarEn.d.ts

@@ -24,6 +24,7 @@ export declare const topBarEn: {
     'top-bar/developerModeWarning': string;
     'top-bar/settings': string;
     'top-bar/minimize': string;
+    'top-bar/expand': string;
     'about-dialog/title': string;
     'about-dialog/version': string;
     'about-dialog/alert-running-old-version-msg': string;

package/dist/translations/en/topBarEn.js

@@ -17,7 +17,8 @@ const topBarEn = {
   "top-bar/language/sys": "Browser",
   "top-bar/developerModeWarning": "Developer mode: Some features are incomplete and may not work as expected.",
   "top-bar/settings": "Settings",
-  "top-bar/minimize": "Minimize",
+  "top-bar/minimize": "Collapse menu",
+  "top-bar/expand": "Expand menu",
   "about-dialog/title": "About",
   "about-dialog/version": "Version {version}",
   "about-dialog/alert-running-old-version-msg": "Running old version.\nSave your work and refresh the application to load the latest version.",

package/dist/translations/fr/topBarFr.d.ts

@@ -24,6 +24,7 @@ export declare const topBarFr: {
     'top-bar/developerModeWarning': string;
     'top-bar/settings': string;
     'top-bar/minimize': string;
+    'top-bar/expand': string;
     'about-dialog/title': string;
     'about-dialog/version': string;
     'about-dialog/alert-running-old-version-msg': string;

package/dist/translations/fr/topBarFr.js

@@ -18,6 +18,7 @@ const topBarFr = {
   "top-bar/developerModeWarning": "Mode développeur : Certaines fonctionnalités ne sont pas complètes et peuvent ne pas fonctionner comme prévu.",
   "top-bar/settings": "Réglages",
   "top-bar/minimize": "Réduire le menu",
+  "top-bar/expand": "Développer le menu",
   "about-dialog/title": "À propos",
   "about-dialog/version": "Version {version}",
   "about-dialog/alert-running-old-version-msg": "Ancienne version de l'application.\nVeuillez sauvegarder votre travail et rafraîchir l'application pour charger la dernière version",

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@gridsuite/commons-ui",
-    "version": "0.282.0",
+    "version": "0.283.0",
     "description": "common react components for gridsuite applications",
     "author": "gridsuite team",
     "homepage": "https://github.com/gridsuite",