@sis-cc/dotstatsuite-visions 7.9.0 → 7.11.0

package/es/Dataflow/Dataflow.js

@@ -142,6 +142,8 @@ var Dataflow = function Dataflow(_ref2) {
       handleUrl = _ref2.handleUrl,
       label = _ref2.label,
       labels = _ref2.labels,
+      _ref2$dimensions = _ref2.dimensions,
+      dimensions = _ref2$dimensions === undefined ? [] : _ref2$dimensions,
       _ref2$highlights = _ref2.highlights,
       highlights = _ref2$highlights === undefined ? [] : _ref2$highlights,
       _ref2$categories = _ref2.categories,
@@ -175,12 +177,7 @@ var Dataflow = function Dataflow(_ref2) {
             { className: classes.header, 'data-testid': testId + '_title' },
             React.createElement(
               Typography,
-              {
-                variant: 'h6',
-                color: 'primary',
-                display: 'inline',
-                className: classes.container
-              },
+              { variant: 'h6', color: 'primary', display: 'inline' },
               React.createElement(
                 Link,
                 {
@@ -234,6 +231,21 @@ var Dataflow = function Dataflow(_ref2) {
         React.createElement(
           CardContent,
           { className: classes.cardContent },
+          !R.isEmpty(dimensions) && React.createElement(
+            Typography,
+            {
+              variant: 'body2',
+              color: 'textSecondary',
+              'data-testid': testId + '_dimensions'
+            },
+            React.createElement(
+              'strong',
+              null,
+              R.prop('dimensions')(labels),
+              ':\xA0'
+            ),
+            React.createElement(HTMLRenderer, { html: R.join(', ', dimensions) })
+          ),
           R.map(function (_ref3) {
             var field = _ref3[0],
                 fieldHighlights = _ref3[1];
@@ -243,7 +255,6 @@ var Dataflow = function Dataflow(_ref2) {
                 variant: 'body2',
                 key: field,
                 color: 'textSecondary',
-                className: classes.container,
                 'data-testid': testId + '_highlight_' + field
               },
               React.createElement(
@@ -266,12 +277,7 @@ var Dataflow = function Dataflow(_ref2) {
                   categorie = _ref4[1];
               return React.createElement(
                 Typography,
-                {
-                  variant: 'body2',
-                  key: field,
-                  color: 'textSecondary',
-                  className: classes.container
-                },
+                { variant: 'body2', key: field, color: 'textSecondary' },
                 React.createElement(
                   'strong',
                   null,
@@ -289,7 +295,7 @@ var Dataflow = function Dataflow(_ref2) {
             R.not(R.isEmpty(categories)) && React.createElement(Divider, { className: classes.divider }),
             label && React.createElement(
               Typography,
-              { variant: 'body2', color: 'textSecondary', className: classes.container },
+              { variant: 'body2', color: 'textSecondary' },
               React.createElement(
                 'strong',
                 null,
@@ -305,7 +311,7 @@ var Dataflow = function Dataflow(_ref2) {
               { className: classes.footer, disableSpacing: true },
               React.createElement(
                 Typography,
-                { variant: 'caption', color: 'textSecondary', className: classes.container },
+                { variant: 'caption', color: 'textSecondary' },
                 React.createElement(
                   'strong',
                   null,
@@ -321,7 +327,7 @@ var Dataflow = function Dataflow(_ref2) {
               ),
               React.createElement(
                 Typography,
-                { variant: 'caption', color: 'textSecondary', className: classes.container },
+                { variant: 'caption', color: 'textSecondary' },
                 R.prop('note')(labels)
               )
             )
@@ -374,6 +380,7 @@ Dataflow.propTypes = process.env.NODE_ENV !== "production" ? {
     date: PropTypes.oneOfType([PropTypes.string, PropTypes.element])
   }),
   highlights: PropTypes.array,
+  dimensions: PropTypes.array,
   categories: PropTypes.array,
   children: PropTypes.node,
   HTMLRenderer: PropTypes.func

package/es/Dataflow/index.js

@@ -27,6 +27,7 @@
  *     note: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
  *     date: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
  *   }),
+ *   dimensions: PropTypes.array,
  *   highlights: PropTypes.array,
  *   categories: PropTypes.array,
  *   HTMLRenderer: PropTypes.func,

package/es/ScopeList/Item.js

@@ -54,7 +54,8 @@ var Item = function Item(_ref) {
       accessibility = _ref.accessibility,
       index = _ref.index,
       labelRenderer = _ref.labelRenderer,
-      HTMLRenderer = _ref.HTMLRenderer;
+      HTMLRenderer = _ref.HTMLRenderer,
+      hierarchicalId = _ref.hierarchicalId;
 
   var _React$useState = React.useState(false),
       isTooltipShown = _React$useState[0],
@@ -171,7 +172,7 @@ var Item = function Item(_ref) {
         className: classes.containerArrow,
         tabIndex: 0,
         onClick: function onClick() {
-          return changeList(id);
+          return changeList(hierarchicalId || id);
         },
         onKeyPress: function onKeyPress(e) {
           if (e.key === 'Enter') {
@@ -232,7 +233,8 @@ Item.propTypes = process.env.NODE_ENV !== "production" ? {
   accessibility: PropTypes.bool,
   index: PropTypes.number,
   labelRenderer: PropTypes.func,
-  HTMLRenderer: PropTypes.func
+  HTMLRenderer: PropTypes.func,
+  hierarchicalId: PropTypes.string
 } : {};
 
 export default Item;

package/es/ScopeList/with-scope-list.js

@@ -85,7 +85,7 @@ export var getPlaceholder = function getPlaceholder(_ref2) {
 //----------------------------------------------------------------------------------------------List
 export var withHasChild = function withHasChild(itemsByParentId) {
   return function (item) {
-    return R.assoc('hasChild', R.pipe(R.prop(item.id), R.isNil, R.not)(itemsByParentId))(item);
+    return R.assoc('hasChild', R.pipe(R.prop(item.hierarchicalId || item.id), R.isNil, R.not)(itemsByParentId))(item);
   };
 };
 export var getCurrentList = function getCurrentList(_ref3) {
@@ -110,7 +110,7 @@ export var getList = function getList(_ref4) {
       hasPath = _ref4.hasPath,
       displayAccessor = _ref4.displayAccessor;
 
-  var currentItemId = currentItem ? R.prop('id')(currentItem) : null;
+  var currentItemId = currentItem ? currentItem.hierarchicalId || currentItem.id : null;
   if (R.or(R.isEmpty(term), R.isNil(R.prop('defaultSpotlight')(topElementProps)))) {
     var itemsByParentIdDisplayed = getItemsIndexedByParentId(displayAccessor)(items);
     if (R.isNil(currentItemId)) return R.pipe(getMainList, R.map(function (item) {
@@ -270,7 +270,7 @@ export var withScopeList = function withScopeList(Component) {
         isMousePreSelection: false,
         applyToShiftSelected: R.identity
       }, _this.changeList = function (id) {
-        return _this.setState({ currentItem: R.prop(id)(_this.state.itemsById), term: '' });
+        return _this.setState({ currentItem: R.prop(id)(_this.state.itemsByHierarchicalId), term: '' });
       }, _this.changeSelection = function (panelId) {
         return function (id) {
           return function (event) {
@@ -416,6 +416,7 @@ export var withScopeList = function withScopeList(Component) {
             term = _this$state.term,
             itemsByParentId = _this$state.itemsByParentId,
             itemsById = _this$state.itemsById,
+            itemsByHierarchicalId = _this$state.itemsByHierarchicalId,
             shiftSelection = _this$state.shiftSelection,
             ctrlSelection = _this$state.ctrlSelection,
             mouseSelection = _this$state.mouseSelection,
@@ -426,6 +427,7 @@ export var withScopeList = function withScopeList(Component) {
           items: items,
           itemsByParentId: itemsByParentId,
           itemsById: itemsById,
+          itemsByHierarchicalId: itemsByHierarchicalId,
           topElementProps: topElementProps,
           currentItem: currentItem,
           term: term,
@@ -445,7 +447,7 @@ export var withScopeList = function withScopeList(Component) {
             isActivePanel: isActivePanel,
             currentItem: currentItem,
             items: items,
-            itemsById: itemsById,
+            itemsById: itemsByHierarchicalId,
             hasPath: hasPath
           }),
           action: _this.changeSpotlight,
@@ -480,6 +482,9 @@ export var withScopeList = function withScopeList(Component) {
   }(React.Component), _class.getDerivedStateFromProps = function (props, state) {
     return _extends({}, state, {
       itemsById: R.indexBy(R.prop('id'), props.items),
+      itemsByHierarchicalId: R.indexBy(function (item) {
+        return item.hierarchicalId || item.id;
+      }, props.items),
       itemsByParentId: getItemsIndexedByParentId(props.displayAccessor)(props.items) // only use for hasChild, same keys are overide
     });
   }, _temp2;

package/es/TableHtml5/section.js

@@ -94,21 +94,21 @@ var Section = function Section(_ref) {
       SideIcon: SideIcon,
       HTMLRenderer: HTMLRenderer
     }),
-    R.map(function (sectionbody) {
+    R.addIndex(R.map)(function (sectionbody, rowIndex) {
       var _cx2;
 
-      var rowId = sectionbody.key + '_' + sectionIndex;
+      var rowId = sectionbody.key + '_' + sectionIndex + '_' + rowIndex;
       var rowIds = R.pipe(R.map(function (index) {
         return sectionbody.key + '_' + sectionIndex + '_' + index;
       }), R.join(' '))(R.times(R.identity, R.length(R.prop('data', sectionbody))));
       return React.createElement(
         TableRow,
-        { key: sectionbody.key },
+        { key: rowId },
         mapIndexed(function (cell, index) {
           var _cx;
 
           var flags = R.path(['value', 'flags'], cell);
-          var id = rowId + '_' + index;
+          var id = rowIndex + '_' + rowId + '_' + index;
 
           // special space is used for hierarchy U+2007    
           var hierarchySpace = R.pipe(R.pathOr([], ['value', 'parents']), R.when(R.isNil, R.always([])), R.length,
@@ -165,9 +165,8 @@ var Section = function Section(_ref) {
 
           var intersectionCellId = rowId + '/' + columnIndex;
           var isActive = R.pipe(R.propOr({}, 'intersectionCellId'), R.equals(intersectionCellId))(activeCellIds);
-          return React.createElement(Cell, _extends({
-            key: intersectionCellId
-          }, R.pathOr({ value: '..' }, [item.key, currentSection, sectionbody.key, 0], cells), {
+          return React.createElement(Cell, _extends({}, R.pathOr({ value: '..' }, [item.key, currentSection, sectionbody.key, 0], cells), {
+            key: intersectionCellId,
             headers: rowIds + ' ' + columnIds + ' ' + currentSection,
             cellHandler: cellHandler,
             HTMLRenderer: HTMLRenderer,

package/lib/Dataflow/Dataflow.js

@@ -196,6 +196,8 @@ var Dataflow = function Dataflow(_ref2) {
       handleUrl = _ref2.handleUrl,
       label = _ref2.label,
       labels = _ref2.labels,
+      _ref2$dimensions = _ref2.dimensions,
+      dimensions = _ref2$dimensions === undefined ? [] : _ref2$dimensions,
       _ref2$highlights = _ref2.highlights,
       highlights = _ref2$highlights === undefined ? [] : _ref2$highlights,
       _ref2$categories = _ref2.categories,
@@ -229,12 +231,7 @@ var Dataflow = function Dataflow(_ref2) {
             { className: classes.header, 'data-testid': testId + '_title' },
             _react2.default.createElement(
               _Typography2.default,
-              {
-                variant: 'h6',
-                color: 'primary',
-                display: 'inline',
-                className: classes.container
-              },
+              { variant: 'h6', color: 'primary', display: 'inline' },
               _react2.default.createElement(
                 _Link2.default,
                 {
@@ -288,6 +285,21 @@ var Dataflow = function Dataflow(_ref2) {
         _react2.default.createElement(
           _CardContent2.default,
           { className: classes.cardContent },
+          !R.isEmpty(dimensions) && _react2.default.createElement(
+            _Typography2.default,
+            {
+              variant: 'body2',
+              color: 'textSecondary',
+              'data-testid': testId + '_dimensions'
+            },
+            _react2.default.createElement(
+              'strong',
+              null,
+              R.prop('dimensions')(labels),
+              ':\xA0'
+            ),
+            _react2.default.createElement(HTMLRenderer, { html: R.join(', ', dimensions) })
+          ),
           R.map(function (_ref3) {
             var field = _ref3[0],
                 fieldHighlights = _ref3[1];
@@ -297,7 +309,6 @@ var Dataflow = function Dataflow(_ref2) {
                 variant: 'body2',
                 key: field,
                 color: 'textSecondary',
-                className: classes.container,
                 'data-testid': testId + '_highlight_' + field
               },
               _react2.default.createElement(
@@ -320,12 +331,7 @@ var Dataflow = function Dataflow(_ref2) {
                   categorie = _ref4[1];
               return _react2.default.createElement(
                 _Typography2.default,
-                {
-                  variant: 'body2',
-                  key: field,
-                  color: 'textSecondary',
-                  className: classes.container
-                },
+                { variant: 'body2', key: field, color: 'textSecondary' },
                 _react2.default.createElement(
                   'strong',
                   null,
@@ -343,7 +349,7 @@ var Dataflow = function Dataflow(_ref2) {
             R.not(R.isEmpty(categories)) && _react2.default.createElement(_Divider2.default, { className: classes.divider }),
             label && _react2.default.createElement(
               _Typography2.default,
-              { variant: 'body2', color: 'textSecondary', className: classes.container },
+              { variant: 'body2', color: 'textSecondary' },
               _react2.default.createElement(
                 'strong',
                 null,
@@ -359,7 +365,7 @@ var Dataflow = function Dataflow(_ref2) {
               { className: classes.footer, disableSpacing: true },
               _react2.default.createElement(
                 _Typography2.default,
-                { variant: 'caption', color: 'textSecondary', className: classes.container },
+                { variant: 'caption', color: 'textSecondary' },
                 _react2.default.createElement(
                   'strong',
                   null,
@@ -375,7 +381,7 @@ var Dataflow = function Dataflow(_ref2) {
               ),
               _react2.default.createElement(
                 _Typography2.default,
-                { variant: 'caption', color: 'textSecondary', className: classes.container },
+                { variant: 'caption', color: 'textSecondary' },
                 R.prop('note')(labels)
               )
             )
@@ -428,6 +434,7 @@ Dataflow.propTypes = process.env.NODE_ENV !== "production" ? {
     date: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.element])
   }),
   highlights: _propTypes2.default.array,
+  dimensions: _propTypes2.default.array,
   categories: _propTypes2.default.array,
   children: _propTypes2.default.node,
   HTMLRenderer: _propTypes2.default.func

package/lib/ScopeList/Item.js

@@ -92,7 +92,8 @@ var Item = function Item(_ref) {
       accessibility = _ref.accessibility,
       index = _ref.index,
       labelRenderer = _ref.labelRenderer,
-      HTMLRenderer = _ref.HTMLRenderer;
+      HTMLRenderer = _ref.HTMLRenderer,
+      hierarchicalId = _ref.hierarchicalId;
 
   var _React$useState = _react2.default.useState(false),
       isTooltipShown = _React$useState[0],
@@ -209,7 +210,7 @@ var Item = function Item(_ref) {
         className: classes.containerArrow,
         tabIndex: 0,
         onClick: function onClick() {
-          return changeList(id);
+          return changeList(hierarchicalId || id);
         },
         onKeyPress: function onKeyPress(e) {
           if (e.key === 'Enter') {
@@ -270,7 +271,8 @@ Item.propTypes = process.env.NODE_ENV !== "production" ? {
   accessibility: _propTypes2.default.bool,
   index: _propTypes2.default.number,
   labelRenderer: _propTypes2.default.func,
-  HTMLRenderer: _propTypes2.default.func
+  HTMLRenderer: _propTypes2.default.func,
+  hierarchicalId: _propTypes2.default.string
 } : {};
 
 exports.default = Item;

package/lib/ScopeList/with-scope-list.js

@@ -100,7 +100,7 @@ var getPlaceholder = exports.getPlaceholder = function getPlaceholder(_ref2) {
 //----------------------------------------------------------------------------------------------List
 var withHasChild = exports.withHasChild = function withHasChild(itemsByParentId) {
   return function (item) {
-    return R.assoc('hasChild', R.pipe(R.prop(item.id), R.isNil, R.not)(itemsByParentId))(item);
+    return R.assoc('hasChild', R.pipe(R.prop(item.hierarchicalId || item.id), R.isNil, R.not)(itemsByParentId))(item);
   };
 };
 var getCurrentList = exports.getCurrentList = function getCurrentList(_ref3) {
@@ -125,7 +125,7 @@ var getList = exports.getList = function getList(_ref4) {
       hasPath = _ref4.hasPath,
       displayAccessor = _ref4.displayAccessor;
 
-  var currentItemId = currentItem ? R.prop('id')(currentItem) : null;
+  var currentItemId = currentItem ? currentItem.hierarchicalId || currentItem.id : null;
   if (R.or(R.isEmpty(term), R.isNil(R.prop('defaultSpotlight')(topElementProps)))) {
     var itemsByParentIdDisplayed = getItemsIndexedByParentId(displayAccessor)(items);
     if (R.isNil(currentItemId)) return R.pipe(getMainList, R.map(function (item) {
@@ -285,7 +285,7 @@ var withScopeList = exports.withScopeList = function withScopeList(Component) {
         isMousePreSelection: false,
         applyToShiftSelected: R.identity
       }, _this.changeList = function (id) {
-        return _this.setState({ currentItem: R.prop(id)(_this.state.itemsById), term: '' });
+        return _this.setState({ currentItem: R.prop(id)(_this.state.itemsByHierarchicalId), term: '' });
       }, _this.changeSelection = function (panelId) {
         return function (id) {
           return function (event) {
@@ -431,6 +431,7 @@ var withScopeList = exports.withScopeList = function withScopeList(Component) {
             term = _this$state.term,
             itemsByParentId = _this$state.itemsByParentId,
             itemsById = _this$state.itemsById,
+            itemsByHierarchicalId = _this$state.itemsByHierarchicalId,
             shiftSelection = _this$state.shiftSelection,
             ctrlSelection = _this$state.ctrlSelection,
             mouseSelection = _this$state.mouseSelection,
@@ -441,6 +442,7 @@ var withScopeList = exports.withScopeList = function withScopeList(Component) {
           items: items,
           itemsByParentId: itemsByParentId,
           itemsById: itemsById,
+          itemsByHierarchicalId: itemsByHierarchicalId,
           topElementProps: topElementProps,
           currentItem: currentItem,
           term: term,
@@ -460,7 +462,7 @@ var withScopeList = exports.withScopeList = function withScopeList(Component) {
             isActivePanel: isActivePanel,
             currentItem: currentItem,
             items: items,
-            itemsById: itemsById,
+            itemsById: itemsByHierarchicalId,
             hasPath: hasPath
           }),
           action: _this.changeSpotlight,
@@ -495,6 +497,9 @@ var withScopeList = exports.withScopeList = function withScopeList(Component) {
   }(_react2.default.Component), _class.getDerivedStateFromProps = function (props, state) {
     return _extends({}, state, {
       itemsById: R.indexBy(R.prop('id'), props.items),
+      itemsByHierarchicalId: R.indexBy(function (item) {
+        return item.hierarchicalId || item.id;
+      }, props.items),
       itemsByParentId: getItemsIndexedByParentId(props.displayAccessor)(props.items) // only use for hasChild, same keys are overide
     });
   }, _temp2;

package/lib/TableHtml5/section.js

@@ -136,21 +136,21 @@ var Section = function Section(_ref) {
       SideIcon: SideIcon,
       HTMLRenderer: HTMLRenderer
     }),
-    R.map(function (sectionbody) {
+    R.addIndex(R.map)(function (sectionbody, rowIndex) {
       var _cx2;
 
-      var rowId = sectionbody.key + '_' + sectionIndex;
+      var rowId = sectionbody.key + '_' + sectionIndex + '_' + rowIndex;
       var rowIds = R.pipe(R.map(function (index) {
         return sectionbody.key + '_' + sectionIndex + '_' + index;
       }), R.join(' '))(R.times(R.identity, R.length(R.prop('data', sectionbody))));
       return _react2.default.createElement(
         _TableRow2.default,
-        { key: sectionbody.key },
+        { key: rowId },
         mapIndexed(function (cell, index) {
           var _cx;
 
           var flags = R.path(['value', 'flags'], cell);
-          var id = rowId + '_' + index;
+          var id = rowIndex + '_' + rowId + '_' + index;
 
           // special space is used for hierarchy U+2007    
           var hierarchySpace = R.pipe(R.pathOr([], ['value', 'parents']), R.when(R.isNil, R.always([])), R.length,
@@ -207,9 +207,8 @@ var Section = function Section(_ref) {
 
           var intersectionCellId = rowId + '/' + columnIndex;
           var isActive = R.pipe(R.propOr({}, 'intersectionCellId'), R.equals(intersectionCellId))(activeCellIds);
-          return _react2.default.createElement(_cell2.default, _extends({
-            key: intersectionCellId
-          }, R.pathOr({ value: '..' }, [item.key, currentSection, sectionbody.key, 0], cells), {
+          return _react2.default.createElement(_cell2.default, _extends({}, R.pathOr({ value: '..' }, [item.key, currentSection, sectionbody.key, 0], cells), {
+            key: intersectionCellId,
             headers: rowIds + ' ' + columnIds + ' ' + currentSection,
             cellHandler: cellHandler,
             HTMLRenderer: HTMLRenderer,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sis-cc/dotstatsuite-visions",
-  "version": "7.9.0",
+  "version": "7.11.0",
   "description": "Library of visual components",
   "author": "OECD",
   "homepage": "https://visions-qa.siscc.org/#o",