From cd8c6da33aa254a5658875f1dca74922d9131f2b Mon Sep 17 00:00:00 2001
From: Tobias <tobias@tujo.no>
Date: Fri, 4 Jan 2019 15:36:41 +0100
Subject: [PATCH] feat: make it possible to set a button element as not focus
 able with tabindex="-1"

---
 packages/dnb-ui-lib/src/components/button/Button.js | 12 +++++++-----
 packages/dnb-ui-lib/src/shared/component-helper.js  |  8 ++++++++
 2 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/packages/dnb-ui-lib/src/components/button/Button.js b/packages/dnb-ui-lib/src/components/button/Button.js
index 59e4f212106..d2ca25c850c 100644
--- a/packages/dnb-ui-lib/src/components/button/Button.js
+++ b/packages/dnb-ui-lib/src/components/button/Button.js
@@ -138,10 +138,12 @@ export default class Button extends PureComponent {
       disabled,
       text,
       icon,
-      icon_position
+      icon_position,
+      href,
+      ...props
     } = this.props
 
-    let { variant, size } = this.props
+    let { variant, size } = props
 
     // if only has Icon, then resize it and define it as secondary
     if (!text && icon) {
@@ -174,7 +176,7 @@ export default class Button extends PureComponent {
       id,
       class_name,
       className,
-      this.props.href ? 'no-underline no-underline-hover' : null
+      href ? 'no-underline no-underline-hover' : null
     )
 
     const params = {
@@ -194,8 +196,8 @@ export default class Button extends PureComponent {
     // also used for code markup simulation
     validateDOMAttributes(this.props, params)
 
-    return this.props.href ? (
-      <a href={this.props.href} ref={this._ref} {...params}>
+    return href ? (
+      <a href={href} ref={this._ref} {...params}>
         <Content {...this.props} content={content} />
       </a>
     ) : (
diff --git a/packages/dnb-ui-lib/src/shared/component-helper.js b/packages/dnb-ui-lib/src/shared/component-helper.js
index 2a8b5ce72c8..8e491822ec0 100644
--- a/packages/dnb-ui-lib/src/shared/component-helper.js
+++ b/packages/dnb-ui-lib/src/shared/component-helper.js
@@ -73,6 +73,14 @@ export const validateDOMAttributes = (props, params) => {
     delete params.disabled
   }
 
+  if (props && props.tabindex) {
+    let tabIndex = props.tabindex
+    if (tabIndex === 'off') {
+      tabIndex = '-1'
+    }
+    params['tabIndex'] = tabIndex
+  }
+
   // add web component event handler
   if (props && typeof props.on_click === 'function') {
     params['onClick'] = props.on_click