@spectrum-web-components/tabs - npm Package Compare versions

Comparing version 0.1.0 to 0.1.1

CHANGELOG.md

@@ -6,2 +6,8 @@ # Change Log
 
+## [0.1.1](https://github.com/adobe/spectrum-web-components/compare/@spectrum-web-components/tabs@0.1.0...@spectrum-web-components/tabs@0.1.1) (2020-07-22)
+
+### Bug Fixes
+
+-   **tabs:** correct entry focus element ([64407d3](https://github.com/adobe/spectrum-web-components/commit/64407d37fd09d3d598253a66c3b342882d51a826))
+
 # 0.1.0 (2020-07-17)
@@ -8,0 +14,0 @@

package.json

@@ -21,3 +21,3 @@ {
     ],
-    "version": "0.1.0",
+    "version": "0.1.1",
     "description": "",
@@ -58,3 +58,3 @@ "main": "src/index.js",
     "dependencies": {
-        "@spectrum-web-components/shared": "^0.5.0",
+        "@spectrum-web-components/shared": "^0.5.1",
         "lit-element": "^2.1.0",
@@ -64,3 +64,3 @@ "lit-html": "^1.0.0",
     },
-    "gitHead": "75044c0b0aeafaf7c6d90c32c7b4ba1fc9d3bc28"
+    "gitHead": "6525377d6526487105bea9f5b731b26279051968"
 }

src/Tabs.d.ts

@@ -24,3 +24,3 @@ import { CSSResultArray, TemplateResult, PropertyValues } from 'lit-element';
     private tabs;
-    get focusElement(): Tab;
+    get focusElement(): Tab | Tabs;
     constructor();
@@ -27,0 +27,0 @@ protected manageAutoFocus(): void;

src/Tabs.js

@@ -71,3 +71,3 @@ /*
             this.selectTarget(target);
-            if (this.shouldApplyFocusVisible) {
+            if (this.shouldApplyFocusVisible && event.composedPath()[0] !== this) {
                 /* Trick :focus-visible polyfill into thinking keyboard based focus */
@@ -134,4 +134,7 @@ this.dispatchEvent(new KeyboardEvent('keydown', {
     get focusElement() {
-        return (this.querySelector('[tabindex="0"]') ||
-            this.querySelector('sp-tab'));
+        const focusElement = this.tabs.find((tab) => tab.selected);
+        if (focusElement) {
+            return focusElement;
+        }
+        return this.tabs[0] || this;
     }
@@ -138,0 +141,0 @@ manageAutoFocus() {

src/Tabs.ts

@@ -78,5 +78,8 @@ /*
 
-    public get focusElement(): Tab {
-        return (this.querySelector('[tabindex="0"]') ||
-            this.querySelector('sp-tab')) as Tab;
+    public get focusElement(): Tab | Tabs {
+        const focusElement = this.tabs.find((tab) => tab.selected);
+        if (focusElement) {
+            return focusElement;
+        }
+        return this.tabs[0] || this;
     }
@@ -192,3 +195,3 @@
         this.selectTarget(target);
-        if (this.shouldApplyFocusVisible) {
+        if (this.shouldApplyFocusVisible && event.composedPath()[0] !== this) {
             /* Trick :focus-visible polyfill into thinking keyboard based focus */
@@ -195,0 +198,0 @@ this.dispatchEvent(

No alert changes

Improved metrics

Total package byte prevSize

161038

increased by8.19%

Number of package files

44

increased by2.33%

Lines of code

1804

increased by0.33%

Dependency changes

• Updated@spectrum-web-components/shared@^0.5.1