@y14e/tabs 1.3.10 → 1.3.12

package/dist/index.cjs

@@ -101,12 +101,10 @@ var Tabs = class _Tabs {
     this.#rootElement = root;
     this.#defaults = this.#mergeOptions(this.#defaults, _Tabs.defaults);
     this.#settings = this.#mergeOptions(this.#defaults, options);
-    if (matchMedia("(prefers-reduced-motion: reduce)").matches) {
-      Object.assign(this.#settings.animation, {
-        content: { duration: 0 },
-        indicator: { duration: 0 }
-      });
-    }
+    matchMedia("(prefers-reduced-motion: reduce)").matches && Object.assign(this.#settings.animation, {
+      content: { duration: 0 },
+      indicator: { duration: 0 }
+    });
     const NOT_NESTED = `:not(:scope ${this.#settings.selector.panel} *)`;
     this.#listElements = [
       ...this.#rootElement.querySelectorAll(
@@ -160,9 +158,7 @@ var Tabs = class _Tabs {
       }
       const binding = createBinding(tabsByIndex, panel);
       this.#bindings.set(tab, binding);
-      if (i < length) {
-        this.#bindings.set(panel, binding);
-      }
+      i < length && this.#bindings.set(panel, binding);
     });
     this.#initialize();
   }
@@ -207,11 +203,7 @@ var Tabs = class _Tabs {
       }
       style2.setProperty("inline-size", "100%");
       style2.setProperty("position", "absolute");
-      if (p === panel && !hasFocusable(p)) {
-        p.setAttribute("tabindex", "0");
-      } else {
-        p.removeAttribute("tabindex");
-      }
+      p === panel && !hasFocusable(p) ? p.setAttribute("tabindex", "0") : p.removeAttribute("tabindex");
     });
     this.#panelElements.forEach((p, i) => {
       if (p === panel) {
@@ -346,17 +338,12 @@ var Tabs = class _Tabs {
       "style"
     ]);
     this.#listElements.forEach((list, i) => {
-      if (this.#settings.avoidDuplicates && i) {
-        list.setAttribute("aria-hidden", "true");
-      }
-      if (this.#settings.vertical) {
-        list.setAttribute("aria-orientation", "vertical");
-      }
+      this.#settings.avoidDuplicates && i && list.setAttribute("aria-hidden", "true");
+      this.#settings.vertical && list.setAttribute("aria-orientation", "vertical");
       list.setAttribute("role", "tablist");
     });
     saveAttributes(this.#tabElements, [
       "aria-controls",
-      "aria-selected",
       "id",
       "role",
       "style",
@@ -368,17 +355,13 @@ var Tabs = class _Tabs {
       if (!panel) {
         return;
       }
-      if (i < this.#panelElements.length) {
-        saveAttributes(
-          [panel],
-          ["aria-controls", "aria-labelledby", "id", "role", "tabindex"]
-        );
-      }
+      i < this.#panelElements.length && saveAttributes(
+        [panel],
+        ["aria-controls", "aria-labelledby", "id", "role", "tabindex"]
+      );
       panel.id ||= `tabs-panel-${id}`;
       addTokenToAttribute(tab, "aria-controls", panel.id);
-      if (!tab.hasAttribute("aria-selected")) {
-        tab.setAttribute("aria-selected", "false");
-      }
+      !tab.hasAttribute("aria-selected") && tab.setAttribute("aria-selected", "false");
       const isAvoided = this.#isAvoidedTab(tab);
       if (!isAvoided) {
         tab.id ||= `tabs-tab-${id}`;
@@ -388,9 +371,7 @@ var Tabs = class _Tabs {
         "tabindex",
         tab.ariaSelected === "true" && !isAvoided ? "0" : "-1"
       );
-      if (!isFocusable(tab)) {
-        tab.style.setProperty("pointer-events", "none");
-      }
+      !isFocusable(tab) && tab.style.setProperty("pointer-events", "none");
       addTokenToAttribute(panel, "aria-labelledby", tab.id);
       tab.addEventListener("click", this.#onTabClick, { signal });
       tab.addEventListener("focus", this.#onTabFocus, { signal });
@@ -406,9 +387,7 @@ var Tabs = class _Tabs {
     });
     this.#panelElements.forEach((panel) => {
       panel.setAttribute("role", "tabpanel");
-      if (!panel.hasAttribute("hidden") && !hasFocusable(panel)) {
-        panel.setAttribute("tabindex", "0");
-      }
+      !panel.hasAttribute("hidden") && !hasFocusable(panel) && panel.setAttribute("tabindex", "0");
       panel.addEventListener("beforematch", this.#onPanelBeforeMatch, {
         signal
       });
@@ -490,9 +469,7 @@ var Tabs = class _Tabs {
       return;
     }
     newTab.focus();
-    if (!this.#settings.manual) {
-      newTab.click();
-    }
+    !this.#settings.manual && newTab.click();
   };
   #onPanelBeforeMatch = (event) => {
     const panel = event.currentTarget;
@@ -643,7 +620,7 @@ function isFocusable(element) {
  * Tabs
  * WAI-ARIA compliant tabs pattern implementation in TypeScript.
  *
- * @version 1.3.10
+ * @version 1.3.12
  * @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.10
+ * @version 1.3.12
  * @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.10
+ * @version 1.3.12
  * @author Yusuke Kamiyamane
  * @license MIT
  * @copyright Copyright (c) Yusuke Kamiyamane

package/dist/index.js

@@ -99,12 +99,10 @@ var Tabs = class _Tabs {
     this.#rootElement = root;
     this.#defaults = this.#mergeOptions(this.#defaults, _Tabs.defaults);
     this.#settings = this.#mergeOptions(this.#defaults, options);
-    if (matchMedia("(prefers-reduced-motion: reduce)").matches) {
-      Object.assign(this.#settings.animation, {
-        content: { duration: 0 },
-        indicator: { duration: 0 }
-      });
-    }
+    matchMedia("(prefers-reduced-motion: reduce)").matches && Object.assign(this.#settings.animation, {
+      content: { duration: 0 },
+      indicator: { duration: 0 }
+    });
     const NOT_NESTED = `:not(:scope ${this.#settings.selector.panel} *)`;
     this.#listElements = [
       ...this.#rootElement.querySelectorAll(
@@ -158,9 +156,7 @@ var Tabs = class _Tabs {
       }
       const binding = createBinding(tabsByIndex, panel);
       this.#bindings.set(tab, binding);
-      if (i < length) {
-        this.#bindings.set(panel, binding);
-      }
+      i < length && this.#bindings.set(panel, binding);
     });
     this.#initialize();
   }
@@ -205,11 +201,7 @@ var Tabs = class _Tabs {
       }
       style2.setProperty("inline-size", "100%");
       style2.setProperty("position", "absolute");
-      if (p === panel && !hasFocusable(p)) {
-        p.setAttribute("tabindex", "0");
-      } else {
-        p.removeAttribute("tabindex");
-      }
+      p === panel && !hasFocusable(p) ? p.setAttribute("tabindex", "0") : p.removeAttribute("tabindex");
     });
     this.#panelElements.forEach((p, i) => {
       if (p === panel) {
@@ -344,17 +336,12 @@ var Tabs = class _Tabs {
       "style"
     ]);
     this.#listElements.forEach((list, i) => {
-      if (this.#settings.avoidDuplicates && i) {
-        list.setAttribute("aria-hidden", "true");
-      }
-      if (this.#settings.vertical) {
-        list.setAttribute("aria-orientation", "vertical");
-      }
+      this.#settings.avoidDuplicates && i && list.setAttribute("aria-hidden", "true");
+      this.#settings.vertical && list.setAttribute("aria-orientation", "vertical");
       list.setAttribute("role", "tablist");
     });
     saveAttributes(this.#tabElements, [
       "aria-controls",
-      "aria-selected",
       "id",
       "role",
       "style",
@@ -366,17 +353,13 @@ var Tabs = class _Tabs {
       if (!panel) {
         return;
       }
-      if (i < this.#panelElements.length) {
-        saveAttributes(
-          [panel],
-          ["aria-controls", "aria-labelledby", "id", "role", "tabindex"]
-        );
-      }
+      i < this.#panelElements.length && saveAttributes(
+        [panel],
+        ["aria-controls", "aria-labelledby", "id", "role", "tabindex"]
+      );
       panel.id ||= `tabs-panel-${id}`;
       addTokenToAttribute(tab, "aria-controls", panel.id);
-      if (!tab.hasAttribute("aria-selected")) {
-        tab.setAttribute("aria-selected", "false");
-      }
+      !tab.hasAttribute("aria-selected") && tab.setAttribute("aria-selected", "false");
       const isAvoided = this.#isAvoidedTab(tab);
       if (!isAvoided) {
         tab.id ||= `tabs-tab-${id}`;
@@ -386,9 +369,7 @@ var Tabs = class _Tabs {
         "tabindex",
         tab.ariaSelected === "true" && !isAvoided ? "0" : "-1"
       );
-      if (!isFocusable(tab)) {
-        tab.style.setProperty("pointer-events", "none");
-      }
+      !isFocusable(tab) && tab.style.setProperty("pointer-events", "none");
       addTokenToAttribute(panel, "aria-labelledby", tab.id);
       tab.addEventListener("click", this.#onTabClick, { signal });
       tab.addEventListener("focus", this.#onTabFocus, { signal });
@@ -404,9 +385,7 @@ var Tabs = class _Tabs {
     });
     this.#panelElements.forEach((panel) => {
       panel.setAttribute("role", "tabpanel");
-      if (!panel.hasAttribute("hidden") && !hasFocusable(panel)) {
-        panel.setAttribute("tabindex", "0");
-      }
+      !panel.hasAttribute("hidden") && !hasFocusable(panel) && panel.setAttribute("tabindex", "0");
       panel.addEventListener("beforematch", this.#onPanelBeforeMatch, {
         signal
       });
@@ -488,9 +467,7 @@ var Tabs = class _Tabs {
       return;
     }
     newTab.focus();
-    if (!this.#settings.manual) {
-      newTab.click();
-    }
+    !this.#settings.manual && newTab.click();
   };
   #onPanelBeforeMatch = (event) => {
     const panel = event.currentTarget;
@@ -641,7 +618,7 @@ function isFocusable(element) {
  * Tabs
  * WAI-ARIA compliant tabs pattern implementation in TypeScript.
  *
- * @version 1.3.10
+ * @version 1.3.12
  * @author Yusuke Kamiyamane
  * @license MIT
  * @copyright Copyright (c) Yusuke Kamiyamane

package/package.json

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