Adds disabled prop to <Link> and <NavLink>

Fixes #8

Author: birdofpreyru

CHANGELOG.md

@@ -5,6 +5,8 @@
 - NPM dependencies updated to the latest versions. In particular:
   - Babel updated from v6 to v7;
   - Misc related fixes.
+- Support of `npm link` for lib development;
+- `disabled` prop for `<Link>` and `<NavLink>`;
 
 ### v0.8.2
 - Adds [**`Modal`**](docs/modal.md) component.

__tests__/shared/components/__snapshots__/GenericLink.jsx.snap

@@ -2,7 +2,8 @@
 
 exports[`Absolute link, starting with http:// 1`] = `
 <a
-  className={null}
+  className="src-shared-components-GenericLink-___style__link___WVE0s"
+  disabled={false}
   href="http://www.domain.com/test"
   onClick={null}
   onMouseDown={null}
@@ -15,7 +16,8 @@ exports[`Absolute link, starting with http:// 1`] = `
 
 exports[`Absolute link, starting with https:// 1`] = `
 <a
-  className={null}
+  className="src-shared-components-GenericLink-___style__link___WVE0s"
+  disabled={false}
   href="https://www.domain.com/test"
   onClick={[Function]}
   onMouseDown={null}
@@ -28,7 +30,8 @@ exports[`Absolute link, starting with https:// 1`] = `
 
 exports[`Anchor link 1`] = `
 <a
-  className={null}
+  className="src-shared-components-GenericLink-___style__link___WVE0s"
+  disabled={false}
   href="#anchor"
   onClick={null}
   onMouseDown={null}
@@ -45,13 +48,14 @@ exports[`Relative link 1`] = `
   onClick={[Function]}
   type="button"
 >
-  {"to":"http/relative/link","className":null,"onMouseDown":null,"replace":false,"children":"RELATIVE LINK"}
+  {"to":"http/relative/link","className":null,"disabled":false,"onMouseDown":null,"replace":false,"children":"RELATIVE LINK"}
 </button>
 `;
 
 exports[`Relative link, with \`enforceA\` 1`] = `
 <a
-  className={null}
+  className="src-shared-components-GenericLink-___style__link___WVE0s"
+  disabled={false}
   href="/relative/link"
   onClick={null}
   onMouseDown={null}
@@ -64,7 +68,8 @@ exports[`Relative link, with \`enforceA\` 1`] = `
 
 exports[`Relative link, with \`openNewTab\` 1`] = `
 <a
-  className={null}
+  className="src-shared-components-GenericLink-___style__link___WVE0s"
+  disabled={false}
   href="relative/link"
   onClick={null}
   onMouseDown={null}

__tests__/shared/components/__snapshots__/Link.jsx.snap

@@ -3,6 +3,7 @@
 exports[`Matches snapshots 1`] = `
 <GenericLink
   className={null}
+  disabled={false}
   enforceA={false}
   onClick={null}
   onMouseDown={null}

docs/link-and-navlink.md

@@ -35,6 +35,7 @@ Router's components, along with some additional props:
 inside the link;
 - **`className`** — *String* — Optional. Class(es) to apply to the
 rendered link;
+- **`disabled`** — *Boolean* — Optional. Disables the link;
 - **`enforceA`** — *Boolean* — Optional. If *true* enforces
 rendering of the link as a simple `<a>` element;
 - **`onClick`** &mdash; *Function* &mdash; Optional. An event handler to trigger
@@ -56,6 +57,7 @@ additional ones, coming from React Router:
 the rendered link when it is active;
 - **`activeStyle`** &mdash; *String* &mdash; Optional. Styles to apply to the
 rendered link when it is active;
+- **`disabled`** &mdash; *Boolean* &mdash; Optional. Disables the link;
 - **`exact`** &mdash; *Boolean* &mdash; Optional. When *true*, the active
 class/style will only be applied if the location is matched exactly;
 - **`isActive`** &mdash; *Function* &mdash; Optional. A function to add extra

src/shared/components/GenericLink.jsx renamed to src/shared/components/GenericLink/index.jsx

@@ -12,10 +12,13 @@ import _ from 'lodash';
 import PT from 'prop-types';
 import React from 'react';
 
+import './style.scss';
+
 export default function GenericLink(props) {
   const {
     children,
     className,
+    disabled,
     enforceA,
     onClick,
     onMouseDown,
@@ -30,14 +33,16 @@ export default function GenericLink(props) {
    * - It should be opened in a new tab;
    * - It is an absolte URL (starts with http:// or https://);
    * - It is anchor link (starts with #). */
-  if (enforceA || openNewTab || to.match(/^(#|(https?|mailto):)/)) {
+  if (disabled || enforceA || openNewTab || to.match(/^(#|(https?|mailto):)/)) {
     return (
       <a
         className={className}
+        disabled={disabled}
         href={to}
-        onClick={onClick}
-        onMouseDown={onMouseDown}
+        onClick={disabled ? e => e.preventDefault() : onClick}
+        onMouseDown={disabled ? e => e.preventDefault() : onMouseDown}
         rel="noopener noreferrer"
+        styleName="link"
         target={openNewTab ? '_blank' : ''}
       >
         {children}
@@ -69,6 +74,7 @@ export default function GenericLink(props) {
 GenericLink.defaultProps = {
   children: null,
   className: null,
+  disabled: false,
   enforceA: false,
   onClick: null,
   onMouseDown: null,
@@ -80,6 +86,7 @@ GenericLink.defaultProps = {
 GenericLink.propTypes = {
   children: PT.node,
   className: PT.string,
+  disabled: PT.bool,
   enforceA: PT.bool,
   onClick: PT.func,
   onMouseDown: PT.func,

src/shared/components/GenericLink/style.scss

@@ -0,0 +1,3 @@
+.link[disabled] {
+  cursor: not-allowed;
+}