@hipay/hipay-material-ui 2.0.0-beta.60 → 2.0.0-beta.61

package/HiSelectNew/HiNestedSelectContent.js

@@ -43,12 +43,12 @@ var _helpers = require("../utils/helpers");
  */
 function getRecursiveFinalItemIdList(itemList) {
   var finalItemIdList = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
-  return [].concat((0, _toConsumableArray2.default)(finalItemIdList), (0, _toConsumableArray2.default)(itemList.reduce(function (memo, item) {
+  return (0, _toConsumableArray2.default)(finalItemIdList).concat((0, _toConsumableArray2.default)(itemList.reduce(function (memo, item) {
     if (item.children) {
       return getRecursiveFinalItemIdList(item.children, memo);
     }
 
-    return [].concat((0, _toConsumableArray2.default)(memo), [item.id]);
+    return (0, _toConsumableArray2.default)(memo).concat([item.id]);
   }, [])));
 }
 /**
@@ -124,7 +124,7 @@ function buildFilteredItemList(itemList) {
       }
 
       return {
-        l: [].concat((0, _toConsumableArray2.default)(memoItemList), [(0, _extends2.default)({}, item, disabledParent && {
+        l: (0, _toConsumableArray2.default)(memoItemList).concat([(0, _extends2.default)({}, item, disabledParent && {
           disabled: true,
           hideCheckbox: true // don't display checkbox on disabled parent
 
@@ -143,7 +143,7 @@ function buildFilteredItemList(itemList) {
 
     var itemSelected = selectedItemIdList.includes(item.id);
     return {
-      l: [].concat((0, _toConsumableArray2.default)(memoItemList), [(0, _extends2.default)({
+      l: (0, _toConsumableArray2.default)(memoItemList).concat([(0, _extends2.default)({
         displayed: itemVisible || visibleParent
       }, item)]),
       s: itemSelected && memoSelected,
@@ -223,9 +223,9 @@ function (_React$PureComponent) {
           }), item);
         } else {
           // select parent > add each selectable child without duplicates.
-          onChange(event, [].concat((0, _toConsumableArray2.default)(value.filter(function (vid) {
+          onChange(event, (0, _toConsumableArray2.default)(value.filter(function (vid) {
             return !parentSelectableItemIdList.includes(vid);
-          })), (0, _toConsumableArray2.default)(parentSelectableItemIdList)), item);
+          })).concat((0, _toConsumableArray2.default)(parentSelectableItemIdList)), item);
         }
       } else if (value.includes(item.id)) {
         // unselect item
@@ -233,7 +233,7 @@ function (_React$PureComponent) {
           return id !== item.id;
         }), item);
       } else {
-        onChange(event, [].concat((0, _toConsumableArray2.default)(value), [item.id]), item);
+        onChange(event, (0, _toConsumableArray2.default)(value).concat([item.id]), item);
       }
     };
 
@@ -271,14 +271,14 @@ function (_React$PureComponent) {
         centered: true,
         hideCheckbox: true,
         label: translations.no_result_match
-      }]) : [].concat((0, _toConsumableArray2.default)(loading ? [{
+      }]) : (0, _toConsumableArray2.default)(loading ? [{
         id: '_loading',
         type: 'loader',
         disabled: true,
         centered: true,
         hideCheckbox: true,
         label: 'loading'
-      }] : []), (0, _toConsumableArray2.default)(hasAll ? [{
+      }] : []).concat((0, _toConsumableArray2.default)(hasAll ? [{
         id: '_all',
         iconAll: iconAll,
         label: translations.all,

package/HiSelectNew/HiSelect.js

@@ -148,22 +148,22 @@ function (_React$PureComponent) {
       var search = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
       var loading = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
       // build item list
-      var itemList = [].concat((0, _toConsumableArray2.default)(loading ? [{
+      var itemList = (0, _toConsumableArray2.default)(loading ? [{
         id: '_loading',
         type: 'loader',
         disabled: true,
         centered: true,
         hideCheckbox: true,
         label: 'loading'
-      }] : []), (0, _toConsumableArray2.default)(search !== '' ? (0, _toConsumableArray2.default)(options.filter(function (item) {
+      }] : []).concat((0, _toConsumableArray2.default)(search !== '' ? (0, _toConsumableArray2.default)(options.filter(function (item) {
         return _this.props.filterFunc(item, search);
-      })) : [].concat((0, _toConsumableArray2.default)(_this.props.hasAll ? [(0, _extends2.default)({
+      })) : (0, _toConsumableArray2.default)(_this.props.hasAll ? [(0, _extends2.default)({
         id: '_all',
         label: _this.props.translations.all
       }, _this.props.iconAll && {
         type: 'icon',
         icon: _this.props.iconAll
-      })] : []), (0, _toConsumableArray2.default)(options))));
+      })] : []).concat((0, _toConsumableArray2.default)(options))));
       return {
         itemList: itemList,
         inputValue: _this.buildInputValue(options, value, loading)
@@ -462,7 +462,7 @@ function (_React$PureComponent) {
           return id !== item.id;
         }), item);
       } else {
-        onChange(event, [].concat((0, _toConsumableArray2.default)(value), [item.id]), item);
+        onChange(event, (0, _toConsumableArray2.default)(value).concat([item.id]), item);
       }
     };
 
@@ -488,13 +488,13 @@ function (_React$PureComponent) {
         });
       } else {
         _this.setState({
-          suggestions: [].concat((0, _toConsumableArray2.default)(hasAll ? [(0, _extends2.default)({
+          suggestions: (0, _toConsumableArray2.default)(hasAll ? [(0, _extends2.default)({
             id: '_all',
             label: translations.all
           }, iconAll && {
             type: 'icon',
             icon: iconAll
-          })] : []), (0, _toConsumableArray2.default)(suggestions))
+          })] : []).concat((0, _toConsumableArray2.default)(suggestions))
         });
       }
     };

package/HiSelectNew/HiSelectContent.js

@@ -179,7 +179,7 @@ function (_React$PureComponent) {
           return id !== item.id;
         }), item);
       } else {
-        onChange(event, [].concat((0, _toConsumableArray2.default)(value), [item.id]), item);
+        onChange(event, (0, _toConsumableArray2.default)(value).concat([item.id]), item);
       }
     };
 
@@ -209,13 +209,13 @@ function (_React$PureComponent) {
         });
       } else {
         _this.setState({
-          suggestions: [].concat((0, _toConsumableArray2.default)(hasAll ? [(0, _extends2.default)({
+          suggestions: (0, _toConsumableArray2.default)(hasAll ? [(0, _extends2.default)({
             id: '_all',
             label: translations.all
           }, iconAll && {
             type: 'icon',
             icon: iconAll
-          })] : []), (0, _toConsumableArray2.default)(suggestions))
+          })] : []).concat((0, _toConsumableArray2.default)(suggestions))
         });
       }
     };
@@ -251,22 +251,22 @@ function (_React$PureComponent) {
       var search = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
       var loading = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
       // build item list
-      var itemList = [].concat((0, _toConsumableArray2.default)(loading ? [{
+      var itemList = (0, _toConsumableArray2.default)(loading ? [{
         id: '_loading',
         type: 'loader',
         disabled: true,
         centered: true,
         hideCheckbox: true,
         label: 'loading'
-      }] : []), (0, _toConsumableArray2.default)(search !== '' ? (0, _toConsumableArray2.default)(options.filter(function (item) {
+      }] : []).concat((0, _toConsumableArray2.default)(search !== '' ? (0, _toConsumableArray2.default)(options.filter(function (item) {
         return item.label && _this.props.filterFunc(item, search);
-      })) : [].concat((0, _toConsumableArray2.default)(_this.props.hasAll ? [(0, _extends2.default)({
+      })) : (0, _toConsumableArray2.default)(_this.props.hasAll ? [(0, _extends2.default)({
         id: '_all',
         label: _this.props.translations.all
       }, _this.props.iconAll && {
         type: 'icon',
         icon: _this.props.iconAll
-      })] : []), (0, _toConsumableArray2.default)(options))));
+      })] : []).concat((0, _toConsumableArray2.default)(options))));
       return {
         itemList: itemList
       };

package/HiSelectableList/HiSelectableList.js

@@ -112,6 +112,10 @@ function (_React$PureComponent) {
     };
 
     _this.compareItem = function (a, b) {
+      if (_this.props.comparItemFunc) {
+        return _this.props.comparItemFunc(a, b);
+      }
+
       if (a.label === undefined || b.label === undefined) {
         return 0;
       }
@@ -184,6 +188,11 @@ HiSelectableList.propTypes = process.env.NODE_ENV !== "production" ? {
    */
   classes: _propTypes.default.object,
 
+  /**
+   * Fonction de comparaison utilisée pour les tris
+   */
+  comparItemFunc: _propTypes.default.func,
+
   /**
    * Désactive la listes
    */

package/es/HiDatePicker/HiDatePicker.js

@@ -3,6 +3,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import PropTypes from 'prop-types';
+import moment from 'moment-timezone';
 import MomentLocaleUtils from 'react-day-picker/moment';
 import HiLocaleUtils from './hiLocaleUtils';
 import DayPickerInput from 'react-day-picker/DayPickerInput';
@@ -20,9 +21,18 @@ import styles from './stylesheet';
 class HiDatePicker extends React.Component {
   constructor(props) {
     super();
+
+    this.handleKeyDown = name => event => {
+      if (event.key === 'Escape' && !event.shiftKey) {
+        this.datePickerInput.hideDayPicker();
+        event.stopPropagation();
+      }
+    };
+
+    const today = moment().tz(props.timezoneName);
     this.state = {
       openedPanel: 'calendar',
-      currentMonth: props.value ? props.value : new Date()
+      currentMonth: props.value ? props.value : new Date(today.year(), today.month(), today.date(), today.hours(), today.minutes(), today.seconds(), today.milliseconds())
     }; // this.formatDate = this.formatDate.bind(this);
 
     this.handleCalendarClick = this.handleCalendarClick.bind(this);
@@ -46,15 +56,16 @@ class HiDatePicker extends React.Component {
     clearTimeout(this.timeout);
   }
 
-  handleReset() {
-    this.handleCurrentMonthChange(new Date());
-    this.props.onReset();
-  }
-
   handleInputChange(event) {
     this.props.onChange(event.target.value);
   }
 
+  handleReset() {
+    const today = moment().tz(this.props.timezoneName);
+    this.handleCurrentMonthChange(new Date(today.year(), today.month(), today.date(), today.hours(), today.minutes(), today.seconds(), today.milliseconds()));
+    this.props.onReset();
+  }
+
   handleDayChange(day, modifiers) {
     if (day) {
       if (modifiers.selected) {
@@ -198,11 +209,12 @@ class HiDatePicker extends React.Component {
     const {
       currentMonth
     } = this.state;
+    const today = moment().tz(this.props.timezoneName);
 
     const effectiveDisabledDays = _objectSpread({}, disablePastDays && {
-      before: new Date()
+      before: new Date(today.year(), today.month(), today.date(), today.hours(), today.minutes(), today.seconds(), today.milliseconds())
     }, disableFutureDays && {
-      after: new Date()
+      after: new Date(today.year(), today.month(), today.date(), today.hours(), today.minutes(), today.seconds(), today.milliseconds())
     }, disabledDays);
 
     const modifiersStyles = {
@@ -229,7 +241,8 @@ class HiDatePicker extends React.Component {
       fromMonth: minimumDate,
       modifiers: {
         disabled: effectiveDisabledDays,
-        selected: value
+        selected: value,
+        [classes.currentDay]: new Date(today.year(), today.month(), today.date(), today.hours(), today.minutes(), today.seconds(), today.milliseconds())
       },
       modifiersStyles,
       month: currentMonth
@@ -248,7 +261,8 @@ class HiDatePicker extends React.Component {
     });
 
     return React.createElement("div", {
-      className: classes.root
+      className: classes.root,
+      onKeyDown: this.handleKeyDown()
     }, React.createElement(DayPickerInput, {
       ref: el => {
         this.datePickerInput = el;
@@ -279,6 +293,7 @@ HiDatePicker.defaultProps = {
   locale: 'fr-FR',
   minimumDate: new Date(2013, 4, 1),
   // by default 1 May 2013
+  timezoneName: 'Europe/Paris',
   translations: {
     today: 'today'
   }
@@ -347,6 +362,11 @@ HiDatePicker.propTypes = process.env.NODE_ENV !== "production" ? {
    */
   onSubmit: PropTypes.func,
 
+  /**
+   * Timezone de l'utilisateur
+   */
+  timezoneName: PropTypes.string,
+
   /**
    * Traductions
    */

package/es/HiDatePicker/HiDateRangePicker.js

@@ -3,6 +3,7 @@ import _objectSpread from "@babel/runtime/helpers/objectSpread";
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import PropTypes from 'prop-types';
+import moment from 'moment-timezone';
 import MomentLocaleUtils from 'react-day-picker/moment';
 import HiLocaleUtils from './hiLocaleUtils';
 import DayPickerInput from 'react-day-picker/DayPickerInput';
@@ -17,7 +18,6 @@ import NavBar from './NavBar';
 import Weekday from './Weekday';
 import { HiTextField } from '../HiForm';
 import styles from './stylesheet';
-import moment from 'moment';
 import HiFormControl from '../HiForm/HiFormControl';
 
 class HiDateRangePicker extends React.Component {
@@ -58,8 +58,10 @@ class HiDateRangePicker extends React.Component {
 
     this.onDayToClick = day => {
       let change = moment(day) >= moment(this.props.from);
+      const today = moment().tz(this.props.timezoneName);
+      const todayDate = new Date(today.year(), today.month(), today.date(), 23, 59, 59);
 
-      if (change && this.props.disableFutureDays && moment(day).utc() > moment().utc().endOf('day')) {
+      if (change && day > todayDate) {
         change = false;
       }
 
@@ -85,11 +87,13 @@ class HiDateRangePicker extends React.Component {
 
     this.handleChange = (name, day) => {
       const {
-        translations
+        translations,
+        timezoneName
       } = this.props;
       let date;
       let error;
-      const now = new Date();
+      const today = moment().tz(timezoneName);
+      const now = new Date(today.year(), today.month(), today.date(), 23, 59, 59);
       const {
         minimumDate,
         disableFutureDays,
@@ -115,8 +119,8 @@ class HiDateRangePicker extends React.Component {
           error = translations.to_superior_from;
         } else if (moment(date).utc() < moment(minimumDate).utc().startOf('day')) {
           error = translations.date_inferior_min_date.replace('%s', moment(minimumDate).format(format));
-        } else if (disableFutureDays && moment(date).utc() > moment(now).utc().endOf('day')) {
-          error = translations.date_superior_max_date.replace('%s', moment().format(format));
+        } else if (disableFutureDays && date > now) {
+          error = translations.date_superior_max_date.replace('%s', moment().tz(timezoneName).format(format));
         }
 
         if (!this.props.enableTime) {
@@ -165,15 +169,11 @@ class HiDateRangePicker extends React.Component {
 
     this.handleReset = name => {
       this.handleChange(name, undefined);
-      this.setState(prevState => ({
-        keyFrom: prevState.keyFrom === 1 ? 2 : 1,
-        keyTo: prevState.keyTo === 1 ? 2 : 1
-      }));
     };
 
     this.handleKeyDown = name => event => {
       if (event.key === 'Tab' && !event.shiftKey) {
-        let nodeName = document.activeElement.nodeName;
+        const nodeName = document.activeElement.nodeName;
 
         if (this.props[name] && nodeName === 'INPUT' && document.activeElement.nextSibling.children.length > 0) {
           document.activeElement.nextSibling.focus();
@@ -191,6 +191,14 @@ class HiDateRangePicker extends React.Component {
             document.activeElement.blur();
           }, 1);
         }
+      } else if (event.key === 'Escape' && !event.shiftKey) {
+        if (name === 'from') {
+          this.fromInput.hideDayPicker();
+        } else if (name === 'to') {
+          this.toInput.hideDayPicker();
+        }
+
+        event.stopPropagation();
       }
     };
 
@@ -276,12 +284,12 @@ class HiDateRangePicker extends React.Component {
       }, yearPickerProps, propsOverlay));
     };
 
+    const _today = moment().tz(this.props.timezoneName);
+
     this.state = {
-      currentMonth: new Date(),
+      currentMonth: new Date(_today.year(), _today.month(), _today.date()),
       focusedInput: '',
-      openedPanel: 'calendar',
-      keyFrom: 1,
-      keyTo: 1
+      openedPanel: 'calendar'
     };
   }
 
@@ -313,14 +321,17 @@ class HiDateRangePicker extends React.Component {
       errorText,
       hasSelector,
       helperIcon,
-      helperText
+      helperText,
+      timezoneName
     } = _this$props,
-          props = _objectWithoutProperties(_this$props, ["classes", "disabled", "disabledDays", "disableFutureDays", "enableTime", "labelFrom", "labelTo", "locale", "format", "from", "fromError", "minimumDate", "onReset", "to", "toError", "translations", "id", "staticPosition", "errorText", "hasSelector", "helperIcon", "helperText"]);
+          props = _objectWithoutProperties(_this$props, ["classes", "disabled", "disabledDays", "disableFutureDays", "enableTime", "labelFrom", "labelTo", "locale", "format", "from", "fromError", "minimumDate", "onReset", "to", "toError", "translations", "id", "staticPosition", "errorText", "hasSelector", "helperIcon", "helperText", "timezoneName"]);
 
-    const now = new Date();
+    const today = moment().tz(timezoneName);
+    const now = new Date(today.year(), today.month(), today.date(), 23, 59, 59, 999);
     const modifiers = {
       start: from,
-      end: to
+      end: to,
+      [classes.currentDay]: new Date(today.year(), today.month(), today.date())
     };
     const modifiersStyles = {
       start: {
@@ -440,7 +451,7 @@ class HiDateRangePicker extends React.Component {
       onFocus: () => this.handleDayPickerFocus('from'),
       onKeyDown: this.handleKeyDown('from')
     }, React.createElement("div", null, React.createElement(DayPickerInput, {
-      key: this.state.keyFrom,
+      key: '1',
       ref: el => {
         this.fromInput = el;
       },
@@ -461,7 +472,7 @@ class HiDateRangePicker extends React.Component {
       onBlur: () => this.handleDayPickerBlur('to'),
       onKeyDown: this.handleKeyDown('to')
     }, React.createElement(DayPickerInput, {
-      key: this.state.keyTo,
+      key: '1',
       ref: el => {
         this.toInput = el;
       },
@@ -505,6 +516,7 @@ HiDateRangePicker.defaultProps = {
   locale: 'fr-FR',
   minimumDate: new Date(2013, 4, 1),
   // by default 1 May 2013
+  timezoneName: 'Europe/Paris',
   translations: {
     today: 'today',
     hour: 'Hour',
@@ -636,6 +648,11 @@ HiDateRangePicker.propTypes = process.env.NODE_ENV !== "production" ? {
    */
   staticPosition: PropTypes.bool,
 
+  /**
+   * Timezone de l'utilisateur
+   */
+  timezoneName: PropTypes.string,
+
   /**
    * Date de fin sélectionnée
    */

package/es/HiDatePicker/HiDateRangeSelector.js

@@ -187,18 +187,7 @@ class HiDateRangeSelector extends React.Component {
         [name]: value,
         key: prevState.key === 1 ? 2 : 1
       }));
-      const selectedOption = this.options.find(option => option.id === value);
-
-      if (selectedOption) {
-        this.props.onChange('from', new Date(selectedOption.from.format('YYYY-MM-DD HH:mm:ss')));
-        this.props.onChange('to', new Date(selectedOption.to.format('YYYY-MM-DD HH:mm:ss')));
-        this.props.onChange('fromError', false);
-        this.props.onChange('toError', false);
-      }
-
-      if (this.props.returnSelectValue === true) {
-        this.props.onChange('period', value);
-      }
+      this.updateDates(value);
     };
 
     this.options = props.availableOptionKeys.map(key => buildDateRangeOptionByKey(key, props.translations, props.format, props.timezoneName));
@@ -226,10 +215,32 @@ class HiDateRangeSelector extends React.Component {
     }
   }
 
+  componentDidUpdate(prevProps) {
+    if (prevProps.timezoneName !== this.props.timezoneName) {
+      this.options = this.props.availableOptionKeys.map(key => buildDateRangeOptionByKey(key, this.props.translations, this.props.format, this.props.timezoneName));
+      this.updateDates(this.state.selectedPreset);
+    }
+  }
+
   componentWillUnmount() {
     clearTimeout(this.timeout); // TODO : supprimer ?
   }
 
+  updateDates(value) {
+    const selectedOption = this.options.find(option => option.id === value);
+
+    if (selectedOption) {
+      this.props.onChange('from', new Date(selectedOption.from.format('YYYY-MM-DD HH:mm:ss')));
+      this.props.onChange('to', new Date(selectedOption.to.format('YYYY-MM-DD HH:mm:ss')));
+      this.props.onChange('fromError', false);
+      this.props.onChange('toError', false);
+    }
+
+    if (this.props.returnSelectValue === true) {
+      this.props.onChange('period', value);
+    }
+  }
+
   render() {
     const _this$props = this.props,
           {

package/es/HiDatePicker/stylesheet.js

@@ -172,23 +172,22 @@ export default (theme => ({
 
   /* default modifiers */
   // Added to the day's cell for the current day
-  today: {
-    // color: theme.palette.primary.light,
-    position: 'relative',
-    borderRadius: '50%',
-    color: `${theme.palette.neutral.dark} !important`,
-    fontWeight: theme.typography.fontWeightMedium,
-    '&:before': {
-      content: '""',
-      position: 'absolute',
-      top: 0,
-      left: 0,
-      display: 'inline-block',
-      width: '100%',
-      height: '100%',
-      borderRadius: '50%',
-      boxShadow: `inset 0 0 0 2px ${theme.palette.neutral.main}`
-    }
+  today: {// color: theme.palette.primary.light,
+    // position: 'relative',
+    // borderRadius: '50%',
+    // color: `${theme.palette.neutral.dark} !important`,
+    // fontWeight: theme.typography.fontWeightMedium,
+    // '&:before': {
+    //     content: '""',
+    //     position: 'absolute',
+    //     top: 0,
+    //     left: 0,
+    //     display: 'inline-block',
+    //     width: '100%',
+    //     height: '100%',
+    //     borderRadius: '50%',
+    //     boxShadow: `inset 0 0 0 2px ${theme.palette.neutral.main}`,
+    // },
   },
   // Added to the day's cell outside the current month
   outside: {
@@ -216,5 +215,21 @@ export default (theme => ({
     color: theme.palette.primary.contrastText,
     borderRadius: '0%',
     border: 'none'
+  },
+  currentDay: {
+    position: 'relative',
+    color: `${theme.palette.neutral.dark} !important`,
+    fontWeight: theme.typography.fontWeightMedium,
+    '&:before': {
+      content: '""',
+      position: 'absolute',
+      top: 0,
+      left: 0,
+      display: 'inline-block',
+      width: '100%',
+      height: '100%',
+      borderRadius: '50%',
+      boxShadow: `inset 0 0 0 2px ${theme.palette.neutral.main}`
+    }
   }
 }));

package/es/HiSelectableList/HiSelectableList.js

@@ -61,6 +61,10 @@ class HiSelectableList extends React.PureComponent {
     };
 
     this.compareItem = (a, b) => {
+      if (this.props.comparItemFunc) {
+        return this.props.comparItemFunc(a, b);
+      }
+
       if (a.label === undefined || b.label === undefined) {
         return 0;
       }
@@ -123,6 +127,11 @@ HiSelectableList.propTypes = process.env.NODE_ENV !== "production" ? {
    */
   classes: PropTypes.object,
 
+  /**
+   * Fonction de comparaison utilisée pour les tris
+   */
+  comparItemFunc: PropTypes.func,
+
   /**
    * Désactive la listes
    */

package/es/styles/createPalette.js

@@ -30,7 +30,7 @@ export const light = {
     hint: 'rgba(0, 0, 0, 0.38)'
   },
   // The color used to divide different elements.
-  divider: 'rgba(0, 0, 0, 0.12)',
+  divider: '#D9D9DB',
   // The background colors used to style the surfaces.
   // Consistency between these values is important.
   background: {

package/es/utils/helpers.js

@@ -250,7 +250,7 @@ export function getNextItemSelectable(node, direction) {
  */
 
 export function foldAccents(toFold) {
-  return toFold.replace(/([àáâãäå])|([ç])|([èéêë])|([ìíîï])|([ñ])|([òóôõöø])|([ß])|([ùúûü])|([ÿ])|([æ])|([œ])/g, (str, a, c, e, i, n, o, s, u, y, ae, oe) => {
+  return toFold.replace(/([àáâãäå])|([ç])|([èéêë])|([ìíîï])|([ñ])|([òóôõöø])|([ß])|([ùúûü])|([ÿ])|([æ])|([œ])|([+])|([\\])|([\[])|([\]])|([\(])|([\)])|([?])|([*])/g, (str, a, c, e, i, n, o, s, u, y, ae, oe, plus, backSlash, lc, rc, lp, rp, interogation, star) => {
     if (a) return 'a';
     if (c) return 'c';
     if (e) return 'e';
@@ -262,6 +262,14 @@ export function foldAccents(toFold) {
     if (y) return 'y';
     if (ae) return 'ae';
     if (oe) return 'oe';
+    if (plus) return '\\+';
+    if (backSlash) return '\\\\';
+    if (lc) return '\\[';
+    if (rc) return '\\]';
+    if (lp) return '\\(';
+    if (rp) return '\\)';
+    if (interogation) return '\\?';
+    if (star) return '\\*';
     return str;
   });
 }

package/index.es.js

@@ -1,4 +1,4 @@
-/** @license HiPay-Material-UI v2.0.0-beta.60
+/** @license HiPay-Material-UI v2.0.0-beta.61
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/index.js

@@ -1,4 +1,4 @@
-/** @license HiPay-Material-UI v2.0.0-beta.60
+/** @license HiPay-Material-UI v2.0.0-beta.61
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/package.json

@@ -1,8 +1,7 @@
 {
   "name": "@hipay/hipay-material-ui",
-  "private": false,
   "author": "HiPay PSYCHE Team",
-  "version": "2.0.0-beta.60",
+  "version": "2.0.0-beta.61",
   "description": "React components that implement Google's Material Design.",
   "keywords": [
     "react",
@@ -76,4 +75,4 @@
   },
   "main": "./index.js",
   "module": "./index.es.js"
-}
+}