explicit trigger handler for arrows, so that they can define their ow…

…n events
onefinestay · Jul 31, 2015 · 1286c66 · 1286c66
1 parent 228a4fd
commit 1286c66
Show file tree

Hide file tree

Showing 5 changed files with 13 additions and 22 deletions.
diff --git a/dist/DateRangePicker.js b/dist/DateRangePicker.js
@@ -126,7 +126,7 @@ var DateRangePicker = _reactAddons2['default'].createClass({
 
     this.setState({
       dateStates: this.state.dateStates && _immutable2['default'].is(this.state.dateStates, nextDateStates) ? this.state.dateStates : nextDateStates,
-      enabledRange: this.state.enabledRange && _immutable2['default'].is(this.state.enabledRange, nextEnabledRange) ? this.state.enabledRange : nextEnabledRange });
+      enabledRange: this.state.enabledRange && this.state.enabledRange.isSame(nextEnabledRange) ? this.state.enabledRange : nextEnabledRange });
   },
 
   getInitialState: function getInitialState() {
@@ -419,12 +419,6 @@ var DateRangePicker = _reactAddons2['default'].createClass({
     }
   },
 
-  moveBackIfSelecting: function moveBackIfSelecting() {
-    if (this.state.selectedStartDate) {
-      this.moveBack();
-    }
-  },
-
   canMoveForward: function canMoveForward() {
     if (this.getMonthDate().add(this.props.numberOfCalendars, 'months').isAfter(this.state.enabledRange.end)) {
       return false;
@@ -444,12 +438,6 @@ var DateRangePicker = _reactAddons2['default'].createClass({
     }
   },
 
-  moveForwardIfSelecting: function moveForwardIfSelecting() {
-    if (this.state.selectedStartDate) {
-      this.moveForward();
-    }
-  },
-
   changeYear: function changeYear(year) {
     var _state = this.state;
     var enabledRange = _state.enabledRange;
@@ -560,9 +548,9 @@ var DateRangePicker = _reactAddons2['default'].createClass({
     return _reactAddons2['default'].createElement(
       'div',
       { className: this.cx({ element: null }) },
-      _reactAddons2['default'].createElement(PaginationArrowComponent, { direction: 'previous', onMouseEnter: this.moveBackIfSelecting, onClick: this.moveBack, disabled: !this.canMoveBack() }),
+      _reactAddons2['default'].createElement(PaginationArrowComponent, { direction: 'previous', onTrigger: this.moveBack, disabled: !this.canMoveBack() }),
       calendars.toJS(),
-      _reactAddons2['default'].createElement(PaginationArrowComponent, { direction: 'next', onMouseEnter: this.moveForwardIfSelecting, onClick: this.moveForward, disabled: !this.canMoveForward() }),
+      _reactAddons2['default'].createElement(PaginationArrowComponent, { direction: 'next', onTrigger: this.moveForward, disabled: !this.canMoveForward() }),
       helpMessage ? _reactAddons2['default'].createElement(
         'span',
         { className: this.cx({ element: 'HelpMessage' }) },

diff --git a/dist/PaginationArrow.js b/dist/PaginationArrow.js
@@ -29,6 +29,7 @@ var PaginationArrow = _reactAddons2['default'].createClass({
 
   propTypes: {
     disabled: _reactAddons2['default'].PropTypes.bool,
+    onTrigger: _reactAddons2['default'].PropTypes.func,
     direction: _reactAddons2['default'].PropTypes.oneOf(['next', 'previous']) },
 
   getDefaultProps: function getDefaultProps() {
@@ -40,8 +41,9 @@ var PaginationArrow = _reactAddons2['default'].createClass({
     var _props = this.props;
     var disabled = _props.disabled;
     var direction = _props.direction;
+    var onTrigger = _props.onTrigger;
 
-    var props = _objectWithoutProperties(_props, ['disabled', 'direction']);
+    var props = _objectWithoutProperties(_props, ['disabled', 'direction', 'onTrigger']);
 
     var modifiers = _defineProperty({}, direction, true);
     var states = { disabled: disabled };
@@ -57,7 +59,7 @@ var PaginationArrow = _reactAddons2['default'].createClass({
 
     return _reactAddons2['default'].createElement(
       'div',
-      _extends({ className: this.cx(elementOpts) }, props),
+      _extends({ className: this.cx(elementOpts) }, props, { onClick: onTrigger }),
       _reactAddons2['default'].createElement('div', { className: this.cx(iconOpts) })
     );
   } });

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-daterange-picker",
-  "version": "0.10.0",
+  "version": "0.11.0",
   "description": "A React based date range picker",
   "author": "Jonathan Kim <jonathan.kim@onefinestay.com>",
   "contributors": [

diff --git a/src/DateRangePicker.jsx b/src/DateRangePicker.jsx
@@ -502,9 +502,9 @@ const DateRangePicker = React.createClass({
 
     return (
       <div className={this.cx({element: null})}>
-        <PaginationArrowComponent direction="previous" onClick={this.moveBack} disabled={!this.canMoveBack()} />
+        <PaginationArrowComponent direction="previous" onTrigger={this.moveBack} disabled={!this.canMoveBack()} />
         {calendars.toJS()}
-        <PaginationArrowComponent direction="next" onClick={this.moveForward} disabled={!this.canMoveForward()} />
+        <PaginationArrowComponent direction="next" onTrigger={this.moveForward} disabled={!this.canMoveForward()} />
         {helpMessage ? <span className={this.cx({element: 'HelpMessage'})}>{helpMessage}</span> : null}
         {showLegend ? <Legend stateDefinitions={stateDefinitions} selectedLabel={selectedLabel} /> : null}
       </div>

diff --git a/src/PaginationArrow.jsx b/src/PaginationArrow.jsx
@@ -10,6 +10,7 @@ const PaginationArrow = React.createClass({
 
   propTypes: {
     disabled: React.PropTypes.bool,
+    onTrigger: React.PropTypes.func,
     direction: React.PropTypes.oneOf(['next', 'previous']),
   },
 
@@ -20,7 +21,7 @@ const PaginationArrow = React.createClass({
   },
 
   render() {
-    let {disabled, direction, ...props} = this.props;
+    let {disabled, direction, onTrigger, ...props} = this.props;
     let modifiers = {[direction]: true};
     let states = {disabled};
 
@@ -36,7 +37,7 @@ const PaginationArrow = React.createClass({
     };
 
     return (
-      <div className={this.cx(elementOpts)} {...props}>
+      <div className={this.cx(elementOpts)} {...props} onClick={onTrigger}>
         <div className={this.cx(iconOpts)} />
       </div>
     );