@nvidia-elements/core 0.0.6 → 0.0.7

package/dist/steps/steps2.js

@@ -23,7 +23,7 @@ var v = class extends r {
 	static {
 		this.metadata = {
 			tag: "nve-steps-item",
-			version: "0.0.6",
+			version: "0.0.7",
 			parents: ["nve-steps"]
 		};
 	}
@@ -34,10 +34,10 @@ var v = class extends r {
 		};
 	}
 	render() {
-		return p`<div internal-host focus-within><slot name="status-icon">${this.status === void 0 ? p`<nve-icon-button part="icon-button" readonly="readonly" id="number-icon" .disabled="${this.disabled}">${this.index}</nve-icon-button>` : ""} ${this.status === "success" ? p`<nve-icon-button part="icon-button" readonly="readonly" size="sm" interaction="emphasis" icon-name="check"></nve-icon-button>` : ""} ${this.status === "danger" ? p`<nve-icon-button part="icon-button" readonly="readonly" size="sm" interaction="destructive" icon-name="exclamation-circle"></nve-icon-button>` : ""} ${this.status === "pending" ? p`<nve-progress-ring part="progress-ring" status="accent" size="sm"></nve-progress-ring>` : ""}</slot>${_(this.container !== "condensed", () => p`<slot></slot>`)}</div>`;
+		return p`<div internal-host focus-within><slot name="status-icon">${this.status ? "" : p`<nve-icon-button part="icon-button" readonly="readonly" id="number-icon" .disabled="${this.disabled}">${this.index}</nve-icon-button>`} ${this.status === "success" ? p`<nve-icon-button part="icon-button" readonly="readonly" size="sm" interaction="emphasis" icon-name="check"></nve-icon-button>` : ""} ${this.status === "danger" ? p`<nve-icon-button part="icon-button" readonly="readonly" size="sm" interaction="destructive" icon-name="exclamation-circle"></nve-icon-button>` : ""} ${this.status === "pending" ? p`<nve-progress-ring part="progress-ring" status="accent" size="sm"></nve-progress-ring>` : ""}</slot>${_(this.container !== "condensed", () => p`<slot></slot>`)}</div>`;
 	}
 	constructor() {
-		super(), this.selected = !1, this.type = "button";
+		super(), this.selected = !1, this.index = 0, this.type = "button";
 	}
 	connectedCallback() {
 		super.connectedCallback(), this._internals.role = "tab";
@@ -67,7 +67,7 @@ var y = class extends f {
 	static {
 		this.metadata = {
 			tag: "nve-steps",
-			version: "0.0.6",
+			version: "0.0.7",
 			children: ["nve-steps-item"]
 		};
 	}
@@ -78,24 +78,27 @@ var y = class extends f {
 		};
 	}
 	#e(e) {
-		!this.behaviorSelect || !e.matches("nve-steps-item, nve-steps-item") || e.disabled || (this.keynavListConfig.items.forEach((e) => e.selected = !1), e.selected = !0);
+		!this.behaviorSelect || !e.matches("nve-steps-item, nve-steps-item") || e.disabled || (this.steps.forEach((e) => e.selected = !1), e.selected = !0);
 	}
 	render() {
-		return p`<div internal-host><slot></slot></div>`;
+		return p`<div internal-host><slot @slotchange="${this.#n}"></slot></div>`;
 	}
 	connectedCallback() {
-		super.connectedCallback(), e(this), this._internals.role = "tablist", this.addEventListener("click", (e) => this.#e(e.target));
+		super.connectedCallback(), e(this), this._internals.role = "tablist", this.addEventListener("click", this.#t);
 	}
-	firstUpdated(e) {
-		super.firstUpdated(e), this.steps.forEach((e, t) => {
-			e.index = t + 1;
-		});
+	disconnectedCallback() {
+		super.disconnectedCallback(), this.removeEventListener("click", this.#t);
 	}
+	#t = (e) => {
+		this.#e(e.target);
+	};
 	updated(e) {
-		super.updated(e), this.#t(), this._internals.ariaOrientation = this.vertical ? "vertical" : "horizontal";
+		super.updated(e), (e.has("container") || e.has("vertical")) && this.#n();
 	}
-	#t() {
-		this.steps.forEach((e) => e.container = this.container);
+	#n() {
+		this._internals.ariaOrientation = this.vertical ? "vertical" : "horizontal", this.steps.forEach((e, t) => {
+			e.index = t + 1, e.container = this.container;
+		});
 	}
 };
 n([m({

package/dist/steps/steps2.js.map

@@ -1 +1 @@
-{"version":3,"file":"steps2.js","names":["#selectTab","#updateChildAttributes"],"sources":["../../src/steps/steps.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { PropertyValues } from 'lit';\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { state } from 'lit/decorators/state.js';\nimport { when } from 'lit/directives/when.js';\nimport { queryAssignedElements } from 'lit/decorators/query-assigned-elements.js';\nimport type { KeynavListConfig, Container } from '@nvidia-elements/core/internal';\nimport {\n  BaseButton,\n  stateSelected,\n  useStyles,\n  keyNavigationList,\n  attachInternals,\n  audit,\n  scopedRegistry\n} from '@nvidia-elements/core/internal';\nimport stepsItemStyleSheet from './steps-item.css?inline';\nimport stepsStyleSheet from './steps.css?inline';\nimport { IconButton } from '@nvidia-elements/core/icon-button';\nimport { ProgressRing } from '@nvidia-elements/core/progress-ring';\n\n/**\n * @element nve-steps-item\n * @description Represents an individual step within a multi-step workflow, displaying its status and enabling navigation within the parent steps component.\n * @since 0.30.0\n * @entrypoint \\@nvidia-elements/core/steps\n * @slot - default slot for step text\n * @slot status-icon - custom slotted step icon\n * @cssprop --font-size\n * @cssprop --border-top\n * @cssprop --width\n * @cssprop --font-size\n * @cssprop --font-weight\n * @cssprop --border-radius\n * @cssprop --color\n * @cssprop --text-transform\n * @csspart icon-button - The icon button element\n * @csspart progress-ring - The progress ring element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/tabs/\n */\n@audit()\n@scopedRegistry()\n@stateSelected<StepsItem>()\nexport class StepsItem extends BaseButton {\n  /**\n   * Determines which item the user selects, defaults to false.\n   */\n  @property({ type: Boolean, reflect: true }) selected = false;\n\n  /**\n   * Four visual treatments represent the `status` of tasks. When `status` has a value of `warning`, `success`, or `danger`, the component embeds appropriate icons.\n   */\n  @property({ type: String, reflect: true }) status?: 'accent' | 'danger' | 'success' | 'pending';\n\n  /**\n   * Determines whether the steps should display in condensed format with no text labels.\n   */\n  @property({ type: String, reflect: true }) container?: Extract<Container, 'condensed'>;\n\n  /** @private */\n  @state() index: number;\n\n  static styles = useStyles([stepsItemStyleSheet]);\n\n  static readonly metadata = {\n    tag: 'nve-steps-item',\n    version: '0.0.0',\n    parents: ['nve-steps']\n  };\n\n  static elementDefinitions = {\n    [IconButton.metadata.tag]: IconButton,\n    [ProgressRing.metadata.tag]: ProgressRing\n  };\n\n  render() {\n    return html`\n      <div internal-host focus-within>  \n        <slot name=\"status-icon\">\n          ${this.status === undefined ? html`<nve-icon-button part=\"icon-button\" readonly id=\"number-icon\" .disabled=${this.disabled}>${this.index}</nve-icon-button>` : ''}\n          ${this.status === 'success' ? html`<nve-icon-button part=\"icon-button\" readonly size=\"sm\" interaction=\"emphasis\" icon-name=\"check\"></nve-icon-button>` : ''}\n          ${this.status === 'danger' ? html`<nve-icon-button part=\"icon-button\" readonly size=\"sm\" interaction=\"destructive\" icon-name=\"exclamation-circle\"></nve-icon-button>` : ''}\n          ${this.status === 'pending' ? html`<nve-progress-ring part=\"progress-ring\" status=\"accent\" size=\"sm\"></nve-progress-ring>` : ''}\n        </slot>\n        ${when(this.container !== 'condensed', () => html`<slot></slot>`)}\n      </div>\n    `;\n  }\n\n  constructor() {\n    super();\n    this.type = 'button';\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._internals.role = 'tab';\n  }\n}\n\n/**\n * @element nve-steps\n * @description Steps enables a multi-step workflow allowing a user to complete a goal in a specific sequence.\n * @since 0.30.0\n * @entrypoint \\@nvidia-elements/core/steps\n * @slot - default slot for steps-item\n * @cssprop --gap\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/tabs/\n */\n@audit()\n@keyNavigationList<Steps>()\nexport class Steps extends LitElement {\n  /**\n   * Determines whether the steps should display in a vertical layout vs. defaulting to horizontal.\n   */\n  @property({ type: Boolean, reflect: true }) vertical = false;\n\n  /**\n   * Determines whether the steps should display in condensed format with no text labels.\n   */\n  @property({ type: String, reflect: true }) container?: Extract<Container, 'condensed'>;\n\n  /**\n   * Determines whether the steps should handle selection behavior vs. defaults to off.\n   */\n  @property({ type: Boolean, attribute: 'behavior-select' }) behaviorSelect = false;\n\n  static styles = useStyles([stepsStyleSheet]);\n\n  static readonly metadata = {\n    tag: 'nve-steps',\n    version: '0.0.0',\n    children: ['nve-steps-item']\n  };\n\n  /** @private */\n  get keynavListConfig(): KeynavListConfig {\n    return {\n      items: this.steps,\n      layout: this.vertical ? 'vertical' : 'horizontal'\n    };\n  }\n\n  @queryAssignedElements({ selector: 'nve-steps-item, nve-steps-item' }) private steps!: StepsItem[];\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  #selectTab(stepsItem: HTMLElement & { matches: Element['matches']; disabled?: boolean; selected?: boolean }) {\n    if (!this.behaviorSelect || !stepsItem.matches('nve-steps-item, nve-steps-item') || stepsItem.disabled) {\n      return;\n    }\n\n    this.keynavListConfig.items.forEach((i: HTMLElement) => ((i as StepsItem).selected = false));\n    stepsItem.selected = true;\n  }\n\n  render() {\n    return html`\n      <div internal-host>\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'tablist';\n    this.addEventListener('click', (e: Event) =>\n      this.#selectTab(e.target as HTMLElement & { matches: Element['matches']; disabled?: boolean; selected?: boolean })\n    );\n  }\n\n  firstUpdated(props: PropertyValues<this>) {\n    super.firstUpdated(props);\n\n    this.steps.forEach((item, i) => {\n      item.index = i + 1;\n    });\n  }\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n    this.#updateChildAttributes();\n    this._internals.ariaOrientation = this.vertical ? 'vertical' : 'horizontal';\n  }\n\n  #updateChildAttributes() {\n    this.steps.forEach(stepItem => (stepItem.container = this.container));\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AA8CO,IAAA,IAAA,cAAwB,EAAW;;gBAmBxB,EAAU,CAAC,EAAoB,CAAC;;;kBAErB;GACzB,KAAK;GACL,SAAS;GACT,SAAS,CAAC,YAAA;GACX;;;4BAE2B;IACzB,EAAW,SAAS,MAAM;IAC1B,EAAa,SAAS,MAAM;GAC9B;;CAED,SAAS;AACP,SAAO,CAAI,4DAGH,KAAK,WAAW,KAAA,IAAY,CAAI,uFAA2E,KAAK,SAAS,IAAG,KAAK,MAAM,sBAAsB,GAAG,GAChK,KAAK,WAAW,YAAY,CAAI,kIAAuH,GAAG,GAC1J,KAAK,WAAW,WAAW,CAAI,kJAAuI,GAAG,GACzK,KAAK,WAAW,YAAY,CAAI,2FAA2F,GAAG,SAEhI,EAAK,KAAK,cAAc,mBAAmB,CAAI,gBAAgB,CAAC;;CAKxE,cAAc;AAEZ,EADA,OAAO,kBA3C8C,IA4CrD,KAAK,OAAO;;CAGd,oBAAoB;AAElB,EADA,MAAM,mBAAmB,EACzB,KAAK,WAAW,OAAO;;;GAjDxB,EAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,YAAA,KAAA,EAAA,KAK1C,EAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,UAAA,KAAA,EAAA,KAKzC,EAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,aAAA,KAAA,EAAA,KAGzC,GAAO,CAAA,EAAA,EAAA,WAAA,SAAA,KAAA,EAAA;CApBT,GAAO;CACP,GAAgB;CAChB,GAAA;;AAqEM,IAAA,IAAA,cAAoB,EAAW;;+BAImB,0BAUqB;;;gBAE5D,EAAU,CAAC,EAAgB,CAAC;;;kBAEjB;GACzB,KAAK;GACL,SAAS;GACT,UAAU,CAAC,iBAAA;GACZ;;CAGD,IAAI,mBAAqC;AACvC,SAAO;GACL,OAAO,KAAK;GACZ,QAAQ,KAAK,WAAW,aAAa;GACtC;;CAQH,GAAW,GAAkG;AACvG,GAAC,KAAK,kBAAkB,CAAC,EAAU,QAAQ,iCAAiC,IAAI,EAAU,aAI9F,KAAK,iBAAiB,MAAM,SAAS,MAAoB,EAAiB,WAAW,GAAO,EAC5F,EAAU,WAAW;;CAGvB,SAAS;AACP,SAAO,CAAI;;CAOb,oBAAoB;AAIlB,EAHA,MAAM,mBAAmB,EACzB,EAAgB,KAAK,EACrB,KAAK,WAAW,OAAO,WACvB,KAAK,iBAAiB,UAAU,MAC9B,MAAA,EAAgB,EAAE,OAAgG,CACnH;;CAGH,aAAa,GAA6B;AAGxC,EAFA,MAAM,aAAa,EAAM,EAEzB,KAAK,MAAM,SAAS,GAAM,MAAM;AAC9B,KAAK,QAAQ,IAAI;IACjB;;CAGJ,QAAQ,GAA6B;AAGnC,EAFA,MAAM,QAAQ,EAAM,EACpB,MAAA,GAA6B,EAC7B,KAAK,WAAW,kBAAkB,KAAK,WAAW,aAAa;;CAGjE,KAAyB;AACvB,OAAK,MAAM,SAAQ,MAAa,EAAS,YAAY,KAAK,UAAW;;;GA1EtE,EAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,YAAA,KAAA,EAAA,KAK1C,EAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,aAAA,KAAA,EAAA,KAKzC,EAAS;CAAE,MAAM;CAAS,WAAW;CAAmB,CAAC,CAAA,EAAA,EAAA,WAAA,kBAAA,KAAA,EAAA,KAkBzD,EAAsB,EAAE,UAAU,kCAAkC,CAAC,CAAA,EAAA,EAAA,WAAA,SAAA,KAAA,EAAA,SAlCvE,GAAO,EACP,GAA0B,CAAA,EAAA,EAAA"}
+{"version":3,"file":"steps2.js","names":["#syncChildSteps","#onClick","#selectTab"],"sources":["../../src/steps/steps.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { PropertyValues } from 'lit';\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { state } from 'lit/decorators/state.js';\nimport { when } from 'lit/directives/when.js';\nimport { queryAssignedElements } from 'lit/decorators/query-assigned-elements.js';\nimport type { KeynavListConfig, Container } from '@nvidia-elements/core/internal';\nimport {\n  BaseButton,\n  stateSelected,\n  useStyles,\n  keyNavigationList,\n  attachInternals,\n  audit,\n  scopedRegistry\n} from '@nvidia-elements/core/internal';\nimport stepsItemStyleSheet from './steps-item.css?inline';\nimport stepsStyleSheet from './steps.css?inline';\nimport { IconButton } from '@nvidia-elements/core/icon-button';\nimport { ProgressRing } from '@nvidia-elements/core/progress-ring';\n\n/**\n * @element nve-steps-item\n * @description Represents an individual step within a multi-step workflow, displaying its status and enabling navigation within the parent steps component.\n * @since 0.30.0\n * @entrypoint \\@nvidia-elements/core/steps\n * @slot - default slot for step text\n * @slot status-icon - custom slotted step icon\n * @cssprop --font-size\n * @cssprop --border-top\n * @cssprop --width\n * @cssprop --font-weight\n * @cssprop --border-radius\n * @cssprop --color\n * @cssprop --text-transform\n * @csspart icon-button - The icon button element\n * @csspart progress-ring - The progress ring element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/tabs/\n */\n@audit()\n@scopedRegistry()\n@stateSelected<StepsItem>()\nexport class StepsItem extends BaseButton {\n  /**\n   * Determines which item the user selects, defaults to false.\n   */\n  @property({ type: Boolean, reflect: true }) selected = false;\n\n  /**\n   * Four visual treatments represent the `status` of tasks. When `status` has a value of `warning`, `success`, or `danger`, the component embeds appropriate icons.\n   */\n  @property({ type: String, reflect: true }) status?: 'accent' | 'danger' | 'success' | 'pending';\n\n  /**\n   * Determines whether the steps should display in condensed format with no text labels.\n   */\n  @property({ type: String, reflect: true }) container?: Extract<Container, 'condensed'>;\n\n  /** @private */\n  @state() index: number = 0;\n\n  static styles = useStyles([stepsItemStyleSheet]);\n\n  static readonly metadata = {\n    tag: 'nve-steps-item',\n    version: '0.0.0',\n    parents: ['nve-steps']\n  };\n\n  static elementDefinitions = {\n    [IconButton.metadata.tag]: IconButton,\n    [ProgressRing.metadata.tag]: ProgressRing\n  };\n\n  render() {\n    return html`\n      <div internal-host focus-within>\n        <slot name=\"status-icon\">\n          ${!this.status ? html`<nve-icon-button part=\"icon-button\" readonly id=\"number-icon\" .disabled=${this.disabled}>${this.index}</nve-icon-button>` : ''}\n          ${this.status === 'success' ? html`<nve-icon-button part=\"icon-button\" readonly size=\"sm\" interaction=\"emphasis\" icon-name=\"check\"></nve-icon-button>` : ''}\n          ${this.status === 'danger' ? html`<nve-icon-button part=\"icon-button\" readonly size=\"sm\" interaction=\"destructive\" icon-name=\"exclamation-circle\"></nve-icon-button>` : ''}\n          ${this.status === 'pending' ? html`<nve-progress-ring part=\"progress-ring\" status=\"accent\" size=\"sm\"></nve-progress-ring>` : ''}\n        </slot>\n        ${when(this.container !== 'condensed', () => html`<slot></slot>`)}\n      </div>\n    `;\n  }\n\n  constructor() {\n    super();\n    this.type = 'button';\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._internals.role = 'tab';\n  }\n}\n\n/**\n * @element nve-steps\n * @description Steps enables a multi-step workflow allowing a user to complete a goal in a specific sequence.\n * @since 0.30.0\n * @entrypoint \\@nvidia-elements/core/steps\n * @slot - default slot for steps-item\n * @cssprop --gap\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/tabs/\n */\n@audit()\n@keyNavigationList<Steps>()\nexport class Steps extends LitElement {\n  /**\n   * Determines whether the steps should display in a vertical layout vs. defaulting to horizontal.\n   */\n  @property({ type: Boolean, reflect: true }) vertical = false;\n\n  /**\n   * Determines whether the steps should display in condensed format with no text labels.\n   */\n  @property({ type: String, reflect: true }) container?: Extract<Container, 'condensed'>;\n\n  /**\n   * Determines whether the steps should handle selection behavior vs. defaults to off.\n   */\n  @property({ type: Boolean, attribute: 'behavior-select' }) behaviorSelect = false;\n\n  static styles = useStyles([stepsStyleSheet]);\n\n  static readonly metadata = {\n    tag: 'nve-steps',\n    version: '0.0.0',\n    children: ['nve-steps-item']\n  };\n\n  /** @private */\n  get keynavListConfig(): KeynavListConfig {\n    return {\n      items: this.steps,\n      layout: this.vertical ? 'vertical' : 'horizontal'\n    };\n  }\n\n  @queryAssignedElements({ selector: 'nve-steps-item, nve-steps-item' }) private steps!: StepsItem[];\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  #selectTab(stepsItem: HTMLElement & { matches: Element['matches']; disabled?: boolean; selected?: boolean }) {\n    if (!this.behaviorSelect || !stepsItem.matches('nve-steps-item, nve-steps-item') || stepsItem.disabled) {\n      return;\n    }\n\n    this.steps.forEach(i => (i.selected = false));\n    stepsItem.selected = true;\n  }\n\n  render() {\n    return html`\n      <div internal-host>\n        <slot @slotchange=${this.#syncChildSteps}></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'tablist';\n    this.addEventListener('click', this.#onClick);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('click', this.#onClick);\n  }\n\n  #onClick = (e: Event) => {\n    this.#selectTab(e.target as HTMLElement & { matches: Element['matches']; disabled?: boolean; selected?: boolean });\n  };\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n    if (props.has('container') || props.has('vertical')) {\n      this.#syncChildSteps();\n    }\n  }\n\n  #syncChildSteps() {\n    this._internals.ariaOrientation = this.vertical ? 'vertical' : 'horizontal';\n    this.steps.forEach((item, i) => {\n      item.index = i + 1;\n      item.container = this.container;\n    });\n  }\n}\n"],"mappings":"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"}

package/dist/switch/switch-group2.js

@@ -11,7 +11,7 @@ var a = class extends r {
 	static {
 		this.metadata = {
 			tag: "nve-switch-group",
-			version: "0.0.6",
+			version: "0.0.7",
 			children: [
 				"label",
 				"nve-control-message",

package/dist/switch/switch2.js

@@ -15,7 +15,7 @@ var o = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-switch",
-			version: "0.0.6",
+			version: "0.0.7",
 			children: [
 				"label",
 				"input",

package/dist/tabs/tabs-group2.js

@@ -23,7 +23,7 @@ var m, h = class extends l {
 	static {
 		this.metadata = {
 			tag: "nve-tabs-group",
-			version: "0.0.6",
+			version: "0.0.7",
 			children: ["nve-tabs"]
 		};
 	}

package/dist/tabs/tabs.d.ts

@@ -80,5 +80,6 @@ export declare class Tabs extends LitElement {
     _internals: ElementInternals;
     render(): import('lit-html').TemplateResult<1>;
     connectedCallback(): void;
+    disconnectedCallback(): void;
     updated(props: PropertyValues<this>): void;
 }

package/dist/tabs/tabs2.js

@@ -20,7 +20,7 @@ var _ = class extends o {
 	static {
 		this.metadata = {
 			tag: "nve-tabs-item",
-			version: "0.0.6",
+			version: "0.0.7",
 			parents: ["nve-tabs"]
 		};
 	}
@@ -51,7 +51,7 @@ var v = class extends p {
 	static {
 		this.metadata = {
 			tag: "nve-tabs",
-			version: "0.0.6",
+			version: "0.0.7",
 			children: ["nve-tabs-item"]
 		};
 	}
@@ -68,8 +68,14 @@ var v = class extends p {
 		return m`<div internal-host><slot></slot></div>`;
 	}
 	connectedCallback() {
-		super.connectedCallback(), t(this, u), r(this), this._internals.role = "tablist", this.addEventListener("click", (e) => this.#e(e.target));
+		super.connectedCallback(), t(this, u), r(this), this._internals.role = "tablist", this.addEventListener("click", this.#t);
 	}
+	disconnectedCallback() {
+		super.disconnectedCallback(), this.removeEventListener("click", this.#t);
+	}
+	#t = (e) => {
+		this.#e(e.target);
+	};
 	updated(e) {
 		super.updated(e), this._internals.ariaOrientation = this.vertical ? "vertical" : "horizontal";
 	}

package/dist/tabs/tabs2.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs2.js","names":["#selectTab"],"sources":["../../src/tabs/tabs.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { PropertyValues } from 'lit';\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { queryAssignedElements } from 'lit/decorators/query-assigned-elements.js';\nimport type { KeynavListConfig } from '@nvidia-elements/core/internal';\nimport {\n  BaseButton,\n  stateSelected,\n  useStyles,\n  keyNavigationList,\n  attachInternals,\n  audit,\n  appendRootNodeStyle,\n  appendAnchorName,\n  removeAnchorName\n} from '@nvidia-elements/core/internal';\nimport globalStyles from './tabs.global.css?inline';\nimport tabsItemStyleSheet from './tabs-item.css?inline';\nimport tabsStyleSheet from './tabs.css?inline';\n\n/**\n * @element nve-tabs-item\n * @description Represents an individual tab within a tablist, providing a selectable button for switching between content views.\n * @since 0.10.0\n * @entrypoint \\@nvidia-elements/core/tabs\n * @slot - default slot for content\n * @cssprop --font-size\n * @cssprop --border-width\n * @cssprop --border-height\n * @cssprop --border-top\n * @cssprop --border-background\n * @cssprop --width\n * @cssprop --padding\n * @cssprop --font-size\n * @cssprop --font-weight\n * @cssprop --border-radius\n * @cssprop --color\n * @cssprop --height\n * @cssprop --cursor\n * @cssprop --text-transform\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/tabs/\n * @responsive false\n */\n@audit()\n@stateSelected<TabsItem>()\nexport class TabsItem extends BaseButton {\n  /**\n   * Determines which tab item the user selects, defaults to false.\n   */\n  @property({ type: Boolean, reflect: true }) selected = false;\n\n  static styles = useStyles([tabsItemStyleSheet]);\n\n  static readonly metadata = {\n    tag: 'nve-tabs-item',\n    version: '0.0.0',\n    parents: ['nve-tabs']\n  };\n\n  render() {\n    return html`\n      <div internal-host focus-within>\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  constructor() {\n    super();\n    this.type = 'button';\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._internals.role = 'tab';\n  }\n\n  updated(props: PropertyValues<this>) {\n    if (props.has('selected')) {\n      if (this.selected) {\n        appendAnchorName(this, '--selected');\n      } else {\n        removeAnchorName(this, '--selected');\n      }\n    }\n  }\n}\n\n/**\n * @element nve-tabs\n * @description Tabs provide a selection UX, typically used for swapping content shown on a page, or within a navigation context.\n * @since 0.10.0\n * @entrypoint \\@nvidia-elements/core/tabs\n * @slot - default slot for tab-item\n * @cssprop --gap\n * @cssprop --indicator-background\n * @cssprop --indicator-border-radius\n * @cssprop --indicator-height\n * @cssprop --border-inset\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/tabs/\n * @responsive false\n */\n@audit()\n@keyNavigationList<Tabs>()\nexport class Tabs extends LitElement {\n  /**\n   * Determines whether the tabs should display in a vertical layout vs. defaulting to horizontal.\n   */\n  @property({ type: Boolean, reflect: true }) vertical = false;\n\n  /**\n   * Determines whether the tabs should display a border on selected items vs. defaults to show border.\n   */\n  @property({ type: Boolean, reflect: true }) borderless = false;\n\n  /**\n   * Determines whether the tabs should handle selection behavior vs. defaults to off.\n   */\n  @property({ type: Boolean, attribute: 'behavior-select' }) behaviorSelect = false;\n\n  static styles = useStyles([tabsStyleSheet]);\n\n  static readonly metadata = {\n    tag: 'nve-tabs',\n    version: '0.0.0',\n    children: ['nve-tabs-item']\n  };\n\n  /** @private */\n  get keynavListConfig(): KeynavListConfig {\n    return {\n      items: this.items,\n      layout: this.vertical ? 'vertical' : 'horizontal'\n    };\n  }\n\n  @queryAssignedElements() private items!: TabsItem[];\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  #selectTab(tabItem: HTMLElement & { matches: Element['matches']; disabled?: boolean; selected?: boolean }) {\n    if (!this.behaviorSelect || !tabItem.matches('nve-tabs-item, nve-tabs-item') || tabItem.disabled) {\n      return;\n    }\n\n    this.keynavListConfig.items.forEach((i: HTMLElement) => ((i as TabsItem).selected = false));\n    tabItem.selected = true;\n  }\n\n  render() {\n    return html`\n      <div internal-host>\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    appendRootNodeStyle(this, globalStyles);\n    attachInternals(this);\n    this._internals.role = 'tablist';\n    this.addEventListener('click', (e: Event) =>\n      this.#selectTab(e.target as HTMLElement & { matches: Element['matches']; disabled?: boolean; selected?: boolean })\n    );\n  }\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n    this._internals.ariaOrientation = this.vertical ? 'vertical' : 'horizontal';\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;AAgDO,IAAA,IAAA,cAAuB,EAAW;;gBAMvB,EAAU,CAAC,EAAmB,CAAC;;;kBAEpB;GACzB,KAAK;GACL,SAAS;GACT,SAAS,CAAC,WAAA;GACX;;CAED,SAAS;AACP,SAAO,CAAI;;CAOb,cAAc;AAEZ,EADA,OAAO,kBAnB8C,IAoBrD,KAAK,OAAO;;CAGd,oBAAoB;AAElB,EADA,MAAM,mBAAmB,EACzB,KAAK,WAAW,OAAO;;CAGzB,QAAQ,GAA6B;AACnC,EAAI,EAAM,IAAI,WAAW,KACnB,KAAK,WACP,EAAiB,MAAM,aAAa,GAEpC,EAAiB,MAAM,aAAa;;;GAjCzC,EAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,YAAA,KAAA,EAAA,SAN5C,GAAO,EACP,GAAyB,CAAA,EAAA,EAAA;AA4DnB,IAAA,IAAA,cAAmB,EAAW;;+BAIoB,sBAKE,0BAKmB;;;gBAE5D,EAAU,CAAC,EAAe,CAAC;;;kBAEhB;GACzB,KAAK;GACL,SAAS;GACT,UAAU,CAAC,gBAAA;GACZ;;CAGD,IAAI,mBAAqC;AACvC,SAAO;GACL,OAAO,KAAK;GACZ,QAAQ,KAAK,WAAW,aAAa;GACtC;;CAQH,GAAW,GAAgG;AACrG,GAAC,KAAK,kBAAkB,CAAC,EAAQ,QAAQ,+BAA+B,IAAI,EAAQ,aAIxF,KAAK,iBAAiB,MAAM,SAAS,MAAoB,EAAgB,WAAW,GAAO,EAC3F,EAAQ,WAAW;;CAGrB,SAAS;AACP,SAAO,CAAI;;CAOb,oBAAoB;AAKlB,EAJA,MAAM,mBAAmB,EACzB,EAAoB,MAAM,EAAa,EACvC,EAAgB,KAAK,EACrB,KAAK,WAAW,OAAO,WACvB,KAAK,iBAAiB,UAAU,MAC9B,MAAA,EAAgB,EAAE,OAAgG,CACnH;;CAGH,QAAQ,GAA6B;AAEnC,EADA,MAAM,QAAQ,EAAM,EACpB,KAAK,WAAW,kBAAkB,KAAK,WAAW,aAAa;;;GA9DhE,EAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,YAAA,KAAA,EAAA,KAK1C,EAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,cAAA,KAAA,EAAA,KAK1C,EAAS;CAAE,MAAM;CAAS,WAAW;CAAmB,CAAC,CAAA,EAAA,EAAA,WAAA,kBAAA,KAAA,EAAA,KAkBzD,GAAuB,CAAA,EAAA,EAAA,WAAA,SAAA,KAAA,EAAA,SAlCzB,GAAO,EACP,GAAyB,CAAA,EAAA,EAAA"}
+{"version":3,"file":"tabs2.js","names":["#onClick","#selectTab"],"sources":["../../src/tabs/tabs.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { PropertyValues } from 'lit';\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { queryAssignedElements } from 'lit/decorators/query-assigned-elements.js';\nimport type { KeynavListConfig } from '@nvidia-elements/core/internal';\nimport {\n  BaseButton,\n  stateSelected,\n  useStyles,\n  keyNavigationList,\n  attachInternals,\n  audit,\n  appendRootNodeStyle,\n  appendAnchorName,\n  removeAnchorName\n} from '@nvidia-elements/core/internal';\nimport globalStyles from './tabs.global.css?inline';\nimport tabsItemStyleSheet from './tabs-item.css?inline';\nimport tabsStyleSheet from './tabs.css?inline';\n\n/**\n * @element nve-tabs-item\n * @description Represents an individual tab within a tablist, providing a selectable button for switching between content views.\n * @since 0.10.0\n * @entrypoint \\@nvidia-elements/core/tabs\n * @slot - default slot for content\n * @cssprop --font-size\n * @cssprop --border-width\n * @cssprop --border-height\n * @cssprop --border-top\n * @cssprop --border-background\n * @cssprop --width\n * @cssprop --padding\n * @cssprop --font-size\n * @cssprop --font-weight\n * @cssprop --border-radius\n * @cssprop --color\n * @cssprop --height\n * @cssprop --cursor\n * @cssprop --text-transform\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/tabs/\n * @responsive false\n */\n@audit()\n@stateSelected<TabsItem>()\nexport class TabsItem extends BaseButton {\n  /**\n   * Determines which tab item the user selects, defaults to false.\n   */\n  @property({ type: Boolean, reflect: true }) selected = false;\n\n  static styles = useStyles([tabsItemStyleSheet]);\n\n  static readonly metadata = {\n    tag: 'nve-tabs-item',\n    version: '0.0.0',\n    parents: ['nve-tabs']\n  };\n\n  render() {\n    return html`\n      <div internal-host focus-within>\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  constructor() {\n    super();\n    this.type = 'button';\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._internals.role = 'tab';\n  }\n\n  updated(props: PropertyValues<this>) {\n    if (props.has('selected')) {\n      if (this.selected) {\n        appendAnchorName(this, '--selected');\n      } else {\n        removeAnchorName(this, '--selected');\n      }\n    }\n  }\n}\n\n/**\n * @element nve-tabs\n * @description Tabs provide a selection UX, typically used for swapping content shown on a page, or within a navigation context.\n * @since 0.10.0\n * @entrypoint \\@nvidia-elements/core/tabs\n * @slot - default slot for tab-item\n * @cssprop --gap\n * @cssprop --indicator-background\n * @cssprop --indicator-border-radius\n * @cssprop --indicator-height\n * @cssprop --border-inset\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/tabs/\n * @responsive false\n */\n@audit()\n@keyNavigationList<Tabs>()\nexport class Tabs extends LitElement {\n  /**\n   * Determines whether the tabs should display in a vertical layout vs. defaulting to horizontal.\n   */\n  @property({ type: Boolean, reflect: true }) vertical = false;\n\n  /**\n   * Determines whether the tabs should display a border on selected items vs. defaults to show border.\n   */\n  @property({ type: Boolean, reflect: true }) borderless = false;\n\n  /**\n   * Determines whether the tabs should handle selection behavior vs. defaults to off.\n   */\n  @property({ type: Boolean, attribute: 'behavior-select' }) behaviorSelect = false;\n\n  static styles = useStyles([tabsStyleSheet]);\n\n  static readonly metadata = {\n    tag: 'nve-tabs',\n    version: '0.0.0',\n    children: ['nve-tabs-item']\n  };\n\n  /** @private */\n  get keynavListConfig(): KeynavListConfig {\n    return {\n      items: this.items,\n      layout: this.vertical ? 'vertical' : 'horizontal'\n    };\n  }\n\n  @queryAssignedElements() private items!: TabsItem[];\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  #selectTab(tabItem: HTMLElement & { matches: Element['matches']; disabled?: boolean; selected?: boolean }) {\n    if (!this.behaviorSelect || !tabItem.matches('nve-tabs-item, nve-tabs-item') || tabItem.disabled) {\n      return;\n    }\n\n    this.keynavListConfig.items.forEach((i: HTMLElement) => ((i as TabsItem).selected = false));\n    tabItem.selected = true;\n  }\n\n  render() {\n    return html`\n      <div internal-host>\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    appendRootNodeStyle(this, globalStyles);\n    attachInternals(this);\n    this._internals.role = 'tablist';\n    this.addEventListener('click', this.#onClick);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('click', this.#onClick);\n  }\n\n  #onClick = (e: Event) => {\n    this.#selectTab(e.target as HTMLElement & { matches: Element['matches']; disabled?: boolean; selected?: boolean });\n  };\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n    this._internals.ariaOrientation = this.vertical ? 'vertical' : 'horizontal';\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;AAgDO,IAAA,IAAA,cAAuB,EAAW;;gBAMvB,EAAU,CAAC,EAAmB,CAAC;;;kBAEpB;GACzB,KAAK;GACL,SAAS;GACT,SAAS,CAAC,WAAA;GACX;;CAED,SAAS;AACP,SAAO,CAAI;;CAOb,cAAc;AAEZ,EADA,OAAO,kBAnB8C,IAoBrD,KAAK,OAAO;;CAGd,oBAAoB;AAElB,EADA,MAAM,mBAAmB,EACzB,KAAK,WAAW,OAAO;;CAGzB,QAAQ,GAA6B;AACnC,EAAI,EAAM,IAAI,WAAW,KACnB,KAAK,WACP,EAAiB,MAAM,aAAa,GAEpC,EAAiB,MAAM,aAAa;;;GAjCzC,EAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,YAAA,KAAA,EAAA,SAN5C,GAAO,EACP,GAAyB,CAAA,EAAA,EAAA;AA4DnB,IAAA,IAAA,cAAmB,EAAW;;+BAIoB,sBAKE,0BAKmB;;;gBAE5D,EAAU,CAAC,EAAe,CAAC;;;kBAEhB;GACzB,KAAK;GACL,SAAS;GACT,UAAU,CAAC,gBAAA;GACZ;;CAGD,IAAI,mBAAqC;AACvC,SAAO;GACL,OAAO,KAAK;GACZ,QAAQ,KAAK,WAAW,aAAa;GACtC;;CAQH,GAAW,GAAgG;AACrG,GAAC,KAAK,kBAAkB,CAAC,EAAQ,QAAQ,+BAA+B,IAAI,EAAQ,aAIxF,KAAK,iBAAiB,MAAM,SAAS,MAAoB,EAAgB,WAAW,GAAO,EAC3F,EAAQ,WAAW;;CAGrB,SAAS;AACP,SAAO,CAAI;;CAOb,oBAAoB;AAKlB,EAJA,MAAM,mBAAmB,EACzB,EAAoB,MAAM,EAAa,EACvC,EAAgB,KAAK,EACrB,KAAK,WAAW,OAAO,WACvB,KAAK,iBAAiB,SAAS,MAAA,EAAc;;CAG/C,uBAAuB;AAErB,EADA,MAAM,sBAAsB,EAC5B,KAAK,oBAAoB,SAAS,MAAA,EAAc;;CAGlD,MAAY,MAAa;AACvB,QAAA,EAAgB,EAAE,OAAgG;;CAGpH,QAAQ,GAA6B;AAEnC,EADA,MAAM,QAAQ,EAAM,EACpB,KAAK,WAAW,kBAAkB,KAAK,WAAW,aAAa;;;GArEhE,EAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,YAAA,KAAA,EAAA,KAK1C,EAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,EAAA,WAAA,cAAA,KAAA,EAAA,KAK1C,EAAS;CAAE,MAAM;CAAS,WAAW;CAAmB,CAAC,CAAA,EAAA,EAAA,WAAA,kBAAA,KAAA,EAAA,KAkBzD,GAAuB,CAAA,EAAA,EAAA,WAAA,SAAA,KAAA,EAAA,SAlCzB,GAAO,EACP,GAAyB,CAAA,EAAA,EAAA"}

package/dist/tag/tag2.js

@@ -17,7 +17,7 @@ var f = class extends t {
 	static {
 		this.metadata = {
 			tag: "nve-tag",
-			version: "0.0.6"
+			version: "0.0.7"
 		};
 	}
 	static {

package/dist/textarea/textarea2.js

@@ -9,7 +9,7 @@ var r = class extends t {
 	static {
 		this.metadata = {
 			tag: "nve-textarea",
-			version: "0.0.6"
+			version: "0.0.7"
 		};
 	}
 };

package/dist/time/time2.js

@@ -19,7 +19,7 @@ var l = class extends r {
 	static {
 		this.metadata = {
 			tag: "nve-time",
-			version: "0.0.6"
+			version: "0.0.7"
 		};
 	}
 	static {

package/dist/toast/toast2.js

@@ -23,7 +23,7 @@ var g = class extends f {
 	static {
 		this.metadata = {
 			tag: "nve-toast",
-			version: "0.0.6"
+			version: "0.0.7"
 		};
 	}
 	static {

package/dist/toggletip/toggletip-footer2.js

@@ -11,7 +11,7 @@ var o = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-toggletip-footer",
-			version: "0.0.6",
+			version: "0.0.7",
 			parents: ["nve-toggletip"]
 		};
 	}

package/dist/toggletip/toggletip-header2.js

@@ -11,7 +11,7 @@ var o = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-toggletip-header",
-			version: "0.0.6",
+			version: "0.0.7",
 			parents: ["nve-toggletip"]
 		};
 	}

package/dist/toggletip/toggletip2.js

@@ -24,7 +24,7 @@ var g = class extends f {
 	static {
 		this.metadata = {
 			tag: "nve-toggletip",
-			version: "0.0.6"
+			version: "0.0.7"
 		};
 	}
 	static {

package/dist/toolbar/toolbar2.js

@@ -21,7 +21,7 @@ var f = class extends c {
 	static {
 		this.metadata = {
 			tag: "nve-toolbar",
-			version: "0.0.6"
+			version: "0.0.7"
 		};
 	}
 	static {

package/dist/tooltip/tooltip2.js

@@ -19,7 +19,7 @@ var d = class extends s {
 	static {
 		this.metadata = {
 			tag: "nve-tooltip",
-			version: "0.0.6"
+			version: "0.0.7"
 		};
 	}
 	render() {

package/dist/tree/tree-node.d.ts

@@ -84,6 +84,7 @@ export declare class TreeNode extends LitElement {
     _internals: ElementInternals;
     render(): import('lit-html').TemplateResult<1>;
     connectedCallback(): void;
+    disconnectedCallback(): void;
     /** opens and sets the expanded state automatically if behaviorExpand is true */
     open(): void;
     /** closes and sets the expanded state automatically if behaviorExpand is true */

package/dist/tree/tree-node2.js

@@ -39,7 +39,7 @@ var E = class extends b {
 	static {
 		this.metadata = {
 			tag: "nve-tree-node",
-			version: "0.0.6",
+			version: "0.0.7",
 			parents: ["nve-tree", "nve-tree-node"]
 		};
 	}
@@ -57,7 +57,10 @@ var E = class extends b {
 		return x`<div internal-host @slotchange="${this.#a}"><div part="_node">${this.#i ? x`<nve-icon-button part="icon-button" exportparts="icon:icon-button-icon" @pointerup="${this.#l}" role="presentation" tabindex="-1" size="sm" container="inline" nofocus><nve-icon part="icon" name="caret" direction="${this.expanded ? "down" : "right"}" size="sm"></nve-icon></nve-icon-button>` : S} ${this.selectable === "multi" ? x`<nve-checkbox part="checkbox" nofocus><input type="checkbox" @change="${this.#f}" .checked="${this.selected}" .indeterminate="${this.indeterminate}" .ariaLabel="${this.i18n.expand}" tabindex="-1"></nve-checkbox>` : S}<div tabindex="0" part="_node-header"><slot tabindex="0" class="node-title" @click="${this.#c}"></slot><slot name="content" part="_content"></slot></div></div><div role="group" part="_nodes"><slot name="nodes"></slot></div></div>`;
 	}
 	connectedCallback() {
-		super.connectedCallback(), t(this), this._internals.role = "treeitem", this.#s(), this.#a();
+		super.connectedCallback(), t(this), this._internals.role = "treeitem", this.addEventListener("keyup", this.#s), this.#a();
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback(), this.removeEventListener("keyup", this.#s);
 	}
 	open() {
 		this.#n.open();
@@ -71,11 +74,9 @@ var E = class extends b {
 	#o() {
 		this.#i ? this._internals.states.add("is-expandable") : this._internals.states.delete("is-expandable");
 	}
-	#s() {
-		this.addEventListener("keyup", (e) => {
-			this.#i && e.code === "ArrowLeft" && e.target === this && this.close(), this.#i && e.code === "ArrowRight" && e.target === this && this.open(), e.code === "Space" && e.target === this && this.selectable && (e.preventDefault(), this.#u());
-		});
-	}
+	#s = (e) => {
+		this.#i && e.code === "ArrowLeft" && e.target === this && this.close(), this.#i && e.code === "ArrowRight" && e.target === this && this.open(), e.code === "Space" && e.target === this && this.selectable && (e.preventDefault(), this.#u());
+	};
 	#c(t) {
 		let n = e(t.currentTarget).length;
 		this.#i && !this.selectable && !n && this.#l(), this.selectable && (!n || t.target.localName === "a") && this.#u();

package/dist/tree/tree-node2.js.map

@@ -1 +1 @@
-{"version":3,"file":"tree-node2.js","names":["#i18nController","#tree","#isExpandable","#nodeUpdate","#toggleExpand","#toggleMultiSelection","#nodeHeaderClick","#setupKeyNavInteractions","#typeExpandableController","#toggleExpandableState","#toggleSelection","#toggleSingleSelection","#typeSelectableController"],"sources":["../../src/tree/tree-node.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { LitElement, html, nothing } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { state } from 'lit/decorators/state.js';\nimport { queryAssignedElements } from 'lit/decorators/query-assigned-elements.js';\nimport {\n  I18nController,\n  TypeExpandableController,\n  TypeSelectableController,\n  attachInternals,\n  audit,\n  getFlattenedFocusableItems,\n  hostAttr,\n  scopedRegistry,\n  stateExpanded,\n  stateHighlighted,\n  stateSelected,\n  typeAnchor,\n  typeSSR,\n  useStyles\n} from '@nvidia-elements/core/internal';\nimport { IconButton } from '@nvidia-elements/core/icon-button';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport { Checkbox } from '@nvidia-elements/core/checkbox';\nimport type { Tree } from './tree.js';\nimport styles from './tree-node.css?inline';\nimport { updateNodeSelection } from './utils.js';\n\n/**\n * @element nve-tree-node\n * @description A tree view widget presents a hierarchical list. Any item in the hierarchy may have child items, and items that have children can expand or collapse to show or hide the children.\n * @since 1.2.0\n * @entrypoint \\@nvidia-elements/core/tree\n * @event open - Dispatched when the node opens.\n * @event close - Dispatched when the node closes.\n * @event select - Dispatched when the node selection state changes.\n * @command --select - use to select the node\n * @command --deselect - use to deselect the node\n * @command --toggle-select - use to toggle the node selection state\n * @command --open - use to open the node\n * @command --close - use to close the node\n * @command --toggle - use to toggle open / closed state of the node\n * @slot - Use default slot for basic text content or nested <nve-tree-node> elements.\n * @slot content - Use only for extended long form content containing interactive elements or form inputs.\n * @cssprop --color\n * @cssprop --border-radius\n * @cssprop --font-size\n * @cssprop --min-height\n * @cssprop --text-wrap\n * @cssprop --font-weight\n * @cssprop --width\n\n * @csspart icon-button - The icon button element\n * @csspart icon - The icon element\n * @csspart checkbox - The checkbox element\n\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/treeview/\n *\n */\n@audit()\n@typeSSR({ log: false }) // warning about ssr mismatch disabled as tree node will never be a 1:1 match in ssr due to performance constraints and slot complexity\n@typeAnchor()\n@stateSelected()\n@stateExpanded()\n@scopedRegistry()\n@stateHighlighted()\nexport class TreeNode extends LitElement {\n  /**\n   * Determines if node is in an expanded state.\n   */\n  @property({ type: Boolean, reflect: true }) expanded = false;\n\n  /**\n   * Determines whether if node is in a selected state.\n   */\n  @property({ type: Boolean, reflect: true }) selected = false;\n\n  /**\n   * Determines whether a node can be expandable. Expandable by default if slotted nodes exist.\n   */\n  @property({ type: Boolean }) expandable = false;\n\n  /**\n   * Determines whether a node can be in a selected state. Nodes can be in a single or multi select state.\n   */\n  @property({ type: String }) selectable: 'single' | 'multi';\n\n  /**\n   * Determines the highlighted state of the element. Highlighted states serve non-interactive selections where nodes may relate to other selected portions of the UI.\n   */\n  @property({ type: Boolean }) highlighted = false;\n\n  #i18nController: I18nController<this> = new I18nController<this>(this);\n\n  /**\n   * Updates internal string values for internationalization.\n   */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  /** @private */\n  @hostAttr() slot = 'nodes';\n\n  get #tree() {\n    return this.closest<Tree>('nve-tree');\n  }\n\n  /**\n   * Returns list of child nodes\n   */\n  @queryAssignedElements({ slot: 'nodes' }) readonly nodes!: TreeNode[];\n\n  /* @private */\n  @state() indeterminate = false;\n\n  /* @private */\n  @state() behaviorExpand = false;\n\n  /* @private */\n  @state() behaviorSelect = false;\n\n  #typeExpandableController = new TypeExpandableController(this);\n\n  #typeSelectableController = new TypeSelectableController(this);\n\n  get #isExpandable() {\n    return this.expandable || this.expanded || !!this.nodes?.length;\n  }\n\n  static metadata = {\n    tag: 'nve-tree-node',\n    version: '0.0.0',\n    parents: ['nve-tree', 'nve-tree-node']\n  };\n\n  static elementDefinitions = {\n    [IconButton.metadata.tag]: IconButton,\n    [Icon.metadata.tag]: Icon,\n    [Checkbox.metadata.tag]: Checkbox\n  };\n\n  static styles = useStyles([styles]);\n\n  declare _internals: ElementInternals;\n\n  /* eslint-disable @nvidia-elements/lint/no-missing-control-label */\n  render() {\n    return html`\n      <div internal-host @slotchange=${this.#nodeUpdate}>\n        <div part=\"_node\">\n          ${\n            this.#isExpandable\n              ? html`\n            <nve-icon-button part=\"icon-button\" exportparts=\"icon:icon-button-icon\" @pointerup=${this.#toggleExpand} role=\"presentation\" tabindex=\"-1\" size=\"sm\" container=\"inline\" nofocus>\n              <nve-icon part=\"icon\" name=\"caret\" direction=${this.expanded ? 'down' : 'right'} size=\"sm\"></nve-icon>\n            </nve-icon-button>`\n              : nothing\n          }\n          ${\n            this.selectable === 'multi'\n              ? html`\n            <nve-checkbox part=\"checkbox\" nofocus>\n              <input type=\"checkbox\" @change=${this.#toggleMultiSelection} .checked=${this.selected} .indeterminate=${this.indeterminate} .ariaLabel=${this.i18n.expand} tabindex=\"-1\" />\n            </nve-checkbox>`\n              : nothing\n          }\n          <div tabindex=\"0\" part=\"_node-header\">\n            <slot tabindex=\"0\" class=\"node-title\" @click=${this.#nodeHeaderClick}></slot>\n            <slot name=\"content\" part=\"_content\"></slot>\n          </div>\n        </div>\n        <div role=\"group\" part=\"_nodes\"><slot name=\"nodes\"></slot></div>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'treeitem';\n    this.#setupKeyNavInteractions();\n    this.#nodeUpdate();\n  }\n\n  /** opens and sets the expanded state automatically if behaviorExpand is true */\n  open() {\n    this.#typeExpandableController.open();\n  }\n\n  /** closes and sets the expanded state automatically if behaviorExpand is true */\n  close() {\n    this.#typeExpandableController.close();\n  }\n\n  #nodeUpdate() {\n    this.requestUpdate();\n    this.#toggleExpandableState();\n  }\n\n  #toggleExpandableState() {\n    this.#isExpandable ? this._internals.states.add('is-expandable') : this._internals.states.delete('is-expandable');\n  }\n\n  #setupKeyNavInteractions() {\n    this.addEventListener('keyup', e => {\n      if (this.#isExpandable && e.code === 'ArrowLeft' && e.target === this) {\n        this.close();\n      }\n\n      if (this.#isExpandable && e.code === 'ArrowRight' && e.target === this) {\n        this.open();\n      }\n\n      if (e.code === 'Space' && e.target === this && this.selectable) {\n        e.preventDefault();\n        this.#toggleSelection();\n      }\n    });\n  }\n\n  #nodeHeaderClick(e: Event) {\n    const hasFocusableElements = getFlattenedFocusableItems(e.currentTarget as HTMLElement).length;\n    if (this.#isExpandable && !this.selectable && !hasFocusableElements) {\n      this.#toggleExpand();\n    }\n\n    if (this.selectable && (!hasFocusableElements || (e.target as HTMLElement).localName === 'a')) {\n      this.#toggleSelection();\n    }\n  }\n\n  #toggleExpand() {\n    this.#typeExpandableController.toggle();\n  }\n\n  #toggleSelection() {\n    if (this.selectable === 'single') {\n      this.#toggleSingleSelection();\n    }\n\n    if (this.selectable === 'multi') {\n      this.#toggleMultiSelection();\n    }\n  }\n\n  #toggleSingleSelection() {\n    this.#typeSelectableController.toggle();\n    if (this.behaviorSelect) {\n      this.#tree!.nodes.filter(n => n !== this).forEach(n => (n.selected = false));\n    }\n  }\n\n  #toggleMultiSelection() {\n    this.#typeSelectableController.toggle();\n\n    if (this.behaviorSelect) {\n      this.nodes.forEach(n => {\n        n.selected = this.selected;\n        n.indeterminate = false;\n      });\n      this.#tree!.nodes.forEach(node => updateNodeSelection(node));\n    }\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"tree-node2.js","names":["#i18nController","#tree","#isExpandable","#nodeUpdate","#toggleExpand","#toggleMultiSelection","#nodeHeaderClick","#onKeyup","#typeExpandableController","#toggleExpandableState","#toggleSelection","#toggleSingleSelection","#typeSelectableController"],"sources":["../../src/tree/tree-node.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { LitElement, html, nothing } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { state } from 'lit/decorators/state.js';\nimport { queryAssignedElements } from 'lit/decorators/query-assigned-elements.js';\nimport {\n  I18nController,\n  TypeExpandableController,\n  TypeSelectableController,\n  attachInternals,\n  audit,\n  getFlattenedFocusableItems,\n  hostAttr,\n  scopedRegistry,\n  stateExpanded,\n  stateHighlighted,\n  stateSelected,\n  typeAnchor,\n  typeSSR,\n  useStyles\n} from '@nvidia-elements/core/internal';\nimport { IconButton } from '@nvidia-elements/core/icon-button';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport { Checkbox } from '@nvidia-elements/core/checkbox';\nimport type { Tree } from './tree.js';\nimport styles from './tree-node.css?inline';\nimport { updateNodeSelection } from './utils.js';\n\n/**\n * @element nve-tree-node\n * @description A tree view widget presents a hierarchical list. Any item in the hierarchy may have child items, and items that have children can expand or collapse to show or hide the children.\n * @since 1.2.0\n * @entrypoint \\@nvidia-elements/core/tree\n * @event open - Dispatched when the node opens.\n * @event close - Dispatched when the node closes.\n * @event select - Dispatched when the node selection state changes.\n * @command --select - use to select the node\n * @command --deselect - use to deselect the node\n * @command --toggle-select - use to toggle the node selection state\n * @command --open - use to open the node\n * @command --close - use to close the node\n * @command --toggle - use to toggle open / closed state of the node\n * @slot - Use default slot for basic text content or nested <nve-tree-node> elements.\n * @slot content - Use only for extended long form content containing interactive elements or form inputs.\n * @cssprop --color\n * @cssprop --border-radius\n * @cssprop --font-size\n * @cssprop --min-height\n * @cssprop --text-wrap\n * @cssprop --font-weight\n * @cssprop --width\n\n * @csspart icon-button - The icon button element\n * @csspart icon - The icon element\n * @csspart checkbox - The checkbox element\n\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/treeview/\n *\n */\n@audit()\n@typeSSR({ log: false }) // warning about ssr mismatch disabled as tree node will never be a 1:1 match in ssr due to performance constraints and slot complexity\n@typeAnchor()\n@stateSelected()\n@stateExpanded()\n@scopedRegistry()\n@stateHighlighted()\nexport class TreeNode extends LitElement {\n  /**\n   * Determines if node is in an expanded state.\n   */\n  @property({ type: Boolean, reflect: true }) expanded = false;\n\n  /**\n   * Determines whether if node is in a selected state.\n   */\n  @property({ type: Boolean, reflect: true }) selected = false;\n\n  /**\n   * Determines whether a node can be expandable. Expandable by default if slotted nodes exist.\n   */\n  @property({ type: Boolean }) expandable = false;\n\n  /**\n   * Determines whether a node can be in a selected state. Nodes can be in a single or multi select state.\n   */\n  @property({ type: String }) selectable: 'single' | 'multi';\n\n  /**\n   * Determines the highlighted state of the element. Highlighted states serve non-interactive selections where nodes may relate to other selected portions of the UI.\n   */\n  @property({ type: Boolean }) highlighted = false;\n\n  #i18nController: I18nController<this> = new I18nController<this>(this);\n\n  /**\n   * Updates internal string values for internationalization.\n   */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  /** @private */\n  @hostAttr() slot = 'nodes';\n\n  get #tree() {\n    return this.closest<Tree>('nve-tree');\n  }\n\n  /**\n   * Returns list of child nodes\n   */\n  @queryAssignedElements({ slot: 'nodes' }) readonly nodes!: TreeNode[];\n\n  /* @private */\n  @state() indeterminate = false;\n\n  /* @private */\n  @state() behaviorExpand = false;\n\n  /* @private */\n  @state() behaviorSelect = false;\n\n  #typeExpandableController = new TypeExpandableController(this);\n\n  #typeSelectableController = new TypeSelectableController(this);\n\n  get #isExpandable() {\n    return this.expandable || this.expanded || !!this.nodes?.length;\n  }\n\n  static metadata = {\n    tag: 'nve-tree-node',\n    version: '0.0.0',\n    parents: ['nve-tree', 'nve-tree-node']\n  };\n\n  static elementDefinitions = {\n    [IconButton.metadata.tag]: IconButton,\n    [Icon.metadata.tag]: Icon,\n    [Checkbox.metadata.tag]: Checkbox\n  };\n\n  static styles = useStyles([styles]);\n\n  declare _internals: ElementInternals;\n\n  /* eslint-disable @nvidia-elements/lint/no-missing-control-label */\n  render() {\n    return html`\n      <div internal-host @slotchange=${this.#nodeUpdate}>\n        <div part=\"_node\">\n          ${\n            this.#isExpandable\n              ? html`\n            <nve-icon-button part=\"icon-button\" exportparts=\"icon:icon-button-icon\" @pointerup=${this.#toggleExpand} role=\"presentation\" tabindex=\"-1\" size=\"sm\" container=\"inline\" nofocus>\n              <nve-icon part=\"icon\" name=\"caret\" direction=${this.expanded ? 'down' : 'right'} size=\"sm\"></nve-icon>\n            </nve-icon-button>`\n              : nothing\n          }\n          ${\n            this.selectable === 'multi'\n              ? html`\n            <nve-checkbox part=\"checkbox\" nofocus>\n              <input type=\"checkbox\" @change=${this.#toggleMultiSelection} .checked=${this.selected} .indeterminate=${this.indeterminate} .ariaLabel=${this.i18n.expand} tabindex=\"-1\" />\n            </nve-checkbox>`\n              : nothing\n          }\n          <div tabindex=\"0\" part=\"_node-header\">\n            <slot tabindex=\"0\" class=\"node-title\" @click=${this.#nodeHeaderClick}></slot>\n            <slot name=\"content\" part=\"_content\"></slot>\n          </div>\n        </div>\n        <div role=\"group\" part=\"_nodes\"><slot name=\"nodes\"></slot></div>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'treeitem';\n    this.addEventListener('keyup', this.#onKeyup);\n    this.#nodeUpdate();\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('keyup', this.#onKeyup);\n  }\n\n  /** opens and sets the expanded state automatically if behaviorExpand is true */\n  open() {\n    this.#typeExpandableController.open();\n  }\n\n  /** closes and sets the expanded state automatically if behaviorExpand is true */\n  close() {\n    this.#typeExpandableController.close();\n  }\n\n  #nodeUpdate() {\n    this.requestUpdate();\n    this.#toggleExpandableState();\n  }\n\n  #toggleExpandableState() {\n    this.#isExpandable ? this._internals.states.add('is-expandable') : this._internals.states.delete('is-expandable');\n  }\n\n  #onKeyup = (e: KeyboardEvent) => {\n    if (this.#isExpandable && e.code === 'ArrowLeft' && e.target === this) {\n      this.close();\n    }\n\n    if (this.#isExpandable && e.code === 'ArrowRight' && e.target === this) {\n      this.open();\n    }\n\n    if (e.code === 'Space' && e.target === this && this.selectable) {\n      e.preventDefault();\n      this.#toggleSelection();\n    }\n  };\n\n  #nodeHeaderClick(e: Event) {\n    const hasFocusableElements = getFlattenedFocusableItems(e.currentTarget as HTMLElement).length;\n    if (this.#isExpandable && !this.selectable && !hasFocusableElements) {\n      this.#toggleExpand();\n    }\n\n    if (this.selectable && (!hasFocusableElements || (e.target as HTMLElement).localName === 'a')) {\n      this.#toggleSelection();\n    }\n  }\n\n  #toggleExpand() {\n    this.#typeExpandableController.toggle();\n  }\n\n  #toggleSelection() {\n    if (this.selectable === 'single') {\n      this.#toggleSingleSelection();\n    }\n\n    if (this.selectable === 'multi') {\n      this.#toggleMultiSelection();\n    }\n  }\n\n  #toggleSingleSelection() {\n    this.#typeSelectableController.toggle();\n    if (this.behaviorSelect) {\n      this.#tree!.nodes.filter(n => n !== this).forEach(n => (n.selected = false));\n    }\n  }\n\n  #toggleMultiSelection() {\n    this.#typeSelectableController.toggle();\n\n    if (this.behaviorSelect) {\n      this.nodes.forEach(n => {\n        n.selected = this.selected;\n        n.indeterminate = false;\n      });\n      this.#tree!.nodes.forEach(node => updateNodeSelection(node));\n    }\n  }\n}\n"],"mappings":"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"}

package/dist/tree/tree2.js

@@ -22,7 +22,7 @@ var m = class extends d {
 	static {
 		this.metadata = {
 			tag: "nve-tree",
-			version: "0.0.6",
+			version: "0.0.7",
 			children: ["nve-tree-node"]
 		};
 	}

package/dist/week/week2.js

@@ -19,7 +19,7 @@ var l = class extends r {
 	static {
 		this.metadata = {
 			tag: "nve-week",
-			version: "0.0.6"
+			version: "0.0.7"
 		};
 	}
 	static {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nvidia-elements/core",
-  "version": "0.0.6",
+  "version": "0.0.7",
   "release": {
     "extends": "../../release.config.js"
   },
@@ -904,10 +904,10 @@
   "dependencies": {
     "lit": "^3.3.2",
     "lit-html": "^3.3.2",
-    "@nvidia-elements/forms": "^0.0.6"
+    "@nvidia-elements/forms": "^0.0.7"
   },
   "peerDependencies": {
-    "@nvidia-elements/themes": "^0.0.7"
+    "@nvidia-elements/themes": "^0.0.8"
   },
   "optionalDependencies": {
     "@lit-labs/scoped-registry-mixin": "^1.0.4",
@@ -935,11 +935,11 @@
     "typescript": "6.0.2",
     "vite": "8.0.6",
     "vitest": "4.1.4",
-    "@internals/vite": "0.0.0",
     "@internals/eslint": "0.0.0",
     "@internals/testing": "0.0.0",
-    "@nvidia-elements/lint": "0.0.5",
-    "@nvidia-elements/styles": "^0.0.6"
+    "@internals/vite": "0.0.0",
+    "@nvidia-elements/lint": "0.0.6",
+    "@nvidia-elements/styles": "^0.0.7"
   },
   "wireit": {
     "ci": {