@github/tab-container-element - npm Package Compare versions

Comparing version 4.1.0 to 4.1.1

dist/bundle.js

@@ -51,2 +51,3 @@ var __defProp = Object.defineProperty;
 var HTMLElement = globalThis.HTMLElement || null;
+var manualSlotsSupported = "assign" in HTMLSlotElement.prototype;
 var _TabContainerChangeEvent = class extends Event {
@@ -135,12 +136,17 @@ constructor(type, _a) {
     tabListSlot.setAttribute("part", "tablist");
+    tabListSlot.setAttribute("name", "tablist");
     const panelSlot = document.createElement("slot");
     panelSlot.setAttribute("part", "panel");
+    panelSlot.setAttribute("name", "panel");
     panelSlot.setAttribute("role", "presentation");
     const beforeTabSlot = document.createElement("slot");
     beforeTabSlot.setAttribute("part", "before-tabs");
+    beforeTabSlot.setAttribute("name", "before-tabs");
     const afterTabSlot = document.createElement("slot");
     afterTabSlot.setAttribute("part", "after-tabs");
+    afterTabSlot.setAttribute("name", "after-tabs");
     tabListContainer.append(beforeTabSlot, tabListSlot, afterTabSlot);
     const afterSlot = document.createElement("slot");
     afterSlot.setAttribute("part", "after-panels");
+    afterSlot.setAttribute("name", "after-panels");
     shadowRoot.replaceChildren(tabListContainer, panelSlot, afterSlot);
@@ -175,5 +181,16 @@ if (__classPrivateFieldGet(this, _TabContainerElement_internals, "f") && "role" in __classPrivateFieldGet(this, _TabContainerElement_internals, "f")) {
       if (customTabList && customTabList.closest(this.tagName) === this) {
-        tabListSlot.assign(customTabList);
+        if (manualSlotsSupported) {
+          tabListSlot.assign(customTabList);
+        } else {
+          customTabList.setAttribute("slot", "tablist");
+        }
       } else {
-        tabListSlot.assign(...[...this.children].filter((e) => e.matches("[role=tab]")));
+        if (manualSlotsSupported) {
+          tabListSlot.assign(...[...this.children].filter((e) => e.matches("[role=tab]")));
+        } else {
+          for (const e of this.children) {
+            if (e.matches("[role=tab]"))
+              e.setAttribute("slot", "tablist");
+          }
+        }
         tabListSlot.role = "tablist";
@@ -209,5 +226,14 @@ tabListSlot.style.display = "block";
       }
-      __classPrivateFieldGet(this, _TabContainerElement_instances, "a", _TabContainerElement_beforeTabsSlot_get).assign(...beforeSlotted);
-      __classPrivateFieldGet(this, _TabContainerElement_instances, "a", _TabContainerElement_afterTabsSlot_get).assign(...afterTabSlotted);
-      __classPrivateFieldGet(this, _TabContainerElement_instances, "a", _TabContainerElement_afterPanelsSlot_get).assign(...afterSlotted);
+      if (manualSlotsSupported) {
+        __classPrivateFieldGet(this, _TabContainerElement_instances, "a", _TabContainerElement_beforeTabsSlot_get).assign(...beforeSlotted);
+        __classPrivateFieldGet(this, _TabContainerElement_instances, "a", _TabContainerElement_afterTabsSlot_get).assign(...afterTabSlotted);
+        __classPrivateFieldGet(this, _TabContainerElement_instances, "a", _TabContainerElement_afterPanelsSlot_get).assign(...afterSlotted);
+      } else {
+        for (const el of beforeSlotted)
+          el.setAttribute("slot", "before-tabs");
+        for (const el of afterTabSlotted)
+          el.setAttribute("slot", "after-tabs");
+        for (const el of afterSlotted)
+          el.setAttribute("slot", "after-panels");
+      }
       const defaultTab = Number(this.getAttribute("default-tab") || -1);
@@ -242,6 +268,13 @@ const defaultIndex = defaultTab >= 0 ? defaultTab : __classPrivateFieldGet(this, _TabContainerElement_instances, "a", _TabContainerElement_tabs_get).findIndex((el) => el.matches("[aria-selected=true]"));
       }
+      if (!manualSlotsSupported && panel.hasAttribute("slot")) {
+        panel.removeAttribute("slot");
+      }
     }
     selectedTab.setAttribute("aria-selected", "true");
     selectedTab.setAttribute("tabindex", "0");
-    __classPrivateFieldGet(this, _TabContainerElement_instances, "a", _TabContainerElement_panelSlot_get).assign(selectedPanel);
+    if (manualSlotsSupported) {
+      __classPrivateFieldGet(this, _TabContainerElement_instances, "a", _TabContainerElement_panelSlot_get).assign(selectedPanel);
+    } else {
+      selectedPanel.setAttribute("slot", "panel");
+    }
     selectedPanel.hidden = false;
@@ -248,0 +281,0 @@ if (__classPrivateFieldGet(this, _TabContainerElement_setupComplete, "f")) {

dist/tab-container-element.js

@@ -25,2 +25,3 @@ var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
 const HTMLElement = globalThis.HTMLElement || null;
+const manualSlotsSupported = 'assign' in HTMLSlotElement.prototype;
 export class TabContainerChangeEvent extends Event {
@@ -108,12 +109,17 @@ constructor(type, _a) {
         tabListSlot.setAttribute('part', 'tablist');
+        tabListSlot.setAttribute('name', 'tablist');
         const panelSlot = document.createElement('slot');
         panelSlot.setAttribute('part', 'panel');
+        panelSlot.setAttribute('name', 'panel');
         panelSlot.setAttribute('role', 'presentation');
         const beforeTabSlot = document.createElement('slot');
         beforeTabSlot.setAttribute('part', 'before-tabs');
+        beforeTabSlot.setAttribute('name', 'before-tabs');
         const afterTabSlot = document.createElement('slot');
         afterTabSlot.setAttribute('part', 'after-tabs');
+        afterTabSlot.setAttribute('name', 'after-tabs');
         tabListContainer.append(beforeTabSlot, tabListSlot, afterTabSlot);
         const afterSlot = document.createElement('slot');
         afterSlot.setAttribute('part', 'after-panels');
+        afterSlot.setAttribute('name', 'after-panels');
         shadowRoot.replaceChildren(tabListContainer, panelSlot, afterSlot);
@@ -149,6 +155,19 @@ if (__classPrivateFieldGet(this, _TabContainerElement_internals, "f") && 'role' in __classPrivateFieldGet(this, _TabContainerElement_internals, "f")) {
             if (customTabList && customTabList.closest(this.tagName) === this) {
-                tabListSlot.assign(customTabList);
+                if (manualSlotsSupported) {
+                    tabListSlot.assign(customTabList);
+                }
+                else {
+                    customTabList.setAttribute('slot', 'tablist');
+                }
             }
             else {
-                tabListSlot.assign(...[...this.children].filter(e => e.matches('[role=tab]')));
+                if (manualSlotsSupported) {
+                    tabListSlot.assign(...[...this.children].filter(e => e.matches('[role=tab]')));
+                }
+                else {
+                    for (const e of this.children) {
+                        if (e.matches('[role=tab]'))
+                            e.setAttribute('slot', 'tablist');
+                    }
+                }
                 tabListSlot.role = 'tablist';
@@ -186,5 +205,15 @@ tabListSlot.style.display = 'block';
             }
-            __classPrivateFieldGet(this, _TabContainerElement_instances, "a", _TabContainerElement_beforeTabsSlot_get).assign(...beforeSlotted);
-            __classPrivateFieldGet(this, _TabContainerElement_instances, "a", _TabContainerElement_afterTabsSlot_get).assign(...afterTabSlotted);
-            __classPrivateFieldGet(this, _TabContainerElement_instances, "a", _TabContainerElement_afterPanelsSlot_get).assign(...afterSlotted);
+            if (manualSlotsSupported) {
+                __classPrivateFieldGet(this, _TabContainerElement_instances, "a", _TabContainerElement_beforeTabsSlot_get).assign(...beforeSlotted);
+                __classPrivateFieldGet(this, _TabContainerElement_instances, "a", _TabContainerElement_afterTabsSlot_get).assign(...afterTabSlotted);
+                __classPrivateFieldGet(this, _TabContainerElement_instances, "a", _TabContainerElement_afterPanelsSlot_get).assign(...afterSlotted);
+            }
+            else {
+                for (const el of beforeSlotted)
+                    el.setAttribute('slot', 'before-tabs');
+                for (const el of afterTabSlotted)
+                    el.setAttribute('slot', 'after-tabs');
+                for (const el of afterSlotted)
+                    el.setAttribute('slot', 'after-panels');
+            }
             const defaultTab = Number(this.getAttribute('default-tab') || -1);
@@ -219,6 +248,14 @@ const defaultIndex = defaultTab >= 0 ? defaultTab : __classPrivateFieldGet(this, _TabContainerElement_instances, "a", _TabContainerElement_tabs_get).findIndex(el => el.matches('[aria-selected=true]'));
             }
+            if (!manualSlotsSupported && panel.hasAttribute('slot')) {
+                panel.removeAttribute('slot');
+            }
         }
         selectedTab.setAttribute('aria-selected', 'true');
         selectedTab.setAttribute('tabindex', '0');
-        __classPrivateFieldGet(this, _TabContainerElement_instances, "a", _TabContainerElement_panelSlot_get).assign(selectedPanel);
+        if (manualSlotsSupported) {
+            __classPrivateFieldGet(this, _TabContainerElement_instances, "a", _TabContainerElement_panelSlot_get).assign(selectedPanel);
+        }
+        else {
+            selectedPanel.setAttribute('slot', 'panel');
+        }
         selectedPanel.hidden = false;
@@ -225,0 +262,0 @@ if (__classPrivateFieldGet(this, _TabContainerElement_setupComplete, "f")) {

package.json

 {
   "name": "@github/tab-container-element",
-  "version": "4.1.0",
+  "version": "4.1.1",
   "description": "Tab container element",
@@ -5,0 +5,0 @@ "type": "module",

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

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

Improved metrics

Total package byte prevSize

49631

increased by5.76%

Lines of code

787

increased by9.76%

No dependency changes