@hipay/hipay-material-ui 2.0.0-beta.57 → 2.0.0-beta.59

package/CHANGELOG.md

@@ -1,3 +1,120 @@
+<a name="2.0.0-beta.59"></a>
+# [2.0.0-beta.59](https://gitlab.hipay.org/backend/hipay-material-ui/compare/0.0.1...2.0.0-beta.59) (2018-12-27)
+
+
+### Bug Fixes
+
+* **eslint:** remove eslint warrnings in components (ignore test files) ([d236c62](https://gitlab.hipay.org/backend/hipay-material-ui/commit/d236c62))
+* **HiBreadcrumb:** clean eslint warnings ([6db12fb](https://gitlab.hipay.org/backend/hipay-material-ui/commit/6db12fb))
+* **HiDatePicker:** add static positions for custom overlays ([c3edf24](https://gitlab.hipay.org/backend/hipay-material-ui/commit/c3edf24))
+* **HiExpansionPanel:** Fix props type a requirement ([cbc3b48](https://gitlab.hipay.org/backend/hipay-material-ui/commit/cbc3b48))
+* **HiInput:** handle focus state through prop when needed to override default comportment ([9a133cc](https://gitlab.hipay.org/backend/hipay-material-ui/commit/9a133cc))
+* **HiKpiNotice:** eslint clean warnings ([11b5552](https://gitlab.hipay.org/backend/hipay-material-ui/commit/11b5552))
+* **HiSelect:** Fix build of HiSelectContent ([4b87f78](https://gitlab.hipay.org/backend/hipay-material-ui/commit/4b87f78))
+* **HiSelect:** focus on undefined item ([2d084e6](https://gitlab.hipay.org/backend/hipay-material-ui/commit/2d084e6))
+* **HiSelect:** handle staticPosition & width properly for HiDateRangeSelector usage ([7b19ffb](https://gitlab.hipay.org/backend/hipay-material-ui/commit/7b19ffb))
+* **HiSelectableListItem:** disabled item checkbox color ([9f10552](https://gitlab.hipay.org/backend/hipay-material-ui/commit/9f10552))
+* **HiSelectableListItem:** remove item width ([a913945](https://gitlab.hipay.org/backend/hipay-material-ui/commit/a913945))
+* **HiSelectContent:** Remove compute of input value ([b86db83](https://gitlab.hipay.org/backend/hipay-material-ui/commit/b86db83))
+* **HiSlider:** eslint clean warnings ([08964b1](https://gitlab.hipay.org/backend/hipay-material-ui/commit/08964b1))
+* **HiUploadField:** clean eslint warnings ([c76aaf1](https://gitlab.hipay.org/backend/hipay-material-ui/commit/c76aaf1))
+* **migration:** fix contrast threshold ... ([6fb3b18](https://gitlab.hipay.org/backend/hipay-material-ui/commit/6fb3b18))
+* **package:** add cross-env ([7098fd6](https://gitlab.hipay.org/backend/hipay-material-ui/commit/7098fd6))
+
+
+### Features
+
+* **CellImage:** Handle fallbackImage ([254799d](https://gitlab.hipay.org/backend/hipay-material-ui/commit/254799d))
+* **CellSentinel:** Uniformize cell api with front CellSentinel ([4e2975b](https://gitlab.hipay.org/backend/hipay-material-ui/commit/4e2975b))
+* **CellSentinel:** Update CellSentinel to the new way (split each result in different column) ([efe2711](https://gitlab.hipay.org/backend/hipay-material-ui/commit/efe2711))
+* **CellSentinelScore:** Add CellSentinelScore ([2fff04d](https://gitlab.hipay.org/backend/hipay-material-ui/commit/2fff04d))
+* **CellText:** Handle active prop in CellText & column views in HiTable ([4366e60](https://gitlab.hipay.org/backend/hipay-material-ui/commit/4366e60))
+* **HiCells:** Add simple cells types (Address, Date, Icon, Image, Numeric, PinToAction, Rate, Senti ([f688517](https://gitlab.hipay.org/backend/hipay-material-ui/commit/f688517))
+* **HiDatePicker:** BREAKING CHANGE - add local prop to handle calendar translations ([b1b3743](https://gitlab.hipay.org/backend/hipay-material-ui/commit/b1b3743))
+* **HiIcon:** Add mdi-material-ui as available icons via 'mdi_' prefix ([1091d6d](https://gitlab.hipay.org/backend/hipay-material-ui/commit/1091d6d))
+* **HiMap:** unregister fetch on unmount ([0afa931](https://gitlab.hipay.org/backend/hipay-material-ui/commit/0afa931))
+* **HiSelect:** Add (NEW) HiSelect, HiNestedSelect, HiDynamicSelect ([4c6447e](https://gitlab.hipay.org/backend/hipay-material-ui/commit/4c6447e))
+* **HiSelect:** Reset search input on blur & on close ([d9af584](https://gitlab.hipay.org/backend/hipay-material-ui/commit/d9af584))
+* **HiSelectableList:** Add sort props to sort item list on label ([f412ddc](https://gitlab.hipay.org/backend/hipay-material-ui/commit/f412ddc))
+* **HiSelectContent:** Add new HiSelectContent & HiNestedSelectContent ([215ad8f](https://gitlab.hipay.org/backend/hipay-material-ui/commit/215ad8f))
+* **HiSelectContent:** export utils functions ([7c41d87](https://gitlab.hipay.org/backend/hipay-material-ui/commit/7c41d87))
+* **HiUploadField:** rename component HiUploadField ([593f77e](https://gitlab.hipay.org/backend/hipay-material-ui/commit/593f77e))
+* **notice:** Création notice KPI ([bba3f89](https://gitlab.hipay.org/backend/hipay-material-ui/commit/bba3f89))
+
+
+### Performance Improvements
+
+* **PureFunction:** Use pure & functional components ([220c686](https://gitlab.hipay.org/backend/hipay-material-ui/commit/220c686))
+
+
+### BREAKING CHANGES
+
+* **HiDatePicker:** Required "local" props (use polyglot, p.currentLocal)
+* **HiUploadField:** Components names changes
+* **HiCells:** Remove CellCountry, CellThirdParty, CellStatus & CellAccount (use generic type
+CellImage & CellText)
+* **HiSelect:** HiSelect API change, use HiNestedSelect or HiDynamicSelect relative to situation
+
+
+
+# [2.0.0-beta.58](https://gitlab.hipay.org/backend/hipay-material-ui/compare/0.0.1...2.0.0-beta.58) (2018-12-13)
+
+
+### Bug Fixes
+
+* **eslint:** remove eslint warrnings in components (ignore test files) ([d236c62](https://gitlab.hipay.org/backend/hipay-material-ui/commit/d236c62))
+* **HiBreadcrumb:** clean eslint warnings ([6db12fb](https://gitlab.hipay.org/backend/hipay-material-ui/commit/6db12fb))
+* **HiDatePicker:** add static positions for custom overlays ([c3edf24](https://gitlab.hipay.org/backend/hipay-material-ui/commit/c3edf24))
+* **HiExpansionPanel:** Fix props type a requirement ([cbc3b48](https://gitlab.hipay.org/backend/hipay-material-ui/commit/cbc3b48))
+* **HiInput:** handle focus state through prop when needed to override default comportment ([9a133cc](https://gitlab.hipay.org/backend/hipay-material-ui/commit/9a133cc))
+* **HiKpiNotice:** eslint clean warnings ([11b5552](https://gitlab.hipay.org/backend/hipay-material-ui/commit/11b5552))
+* **HiSelect:** Fix build of HiSelectContent ([4b87f78](https://gitlab.hipay.org/backend/hipay-material-ui/commit/4b87f78))
+* **HiSelect:** focus on undefined item ([2d084e6](https://gitlab.hipay.org/backend/hipay-material-ui/commit/2d084e6))
+* **HiSelect:** handle staticPosition & width properly for HiDateRangeSelector usage ([7b19ffb](https://gitlab.hipay.org/backend/hipay-material-ui/commit/7b19ffb))
+* **HiSelectableListItem:** disabled item checkbox color ([9f10552](https://gitlab.hipay.org/backend/hipay-material-ui/commit/9f10552))
+* **HiSelectableListItem:** remove item width ([a913945](https://gitlab.hipay.org/backend/hipay-material-ui/commit/a913945))
+* **HiSelectContent:** Remove compute of input value ([b86db83](https://gitlab.hipay.org/backend/hipay-material-ui/commit/b86db83))
+* **HiSlider:** eslint clean warnings ([08964b1](https://gitlab.hipay.org/backend/hipay-material-ui/commit/08964b1))
+* **HiUploadField:** clean eslint warnings ([c76aaf1](https://gitlab.hipay.org/backend/hipay-material-ui/commit/c76aaf1))
+* **migration:** fix contrast threshold ... ([6fb3b18](https://gitlab.hipay.org/backend/hipay-material-ui/commit/6fb3b18))
+* **package:** add cross-env ([7098fd6](https://gitlab.hipay.org/backend/hipay-material-ui/commit/7098fd6))
+
+
+### Features
+
+* **CellImage:** Handle fallbackImage ([254799d](https://gitlab.hipay.org/backend/hipay-material-ui/commit/254799d))
+* **CellSentinel:** Uniformize cell api with front CellSentinel ([4e2975b](https://gitlab.hipay.org/backend/hipay-material-ui/commit/4e2975b))
+* **CellSentinel:** Update CellSentinel to the new way (split each result in different column) ([efe2711](https://gitlab.hipay.org/backend/hipay-material-ui/commit/efe2711))
+* **CellSentinelScore:** Add CellSentinelScore ([2fff04d](https://gitlab.hipay.org/backend/hipay-material-ui/commit/2fff04d))
+* **CellText:** Handle active prop in CellText & column views in HiTable ([4366e60](https://gitlab.hipay.org/backend/hipay-material-ui/commit/4366e60))
+* **HiCells:** Add simple cells types (Address, Date, Icon, Image, Numeric, PinToAction, Rate, Senti ([f688517](https://gitlab.hipay.org/backend/hipay-material-ui/commit/f688517))
+* **HiDatePicker:** BREAKING CHANGE - add local prop to handle calendar translations ([b1b3743](https://gitlab.hipay.org/backend/hipay-material-ui/commit/b1b3743))
+* **HiIcon:** Add mdi-material-ui as available icons via 'mdi_' prefix ([1091d6d](https://gitlab.hipay.org/backend/hipay-material-ui/commit/1091d6d))
+* **HiMap:** unregister fetch on unmount ([0afa931](https://gitlab.hipay.org/backend/hipay-material-ui/commit/0afa931))
+* **HiSelect:** Add (NEW) HiSelect, HiNestedSelect, HiDynamicSelect ([4c6447e](https://gitlab.hipay.org/backend/hipay-material-ui/commit/4c6447e))
+* **HiSelect:** Reset search input on blur & on close ([d9af584](https://gitlab.hipay.org/backend/hipay-material-ui/commit/d9af584))
+* **HiSelectableList:** Add sort props to sort item list on label ([f412ddc](https://gitlab.hipay.org/backend/hipay-material-ui/commit/f412ddc))
+* **HiSelectContent:** Add new HiSelectContent & HiNestedSelectContent ([215ad8f](https://gitlab.hipay.org/backend/hipay-material-ui/commit/215ad8f))
+* **HiSelectContent:** export utils functions ([7c41d87](https://gitlab.hipay.org/backend/hipay-material-ui/commit/7c41d87))
+* **HiUploadField:** rename component HiUploadField ([593f77e](https://gitlab.hipay.org/backend/hipay-material-ui/commit/593f77e))
+* **notice:** Création notice KPI ([bba3f89](https://gitlab.hipay.org/backend/hipay-material-ui/commit/bba3f89))
+
+
+### Performance Improvements
+
+* **PureFunction:** Use pure & functional components ([220c686](https://gitlab.hipay.org/backend/hipay-material-ui/commit/220c686))
+
+
+### BREAKING CHANGES
+
+* **HiDatePicker:** Required "local" props (use polyglot, p.currentLocal)
+* **HiUploadField:** Components names changes
+* **HiCells:** Remove CellCountry, CellThirdParty, CellStatus & CellAccount (use generic type
+CellImage & CellText)
+* **HiSelect:** HiSelect API change, use HiNestedSelect or HiDynamicSelect relative to situation
+
+
+
 <a name="2.0.0-beta.41"></a>
 # [2.0.0-beta.41](https://gitlab.hipay.org/backend/hipay-material-ui/compare/0.0.1...2.0.0-beta.41) (2018-12-07)
 

package/HiAlertModal/HiAlertModal.js

@@ -41,20 +41,28 @@ var _styles = require("../styles");
 
 var _HiButton = _interopRequireDefault(require("../HiButton"));
 
+var _HiIcon = _interopRequireDefault(require("../HiIcon"));
+
 // @inheritedComponent Dialog
 var styles = function styles(theme) {
   return {
     classContent: {
       fontSize: 14,
-      lineHeight: '24px',
-      color: '#484848'
+      lineHeight: '20px',
+      color: '#484848',
+      position: 'relative'
     },
-    classPaper: {
-      maxWidth: 300
+    classDialogPaper: {
+      minHeight: 280,
+      maxWidth: 280,
+      borderRadius: 2
     },
     classCancelButton: {
       float: 'right'
     },
+    classSubmitButton: {
+      margin: '0'
+    },
     classTitle: {
       fontSize: 20,
       fontFamily: theme.typography.fontFamily,
@@ -62,10 +70,20 @@ var styles = function styles(theme) {
       lineHeight: '24px'
     },
     classAction: {
-      display: 'inline-block'
+      display: 'inline-block',
+      margin: '0',
+      padding: '0px 24px 24px 24px'
     },
     classDialogRoot: {
       backgroundColor: 'rgba(0, 0, 0, 0.28)'
+    },
+    classBackgroundIcon: {
+      position: 'absolute',
+      top: 'calc(50%)',
+      left: '50%',
+      transform: 'translate(-50%, -50%)',
+      color: theme.palette.background2,
+      flex: '1'
     }
   };
 };
@@ -117,6 +135,8 @@ function (_React$PureComponent) {
     // Render
     value: function render() {
       var _this$props = this.props,
+          backgroundIcon = _this$props.backgroundIcon,
+          iconSize = _this$props.iconSize,
           classes = _this$props.classes,
           content = _this$props.content,
           labelCancelButton = _this$props.labelCancelButton,
@@ -124,17 +144,23 @@ function (_React$PureComponent) {
           onCancelClick = _this$props.onCancelClick,
           onSubmitClick = _this$props.onSubmitClick,
           open = _this$props.open,
+          cancelColor = _this$props.cancelColor,
           submitColor = _this$props.submitColor,
           title = _this$props.title,
-          props = (0, _objectWithoutProperties2.default)(_this$props, ["classes", "content", "labelCancelButton", "labelSubmitButton", "onCancelClick", "onSubmitClick", "open", "submitColor", "title"]);
+          props = (0, _objectWithoutProperties2.default)(_this$props, ["backgroundIcon", "iconSize", "classes", "content", "labelCancelButton", "labelSubmitButton", "onCancelClick", "onSubmitClick", "open", "cancelColor", "submitColor", "title"]);
       return _react.default.createElement(_Dialog.default, (0, _extends2.default)({
         open: open,
         onClose: this.handleOnClose,
         classes: {
-          paper: classes.classPaper,
-          root: classes.classDialogRoot
+          root: classes.classDialogRoot,
+          paper: classes.classDialogPaper
         }
-      }, props), _react.default.createElement(_DialogTitle.default, {
+      }, props), backgroundIcon && _react.default.createElement("div", {
+        className: classes.classBackgroundIcon
+      }, _react.default.createElement(_HiIcon.default, {
+        icon: backgroundIcon,
+        size: iconSize
+      })), _react.default.createElement(_DialogTitle.default, {
         disableTypography: true,
         classes: {
           root: classes.classTitle
@@ -147,22 +173,39 @@ function (_React$PureComponent) {
         classes: {
           root: classes.classAction
         }
-      }, _react.default.createElement(_HiButton.default, {
+      }, labelSubmitButton && _react.default.createElement(_HiButton.default, {
+        classes: {
+          root: classes.classSubmitButton
+        },
         onClick: this.handleClickSubmit,
         color: submitColor
-      }, labelSubmitButton), _react.default.createElement(_HiButton.default, {
+      }, labelSubmitButton), labelCancelButton && _react.default.createElement(_HiButton.default, {
         classes: {
           root: classes.classCancelButton
         },
         onClick: this.handleClickCancel,
-        color: "neutral"
+        color: cancelColor
       }, labelCancelButton)));
     }
   }]);
   return HiAlertModal;
 }(_react.default.PureComponent);
 
+HiAlertModal.defaultProps = {
+  cancelColor: 'neutral',
+  submitColor: 'primary'
+};
 HiAlertModal.propTypes = process.env.NODE_ENV !== "production" ? {
+  /**
+   * Icon à mettre en fond
+   */
+  backgroundIcon: _propTypes.default.string,
+
+  /**
+   * The color of the cancel button. It supports those theme colors that make sense for this component.
+   */
+  cancelColor: _propTypes.default.oneOf(['default', 'inherit', 'primary', 'secondary', 'positive', 'negative', 'middle', 'neutral']),
+
   /**
    * Surcharge les classes du composant
    */
@@ -171,7 +214,7 @@ HiAlertModal.propTypes = process.env.NODE_ENV !== "production" ? {
   /**
    * Texte contenu dans la modal
    */
-  content: _propTypes.default.string,
+  content: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object, _propTypes.default.node]),
 
   /**
    * Texte sur le bouton d'annulation

package/HiColoredLabel/HiColoredLabel.js

@@ -27,7 +27,7 @@ var _colorManipulator = require("../styles/colorManipulator");
 
 var styles = function styles(theme) {
   return {
-    root: (0, _extends2.default)({}, theme.typography.b3, {
+    root: {
       display: 'inline-block',
       alignItems: 'baseline',
       maxWidth: '100%',
@@ -37,7 +37,12 @@ var styles = function styles(theme) {
       overflow: 'hidden',
       whiteSpace: 'nowrap',
       lineHeight: 1
-    }),
+    },
+    body1: (0, _extends2.default)({}, theme.typography.b1),
+    body2: (0, _extends2.default)({}, theme.typography.b2),
+    body3: (0, _extends2.default)({}, theme.typography.b3),
+    body4: (0, _extends2.default)({}, theme.typography.b4),
+    body5: (0, _extends2.default)({}, theme.typography.b5),
     color: {
       fontWeight: 400
     },
@@ -135,6 +140,7 @@ function HiColoredLabel(props) {
 
   var classes = props.classes,
       className = props.className,
+      fontSize = props.fontSize,
       label = props.label,
       color = props.color,
       active = props.active,
@@ -142,11 +148,11 @@ function HiColoredLabel(props) {
       fontWeight = props.fontWeight,
       style = props.style,
       theme = props.theme,
-      other = (0, _objectWithoutProperties2.default)(props, ["classes", "className", "label", "color", "active", "outlined", "fontWeight", "style", "theme"]);
+      other = (0, _objectWithoutProperties2.default)(props, ["classes", "className", "fontSize", "label", "color", "active", "outlined", "fontWeight", "style", "theme"]);
   var isHiColor = ['primary', 'secondary', 'positive', 'negative', 'middle', 'neutral'].includes(color);
   var isHexColor = !isHiColor && /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test(color);
   return _react.default.createElement("div", (0, _extends2.default)({
-    className: (0, _classnames.default)(classes.root, (_classNames = {}, (0, _defineProperty2.default)(_classNames, classes.color, !active), (0, _defineProperty2.default)(_classNames, classes.activeColor, active), (0, _defineProperty2.default)(_classNames, classes.outlined, outlined), (0, _defineProperty2.default)(_classNames, classes["activeColor".concat((0, _helpers.capitalize)(color))], active && isHiColor), (0, _defineProperty2.default)(_classNames, classes["color".concat((0, _helpers.capitalize)(color))], !active && isHiColor), _classNames), className),
+    className: (0, _classnames.default)(classes.root, (_classNames = {}, (0, _defineProperty2.default)(_classNames, classes.color, !active), (0, _defineProperty2.default)(_classNames, classes.activeColor, active), (0, _defineProperty2.default)(_classNames, classes.outlined, outlined), (0, _defineProperty2.default)(_classNames, classes["activeColor".concat((0, _helpers.capitalize)(color))], active && isHiColor), (0, _defineProperty2.default)(_classNames, classes["color".concat((0, _helpers.capitalize)(color))], !active && isHiColor), (0, _defineProperty2.default)(_classNames, classes.body1, fontSize >= 15), (0, _defineProperty2.default)(_classNames, classes.body2, fontSize === 14), (0, _defineProperty2.default)(_classNames, classes.body3, fontSize === 13), (0, _defineProperty2.default)(_classNames, classes.body4, fontSize === 12), (0, _defineProperty2.default)(_classNames, classes.body5, fontSize <= 11), _classNames), className),
     style: (0, _extends2.default)({}, style, isHexColor && {
       backgroundColor: active ? color : (0, _colorManipulator.fade)(color, 0.08),
       color: active ? theme.palette.getContrastText(color) : color
@@ -178,6 +184,11 @@ HiColoredLabel.propTypes = process.env.NODE_ENV !== "production" ? {
    */
   color: _propTypes.default.string,
 
+  /**
+   * Taille du text
+   */
+  fontSize: _propTypes.default.number,
+
   /**
    * Graisse du text
    */
@@ -196,6 +207,7 @@ HiColoredLabel.propTypes = process.env.NODE_ENV !== "production" ? {
 HiColoredLabel.defaultProps = {
   active: false,
   color: 'primary',
+  fontSize: 15,
   outlined: false
 };
 

package/HiForm/HiFormControl.js

@@ -252,14 +252,12 @@ function (_React$PureComponent) {
         focused: !disabled && (focused || hovered)
       }, InputLabelProps), error && errorText && _react.default.createElement(_HiIconButton.default, {
         className: (0, _classnames.default)(classes.iconButton, classes.iconButtonError),
-        onClick: this.handleHelperClick,
-        onKeyDown: this.handleKeyDown
+        onClick: this.handleHelperClick
       }, _react.default.createElement(_Warning.default, {
         className: (0, _classnames.default)(classes.icon)
       })), helperIcon && helperText && !error && _react.default.createElement(_HiIconButton.default, {
         className: (0, _classnames.default)(classes.iconButton, classes.iconButtonInfo, (0, _defineProperty2.default)({}, classes.iconButtonInfoActive, helperOpen)),
-        onClick: this.handleHelperClick,
-        onKeyDown: this.handleKeyDown
+        onClick: this.handleHelperClick
       }, _react.default.createElement(_Info.default, {
         className: (0, _classnames.default)(classes.icon)
       }))), _react.default.createElement("div", {

package/HiForm/HiInput.js

@@ -169,6 +169,13 @@ function (_React$PureComponent) {
 
     (0, _classCallCheck2.default)(this, HiInput);
     _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiInput).call(this));
+
+    _this.handleClick = function () {
+      if (_this.props.onClick) {
+        _this.props.onClick();
+      }
+    };
+
     _this.state = {
       focused: false
     };
@@ -215,10 +222,15 @@ function (_React$PureComponent) {
       // Si on click sur un élément de HiInput, on garde le focus
       // Par exemple sur l'icone reset
       if (event.relatedTarget && this.overlayNode && this.overlayNode.contains(event.relatedTarget)) {
-        if (this.endAdornmentNode.contains(event.relatedTarget) && this.props.onBlur) {
+        // If blur came from erase icon => stay focused and don't call onBlur props
+        if (this.eraseIconNode && this.eraseIconNode.contains(event.relatedTarget)) {
+          event.preventDefault();
+          event.stopPropagation();
+        } else if (this.endAdornmentNode.contains(event.relatedTarget) && this.props.onBlur) {
           this.props.onBlur(event);
         }
 
+        event.preventDefault();
         event.stopPropagation();
       } else {
         this.setState({
@@ -240,9 +252,13 @@ function (_React$PureComponent) {
           this.setState({
             focused: true
           });
-        }
+        } // If focus came from erase icon => stay focused and don't call onFocus props
+
 
-        if (this.props.onFocus) {
+        if (this.eraseIconNode && this.eraseIconNode.contains(event.relatedTarget)) {
+          event.preventDefault();
+          event.stopPropagation();
+        } else if (this.props.onFocus) {
           this.props.onFocus(event);
         }
       }
@@ -342,7 +358,10 @@ function (_React$PureComponent) {
           label: classes.eraseButtonLabel
         },
         onClick: this.handleReset,
-        onBlur: this.handleBlur
+        onBlur: this.handleBlur,
+        buttonRef: function buttonRef(el) {
+          _this2.eraseIconNode = el;
+        }
       }, _ref);
 
       var endAdornment = endAdornmentProps;
@@ -369,6 +388,7 @@ function (_React$PureComponent) {
         placeholder: placeholder,
         onFocus: this.handleFocus,
         onKeyDown: this.props.onKeyDown,
+        onClick: this.handleClick,
         onBlur: this.handleBlur,
         inputRef: this.getInputElement,
         disabled: disabled,
@@ -497,6 +517,11 @@ HiInput.propTypes = process.env.NODE_ENV !== "production" ? {
    */
   onChange: _propTypes.default.func,
 
+  /**
+   * Fonction de callback appelée au click dans l'input
+   */
+  onClick: _propTypes.default.func,
+
   /**
    * Fonction de callback appelée au focus du champs
    */

package/HiForm/HiUploadField.js

@@ -49,7 +49,8 @@ var styles = function styles(theme) {
       fontSize: '80px'
     },
     inputContainer: {
-      flex: '1'
+      flex: '1',
+      width: 'calc(100% - 88px)'
     },
     empty: {
       border: "1px solid ".concat(theme.palette.input.bottomLine),

package/HiSelect/HiSelect.js

@@ -249,17 +249,13 @@ function (_React$PureComponent) {
         nextItem = (0, _helpers.getNextItemSelectable)(document.activeElement, 'down');
       } else if (event.key === 'ArrowUp') {
         nextItem = (0, _helpers.getNextItemSelectable)(document.activeElement, 'up');
-      } else if (event.key === 'Tab') {
+      } else if (event.key === 'Tab' || event.key === 'Escape') {
         /* if (!this.props.staticPosition) {
             document.body.style.overflow = 'auto';
         } */
         _this.setState({
           open: false
         });
-      } else if (event.key === 'Escape') {
-        _this.setState({
-          open: false
-        });
       }
 
       if (nextItem) {
@@ -272,6 +268,10 @@ function (_React$PureComponent) {
         _this.focusOnSelectedItem();
       } else if (event.key === 'Enter' && _this.props.onSubmit) {
         _this.props.onSubmit(event);
+      } else if (event.key === 'Tab' || event.key === 'Escape') {
+        _this.setState({
+          open: false
+        });
       }
     };
 
@@ -750,6 +750,7 @@ function (_React$PureComponent) {
         onClick: this.handleClick,
         onFocus: this.handleFocus,
         onBlur: this.handleBlur,
+        onKeyDown: this.handleKeyDown,
         onMouseEnter: this.props.onMouseEnter,
         onMouseLeave: this.props.onMouseLeave,
         refElement: function refElement(el) {

package/HiSelect/HiSuggestSelect.js

@@ -62,7 +62,8 @@ var styles = function styles(theme) {
       width: '100% !important',
       transform: 'none !important',
       zIndex: '9 !important',
-      top: '100% !important'
+      top: '100% !important',
+      textOverflow: 'ellipsis'
     },
     paper: {
       borderRadius: '0px 2px',
@@ -204,10 +205,10 @@ function (_React$PureComponent) {
           options: [],
           focused: false
         });
-      }
 
-      if (this.props.onBlurInput) {
-        this.props.onBlurInput(event);
+        if (this.props.onBlurInput) {
+          this.props.onBlurInput(event);
+        }
       }
     }
   }, {

package/HiSelect/SelectInput.js

@@ -229,6 +229,7 @@ function (_React$PureComponent) {
         className: iconClass,
         icon: "arrow_drop_down"
       })) : _react.default.createElement(_ButtonBase.default, {
+        component: "div",
         id: id,
         classes: {
           root: rootClass

package/HiSelectNew/HiNestedSelect.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.styles = void 0;
+exports.default = exports.styles = exports.filterValue = void 0;
 
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 
@@ -76,6 +76,10 @@ function findFinalItemRecursively(itemList, searchId) {
   });
   return foundItem;
 }
+
+var filterValue = function filterValue(item, searchValue) {
+  return searchValue === '' || (0, _helpers.foldAccents)(item.label.toString().toLowerCase()).search((0, _helpers.foldAccents)(searchValue.toLowerCase())) !== -1;
+};
 /**
  * Build item list by settings item props relative to the nested parent/child situation
  * Reduce the item list to build specified items (displayed, pinned, disabled, selected, indeterminate)
@@ -94,6 +98,8 @@ function findFinalItemRecursively(itemList, searchId) {
  */
 
 
+exports.filterValue = filterValue;
+
 function buildFilteredItemList(itemList) {
   var selectedItemIdList = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
   var searchValue = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
@@ -102,15 +108,16 @@ function buildFilteredItemList(itemList) {
   var disabledParent = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : false;
   var nbChildrenAsInfo = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
   var translations = arguments.length > 7 ? arguments[7] : undefined;
+  var filterFunc = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : filterValue;
   return itemList.reduce(function (_ref, item) {
     var memoItemList = _ref.l,
         memoSelected = _ref.s,
         memoUnselected = _ref.u,
         memoVisible = _ref.v;
-    var itemVisible = searchValue === '' || (0, _helpers.foldAccents)(item.label.toString().toLowerCase()).search((0, _helpers.foldAccents)(searchValue.toLowerCase())) !== -1; // Parent item
+    var itemVisible = filterFunc(item, searchValue); // Parent item
 
     if (item.children) {
-      var _buildFilteredItemLis = buildFilteredItemList(item.children, selectedItemIdList, searchValue, itemVisible, pinnedParent, disabledParent),
+      var _buildFilteredItemLis = buildFilteredItemList(item.children, selectedItemIdList, searchValue, itemVisible, pinnedParent, disabledParent, nbChildrenAsInfo, translations, filterFunc),
           customizedChildren = _buildFilteredItemLis.l,
           selected = _buildFilteredItemLis.s,
           unselected = _buildFilteredItemLis.u,
@@ -285,9 +292,10 @@ function (_React$PureComponent) {
           multiple = _this$props2.multiple,
           nbChildrenAsInfo = _this$props2.nbChildrenAsInfo,
           pinnedParent = _this$props2.pinnedParent,
-          translations = _this$props2.translations; // build item list
+          translations = _this$props2.translations,
+          filterFunc = _this$props2.filterFunc; // build item list
 
-      var _buildFilteredItemLis2 = buildFilteredItemList(options, value, search, false, pinnedParent, disabledParent || !multiple, nbChildrenAsInfo, translations),
+      var _buildFilteredItemLis2 = buildFilteredItemList(options, value, search, false, pinnedParent, disabledParent || !multiple, nbChildrenAsInfo, translations, filterFunc),
           filteredItemList = _buildFilteredItemLis2.l,
           allSelected = _buildFilteredItemLis2.s,
           allUnselected = _buildFilteredItemLis2.u,
@@ -426,7 +434,8 @@ HiNestedSelect.defaultProps = {
     one_item_selected: '%s item selected',
     n_children: '%s',
     one_child: '%s item'
-  }
+  },
+  filterFunc: filterValue
 };
 HiNestedSelect.propTypes = process.env.NODE_ENV !== "production" ? {
   /**
@@ -444,6 +453,11 @@ HiNestedSelect.propTypes = process.env.NODE_ENV !== "production" ? {
    */
   displayAsChip: _propTypes.default.bool,
 
+  /*
+   * Fonction de filtrage custom
+   */
+  filterFunc: _propTypes.default.func,
+
   /**
    * Affiche l'élément 'All'
    */