@sis-cc/dotstatsuite-visions 7.5.0 → 7.6.2

package/es/CollapseButtons/CollapseButtons.js

@@ -40,7 +40,9 @@ var CollapseButtons = function CollapseButtons(props) {
   } : _props$breakpoint,
       justify = props.justify,
       _props$textTransform = props.textTransform,
-      textTransform = _props$textTransform === undefined ? 'none' : _props$textTransform;
+      textTransform = _props$textTransform === undefined ? 'none' : _props$textTransform,
+      _props$labelAccessor = props.labelAccessor,
+      labelAccessor = _props$labelAccessor === undefined ? R.prop('label') : _props$labelAccessor;
 
 
   var classes = useStyles();
@@ -65,7 +67,8 @@ var CollapseButtons = function CollapseButtons(props) {
         parentId: parentId,
         item: item,
         action: action,
-        isSecondLevelClikable: isSecondLevelClikable
+        isSecondLevelClikable: isSecondLevelClikable,
+        labelAccessor: labelAccessor
       });
     });
   };
@@ -155,7 +158,8 @@ CollapseButtons.propTypes = process.env.NODE_ENV !== "production" ? {
   breakpoint: PropTypes.func,
   gridButtonsProps: PropTypes.object,
   justify: PropTypes.string,
-  textTransform: PropTypes.string
+  textTransform: PropTypes.string,
+  labelAccessor: PropTypes.func
 } : {};
 
 export default CollapseButtons;

package/es/CollapseButtons/Item.js

@@ -28,6 +28,8 @@ var useStyles = makeStyles(function (theme) {
       display: 'flex'
     },
     itemSubtitle: _extends({}, theme.typography.body1, {
+      display: 'flex',
+      flexDirection: 'column',
       color: theme.palette.grey[800]
     }),
     itemSubtitleLink: _extends({}, theme.typography.body1, {
@@ -51,7 +53,8 @@ var Item = function Item(_ref) {
       item = _ref.item,
       action = _ref.action,
       testId = _ref.testId,
-      isSecondLevelClikable = _ref.isSecondLevelClikable;
+      isSecondLevelClikable = _ref.isSecondLevelClikable,
+      labelAccessor = _ref.labelAccessor;
 
   var classes = useStyles();
 
@@ -83,14 +86,14 @@ var Item = function Item(_ref) {
         React.createElement(
           'span',
           { className: classes.itemTitle },
-          R.prop('label')(item)
+          labelAccessor(item, parentId)
         ),
         React.createElement(
           'span',
           { className: classes.itemSubtitle },
           R.map(function (subtopic) {
             if (R.not(R.is(Object)(subtopic))) return subtopic;
-            if (R.not(isSecondLevelClikable)) return R.prop('label')(subtopic);
+            if (R.not(isSecondLevelClikable)) return labelAccessor(subtopic, parentId);
             var id = R.prop('id')(subtopic);
             return React.createElement(
               Link,
@@ -105,9 +108,10 @@ var Item = function Item(_ref) {
                 },
                 tabIndex: 0
               },
-              R.prop('label')(subtopic)
+              '\u2022 ',
+              labelAccessor(subtopic, parentId)
             );
-          })(R.pipe(R.propOr([], 'subtopics'), R.intersperse(' • '))(item))
+          })(R.pipe(R.propOr([], 'subtopics'), R.ifElse(R.always(isSecondLevelClikable), R.identity, R.intersperse(' • ')))(item))
         )
       )
     )
@@ -119,7 +123,8 @@ Item.propTypes = process.env.NODE_ENV !== "production" ? {
   testId: PropTypes.string,
   item: PropTypes.object,
   action: PropTypes.func,
-  isSecondLevelClikable: PropTypes.bool
+  isSecondLevelClikable: PropTypes.bool,
+  labelAccessor: PropTypes.func
 } : {};
 
 export default Item;

package/es/CollapsibleTree/CollapsibleTree.js

@@ -39,7 +39,8 @@ var CollapsibleTree = function CollapsibleTree(_ref) {
       children = _ref.children,
       labels = _ref.labels,
       _ref$testId = _ref.testId,
-      testId = _ref$testId === undefined ? 'collapsible-tree' : _ref$testId;
+      testId = _ref$testId === undefined ? 'collapsible-tree' : _ref$testId,
+      valueHandler = _ref.valueHandler;
 
   var classes = useStyles();
 
@@ -106,7 +107,9 @@ var CollapsibleTree = function CollapsibleTree(_ref) {
           var id = _ref3.id,
               label = _ref3.label,
               children = _ref3.children,
-              value = _ref3.value;
+              value = _ref3.value,
+              _ref3$handlerProps = _ref3.handlerProps,
+              handlerProps = _ref3$handlerProps === undefined ? {} : _ref3$handlerProps;
 
           return React.createElement(
             Collapse,
@@ -114,12 +117,14 @@ var CollapsibleTree = function CollapsibleTree(_ref) {
             value && React.createElement(
               Typography,
               { className: classes.spacingValue, variant: 'body2' },
-              value
+              R.is(Function, valueHandler) ? valueHandler(_extends({ value: value }, handlerProps)) : value
             ),
             children && R.map(function (_ref4) {
               var id = _ref4.id,
                   label = _ref4.label,
-                  value = _ref4.value;
+                  value = _ref4.value,
+                  _ref4$handlerProps = _ref4.handlerProps,
+                  handlerProps = _ref4$handlerProps === undefined ? {} : _ref4$handlerProps;
 
               return React.createElement(
                 Collapse,
@@ -133,7 +138,7 @@ var CollapsibleTree = function CollapsibleTree(_ref) {
                 React.createElement(
                   Typography,
                   { variant: 'body2' },
-                  value
+                  R.is(Function, valueHandler) ? valueHandler(_extends({ value: value }, handlerProps)) : value
                 )
               );
             }, children)
@@ -165,7 +170,8 @@ CollapsibleTree.propTypes = process.env.NODE_ENV !== "production" ? {
     collapseAll: PropTypes.string,
     expandAll: PropTypes.string
   }),
-  testId: PropTypes.string
+  testId: PropTypes.string,
+  valueHandler: PropTypes.func
 } : {};
 
 export default CollapsibleTree;

package/es/DataHeader/DataHeader.js

@@ -158,6 +158,7 @@ var DataHeader = function DataHeader(_ref4) {
             className: cx(classes.title, classes.disclaimer),
             title: disclaimer,
             tabIndex: 0,
+            'data-testid': 'data-header-disclaimer',
             variant: 'warning',
             'aria-hidden': false,
             placement: 'bottom',

package/es/PeriodPicker/PeriodPicker.js

@@ -24,13 +24,11 @@ var Period = function Period(_ref) {
 
   var classes = useStyles();
   var frequencies = getFrequencyOptions(availableFrequencies, labels);
-  console.log('frequencies', frequencies);
   if (R.isEmpty(frequencies)) return null;
   var frequency = getDefaultFrequency({
     defaultFrequency: defaultFrequency,
     frequencies: R.pluck('value')(frequencies)
   });
-  console.log('frequency', frequency);
   var period = R.defaultTo([], _period);
   var boundaries = R.defaultTo([], _boundaries);
   var isPeriodDisabled = R.or(R.any(R.isEmpty)([period, boundaries]), periodDisabled);

package/es/TableHtml5/cell.js

@@ -34,6 +34,10 @@ var useStyles = makeStyles(function (theme) {
     },
     value: {
       overflow: 'inherit'
+    },
+    textValue: {
+      textAlign: 'right',
+      whiteSpace: 'nowrap'
     }
   };
 });
@@ -81,7 +85,7 @@ var Cell = function Cell(_ref) {
     },
     React.createElement(
       'div',
-      { style: { textAlign: 'right' } },
+      { className: classes.textValue },
       React.createElement(
         Typography,
         { variant: 'body1', tabIndex: 0, noWrap: hasFlag },

package/es/TableHtml5/sectionHeader.js

@@ -21,7 +21,8 @@ var useStyles = makeStyles(function (theme) {
       borderRight: '1px solid ' + theme.palette.grey[500],
       padding: theme.spacing(0, 1),
       color: theme.palette.grey['A700'],
-      verticalAlign: 'middle'
+      verticalAlign: 'middle',
+      whiteSpace: 'nowrap'
     },
     lens: _extends({}, theme.mixins.table.dot, {
       marginLeft: theme.spacing(1),

package/lib/CollapseButtons/CollapseButtons.js

@@ -74,7 +74,9 @@ var CollapseButtons = function CollapseButtons(props) {
   } : _props$breakpoint,
       justify = props.justify,
       _props$textTransform = props.textTransform,
-      textTransform = _props$textTransform === undefined ? 'none' : _props$textTransform;
+      textTransform = _props$textTransform === undefined ? 'none' : _props$textTransform,
+      _props$labelAccessor = props.labelAccessor,
+      labelAccessor = _props$labelAccessor === undefined ? R.prop('label') : _props$labelAccessor;
 
 
   var classes = useStyles();
@@ -99,7 +101,8 @@ var CollapseButtons = function CollapseButtons(props) {
         parentId: parentId,
         item: item,
         action: action,
-        isSecondLevelClikable: isSecondLevelClikable
+        isSecondLevelClikable: isSecondLevelClikable,
+        labelAccessor: labelAccessor
       });
     });
   };
@@ -189,7 +192,8 @@ CollapseButtons.propTypes = process.env.NODE_ENV !== "production" ? {
   breakpoint: _propTypes2.default.func,
   gridButtonsProps: _propTypes2.default.object,
   justify: _propTypes2.default.string,
-  textTransform: _propTypes2.default.string
+  textTransform: _propTypes2.default.string,
+  labelAccessor: _propTypes2.default.func
 } : {};
 
 exports.default = CollapseButtons;

package/lib/CollapseButtons/Item.js

@@ -57,6 +57,8 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
       display: 'flex'
     },
     itemSubtitle: _extends({}, theme.typography.body1, {
+      display: 'flex',
+      flexDirection: 'column',
       color: theme.palette.grey[800]
     }),
     itemSubtitleLink: _extends({}, theme.typography.body1, {
@@ -80,7 +82,8 @@ var Item = function Item(_ref) {
       item = _ref.item,
       action = _ref.action,
       testId = _ref.testId,
-      isSecondLevelClikable = _ref.isSecondLevelClikable;
+      isSecondLevelClikable = _ref.isSecondLevelClikable,
+      labelAccessor = _ref.labelAccessor;
 
   var classes = useStyles();
 
@@ -112,14 +115,14 @@ var Item = function Item(_ref) {
         _react2.default.createElement(
           'span',
           { className: classes.itemTitle },
-          R.prop('label')(item)
+          labelAccessor(item, parentId)
         ),
         _react2.default.createElement(
           'span',
           { className: classes.itemSubtitle },
           R.map(function (subtopic) {
             if (R.not(R.is(Object)(subtopic))) return subtopic;
-            if (R.not(isSecondLevelClikable)) return R.prop('label')(subtopic);
+            if (R.not(isSecondLevelClikable)) return labelAccessor(subtopic, parentId);
             var id = R.prop('id')(subtopic);
             return _react2.default.createElement(
               _Link2.default,
@@ -134,9 +137,10 @@ var Item = function Item(_ref) {
                 },
                 tabIndex: 0
               },
-              R.prop('label')(subtopic)
+              '\u2022 ',
+              labelAccessor(subtopic, parentId)
             );
-          })(R.pipe(R.propOr([], 'subtopics'), R.intersperse(' • '))(item))
+          })(R.pipe(R.propOr([], 'subtopics'), R.ifElse(R.always(isSecondLevelClikable), R.identity, R.intersperse(' • ')))(item))
         )
       )
     )
@@ -148,7 +152,8 @@ Item.propTypes = process.env.NODE_ENV !== "production" ? {
   testId: _propTypes2.default.string,
   item: _propTypes2.default.object,
   action: _propTypes2.default.func,
-  isSecondLevelClikable: _propTypes2.default.bool
+  isSecondLevelClikable: _propTypes2.default.bool,
+  labelAccessor: _propTypes2.default.func
 } : {};
 
 exports.default = Item;

package/lib/CollapsibleTree/CollapsibleTree.js

@@ -83,7 +83,8 @@ var CollapsibleTree = function CollapsibleTree(_ref) {
       children = _ref.children,
       labels = _ref.labels,
       _ref$testId = _ref.testId,
-      testId = _ref$testId === undefined ? 'collapsible-tree' : _ref$testId;
+      testId = _ref$testId === undefined ? 'collapsible-tree' : _ref$testId,
+      valueHandler = _ref.valueHandler;
 
   var classes = useStyles();
 
@@ -150,7 +151,9 @@ var CollapsibleTree = function CollapsibleTree(_ref) {
           var id = _ref3.id,
               label = _ref3.label,
               children = _ref3.children,
-              value = _ref3.value;
+              value = _ref3.value,
+              _ref3$handlerProps = _ref3.handlerProps,
+              handlerProps = _ref3$handlerProps === undefined ? {} : _ref3$handlerProps;
 
           return _react2.default.createElement(
             _Collapse2.default,
@@ -158,12 +161,14 @@ var CollapsibleTree = function CollapsibleTree(_ref) {
             value && _react2.default.createElement(
               _Typography2.default,
               { className: classes.spacingValue, variant: 'body2' },
-              value
+              R.is(Function, valueHandler) ? valueHandler(_extends({ value: value }, handlerProps)) : value
             ),
             children && R.map(function (_ref4) {
               var id = _ref4.id,
                   label = _ref4.label,
-                  value = _ref4.value;
+                  value = _ref4.value,
+                  _ref4$handlerProps = _ref4.handlerProps,
+                  handlerProps = _ref4$handlerProps === undefined ? {} : _ref4$handlerProps;
 
               return _react2.default.createElement(
                 _Collapse2.default,
@@ -177,7 +182,7 @@ var CollapsibleTree = function CollapsibleTree(_ref) {
                 _react2.default.createElement(
                   _Typography2.default,
                   { variant: 'body2' },
-                  value
+                  R.is(Function, valueHandler) ? valueHandler(_extends({ value: value }, handlerProps)) : value
                 )
               );
             }, children)
@@ -209,7 +214,8 @@ CollapsibleTree.propTypes = process.env.NODE_ENV !== "production" ? {
     collapseAll: _propTypes2.default.string,
     expandAll: _propTypes2.default.string
   }),
-  testId: _propTypes2.default.string
+  testId: _propTypes2.default.string,
+  valueHandler: _propTypes2.default.func
 } : {};
 
 exports.default = CollapsibleTree;

package/lib/DataHeader/DataHeader.js

@@ -198,6 +198,7 @@ var DataHeader = function DataHeader(_ref4) {
             className: (0, _classnames2.default)(classes.title, classes.disclaimer),
             title: disclaimer,
             tabIndex: 0,
+            'data-testid': 'data-header-disclaimer',
             variant: 'warning',
             'aria-hidden': false,
             placement: 'bottom',

package/lib/PeriodPicker/PeriodPicker.js

@@ -49,13 +49,11 @@ var Period = function Period(_ref) {
 
   var classes = (0, _styles2.default)();
   var frequencies = (0, _lib.getFrequencyOptions)(availableFrequencies, labels);
-  console.log('frequencies', frequencies);
   if (R.isEmpty(frequencies)) return null;
   var frequency = (0, _lib.getDefaultFrequency)({
     defaultFrequency: defaultFrequency,
     frequencies: R.pluck('value')(frequencies)
   });
-  console.log('frequency', frequency);
   var period = R.defaultTo([], _period);
   var boundaries = R.defaultTo([], _boundaries);
   var isPeriodDisabled = R.or(R.any(R.isEmpty)([period, boundaries]), periodDisabled);

package/lib/TableHtml5/cell.js

@@ -66,6 +66,10 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
     },
     value: {
       overflow: 'inherit'
+    },
+    textValue: {
+      textAlign: 'right',
+      whiteSpace: 'nowrap'
     }
   };
 });
@@ -113,7 +117,7 @@ var Cell = function Cell(_ref) {
     },
     _react2.default.createElement(
       'div',
-      { style: { textAlign: 'right' } },
+      { className: classes.textValue },
       _react2.default.createElement(
         _Typography2.default,
         { variant: 'body1', tabIndex: 0, noWrap: hasFlag },

package/lib/TableHtml5/sectionHeader.js

@@ -57,7 +57,8 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
       borderRight: '1px solid ' + theme.palette.grey[500],
       padding: theme.spacing(0, 1),
       color: theme.palette.grey['A700'],
-      verticalAlign: 'middle'
+      verticalAlign: 'middle',
+      whiteSpace: 'nowrap'
     },
     lens: _extends({}, theme.mixins.table.dot, {
       marginLeft: theme.spacing(1),

package/package.json

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