update callback

README.md

@@ -31,11 +31,37 @@ All attributes are optional.
 
 * `total`: default 5
 * `rating`: default 0
-* `limit`: default same as `total`. Sets the maximum rating value available.
-* `onRate`: `function(rating, lastRating)`. Callback to retrieve rating value.
+* `limit`: default value is same as `total`.
+* `onRate`: `function(e)`. Callback to retrieve rating value.
 * `interactive`: default `true`. Create a read-only rater by setting this attribute to `false`.
 
-Notice: `onRate` is called on mousemove/mouseenter/click/mouseleave. Only for click `lastRating` has a value.
+Notice:
+`onRate` is called on mousemove/mouseenter/click/mouseleave.
+
+For mousemove/mouseenter/mouseleave, the structure of argument `e` is:
+```
+{
+  rating: Number // the rating value,
+  originalEvent: Event
+}
+```
+
+For click, the structure of `e` is:
+```
+{
+  rating: Number // the rating value,
+  lastRating: Number // the last rating value,
+  originalEvent: Event
+}
+```
+In some scenarios, you may want to delete the rating if user rate a same value.
+```javascript
+onRate(e) {
+  if (e.originalEvent.type === 'click' && e.rating === e.lastRating) {
+    // set prop of Rater to 0
+  }
+}
+```
 
 ## Styling
 

example/index.js

@@ -31,14 +31,14 @@ class Example extends Component {
       rating: 0
     }
   }
-  handleRate(rating, lastRating) {
+  handleRate(e) {
     this.setState({
-      rating
+      rating: e.rating
     })
     // lastRating is not undefined,
     // which means user have rated
-    if (lastRating !== void 0) {
-      alert('You rated ' + rating)
+    if (e.lastRating !== void 0) {
+      alert('You rated ' + e.rating)
     }
   }
   render() {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-rater",
-  "version": "0.3.3",
+  "version": "0.3.4",
   "description": "A star rater in react.js",
   "main": "lib/index.js",
   "directories": {

src/index.js

@@ -19,11 +19,16 @@ export default class Rater extends Component {
   }
   handleMouseEnter(e) {
     let { rating } = getRatingFromDOMEvent(e, this.props)
+      , callback = this.props.onRate
     if (rating > 0) {
       this.setState({
         rating: 0,
         isRating: true
       })
+      callback && callback({
+        originalEvent: e,
+        rating
+      })
     }
   }
   handleMouseMove(e) {
@@ -34,17 +39,23 @@ export default class Rater extends Component {
         rating: rating,
         isRating: true
       })
-      callback && callback(rating)
+      callback && callback({
+        originalEvent: e,
+        rating
+      })
     }
   }
-  handleMouseLeave() {
+  handleMouseLeave(e) {
     let callback = this.props.onRate
       , state = this.state
-    callback && callback(state.lastRating)
     this.setState({
       rating: state.lastRating,
       isRating: false
     })
+    callback && callback({
+      originalEvent: e,
+      rating: state.lastRating
+    })
   }
   handleClick(e) {
     let { index, rating } = getRatingFromDOMEvent(e, this.props)
@@ -57,7 +68,11 @@ export default class Rater extends Component {
       rating,
       lastRating: rating
     })
-    callback && callback(rating, lastRating)
+    callback && callback({
+      originalEvent: e,
+      rating,
+      lastRating
+    })
   }
   render() {
     let { total, limit, rating, interactive, children, ...rest } = this.props