minor changes

Author: johanrosenson

playground.css

@@ -157,6 +157,10 @@ section a:focus {
     background-color: var(--amber-100);
 }
 
+section pre {
+    font-size: 16px;
+}
+
 section div[tabindex] {
     padding: 10px;
     font-size: 16px;

src/index.ts

@@ -141,9 +141,9 @@ const tabwrap = (rootElement : HTMLElement) : void => {
                 ? event.key === 'Tab'
                 : event.keyCode === 9;
             shiftKeyDetected = event.shiftKey;
-            activeElement = event.target !== null
-                ? event.target as HTMLElement
-                : null;
+            // activeElement = event.target !== null
+            //     ? event.target as HTMLElement
+            //     : null;
         };
 
         // @ts-ignore no overload matches
@@ -180,17 +180,17 @@ const tabwrap = (rootElement : HTMLElement) : void => {
             setUpDocumentListeners();
         }
 
-        if (tabKeyDetected && shiftKeyDetected) {
-            if (activeElement !== null && activeElement === getFirstTabbableElement()) {
+        if (tabKeyDetected && ! shiftKeyDetected) {
+            if (activeElement !== null && activeElement === getLastTabbableElement()) {
                 event.preventDefault();
 
-                focusLastTabbableElement();
+                focusFirstTabbableElement();
             }
-        } else if (tabKeyDetected && ! shiftKeyDetected) {
-            if (activeElement !== null && activeElement === getLastTabbableElement()) {
+        } else if (tabKeyDetected && shiftKeyDetected) {
+            if (activeElement !== null && activeElement === getFirstTabbableElement()) {
                 event.preventDefault();
 
-                focusFirstTabbableElement();
+                focusLastTabbableElement();
             }
         }
     });