@sis-cc/dotstatsuite-visions 7.20.3 → 7.20.5

package/es/AdvancedFilterDialog/AdvancedFilterDialog.js

@@ -2,7 +2,7 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
 
 function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
 
-import React, { useState, Fragment } from 'react';
+import React, { useEffect, useState, Fragment } from 'react';
 import PropTypes from 'prop-types';
 import * as R from 'ramda';
 import cx from 'classnames';
@@ -22,6 +22,7 @@ import CloseIcon from '@material-ui/icons/Close';
 import HintIcon from '@material-ui/icons/EmojiObjects';
 import Draggable from 'react-draggable';
 import { Button, Spotlight, VirtualizedTree } from '..';
+import { withExpansionTree } from '../VirtualizedTree/withExpansionTree';
 import { makeStyles } from '@material-ui/core/styles';
 import singleImg from './images/single-selection.png';
 import childrenImg from './images/children-selection.png';
@@ -39,7 +40,7 @@ var PaperComponent = function PaperComponent(props) {
   return React.createElement(
     Draggable,
     { handle: '#draggable-dialog-title', cancel: '[class*="MuiDialogContent-root"]' },
-    React.createElement(Paper, _extends({ style: { minWidth: '75%', height: 700 } }, props))
+    React.createElement(Paper, _extends({ style: { minWidth: '75%', height: '75%' } }, props))
   );
 };
 
@@ -83,16 +84,19 @@ var useStyles = makeStyles(function (theme) {
     narrowSpotlight: { width: '100%' },
     selectionButton: {
       marginLeft: 24,
+      marginRight: 15,
       height: 32
     },
     narrowSelectionButton: {
       height: 32,
-      marginTop: 5
+      marginTop: 5,
+      marginRight: 15
     },
     selectionMenu: {
       width: '50%',
+      maxHeight: '100%',
       position: 'absolute',
-      top: 105,
+      top: 110,
       right: 48,
       zIndex: 1
     },
@@ -111,12 +115,6 @@ var useStyles = makeStyles(function (theme) {
         backgroundColor: theme.palette.action.hover
       }
     },
-    selectedButton: {
-      backgroundColor: theme.palette.secondary.main,
-      '&:hover': {
-        backgroundColor: theme.palette.action.selected
-      }
-    },
     selectModeItem: {
       boxShadow: 'none',
       display: 'flex',
@@ -136,6 +134,9 @@ var useStyles = makeStyles(function (theme) {
       marginRight: 10,
       display: 'flex',
       flexDirection: 'row'
+    },
+    actions: {
+      justifyContent: 'space-between'
     }
   };
 });
@@ -178,7 +179,8 @@ var SelectionModeMenu = function SelectionModeMenu(_ref) {
       selected = _ref.selected,
       classes = _ref.classes,
       isNarrow = _ref.isNarrow,
-      hint = _ref.hint;
+      hint = _ref.hint,
+      maxHeight = _ref.maxHeight;
 
   if (!isOpen) {
     return null;
@@ -188,26 +190,24 @@ var SelectionModeMenu = function SelectionModeMenu(_ref) {
     { className: isNarrow ? classes.narrowSelectionMenu : classes.selectionMenu },
     React.createElement(
       Card,
-      null,
+      { style: { maxHeight: maxHeight - 5, overflow: 'auto' } },
       React.createElement(
         CardContent,
         { className: classes.selectModeContainer },
         R.map(function (_ref2) {
-          var _cx;
-
           var value = _ref2.value,
               label = _ref2.label,
               img = _ref2.img;
           return React.createElement(
             Button,
-            _extends({
-              className: cx(classes.selectButton, (_cx = {}, _cx[classes.selectedButton] = value === selected, _cx))
-            }, value === selected ? { variant: 'contained', color: 'secondary' } : {}, {
+            {
+              className: classes.selectButton,
+              selected: value === selected,
               key: value,
               onClick: function onClick() {
                 return onSelect(value);
               }
-            }),
+            },
             React.createElement(
               Paper,
               { className: classes.selectModeItem, key: value },
@@ -241,7 +241,8 @@ SelectionModeMenu.propTypes = process.env.NODE_ENV !== "production" ? {
   isOpen: PropTypes.bool,
   onSelect: PropTypes.func,
   options: PropTypes.array,
-  selected: PropTypes.string
+  selected: PropTypes.string,
+  maxHeight: PropTypes.number
 } : {};
 
 var icons = {
@@ -253,7 +254,7 @@ var icons = {
 };
 
 var AdvancedFilterDialog = function AdvancedFilterDialog(props) {
-  var _cx2;
+  var _cx;
 
   var id = props.id,
       title = props.title,
@@ -265,9 +266,13 @@ var AdvancedFilterDialog = function AdvancedFilterDialog(props) {
       isNarrow = props.isNarrow,
       labels = props.labels,
       disableAccessor = props.disableAccessor,
-      rest = _objectWithoutProperties(props, ['id', 'title', 'items', 'labelRenderer', 'onClose', 'changeSelection', 'isOpen', 'isNarrow', 'labels', 'disableAccessor']);
+      expandAll = props.expandAll,
+      collapseAll = props.collapseAll,
+      defaultSpotlight = props.defaultSpotlight,
+      expandedIds = props.expandedIds,
+      rest = _objectWithoutProperties(props, ['id', 'title', 'items', 'labelRenderer', 'onClose', 'changeSelection', 'isOpen', 'isNarrow', 'labels', 'disableAccessor', 'expandAll', 'collapseAll', 'defaultSpotlight', 'expandedIds']);
 
-  var _useState = useState(''),
+  var _useState = useState({ term: '' }),
       term = _useState[0].term,
       setSpotlight = _useState[1];
 
@@ -285,6 +290,23 @@ var AdvancedFilterDialog = function AdvancedFilterDialog(props) {
 
   var classes = useStyles();
 
+  var _useState5 = useState(0),
+      height = _useState5[0],
+      setHeight = _useState5[1];
+
+  var measureRef = React.useCallback(function (node) {
+    if (node !== null) {
+      setHeight(node.getBoundingClientRect().height * 75 / 100);
+    }
+  });
+  useEffect(function () {
+    if (!R.isNil(defaultSpotlight) && !R.isEmpty(defaultSpotlight)) {
+      setSpotlight(defaultSpotlight);
+    }
+  }, [defaultSpotlight]);
+
+  var listHeight = height - 170;
+
   var groupedItemsByParentId = R.groupBy(R.propOr('#ROOT', 'parentId'), items);
 
   var recurse = R.filter(function (item) {
@@ -344,8 +366,9 @@ var AdvancedFilterDialog = function AdvancedFilterDialog(props) {
   };
 
   var handleSubmit = function handleSubmit() {
-    changeSelection(id, R.values(selection));
+    changeSelection(id, R.values(selection), { expandedIds: expandedIds, spotlight: { term: term } });
     setSelection({});
+    setSpotlight({ term: '' });
   };
 
   return React.createElement(
@@ -354,7 +377,8 @@ var AdvancedFilterDialog = function AdvancedFilterDialog(props) {
       open: isOpen,
       PaperComponent: PaperComponent,
       'aria-labelledby': 'draggable-dialog-title',
-      onClose: onClose
+      onClose: onClose,
+      ref: measureRef
     },
     React.createElement(
       DialogTitle,
@@ -384,11 +408,12 @@ var AdvancedFilterDialog = function AdvancedFilterDialog(props) {
         { container: true },
         React.createElement(
           Grid,
-          { item: true, xs: 12, className: cx(classes.topElements, (_cx2 = {}, _cx2[classes.narrowTop] = isNarrow, _cx2)) },
+          { item: true, xs: 12, className: cx(classes.topElements, (_cx = {}, _cx[classes.narrowTop] = isNarrow, _cx)) },
           React.createElement(
             'div',
             { className: isNarrow ? classes.narrowSpotlight : classes.spotlight },
             React.createElement(Spotlight, {
+              hasClearAll: true,
               placeholder: R.prop('placeholder', labels),
               term: term,
               hasCommit: false,
@@ -419,7 +444,11 @@ var AdvancedFilterDialog = function AdvancedFilterDialog(props) {
               Fragment,
               null,
               '\xA0',
-              React.createElement('img', { src: R.prop(selectionMode, icons), alt: selectionMode })
+              React.createElement('img', {
+                style: { marginLeft: 15 },
+                src: R.prop(selectionMode, icons),
+                alt: selectionMode
+              })
             )
           )
         ),
@@ -436,7 +465,8 @@ var AdvancedFilterDialog = function AdvancedFilterDialog(props) {
               setIsOpenSelectionMenu(false);
             },
             selected: selectionMode,
-            hint: R.prop('hint', labels)
+            hint: R.prop('hint', labels),
+            maxHeight: listHeight
           }),
           React.createElement(VirtualizedTree, _extends({}, rest, {
             disableAccessor: disableAccessor,
@@ -445,36 +475,57 @@ var AdvancedFilterDialog = function AdvancedFilterDialog(props) {
             items: selectionItems,
             changeSelection: onChangeSelection,
             withExpandControl: true,
-            maxTreeHeight: 490,
-            getItemScope: R.prop(selectionMode, scopeGetters)
+            maxTreeHeight: listHeight,
+            getItemScope: R.prop(selectionMode, scopeGetters),
+            expandedIds: expandedIds
           }))
         )
       )
     ),
     React.createElement(
       DialogActions,
-      null,
-      R.is(Function, onClose) && React.createElement(
-        Button,
-        {
-          onClick: function onClick() {
-            onClose();
-            setSelection({});
-          },
-          color: 'primary'
-        },
-        R.prop('cancel', labels)
+      { className: classes.actions },
+      React.createElement(
+        'div',
+        null,
+        React.createElement(
+          Button,
+          { onClick: collapseAll, color: 'primary' },
+          R.prop('colapseAll', labels)
+        ),
+        React.createElement(
+          Button,
+          { style: { marginLeft: 10 }, onClick: expandAll, color: 'primary' },
+          R.prop('expandAll', labels)
+        )
       ),
-      R.is(Function, changeSelection) && React.createElement(
-        Button,
-        {
-          disabled: R.isEmpty(selection),
-          onClick: handleSubmit,
-          color: 'primary',
-          variant: 'contained',
-          alternative: 'siscc'
-        },
-        R.prop('apply', labels)
+      React.createElement(
+        'div',
+        null,
+        R.is(Function, onClose) && React.createElement(
+          Button,
+          {
+            onClick: function onClick() {
+              onClose();
+              setSelection({});
+              setSpotlight({ term: '' });
+            },
+            color: 'primary'
+          },
+          R.prop('cancel', labels)
+        ),
+        R.is(Function, changeSelection) && React.createElement(
+          Button,
+          {
+            disabled: R.isEmpty(selection),
+            onClick: handleSubmit,
+            color: 'primary',
+            variant: 'contained',
+            alternative: 'siscc',
+            style: { marginLeft: 10 }
+          },
+          R.prop('apply', labels)
+        )
       )
     )
   );
@@ -503,7 +554,11 @@ AdvancedFilterDialog.propTypes = process.env.NODE_ENV !== "production" ? {
   }),
   onClose: PropTypes.func,
   labelRenderer: PropTypes.func,
-  title: PropTypes.string
+  title: PropTypes.string,
+  expandAll: PropTypes.func,
+  collapseAll: PropTypes.func,
+  defaultSpotlight: PropTypes.object,
+  expandedIds: PropTypes.object
 } : {};
 
-export default AdvancedFilterDialog;
+export default withExpansionTree(AdvancedFilterDialog);

package/es/HierarchicalFilter/HierarchicalFilter.js

@@ -6,9 +6,11 @@ import * as R from 'ramda';
 import Container from '@material-ui/core/Container';
 import PlaylistAddCheckIcon from '@material-ui/icons/PlaylistAddCheck';
 import { ExpansionPanel, Tag as InternalTag, VerticalButton, Spotlight, VirtualizedTree } from '../';
+import { withExpansionTree } from '../VirtualizedTree/withExpansionTree';
 import { useStyles } from '../ScopeList/styles';
 import { useTheme } from '@material-ui/core';
 import { getIsRtl } from '../utils';
+import { useEffect } from 'react';
 
 var getCounter = function getCounter(items, displayAccessor, tagAccessor) {
   var count = R.pipe(R.filter(R.prop('isSelected')), R.length)(items);
@@ -36,12 +38,19 @@ var HierarchicalFilter = function HierarchicalFilter(props) {
       label = props.label,
       labels = props.labels,
       tagAccessor = props.tagAccessor,
-      displayAccessor = props.displayAccessor;
+      displayAccessor = props.displayAccessor,
+      expandedIds = props.expandedIds,
+      defaultSpotlight = props.defaultSpotlight;
 
   var _useState = useState({ term: '' }),
       term = _useState[0].term,
       setSpotlight = _useState[1];
 
+  useEffect(function () {
+    if (!R.isNil(defaultSpotlight) && !R.isEmpty(defaultSpotlight)) {
+      setSpotlight(defaultSpotlight);
+    }
+  }, [defaultSpotlight]);
   var classes = useStyles({ accessibility: accessibility });
   var theme = useTheme();
   var isRtl = getIsRtl(theme);
@@ -68,6 +77,11 @@ var HierarchicalFilter = function HierarchicalFilter(props) {
   var onSelect = function onSelect(values) {
     changeSelection(id, values);
   };
+
+  var onAdvancedToggle = function onAdvancedToggle() {
+    toggleBulk({ expandedIds: expandedIds, spotlight: { term: term } });
+  };
+
   return React.createElement(
     ExpansionPanel,
     _extends({
@@ -98,7 +112,7 @@ var HierarchicalFilter = function HierarchicalFilter(props) {
             {
               'aria-label': R.prop('advancedSelection')(labels),
               classes: { root: classes.bulkSelectionIcon },
-              onClick: toggleBulk
+              onClick: onAdvancedToggle
             },
             React.createElement(PlaylistAddCheckIcon, { color: 'primary' })
           )
@@ -136,7 +150,9 @@ HierarchicalFilter.propTypes = process.env.NODE_ENV !== "production" ? {
   testId: PropTypes.string,
   expansionPanelProps: PropTypes.object,
   toggleBulk: PropTypes.func,
-  tagAccessor: PropTypes.func
+  tagAccessor: PropTypes.func,
+  expandedIds: PropTypes.object,
+  defaultSpotlight: PropTypes.object
 } : {};
 
-export default HierarchicalFilter;
+export default withExpansionTree(HierarchicalFilter);

package/es/TableHtml5/flags.js

@@ -57,7 +57,7 @@ var Flags = function Flags(_ref) {
   }, []), R.join(','))(flags);
   var content = React.createElement(
     'ul',
-    { className: classes.content },
+    { 'data-testid': 'cell-flags-footnotes-content', className: classes.content },
     R.addIndex(R.map)(function (_ref2, index) {
       var label = _ref2.label;
       return React.createElement(
@@ -78,7 +78,10 @@ var Flags = function Flags(_ref) {
     },
     React.createElement(
       'span',
-      { className: cx(classes.flags, (_cx = {}, _cx[classes.header] = isHeader, _cx)) },
+      {
+        'data-testid': 'cell-flags-footnotes-icon',
+        className: cx(classes.flags, (_cx = {}, _cx[classes.header] = isHeader, _cx))
+      },
       R.not(R.isEmpty(codedIcons)) && codedIcons,
       R.and(R.not(R.isEmpty(codedIcons)), hasUncoded) && React.createElement(
         React.Fragment,

package/es/TableHtml5/header.js

@@ -113,6 +113,13 @@ var Header = function Header(_ref) {
           React.createElement(
             'div',
             { className: classes.cellContentCenter },
+            !R.isEmpty(hierarchySpace) && mapIndexed(function (space, idx) {
+              return React.createElement(
+                'div',
+                { key: idx },
+                space
+              );
+            })(hierarchySpace),
             React.createElement(
               Typography,
               {
@@ -123,13 +130,6 @@ var Header = function Header(_ref) {
                 },
                 variant: 'body1'
               },
-              !R.isEmpty(hierarchySpace) && mapIndexed(function (space, idx) {
-                return React.createElement(
-                  'div',
-                  { key: idx },
-                  space
-                );
-              })(hierarchySpace),
               R.prop('label', headerItem),
               React.createElement(Flags, { HTMLRenderer: HTMLRenderer, flags: flags, isHeader: true })
             )

package/es/TableHtml5/sectionHeader.js

@@ -81,7 +81,7 @@ var SectionHeader = function SectionHeader(_ref) {
       },
       React.createElement(
         Grid,
-        { container: true, alignItems: 'center', spacing: 5 },
+        { container: true, alignItems: 'center' },
         React.createElement(
           Grid,
           { item: true },
@@ -128,7 +128,7 @@ var SectionHeader = function SectionHeader(_ref) {
         ),
         !R.isNil(SideIcon) && React.createElement(
           Grid,
-          { item: true },
+          { item: true, style: { marginLeft: 40 } },
           React.createElement(SideIcon, { sideProps: R.path([0, 'sideProps'], section) })
         )
       )

package/es/VirtualizedTree/Item.js

@@ -85,6 +85,7 @@ var Item = function Item(_ref) {
       secondaryTypographyProps: { color: 'inherit' },
       classes: { root: classes.listItem },
       className: cx((_cx = {}, _cx[classes.accessibilityItemHover] = accessibility, _cx[classes.listItemSelected] = R.and(isSelected, R.not(isDisabled)), _cx[classes.listItemHover] = R.not(isDisabled), _cx[classes.disabledLabel] = isDisabled, _cx)),
+      onClick: isDisabled ? null : callbacks.onClick,
       onMouseDown: isDisabled || isTooltipShown ? null : callbacks.onMouseDown,
       onMouseUp: isDisabled || isTooltipShown ? null : callbacks.onMouseUp,
       onMouseEnter: isDisabled || isTooltipShown ? null : callbacks.onMouseEnter
@@ -119,6 +120,7 @@ var Item = function Item(_ref) {
                 return e.stopPropagation();
               } }),
             enterDelay: 400,
+            enterNextDelay: 400,
             tabIndex: 0,
             'aria-label': description,
             'aria-hidden': false,