@opengeoweb/shared 4.14.1 → 4.15.1

package/index.esm.js

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import React__default, { useRef } from 'react';
-import { Box, Typography, Dialog, DialogTitle, IconButton, DialogContent, DialogActions, Button, CircularProgress, Alert, AlertTitle, Grid, useTheme, Link, Avatar as Avatar$1, Paper, ClickAwayListener, MenuList, MenuItem, RadioGroup, FormControlLabel, Radio, Tooltip, List, ListItem, Tabs, Tab, Backdrop, Slider, ToggleButton, Menu, ListItemIcon, Checkbox, Select, Accordion, AccordionSummary, AccordionDetails } from '@mui/material';
+import { Box, Typography, Dialog, DialogTitle, IconButton, DialogContent, DialogActions, Button, CircularProgress, Alert, AlertTitle, useTheme, Link, Avatar as Avatar$1, Paper, ClickAwayListener, MenuList, MenuItem, Grid, RadioGroup, FormControlLabel, Radio, Tooltip, List, ListItem, Tabs, Tab, Backdrop, Slider, ToggleButton, Menu, ListItemIcon, Checkbox, Select, Accordion, AccordionSummary, AccordionDetails } from '@mui/material';
 import { Close, Exclamation, Success, Info, ChevronRight, GeoWebLogo, Resize, useThemeContext, DragHandle, ArrowLeft, ArrowRight, KeyOption, ArrowUp, ArrowDown, KeyCommand, Options, Delete, VisibilityOff, Visibility, ChevronDown } from '@opengeoweb/theme';
 import { throttle } from 'lodash';
 import Draggable from 'react-draggable';
@@ -935,6 +935,7 @@ var styles$5 = {
       color: theme.palette.common.white,
       boxShadow: theme.shadows[1],
       zIndex: 1000,
+      display: 'flex',
       padding: '0 16px'
     }, theme.breakpoints.up('md'), {
       padding: '0 24px'
@@ -961,32 +962,16 @@ var styles$5 = {
 var AppHeader = function AppHeader(_ref2) {
   var menu = _ref2.menu,
       userMenu = _ref2.userMenu,
+      workspaceTopBar = _ref2.workspaceTopBar,
       _ref2$title = _ref2.title,
       title = _ref2$title === void 0 ? 'GeoWeb' : _ref2$title;
   return /*#__PURE__*/React__default.createElement(Box, {
     component: "header",
     sx: styles$5.header
-  }, /*#__PURE__*/React__default.createElement(Grid, {
-    sx: styles$5.container,
-    container: true,
-    alignItems: "center"
-  }, /*#__PURE__*/React__default.createElement(Grid, {
-    item: true,
-    xs: 6,
-    sm: 6
-  }, /*#__PURE__*/React__default.createElement(Grid, {
-    container: true,
-    alignItems: "center",
-    wrap: "nowrap",
-    sx: {
-      button: {
-        marginLeft: 4,
-        color: 'geowebColors.typographyAndIcons.text'
-      }
-    }
   }, /*#__PURE__*/React__default.createElement(Box, {
     sx: {
-      display: 'flex'
+      display: 'inherit',
+      alignItems: 'center'
     }
   }, /*#__PURE__*/React__default.createElement(GeoWebLogo, {
     style: {
@@ -994,16 +979,28 @@ var AppHeader = function AppHeader(_ref2) {
       top: '-1px',
       right: '-1px'
     }
-  })), /*#__PURE__*/React__default.createElement(Typography, {
+  }), /*#__PURE__*/React__default.createElement(Typography, {
     variant: "h1",
     sx: styles$5.title
-  }, title), menu)), /*#__PURE__*/React__default.createElement(Grid, {
-    item: true,
-    xs: 6,
-    sm: 6,
-    container: true,
-    justifyContent: "flex-end"
-  }, userMenu)));
+  }, title)), /*#__PURE__*/React__default.createElement(Box, {
+    sx: {
+      flexGrow: 1,
+      display: 'flex',
+      marginLeft: 4,
+      alignItems: 'center'
+    }
+  }, /*#__PURE__*/React__default.createElement(Box, {
+    sx: {
+      button: {
+        color: 'geowebColors.typographyAndIcons.text'
+      }
+    }
+  }, menu), workspaceTopBar), /*#__PURE__*/React__default.createElement(Box, {
+    sx: {
+      display: 'flex',
+      alignItems: 'center'
+    }
+  }, userMenu));
 };
 
 /* *

package/index.umd.js

@@ -815,6 +815,7 @@
           color: theme.palette.common.white,
           boxShadow: theme.shadows[1],
           zIndex: 1000,
+          display: 'flex',
           padding: '0 16px'
         }, _a[theme.breakpoints.up('md')] = {
           padding: '0 24px'
@@ -841,32 +842,16 @@
     var AppHeader = function AppHeader(_a) {
       var menu = _a.menu,
           userMenu = _a.userMenu,
+          workspaceTopBar = _a.workspaceTopBar,
           _b = _a.title,
           title = _b === void 0 ? 'GeoWeb' : _b;
       return /*#__PURE__*/React__default["default"].createElement(material.Box, {
         component: "header",
         sx: styles$5.header
-      }, /*#__PURE__*/React__default["default"].createElement(material.Grid, {
-        sx: styles$5.container,
-        container: true,
-        alignItems: "center"
-      }, /*#__PURE__*/React__default["default"].createElement(material.Grid, {
-        item: true,
-        xs: 6,
-        sm: 6
-      }, /*#__PURE__*/React__default["default"].createElement(material.Grid, {
-        container: true,
-        alignItems: "center",
-        wrap: "nowrap",
-        sx: {
-          button: {
-            marginLeft: 4,
-            color: 'geowebColors.typographyAndIcons.text'
-          }
-        }
       }, /*#__PURE__*/React__default["default"].createElement(material.Box, {
         sx: {
-          display: 'flex'
+          display: 'inherit',
+          alignItems: 'center'
         }
       }, /*#__PURE__*/React__default["default"].createElement(theme.GeoWebLogo, {
         style: {
@@ -874,16 +859,28 @@
           top: '-1px',
           right: '-1px'
         }
-      })), /*#__PURE__*/React__default["default"].createElement(material.Typography, {
+      }), /*#__PURE__*/React__default["default"].createElement(material.Typography, {
         variant: "h1",
         sx: styles$5.title
-      }, title), menu)), /*#__PURE__*/React__default["default"].createElement(material.Grid, {
-        item: true,
-        xs: 6,
-        sm: 6,
-        container: true,
-        justifyContent: "flex-end"
-      }, userMenu)));
+      }, title)), /*#__PURE__*/React__default["default"].createElement(material.Box, {
+        sx: {
+          flexGrow: 1,
+          display: 'flex',
+          marginLeft: 4,
+          alignItems: 'center'
+        }
+      }, /*#__PURE__*/React__default["default"].createElement(material.Box, {
+        sx: {
+          button: {
+            color: 'geowebColors.typographyAndIcons.text'
+          }
+        }
+      }, menu), workspaceTopBar), /*#__PURE__*/React__default["default"].createElement(material.Box, {
+        sx: {
+          display: 'flex',
+          alignItems: 'center'
+        }
+      }, userMenu));
     };
 
     /* *

package/lib/components/AppHeader/AppHeader.d.ts

@@ -2,6 +2,7 @@ import React from 'react';
 interface AppHeaderProps {
     menu?: React.ReactNode;
     userMenu?: React.ReactNode;
+    workspaceTopBar?: React.ReactNode;
     title?: string;
 }
 declare const AppHeader: React.FC<AppHeaderProps>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeoweb/shared",
-  "version": "4.14.1",
+  "version": "4.15.1",
   "description": "GeoWeb shared library with shared components and utils for the opengeoweb project",
   "license": "Apache-2.0",
   "repository": {
@@ -14,7 +14,7 @@
   "peerDependencies": {
     "react": "^18.2.0",
     "@mui/material": "^5.10.8",
-    "@opengeoweb/theme": "4.14.1",
+    "@opengeoweb/theme": "4.15.1",
     "react-draggable": "^4.4.5",
     "re-resizable": "^6.9.0",
     "@redux-eggs/core": "^2.2.0",