@sis-cc/dotstatsuite-visions 7.8.4 → 7.9.0

package/es/TableHtml5/cell.js

@@ -2,11 +2,11 @@ import React from 'react';
 import * as R from 'ramda';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
-import { makeStyles } from '@material-ui/core/styles';
+import { makeStyles, useTheme } from '@material-ui/core/styles';
 import TableCell from '@material-ui/core/TableCell';
-import Typography from '@material-ui/core/Typography';
 import Link from '@material-ui/core/Link';
 import Flags from './flags';
+import { getIsRtl } from '../utils';
 
 var useStyles = makeStyles(function (theme) {
   return {
@@ -18,7 +18,8 @@ var useStyles = makeStyles(function (theme) {
       color: theme.palette.grey['A700'],
       '&:hover': {
         boxShadow: 'inset 0 0 0 2px ' + theme.palette.primary.main
-      }
+      },
+      whiteSpace: 'nowrap'
     },
     active: {
       boxShadow: 'inset 0 0 0 2px ' + theme.palette.primary.main
@@ -35,18 +36,22 @@ var useStyles = makeStyles(function (theme) {
     value: {
       overflow: 'inherit'
     },
-    textValue: {
-      textAlign: 'right',
-      whiteSpace: 'nowrap'
+    rightAlign: {
+      // only for rtl layout !
+      // changed by right in rtl mode
+      textAlign: 'left'
     }
   };
 });
 
+var isValidNumber = R.both(R.is(Number), R.complement(R.equals(NaN)));
+
 var Cell = function Cell(_ref) {
   var _cx;
 
   var flags = _ref.flags,
       value = _ref.value,
+      intValue = _ref.intValue,
       headers = _ref.headers,
       isOne = _ref.isOne,
       _ref$indexedDimValIds = _ref.indexedDimValIds,
@@ -60,6 +65,7 @@ var Cell = function Cell(_ref) {
       HTMLRenderer = _ref.HTMLRenderer;
 
   var classes = useStyles();
+  var isRtl = getIsRtl(useTheme());
   var hasFlag = R.not(R.isEmpty(flags));
   var uiValue = R.is(Function, cellHandler) && !R.isEmpty(indexedDimValIds) ? React.createElement(
     Link,
@@ -79,26 +85,21 @@ var Cell = function Cell(_ref) {
   return React.createElement(
     TableCell,
     {
+      align: isValidNumber(intValue) ? 'right' : 'left',
       component: isOne ? 'div' : undefined,
-      className: cx(classes.cell, (_cx = {}, _cx[classes.oneCell] = isOne, _cx[classes.active] = isActive, _cx[classes.highlight] = isHighlight, _cx)),
+      className: cx(classes.cell, (_cx = {}, _cx[classes.oneCell] = isOne, _cx[classes.active] = isActive, _cx[classes.highlight] = isHighlight, _cx[classes.rightAlign] = isRtl, _cx)),
       headers: headers,
-      onClick: activeCellHandler
+      onClick: activeCellHandler,
+      tabIndex: 0
     },
-    React.createElement(
-      'div',
-      { className: classes.textValue },
-      React.createElement(
-        Typography,
-        { variant: 'body1', tabIndex: 0, noWrap: hasFlag },
-        !R.isNil(SideIcon) && React.createElement(SideIcon, { sideProps: sideProps, className: classes.value }),
-        hasFlag && React.createElement(Flags, { HTMLRenderer: HTMLRenderer, flags: flags }),
-        uiValue
-      )
-    )
+    !R.isNil(SideIcon) && React.createElement(SideIcon, { sideProps: sideProps, className: classes.value }),
+    hasFlag && React.createElement(Flags, { HTMLRenderer: HTMLRenderer, flags: flags }),
+    uiValue
   );
 };
 
 Cell.propTypes = process.env.NODE_ENV !== "production" ? {
+  intValue: PropTypes.number,
   flags: PropTypes.array,
   isOne: PropTypes.bool,
   value: PropTypes.string,

package/lib/TableHtml5/cell.js

@@ -24,10 +24,6 @@ var _TableCell = require('@material-ui/core/TableCell');
 
 var _TableCell2 = _interopRequireDefault(_TableCell);
 
-var _Typography = require('@material-ui/core/Typography');
-
-var _Typography2 = _interopRequireDefault(_Typography);
-
 var _Link = require('@material-ui/core/Link');
 
 var _Link2 = _interopRequireDefault(_Link);
@@ -36,6 +32,8 @@ var _flags = require('./flags');
 
 var _flags2 = _interopRequireDefault(_flags);
 
+var _utils = require('../utils');
+
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -50,7 +48,8 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
       color: theme.palette.grey['A700'],
       '&:hover': {
         boxShadow: 'inset 0 0 0 2px ' + theme.palette.primary.main
-      }
+      },
+      whiteSpace: 'nowrap'
     },
     active: {
       boxShadow: 'inset 0 0 0 2px ' + theme.palette.primary.main
@@ -67,18 +66,22 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
     value: {
       overflow: 'inherit'
     },
-    textValue: {
-      textAlign: 'right',
-      whiteSpace: 'nowrap'
+    rightAlign: {
+      // only for rtl layout !
+      // changed by right in rtl mode
+      textAlign: 'left'
     }
   };
 });
 
+var isValidNumber = R.both(R.is(Number), R.complement(R.equals(NaN)));
+
 var Cell = function Cell(_ref) {
   var _cx;
 
   var flags = _ref.flags,
       value = _ref.value,
+      intValue = _ref.intValue,
       headers = _ref.headers,
       isOne = _ref.isOne,
       _ref$indexedDimValIds = _ref.indexedDimValIds,
@@ -92,6 +95,7 @@ var Cell = function Cell(_ref) {
       HTMLRenderer = _ref.HTMLRenderer;
 
   var classes = useStyles();
+  var isRtl = (0, _utils.getIsRtl)((0, _styles.useTheme)());
   var hasFlag = R.not(R.isEmpty(flags));
   var uiValue = R.is(Function, cellHandler) && !R.isEmpty(indexedDimValIds) ? _react2.default.createElement(
     _Link2.default,
@@ -111,26 +115,21 @@ var Cell = function Cell(_ref) {
   return _react2.default.createElement(
     _TableCell2.default,
     {
+      align: isValidNumber(intValue) ? 'right' : 'left',
       component: isOne ? 'div' : undefined,
-      className: (0, _classnames2.default)(classes.cell, (_cx = {}, _cx[classes.oneCell] = isOne, _cx[classes.active] = isActive, _cx[classes.highlight] = isHighlight, _cx)),
+      className: (0, _classnames2.default)(classes.cell, (_cx = {}, _cx[classes.oneCell] = isOne, _cx[classes.active] = isActive, _cx[classes.highlight] = isHighlight, _cx[classes.rightAlign] = isRtl, _cx)),
       headers: headers,
-      onClick: activeCellHandler
+      onClick: activeCellHandler,
+      tabIndex: 0
     },
-    _react2.default.createElement(
-      'div',
-      { className: classes.textValue },
-      _react2.default.createElement(
-        _Typography2.default,
-        { variant: 'body1', tabIndex: 0, noWrap: hasFlag },
-        !R.isNil(SideIcon) && _react2.default.createElement(SideIcon, { sideProps: sideProps, className: classes.value }),
-        hasFlag && _react2.default.createElement(_flags2.default, { HTMLRenderer: HTMLRenderer, flags: flags }),
-        uiValue
-      )
-    )
+    !R.isNil(SideIcon) && _react2.default.createElement(SideIcon, { sideProps: sideProps, className: classes.value }),
+    hasFlag && _react2.default.createElement(_flags2.default, { HTMLRenderer: HTMLRenderer, flags: flags }),
+    uiValue
   );
 };
 
 Cell.propTypes = process.env.NODE_ENV !== "production" ? {
+  intValue: _propTypes2.default.number,
   flags: _propTypes2.default.array,
   isOne: _propTypes2.default.bool,
   value: _propTypes2.default.string,

package/package.json

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