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

Comparing version 0.7.5-alpha.85 to 0.7.5-alpha.169

package.json

@@ -21,3 +21,3 @@ {
     ],
-    "version": "0.7.5-alpha.85+d9ef1386",
+    "version": "0.7.5-alpha.169+a396c860",
     "description": "",
@@ -48,7 +48,7 @@ "main": "./src/index.js",
     "dependencies": {
-        "@spectrum-web-components/base": "^0.1.4-alpha.85+d9ef1386",
+        "@spectrum-web-components/base": "^0.1.4-alpha.169+a396c860",
         "focus-visible": "^5.1.0",
         "tslib": "^2.0.0"
     },
-    "gitHead": "d9ef13866edfb98e309914ae7582b807bee5d241"
+    "gitHead": "a396c860b62c2f94b2e9fcd015a4962a6c57af36"
 }

src/focusable.d.ts

@@ -27,2 +27,3 @@ import { SpectrumElement, PropertyValues } from '@spectrum-web-components/base';
     set tabIndex(tabIndex: number);
+    private _tabIndex;
     private manageFocusElementTabindex;
@@ -29,0 +30,0 @@ private manipulatingTabindex;

src/focusable.js

@@ -32,2 +32,3 @@ import { __decorate } from "tslib";
         this.autofocus = false;
+        this._tabIndex = 0;
         this.manipulatingTabindex = false;
@@ -40,2 +41,8 @@ }
     get tabIndex() {
+        if (this.focusElement === this) {
+            const tabindex = this.hasAttribute('tabindex')
+                ? Number(this.getAttribute('tabindex'))
+                : NaN;
+            return !isNaN(tabindex) ? tabindex : -1;
+        }
         const tabIndexAttribute = parseFloat(this.hasAttribute('tabindex')
@@ -51,3 +58,3 @@ ? this.getAttribute('tabindex') || '0'
         // use host tabindex as the cache.
-        if (!this.focusElement || this.focusElement.isSameNode(this)) {
+        if (!this.focusElement) {
             return tabIndexAttribute;
@@ -66,2 +73,10 @@ }
         }
+        if (this.focusElement === this) {
+            if (tabIndex !== this.tabIndex) {
+                this._tabIndex = tabIndex;
+                const tabindex = this.disabled ? '-1' : '' + tabIndex;
+                this.setAttribute('tabindex', tabindex);
+            }
+            return;
+        }
         // All code paths are about to address the host tabindex without side effect.
@@ -110,6 +125,16 @@ this.manipulatingTabindex = true;
         }
-        this.focusElement.focus();
+        if (this.focusElement !== this) {
+            this.focusElement.focus();
+        }
+        else {
+            HTMLElement.prototype.focus.apply(this);
+        }
     }
     blur() {
-        this.focusElement.blur();
+        if (this.focusElement !== this) {
+            this.focusElement.blur();
+        }
+        else {
+            HTMLElement.prototype.blur.apply(this);
+        }
     }
@@ -120,3 +145,8 @@ click() {
         }
-        this.focusElement.click();
+        if (this.focusElement !== this) {
+            this.focusElement.click();
+        }
+        else {
+            HTMLElement.prototype.click.apply(this);
+        }
     }
@@ -153,2 +183,4 @@ manageAutoFocus() {
     async handleDisabledChanged(disabled, oldDisabled) {
+        const canSetDisabled = () => this.focusElement !== this &&
+            typeof this.focusElement.disabled !== 'undefined';
         if (disabled) {
@@ -158,7 +190,7 @@ this.manipulatingTabindex = true;
             await this.updateComplete;
-            if (typeof this.focusElement.disabled === 'undefined') {
-                this.setAttribute('aria-disabled', 'true');
+            if (canSetDisabled()) {
+                this.focusElement.disabled = true;
             }
             else {
-                this.focusElement.disabled = true;
+                this.setAttribute('aria-disabled', 'true');
             }
@@ -168,10 +200,15 @@ }
             this.manipulatingTabindex = true;
-            this.removeAttribute('tabindex');
-            await this.updateComplete;
-            if (typeof this.focusElement.disabled === 'undefined') {
-                this.removeAttribute('aria-disabled');
+            if (this.focusElement === this) {
+                this.setAttribute('tabindex', '' + this._tabIndex);
             }
             else {
+                this.removeAttribute('tabindex');
+            }
+            await this.updateComplete;
+            if (canSetDisabled()) {
                 this.focusElement.disabled = false;
             }
+            else {
+                this.removeAttribute('aria-disabled');
+            }
         }
@@ -178,0 +215,0 @@ }

src/focusable.ts

@@ -47,2 +47,8 @@ /*
     public get tabIndex(): number {
+        if (this.focusElement === this) {
+            const tabindex = this.hasAttribute('tabindex')
+                ? Number(this.getAttribute('tabindex'))
+                : NaN;
+            return !isNaN(tabindex) ? tabindex : -1;
+        }
         const tabIndexAttribute = parseFloat(
@@ -60,3 +66,3 @@ this.hasAttribute('tabindex')
         // use host tabindex as the cache.
-        if (!this.focusElement || this.focusElement.isSameNode(this)) {
+        if (!this.focusElement) {
             return tabIndexAttribute;
@@ -75,2 +81,10 @@ }
         }
+        if (this.focusElement === this) {
+            if (tabIndex !== this.tabIndex) {
+                this._tabIndex = tabIndex;
+                const tabindex = this.disabled ? '-1' : '' + tabIndex;
+                this.setAttribute('tabindex', tabindex);
+            }
+            return;
+        }
         // All code paths are about to address the host tabindex without side effect.
@@ -99,2 +113,3 @@ this.manipulatingTabindex = true;
     }
+    private _tabIndex = 0;
 
@@ -124,7 +139,15 @@ private async manageFocusElementTabindex(tabIndex: number): Promise<void> {
 
-        this.focusElement.focus();
+        if (this.focusElement !== this) {
+            this.focusElement.focus();
+        } else {
+            HTMLElement.prototype.focus.apply(this);
+        }
     }
 
     public blur(): void {
-        this.focusElement.blur();
+        if (this.focusElement !== this) {
+            this.focusElement.blur();
+        } else {
+            HTMLElement.prototype.blur.apply(this);
+        }
     }
@@ -137,3 +160,7 @@
 
-        this.focusElement.click();
+        if (this.focusElement !== this) {
+            this.focusElement.click();
+        } else {
+            HTMLElement.prototype.click.apply(this);
+        }
     }
@@ -187,2 +214,5 @@
     ): Promise<void> {
+        const canSetDisabled = (): boolean =>
+            this.focusElement !== this &&
+            typeof this.focusElement.disabled !== 'undefined';
         if (disabled) {
@@ -192,15 +222,19 @@ this.manipulatingTabindex = true;
             await this.updateComplete;
-            if (typeof this.focusElement.disabled === 'undefined') {
+            if (canSetDisabled()) {
+                this.focusElement.disabled = true;
+            } else {
                 this.setAttribute('aria-disabled', 'true');
-            } else {
-                this.focusElement.disabled = true;
             }
         } else if (oldDisabled) {
             this.manipulatingTabindex = true;
-            this.removeAttribute('tabindex');
+            if (this.focusElement === this) {
+                this.setAttribute('tabindex', '' + this._tabIndex);
+            } else {
+                this.removeAttribute('tabindex');
+            }
             await this.updateComplete;
-            if (typeof this.focusElement.disabled === 'undefined') {
+            if (canSetDisabled()) {
+                this.focusElement.disabled = false;
+            } else {
                 this.removeAttribute('aria-disabled');
-            } else {
-                this.focusElement.disabled = false;
             }
@@ -207,0 +241,0 @@ }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Manifest confusion

Supply chain risk

This package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Manifest confusion

Supply chain risk

This package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

116102

decreased by-11.79%

Number of package files

33

decreased by-17.5%

Lines of code

1272

decreased by-11.67%

Dependency changes

• Updated@spectrum-web-components/base@^0.1.4-alpha.169+a396c860