@digitaldefiance/express-suite-react-components 4.22.4 → 4.22.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@digitaldefiance/express-suite-react-components",
-  "version": "4.22.4",
+  "version": "4.22.6",
   "homepage": "https://github.com/Digital-Defiance/react-components",
   "description": "React MUI components for Digital Defiance Express Suite",
   "repository": {

package/src/components/SideMenuListItem.js

@@ -26,17 +26,17 @@ const SideMenuListItem = ({ menuItem, onClose, onNavigate, }) => {
         onClose();
     }, [onNavigate, onClose]);
     if (menuItem.divider) {
-        return (0, jsx_runtime_1.jsx)(material_1.Divider, { sx: { ...menuItem.additionalSx } }, menuItem.id);
+        return (0, jsx_runtime_1.jsx)(material_1.Divider, { sx: { ...menuItem.sideSx } }, menuItem.id);
     }
     else if (menuItem.link) {
-        return ((0, jsx_runtime_1.jsxs)(material_1.ListItemButton, { onClick: handleMenuItemClick(menuItem), sx: { ...menuItem.additionalSx }, children: [menuItem.icon && (0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { sx: { ...menuItem.iconSx }, children: menuItem.icon }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: menuItem.label, sx: { ...menuItem.textSx } })] }, menuItem.id));
+        return ((0, jsx_runtime_1.jsxs)(material_1.ListItemButton, { onClick: handleMenuItemClick(menuItem), sx: { ...menuItem.sideSx }, children: [menuItem.icon && (0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { sx: { ...menuItem.sideIconSx }, children: menuItem.icon }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: menuItem.label, sx: { ...menuItem.sideTextSx } })] }, menuItem.id));
     }
     else if (menuItem.action) {
         const action = menuItem.action;
         return ((0, jsx_runtime_1.jsxs)(material_1.ListItemButton, { onClick: async () => {
                 await action();
                 onClose();
-            }, sx: { ...menuItem.additionalSx }, children: [menuItem.icon && (0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { sx: { ...menuItem.iconSx }, children: menuItem.icon }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: menuItem.label, sx: { ...menuItem.textSx } })] }, menuItem.id));
+            }, sx: { ...menuItem.sideSx }, children: [menuItem.icon && (0, jsx_runtime_1.jsx)(material_1.ListItemIcon, { sx: { ...menuItem.sideIconSx }, children: menuItem.icon }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: menuItem.label, sx: { ...menuItem.sideTextSx } })] }, menuItem.id));
     }
     return null;
 };

package/src/components/TopMenu.d.ts

@@ -19,6 +19,8 @@ export interface AdditionalDropdownMenu {
 export interface TopMenuProps {
     Logo: React.ReactNode;
     additionalMenus?: Array<AdditionalDropdownMenu>;
+    /** Custom action elements rendered in the toolbar after menu dropdowns (e.g. notification bell). Only shown when authenticated. */
+    actions?: React.ReactNode;
     constants?: IConstants;
     showTitle?: boolean;
 }

package/src/components/TopMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TopMenu.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/components/TopMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EAIX,MAAM,iCAAiC,CAAC;AAUzC,OAAO,KAAK,EAAE,EAAe,EAAE,EAAE,YAAY,EAAiC,MAAM,OAAO,CAAC;AAK5F,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAO7C,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,MAAM;QACd,UAAU,CAAC,EAAE;YACX,QAAQ,EAAE,MAAM,CAAC;YACjB,SAAS,EAAE,MAAM,CAAC;YAClB,MAAM,EAAE,MAAM,CAAC;YACf,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;SACxB,CAAC;KACH;CACF;AAED,MAAM,WAAW,sBAAsB;IACrC,QAAQ,EAAE,QAAQ,CAAC;IACnB,QAAQ,EAAE,YAAY,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,eAAe,CAAC,EAAE,KAAK,CAAC,sBAAsB,CAAC,CAAC;IAChD,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,OAAO,EAAE,EAAE,CAAC,YAAY,CAkHpC,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"TopMenu.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/components/TopMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EAIX,MAAM,iCAAiC,CAAC;AAUzC,OAAO,KAAK,EAAE,EAAe,EAAE,EAAE,YAAY,EAAiC,MAAM,OAAO,CAAC;AAK5F,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAO7C,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,MAAM;QACd,UAAU,CAAC,EAAE;YACX,QAAQ,EAAE,MAAM,CAAC;YACjB,SAAS,EAAE,MAAM,CAAC;YAClB,MAAM,EAAE,MAAM,CAAC;YACf,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;SACxB,CAAC;KACH;CACF;AAED,MAAM,WAAW,sBAAsB;IACrC,QAAQ,EAAE,QAAQ,CAAC;IACnB,QAAQ,EAAE,YAAY,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,eAAe,CAAC,EAAE,KAAK,CAAC,sBAAsB,CAAC,CAAC;IAChD,mIAAmI;IACnI,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,OAAO,EAAE,EAAE,CAAC,YAAY,CAmHpC,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/src/components/TopMenu.js

@@ -15,7 +15,7 @@ const DropdownMenu_1 = require("./DropdownMenu");
 const SideMenu_1 = require("./SideMenu");
 const UserLanguageSelector_1 = require("./UserLanguageSelector");
 const UserMenu_1 = require("./UserMenu");
-const TopMenu = ({ Logo, additionalMenus, constants, showTitle }) => {
+const TopMenu = ({ Logo, additionalMenus, actions, constants, showTitle }) => {
     const { isAuthenticated } = (0, react_1.useContext)(AuthProvider_1.AuthContext);
     const { getTopMenus } = (0, MenuContext_1.useMenu)();
     const [isSideMenuOpen, setIsSideMenuOpen] = (0, react_1.useState)(false);
@@ -44,7 +44,7 @@ const TopMenu = ({ Logo, additionalMenus, constants, showTitle }) => {
                             marginRight: 2,
                             display: 'flex',
                             alignItems: 'center',
-                        }, children: Logo }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h6", component: "div", sx: { flexGrow: 1 }, children: (showTitle !== false) ? siteTitle : '\u00A0' }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: { display: 'flex', alignItems: 'center' }, children: [isAuthenticated ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { color: "inherit", component: react_router_dom_1.Link, to: "/dashboard", children: tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_Dashboard) }), allMenus.map((menu, index) => menu.isUserMenu ? ((0, jsx_runtime_1.jsx)(UserMenu_1.UserMenu, {}, `user-menu`)) : ((0, jsx_runtime_1.jsx)(DropdownMenu_1.DropdownMenu, { menuType: menu.menuType, menuIcon: menu.menuIcon }, `menu-${index}`)))] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { color: "inherit", component: react_router_dom_1.Link, to: "/login", children: tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Login_LoginButton) }), (0, jsx_runtime_1.jsx)(material_1.Button, { color: "inherit", component: react_router_dom_1.Link, to: "/register", children: tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.RegisterButton) })] })), (0, jsx_runtime_1.jsx)(UserLanguageSelector_1.UserLanguageSelector, {})] })] }), (0, jsx_runtime_1.jsx)(SideMenu_1.SideMenu, { isOpen: isSideMenuOpen, onClose: handleCloseSideMenu })] }));
+                        }, children: Logo }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "h6", component: "div", sx: { flexGrow: 1 }, children: (showTitle !== false) ? siteTitle : '\u00A0' }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: { display: 'flex', alignItems: 'center' }, children: [isAuthenticated ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { color: "inherit", component: react_router_dom_1.Link, to: "/dashboard", children: tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Common_Dashboard) }), allMenus.map((menu, index) => menu.isUserMenu ? ((0, jsx_runtime_1.jsx)(UserMenu_1.UserMenu, {}, `user-menu`)) : ((0, jsx_runtime_1.jsx)(DropdownMenu_1.DropdownMenu, { menuType: menu.menuType, menuIcon: menu.menuIcon }, `menu-${index}`)))] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { color: "inherit", component: react_router_dom_1.Link, to: "/login", children: tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.Login_LoginButton) }), (0, jsx_runtime_1.jsx)(material_1.Button, { color: "inherit", component: react_router_dom_1.Link, to: "/register", children: tComponent(suite_core_lib_1.SuiteCoreComponentId, suite_core_lib_1.SuiteCoreStringKey.RegisterButton) })] })), isAuthenticated && actions, (0, jsx_runtime_1.jsx)(UserLanguageSelector_1.UserLanguageSelector, {})] })] }), (0, jsx_runtime_1.jsx)(SideMenu_1.SideMenu, { isOpen: isSideMenuOpen, onClose: handleCloseSideMenu })] }));
 };
 exports.TopMenu = TopMenu;
 exports.default = exports.TopMenu;

package/src/interfaces/IMenuOption.d.ts

@@ -60,7 +60,17 @@ export interface IMenuOption {
      * Additional CSS properties
      */
     additionalSx?: SxProps<Theme>;
-    iconSx?: SxProps<Theme>;
-    textSx?: SxProps<Theme>;
+    /**
+     * Additional CSS properties for the side menu variant
+     */
+    sideSx?: SxProps<Theme>;
+    /**
+     * Additional CSS properties for the side menu variant Icon sub item
+     */
+    sideIconSx?: SxProps<Theme>;
+    /**
+     * Additional CSS properties for the side menu variant Text sub item
+     */
+    sideTextSx?: SxProps<Theme>;
 }
 //# sourceMappingURL=IMenuOption.d.ts.map

package/src/interfaces/IMenuOption.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IMenuOption.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/interfaces/IMenuOption.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAEtC,MAAM,WAAW,WAAW;IAC1B;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;OAEG;IACH,KAAK,EAAE,MAAM,GAAG,SAAS,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC;IAC7C;;OAEG;IACH,cAAc,EAAE,QAAQ,EAAE,CAAC;IAC3B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;OAIG;IACH,IAAI,CAAC,EAAE,EAAE,GAAG;QAAE,QAAQ,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC;IAClD;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB;;;;;OAKG;IACH,YAAY,EAAE,OAAO,GAAG,SAAS,CAAC;IAClC;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,OAAO,CAAC;IAC1C;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IAC9B,MAAM,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IACxB,MAAM,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;CACzB"}
+{"version":3,"file":"IMenuOption.d.ts","sourceRoot":"","sources":["../../../../../packages/digitaldefiance-express-suite-react-components/src/interfaces/IMenuOption.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAEtC,MAAM,WAAW,WAAW;IAC1B;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;OAEG;IACH,KAAK,EAAE,MAAM,GAAG,SAAS,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC;IAC7C;;OAEG;IACH,cAAc,EAAE,QAAQ,EAAE,CAAC;IAC3B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;OAIG;IACH,IAAI,CAAC,EAAE,EAAE,GAAG;QAAE,QAAQ,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC;IAClD;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB;;;;;OAKG;IACH,YAAY,EAAE,OAAO,GAAG,SAAS,CAAC;IAClC;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,OAAO,CAAC;IAC1C;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IAC9B;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IACxB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IAC5B;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;CAC7B"}