@hipay/hipay-material-ui 2.0.0-beta.52 → 2.0.0-beta.54

package/HiDatePicker/HiDateRangeSelector.js

@@ -38,11 +38,12 @@ var _Grid = _interopRequireDefault(require("@material-ui/core/Grid"));
 
 var _withStyles = _interopRequireDefault(require("../styles/withStyles"));
 
-var _HiSelectField = _interopRequireDefault(require("../HiSelect/HiSelectField"));
+var _HiSelectField = _interopRequireDefault(require("../HiSelectNew/HiSelectField"));
 
 var _HiDateRangePicker = _interopRequireDefault(require("./HiDateRangePicker"));
 
-// @inheritedComponent HiDateRangePicker
+var _HiFormControl = _interopRequireDefault(require("../HiForm/HiFormControl"));
+
 function buildDateRangeOptionByKey(key, t, format) {
   var from;
   var label;
@@ -59,6 +60,8 @@ function buildDateRangeOptionByKey(key, t, format) {
   switch (key) {
     case 'custom':
       label = t.custom_period;
+      from = (0, _moment.default)().subtract(15, 'day').startOf('day');
+      to = (0, _moment.default)().endOf('day');
       type = 'primary-highlight';
       break;
 
@@ -94,35 +97,35 @@ function buildDateRangeOptionByKey(key, t, format) {
       label = t.current_month;
       from = (0, _moment.default)().startOf('month');
       to = (0, _moment.default)();
-      info = "".concat(from.format(format), " ").concat(t.to_now, ", ").concat(to.diff(from, 'days'), " ").concat(t.days);
+      info = "".concat(from.format(format), " ").concat(t.to_now, ", ").concat(to.diff(from, 'days') + 1, " ").concat(t.days);
       break;
 
     case 'pm':
       label = t.previous_month;
       from = (0, _moment.default)().subtract(1, 'month').startOf('month');
       to = (0, _moment.default)().subtract(1, 'month').endOf('month');
-      info = "".concat(from.format('YYYY-MM'), ", ").concat(to.diff(from, 'days'), " ").concat(t.days);
+      info = "".concat(from.format(t.yearAndMonth), ", ").concat(from.daysInMonth(), " ").concat(t.days);
       break;
 
     case 'cq':
       label = t.current_quarter;
       from = (0, _moment.default)().startOf('quarter');
       to = (0, _moment.default)();
-      info = "".concat(from.format(format), " ").concat(t.to_now, ", ").concat(to.diff(from, 'days'), " ").concat(t.days);
+      info = "".concat(from.format(t.yearAndQuarter), ", ").concat(from.format(format), " ").concat(t.to_now, ", ").concat(to.diff(from, 'days') + 1, " ").concat(t.days);
       break;
 
     case 'pq':
       label = t.previous_quarter;
       from = (0, _moment.default)().subtract(1, 'quarter').startOf('quarter');
       to = (0, _moment.default)().subtract(1, 'quarter').endOf('quarter');
-      info = "".concat(from.format('YYYY'), "-").concat(t.short_quarter).concat(from.format('Q'), ", ").concat(to.diff(from, 'days'), " ").concat(t.days);
+      info = "".concat(from.format(t.yearAndQuarter), ", ").concat(to.diff(from, 'days') + 1, " ").concat(t.days);
       break;
 
     case 'cy':
       label = t.current_year;
       from = (0, _moment.default)().startOf('year');
       to = (0, _moment.default)();
-      info = "".concat(from.format(format), " ").concat(t.to_now, ", ").concat(to.diff(from, 'days'), " ").concat(t.days);
+      info = "".concat(from.format(format), " ").concat(t.to_now, ", ").concat(to.diff(from, 'days') + 1, " ").concat(t.days);
       break;
 
     default:
@@ -172,25 +175,30 @@ function (_React$Component) {
     _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiDateRangeSelector).call(this));
     _this.options = [];
 
+    _this.onBlur = function (event) {
+      if (event instanceof Object && _this.props.onblur) {
+        _this.props.onBlur(event);
+      }
+    };
+
     _this.handleSelectChange = function (name) {
       return function (event, value) {
-        _this.setState((0, _defineProperty2.default)({}, name, value));
-
-        if (value !== 'custom') {
-          var selectedOption = _this.options.find(function (option) {
-            return option.id === value;
-          });
-
-          if (selectedOption) {
-            _this.props.onChange('from', selectedOption.from.toDate());
-
-            _this.props.onChange('to', selectedOption.to.toDate());
-          }
-        } else {
-          _this.setState({
-            defaultFrom: undefined,
-            defaultTo: undefined
-          });
+        var _this$setState;
+
+        _this.setState((_this$setState = {}, (0, _defineProperty2.default)(_this$setState, name, value), (0, _defineProperty2.default)(_this$setState, "key", _this.state.key === 1 ? 2 : 1), _this$setState));
+
+        var selectedOption = _this.options.find(function (option) {
+          return option.id === value;
+        });
+
+        if (selectedOption) {
+          _this.props.onChange('from', selectedOption.from.toDate());
+
+          _this.props.onChange('to', selectedOption.to.toDate());
+
+          _this.props.onChange('fromError', false);
+
+          _this.props.onChange('toError', false);
         }
 
         if (_this.props.returnSelectValue === true) {
@@ -204,25 +212,9 @@ function (_React$Component) {
     _this.options = props.availableOptionKeys.map(function (key) {
       return buildDateRangeOptionByKey(key, props.translations, props.format);
     });
-    var from;
-    var to;
-
-    if (props.defaultPreset !== 'custom') {
-      var selectedOption = _this.options.find(function (option) {
-        return option.id === props.defaultPreset;
-      });
-
-      if (selectedOption) {
-        from = selectedOption.from.toDate();
-        to = selectedOption.to.toDate();
-      }
-    }
-
     _this.state = {
       selectedPreset: props.defaultPreset,
-      containerWidth: 0,
-      defaultFrom: from,
-      defaultTo: to
+      containerWidth: 0
     };
     return _this;
   }
@@ -232,8 +224,9 @@ function (_React$Component) {
     value: function componentDidMount() {
       if (this.container) {
         this.setState({
-          containerWidth: (0, _reactDom.findDOMNode)(this.container).clientWidth
+          containerWidth: (0, _reactDom.findDOMNode)(this.container).clientWidth - 5
         });
+        this.handleSelectChange('selectedPreset')(undefined, this.state.selectedPreset);
       }
     }
   }, {
@@ -245,6 +238,7 @@ function (_React$Component) {
     key: "handleReset",
     value: function handleReset(name) {
       this.props.onChange(name, undefined);
+      this.props.onChange("".concat(name, "Error"), undefined);
     }
   }, {
     key: "render",
@@ -254,12 +248,14 @@ function (_React$Component) {
       var _this$props = this.props,
           disabled = _this$props.disabled,
           enableTime = _this$props.enableTime,
-          error = _this$props.error,
           errorText = _this$props.errorText,
+          fromError = _this$props.fromError,
+          toError = _this$props.toError,
           helperIcon = _this$props.helperIcon,
           helperText = _this$props.helperText,
           idRange = _this$props.idRange,
           idSelect = _this$props.idSelect,
+          minimumDate = _this$props.minimumDate,
           label = _this$props.label,
           from = _this$props.from,
           onChange = _this$props.onChange,
@@ -269,17 +265,24 @@ function (_React$Component) {
           classes = _this$props.classes,
           selectProps = _this$props.selectProps,
           staticPosition = _this$props.staticPosition,
-          props = (0, _objectWithoutProperties2.default)(_this$props, ["disabled", "enableTime", "error", "errorText", "helperIcon", "helperText", "idRange", "idSelect", "label", "from", "onChange", "required", "to", "translations", "classes", "selectProps", "staticPosition"]);
-      var _this$state = this.state,
-          defaultFrom = _this$state.defaultFrom,
-          defaultTo = _this$state.defaultTo,
-          selectedPreset = _this$state.selectedPreset;
-      return _react.default.createElement(_Grid.default, {
+          props = (0, _objectWithoutProperties2.default)(_this$props, ["disabled", "enableTime", "errorText", "fromError", "toError", "helperIcon", "helperText", "idRange", "idSelect", "minimumDate", "label", "from", "onChange", "required", "to", "translations", "classes", "selectProps", "staticPosition"]);
+      var selectedPreset = this.state.selectedPreset;
+      var hiSelectableListProps = {
+        hideCheckbox: true
+      };
+      return _react.default.createElement(_HiFormControl.default, {
+        disabled: disabled,
+        helperIcon: helperIcon,
+        helperText: helperText,
+        errorText: errorText,
+        error: !!(fromError || toError),
+        label: ' '
+      }, _react.default.createElement(_Grid.default, {
         container: true,
         spacing: 8,
         className: classes.root,
         ref: function ref(container) {
-          _this2.container = container;
+          return _this2.container = container;
         }
       }, _react.default.createElement(_Grid.default, {
         item: true,
@@ -290,12 +293,10 @@ function (_React$Component) {
         }
       }, _react.default.createElement(_HiSelectField.default, (0, _extends2.default)({
         disabled: disabled,
-        error: error,
-        errorText: errorText,
-        helperIcon: helperIcon,
-        helperText: helperText,
         id: idSelect,
         label: label,
+        hideCheckbox: true,
+        hiSelectableListProps: hiSelectableListProps,
         name: 'selectedPreset',
         options: this.options,
         onChange: this.handleSelectChange('selectedPreset'),
@@ -315,19 +316,26 @@ function (_React$Component) {
           'grid-sm-8': classes.smRangePicker
         }
       }, _react.default.createElement(_HiDateRangePicker.default, (0, _extends2.default)({
+        key: this.state.key,
         classes: {
           root: classes.dateRangePicker
         },
         id: idRange,
-        from: from || defaultFrom,
-        to: to || defaultTo,
+        from: from,
+        to: to,
         enableTime: enableTime,
         onChange: onChange,
+        toError: toError,
+        fromError: fromError,
+        minimumDate: minimumDate,
+        errorText: null,
         onReset: this.handleReset,
         disabled: disabled || selectedPreset !== 'custom',
         translations: translations,
-        staticPosition: staticPosition
-      }, props))));
+        staticPosition: staticPosition,
+        onBlur: this.onBlur,
+        hasSelector: true
+      }, props)))));
     }
   }], [{
     key: "getDerivedStateFromProps",
@@ -360,7 +368,8 @@ HiDateRangeSelector.defaultProps = {
     quarter: 'Quarter',
     week: 'Week',
     short_week: 'W',
-    short_quarter: 'Q',
+    yearAndMonth: 'YYYY[-]MM',
+    yearAndQuarter: 'YYYY[-Q]Q',
     year: 'Year',
     days: 'days',
     custom_period: 'Custom Period',
@@ -373,7 +382,13 @@ HiDateRangeSelector.defaultProps = {
     previous_month: 'Previous Month',
     current_quarter: 'Current Quarter',
     previous_quarter: 'Previous Quarter',
-    current_year: 'Current Year'
+    current_year: 'Current Year',
+    invalid_format: 'The date format is not valid',
+    to_superior_from: 'Date from cannot be greater than date to',
+    date_superior_max_date: 'Date from cannot be greater than %s',
+    date_inferior_min_date: 'Date from cannot be before than %s',
+    missing_date_from: 'Missing date from',
+    missing_date_to: 'Missing date to'
   }
 };
 HiDateRangeSelector.propTypes = process.env.NODE_ENV !== "production" ? {
@@ -410,7 +425,7 @@ HiDateRangeSelector.propTypes = process.env.NODE_ENV !== "production" ? {
   /**
    * Texte de l'erreur
    */
-  errorText: _propTypes.default.string,
+  errorText: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.bool]),
 
   /**
    * Format de date utilisé
@@ -452,6 +467,11 @@ HiDateRangeSelector.propTypes = process.env.NODE_ENV !== "production" ? {
    */
   locale: _propTypes.default.string,
 
+  /**
+   * Date minimale sélectionnable
+   */
+  minimumDate: _propTypes.default.instanceOf(Date).isRequired,
+
   /**
    * Callback à la sélection d'une date
    */

package/HiDatePicker/NavBar.js

@@ -35,7 +35,8 @@ var styles = function styles(theme) {
     button: {
       height: 32,
       width: 32,
-      margin: '4px 24px'
+      margin: '4px 24px',
+      padding: 0
     },
     left: {
       float: 'left'

package/HiDatePicker/Overlays/TimePickerOverlay.js

@@ -111,7 +111,7 @@ var styles = function styles(theme) {
       bottom: 0,
       height: 32,
       width: 32,
-      margin: '4px 24px'
+      margin: '0px 24px'
     },
     calendarButton: {
       fontWeight: theme.typography.fontWeightMedium

package/HiDatePicker/Overlays/YearPickerOverlay.js

@@ -95,8 +95,8 @@ function (_React$Component) {
 }(_react.default.Component);
 
 YearPickerOverlay.defaultProps = {
-  disableFutureDays: false,
-  disablePastDays: false,
+  // disableFutureDays: true,
+  // disablePastDays: false,
   minimumDate: new Date(2013, 4, 1),
   // by default 1 May 2013
   translations: {
@@ -132,7 +132,7 @@ YearPickerOverlay.propTypes = process.env.NODE_ENV !== "production" ? {
   /**
    * Date minimale sélectionnable
    */
-  minimumDate: _propTypes.default.instanceOf(Date),
+  minimumDate: _propTypes.default.instanceOf(Date).isRequired,
 
   /**
    * Fonction de callback

package/HiForm/HiFormControl.js

@@ -62,6 +62,7 @@ var styles = function styles(theme) {
       position: 'absolute',
       right: 5,
       cursor: 'pointer',
+      zIndex: 1,
       top: '-5px',
       '&$iconButtonError': {
         color: theme.palette.negative.main
@@ -247,7 +248,7 @@ function (_React$PureComponent) {
         required: required,
         disabled: disabled,
         focused: !disabled && (focused || hovered)
-      }, InputLabelProps), error && _react.default.createElement(_HiIconButton.default, {
+      }, InputLabelProps), error && errorText && _react.default.createElement(_HiIconButton.default, {
         className: (0, _classnames.default)(classes.iconButton, classes.iconButtonError),
         onClick: this.handleHelperClick,
         onKeyDown: this.handleKeyDown
@@ -279,8 +280,8 @@ HiFormControl.defaultProps = {
   required: true,
   disabled: false,
   error: false,
-  errorText: '',
-  helperText: '',
+  errorText: undefined,
+  helperText: undefined,
   helperIcon: false,
   multiline: false,
   nbChars: 0,
@@ -315,7 +316,7 @@ HiFormControl.propTypes = process.env.NODE_ENV !== "production" ? {
   /**
    * Texte de l'erreur
    */
-  errorText: _propTypes.default.string,
+  errorText: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.bool]),
 
   /**
    * Propriétés appliquées au composant FormHelperText

package/HiPin/HiPin.js

@@ -25,7 +25,7 @@ var styles = function styles(theme) {
       display: 'inline-block',
       padding: '0 9px',
       height: 16,
-      lineHeight: '18px',
+      lineHeight: '16px',
       minWidth: 25,
       textAlign: 'center',
       borderRadius: '45px',

package/HiSelectNew/HiSelect.js

@@ -501,7 +501,7 @@ function (_React$PureComponent) {
         }
       }
 
-      var popperClass = (0, _classnames.default)(classes.popper, (_classNames = {}, (0, _defineProperty2.default)(_classNames, classes.popperWidth, !this.props.containerWidth), (0, _defineProperty2.default)(_classNames, classes.popperRightAlign, this.props.containerWidth), _classNames));
+      var popperClass = (0, _classnames.default)(classes.popper, (_classNames = {}, (0, _defineProperty2.default)(_classNames, classes.popperWidth, !this.props.containerWidth), (0, _defineProperty2.default)(_classNames, classes.popperRightAlign, this.props.containerWidth && this.props.align === 'right'), _classNames));
 
       var content = _react.default.createElement(_ClickAwayListener.default, {
         onClickAway: this.handleClickAway
@@ -595,6 +595,7 @@ function (_React$PureComponent) {
 }(_react.default.PureComponent);
 
 HiSelect.defaultProps = {
+  align: 'left',
   disabled: false,
   displayAsChip: false,
   error: false,
@@ -617,6 +618,8 @@ HiSelect.defaultProps = {
   type: 'text'
 };
 HiSelect.propTypes = process.env.NODE_ENV !== "production" ? {
+  align: _propTypes.default.oneOf(['left', 'right']),
+
   /**
    * Useful to extend the style applied to components.
    */

package/HiSelectableList/HiSelectableListItem.js

@@ -261,6 +261,7 @@ function (_React$PureComponent) {
           fallbackImage = _this$props2.fallbackImage,
           hideCheckbox = _this$props2.hideCheckbox,
           onSelect = _this$props2.onSelect,
+          onKeyDown = _this$props2.onKeyDown,
           indeterminate = _this$props2.indeterminate,
           indeterminateIcon = _this$props2.indeterminateIcon,
           icon = _this$props2.icon,
@@ -306,12 +307,14 @@ function (_React$PureComponent) {
       }, disabled || {
         onClick: onSelect,
         onMouseEnter: this.setHover(true),
-        onMouseLeave: this.setHover(false)
+        onMouseLeave: this.setHover(false),
+        onKeyDown: onKeyDown
       }, {
         style: {
           paddingLeft: "".concat(paddingLeft + level * 32, "px")
         }
       }), !hideCheckbox && !pinned && _react.default.createElement(_HiCheckbox.default, {
+        tabIndex: onKeyDown ? '-1' : 0,
         checked: selected,
         checkedIcon: checkedIcon,
         classes: {
@@ -455,6 +458,11 @@ HiSelectableListItem.propTypes = process.env.NODE_ENV !== "production" ? {
    */
   onSelect: _propTypes.default.func,
 
+  /**
+   * Fonction de callback à la sélection de l'élément
+   */
+  onKeyDown: _propTypes.default.func,
+
   /**
    * Padding par défaut des éléments
    */

package/HiSwitch/HiSwitch.js

@@ -33,7 +33,8 @@ var styles = function styles(theme) {
       display: 'inline-flex',
       width: 62,
       position: 'relative',
-      flexShrink: 0
+      flexShrink: 0,
+      zIndex: 0
     },
     bar: {
       borderRadius: 7,

package/HiTable/HiCellBuilder.js

@@ -37,6 +37,8 @@ var _CellNumeric = _interopRequireDefault(require("@hipay/hipay-material-ui/HiCe
 
 var _CellSentinel = _interopRequireDefault(require("@hipay/hipay-material-ui/HiCell/CellSentinel"));
 
+var _CellSentinelScore = _interopRequireDefault(require("@hipay/hipay-material-ui/HiCell/CellSentinelScore"));
+
 var _CellText = _interopRequireDefault(require("@hipay/hipay-material-ui/HiCell/CellText"));
 
 var _CellRate = _interopRequireDefault(require("@hipay/hipay-material-ui/HiCell/CellRate"));
@@ -155,13 +157,18 @@ function (_React$PureComponent) {
 
             case cst.TYPE_SENTINEL:
               return _react.default.createElement(_CellSentinel.default, {
-                automaticFraudReviewResult: datacell.automaticFraudReviewResult,
-                fraudResult: datacell.value,
-                hideFraudResult: datacell.hideFraudResult,
-                pendingManualAction: datacell.pendingManualAction,
-                score: datacell.score,
-                smartDecision: datacell.smartDecision,
-                view: cell.view ? cell.view : cst.DEFAULT_VIEWS[cell.type]
+                color: datacell.color,
+                label: datacell.label,
+                letter: datacell.label2,
+                active: datacell.active,
+                reviewer: datacell.reviewer,
+                outlined: datacell.outlined
+              });
+
+            case cst.TYPE_SENTINEL_SCORE:
+              return _react.default.createElement(_CellSentinelScore.default, {
+                value: datacell.value,
+                result: datacell.result
               });
 
             case cst.TYPE_PIN_TO_ACTION:

package/HiTable/constants.js

@@ -5,11 +5,11 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 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;
+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_SCORE = 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;
+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_SENTINEL_SCORE, _TYPE_STATUS, _TYPE_TEXT, _TYPE_THIRD_PARTY_SEC, _DEFAULT_WIDTHS, _DEFAULT_VIEWS, _DEFAULT_PADDING;
 
 /**
  * Infinite scroll variables
@@ -55,6 +55,8 @@ var TYPE_RATE = 'rate';
 exports.TYPE_RATE = TYPE_RATE;
 var TYPE_SENTINEL = 'sentinel';
 exports.TYPE_SENTINEL = TYPE_SENTINEL;
+var TYPE_SENTINEL_SCORE = 'sentinel_score';
+exports.TYPE_SENTINEL_SCORE = TYPE_SENTINEL_SCORE;
 var TYPE_STATUS = 'status';
 exports.TYPE_STATUS = TYPE_STATUS;
 var TYPE_COUNTRY = 'country';
@@ -120,14 +122,14 @@ var FRAUD_RESULT_ASK_AUTHENTICATE = 'ASK_AUTHENTICATE';
  */
 
 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);
+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, 64), (0, _defineProperty2.default)(_TYPE_SENTINEL, VIEWS.MEDIUM, 64), (0, _defineProperty2.default)(_TYPE_SENTINEL, VIEWS.SMALL, 64), _TYPE_SENTINEL)), (0, _defineProperty2.default)(_DEFAULT_WIDTHS, TYPE_SENTINEL_SCORE, (_TYPE_SENTINEL_SCORE = {}, (0, _defineProperty2.default)(_TYPE_SENTINEL_SCORE, VIEWS.LARGE, 80), (0, _defineProperty2.default)(_TYPE_SENTINEL_SCORE, VIEWS.MEDIUM, 80), (0, _defineProperty2.default)(_TYPE_SENTINEL_SCORE, VIEWS.SMALL, 80), _TYPE_SENTINEL_SCORE)), (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);
+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_SENTINEL_SCORE, 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 {{}}
@@ -141,5 +143,5 @@ var DEFAULT_PADDING = (_DEFAULT_PADDING = {}, (0, _defineProperty2.default)(_DEF
  */
 
 exports.DEFAULT_PADDING = DEFAULT_PADDING;
-var ALIGN_RIGHT_TYPES = [TYPE_NUMERIC, TYPE_RATE, TYPE_SENTINEL];
+var ALIGN_RIGHT_TYPES = [TYPE_NUMERIC, TYPE_RATE, TYPE_SENTINEL, TYPE_SENTINEL_SCORE];
 exports.ALIGN_RIGHT_TYPES = ALIGN_RIGHT_TYPES;