From c2fe50f4bd3488cbb1ec1235a295ea3b1d0a0fc4 Mon Sep 17 00:00:00 2001
From: Marius Olbertz <marius.olbertz@gmail.com>
Date: Tue, 18 Apr 2017 08:35:49 +0200
Subject: [PATCH] Make Tabs contents focusable using tab.

Setting tabindex on properly now prevents tabs from being focused when using tabs rather than the content.
---
 js/foundation.tabs.js | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/js/foundation.tabs.js b/js/foundation.tabs.js
index bac091a11..5ba52f311 100644
--- a/js/foundation.tabs.js
+++ b/js/foundation.tabs.js
@@ -60,7 +60,8 @@ class Tabs {
         'role': 'tab',
         'aria-controls': hash,
         'aria-selected': isActive,
-        'id': linkId
+        'id': linkId,
+        'tabindex': isActive ? '0' : '-1'
       });
 
       $tabContent.attr({
@@ -276,7 +277,10 @@ class Tabs {
 
       $target.addClass(`${this.options.linkActiveClass}`);
 
-      $tabLink.attr({'aria-selected': 'true'});
+      $tabLink.attr({
+        'aria-selected': 'true',
+        'tabindex': '0'
+      });
 
       $targetContent
         .addClass(`${this.options.panelActiveClass}`)
@@ -292,7 +296,10 @@ class Tabs {
     var $target_anchor = $target
       .removeClass(`${this.options.linkActiveClass}`)
       .find('[role="tab"]')
-      .attr({ 'aria-selected': 'false' });
+      .attr({ 
+        'aria-selected': 'false',
+        'tabindex': -1
+      });
 
     $(`#${$target_anchor.attr('aria-controls')}`)
       .removeClass(`${this.options.panelActiveClass}`)
-- 
2.47.2