fix(onClick): do not replace the browser's behavior on special clicks

It seems to be a common practice to not do anything if one of the
special (shift, ctrl, alt or meta) keys are down:
https://github.com/search?q=react+metakey+ctrlkey+preventdefault&type=Code&utf8=%E2%9C%93

Fix #278

Author: redox

components/Pagination/Pagination.js

@@ -1,6 +1,7 @@
 var React = require('react');
 var forEach = require('lodash/collection/forEach');
 var defaultsDeep = require('lodash/object/defaultsDeep');
+var {isSpecialClick} = require('../../lib/utils.js');
 
 var Paginator = require('./Paginator');
 var PaginationLink = require('./PaginationLink');
@@ -14,6 +15,11 @@ class Pagination extends React.Component {
   }
 
   handleClick(pageNumber, event) {
+    if (isSpecialClick(event)) {
+      // do not alter the default browser behavior
+      // if one special key is down
+      return;
+    }
     event.preventDefault();
     this.props.setCurrentPage(pageNumber);
   }

components/Pagination/PaginationLink.js

@@ -1,11 +1,6 @@
 var React = require('react');
 
 class PaginationLink extends React.Component {
-  handleClick(page, e) {
-    e.preventDefault();
-    this.props.setCurrentPage(page);
-  }
-
   render() {
     var {className, label, ariaLabel, handleClick, url} = this.props;
 

components/RefinementList.js

@@ -4,6 +4,9 @@ var cx = require('classnames');
 
 var Template = require('./Template');
 
+var {isSpecialClick} = require('../lib/utils.js');
+
+
 class RefinementList extends React.Component {
   refine(value) {
     this.props.toggleRefinement(value);
@@ -53,6 +56,12 @@ class RefinementList extends React.Component {
   // Finally, we always stop propagation of the event to avoid multiple levels RefinementLists to fail: click
   // on child would click on parent also
   handleClick(value, e) {
+    if (isSpecialClick(e)) {
+      // do not alter the default browser behavior
+      // if one special key is down
+      return;
+    }
+
     if (e.target.tagName === 'INPUT') {
       this.refine(value);
       return;

lib/utils.js

@@ -1,7 +1,8 @@
 var utils = {
   getContainerNode,
   bemHelper,
-  prepareTemplateProps
+  prepareTemplateProps,
+  isSpecialClick
 };
 
 function getContainerNode(selectorOrHTMLElement) {
@@ -28,6 +29,10 @@ function isDomElement(o) {
   return o instanceof HTMLElement || o && o.nodeType > 0;
 }
 
+function isSpecialClick(event) {
+  return event.altKey || event.ctrlKey || event.metaKey || event.shiftKey;
+}
+
 function bemHelper(block) {
   return function(element, modifier) {
     if (!element) {