@hipay/hipay-material-ui 1.0.0-beta.28 → 1.0.0-beta.3

package/HiDatePicker/HiDateRangePicker.js

@@ -4,10 +4,6 @@ Object.defineProperty(exports, "__esModule", {
     value: true
 });
 
-var _values = require('babel-runtime/core-js/object/values');
-
-var _values2 = _interopRequireDefault(_values);
-
 var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
 
 var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
@@ -54,10 +50,6 @@ var _DayPickerInput = require('react-day-picker/DayPickerInput');
 
 var _DayPickerInput2 = _interopRequireDefault(_DayPickerInput);
 
-var _classnames = require('classnames');
-
-var _classnames2 = _interopRequireDefault(_classnames);
-
 var _withStyles = require('../styles/withStyles');
 
 var _withStyles2 = _interopRequireDefault(_withStyles);
@@ -100,8 +92,6 @@ var _stylesheet2 = _interopRequireDefault(_stylesheet);
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-//  weak
-
 var HiDateRangePicker = function (_React$Component) {
     (0, _inherits3.default)(HiDateRangePicker, _React$Component);
 
@@ -110,32 +100,11 @@ var HiDateRangePicker = function (_React$Component) {
 
         var _this = (0, _possibleConstructorReturn3.default)(this, (HiDateRangePicker.__proto__ || (0, _getPrototypeOf2.default)(HiDateRangePicker)).call(this));
 
-        _this.handleInputChange = function (inputName) {
-            return function (event) {
-                _this.event = event;
-                _this.props.onChange(inputName, event.target.value);
-            };
-        };
-
-        _this.handleDayPickerFocus = function (name) {
-            return function () {
-                _this.setState({ focusedInput: name });
-            };
-        };
-
-        _this.handleDayPickerBlur = function (name) {
-            return function () {
-                _this.setState({ focusedInput: '' });
-                if (_this.props.onBlur) {
-                    _this.props.onBlur(name);
-                }
-            };
-        };
-
         _this.state = {
+            fromOpenedPanel: 'calendar',
             fromCurrentMonth: props.from ? props.from : new Date(),
-            toCurrentMonth: props.to ? props.to : new Date(),
-            focusedInput: ''
+            toOpenedPanel: 'calendar',
+            toCurrentMonth: props.to ? props.to : new Date()
         };
 
         _this.handleReset = _this.handleReset.bind(_this);
@@ -159,9 +128,6 @@ var HiDateRangePicker = function (_React$Component) {
         _this.handleYearClick = _this.handleYearClick.bind(_this);
         _this.handleYearClickFrom = _this.handleYearClickFrom.bind(_this);
         _this.handleYearClickTo = _this.handleYearClickTo.bind(_this);
-        _this.handleDayPickerFocus = _this.handleDayPickerFocus.bind(_this);
-        _this.handleDayPickerBlur = _this.handleDayPickerBlur.bind(_this);
-        _this.handleInputChange = _this.handleInputChange.bind(_this);
 
         _this.openPanel = _this.openPanel.bind(_this);
 
@@ -207,7 +173,11 @@ var HiDateRangePicker = function (_React$Component) {
         value: function handleReset(name) {
             var _this3 = this;
 
-            this.handleCurrentMonthChange(name, new Date());
+            if (name === 'from') {
+                this.handleCurrentMonthChange(name, new Date());
+            } else {
+                this.handleCurrentMonthChange(name, this.props.from);
+            }
 
             this.timeout = setTimeout(function () {
                 if (_this3.props.onReset) {
@@ -220,45 +190,38 @@ var HiDateRangePicker = function (_React$Component) {
         value: function handleDayChange(name, day, modifiers) {
             var _this4 = this;
 
-            if (day) {
-                // if time disabled, focus TO input
-                // else focus current input
-                if (!this.props.enableTime) {
-                    if (day instanceof Date) {
-                        if (name === 'from' && this.toInput) {
-                            this.toInput.getInput().focus();
-                        } else if (name === 'to') {
-                            if (typeof this.event === 'undefined' || this.event && this.event.type !== 'change') {
-                                // trigger blur only if user clicks on date into calendar
-                                // else keep focus to see day selection into calendar
-                                document.activeElement.blur();
-                            }
-                            delete this.event;
-                        }
+            // if time disabled, focus TO input
+            // else focus current input
+            if (!this.props.enableTime) {
+                if (day instanceof Date) {
+                    if (name === 'from' && this.toInput) {
+                        this.toInput.getInput().focus();
+                    } else if (name === 'to') {
+                        document.activeElement.blur();
                     }
-                } else {
-                    this.timeout = setTimeout(function () {
-                        if (_this4[name + 'Input'].getInput()) {
-                            _this4[name + 'Input'].getInput().focus();
-                        }
-                    }, 10);
                 }
-
-                if (this.props.onChange) {
-                    // Keep Time if set
-                    if (this.props.enableTime) {
-                        if (this.props[name]) {
-                            day.setHours(this.props[name].getHours(), this.props[name].getMinutes());
-                        } else {
-                            day.setHours(0, 0);
-                        }
+            } else {
+                this.timeout = setTimeout(function () {
+                    if (_this4[name + 'Input'].getInput()) {
+                        _this4[name + 'Input'].getInput().focus();
                     }
-                    this.props.onChange(name, day);
-                }
+                }, 10);
+            }
 
+            if (this.props.onChange) {
+                // Keep Time if set
                 if (this.props.enableTime) {
-                    this.openPanel(name, 'time');
+                    if (this.props[name]) {
+                        day.setHours(this.props[name].getHours(), this.props[name].getMinutes());
+                    } else {
+                        day.setHours(0, 0);
+                    }
                 }
+                this.props.onChange(name, day);
+            }
+
+            if (this.props.enableTime) {
+                this.openPanel(name, 'time');
             }
         }
     }, {
@@ -404,10 +367,9 @@ var HiDateRangePicker = function (_React$Component) {
         }
     }, {
         key: 'renderOverlay',
-        value: function renderOverlay(name, propsOverlay, staticPosition) {
+        value: function renderOverlay(name, propsOverlay) {
             var rangeOverlayProps = (0, _extends3.default)({}, propsOverlay, {
-                side: name,
-                staticPosition: staticPosition
+                side: name
             });
 
             switch (this.state[name + 'OpenedPanel']) {
@@ -425,12 +387,12 @@ var HiDateRangePicker = function (_React$Component) {
     }, {
         key: 'renderOverlayFrom',
         value: function renderOverlayFrom(propsOverlay) {
-            return this.renderOverlay('from', propsOverlay, this.props.staticPosition);
+            return this.renderOverlay('from', propsOverlay);
         }
     }, {
         key: 'renderOverlayTo',
         value: function renderOverlayTo(propsOverlay) {
-            return this.renderOverlay('to', propsOverlay, this.props.staticPosition);
+            return this.renderOverlay('to', propsOverlay);
         }
     }, {
         key: 'renderMonthPickerOverlay',
@@ -477,8 +439,7 @@ var HiDateRangePicker = function (_React$Component) {
     }, {
         key: 'render',
         value: function render() {
-            var _this6 = this,
-                _classNames;
+            var _this6 = this;
 
             var _props = this.props,
                 classes = _props.classes,
@@ -496,8 +457,7 @@ var HiDateRangePicker = function (_React$Component) {
                 to = _props.to,
                 translations = _props.translations,
                 id = _props.id,
-                staticPosition = _props.staticPosition,
-                props = (0, _objectWithoutProperties3.default)(_props, ['classes', 'disabledDays', 'disablePastDays', 'disableFutureDays', 'enableTime', 'labelFrom', 'labelTo', 'locale', 'format', 'from', 'minimumDate', 'onReset', 'to', 'translations', 'id', 'staticPosition']);
+                props = (0, _objectWithoutProperties3.default)(_props, ['classes', 'disabledDays', 'disablePastDays', 'disableFutureDays', 'enableTime', 'labelFrom', 'labelTo', 'locale', 'format', 'from', 'minimumDate', 'onReset', 'to', 'translations', 'id']);
             var _state = this.state,
                 fromCurrentMonth = _state.fromCurrentMonth,
                 toCurrentMonth = _state.toCurrentMonth;
@@ -521,20 +481,6 @@ var HiDateRangePicker = function (_React$Component) {
                 }
             };
 
-            var selectedDays = [];
-            var selected = {};
-            if (from instanceof Date) {
-                selectedDays.push(from);
-                selected.from = from;
-            }
-            if (to instanceof Date) {
-                selectedDays.push(to);
-                selected.to = to;
-            }
-            if ((0, _values2.default)(selected).length > 0) {
-                selectedDays.push(selected);
-            }
-
             var dayPickerProps = (0, _extends3.default)({
                 classNames: classes,
                 disabledDays: disabledDays,
@@ -544,7 +490,7 @@ var HiDateRangePicker = function (_React$Component) {
                 modifiers: modifiers,
                 modifiersStyles: modifiersStyles,
                 // Both are required ?
-                selectedDays: selectedDays,
+                selectedDays: [from, { from: from, to: to }],
                 todayButton: translations.today,
                 weekdayElement: _Weekday2.default
             }, props);
@@ -553,9 +499,9 @@ var HiDateRangePicker = function (_React$Component) {
             // Disable days after 'to' date if define
 
             var after = void 0;
-            if (to instanceof Date && disableFutureDays) {
+            if (to && disableFutureDays) {
                 after = to < now ? now : to;
-            } else if (to instanceof Date) {
+            } else if (to) {
                 after = to;
             } else if (disableFutureDays) {
                 after = now;
@@ -582,9 +528,9 @@ var HiDateRangePicker = function (_React$Component) {
             // Disable days before 'from' date if define
 
             var before = void 0;
-            if (from instanceof Date && disablePastDays) {
+            if (from && disablePastDays) {
                 before = from < now ? now : from;
-            } else if (from instanceof Date) {
+            } else if (from) {
                 before = from;
             } else if (disablePastDays) {
                 before = now;
@@ -616,8 +562,7 @@ var HiDateRangePicker = function (_React$Component) {
             }, props, labelFrom && {
                 label: labelFrom
             }, {
-                id: id + '-from',
-                onChange: this.handleInputChange('from')
+                id: id + '-from'
             });
 
             var toInputProps = (0, _extends3.default)({}, onReset && {
@@ -627,50 +572,35 @@ var HiDateRangePicker = function (_React$Component) {
             }, props, labelTo && {
                 label: labelTo
             }, {
-                id: id + '-to',
-                onChange: this.handleInputChange('to')
+                id: id + '-to'
             });
 
-            var toClass = (0, _classnames2.default)(classes.toInput, (_classNames = {}, (0, _defineProperty3.default)(_classNames, classes.absolute, staticPosition === true && this.state.focusedInput === 'from'), (0, _defineProperty3.default)(_classNames, classes.right4, staticPosition === true && this.state.focusedInput === 'from'), _classNames));
-
             return _react2.default.createElement(
                 'div',
-                { className: (0, _classnames2.default)(classes.root, classes.rangePickerContainer) },
+                { className: classes.root },
                 _react2.default.createElement(
                     'div',
-                    {
-                        className: classes.fromInput,
-                        onFocus: this.handleDayPickerFocus('from'),
-                        onBlur: this.handleDayPickerBlur('from')
-                    },
-                    _react2.default.createElement(
-                        'div',
-                        null,
-                        _react2.default.createElement(_DayPickerInput2.default, {
-                            ref: function ref(el) {
-                                _this6.fromInput = el;
-                            },
-                            value: from,
-                            hideOnDayClick: false,
-                            overlayComponent: this.renderOverlayFrom,
-                            dayPickerProps: fromDayPickerProps,
-                            component: _HiForm.HiTextField,
-                            inputProps: fromInputProps,
-                            format: enableTime ? format + ' HH:mm' : format,
-                            formatDate: _moment.formatDate,
-                            parseDate: _moment.parseDate,
-                            onDayChange: this.handleDayChangeFrom,
-                            placeholder: ''
-                        })
-                    )
+                    { className: classes.fromInput },
+                    _react2.default.createElement(_DayPickerInput2.default, {
+                        ref: function ref(el) {
+                            _this6.fromInput = el;
+                        },
+                        value: from,
+                        hideOnDayClick: false,
+                        overlayComponent: this.renderOverlayFrom,
+                        dayPickerProps: fromDayPickerProps,
+                        component: _HiForm.HiTextField,
+                        inputProps: fromInputProps,
+                        format: enableTime ? format + ' HH:mm' : format,
+                        formatDate: _moment.formatDate,
+                        parseDate: _moment.parseDate,
+                        onDayChange: this.handleDayChangeFrom,
+                        placeholder: ''
+                    })
                 ),
                 _react2.default.createElement(
                     'div',
-                    {
-                        className: toClass,
-                        onFocus: this.handleDayPickerFocus('to'),
-                        onBlur: this.handleDayPickerBlur('to')
-                    },
+                    { className: classes.toInput },
                     _react2.default.createElement(_DayPickerInput2.default, {
                         ref: function ref(el) {
                             _this6.toInput = el;
@@ -692,13 +622,12 @@ var HiDateRangePicker = function (_React$Component) {
         }
     }]);
     return HiDateRangePicker;
-}(_react2.default.Component);
+}(_react2.default.Component); //  weak
 
 HiDateRangePicker.defaultProps = {
     disabledDays: [],
     disablePastDays: false,
     disableFutureDays: false,
-    staticPosition: false,
     enableTime: false,
     format: 'YYYY-DD-MM',
     labelFrom: 'Start',
@@ -745,7 +674,7 @@ HiDateRangePicker.propTypes = process.env.NODE_ENV !== "production" ? {
     /**
      * Date de début sélectionnée
      */
-    from: _propTypes2.default.oneOfType([_propTypes2.default.instanceOf(Date), _propTypes2.default.string]),
+    from: _propTypes2.default.instanceOf(Date),
     /**
      * Utilisé pour construire les ids des champs from et to en les suffixant "-from" et "-to"
      */
@@ -768,28 +697,16 @@ HiDateRangePicker.propTypes = process.env.NODE_ENV !== "production" ? {
     minimumDate: _propTypes2.default.instanceOf(Date),
     /**
      * Callback à la sélection d'une date
-     * @param {string} nom de l'input
-     */
-    onBlur: _propTypes2.default.func,
-    /**
-     * Callback à la sélection d'une date
-     * @param {string} nom du champs
-     * @param {string} nouvelle valeur du champs
      */
     onChange: _propTypes2.default.func,
     /**
      * Callback au reset de l'input
-     * @param {string} nom du champs réinitialisé
      */
     onReset: _propTypes2.default.func,
-    /**
-     * Si true, le calendrier sera dans une div static plutot que dans une popper absolute
-     */
-    staticPosition: _propTypes2.default.bool,
     /**
      * Date de fin sélectionnée
      */
-    to: _propTypes2.default.oneOfType([_propTypes2.default.instanceOf(Date), _propTypes2.default.string]),
+    to: _propTypes2.default.instanceOf(Date),
     /**
      * Traductions
      */

package/HiDatePicker/HiDateRangeSelector.js

@@ -85,10 +85,10 @@ function buildDateRangeOptionByKey(key, t, format) {
             type = 'primary-highlight';
             break;
         case 'cd':
-            label = t.today;
-            from = (0, _moment2.default)().startOf('day');
-            to = (0, _moment2.default)().endOf('day');
-            info = '' + from.format(format);
+            label = t.last_24h;
+            from = (0, _moment2.default)().subtract(1, 'day');
+            to = (0, _moment2.default)();
+            info = from.calendar() + ' ' + t.to_now;
             break;
         case 'pd':
             label = t.yesterday;
@@ -100,13 +100,13 @@ function buildDateRangeOptionByKey(key, t, format) {
             label = t.current_week;
             from = (0, _moment2.default)().startOf('week');
             to = (0, _moment2.default)();
-            info = '' + t.short_week + from.format('w') + ', \n ' + from.format(format) + ' ' + t.to_now;
+            info = t.week + ' ' + from.format('w') + ', \n ' + from.format(format) + ' ' + t.to_now;
             break;
         case 'pw':
             label = t.previous_week;
             from = (0, _moment2.default)().subtract(1, 'week').startOf('week');
             to = (0, _moment2.default)().subtract(1, 'week').endOf('week');
-            info = '' + t.short_week + from.format('w') + ', ' + from.format(format) + ' ' + t.to + ' ' + to.format(format);
+            info = t.week + ' ' + from.format('w') + ', ' + from.format(format) + ' ' + t.to + ' ' + to.format(format);
             break;
         case 'cm':
             label = t.current_month;
@@ -130,7 +130,7 @@ function buildDateRangeOptionByKey(key, t, format) {
             label = t.previous_quarter;
             from = (0, _moment2.default)().subtract(1, 'quarter').startOf('quarter');
             to = (0, _moment2.default)().subtract(1, 'quarter').endOf('quarter');
-            info = from.format('YYYY') + '-' + t.short_quarter + from.format('Q') + ', ' + to.diff(from, 'days') + ' ' + t.days;
+            info = from.format('YYYY') + '-Q' + from.format('Q') + ', ' + to.diff(from, 'days') + ' ' + t.days;
             break;
         case 'cy':
             label = t.current_year;
@@ -156,8 +156,7 @@ var styles = exports.styles = function styles(theme) {
     return {
         root: {
             maxWidth: 500,
-            marginLeft: -4,
-            alignItems: 'flex-start'
+            marginLeft: -4
         },
         dateSelect: {
             paddingTop: 1,
@@ -165,9 +164,7 @@ var styles = exports.styles = function styles(theme) {
         },
         dateRangePicker: {
             width: 'calc(100% + 8px)'
-        },
-        smSelect: {},
-        smRangePicker: {}
+        }
     };
 };
 
@@ -193,43 +190,21 @@ var HiDateRangeSelector = function (_React$Component) {
                         _this.props.onChange('from', selectedOption.from.toDate());
                         _this.props.onChange('to', selectedOption.to.toDate());
                     }
-                } else {
-                    _this.setState({
-                        defaultFrom: undefined,
-                        defaultTo: undefined
-                    });
-                }
-                if (_this.props.returnSelectValue === true) {
-                    _this.props.onChange('period', value);
                 }
             };
         };
 
+        _this.state = {
+            selectedPreset: props.defaultPreset,
+            containerWidth: 0
+        };
+
         _this.handleReset = _this.handleReset.bind(_this);
         _this.handleSelectChange = _this.handleSelectChange.bind(_this);
 
         _this.options = props.availableOptionKeys.map(function (key) {
             return buildDateRangeOptionByKey(key, props.translations, props.format);
         });
-
-        var from = void 0;
-        var to = void 0;
-        if (props.defaultPreset !== 'custom') {
-            var selectedOption = _this.options.find(function (option) {
-                return option.id === props.defaultPreset;
-            });
-            if (selectedOption) {
-                from = selectedOption.from.toDate();
-                to = selectedOption.to.toDate();
-            }
-        }
-
-        _this.state = {
-            selectedPreset: props.defaultPreset,
-            containerWidth: 0,
-            defaultFrom: from,
-            defaultTo: to
-        };
         return _this;
     }
 
@@ -271,13 +246,8 @@ var HiDateRangeSelector = function (_React$Component) {
                 to = _props.to,
                 translations = _props.translations,
                 classes = _props.classes,
-                selectProps = _props.selectProps,
-                staticPosition = _props.staticPosition,
-                props = (0, _objectWithoutProperties3.default)(_props, ['disabled', 'enableTime', 'error', 'errorText', 'helperIcon', 'helperText', 'idRange', 'idSelect', 'label', 'from', 'onChange', 'required', 'to', 'translations', 'classes', 'selectProps', 'staticPosition']);
-            var _state = this.state,
-                defaultFrom = _state.defaultFrom,
-                defaultTo = _state.defaultTo,
-                selectedPreset = _state.selectedPreset;
+                props = (0, _objectWithoutProperties3.default)(_props, ['disabled', 'enableTime', 'error', 'errorText', 'helperIcon', 'helperText', 'idRange', 'idSelect', 'label', 'from', 'onChange', 'required', 'to', 'translations', 'classes']);
+            var selectedPreset = this.state.selectedPreset;
 
 
             return _react2.default.createElement(
@@ -292,8 +262,8 @@ var HiDateRangeSelector = function (_React$Component) {
                 },
                 _react2.default.createElement(
                     _Grid2.default,
-                    { item: true, xs: 12, sm: 4, classes: { 'grid-sm-4': classes.smSelect } },
-                    _react2.default.createElement(_HiSelect.HiSelectField, (0, _extends3.default)({
+                    { item: true, xs: 12, sm: 4 },
+                    _react2.default.createElement(_HiSelect.HiSelectField, {
                         disabled: disabled,
                         error: error,
                         errorText: errorText,
@@ -308,38 +278,26 @@ var HiDateRangeSelector = function (_React$Component) {
                         translations: translations,
                         value: selectedPreset,
                         containerWidth: this.state.containerWidth,
-                        classes: { root: classes.dateSelect },
-                        staticPosition: staticPosition
-                    }, selectProps))
+                        classes: { root: classes.dateSelect }
+                    })
                 ),
                 _react2.default.createElement(
                     _Grid2.default,
-                    { item: true, xs: 12, sm: 8, classes: { 'grid-sm-8': classes.smRangePicker } },
+                    { item: true, xs: 12, sm: 8 },
                     _react2.default.createElement(_HiDateRangePicker2.default, (0, _extends3.default)({
                         classes: { root: classes.dateRangePicker },
                         id: idRange,
-                        from: from || defaultFrom,
-                        to: to || defaultTo,
+                        from: from,
+                        to: to,
                         enableTime: enableTime,
                         onChange: onChange,
                         onReset: this.handleReset,
                         disabled: disabled || selectedPreset !== 'custom',
-                        translations: translations,
-                        staticPosition: staticPosition
+                        translations: translations
                     }, props))
                 )
             );
         }
-    }], [{
-        key: 'getDerivedStateFromProps',
-        value: function getDerivedStateFromProps(props, state) {
-            if (props.defaultPreset && props.returnSelectValue) {
-                return {
-                    selectedPreset: props.defaultPreset
-                };
-            }
-            return null;
-        }
     }]);
     return HiDateRangeSelector;
 }(_react2.default.Component);
@@ -348,23 +306,22 @@ HiDateRangeSelector.defaultProps = {
     availableOptionKeys: ['cd', 'pd', 'cw', 'pw', 'cm', 'pm', 'cq', 'pq', 'cy', 'custom'],
     defaultPreset: 'cd',
     enableTime: false,
-    returnSelectValue: false,
-    staticPosition: false,
     locale: 'fr-FR',
     format: 'YYYY-DD-MM',
     translations: {
-        today: 'Today',
+        today: 'today',
         hour: 'Hour',
         minute: 'Minute',
         month: 'Month',
         quarter: 'Quarter',
         week: 'Week',
-        short_week: 'W',
-        short_quarter: 'Q',
         year: 'Year',
+
         days: 'days',
+
         custom_period: 'Custom Period',
         yesterday: 'Yesterday',
+        last_24h: 'Last 24h',
         to: 'to',
         to_now: 'to now',
         current_week: 'Current Week',
@@ -412,7 +369,7 @@ HiDateRangeSelector.propTypes = process.env.NODE_ENV !== "production" ? {
     /**
      * Date de début sélectionnée
      */
-    from: _propTypes2.default.oneOfType([_propTypes2.default.instanceOf(Date), _propTypes2.default.string]),
+    from: _propTypes2.default.instanceOf(Date),
     /**
      * Si "true", le texte d'aide s'affichera seulement au clic sur l'icône "Information"
      */
@@ -445,22 +402,10 @@ HiDateRangeSelector.propTypes = process.env.NODE_ENV !== "production" ? {
      * true si champs obligatoire
      */
     required: _propTypes2.default.bool,
-    /**
-     * Retourne la valeur du select de la période au change du select
-     */
-    returnSelectValue: _propTypes2.default.bool.isRequired,
-    /**
-     * Props passées au HiSelectField
-     */
-    selectProps: _propTypes2.default.object,
-    /**
-     * Si true, le calendrier sera dans une div static plutot que dans une popper absolute
-     */
-    staticPosition: _propTypes2.default.bool,
     /**
      * Date de fin sélectionnée
      */
-    to: _propTypes2.default.oneOfType([_propTypes2.default.instanceOf(Date), _propTypes2.default.string]),
+    to: _propTypes2.default.instanceOf(Date),
     /**
      * Traductions
      */

package/HiDatePicker/Overlays/CustomOverlayLayout.js

@@ -98,11 +98,9 @@ var CustomOverlayLayout = function CustomOverlayLayout(_ref) {
 
     var paperClass = (0, _classnames2.default)(classes.paper, (_classNames = {}, (0, _defineProperty3.default)(_classNames, classes.left, side === 'from'), (0, _defineProperty3.default)(_classNames, classes.right, side === 'to'), _classNames));
 
-    var paperProps = (0, _extends3.default)({}, props);
-
     return _react2.default.createElement(
         _Paper2.default,
-        { className: paperClass, onBlur: paperProps.onBlur, onFocus: paperProps.onFocus },
+        { className: paperClass },
         _react2.default.createElement(
             'div',
             { className: classes.overlay },