@hipay/hipay-material-ui 2.0.0-beta.46 → 2.0.0-beta.48

package/HiTable/HiTableBody.js

@@ -0,0 +1,90 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _TableBody = _interopRequireDefault(require("@material-ui/core/TableBody/TableBody"));
+
+var _HiTableRow = _interopRequireDefault(require("./HiTableRow"));
+
+// @inheritedComponent TableBody
+var HiTableBody =
+/*#__PURE__*/
+function (_React$PureComponent) {
+  (0, _inherits2.default)(HiTableBody, _React$PureComponent);
+
+  function HiTableBody() {
+    (0, _classCallCheck2.default)(this, HiTableBody);
+    return (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiTableBody).apply(this, arguments));
+  }
+
+  (0, _createClass2.default)(HiTableBody, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          columns = _this$props.columns,
+          data = _this$props.data,
+          dense = _this$props.dense,
+          locale = _this$props.locale,
+          onClick = _this$props.onClick;
+      return _react.default.createElement(_TableBody.default, null, data.map(function (n) {
+        return _react.default.createElement(_HiTableRow.default, {
+          columns: columns,
+          rowdata: n,
+          key: n.rowId,
+          onClick: onClick,
+          dense: dense,
+          locale: locale
+        });
+      }));
+    }
+  }]);
+  return HiTableBody;
+}(_react.default.PureComponent);
+
+HiTableBody.propTypes = process.env.NODE_ENV !== "production" ? {
+  /**
+   * En-tête des données et leurs paramètres
+   */
+  columns: _propTypes.default.object.isRequired,
+
+  /**
+   * Données du tableau
+   */
+  data: _propTypes.default.array.isRequired,
+
+  /**
+   * Densité d'affichage (joue sur la hauteur des lignes)
+   */
+  dense: _propTypes.default.bool,
+
+  /**
+   * Locale pour afficher les nombres et montants
+   */
+  locale: _propTypes.default.string,
+
+  /**
+   * Fonction appelée au clic sur une ligne
+   */
+  onClick: _propTypes.default.func
+} : {};
+var _default = HiTableBody;
+exports.default = _default;

package/HiTable/HiTableHeader.js

@@ -0,0 +1,162 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _withStyles = _interopRequireDefault(require("../styles/withStyles"));
+
+var _TableCell = _interopRequireDefault(require("@material-ui/core/TableCell"));
+
+var _TableHead = _interopRequireDefault(require("@material-ui/core/TableHead"));
+
+var _TableRow = _interopRequireDefault(require("@material-ui/core/TableRow"));
+
+var _Tooltip = _interopRequireDefault(require("@material-ui/core/Tooltip"));
+
+var _TableSortLabel = _interopRequireDefault(require("@material-ui/core/TableSortLabel"));
+
+var cst = _interopRequireWildcard(require("./constants"));
+
+// @inheritedComponent TableHeader
+var styles = function styles(theme) {
+  return {
+    icon: {
+      color: '#00ADE9'
+    }
+  };
+};
+
+var HiTableHeader =
+/*#__PURE__*/
+function (_React$PureComponent) {
+  (0, _inherits2.default)(HiTableHeader, _React$PureComponent);
+
+  function HiTableHeader() {
+    var _getPrototypeOf2;
+
+    var _this;
+
+    (0, _classCallCheck2.default)(this, HiTableHeader);
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(HiTableHeader)).call.apply(_getPrototypeOf2, [this].concat(args)));
+
+    _this.createSortHandler = function (property) {
+      return function (event) {
+        _this.props.onRequestSort(event, property);
+      };
+    };
+
+    return _this;
+  }
+
+  (0, _createClass2.default)(HiTableHeader, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          classes = _this$props.classes,
+          columns = _this$props.columns,
+          order = _this$props.order,
+          orderBy = _this$props.orderBy,
+          sortable = _this$props.sortable,
+          dense = _this$props.dense;
+      return _react.default.createElement(_TableHead.default, null, _react.default.createElement(_TableRow.default, {
+        style: {
+          height: dense ? cst.CELL_HEADER_HEIGHT_DENSE : cst.CELL_HEADER_HEIGHT,
+          whiteSpace: 'nowrap'
+        }
+      }, Object.keys(columns).map(function (key) {
+        var column = columns[key];
+        return _react.default.createElement(_TableCell.default, {
+          key: column.colId,
+          sortDirection: orderBy === column.colId ? order : false,
+          style: {
+            border: 'none',
+            borderBottom: orderBy === column.colId ? 'solid 1px #00ADE9' : 'none',
+            paddingRight: '13px',
+            paddingLeft: '13px'
+          },
+          numeric: !!cst.ALIGN_RIGHT_TYPES.includes(column.type)
+        }, sortable ? _react.default.createElement(_Tooltip.default, {
+          title: "Sort",
+          enterDelay: 300
+        }, _react.default.createElement(_TableSortLabel.default, {
+          active: orderBy === column.colId,
+          direction: order,
+          onClick: this.createSortHandler(column.colId),
+          classes: {
+            icon: classes.icon
+          }
+        }, column.label)) : column.label);
+      }, this)));
+    }
+  }]);
+  return HiTableHeader;
+}(_react.default.PureComponent);
+
+HiTableHeader.propTypes = process.env.NODE_ENV !== "production" ? {
+  /**
+   * Surcharge les classes du composant
+   */
+  classes: _propTypes.default.object,
+
+  /**
+   * En-tête des données et leurs paramètres
+   */
+  columns: _propTypes.default.object.isRequired,
+
+  /**
+   * Le tableau est-il triable ?
+   */
+  dense: _propTypes.default.bool,
+
+  /**
+   * Fonction d'appel du trie des données
+   */
+  onRequestSort: _propTypes.default.func.isRequired,
+
+  /**
+   * Sens du tri
+   */
+  order: _propTypes.default.oneOf(['asc', 'desc']),
+
+  /**
+   * Id de la colonne trié
+   */
+  orderBy: _propTypes.default.string,
+
+  /**
+   * Densité d'affichage (joue sur la hauteur des lignes)
+   */
+  sortable: _propTypes.default.bool
+} : {};
+
+var _default = (0, _withStyles.default)(styles, {
+  hiComponent: true,
+  name: 'HmuiHiTableHeader'
+})(HiTableHeader);
+
+exports.default = _default;

package/HiTable/HiTableRow.js

@@ -0,0 +1,154 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.styles = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _withStyles = _interopRequireDefault(require("../styles/withStyles"));
+
+var _TableRow = _interopRequireDefault(require("@material-ui/core/TableRow"));
+
+var _HiCellBuilder = _interopRequireDefault(require("./HiCellBuilder"));
+
+var cst = _interopRequireWildcard(require("./constants"));
+
+// @inheritedComponent TableRow
+var styles = function styles(theme) {
+  return {
+    row: {
+      '&:last-child': {
+        borderBottom: 'solid 1px #E4E7E8'
+      },
+      '&:first-child': {
+        borderTop: 'solid 1px #E4E7E8'
+      },
+      '&:hover': {
+        backgroundColor: "".concat(theme.palette.action.hover, " !important")
+      }
+    }
+  };
+};
+
+exports.styles = styles;
+
+var HiTableRow =
+/*#__PURE__*/
+function (_React$PureComponent) {
+  (0, _inherits2.default)(HiTableRow, _React$PureComponent);
+
+  function HiTableRow(props) {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, HiTableRow);
+    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiTableRow).call(this, props));
+    _this.handleClick = _this.handleClick.bind((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)));
+    return _this;
+  }
+
+  (0, _createClass2.default)(HiTableRow, [{
+    key: "handleClick",
+    value: function handleClick(event, rowdata) {
+      if (this.props.onClick) {
+        this.props.onClick(event, rowdata);
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+
+      var _this$props = this.props,
+          classes = _this$props.classes,
+          columns = _this$props.columns,
+          dense = _this$props.dense,
+          key = _this$props.key,
+          locale = _this$props.locale,
+          rowdata = _this$props.rowdata;
+      return _react.default.createElement(_TableRow.default, {
+        className: classes.row,
+        hover: true,
+        onClick: function onClick(event) {
+          return _this2.handleClick(event, rowdata);
+        },
+        key: key,
+        style: {
+          height: dense ? cst.CELL_HEIGHT_DENSE : cst.CELL_HEIGHT
+        },
+        tabIndex: -1
+      }, Object.keys(columns).map(function (key) {
+        return _react.default.createElement(_HiCellBuilder.default, {
+          key: columns[key].colId,
+          column: columns[key],
+          data: rowdata,
+          locale: locale
+        });
+      }, this));
+    }
+  }]);
+  return HiTableRow;
+}(_react.default.PureComponent);
+
+HiTableRow.propTypes = process.env.NODE_ENV !== "production" ? {
+  /**
+   * Surcharge les classes du composant
+   */
+  classes: _propTypes.default.object,
+
+  /**
+   * En-tête des colonnes et leurs paramètres
+   */
+  columns: _propTypes.default.object.isRequired,
+
+  /**
+   * Densité d'affichage (joue sur la hauteur des lignes)
+   */
+  dense: _propTypes.default.bool,
+
+  /**
+   * Id de la ligne
+   */
+  key: _propTypes.default.string,
+
+  /**
+   * Locale pour afficher les nombres et montants
+   */
+  locale: _propTypes.default.string,
+
+  /**
+   * Action au clic sur une ligne
+   */
+  onClick: _propTypes.default.func,
+
+  /**
+   * Données de la ligne
+   */
+  rowdata: _propTypes.default.object.isRequired
+} : {};
+
+var _default = (0, _withStyles.default)(styles, {
+  hiComponent: true,
+  name: 'HmuiHiTableRow'
+})(HiTableRow);
+
+exports.default = _default;

package/HiTable/constants.js

@@ -0,0 +1,145 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ALIGN_RIGHT_TYPES = exports.DEFAULT_PADDING = exports.DEFAULT_VIEWS = exports.DEFAULT_WIDTHS = exports.FRAUD_RESULT_ASK_AUTHENTICATE = exports.FRAUD_RESULT_FORCE_AUTHENTICATE = exports.FRAUD_RESULT_PENDING = exports.FRAUD_RESULT_CHALLENGED = exports.FRAUD_RESULT_BLOCKED = exports.FRAUD_RESULT_ACCEPTED = exports.ELLIPSIS_RIGHT = exports.ELLIPSIS_NAME = exports.ELLIPSIS_MIDDLE = exports.ELLIPSIS_LEFT = exports.ELLIPSIS_AFTER_FIRST_WORD = exports.NO_EVOLUTION = exports.EVOLUTION_DOWN = exports.EVOLUTION_UP = exports.VIEWS = exports.TYPE_PIN_TO_ACTION = exports.TYPE_THIRD_PARTY_SECURITY = exports.TYPE_TEXT = exports.TYPE_COUNTRY = exports.TYPE_STATUS = exports.TYPE_SENTINEL = exports.TYPE_RATE = exports.TYPE_NUMERIC = exports.TYPE_IMAGE = exports.TYPE_ICON = exports.TYPE_DATE = exports.TYPE_CHECKBOX = exports.TYPE_ADDRESS = exports.TYPE_ACCOUNT_NUMBER = exports.TYPE_ACCOUNT = exports.CELL_HEADER_HEIGHT_DENSE = exports.CELL_HEADER_HEIGHT = exports.CELL_HEIGHT_DENSE = exports.CELL_HEIGHT = exports.NB_ROWS_BACK_TO_TOP = exports.MAX_ROWS = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _TYPE_ACCOUNT, _TYPE_ACCOUNT_NUMBER, _TYPE_ADDRESS, _TYPE_CHECKBOX, _TYPE_COUNTRY, _TYPE_DATE, _TYPE_ICON, _TYPE_IMAGE, _TYPE_NUMERIC, _TYPE_RATE, _TYPE_SENTINEL, _TYPE_STATUS, _TYPE_TEXT, _TYPE_THIRD_PARTY_SEC, _DEFAULT_WIDTHS, _DEFAULT_VIEWS, _DEFAULT_PADDING;
+
+/**
+ * Infinite scroll variables
+ */
+var MAX_ROWS = 50;
+exports.MAX_ROWS = MAX_ROWS;
+var NB_ROWS_BACK_TO_TOP = 10;
+/**
+ * Cell height (px)
+ */
+
+exports.NB_ROWS_BACK_TO_TOP = NB_ROWS_BACK_TO_TOP;
+var CELL_HEIGHT = 40;
+exports.CELL_HEIGHT = CELL_HEIGHT;
+var CELL_HEIGHT_DENSE = 32;
+exports.CELL_HEIGHT_DENSE = CELL_HEIGHT_DENSE;
+var CELL_HEADER_HEIGHT = 48;
+exports.CELL_HEADER_HEIGHT = CELL_HEADER_HEIGHT;
+var CELL_HEADER_HEIGHT_DENSE = 40;
+/**
+ * Cell types
+ * @type {string}
+ */
+
+exports.CELL_HEADER_HEIGHT_DENSE = CELL_HEADER_HEIGHT_DENSE;
+var TYPE_ACCOUNT = 'account';
+exports.TYPE_ACCOUNT = TYPE_ACCOUNT;
+var TYPE_ACCOUNT_NUMBER = 'account_number';
+exports.TYPE_ACCOUNT_NUMBER = TYPE_ACCOUNT_NUMBER;
+var TYPE_ADDRESS = 'address';
+exports.TYPE_ADDRESS = TYPE_ADDRESS;
+var TYPE_CHECKBOX = 'checkbox';
+exports.TYPE_CHECKBOX = TYPE_CHECKBOX;
+var TYPE_DATE = 'date';
+exports.TYPE_DATE = TYPE_DATE;
+var TYPE_ICON = 'icon';
+exports.TYPE_ICON = TYPE_ICON;
+var TYPE_IMAGE = 'image';
+exports.TYPE_IMAGE = TYPE_IMAGE;
+var TYPE_NUMERIC = 'numeric';
+exports.TYPE_NUMERIC = TYPE_NUMERIC;
+var TYPE_RATE = 'rate';
+exports.TYPE_RATE = TYPE_RATE;
+var TYPE_SENTINEL = 'sentinel';
+exports.TYPE_SENTINEL = TYPE_SENTINEL;
+var TYPE_STATUS = 'status';
+exports.TYPE_STATUS = TYPE_STATUS;
+var TYPE_COUNTRY = 'country';
+exports.TYPE_COUNTRY = TYPE_COUNTRY;
+var TYPE_TEXT = 'text';
+exports.TYPE_TEXT = TYPE_TEXT;
+var TYPE_THIRD_PARTY_SECURITY = 'third_party_security';
+exports.TYPE_THIRD_PARTY_SECURITY = TYPE_THIRD_PARTY_SECURITY;
+var TYPE_PIN_TO_ACTION = 'pin_to_action';
+/**
+ * Cell size [L] / [M] / [S]
+ */
+
+exports.TYPE_PIN_TO_ACTION = TYPE_PIN_TO_ACTION;
+var VIEWS = {
+  LARGE: 'l',
+  MEDIUM: 'm',
+  SMALL: 's'
+};
+/**
+ * Trendchip evolution
+ */
+
+exports.VIEWS = VIEWS;
+var EVOLUTION_UP = 'up';
+exports.EVOLUTION_UP = EVOLUTION_UP;
+var EVOLUTION_DOWN = 'down';
+exports.EVOLUTION_DOWN = EVOLUTION_DOWN;
+var NO_EVOLUTION = 'equal';
+/**
+ * Ellipsis
+ */
+
+exports.NO_EVOLUTION = NO_EVOLUTION;
+var ELLIPSIS_AFTER_FIRST_WORD = 'after-first-word';
+exports.ELLIPSIS_AFTER_FIRST_WORD = ELLIPSIS_AFTER_FIRST_WORD;
+var ELLIPSIS_LEFT = 'left';
+exports.ELLIPSIS_LEFT = ELLIPSIS_LEFT;
+var ELLIPSIS_MIDDLE = 'middle';
+exports.ELLIPSIS_MIDDLE = ELLIPSIS_MIDDLE;
+var ELLIPSIS_NAME = 'name';
+exports.ELLIPSIS_NAME = ELLIPSIS_NAME;
+var ELLIPSIS_RIGHT = 'right';
+/**
+ * Fraud Result
+ */
+
+exports.ELLIPSIS_RIGHT = ELLIPSIS_RIGHT;
+var FRAUD_RESULT_ACCEPTED = 'ACCEPTED';
+exports.FRAUD_RESULT_ACCEPTED = FRAUD_RESULT_ACCEPTED;
+var FRAUD_RESULT_BLOCKED = 'BLOCKED';
+exports.FRAUD_RESULT_BLOCKED = FRAUD_RESULT_BLOCKED;
+var FRAUD_RESULT_CHALLENGED = 'CHALLENGED';
+exports.FRAUD_RESULT_CHALLENGED = FRAUD_RESULT_CHALLENGED;
+var FRAUD_RESULT_PENDING = 'PENDING';
+exports.FRAUD_RESULT_PENDING = FRAUD_RESULT_PENDING;
+var FRAUD_RESULT_FORCE_AUTHENTICATE = 'FORCE_AUTHENTICATE';
+exports.FRAUD_RESULT_FORCE_AUTHENTICATE = FRAUD_RESULT_FORCE_AUTHENTICATE;
+var FRAUD_RESULT_ASK_AUTHENTICATE = 'ASK_AUTHENTICATE';
+/**
+ * Cell default width for each views
+ * @type {{}}
+ */
+
+exports.FRAUD_RESULT_ASK_AUTHENTICATE = FRAUD_RESULT_ASK_AUTHENTICATE;
+var DEFAULT_WIDTHS = (_DEFAULT_WIDTHS = {}, (0, _defineProperty2.default)(_DEFAULT_WIDTHS, TYPE_ACCOUNT, (_TYPE_ACCOUNT = {}, (0, _defineProperty2.default)(_TYPE_ACCOUNT, VIEWS.LARGE, 160), (0, _defineProperty2.default)(_TYPE_ACCOUNT, VIEWS.MEDIUM, 120), (0, _defineProperty2.default)(_TYPE_ACCOUNT, VIEWS.SMALL, 80), _TYPE_ACCOUNT)), (0, _defineProperty2.default)(_DEFAULT_WIDTHS, TYPE_ACCOUNT_NUMBER, (_TYPE_ACCOUNT_NUMBER = {}, (0, _defineProperty2.default)(_TYPE_ACCOUNT_NUMBER, VIEWS.LARGE, 100), (0, _defineProperty2.default)(_TYPE_ACCOUNT_NUMBER, VIEWS.MEDIUM, 80), (0, _defineProperty2.default)(_TYPE_ACCOUNT_NUMBER, VIEWS.SMALL, 60), _TYPE_ACCOUNT_NUMBER)), (0, _defineProperty2.default)(_DEFAULT_WIDTHS, TYPE_ADDRESS, (_TYPE_ADDRESS = {}, (0, _defineProperty2.default)(_TYPE_ADDRESS, VIEWS.LARGE, 120), (0, _defineProperty2.default)(_TYPE_ADDRESS, VIEWS.MEDIUM, 100), (0, _defineProperty2.default)(_TYPE_ADDRESS, VIEWS.SMALL, 80), _TYPE_ADDRESS)), (0, _defineProperty2.default)(_DEFAULT_WIDTHS, TYPE_CHECKBOX, (_TYPE_CHECKBOX = {}, (0, _defineProperty2.default)(_TYPE_CHECKBOX, VIEWS.LARGE, 40), (0, _defineProperty2.default)(_TYPE_CHECKBOX, VIEWS.MEDIUM, 40), (0, _defineProperty2.default)(_TYPE_CHECKBOX, VIEWS.SMALL, 40), _TYPE_CHECKBOX)), (0, _defineProperty2.default)(_DEFAULT_WIDTHS, TYPE_COUNTRY, (_TYPE_COUNTRY = {}, (0, _defineProperty2.default)(_TYPE_COUNTRY, VIEWS.LARGE, 120), (0, _defineProperty2.default)(_TYPE_COUNTRY, VIEWS.MEDIUM, 80), (0, _defineProperty2.default)(_TYPE_COUNTRY, VIEWS.SMALL, 40), _TYPE_COUNTRY)), (0, _defineProperty2.default)(_DEFAULT_WIDTHS, TYPE_DATE, (_TYPE_DATE = {}, (0, _defineProperty2.default)(_TYPE_DATE, VIEWS.LARGE, 220), (0, _defineProperty2.default)(_TYPE_DATE, VIEWS.MEDIUM, 140), (0, _defineProperty2.default)(_TYPE_DATE, VIEWS.SMALL, 120), _TYPE_DATE)), (0, _defineProperty2.default)(_DEFAULT_WIDTHS, TYPE_ICON, (_TYPE_ICON = {}, (0, _defineProperty2.default)(_TYPE_ICON, VIEWS.LARGE, 140), (0, _defineProperty2.default)(_TYPE_ICON, VIEWS.MEDIUM, 100), (0, _defineProperty2.default)(_TYPE_ICON, VIEWS.SMALL, 60), _TYPE_ICON)), (0, _defineProperty2.default)(_DEFAULT_WIDTHS, TYPE_IMAGE, (_TYPE_IMAGE = {}, (0, _defineProperty2.default)(_TYPE_IMAGE, VIEWS.LARGE, 140), (0, _defineProperty2.default)(_TYPE_IMAGE, VIEWS.MEDIUM, 100), (0, _defineProperty2.default)(_TYPE_IMAGE, VIEWS.SMALL, 60), _TYPE_IMAGE)), (0, _defineProperty2.default)(_DEFAULT_WIDTHS, TYPE_NUMERIC, (_TYPE_NUMERIC = {}, (0, _defineProperty2.default)(_TYPE_NUMERIC, VIEWS.LARGE, 120), (0, _defineProperty2.default)(_TYPE_NUMERIC, VIEWS.MEDIUM, 100), (0, _defineProperty2.default)(_TYPE_NUMERIC, VIEWS.SMALL, 80), _TYPE_NUMERIC)), (0, _defineProperty2.default)(_DEFAULT_WIDTHS, TYPE_RATE, (_TYPE_RATE = {}, (0, _defineProperty2.default)(_TYPE_RATE, VIEWS.LARGE, 100), (0, _defineProperty2.default)(_TYPE_RATE, VIEWS.MEDIUM, 90), (0, _defineProperty2.default)(_TYPE_RATE, VIEWS.SMALL, 80), _TYPE_RATE)), (0, _defineProperty2.default)(_DEFAULT_WIDTHS, TYPE_SENTINEL, (_TYPE_SENTINEL = {}, (0, _defineProperty2.default)(_TYPE_SENTINEL, VIEWS.LARGE, 80), (0, _defineProperty2.default)(_TYPE_SENTINEL, VIEWS.MEDIUM, 80), (0, _defineProperty2.default)(_TYPE_SENTINEL, VIEWS.SMALL, 80), _TYPE_SENTINEL)), (0, _defineProperty2.default)(_DEFAULT_WIDTHS, TYPE_STATUS, (_TYPE_STATUS = {}, (0, _defineProperty2.default)(_TYPE_STATUS, VIEWS.LARGE, 120), (0, _defineProperty2.default)(_TYPE_STATUS, VIEWS.MEDIUM, 100), (0, _defineProperty2.default)(_TYPE_STATUS, VIEWS.SMALL, 80), _TYPE_STATUS)), (0, _defineProperty2.default)(_DEFAULT_WIDTHS, TYPE_TEXT, (_TYPE_TEXT = {}, (0, _defineProperty2.default)(_TYPE_TEXT, VIEWS.LARGE, 200), (0, _defineProperty2.default)(_TYPE_TEXT, VIEWS.MEDIUM, 120), (0, _defineProperty2.default)(_TYPE_TEXT, VIEWS.SMALL, 80), _TYPE_TEXT)), (0, _defineProperty2.default)(_DEFAULT_WIDTHS, TYPE_THIRD_PARTY_SECURITY, (_TYPE_THIRD_PARTY_SEC = {}, (0, _defineProperty2.default)(_TYPE_THIRD_PARTY_SEC, VIEWS.LARGE, 40), (0, _defineProperty2.default)(_TYPE_THIRD_PARTY_SEC, VIEWS.MEDIUM, 40), (0, _defineProperty2.default)(_TYPE_THIRD_PARTY_SEC, VIEWS.SMALL, 40), _TYPE_THIRD_PARTY_SEC)), _DEFAULT_WIDTHS);
+/**
+ * Cell default width for each views
+ * @type {{}}
+ */
+
+exports.DEFAULT_WIDTHS = DEFAULT_WIDTHS;
+var DEFAULT_VIEWS = (_DEFAULT_VIEWS = {}, (0, _defineProperty2.default)(_DEFAULT_VIEWS, TYPE_ACCOUNT, VIEWS.LARGE), (0, _defineProperty2.default)(_DEFAULT_VIEWS, TYPE_ACCOUNT_NUMBER, VIEWS.LARGE), (0, _defineProperty2.default)(_DEFAULT_VIEWS, TYPE_ADDRESS, VIEWS.LARGE), (0, _defineProperty2.default)(_DEFAULT_VIEWS, TYPE_CHECKBOX, VIEWS.LARGE), (0, _defineProperty2.default)(_DEFAULT_VIEWS, TYPE_COUNTRY, VIEWS.LARGE), (0, _defineProperty2.default)(_DEFAULT_VIEWS, TYPE_DATE, VIEWS.LARGE), (0, _defineProperty2.default)(_DEFAULT_VIEWS, TYPE_ICON, VIEWS.LARGE), (0, _defineProperty2.default)(_DEFAULT_VIEWS, TYPE_IMAGE, VIEWS.LARGE), (0, _defineProperty2.default)(_DEFAULT_VIEWS, TYPE_NUMERIC, VIEWS.LARGE), (0, _defineProperty2.default)(_DEFAULT_VIEWS, TYPE_RATE, VIEWS.LARGE), (0, _defineProperty2.default)(_DEFAULT_VIEWS, TYPE_SENTINEL, VIEWS.LARGE), (0, _defineProperty2.default)(_DEFAULT_VIEWS, TYPE_STATUS, VIEWS.LARGE), (0, _defineProperty2.default)(_DEFAULT_VIEWS, TYPE_TEXT, VIEWS.LARGE), (0, _defineProperty2.default)(_DEFAULT_VIEWS, TYPE_THIRD_PARTY_SECURITY, VIEWS.LARGE), _DEFAULT_VIEWS);
+/**
+ * Cell default side padding (one side) for each views
+ * @type {{}}
+ */
+
+exports.DEFAULT_VIEWS = DEFAULT_VIEWS;
+var DEFAULT_PADDING = (_DEFAULT_PADDING = {}, (0, _defineProperty2.default)(_DEFAULT_PADDING, VIEWS.LARGE, 8), (0, _defineProperty2.default)(_DEFAULT_PADDING, VIEWS.MEDIUM, 8), (0, _defineProperty2.default)(_DEFAULT_PADDING, VIEWS.SMALL, 8), _DEFAULT_PADDING);
+/**
+ * Cell types which are align right by default
+ * @type {*[]}
+ */
+
+exports.DEFAULT_PADDING = DEFAULT_PADDING;
+var ALIGN_RIGHT_TYPES = [TYPE_NUMERIC, TYPE_RATE, TYPE_SENTINEL];
+exports.ALIGN_RIGHT_TYPES = ALIGN_RIGHT_TYPES;

package/HiTable/index.js

@@ -0,0 +1,15 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _HiTable.default;
+  }
+});
+
+var _HiTable = _interopRequireDefault(require("./HiTable"));

package/es/HiCell/CellIcon.js

@@ -29,17 +29,20 @@ class CellIcon extends React.PureComponent {
       color,
       icon,
       label,
-      view
+      view,
+      size
     } = this.props;
     return React.createElement("div", {
       className: classes.wrapper,
       title: label
     }, icon && React.createElement(HiIcon, {
-      color: color,
+      color: "inherit",
+      style: {
+        color: color,
+        fontSize: size ? size : 24
+      },
       className: classes.icon,
-      icon: icon,
-      width: 40,
-      height: 24
+      icon: icon
     }), view !== 's' && label && React.createElement("span", {
       className: classes.label
     }, label));
@@ -76,7 +79,12 @@ CellIcon.propTypes = process.env.NODE_ENV !== "production" ? {
   /**
    * View (L/M/S)
    */
-  view: PropTypes.oneOf(['l', 'm', 's'])
+  view: PropTypes.oneOf(['l', 'm', 's']),
+
+  /**
+   * Icon size
+   */
+  size: PropTypes.number
 } : {};
 export default withStyles(styles, {
   name: 'HmuiCellIcon'

package/es/HiCell/CellNumeric.js

@@ -30,7 +30,7 @@ class CellNumeric extends React.PureComponent {
       title = formatCurrencyAmount(value, 'l', locale, currency);
     } else {
       displayedValue = formatNumber(value, view, locale, precision);
-      title = formatNumber(value, 'l', locale);
+      title = formatNumber(value, 'l', locale, precision);
     }
 
     return React.createElement("div", {
@@ -42,7 +42,8 @@ class CellNumeric extends React.PureComponent {
 }
 
 CellNumeric.defaultProps = {
-  view: 'm'
+  view: 'm',
+  locale: 'en'
 };
 CellNumeric.propTypes = process.env.NODE_ENV !== "production" ? {
   /**

package/es/HiCell/CellRate.js

@@ -99,7 +99,8 @@ class CellRate extends React.PureComponent {
 }
 
 CellRate.defaultProps = {
-  isPositive: true
+  isPositive: true,
+  locale: 'en'
 };
 CellRate.propTypes = process.env.NODE_ENV !== "production" ? {
   /**

package/es/HiCell/CellSentinel.js

@@ -69,7 +69,8 @@ class CellSentinel extends React.PureComponent {
     const scoreLabel = score > 0 ? `+${score}` : `${score}`;
     return React.createElement("div", {
       style: {
-        textAlign: 'right'
+        textAlign: 'right',
+        minWidth: '100px'
       }
     }, React.createElement(HiColoredLabel, {
       label: scoreLabel,

package/es/HiChip/HiChip.js

@@ -116,9 +116,17 @@ function HiChip(props) {
       [classes.leftIcon]: icon
     }),
     title: title
-  }, prefix && React.createElement("span", {
+  }, icon && React.createElement(HiIcon, {
+    className: classNames(classes.icon, {
+      [classes.iconClickable]: onIconClick
+    }),
+    icon: icon,
+    size: iconSize,
+    onClick: onIconClick,
+    title: titleIcon
+  }), prefix && React.createElement("span", {
     className: classes.prefix
-  }, prefix, " : "), img && React.createElement("img", {
+  }, prefix), img && React.createElement("img", {
     className: classes.badge,
     src: img,
     alt: img,
@@ -130,14 +138,6 @@ function HiChip(props) {
       }
     },
     title: titleImg
-  }), icon && React.createElement(HiIcon, {
-    className: classNames(classes.icon, {
-      [classes.iconClickable]: onIconClick
-    }),
-    icon: icon,
-    size: iconSize,
-    onClick: onIconClick,
-    title: titleIcon
   }), onPrevious && React.createElement(HiIcon, {
     className: classNames(classes.navigate),
     icon: "arrow_left",