@cccsaurora/howler-ui 2.19.0-dev.1316 → 2.19.0-dev.1320

package/components/elements/ContextMenu.js

@@ -83,7 +83,7 @@ const ContextMenu = ({ items, onOpen, onClose, Component = Box, id, children })
                     sx: {
                         minWidth: '250px',
                         paddingY: '0 !important',
-                        '& > :first-child': {
+                        '& > .first': {
                             borderTopLeftRadius: theme.shape.borderRadius,
                             borderTopRightRadius: theme.shape.borderRadius
                         },
@@ -92,15 +92,19 @@ const ContextMenu = ({ items, onOpen, onClose, Component = Box, id, children })
                             borderBottomRightRadius: theme.shape.borderRadius
                         }
                     }
-                }, anchorOrigin: { vertical: 'top', horizontal: 'left' }, onClick: handleClose, children: items.map(entry => {
+                }, anchorOrigin: { vertical: 'top', horizontal: 'left' }, onClick: handleClose, children: items.map((entry, index) => {
+                    let className = '';
+                    if (index === 0) {
+                        className = 'first';
+                    }
                     if (entry.kind === 'divider') {
-                        return _jsx(Divider, { sx: { my: '0 !important' } }, entry.id);
+                        return _jsx(Divider, { className: className, sx: { my: '0 !important' } }, entry.id);
                     }
                     if (entry.kind === 'item') {
                         if (entry.to) {
-                            return (_jsxs(MenuItem, { component: Link, to: entry.to, disabled: entry.disabled, children: [entry.icon && _jsx(ListItemIcon, { children: entry.icon }), _jsx(ListItemText, { children: entry.label })] }, entry.id));
+                            return (_jsxs(MenuItem, { className: className, component: Link, to: entry.to, disabled: entry.disabled, children: [entry.icon && _jsx(ListItemIcon, { children: entry.icon }), _jsx(ListItemText, { children: entry.label })] }, entry.id));
                         }
-                        return (_jsxs(MenuItem, { disabled: entry.disabled, onClick: entry.onClick, children: [entry.icon && _jsx(ListItemIcon, { children: entry.icon }), _jsx(ListItemText, { children: entry.label })] }, entry.id));
+                        return (_jsxs(MenuItem, { className: className, disabled: entry.disabled, onClick: entry.onClick, children: [entry.icon && _jsx(ListItemIcon, { children: entry.icon }), _jsx(ListItemText, { children: entry.label })] }, entry.id));
                     }
                     const { id: entryId, icon, label, disabled, items: subItems } = entry;
                     return (_jsxs(MenuItem, { id: `${entryId}-menu-item`, sx: { position: 'relative' }, onMouseEnter: ev => setShow(_show => ({ ..._show, [entryId]: ev.target })), onMouseLeave: () => setShow(_show => ({ ..._show, [entryId]: null })), disabled: disabled, children: [icon && _jsx(ListItemIcon, { children: icon }), _jsx(ListItemText, { sx: { flex: 1 }, children: label }), !disabled && _jsx(KeyboardArrowRight, { fontSize: "small", sx: { color: 'text.secondary', mr: -1 } }), _jsx(Fade, { in: !!show[entryId], unmountOnExit: true, children: _jsx(Paper, { id: `${entryId}-submenu`, sx: calculateSubMenuStyles(show[entryId]), elevation: 2, children: _jsx(MenuList, { sx: { p: 0, borderTopLeftRadius: 0 }, dense: true, role: "group", children: subItems.map(subItem => (_jsx(MenuItem, { onClick: subItem.onClick, disabled: subItem.disabled, children: _jsx(ListItemText, { children: subItem.label }) }, subItem.key))) }) }) })] }, entryId));

package/components/elements/hit/HitOverview.js

@@ -17,6 +17,6 @@ const HitOverview = ({ content, hit }) => {
         : hit
             ? `/overviews/view?analytic=${encodeURIComponent(hit?.howler.analytic)}${hit?.howler.detection && '&detection=' + encodeURIComponent(hit?.howler.detection)}`
             : null, [hit, matchingOverview]);
-    return (_jsxs(Box, { sx: { position: 'relative', height: '100%', overflow: 'auto' }, children: [link && (_jsx(IconButton, { component: Link, to: link, sx: theme => ({ position: 'absolute', right: theme.spacing(1), top: theme.spacing(1) }), children: _jsx(InsertLink, {}) })), matchingOverview || content ? (_jsx(ErrorBoundary, { children: _jsx(HandlebarsMarkdown, { md: content ?? matchingOverview.content, object: hit, disableLinks: true }) })) : (_jsx(Skeleton, { variant: "rounded", height: "40vh" }))] }));
+    return (_jsxs(Box, { className: "no-margin-first-child", sx: { position: 'relative', height: '100%', overflow: 'auto' }, children: [matchingOverview || content ? (_jsx(ErrorBoundary, { children: _jsx(HandlebarsMarkdown, { md: content ?? matchingOverview.content, object: hit, disableLinks: true }) })) : (_jsx(Skeleton, { variant: "rounded", height: "40vh" })), link && (_jsx(IconButton, { component: Link, to: link, sx: theme => ({ position: 'absolute', right: theme.spacing(1), top: theme.spacing(1) }), children: _jsx(InsertLink, {}) }))] }));
 };
 export default memo(HitOverview);

package/components/routes/cases/detail/CaseOverview.js

@@ -17,10 +17,7 @@ const CaseOverview = ({ case: _case, updateCase }) => {
     if (!_case) {
         return _jsx(Skeleton, { height: 370 });
     }
-    return (_jsxs(Card, { children: [_jsx(CardHeader, { title: _case.title, subheader: _case.summary }), _jsxs(Stack, { children: [_jsx(Divider, {}), _jsx(LinearProgress, { sx: { opacity: +loading } })] }), _jsx(CardContent, { sx: { position: 'relative' }, children: _jsxs(Stack, { direction: "row", spacing: 1, children: [_jsx(Box, { flex: 1, sx: {
-                                '& > :first-child': {
-                                    marginTop: '0 !important'
-                                },
+    return (_jsxs(Card, { children: [_jsx(CardHeader, { title: _case.title, subheader: _case.summary }), _jsxs(Stack, { children: [_jsx(Divider, {}), _jsx(LinearProgress, { sx: { opacity: +loading } })] }), _jsx(CardContent, { children: _jsxs(Stack, { direction: "row", spacing: 1, children: [_jsx(Box, { flex: 1, className: "no-margin-first-child", sx: {
                                 '& > h1,h2,h3,h4,h5': {
                                     fontSize: theme.typography.h5.fontSize
                                 }

package/components/routes/overviews/OverviewViewer.js

@@ -220,7 +220,6 @@ const OverviewViewer = () => {
                                         pt: 1,
                                         mt: -1,
                                         '& > *': { width: '100%' },
-                                        '& > div > :first-child': { mt: 0 },
                                         backgroundColor: activeTheme.palette.background.default,
                                         color: activeTheme.palette.text.primary
                                     }, children: _jsx(HitOverview, { content: content || startingTemplate, hit: exampleHit }) }) })] }))] })] }));

package/index.css

@@ -19,3 +19,7 @@ body {
 code {
   font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;
 }
+
+.no-margin-first-child > :first-child {
+  margin-top: 0 !important;
+}

package/package.json

@@ -56,8 +56,8 @@
     "react-markdown": "^10.1.0",
     "react-pluggable": "^0.4.3",
     "react-resize-detector": "^9.1.1",
-    "react-router": "6.30.4",
-    "react-router-dom": "6.30.4",
+    "react-router": "7.18.1",
+    "react-router-dom": "7.18.1",
     "react-syntax-highlighter": "^15.6.6",
     "rehype-raw": "^7.0.0",
     "remark": "^15.0.1",
@@ -93,7 +93,7 @@
     "url": "https://github.com/CybercentreCanada/howler"
   },
   "type": "module",
-  "version": "2.19.0-dev.1316",
+  "version": "2.19.0-dev.1320",
   "exports": {
     "./i18n": "./i18n.js",
     "./index.css": "./index.css",