@nvidia-elements/core 0.2.2 → 0.2.4

package/dist/select/select2.js

@@ -1,10 +1,10 @@
-import { focusElementTimeout as e, onListboxActivate as t } from "../internal/utils/focus.js";
-import { getElementUpdate as n } from "../internal/utils/dom.js";
-import { onChildListMutation as r } from "../internal/utils/events.js";
-import { __decorate as i } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
-import { I18nController as a, i18n as o } from "../internal/controllers/i18n.controller.js";
-import { scopedRegistry as s } from "../internal/decorators/scoped-registry.js";
-import { useStyles as c } from "../internal/styles/index.js";
+import { I18nController as e, i18n as t } from "../internal/controllers/i18n.controller.js";
+import { onChildListMutation as n } from "../internal/utils/events.js";
+import { focusElementTimeout as r, onListboxActivate as i } from "../internal/utils/focus.js";
+import { getElementUpdate as a } from "../internal/utils/dom.js";
+import { scopedRegistry as o } from "../internal/decorators/scoped-registry.js";
+import { useStyles as s } from "../internal/styles/index.js";
+import { __decorate as c } from "../_virtual/_@oxc-project_runtime@0.132.0/helpers/decorate.js";
 import { Icon as l } from "../icon/icon2.js";
 import { Control as u } from "../forms/control/control2.js";
 import { Tag as d } from "../tag/tag2.js";
@@ -17,16 +17,16 @@ import { property as v } from "lit/decorators/property.js";
 import { ifDefined as y } from "lit/directives/if-defined.js";
 //#region src/select/select.ts
 var b = class extends u {
-	constructor(...e) {
-		super(...e), this.#e = new a(this), this.i18n = this.#e.i18n, this.#l = [], this.#p = /* @__PURE__ */ new Set();
+	constructor(...t) {
+		super(...t), this.#e = new e(this), this.i18n = this.#e.i18n, this.#l = [], this.#p = /* @__PURE__ */ new Set();
 	}
 	static {
-		this.styles = c([...u.styles, h]);
+		this.styles = s([...u.styles, h]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-select",
-			version: "0.2.2"
+			version: "0.2.4"
 		};
 	}
 	static {
@@ -81,15 +81,15 @@ var b = class extends u {
 		super.firstUpdated(e), await this.updateComplete, this.#h(), this.#v(), this.#f(), this.#m();
 	}
 	#f() {
-		this.#l.push(n(this.#t, "value", () => this.requestUpdate()), r(this.#t, () => this.requestUpdate(), {
+		this.#l.push(a(this.#t, "value", () => this.requestUpdate()), n(this.#t, () => this.requestUpdate(), {
 			attributes: !0,
 			subtree: !0
-		}), r(this.#t, () => this.#m(), { subtree: !0 }));
+		}), n(this.#t, () => this.#m(), { subtree: !0 }));
 	}
 	#p;
 	#m() {
 		this.#n.forEach((e) => {
-			this.#p.has(e) || (this.#p.add(e), this.#l.push(n(e, "selected", () => this.requestUpdate())));
+			this.#p.has(e) || (this.#p.add(e), this.#l.push(a(e, "selected", () => this.requestUpdate())));
 		});
 	}
 	disconnectedCallback() {
@@ -99,8 +99,8 @@ var b = class extends u {
 		super.updated(e), this.#t?.size && this.#t?.size !== 0 && (this._internals.states.add("size"), this.style.setProperty("--size", `${this.#t?.size + .75}`)), this.#t?.multiple && this.#t?.size === 0 && this._internals.states.add("multiple");
 	}
 	#h() {
-		this.#t?.size === 0 && t(this.#t, () => {
-			this.requestUpdate(), this.#r.style.setProperty("--min-width", `${this.#a.getBoundingClientRect().width}px`), this.#r.showPopover(), e(this.#i[0]);
+		this.#t?.size === 0 && i(this.#t, () => {
+			this.requestUpdate(), this.#r.style.setProperty("--min-width", `${this.#a.getBoundingClientRect().width}px`), this.#r.showPopover(), r(this.#i[0]);
 		});
 	}
 	#g() {
@@ -121,10 +121,10 @@ var b = class extends u {
 		this.#t?.multiple && t && t.getBoundingClientRect().width > e - 48 ? this._internals.states.add("multiple-overflow") : this._internals.states.delete("multiple-overflow");
 	}
 };
-i([v({
+c([v({
 	type: String,
 	reflect: !0
-})], b.prototype, "container", void 0), i([v({ type: Object })], b.prototype, "i18n", void 0), b = i([o(), s()], b);
+})], b.prototype, "container", void 0), c([v({ type: Object })], b.prototype, "i18n", void 0), b = c([t(), o()], b);
 //#endregion
 export { b as Select };
 

package/dist/skeleton/skeleton.d.ts

@@ -25,7 +25,7 @@ export declare class Skeleton extends LitElement {
     hidden: boolean;
     /** @private */
     _internals: ElementInternals;
-    render(): import('lit-html').TemplateResult<1>;
+    render(): import('lit').TemplateResult<1>;
     connectedCallback(): void;
     updated(props: PropertyValues<this>): void;
 }

package/dist/skeleton/skeleton2.js

@@ -1,6 +1,6 @@
 import { attachInternals as e } from "../internal/utils/a11y.js";
-import { __decorate as t } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
-import { useStyles as n } from "../internal/styles/index.js";
+import { useStyles as t } from "../internal/styles/index.js";
+import { __decorate as n } from "../_virtual/_@oxc-project_runtime@0.132.0/helpers/decorate.js";
 import r from "./skeleton.js";
 import { LitElement as i, html as a } from "lit";
 import { property as o } from "lit/decorators/property.js";
@@ -10,12 +10,12 @@ var s = class extends i {
 		super(...e), this.hidden = !1;
 	}
 	static {
-		this.styles = n([r]);
+		this.styles = t([r]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-skeleton",
-			version: "0.2.2"
+			version: "0.2.4"
 		};
 	}
 	render() {
@@ -31,13 +31,13 @@ var s = class extends i {
 		e.target.assignedNodes().some((e) => e.nodeType === Node.ELEMENT_NODE || e.nodeType === Node.TEXT_NODE && e.textContent?.trim() !== "") ? this._internals.states.add("slotted") : this._internals.states.delete("slotted");
 	}
 };
-t([o({
+n([o({
 	type: String,
 	reflect: !0
-})], s.prototype, "effect", void 0), t([o({
+})], s.prototype, "effect", void 0), n([o({
 	type: String,
 	reflect: !0
-})], s.prototype, "shape", void 0), t([o({
+})], s.prototype, "shape", void 0), n([o({
 	type: Boolean,
 	reflect: !0
 })], s.prototype, "hidden", void 0);

package/dist/sort-button/sort-button.d.ts

@@ -1,5 +1,6 @@
+import { LitElement } from 'lit';
 import { Icon } from '../icon';
-import { BaseButton } from '../internal';
+declare const SortButton_base: import('@nvidia-elements/forms/mixins').ButtonFormControlMixinReturn<typeof LitElement>;
 /**
  * @element nve-sort-button
  * @description A sort button is a control that enables users to sort a list of items in ascending or descending order.
@@ -13,7 +14,7 @@ import { BaseButton } from '../internal';
  * @csspart icon - The icon element
  * @aria https://www.w3.org/WAI/ARIA/apg/patterns/spinbutton/
  */
-export declare class SortButton extends BaseButton {
+export declare class SortButton extends SortButton_base {
     #private;
     static styles: import('lit').CSSResult[];
     static readonly metadata: {
@@ -33,8 +34,9 @@ export declare class SortButton extends BaseButton {
     i18n: Partial<import('../internal').I18nStrings & {
         __set: boolean;
     }>;
-    render(): import('lit-html').TemplateResult<1>;
+    render(): import('lit').TemplateResult<1>;
     constructor();
     connectedCallback(): void;
     disconnectedCallback(): void;
 }
+export {};

package/dist/sort-button/sort-button2.js

@@ -1,40 +1,40 @@
-import { __decorate as e } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
-import { BaseButton as t } from "../internal/base/button.js";
-import { I18nController as n } from "../internal/controllers/i18n.controller.js";
-import { scopedRegistry as r } from "../internal/decorators/scoped-registry.js";
-import { useStyles as i } from "../internal/styles/index.js";
-import { Icon as a } from "../icon/icon2.js";
-import o from "./sort-button.js";
-import { html as s } from "lit";
+import { I18nController as e } from "../internal/controllers/i18n.controller.js";
+import { scopedRegistry as t } from "../internal/decorators/scoped-registry.js";
+import { useStyles as n } from "../internal/styles/index.js";
+import { __decorate as r } from "../_virtual/_@oxc-project_runtime@0.132.0/helpers/decorate.js";
+import { Icon as i } from "../icon/icon2.js";
+import a from "./sort-button.js";
+import { LitElement as o, html as s } from "lit";
 import { property as c } from "lit/decorators/property.js";
+import { ButtonFormControlMixin as l } from "@nvidia-elements/forms/mixins";
 //#region src/sort-button/sort-button.ts
-var l = {
+var u = {
 	none: "ascending",
 	ascending: "descending",
 	descending: "none"
-}, u = class extends t {
+}, d = class extends l(o) {
 	static {
-		this.styles = i([o]);
+		this.styles = n([a]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-sort-button",
-			version: "0.2.2"
+			version: "0.2.4"
 		};
 	}
 	static {
-		this.elementDefinitions = { [a.metadata.tag]: a };
+		this.elementDefinitions = { [i.metadata.tag]: i };
 	}
 	#e;
 	render() {
 		return s`<div internal-host focus-within><nve-icon part="icon" .name="${this.sort === "descending" ? "sort-descending" : "sort-ascending"}" aria-hidden="true"></nve-icon></div>`;
 	}
 	constructor() {
-		super(), this.sort = "none", this.#e = new n(this), this.i18n = this.#e.i18n, this.#t = () => {
-			this._internals.ariaLabel = `${this.#e.i18n.sort} ${l[this.sort]}`, this.dispatchEvent(new CustomEvent("sort", {
+		super(), this.sort = "none", this.#e = new e(this), this.i18n = this.#e.i18n, this.#t = () => {
+			this._internals.ariaLabel = `${this.#e.i18n.sort} ${u[this.sort]}`, this.dispatchEvent(new CustomEvent("sort", {
 				detail: {
 					value: this.sort,
-					next: l[this.sort]
+					next: u[this.sort]
 				},
 				bubbles: !0,
 				composed: !0
@@ -49,11 +49,11 @@ var l = {
 	}
 	#t;
 };
-e([c({
+r([c({
 	type: String,
 	reflect: !0
-})], u.prototype, "sort", void 0), e([c({ type: Object })], u.prototype, "i18n", void 0), u = e([r()], u);
+})], d.prototype, "sort", void 0), r([c({ type: Object })], d.prototype, "i18n", void 0), d = r([t()], d);
 //#endregion
-export { u as SortButton };
+export { d as SortButton };
 
 //# sourceMappingURL=sort-button2.js.map

package/dist/sort-button/sort-button2.js.map

@@ -1 +1 @@
-{"version":3,"file":"sort-button2.js","names":["#i18nController","#onClick"],"sources":["../../src/sort-button/sort-button.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport { useStyles, BaseButton, I18nController, scopedRegistry } from '@nvidia-elements/core/internal';\nimport styles from './sort-button.css?inline';\n\nconst nextSort = {\n  none: 'ascending',\n  ascending: 'descending',\n  descending: 'none'\n};\n\n/**\n * @element nve-sort-button\n * @description A sort button is a control that enables users to sort a list of items in ascending or descending order.\n * @since 0.11.0\n * @entrypoint \\@nvidia-elements/core/sort-button\n * @event sort - Dispatched on sort button click, returns the current sort value and the next sort value.\n * @cssprop --width\n * @cssprop --height\n * @cssprop --border-radius\n * @cssprop --color\n * @csspart icon - The icon element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/spinbutton/\n */\n@scopedRegistry()\nexport class SortButton extends BaseButton {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-sort-button',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Icon.metadata.tag]: Icon\n  };\n\n  /**\n   * The current sort value, can be ascending, descending, or none.\n   */\n  @property({ type: String, reflect: true }) sort: 'ascending' | 'descending' | 'none' = 'none';\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  render() {\n    return html`\n      <div internal-host focus-within>\n        <nve-icon part=\"icon\" .name=${this.sort === 'descending' ? 'sort-descending' : 'sort-ascending'} aria-hidden=\"true\"></nve-icon>\n      </div>\n    `;\n  }\n\n  constructor() {\n    super();\n    this.type = 'button';\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._internals.role = 'spinbutton';\n    this.addEventListener('click', this.#onClick);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('click', this.#onClick);\n  }\n\n  #onClick = () => {\n    this._internals.ariaLabel = `${this.#i18nController.i18n.sort} ${nextSort[this.sort]}`;\n    this.dispatchEvent(\n      new CustomEvent('sort', {\n        detail: { value: this.sort, next: nextSort[this.sort] },\n        bubbles: true,\n        composed: true\n      })\n    );\n  };\n}\n"],"mappings":";;;;;;;;;;AASA,IAAM,IAAW;CACf,MAAM;CACN,WAAW;CACX,YAAY;AACd,GAgBO,IAAA,cAAyB,EAAW;;gBACzB,EAAU,CAAC,CAAM,CAAC;;;kBAEP;GACzB,KAAK;GACL,SAAS;EACX;;;4BAE4B,GACzB,EAAK,SAAS,MAAM,EACvB;;CAOA;CAOA,SAAS;EACP,OAAO,CAAI,gEAEuB,KAAK,SAAS,eAAe,oBAAoB,iBAAiB;CAGtG;CAEA,cAAc;EAEZ,AADA,MAAM,eAlB+E,kBAE/C,IAAI,EAAqB,IAAI,eAKlC,KAAKA,GAAgB,sBA0BvC;GAEf,AADA,KAAK,WAAW,YAAY,GAAG,KAAKA,GAAgB,KAAK,KAAK,GAAG,EAAS,KAAK,SAC/E,KAAK,cACH,IAAI,YAAY,QAAQ;IACtB,QAAQ;KAAE,OAAO,KAAK;KAAM,MAAM,EAAS,KAAK;IAAM;IACtD,SAAS;IACT,UAAU;GACZ,CAAC,CACH;EACF,GAvBE,KAAK,OAAO;CACd;CAEA,oBAAoB;EAGlB,AAFA,MAAM,kBAAkB,GACxB,KAAK,WAAW,OAAO,cACvB,KAAK,iBAAiB,SAAS,KAAKC,EAAQ;CAC9C;CAEA,uBAAuB;EAErB,AADA,MAAM,qBAAqB,GAC3B,KAAK,oBAAoB,SAAS,KAAKA,EAAQ;CACjD;CAEA;AAUF;GA3CG,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,MAOxC,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,UAvB3B,EAAe,CAAA,GAAA,CAAA"}
+{"version":3,"file":"sort-button2.js","names":["#i18nController","#onClick"],"sources":["../../src/sort-button/sort-button.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { ButtonFormControlMixin } from '@nvidia-elements/forms/mixins';\nimport { Icon } from '@nvidia-elements/core/icon';\nimport { useStyles, I18nController, scopedRegistry } from '@nvidia-elements/core/internal';\nimport styles from './sort-button.css?inline';\n\nconst nextSort = {\n  none: 'ascending',\n  ascending: 'descending',\n  descending: 'none'\n};\n\n/**\n * @element nve-sort-button\n * @description A sort button is a control that enables users to sort a list of items in ascending or descending order.\n * @since 0.11.0\n * @entrypoint \\@nvidia-elements/core/sort-button\n * @event sort - Dispatched on sort button click, returns the current sort value and the next sort value.\n * @cssprop --width\n * @cssprop --height\n * @cssprop --border-radius\n * @cssprop --color\n * @csspart icon - The icon element\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/spinbutton/\n */\n@scopedRegistry()\nexport class SortButton extends ButtonFormControlMixin(LitElement) {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-sort-button',\n    version: '0.0.0'\n  };\n\n  static elementDefinitions = {\n    [Icon.metadata.tag]: Icon\n  };\n\n  /**\n   * The current sort value, can be ascending, descending, or none.\n   */\n  @property({ type: String, reflect: true }) sort: 'ascending' | 'descending' | 'none' = 'none';\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  render() {\n    return html`\n      <div internal-host focus-within>\n        <nve-icon part=\"icon\" .name=${this.sort === 'descending' ? 'sort-descending' : 'sort-ascending'} aria-hidden=\"true\"></nve-icon>\n      </div>\n    `;\n  }\n\n  constructor() {\n    super();\n    this.type = 'button';\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._internals.role = 'spinbutton';\n    this.addEventListener('click', this.#onClick);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('click', this.#onClick);\n  }\n\n  #onClick = () => {\n    this._internals.ariaLabel = `${this.#i18nController.i18n.sort} ${nextSort[this.sort]}`;\n    this.dispatchEvent(\n      new CustomEvent('sort', {\n        detail: { value: this.sort, next: nextSort[this.sort] },\n        bubbles: true,\n        composed: true\n      })\n    );\n  };\n}\n"],"mappings":";;;;;;;;;;AAUA,IAAM,IAAW;CACf,MAAM;CACN,WAAW;CACX,YAAY;AACd,GAgBO,IAAA,cAAyB,EAAuB,CAAU,EAAE;;gBACjD,EAAU,CAAC,CAAM,CAAC;;;kBAEP;GACzB,KAAK;GACL,SAAS;EACX;;;4BAE4B,GACzB,EAAK,SAAS,MAAM,EACvB;;CAOA;CAOA,SAAS;EACP,OAAO,CAAI,gEAEuB,KAAK,SAAS,eAAe,oBAAoB,iBAAiB;CAGtG;CAEA,cAAc;EAEZ,AADA,MAAM,eAlB+E,kBAE/C,IAAI,EAAqB,IAAI,eAKlC,KAAKA,GAAgB,sBA0BvC;GAEf,AADA,KAAK,WAAW,YAAY,GAAG,KAAKA,GAAgB,KAAK,KAAK,GAAG,EAAS,KAAK,SAC/E,KAAK,cACH,IAAI,YAAY,QAAQ;IACtB,QAAQ;KAAE,OAAO,KAAK;KAAM,MAAM,EAAS,KAAK;IAAM;IACtD,SAAS;IACT,UAAU;GACZ,CAAC,CACH;EACF,GAvBE,KAAK,OAAO;CACd;CAEA,oBAAoB;EAGlB,AAFA,MAAM,kBAAkB,GACxB,KAAK,WAAW,OAAO,cACvB,KAAK,iBAAiB,SAAS,KAAKC,EAAQ;CAC9C;CAEA,uBAAuB;EAErB,AADA,MAAM,qBAAqB,GAC3B,KAAK,oBAAoB,SAAS,KAAKA,EAAQ;CACjD;CAEA;AAUF;GA3CG,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,MAOxC,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,UAvB3B,EAAe,CAAA,GAAA,CAAA"}

package/dist/sparkline/sparkline.d.ts

@@ -57,7 +57,7 @@ export declare class Sparkline extends LitElement implements DataElement<number[
     private validData;
     /** @private */
     _internals: ElementInternals;
-    render(): import('lit-html').TemplateResult<1>;
+    render(): import('lit').TemplateResult<1>;
     connectedCallback(): void;
     willUpdate(changedProperties: PropertyValues<this>): void;
     updated(props: PropertyValues<this>): void;

package/dist/sparkline/sparkline2.js

@@ -1,6 +1,6 @@
 import { attachInternals as e } from "../internal/utils/a11y.js";
-import { __decorate as t } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
-import { statusStateStyles as n, supportStateStyles as r, useStyles as i } from "../internal/styles/index.js";
+import { statusStateStyles as t, supportStateStyles as n, useStyles as r } from "../internal/styles/index.js";
+import { __decorate as i } from "../_virtual/_@oxc-project_runtime@0.132.0/helpers/decorate.js";
 import { calculateDomain as a, calculateSymbolIndices as o, calculateViewBox as s, toAreaPath as c, toColumnRects as l, toInterpolation as u, toLinePath as d, toPlotPoints as f, toValidData as p, toWinLossRects as m, valueToY as h } from "./sparkline.utils.js";
 import g from "./sparkline.js";
 import { LitElement as _, html as v, nothing as y, svg as b } from "lit";
@@ -12,16 +12,16 @@ var C = class extends _ {
 		super(...e), this.data = [], this.mark = "line", this.interpolation = "linear", this.denoteFirst = !1, this.denoteLast = !1, this.denoteMin = !1, this.denoteMax = !1, this.intervalLength = .6, this.validData = [];
 	}
 	static {
-		this.styles = i([
+		this.styles = r([
 			g,
-			n,
-			r
+			t,
+			n
 		]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-sparkline",
-			version: "0.2.2"
+			version: "0.2.4"
 		};
 	}
 	render() {
@@ -94,32 +94,32 @@ var C = class extends _ {
 		return b`<svg viewBox="0 0 ${t} ${n}" preserveAspectRatio="xMidYMid meet" aria-hidden="true">${this.#r(e, t)} ${r.map((e) => b`<rect class="${e.className}" x="${e.x.toFixed(2)}" y="${e.y.toFixed(2)}" width="${e.width.toFixed(2)}" height="${e.height.toFixed(2)}"></rect>`)}</svg>`;
 	}
 };
-t([x({ type: Array })], C.prototype, "data", void 0), t([x({ type: String })], C.prototype, "mark", void 0), t([x({ type: String })], C.prototype, "interpolation", void 0), t([x({
+i([x({ type: Array })], C.prototype, "data", void 0), i([x({ type: String })], C.prototype, "mark", void 0), i([x({ type: String })], C.prototype, "interpolation", void 0), i([x({
 	type: String,
 	reflect: !0
-})], C.prototype, "status", void 0), t([x({
+})], C.prototype, "status", void 0), i([x({
 	type: String,
 	reflect: !0
-})], C.prototype, "size", void 0), t([x({
+})], C.prototype, "size", void 0), i([x({
 	type: Boolean,
 	attribute: "denote-first",
 	reflect: !0
-})], C.prototype, "denoteFirst", void 0), t([x({
+})], C.prototype, "denoteFirst", void 0), i([x({
 	type: Boolean,
 	attribute: "denote-last",
 	reflect: !0
-})], C.prototype, "denoteLast", void 0), t([x({
+})], C.prototype, "denoteLast", void 0), i([x({
 	type: Boolean,
 	attribute: "denote-min",
 	reflect: !0
-})], C.prototype, "denoteMin", void 0), t([x({
+})], C.prototype, "denoteMin", void 0), i([x({
 	type: Boolean,
 	attribute: "denote-max",
 	reflect: !0
-})], C.prototype, "denoteMax", void 0), t([x({
+})], C.prototype, "denoteMax", void 0), i([x({
 	type: Number,
 	attribute: "interval-length"
-})], C.prototype, "intervalLength", void 0), t([x({ type: Number })], C.prototype, "min", void 0), t([x({ type: Number })], C.prototype, "max", void 0), t([S()], C.prototype, "validData", void 0);
+})], C.prototype, "intervalLength", void 0), i([x({ type: Number })], C.prototype, "min", void 0), i([x({ type: Number })], C.prototype, "max", void 0), i([S()], C.prototype, "validData", void 0);
 //#endregion
 export { C as Sparkline };
 

package/dist/star-rating/star-rating.d.ts

@@ -31,5 +31,5 @@ export declare class StarRating extends Control {
     private active;
     private precision;
     firstUpdated(props: PropertyValues<this>): void;
-    protected get prefixContent(): import('lit-html').TemplateResult<1>;
+    protected get prefixContent(): import('lit').TemplateResult<1>;
 }

package/dist/star-rating/star-rating2.js

@@ -1,7 +1,7 @@
 import { getElementUpdate as e } from "../internal/utils/dom.js";
-import { __decorate as t } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
-import { scopedRegistry as n } from "../internal/decorators/scoped-registry.js";
-import { useStyles as r } from "../internal/styles/index.js";
+import { scopedRegistry as t } from "../internal/decorators/scoped-registry.js";
+import { useStyles as n } from "../internal/styles/index.js";
+import { __decorate as r } from "../_virtual/_@oxc-project_runtime@0.132.0/helpers/decorate.js";
 import { Icon as i } from "../icon/icon2.js";
 import { Control as a } from "../forms/control/control2.js";
 import o from "./star-rating.js";
@@ -13,12 +13,12 @@ var l = class extends a {
 		super(...e), this.min = 0, this.max = 5, this.value = 0, this.active = 0, this.precision = .5;
 	}
 	static {
-		this.styles = r([...a.styles, o]);
+		this.styles = n([...a.styles, o]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-star-rating",
-			version: "0.2.2"
+			version: "0.2.4"
 		};
 	}
 	static {
@@ -50,7 +50,7 @@ var l = class extends a {
 		this.input.valueAsNumber = e === this.value ? 0 : e, this.input.dispatchEvent(new Event("input", { bubbles: !0 })), this.input.dispatchEvent(new Event("change", { bubbles: !0 }));
 	}
 };
-t([c()], l.prototype, "min", void 0), t([c()], l.prototype, "max", void 0), t([c()], l.prototype, "value", void 0), t([c()], l.prototype, "active", void 0), t([c()], l.prototype, "precision", void 0), l = t([n()], l);
+r([c()], l.prototype, "min", void 0), r([c()], l.prototype, "max", void 0), r([c()], l.prototype, "value", void 0), r([c()], l.prototype, "active", void 0), r([c()], l.prototype, "precision", void 0), l = r([t()], l);
 //#endregion
 export { l as StarRating };
 

package/dist/steps/steps.d.ts

@@ -1,7 +1,8 @@
 import { PropertyValues, LitElement } from 'lit';
-import { KeynavListConfig, Container, BaseButton } from '../internal';
+import { KeynavListConfig, Container } from '../internal';
 import { IconButton } from '../icon-button';
 import { ProgressRing } from '../progress-ring';
+declare const StepsItem_base: import('@nvidia-elements/forms/mixins').ButtonFormControlMixinReturn<typeof LitElement>;
 /**
  * @element nve-steps-item
  * @description Represents an individual step within a multi-step workflow, displaying its status and enabling navigation within the parent steps component.
@@ -20,7 +21,7 @@ import { ProgressRing } from '../progress-ring';
  * @csspart progress-ring - The progress ring element
  * @aria https://www.w3.org/WAI/ARIA/apg/patterns/tabs/
  */
-export declare class StepsItem extends BaseButton {
+export declare class StepsItem extends StepsItem_base {
     /**
      * Determines which item the user selects, defaults to false.
      */
@@ -45,7 +46,7 @@ export declare class StepsItem extends BaseButton {
         [IconButton.metadata.tag]: typeof IconButton;
         [ProgressRing.metadata.tag]: typeof ProgressRing;
     };
-    render(): import('lit-html').TemplateResult<1>;
+    render(): import('lit').TemplateResult<1>;
     constructor();
     connectedCallback(): void;
 }
@@ -83,8 +84,9 @@ export declare class Steps extends LitElement {
     private steps;
     /** @private */
     _internals: ElementInternals;
-    render(): import('lit-html').TemplateResult<1>;
+    render(): import('lit').TemplateResult<1>;
     connectedCallback(): void;
     disconnectedCallback(): void;
     updated(props: PropertyValues<this>): void;
 }
+export {};

package/dist/steps/steps2.js

@@ -1,40 +1,40 @@
-import { attachInternals as e } from "../internal/utils/a11y.js";
-import { stateSelected as t } from "../internal/controllers/state-selected.controller.js";
-import { __decorate as n } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
-import { BaseButton as r } from "../internal/base/button.js";
-import { audit as i } from "../internal/controllers/audit.controller.js";
-import { keyNavigationList as a } from "../internal/controllers/keynav-list.controller.js";
-import { scopedRegistry as o } from "../internal/decorators/scoped-registry.js";
-import { useStyles as s } from "../internal/styles/index.js";
-import { IconButton as c } from "../icon-button/icon-button2.js";
-import l from "./steps-item.js";
-import u from "./steps.js";
-import { ProgressRing as d } from "../progress-ring/progress-ring2.js";
-import { LitElement as f, html as p } from "lit";
-import { property as m } from "lit/decorators/property.js";
-import { state as h } from "lit/decorators/state.js";
+import { audit as e } from "../internal/controllers/audit.controller.js";
+import { keyNavigationList as t } from "../internal/controllers/keynav-list.controller.js";
+import { attachInternals as n } from "../internal/utils/a11y.js";
+import { stateSelected as r } from "../internal/controllers/state-selected.controller.js";
+import { scopedRegistry as i } from "../internal/decorators/scoped-registry.js";
+import { useStyles as a } from "../internal/styles/index.js";
+import { __decorate as o } from "../_virtual/_@oxc-project_runtime@0.132.0/helpers/decorate.js";
+import { IconButton as s } from "../icon-button/icon-button2.js";
+import c from "./steps-item.js";
+import l from "./steps.js";
+import { ProgressRing as u } from "../progress-ring/progress-ring2.js";
+import { LitElement as d, html as f } from "lit";
+import { property as p } from "lit/decorators/property.js";
+import { state as m } from "lit/decorators/state.js";
+import { ButtonFormControlMixin as h } from "@nvidia-elements/forms/mixins";
 import { queryAssignedElements as g } from "lit/decorators/query-assigned-elements.js";
 import { when as _ } from "lit/directives/when.js";
 //#region src/steps/steps.ts
-var v = class extends r {
+var v = class extends h(d) {
 	static {
-		this.styles = s([l]);
+		this.styles = a([c]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-steps-item",
-			version: "0.2.2",
+			version: "0.2.4",
 			parents: ["nve-steps"]
 		};
 	}
 	static {
 		this.elementDefinitions = {
-			[c.metadata.tag]: c,
-			[d.metadata.tag]: d
+			[s.metadata.tag]: s,
+			[u.metadata.tag]: u
 		};
 	}
 	render() {
-		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>`;
+		return f`<div internal-host focus-within><slot name="status-icon">${this.status ? "" : f`<nve-icon-button part="icon-button" readonly="readonly" id="number-icon" .disabled="${this.disabled}">${this.index}</nve-icon-button>`} ${this.status === "success" ? f`<nve-icon-button part="icon-button" readonly="readonly" size="sm" interaction="emphasis" icon-name="check"></nve-icon-button>` : ""} ${this.status === "danger" ? f`<nve-icon-button part="icon-button" readonly="readonly" size="sm" interaction="destructive" icon-name="exclamation-circle"></nve-icon-button>` : ""} ${this.status === "pending" ? f`<nve-progress-ring part="progress-ring" status="accent" size="sm"></nve-progress-ring>` : ""}</slot>${_(this.container !== "condensed", () => f`<slot></slot>`)}</div>`;
 	}
 	constructor() {
 		super(), this.selected = !1, this.index = 0, this.type = "button";
@@ -43,33 +43,33 @@ var v = class extends r {
 		super.connectedCallback(), this._internals.role = "tab";
 	}
 };
-n([m({
+o([p({
 	type: Boolean,
 	reflect: !0
-})], v.prototype, "selected", void 0), n([m({
+})], v.prototype, "selected", void 0), o([p({
 	type: String,
 	reflect: !0
-})], v.prototype, "status", void 0), n([m({
+})], v.prototype, "status", void 0), o([p({
 	type: String,
 	reflect: !0
-})], v.prototype, "container", void 0), n([h()], v.prototype, "index", void 0), v = n([
+})], v.prototype, "container", void 0), o([m()], v.prototype, "index", void 0), v = o([
+	e(),
 	i(),
-	o(),
-	t()
+	r()
 ], v);
-var y = class extends f {
+var y = class extends d {
 	constructor(...e) {
 		super(...e), this.vertical = !1, this.behaviorSelect = !1, this.#t = (e) => {
 			this.#e(e.target);
 		};
 	}
 	static {
-		this.styles = s([u]);
+		this.styles = a([l]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-steps",
-			version: "0.2.2",
+			version: "0.2.4",
 			children: ["nve-steps-item"]
 		};
 	}
@@ -83,10 +83,10 @@ var y = class extends f {
 		!this.behaviorSelect || !e.matches("nve-steps-item") || e.disabled || (this.steps.forEach((e) => e.selected = !1), e.selected = !0);
 	}
 	render() {
-		return p`<div internal-host><slot @slotchange="${this.#n}"></slot></div>`;
+		return f`<div internal-host><slot @slotchange="${this.#n}"></slot></div>`;
 	}
 	connectedCallback() {
-		super.connectedCallback(), e(this), this._internals.role = "tablist", this.addEventListener("click", this.#t);
+		super.connectedCallback(), n(this), this._internals.role = "tablist", this.addEventListener("click", this.#t);
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback(), this.removeEventListener("click", this.#t);
@@ -101,16 +101,16 @@ var y = class extends f {
 		});
 	}
 };
-n([m({
+o([p({
 	type: Boolean,
 	reflect: !0
-})], y.prototype, "vertical", void 0), n([m({
+})], y.prototype, "vertical", void 0), o([p({
 	type: String,
 	reflect: !0
-})], y.prototype, "container", void 0), n([m({
+})], y.prototype, "container", void 0), o([p({
 	type: Boolean,
 	attribute: "behavior-select"
-})], y.prototype, "behaviorSelect", void 0), n([g({ selector: "nve-steps-item" })], y.prototype, "steps", void 0), y = n([i(), a()], y);
+})], y.prototype, "behaviorSelect", void 0), o([g({ selector: "nve-steps-item" })], y.prototype, "steps", void 0), y = o([e(), t()], y);
 //#endregion
 export { y as Steps, v as StepsItem };
 

package/dist/steps/steps2.js.map

@@ -1 +1 @@
-{"version":3,"file":"steps2.js","names":["#selectTab","#syncChildSteps","#onClick"],"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' }) 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') || 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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"}
+{"version":3,"file":"steps2.js","names":["#selectTab","#syncChildSteps","#onClick"],"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 { ButtonFormControlMixin } from '@nvidia-elements/forms/mixins';\nimport type { KeynavListConfig, Container } from '@nvidia-elements/core/internal';\nimport {\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 ButtonFormControlMixin(LitElement) {\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' }) 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') || 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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"}