@y14e/tabs 1.3.8 → 1.3.10

package/dist/index.cjs

@@ -327,6 +327,7 @@ var Tabs = class _Tabs {
     restoreAttributes([
       ...this.#listElements,
       ...this.#tabElements,
+      ...this.#indicatorElements,
       ...this.#panelElements
     ]);
     this.#listElements.length = 0;
@@ -341,7 +342,8 @@ var Tabs = class _Tabs {
     saveAttributes(this.#listElements, [
       "aria-hidden",
       "aria-orientation",
-      "role"
+      "role",
+      "style"
     ]);
     this.#listElements.forEach((list, i) => {
       if (this.#settings.avoidDuplicates && i) {
@@ -354,8 +356,10 @@ var Tabs = class _Tabs {
     });
     saveAttributes(this.#tabElements, [
       "aria-controls",
+      "aria-selected",
       "id",
       "role",
+      "style",
       "tabindex"
     ]);
     this.#tabElements.forEach((tab, i) => {
@@ -389,9 +393,10 @@ var Tabs = class _Tabs {
       }
       addTokenToAttribute(panel, "aria-labelledby", tab.id);
       tab.addEventListener("click", this.#onTabClick, { signal });
-      tab.addEventListener("focusin", this.#onTabFocusIn, { signal });
+      tab.addEventListener("focus", this.#onTabFocus, { signal });
       tab.addEventListener("keydown", this.#onTabKeyDown, { signal });
     });
+    saveAttributes(this.#indicatorElements, ["style"]);
     this.#indicatorElements.forEach((indicator) => {
       indicator.closest(this.#settings.selector.list)?.style.setProperty("position", "relative");
       const { style } = indicator;
@@ -418,15 +423,12 @@ var Tabs = class _Tabs {
     }
     this.activate(tab);
   };
-  #onTabFocusIn = (event) => {
+  #onTabFocus = (event) => {
     const tab = event.currentTarget;
     if (!(tab instanceof HTMLElement)) {
       return;
     }
-    if (this.#isAvoidedTab(tab)) {
-      const active = getActiveElement();
-      active && "blur" in active && typeof active.blur === "function" && active.blur();
-    }
+    this.#isAvoidedTab(tab) && tab.blur();
   };
   #onTabKeyDown = (event) => {
     const { key, altKey, ctrlKey, metaKey, shiftKey } = event;
@@ -641,7 +643,7 @@ function isFocusable(element) {
  * Tabs
  * WAI-ARIA compliant tabs pattern implementation in TypeScript.
  *
- * @version 1.3.8
+ * @version 1.3.10
  * @author Yusuke Kamiyamane
  * @license MIT
  * @copyright Copyright (c) Yusuke Kamiyamane

package/dist/index.d.cts

@@ -2,7 +2,7 @@
  * Tabs
  * WAI-ARIA compliant tabs pattern implementation in TypeScript.
  *
- * @version 1.3.8
+ * @version 1.3.10
  * @author Yusuke Kamiyamane
  * @license MIT
  * @copyright Copyright (c) Yusuke Kamiyamane

package/dist/index.d.ts

@@ -2,7 +2,7 @@
  * Tabs
  * WAI-ARIA compliant tabs pattern implementation in TypeScript.
  *
- * @version 1.3.8
+ * @version 1.3.10
  * @author Yusuke Kamiyamane
  * @license MIT
  * @copyright Copyright (c) Yusuke Kamiyamane

package/dist/index.js

@@ -325,6 +325,7 @@ var Tabs = class _Tabs {
     restoreAttributes([
       ...this.#listElements,
       ...this.#tabElements,
+      ...this.#indicatorElements,
       ...this.#panelElements
     ]);
     this.#listElements.length = 0;
@@ -339,7 +340,8 @@ var Tabs = class _Tabs {
     saveAttributes(this.#listElements, [
       "aria-hidden",
       "aria-orientation",
-      "role"
+      "role",
+      "style"
     ]);
     this.#listElements.forEach((list, i) => {
       if (this.#settings.avoidDuplicates && i) {
@@ -352,8 +354,10 @@ var Tabs = class _Tabs {
     });
     saveAttributes(this.#tabElements, [
       "aria-controls",
+      "aria-selected",
       "id",
       "role",
+      "style",
       "tabindex"
     ]);
     this.#tabElements.forEach((tab, i) => {
@@ -387,9 +391,10 @@ var Tabs = class _Tabs {
       }
       addTokenToAttribute(panel, "aria-labelledby", tab.id);
       tab.addEventListener("click", this.#onTabClick, { signal });
-      tab.addEventListener("focusin", this.#onTabFocusIn, { signal });
+      tab.addEventListener("focus", this.#onTabFocus, { signal });
       tab.addEventListener("keydown", this.#onTabKeyDown, { signal });
     });
+    saveAttributes(this.#indicatorElements, ["style"]);
     this.#indicatorElements.forEach((indicator) => {
       indicator.closest(this.#settings.selector.list)?.style.setProperty("position", "relative");
       const { style } = indicator;
@@ -416,15 +421,12 @@ var Tabs = class _Tabs {
     }
     this.activate(tab);
   };
-  #onTabFocusIn = (event) => {
+  #onTabFocus = (event) => {
     const tab = event.currentTarget;
     if (!(tab instanceof HTMLElement)) {
       return;
     }
-    if (this.#isAvoidedTab(tab)) {
-      const active = getActiveElement();
-      active && "blur" in active && typeof active.blur === "function" && active.blur();
-    }
+    this.#isAvoidedTab(tab) && tab.blur();
   };
   #onTabKeyDown = (event) => {
     const { key, altKey, ctrlKey, metaKey, shiftKey } = event;
@@ -639,7 +641,7 @@ function isFocusable(element) {
  * Tabs
  * WAI-ARIA compliant tabs pattern implementation in TypeScript.
  *
- * @version 1.3.8
+ * @version 1.3.10
  * @author Yusuke Kamiyamane
  * @license MIT
  * @copyright Copyright (c) Yusuke Kamiyamane

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@y14e/tabs",
-  "version": "1.3.8",
+  "version": "1.3.10",
   "description": "WAI-ARIA compliant tabs pattern implementation in TypeScript",
   "type": "module",
   "main": "./dist/index.cjs",