@warp-ds/elements 2.4.0-next.2 → 2.4.0-next.4

package/dist/packages/tabs/index.d.ts

@@ -1,4 +1,3 @@
 export { WarpTab } from './tab.js';
 export { WarpTabPanel } from './tab-panel.js';
-export type { TabChangeEvent } from './tabs.js';
 export { WarpTabs } from './tabs.js';

package/dist/packages/tabs/index.js

@@ -1,3 +1,4 @@
 export { WarpTab } from './tab.js';
 export { WarpTabPanel } from './tab-panel.js';
+// Re-export type interfaces
 export { WarpTabs } from './tabs.js';

package/dist/packages/tabs/tab-panel.d.ts

@@ -1,4 +1,4 @@
-import { LitElement, PropertyValues } from 'lit';
+import { LitElement } from 'lit';
 /**
  * Tab panel component that holds content for individual tabs.
  * Each tab panel should have a name that matches a corresponding tab.
@@ -7,10 +7,10 @@ import { LitElement, PropertyValues } from 'lit';
  */
 export declare class WarpTabPanel extends LitElement {
     static styles: import("lit").CSSResult[];
-    name: string;
     hidden: boolean;
     connectedCallback(): void;
-    updated(changedProperties: PropertyValues<this>): void;
+    updated(): void;
+    private _syncA11yAttributes;
     render(): import("lit").TemplateResult<1>;
 }
 declare global {

package/dist/packages/tabs/tab-panel.js

@@ -24,25 +24,21 @@ export class WarpTabPanel extends LitElement {
         super.connectedCallback();
         this.setAttribute('tabindex', '-1');
         this.setAttribute('role', 'tabpanel');
-        // Set aria-labelledby to reference the corresponding tab
-        if (this.name) {
-            this.setAttribute('aria-labelledby', `warp-tab-${this.name}`);
-            this.setAttribute('id', `warp-tabpanel-${this.name}`);
-        }
+        this._syncA11yAttributes();
     }
-    updated(changedProperties) {
-        if (changedProperties.has('name') && this.name) {
-            this.setAttribute('aria-labelledby', `warp-tab-${this.name}`);
-            this.setAttribute('id', `warp-tabpanel-${this.name}`);
-        }
+    updated() {
+        this._syncA11yAttributes();
+    }
+    _syncA11yAttributes() {
+        // Panel identity comes from its own id attribute.
+        if (!this.id)
+            return;
+        this.setAttribute('aria-labelledby', `warp-tab-${this.id}`);
     }
     render() {
         return html `<slot></slot>`;
     }
 }
-__decorate([
-    property({ reflect: true })
-], WarpTabPanel.prototype, "name", void 0);
 __decorate([
     property({ type: Boolean, reflect: true })
 ], WarpTabPanel.prototype, "hidden", void 0);

package/dist/packages/tabs/tab.d.ts

@@ -6,12 +6,11 @@ import { LitElement } from 'lit';
  */
 export declare class WarpTab extends LitElement {
     static styles: import("lit").CSSResult[];
-    name: string;
+    for: string;
     label: string;
     active: boolean;
     over: boolean;
     tabClass: string;
-    private _handleClick;
     private get _classes();
     private get _hasChildren();
     render(): import("lit").TemplateResult<1>;