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

package/CHANGELOG.md

@@ -1,3 +1,121 @@
+<a name="2.0.0-beta.61"></a>
+# [2.0.0-beta.61](https://gitlab.hipay.org/backend/hipay-material-ui/compare/0.0.1...2.0.0-beta.61) (2019-01-24)
+
+
+### 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))
+* **HiDatePicke:** add timezone props ([18360a5](https://gitlab.hipay.org/backend/hipay-material-ui/commit/18360a5))
+* **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.60](https://gitlab.hipay.org/backend/hipay-material-ui/compare/0.0.1...2.0.0-beta.60) (2019-01-14)
+
+
+### 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.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)
 

package/HiCell/CellNumeric.js

@@ -63,7 +63,7 @@ function (_React$PureComponent) {
       var title = '';
 
       if (currency) {
-        displayedValue = (0, _helpers.formatCurrencyAmount)(value, view, locale, currency);
+        displayedValue = (0, _helpers.formatCurrencyAmount)(value, view, locale, currency, precision);
         title = (0, _helpers.formatCurrencyAmount)(value, 'l', locale, currency);
       } else {
         displayedValue = (0, _helpers.formatNumber)(value, view, locale, precision);

package/HiDatePicker/HiDatePicker.js

@@ -7,6 +7,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
@@ -29,6 +31,8 @@ var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
+var _momentTimezone = _interopRequireDefault(require("moment-timezone"));
+
 var _moment = _interopRequireDefault(require("react-day-picker/moment"));
 
 var _hiLocaleUtils = _interopRequireDefault(require("./hiLocaleUtils"));
@@ -65,9 +69,21 @@ function (_React$Component) {
 
     (0, _classCallCheck2.default)(this, HiDatePicker);
     _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiDatePicker).call(this));
+
+    _this.handleKeyDown = function (name) {
+      return function (event) {
+        if (event.key === 'Escape' && !event.shiftKey) {
+          _this.datePickerInput.hideDayPicker();
+
+          event.stopPropagation();
+        }
+      };
+    };
+
+    var today = (0, _momentTimezone.default)().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((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)));
@@ -93,17 +109,18 @@ function (_React$Component) {
     value: function componentWillUnmount() {
       clearTimeout(this.timeout);
     }
-  }, {
-    key: "handleReset",
-    value: function handleReset() {
-      this.handleCurrentMonthChange(new Date());
-      this.props.onReset();
-    }
   }, {
     key: "handleInputChange",
     value: function handleInputChange(event) {
       this.props.onChange(event.target.value);
     }
+  }, {
+    key: "handleReset",
+    value: function handleReset() {
+      var today = (0, _momentTimezone.default)().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();
+    }
   }, {
     key: "handleDayChange",
     value: function handleDayChange(day, modifiers) {
@@ -232,7 +249,8 @@ function (_React$Component) {
     value: function renderYearPickerOverlay(propsOverlay) {
       var yearPickerProps = {
         value: this.state.currentMonth,
-        onChange: this.handleCurrentMonthChange
+        onChange: this.handleCurrentMonthChange,
+        disableFutureDays: this.props.disableFutureDays
       };
       return _react.default.createElement(_YearPickerOverlay.default, (0, _extends2.default)({
         key: 'year-picker-overlay'
@@ -258,10 +276,11 @@ function (_React$Component) {
           hideOnDayClick = _this$props.hideOnDayClick,
           props = (0, _objectWithoutProperties2.default)(_this$props, ["classes", "disabledDays", "disablePastDays", "disableFutureDays", "enableTime", "format", "locale", "minimumDate", "onReset", "translations", "value", "hideOnDayClick"]);
       var currentMonth = this.state.currentMonth;
+      var today = (0, _momentTimezone.default)().tz(this.props.timezoneName);
       var effectiveDisabledDays = (0, _extends2.default)({}, 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);
       var modifiersStyles = {
         selected: {
@@ -286,10 +305,10 @@ function (_React$Component) {
         selectedDays: (0, _typeof2.default)(value) === 'object' ? value : undefined,
         firstDayOfWeek: 1,
         fromMonth: minimumDate,
-        modifiers: {
+        modifiers: (0, _defineProperty2.default)({
           disabled: effectiveDisabledDays,
           selected: value
-        },
+        }, classes.currentDay, new Date(today.year(), today.month(), today.date(), today.hours(), today.minutes(), today.seconds(), today.milliseconds())),
         modifiersStyles: modifiersStyles,
         month: currentMonth
       }, props, {
@@ -299,10 +318,14 @@ function (_React$Component) {
       var inputProps = (0, _extends2.default)({}, onReset && {
         onReset: this.handleReset
       }, props, {
-        onChange: this.handleInputChange
+        onChange: this.handleInputChange,
+        HiInputProps: {
+          onSubmit: this.props.onSubmit
+        }
       });
       return _react.default.createElement("div", {
-        className: classes.root
+        className: classes.root,
+        onKeyDown: this.handleKeyDown()
       }, _react.default.createElement(_DayPickerInput.default, {
         ref: function ref(el) {
           _this2.datePickerInput = el;
@@ -334,6 +357,7 @@ HiDatePicker.defaultProps = {
   locale: 'fr-FR',
   minimumDate: new Date(2013, 4, 1),
   // by default 1 May 2013
+  timezoneName: 'Europe/Paris',
   translations: {
     today: 'today'
   }
@@ -397,6 +421,16 @@ HiDatePicker.propTypes = process.env.NODE_ENV !== "production" ? {
    */
   onReset: _propTypes.default.func,
 
+  /**
+   * Callback lorsque l'utilisateur tape sur "Entrée"
+   */
+  onSubmit: _propTypes.default.func,
+
+  /**
+   * Timezone de l'utilisateur
+   */
+  timezoneName: _propTypes.default.string,
+
   /**
    * Traductions
    */

package/HiDatePicker/HiDateRangePicker.js

@@ -27,6 +27,8 @@ var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
+var _momentTimezone = _interopRequireDefault(require("moment-timezone"));
+
 var _moment = _interopRequireDefault(require("react-day-picker/moment"));
 
 var _hiLocaleUtils = _interopRequireDefault(require("./hiLocaleUtils"));
@@ -55,8 +57,6 @@ var _HiForm = require("../HiForm");
 
 var _stylesheet = _interopRequireDefault(require("./stylesheet"));
 
-var _moment2 = _interopRequireDefault(require("moment"));
-
 var _HiFormControl = _interopRequireDefault(require("../HiForm/HiFormControl"));
 
 var HiDateRangePicker =
@@ -105,9 +105,11 @@ function (_React$Component) {
     };
 
     _this.onDayToClick = function (day) {
-      var change = (0, _moment2.default)(day) >= (0, _moment2.default)(_this.props.from);
+      var change = (0, _momentTimezone.default)(day) >= (0, _momentTimezone.default)(_this.props.from);
+      var today = (0, _momentTimezone.default)().tz(_this.props.timezoneName);
+      var todayDate = new Date(today.year(), today.month(), today.date(), 23, 59, 59);
 
-      if (change && _this.props.disableFutureDays && (0, _moment2.default)(day).utc() > (0, _moment2.default)().utc().endOf('day')) {
+      if (change && day > todayDate) {
         change = false;
       }
 
@@ -137,19 +139,22 @@ function (_React$Component) {
     };
 
     _this.handleChange = function (name, day) {
-      var translations = _this.props.translations;
+      var _this$props = _this.props,
+          translations = _this$props.translations,
+          timezoneName = _this$props.timezoneName;
       var date;
       var error;
-      var now = new Date();
-      var _this$props = _this.props,
-          minimumDate = _this$props.minimumDate,
-          disableFutureDays = _this$props.disableFutureDays,
-          format = _this$props.format;
+      var today = (0, _momentTimezone.default)().tz(timezoneName);
+      var now = new Date(today.year(), today.month(), today.date(), 23, 59, 59);
+      var _this$props2 = _this.props,
+          minimumDate = _this$props2.minimumDate,
+          disableFutureDays = _this$props2.disableFutureDays,
+          format = _this$props2.format;
 
       if (day instanceof Date) {
         date = day;
       } else if (day) {
-        var parsedValue = (0, _moment2.default)(day, _this.props.format, true);
+        var parsedValue = (0, _momentTimezone.default)(day, _this.props.format, true);
 
         if (parsedValue.isValid()) {
           date = parsedValue.toDate();
@@ -159,14 +164,14 @@ function (_React$Component) {
       }
 
       if (date) {
-        var comparativeDate = name === 'to' ? (0, _moment2.default)(_this.props.from) : (0, _moment2.default)(_this.props.to);
+        var comparativeDate = name === 'to' ? (0, _momentTimezone.default)(_this.props.from) : (0, _momentTimezone.default)(_this.props.to);
 
-        if (name === 'to' && comparativeDate > (0, _moment2.default)(date) || name === 'from' && comparativeDate < (0, _moment2.default)(date)) {
+        if (name === 'to' && comparativeDate > (0, _momentTimezone.default)(date) || name === 'from' && comparativeDate < (0, _momentTimezone.default)(date)) {
           error = translations.to_superior_from;
-        } else if ((0, _moment2.default)(date).utc() < (0, _moment2.default)(minimumDate).utc().startOf('day')) {
-          error = translations.date_inferior_min_date.replace('%s', (0, _moment2.default)(minimumDate).format(format));
-        } else if (disableFutureDays && (0, _moment2.default)(date).utc() > (0, _moment2.default)(now).utc().endOf('day')) {
-          error = translations.date_superior_max_date.replace('%s', (0, _moment2.default)().format(format));
+        } else if ((0, _momentTimezone.default)(date).utc() < (0, _momentTimezone.default)(minimumDate).utc().startOf('day')) {
+          error = translations.date_inferior_min_date.replace('%s', (0, _momentTimezone.default)(minimumDate).format(format));
+        } else if (disableFutureDays && date > now) {
+          error = translations.date_superior_max_date.replace('%s', (0, _momentTimezone.default)().tz(timezoneName).format(format));
         }
 
         if (!_this.props.enableTime) {
@@ -216,13 +221,44 @@ function (_React$Component) {
 
     _this.handleReset = function (name) {
       _this.handleChange(name, undefined);
+    };
 
-      _this.setState(function (prevState) {
-        return {
-          keyFrom: prevState.keyFrom === 1 ? 2 : 1,
-          keyTo: prevState.keyTo === 1 ? 2 : 1
-        };
-      });
+    _this.handleKeyDown = function (name) {
+      return function (event) {
+        if (event.key === 'Tab' && !event.shiftKey) {
+          var nodeName = document.activeElement.nodeName;
+
+          if (_this.props[name] && nodeName === 'INPUT' && document.activeElement.nextSibling.children.length > 0) {
+            document.activeElement.nextSibling.focus();
+          } else if (name === 'from') {
+            _this.handleDayPickerBlur('from');
+
+            _this.handleDayPickerFocus('to');
+
+            _this.toInput.handleInputFocus();
+
+            setTimeout(function () {
+              document.getElementById("".concat(_this.props.id, "-to")).focus();
+            }, 1);
+          } else if (name === 'to') {
+            _this.handleDayPickerBlur('to');
+
+            _this.toInput.handleInputBlur(event);
+
+            setTimeout(function () {
+              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();
+        }
+      };
     };
 
     _this.openPanel = function (panel) {
@@ -310,19 +346,19 @@ function (_React$Component) {
       var yearPickerProps = {
         value: _this.state.currentMonth,
         onChange: _this.handleCurrentMonthChange,
-        disabledFutureDays: _this.props.disableFutureDays
+        disableFutureDays: _this.props.disableFutureDays
       };
       return _react.default.createElement(_YearPickerOverlay.default, (0, _extends2.default)({
         key: "".concat(name, "-year-picker-overlay")
       }, yearPickerProps, propsOverlay));
     };
 
+    var _today = (0, _momentTimezone.default)().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'
     };
     return _this;
   }
@@ -338,35 +374,37 @@ function (_React$Component) {
       var _this2 = this,
           _classNames;
 
-      var _this$props2 = this.props,
-          classes = _this$props2.classes,
-          disabled = _this$props2.disabled,
-          disabledDays = _this$props2.disabledDays,
-          disableFutureDays = _this$props2.disableFutureDays,
-          enableTime = _this$props2.enableTime,
-          labelFrom = _this$props2.labelFrom,
-          labelTo = _this$props2.labelTo,
-          locale = _this$props2.locale,
-          format = _this$props2.format,
-          from = _this$props2.from,
-          fromError = _this$props2.fromError,
-          minimumDate = _this$props2.minimumDate,
-          onReset = _this$props2.onReset,
-          to = _this$props2.to,
-          toError = _this$props2.toError,
-          translations = _this$props2.translations,
-          id = _this$props2.id,
-          staticPosition = _this$props2.staticPosition,
-          errorText = _this$props2.errorText,
-          hasSelector = _this$props2.hasSelector,
-          helperIcon = _this$props2.helperIcon,
-          helperText = _this$props2.helperText,
-          props = (0, _objectWithoutProperties2.default)(_this$props2, ["classes", "disabled", "disabledDays", "disableFutureDays", "enableTime", "labelFrom", "labelTo", "locale", "format", "from", "fromError", "minimumDate", "onReset", "to", "toError", "translations", "id", "staticPosition", "errorText", "hasSelector", "helperIcon", "helperText"]);
-      var now = new Date();
-      var modifiers = {
+      var _this$props3 = this.props,
+          classes = _this$props3.classes,
+          disabled = _this$props3.disabled,
+          disabledDays = _this$props3.disabledDays,
+          disableFutureDays = _this$props3.disableFutureDays,
+          enableTime = _this$props3.enableTime,
+          labelFrom = _this$props3.labelFrom,
+          labelTo = _this$props3.labelTo,
+          locale = _this$props3.locale,
+          format = _this$props3.format,
+          from = _this$props3.from,
+          fromError = _this$props3.fromError,
+          minimumDate = _this$props3.minimumDate,
+          onReset = _this$props3.onReset,
+          to = _this$props3.to,
+          toError = _this$props3.toError,
+          translations = _this$props3.translations,
+          id = _this$props3.id,
+          staticPosition = _this$props3.staticPosition,
+          errorText = _this$props3.errorText,
+          hasSelector = _this$props3.hasSelector,
+          helperIcon = _this$props3.helperIcon,
+          helperText = _this$props3.helperText,
+          timezoneName = _this$props3.timezoneName,
+          props = (0, _objectWithoutProperties2.default)(_this$props3, ["classes", "disabled", "disabledDays", "disableFutureDays", "enableTime", "labelFrom", "labelTo", "locale", "format", "from", "fromError", "minimumDate", "onReset", "to", "toError", "translations", "id", "staticPosition", "errorText", "hasSelector", "helperIcon", "helperText", "timezoneName"]);
+      var today = (0, _momentTimezone.default)().tz(timezoneName);
+      var now = new Date(today.year(), today.month(), today.date(), 23, 59, 59, 999);
+      var modifiers = (0, _defineProperty2.default)({
         start: from,
         end: to
-      };
+      }, classes.currentDay, new Date(today.year(), today.month(), today.date()));
       var modifiersStyles = {
         start: {
           borderTopLeftRadius: '50%',
@@ -452,7 +490,10 @@ function (_React$Component) {
       }, {
         id: "".concat(id, "-from"),
         onChange: this.handleInputChange('from'),
-        disabled: disabled
+        disabled: disabled,
+        HiInputProps: {
+          onSubmit: this.props.onSubmit
+        }
       });
       var toInputProps = (0, _extends2.default)({}, onReset && {
         onReset: function onReset() {
@@ -465,7 +506,10 @@ function (_React$Component) {
       }, {
         id: "".concat(id, "-to"),
         onChange: this.handleInputChange('to'),
-        disabled: disabled
+        disabled: disabled,
+        HiInputProps: {
+          onSubmit: this.props.onSubmit
+        }
       });
       var toClass = (0, _classnames.default)(classes.toInput, (_classNames = {}, (0, _defineProperty2.default)(_classNames, classes.absolute, staticPosition === true && this.state.focusedInput === 'from'), (0, _defineProperty2.default)(_classNames, classes.right4, staticPosition === true && this.state.focusedInput === 'from'), _classNames));
 
@@ -475,10 +519,10 @@ function (_React$Component) {
         className: classes.fromInput,
         onFocus: function onFocus() {
           return _this2.handleDayPickerFocus('from');
-        } // onBlur={() => this.handleDayPickerBlur('from')}
-
+        },
+        onKeyDown: this.handleKeyDown('from')
       }, _react.default.createElement("div", null, _react.default.createElement(_DayPickerInput.default, {
-        key: this.state.keyFrom,
+        key: '1',
         ref: function ref(el) {
           _this2.fromInput = el;
         },
@@ -502,9 +546,10 @@ function (_React$Component) {
         },
         onBlur: function onBlur() {
           return _this2.handleDayPickerBlur('to');
-        }
+        },
+        onKeyDown: this.handleKeyDown('to')
       }, _react.default.createElement(_DayPickerInput.default, {
-        key: this.state.keyTo,
+        key: '1',
         ref: function ref(el) {
           _this2.toInput = el;
         },
@@ -516,8 +561,7 @@ function (_React$Component) {
         inputProps: toInputProps,
         format: enableTime ? "".concat(format, " HH:mm") : format,
         formatDate: _moment.default.formatDate,
-        parseDate: _moment.default.parseDate // onDayChange={(day) => this.handleDayChange('to', day)}
-        ,
+        parseDate: _moment.default.parseDate,
         placeholder: ''
       })));
 
@@ -550,6 +594,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',
@@ -671,11 +716,21 @@ HiDateRangePicker.propTypes = process.env.NODE_ENV !== "production" ? {
    */
   onReset: _propTypes.default.func,
 
+  /**
+   * Callback lorsque l'utilisateur tape sur "Entrée"
+   */
+  onSubmit: _propTypes.default.func,
+
   /**
    * Si true, le calendrier sera dans une div static plutot que dans une popper absolute
    */
   staticPosition: _propTypes.default.bool,
 
+  /**
+   * Timezone de l'utilisateur
+   */
+  timezoneName: _propTypes.default.string,
+
   /**
    * Date de fin sélectionnée
    */