[added] onClick handler to <Link />

Author: Thomas Boyt

docs/api/components/Link.md

@@ -27,6 +27,13 @@ name through the link's properties to the resulting url.
 The className a `Link` receives when it's route is active. Defaults to
 `active`.
 
+### `onClick`
+
+A custom handler for the click event. Works just like a handler on an `<a>`
+tag - calling `e.preventDefault()` or returning `false` will prevent the
+transition from firing, while `e.stopPropagation()` will prevent the event
+from bubbling.
+
 ### *others*
 
 You can also pass props you'd like to be on the `<a>` such as a title, id, or className.

modules/components/Link.js

@@ -52,7 +52,8 @@ var Link = React.createClass({
   propTypes: {
     to: React.PropTypes.string.isRequired,
     activeClassName: React.PropTypes.string.isRequired,
-    query: React.PropTypes.object
+    query: React.PropTypes.object,
+    onClick: React.PropTypes.func
   },
 
   getDefaultProps: function () {
@@ -108,13 +109,23 @@ var Link = React.createClass({
     });
   },
 
-  handleClick: function (event) {
+  handleClick: function(event) {
+    var allowTransition = true;
+    var ret;
+
+    if (this.props.onClick)
+      ret = this.props.onClick(event);
+
     if (isModifiedEvent(event) || !isLeftClick(event))
       return;
 
+    if (ret === false || event.preventDefaulted === true)
+      allowTransition = false;
+
     event.preventDefault();
 
-    transitionTo(this.props.to, this.getParams(), this.props.query);
+    if (allowTransition)
+      transitionTo(this.props.to, this.getParams(), this.props.query);
   },
 
   render: function () {