@hipay/hipay-material-ui 1.0.0-beta.25 → 1.0.0-beta.27

package/HI-CHANGELOG.md

@@ -1,3 +1,76 @@
+<a name="1.0.0-beta.27"></a>
+# 1.0.0-beta.27 (2018-08-27)
+
+
+### Bug Fixes
+
+* **BodyRow:** add locale vars to child BodyRow ([9252382](https://gitlab.hipay.org/backend/hipay-material-ui/commit/9252382))
+* **CellDate:** Handle date with moment & use prop format ([7fa8bf5](https://gitlab.hipay.org/backend/hipay-material-ui/commit/7fa8bf5))
+* **HeaderCell:** set sort icons always on the right of the title ([0704619](https://gitlab.hipay.org/backend/hipay-material-ui/commit/0704619))
+* **HiDateRangePicker:** Keep focus on change dateTo if user types directly into the input to see date selection into calendar ([e998c60](https://gitlab.hipay.org/backend/hipay-material-ui/commit/e998c60))
+* **HiDateRangePicker:** Reset date range picker input to ([b1a66f3](https://gitlab.hipay.org/backend/hipay-material-ui/commit/b1a66f3))
+* **HiDateRangeSelector:** UPD select value from parent component (defaultPreset property) ([90bb994](https://gitlab.hipay.org/backend/hipay-material-ui/commit/90bb994))
+* **HiFormControl:** add error on disabled fields ([87ef0b6](https://gitlab.hipay.org/backend/hipay-material-ui/commit/87ef0b6))
+* **HiInput:** Keep focus on reset HiInput ([a84edab](https://gitlab.hipay.org/backend/hipay-material-ui/commit/a84edab))
+* **HiPins:** Add theme business primary color as default background color for HiPins and fix line-height  ([23aa2d9](https://gitlab.hipay.org/backend/hipay-material-ui/commit/23aa2d9))
+* **HiSelect:** add dynamic prop to handle dynamic select with initial options ([c668b90](https://gitlab.hipay.org/backend/hipay-material-ui/commit/c668b90))
+* **HiSelect:** Display option label instead of all for selects with 1 option ([e47574a](https://gitlab.hipay.org/backend/hipay-material-ui/commit/e47574a))
+* **HiSelect:** Don't try to display unique selected options item when still loading ([116a72a](https://gitlab.hipay.org/backend/hipay-material-ui/commit/116a72a))
+* **HiSelect:** Enable to handle hierarchic padding via options prop level ([dc4e5d8](https://gitlab.hipay.org/backend/hipay-material-ui/commit/dc4e5d8))
+* **HiSelect:** Handle unique and undefined selected item ([8dbb542](https://gitlab.hipay.org/backend/hipay-material-ui/commit/8dbb542))
+* **HiSelectableList:** item displayed only if item.displayed != false ([e65b865](https://gitlab.hipay.org/backend/hipay-material-ui/commit/e65b865))
+* **HiTable:** Add default translations object to HeaderCell ([4ed766f](https://gitlab.hipay.org/backend/hipay-material-ui/commit/4ed766f))
+* **HiTable:** Performance optimization ([3ca60d3](https://gitlab.hipay.org/backend/hipay-material-ui/commit/3ca60d3))
+* **HiTable:** remove anchorEls from state to remove circular structure in JSON compares ([c064ce9](https://gitlab.hipay.org/backend/hipay-material-ui/commit/c064ce9))
+* **SelectInput:** selected choice label not overflowing on right arrow of HiSelect ([a7d7058](https://gitlab.hipay.org/backend/hipay-material-ui/commit/a7d7058))
+
+
+### Features
+
+* **CellText:** add color props ([ff2bba8](https://gitlab.hipay.org/backend/hipay-material-ui/commit/ff2bba8))
+* **HiChip:** enable to display tooltip on HiChip via the prop 'title' ([6b15ca6](https://gitlab.hipay.org/backend/hipay-material-ui/commit/6b15ca6))
+* **HiDateRangePicker:** Add onBlur prop function to handle date errors properly ([df79494](https://gitlab.hipay.org/backend/hipay-material-ui/commit/df79494))
+* **HiTableContextMenu:** handle hide lookup/exclude menu item for each column ([03e00cb](https://gitlab.hipay.org/backend/hipay-material-ui/commit/03e00cb))
+* **workflow:** Add HI-CHANGELOG generation from commits ([edee0f6](https://gitlab.hipay.org/backend/hipay-material-ui/commit/edee0f6))
+
+
+
+<a name="1.0.0-beta.26"></a>
+# 1.0.0-beta.26 (2018-08-24)
+
+
+### Bug Fixes
+
+* **BodyRow:** add locale vars to child BodyRow ([9252382](https://gitlab.hipay.org/backend/hipay-material-ui/commit/9252382))
+* **CellDate:** Handle date with moment & use prop format ([7fa8bf5](https://gitlab.hipay.org/backend/hipay-material-ui/commit/7fa8bf5))
+* **HeaderCell:** set sort icons always on the right of the title ([0704619](https://gitlab.hipay.org/backend/hipay-material-ui/commit/0704619))
+* **HiDateRangePicker:** Keep focus on change dateTo if user types directly into the input to see date selection into calendar ([e998c60](https://gitlab.hipay.org/backend/hipay-material-ui/commit/e998c60))
+* **HiDateRangePicker:** Reset date range picker input to ([b1a66f3](https://gitlab.hipay.org/backend/hipay-material-ui/commit/b1a66f3))
+* **HiDateRangeSelector:** UPD select value from parent component (defaultPreset property) ([90bb994](https://gitlab.hipay.org/backend/hipay-material-ui/commit/90bb994))
+* **HiInput:** Keep focus on reset HiInput ([a84edab](https://gitlab.hipay.org/backend/hipay-material-ui/commit/a84edab))
+* **HiPins:** Add theme business primary color as default background color for HiPins and fix line-height  ([23aa2d9](https://gitlab.hipay.org/backend/hipay-material-ui/commit/23aa2d9))
+* **HiSelect:** add dynamic prop to handle dynamic select with initial options ([c668b90](https://gitlab.hipay.org/backend/hipay-material-ui/commit/c668b90))
+* **HiSelect:** Display option label instead of all for selects with 1 option ([e47574a](https://gitlab.hipay.org/backend/hipay-material-ui/commit/e47574a))
+* **HiSelect:** Don't try to display unique selected options item when still loading ([116a72a](https://gitlab.hipay.org/backend/hipay-material-ui/commit/116a72a))
+* **HiSelect:** Enable to handle hierarchic padding via options prop level ([dc4e5d8](https://gitlab.hipay.org/backend/hipay-material-ui/commit/dc4e5d8))
+* **HiSelect:** Handle unique and undefined selected item ([8dbb542](https://gitlab.hipay.org/backend/hipay-material-ui/commit/8dbb542))
+* **HiSelectableList:** item displayed only if item.displayed != false ([e65b865](https://gitlab.hipay.org/backend/hipay-material-ui/commit/e65b865))
+* **HiTable:** Add default translations object to HeaderCell ([4ed766f](https://gitlab.hipay.org/backend/hipay-material-ui/commit/4ed766f))
+* **HiTable:** Performance optimization ([3ca60d3](https://gitlab.hipay.org/backend/hipay-material-ui/commit/3ca60d3))
+* **HiTable:** remove anchorEls from state to remove circular structure in JSON compares ([c064ce9](https://gitlab.hipay.org/backend/hipay-material-ui/commit/c064ce9))
+* **SelectInput:** selected choice label not overflowing on right arrow of HiSelect ([a7d7058](https://gitlab.hipay.org/backend/hipay-material-ui/commit/a7d7058))
+
+
+### Features
+
+* **CellText:** add color props ([ff2bba8](https://gitlab.hipay.org/backend/hipay-material-ui/commit/ff2bba8))
+* **HiChip:** enable to display tooltip on HiChip via the prop 'title' ([6b15ca6](https://gitlab.hipay.org/backend/hipay-material-ui/commit/6b15ca6))
+* **HiDateRangePicker:** Add onBlur prop function to handle date errors properly ([df79494](https://gitlab.hipay.org/backend/hipay-material-ui/commit/df79494))
+* **HiTableContextMenu:** handle hide lookup/exclude menu item for each column ([03e00cb](https://gitlab.hipay.org/backend/hipay-material-ui/commit/03e00cb))
+* **workflow:** Add HI-CHANGELOG generation from commits ([edee0f6](https://gitlab.hipay.org/backend/hipay-material-ui/commit/edee0f6))
+
+
+
 <a name="1.0.0-beta.25"></a>
 # 1.0.0-beta.25 (2018-08-16)
 

package/HiChip/HiChip.js

@@ -132,6 +132,7 @@ function HiChip(props) {
         onDelete = props.onDelete,
         prefix = props.prefix,
         onIconClick = props.onIconClick,
+        title = props.title,
         titleDelete = props.titleDelete,
         titleIcon = props.titleIcon,
         titleImg = props.titleImg,
@@ -143,7 +144,8 @@ function HiChip(props) {
         'div',
         {
             id: id,
-            className: (0, _classnames2.default)(classes.root, (_classNames = {}, (0, _defineProperty3.default)(_classNames, classes.leftNavigation, onPrevious), (0, _defineProperty3.default)(_classNames, classes.rightNavigation, onNext), (0, _defineProperty3.default)(_classNames, classes.deletable, onDelete), (0, _defineProperty3.default)(_classNames, classes.leftIccon, icon), _classNames))
+            className: (0, _classnames2.default)(classes.root, (_classNames = {}, (0, _defineProperty3.default)(_classNames, classes.leftNavigation, onPrevious), (0, _defineProperty3.default)(_classNames, classes.rightNavigation, onNext), (0, _defineProperty3.default)(_classNames, classes.deletable, onDelete), (0, _defineProperty3.default)(_classNames, classes.leftIccon, icon), _classNames)),
+            title: title
         },
         prefix && _react2.default.createElement(
             'span',
@@ -157,14 +159,14 @@ function HiChip(props) {
             icon: icon,
             size: 16,
             onClick: onIconClick,
-            titleAccess: titleIcon
+            title: titleIcon
         }),
         onPrevious && _react2.default.createElement(_HiIconBuilder2.default, {
             className: (0, _classnames2.default)(classes.navigate),
             icon: 'menuLeft',
             onClick: onPrevious,
             size: 16,
-            titleAccess: titlePrevious
+            title: titlePrevious
         }),
         _react2.default.createElement(
             'span',
@@ -176,14 +178,14 @@ function HiChip(props) {
             icon: 'menuRight',
             onClick: onNext,
             size: 16,
-            titleAccess: titleNext
+            title: titleNext
         }),
         onDelete && _react2.default.createElement(_HiIconBuilder2.default, {
             classes: { root: classes.eraseIcon },
             icon: 'closeCircle',
             onClick: onDelete,
             size: 16,
-            titleAccess: titleDelete
+            title: titleDelete
         })
     );
 }
@@ -229,6 +231,10 @@ HiChip.propTypes = process.env.NODE_ENV !== "production" ? {
      * Préfixe dans le HiChip
      */
     prefix: _propTypes2.default.string,
+    /**
+     * Titre du chip
+     */
+    title: _propTypes2.default.string,
     /**
      * Titre de l'icône supprimer
      */

package/HiForm/HiFormControl.js

@@ -223,7 +223,7 @@ var HiFormControl = function (_React$PureComponent) {
                     error: error,
                     ref: rootRef
                 }, others),
-                !disabled && error && errorText && helperOpen && _react2.default.createElement(
+                error && errorText && helperOpen && _react2.default.createElement(
                     'div',
                     { className: classes.errorDiv },
                     _react2.default.createElement('div', {
@@ -231,7 +231,7 @@ var HiFormControl = function (_React$PureComponent) {
                     }),
                     errorText
                 ),
-                !disabled && helperIcon && helperText && !error && helperOpen && _react2.default.createElement(
+                helperIcon && helperText && !error && helperOpen && _react2.default.createElement(
                     'div',
                     {
                         className: classes.helperDiv
@@ -254,11 +254,11 @@ var HiFormControl = function (_React$PureComponent) {
                         disabled: disabled,
                         focused: !disabled && (focused || hovered)
                     }, InputLabelProps),
-                    !disabled && error && _react2.default.createElement(_mdiMaterialUi.Alert, {
+                    error && _react2.default.createElement(_mdiMaterialUi.Alert, {
                         className: classes.errorIcon,
                         onClick: this.handleHelperClick
                     }),
-                    !disabled && helperIcon && helperText && !error && _react2.default.createElement(_mdiMaterialUi.Information, {
+                    helperIcon && helperText && !error && _react2.default.createElement(_mdiMaterialUi.Information, {
                         className: (0, _classnames2.default)(classes.helperIcon, (0, _defineProperty3.default)({}, classes.helperIconActive, helperOpen)),
                         onClick: this.handleHelperClick
                     })

package/HiSelect/HiSelect.js

@@ -162,7 +162,7 @@ var HiSelect = function (_React$PureComponent) {
             hierarchySelected: {},
             hierarchy: {},
             nbOptions: 0,
-            dynamic: false
+            dynamic: props.dynamic || false
         };
 
         // Check if value is in options
@@ -205,7 +205,7 @@ var HiSelect = function (_React$PureComponent) {
                 }
             });
             _this.state.nbOptions = optionsLength;
-        } else {
+        } else if (!props.dynamic) {
             _this.state.dynamic = true;
         }
 
@@ -345,29 +345,28 @@ var HiSelect = function (_React$PureComponent) {
             }
 
             if ((dynamic || loading) && selectedIdList.length === 1) {
-                display = translations.one_item_selected.replace('%s', selectedIdList.length);
+                display = translations.one_item_selected;
             } else if ((this.state.nbOptions !== selectedIdList.length || !hasAll) && selectedIdList.length > 1) {
                 display = translations.n_items_selected.replace('%s', selectedIdList.length);
             } else if (this.state.nbOptions === selectedIdList.length && this.state.nbOptions > 1) {
                 display = translations.all;
             } else if (selectedIdList.length === 1) {
-                if (type !== 'icon') {
-                    var item = options.find(function (o) {
-                        return o.id === selectedIdList[0];
-                    });
-                    if (!item && pinnedItem) {
+                var item = options.find(function (o) {
+                    return o.id === selectedIdList[0];
+                });
+                if (item === undefined) {
+                    display = translations.one_item_selected;
+                } else if (type !== 'icon') {
+                    if (pinnedItem) {
                         item = pinnedItem;
                     }
                     display = item.label;
                 } else {
-                    var optionSelected = options.find(function (o) {
-                        return o.id === selectedIdList[0];
-                    });
                     display = _react2.default.createElement(
                         'span',
                         { className: classes.selectIconLabel },
-                        _react2.default.createElement(_HiIconBuilder2.default, { icon: optionSelected.icon, className: classes.labelIcon }),
-                        optionSelected.label
+                        _react2.default.createElement(_HiIconBuilder2.default, { icon: item.icon, className: classes.labelIcon }),
+                        item.label
                     );
                 }
             }
@@ -501,6 +500,7 @@ HiSelect.defaultProps = {
     hierarchic: false,
     parentItemSelectable: false,
     displayAsChip: false,
+    dynamic: false,
     icon: _react2.default.createElement(_mdiMaterialUi.CheckboxBlankOutline, { style: { width: 20, height: 20 } }),
     parentIcon: _react2.default.createElement(_mdiMaterialUi.CheckboxBlankOutline, { style: { width: 20, height: 20 } }),
     hoverIcon: _react2.default.createElement(_mdiMaterialUi.CheckboxBlankOutline, { style: { width: 20, height: 20 } }),
@@ -524,9 +524,9 @@ var _initialiseProps = function _initialiseProps() {
         if (_this3.state.open) {
             _this3.handleClose();
         } else {
-            if (!_this3.props.staticPosition) {
-                //document.body.style.overflow = 'hidden';
-            }
+            /*if (!this.props.staticPosition) {
+                // document.body.style.overflow = 'hidden';
+            }*/
             _this3.setState({ open: true });
             var options = _this3.props.options.slice();
             _this3.handleSuggestions(options);
@@ -588,9 +588,11 @@ var _initialiseProps = function _initialiseProps() {
         } else if (event.key === 'ArrowUp') {
             nextItem = (0, _hiHelpers.getNextItemSelectable)(document.activeElement, 'up');
         } else if (event.key === 'Tab') {
-            if (!_this3.props.staticPosition) {
-                //document.body.style.overflow = 'auto';
-            }
+            /* if (!this.props.staticPosition) {
+                document.body.style.overflow = 'auto';
+            } */
+            _this3.setState({ open: false });
+        } else if (event.key === 'Escape') {
             _this3.setState({ open: false });
         }
         if (nextItem) {
@@ -743,9 +745,9 @@ var _initialiseProps = function _initialiseProps() {
                 }
             }
             _this3.setState({ hierarchySelected: hiSelected });
-            onChange(event, valueList);
+            onChange(event, valueList, item);
         } else {
-            onChange(event, item.id);
+            onChange(event, item.id, item);
             _this3.handleClose();
         }
     };
@@ -820,6 +822,12 @@ HiSelect.propTypes = process.env.NODE_ENV !== "production" ? {
      * Option permettant d'afficher les sélection sous forme de Chip.
      */
     displayAsChip: _propTypes2.default.bool,
+    /**
+     * Option permettant de définir si les options du select sont dynamiques.
+     * Si les options du select sont initialisées à vide, alors ce sera mis à true
+     * automatiquement.
+     */
+    dynamic: _propTypes2.default.bool.isRequired,
     /**
      * Applique le style error
      */

package/HiSelectableList/HiSelectableList.js

@@ -163,7 +163,7 @@ var HiSelectableList = function (_React$PureComponent) {
                                 hoverIcon: hoverIcon,
                                 checkedIcon: checkedIcon,
                                 checkbox: checkbox,
-                                level: parents.length,
+                                level: item.level ? item.level : parents.length,
                                 disabled: disabledIds ? disabledIds.includes(item.id) : false
                             }, others));
                         }

package/HiSelectableList/HiSelectableListItem.js

@@ -398,7 +398,7 @@ var HiSelectableListItem = function (_React$Component) {
 
             if (leftPadding) {
                 paddingLeft = leftPadding;
-            } else if (!hierarchic) {
+            } else if (!hierarchic && level === 0) {
                 // Si pas de hiérarchie et sans checkbox, padding de 8px
                 if (!effectiveCheckbox) {
                     paddingLeft = 8;
@@ -415,9 +415,9 @@ var HiSelectableListItem = function (_React$Component) {
                     }
                 } else if (level > 0) {
                     if (effectiveCheckbox) {
-                        paddingLeft = 16 * (level - 1);
-                    } else {
                         paddingLeft = 16 * level;
+                    } else {
+                        paddingLeft = 16 * (level + 1);
                     }
                 } else if (!effectiveCheckbox) {
                     if (item.id === '_all') {

package/HiTable/BodyCellBuilder.js

@@ -299,10 +299,11 @@ var BodyCellBuilder = function (_React$Component) {
                     default:
                         cellElement = _react2.default.createElement(_BodyCells.CellText, {
                             ukey: ukey,
-                            value: data.value,
+                            value: data.label ? data.label : data.value,
                             ellipsis: ellipsis,
                             view: view,
-                            sticky: sticky
+                            sticky: sticky,
+                            color: data.color
                         });
                         break;
                 }

package/HiTable/BodyCells/CellAccount.js

@@ -3,7 +3,6 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-exports.styles = undefined;
 
 var _stringify = require('babel-runtime/core-js/json/stringify');
 
@@ -45,21 +44,11 @@ var _HiColoredLabel = require('../../HiColoredLabel');
 
 var _HiColoredLabel2 = _interopRequireDefault(_HiColoredLabel);
 
-var _withStyles = require('../../styles/withStyles');
-
-var _withStyles2 = _interopRequireDefault(_withStyles);
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var styles = exports.styles = function styles(theme) {
-    return {};
-};
-
 /**
  * Cette cellule permet d'afficher le nom d'un compte sous la forme d'un label coloré.
  */
-
-
 var CellAccount = function (_React$Component) {
     (0, _inherits3.default)(CellAccount, _React$Component);
 
@@ -106,4 +95,4 @@ CellAccount.propTypes = process.env.NODE_ENV !== "production" ? {
      */
     value: _propTypes2.default.string.isRequired
 } : {};
-exports.default = (0, _withStyles2.default)(styles, { name: 'HmuiCellAccount' })(CellAccount);
+exports.default = CellAccount;

package/HiTable/BodyCells/CellDate.js

@@ -59,16 +59,14 @@ function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj;
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var styles = exports.styles = function styles(theme) {
-    return {
-        rightEllipsisSpan: {
-            display: 'inline-block',
-            overflow: 'hidden',
-            textOverflow: 'ellipsis',
-            whiteSpace: 'pre',
-            width: '100%'
-        }
-    };
+var styles = exports.styles = {
+    rightEllipsisSpan: {
+        display: 'inline-block',
+        overflow: 'hidden',
+        textOverflow: 'ellipsis',
+        whiteSpace: 'pre',
+        width: '100%'
+    }
 };
 
 /**
@@ -110,9 +108,9 @@ var CellDate = function (_React$Component) {
 
 
             var date = (0, _moment2.default)(value);
-            _moment2.default.locale(locale);
+            date.locale(locale);
 
-            var titleValue = displayTime ? date.format(this.formatLong) : date.format(this.formatLong.replace('HH:mm:ss', ''));
+            var titleValue = displayTime ? date.format(this.formatLong) : date.format(this.formatLong.replace(' HH:mm:ss', ''));
             var displayedValue = titleValue;
             if (view === cst.VIEWS.SMALL) {
                 displayedValue = displayTime ? date.format(formatShort.replace('YYYY', 'YY') + ' HH:mm:ss') : date.format(formatShort.replace('YYYY', 'YY'));
@@ -166,6 +164,11 @@ CellDate.propTypes = process.env.NODE_ENV !== "production" ? {
      * Locale moment
      */
     locale: _propTypes2.default.string,
+    /**
+     * True si la colonne est la première colonne et
+     * doit avoir un comportement "sticky" lors du scroll horizontal
+     */
+    sticky: _propTypes2.default.bool,
     /**
      * Date as string
      */

package/HiTable/BodyCells/CellRate.js

@@ -82,8 +82,8 @@ var styles = exports.styles = function styles(theme) {
         negative: {
             color: theme.palette.negative.normal
         },
-        middle: {
-            color: theme.palette.middle.normal
+        neutral: {
+            color: theme.palette.neutral.normal
         },
         spanIndicator: {
             fontSize: 11,
@@ -136,7 +136,7 @@ var CellRate = function (_React$Component) {
 
             switch (trendchip) {
                 case cst.NO_EVOLUTION:
-                    trendIcon = _react2.default.createElement(_mdiMaterialUi.Equal, { className: classes.trendChipIcon + ' ' + classes.middle });
+                    trendIcon = _react2.default.createElement(_mdiMaterialUi.Equal, { className: classes.trendChipIcon + ' ' + classes.neutral });
                     break;
                 case cst.EVOLUTION_UP:
                     trendIcon = _react2.default.createElement(_mdiMaterialUi.ArrowTopRight, {