@nvidia-elements/core 2.23.4 → 2.23.5

package/dist/format-relative-time/format-relative-time2.js

@@ -1,9 +1,9 @@
 import { typeSSR as e } from "../internal/controllers/type-ssr.controller.js";
-import { useStyles as t } from "../internal/styles/index.js";
-import n from "../_virtual/_@oxc-project_runtime@0.155.0/helpers/esm/decorate.js";
-import r from "./format-relative-time.js";
-import { LitElement as i, html as a } from "lit";
-import { property as o } from "lit/decorators/property.js";
+import t from "../_virtual/_@oxc-project_runtime@0.155.0/helpers/esm/decorate.js";
+import n from "./format-relative-time.js";
+import { LitElement as r, html as i } from "lit";
+import { property as a } from "lit/decorators/property.js";
+import { useStyles as o } from "@nvidia-elements/foundations/internal/styles";
 // src/format-relative-time/format-relative-time.ts
 var s = {
 	second: 1e3,
@@ -42,17 +42,17 @@ var s = {
 		unit: "year",
 		max: Infinity
 	}
-], l = class extends i {
+], l = class extends r {
 	constructor(...e) {
 		super(...e), this.numeric = "always", this.formatStyle = "long", this.unit = "auto", this.sync = !1;
 	}
 	static {
-		this.styles = t([r]);
+		this.styles = o([n]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-format-relative-time",
-			version: "2.23.4"
+			version: "2.23.5"
 		};
 	}
 	#e;
@@ -124,16 +124,16 @@ var s = {
 		e.has("sync") && (this.sync ? this.#c() : this.#l());
 	}
 	render() {
-		return a`<time internal-host datetime="${this.#t}">${this.#o}<slot @slotchange="${this.#u}" hidden></slot></time>`;
+		return i`<time internal-host datetime="${this.#t}">${this.#o}<slot @slotchange="${this.#u}" hidden></slot></time>`;
 	}
 	#u() {
 		this.requestUpdate();
 	}
 };
-n([o({ type: String })], l.prototype, "date", void 0), n([o({ type: String })], l.prototype, "locale", void 0), n([o({ type: String })], l.prototype, "numeric", void 0), n([o({
+t([a({ type: String })], l.prototype, "date", void 0), t([a({ type: String })], l.prototype, "locale", void 0), t([a({ type: String })], l.prototype, "numeric", void 0), t([a({
 	type: String,
 	attribute: "format-style"
-})], l.prototype, "formatStyle", void 0), n([o({ type: String })], l.prototype, "unit", void 0), n([o({ type: Boolean })], l.prototype, "sync", void 0), l = n([e()], l);
+})], l.prototype, "formatStyle", void 0), t([a({ type: String })], l.prototype, "unit", void 0), t([a({ type: Boolean })], l.prototype, "sync", void 0), l = t([e()], l);
 export { l as FormatRelativeTime };
 
 //# sourceMappingURL=format-relative-time2.js.map

package/dist/format-relative-time/format-relative-time2.js.map

@@ -1 +1 @@
-{"version":3,"file":"format-relative-time2.js","names":["styles","_decorate","__decorate","format_relative_time_default","UNIT_DIVISORS","THRESHOLDS","FormatRelativeTime","LitElement","_args","useStyles","#dateValue","#resolvedLocale","absDiff","diffMs","sign","value","unit","max","#computeUnit","#computeExplicitUnit","#formattedRelativeTime","iso","target","resolvedUnit","#resolveValueAndUnit","#stopSync","#timer","#startSync","#getSyncInterval","changed","#onSlotChange","property","typeSSR"],"sources":["../../src/format-relative-time/format-relative-time.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 { useStyles, typeSSR } from '@nvidia-elements/core/internal';\nimport styles from './format-relative-time.css?inline';\n\ntype TimeUnitOption = 'second' | 'minute' | 'hour' | 'day' | 'week' | 'month' | 'year';\n\nconst UNIT_DIVISORS: Record<TimeUnitOption, number> = {\n  second: 1000,\n  minute: 60000,\n  hour: 3600000,\n  day: 86400000,\n  week: 604800000,\n  month: 2592000000,\n  year: 31536000000\n};\n\nconst THRESHOLDS: { unit: TimeUnitOption; max: number }[] = [\n  { unit: 'second', max: 60 },\n  { unit: 'minute', max: 60 },\n  { unit: 'hour', max: 24 },\n  { unit: 'day', max: 7 },\n  { unit: 'week', max: 4 },\n  { unit: 'month', max: 12 },\n  { unit: 'year', max: Number.POSITIVE_INFINITY }\n];\n\n/**\n * @element nve-format-relative-time\n * @description Formats a date/time value as localized relative text using the Intl.RelativeTimeFormat API. Renders inside a semantic time element.\n * Options mirror the Intl.RelativeTimeFormat API. When unit is 'auto', the component selects the best unit based on the time difference.\n * @documentation https://nvidia.github.io/elements/docs/elements/format-relative-time/\n * @since 0.0.0\n * @entrypoint \\@nvidia-elements/core/format-relative-time\n * @slot - Date string to format (such as 2023-07-28T04:20:17.434Z). Serves as fallback before hydration.\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/time\n */\n@typeSSR()\nexport class FormatRelativeTime extends LitElement {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-format-relative-time',\n    version: '0.0.0'\n  };\n\n  /**\n   * Optional date string for values supplied by JavaScript or bound data.\n   * By default, the component formats the element's text content, which also serves as the SSR fallback.\n   * When both are present, this property takes precedence.\n   */\n  @property({ type: String }) date?: string;\n\n  /**\n   * Language tag (such as en-US, de-DE). Defaults to document.documentElement.lang or browser default.\n   */\n  @property({ type: String }) locale?: string;\n\n  /**\n   * Numeric formatting: 'always' | 'auto'. When 'auto', enables natural language forms such as 'yesterday' instead of '1 day ago'.\n   */\n  @property({ type: String }) numeric: 'always' | 'auto' = 'always';\n\n  /**\n   * Formatting length: 'long' | 'short' | 'narrow'. Controls verbosity (such as '3 days ago' vs '3d ago'). Maps to Intl.RelativeTimeFormat style option.\n   */\n  @property({ type: String, attribute: 'format-style' }) formatStyle: 'long' | 'short' | 'narrow' = 'long';\n\n  /**\n   * Time unit: 'second' | 'minute' | 'hour' | 'day' | 'week' | 'month' | 'year' | 'auto'. Use 'auto' to let the component select the most appropriate unit based on the time difference.\n   */\n  @property({ type: String }) unit: 'second' | 'minute' | 'hour' | 'day' | 'week' | 'month' | 'year' | 'auto' = 'auto';\n\n  /**\n   * When present, auto-updates the displayed relative time at appropriate intervals.\n   */\n  @property({ type: Boolean }) sync = false;\n\n  #timer?: ReturnType<typeof setTimeout>;\n\n  get #dateValue(): string {\n    return this.date ?? this.textContent?.trim() ?? '';\n  }\n\n  get #resolvedLocale(): string | undefined {\n    return this.locale ?? (globalThis.document?.documentElement?.lang || undefined);\n  }\n\n  #computeUnit(diffMs: number): { value: number; unit: Intl.RelativeTimeFormatUnit } {\n    const absDiff = Math.abs(diffMs);\n    const sign = diffMs < 0 ? -1 : 1;\n\n    for (const { unit, max } of THRESHOLDS) {\n      const value = Math.round(absDiff / UNIT_DIVISORS[unit]);\n      if (value < max) return { value: sign * value, unit };\n    }\n    return { value: sign * Math.round(absDiff / UNIT_DIVISORS.year), unit: 'year' };\n  }\n\n  #computeExplicitUnit(diffMs: number, unit: TimeUnitOption): number {\n    return Math.round(diffMs / UNIT_DIVISORS[unit]);\n  }\n\n  #resolveValueAndUnit(diffMs: number): { value: number; unit: Intl.RelativeTimeFormatUnit } {\n    if (this.unit === 'auto') {\n      return this.#computeUnit(diffMs);\n    }\n    return { unit: this.unit, value: this.#computeExplicitUnit(diffMs, this.unit) };\n  }\n\n  get #formattedRelativeTime(): string {\n    const iso = this.#dateValue;\n    if (!iso) return '';\n\n    const target = new Date(iso);\n    if (isNaN(target.getTime())) {\n      return iso;\n    }\n\n    const { value, unit: resolvedUnit } = this.#resolveValueAndUnit(target.getTime() - Date.now());\n\n    try {\n      return new Intl.RelativeTimeFormat(this.#resolvedLocale, {\n        numeric: this.numeric,\n        style: this.formatStyle\n      }).format(value, resolvedUnit);\n    } catch {\n      return iso;\n    }\n  }\n\n  #getSyncInterval(): number {\n    const iso = this.#dateValue;\n    if (!iso) return 60000;\n\n    const absDiff = Math.abs(new Date(iso).getTime() - Date.now());\n    if (absDiff < 60000) return 10000;\n    if (absDiff < 3600000) return 30000;\n    if (absDiff < 86400000) return 300000;\n    return 3600000;\n  }\n\n  #startSync() {\n    this.#stopSync();\n    if (!this.sync) return;\n\n    this.#timer = setTimeout(() => {\n      this.requestUpdate();\n      this.#startSync();\n    }, this.#getSyncInterval());\n  }\n\n  #stopSync() {\n    if (this.#timer !== undefined) {\n      clearTimeout(this.#timer);\n      this.#timer = undefined;\n    }\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    if (this.sync) this.#startSync();\n  }\n\n  disconnectedCallback() {\n    this.#stopSync();\n    super.disconnectedCallback();\n  }\n\n  updated(changed: Map<string, unknown>) {\n    if (changed.has('sync')) {\n      if (this.sync) {\n        this.#startSync();\n      } else {\n        this.#stopSync();\n      }\n    }\n  }\n\n  render() {\n    return html`<time internal-host datetime=${this.#dateValue}>${this.#formattedRelativeTime}<slot @slotchange=${this.#onSlotChange} hidden></slot></time>`;\n  }\n\n  #onSlotChange() {\n    this.requestUpdate();\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"format-relative-time2.js","names":["styles","_decorate","__decorate","format_relative_time_default","UNIT_DIVISORS","THRESHOLDS","FormatRelativeTime","LitElement","_args","useStyles","#dateValue","#resolvedLocale","absDiff","diffMs","sign","value","unit","max","#computeUnit","#computeExplicitUnit","#formattedRelativeTime","iso","target","resolvedUnit","#resolveValueAndUnit","#stopSync","#timer","#startSync","#getSyncInterval","changed","#onSlotChange","property","typeSSR"],"sources":["../../src/format-relative-time/format-relative-time.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 { typeSSR } from '@nvidia-elements/core/internal';\nimport { useStyles } from '@nvidia-elements/foundations/internal/styles';\nimport styles from './format-relative-time.css?inline';\n\ntype TimeUnitOption = 'second' | 'minute' | 'hour' | 'day' | 'week' | 'month' | 'year';\n\nconst UNIT_DIVISORS: Record<TimeUnitOption, number> = {\n  second: 1000,\n  minute: 60000,\n  hour: 3600000,\n  day: 86400000,\n  week: 604800000,\n  month: 2592000000,\n  year: 31536000000\n};\n\nconst THRESHOLDS: { unit: TimeUnitOption; max: number }[] = [\n  { unit: 'second', max: 60 },\n  { unit: 'minute', max: 60 },\n  { unit: 'hour', max: 24 },\n  { unit: 'day', max: 7 },\n  { unit: 'week', max: 4 },\n  { unit: 'month', max: 12 },\n  { unit: 'year', max: Number.POSITIVE_INFINITY }\n];\n\n/**\n * @element nve-format-relative-time\n * @description Formats a date/time value as localized relative text using the Intl.RelativeTimeFormat API. Renders inside a semantic time element.\n * Options mirror the Intl.RelativeTimeFormat API. When unit is 'auto', the component selects the best unit based on the time difference.\n * @documentation https://nvidia.github.io/elements/docs/elements/format-relative-time/\n * @since 0.0.0\n * @entrypoint \\@nvidia-elements/core/format-relative-time\n * @slot - Date string to format (such as 2023-07-28T04:20:17.434Z). Serves as fallback before hydration.\n * @aria https://developer.mozilla.org/en-US/docs/Web/HTML/Element/time\n */\n@typeSSR()\nexport class FormatRelativeTime extends LitElement {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-format-relative-time',\n    version: '0.0.0'\n  };\n\n  /**\n   * Optional date string for values supplied by JavaScript or bound data.\n   * By default, the component formats the element's text content, which also serves as the SSR fallback.\n   * When both are present, this property takes precedence.\n   */\n  @property({ type: String }) date?: string;\n\n  /**\n   * Language tag (such as en-US, de-DE). Defaults to document.documentElement.lang or browser default.\n   */\n  @property({ type: String }) locale?: string;\n\n  /**\n   * Numeric formatting: 'always' | 'auto'. When 'auto', enables natural language forms such as 'yesterday' instead of '1 day ago'.\n   */\n  @property({ type: String }) numeric: 'always' | 'auto' = 'always';\n\n  /**\n   * Formatting length: 'long' | 'short' | 'narrow'. Controls verbosity (such as '3 days ago' vs '3d ago'). Maps to Intl.RelativeTimeFormat style option.\n   */\n  @property({ type: String, attribute: 'format-style' }) formatStyle: 'long' | 'short' | 'narrow' = 'long';\n\n  /**\n   * Time unit: 'second' | 'minute' | 'hour' | 'day' | 'week' | 'month' | 'year' | 'auto'. Use 'auto' to let the component select the most appropriate unit based on the time difference.\n   */\n  @property({ type: String }) unit: 'second' | 'minute' | 'hour' | 'day' | 'week' | 'month' | 'year' | 'auto' = 'auto';\n\n  /**\n   * When present, auto-updates the displayed relative time at appropriate intervals.\n   */\n  @property({ type: Boolean }) sync = false;\n\n  #timer?: ReturnType<typeof setTimeout>;\n\n  get #dateValue(): string {\n    return this.date ?? this.textContent?.trim() ?? '';\n  }\n\n  get #resolvedLocale(): string | undefined {\n    return this.locale ?? (globalThis.document?.documentElement?.lang || undefined);\n  }\n\n  #computeUnit(diffMs: number): { value: number; unit: Intl.RelativeTimeFormatUnit } {\n    const absDiff = Math.abs(diffMs);\n    const sign = diffMs < 0 ? -1 : 1;\n\n    for (const { unit, max } of THRESHOLDS) {\n      const value = Math.round(absDiff / UNIT_DIVISORS[unit]);\n      if (value < max) return { value: sign * value, unit };\n    }\n    return { value: sign * Math.round(absDiff / UNIT_DIVISORS.year), unit: 'year' };\n  }\n\n  #computeExplicitUnit(diffMs: number, unit: TimeUnitOption): number {\n    return Math.round(diffMs / UNIT_DIVISORS[unit]);\n  }\n\n  #resolveValueAndUnit(diffMs: number): { value: number; unit: Intl.RelativeTimeFormatUnit } {\n    if (this.unit === 'auto') {\n      return this.#computeUnit(diffMs);\n    }\n    return { unit: this.unit, value: this.#computeExplicitUnit(diffMs, this.unit) };\n  }\n\n  get #formattedRelativeTime(): string {\n    const iso = this.#dateValue;\n    if (!iso) return '';\n\n    const target = new Date(iso);\n    if (isNaN(target.getTime())) {\n      return iso;\n    }\n\n    const { value, unit: resolvedUnit } = this.#resolveValueAndUnit(target.getTime() - Date.now());\n\n    try {\n      return new Intl.RelativeTimeFormat(this.#resolvedLocale, {\n        numeric: this.numeric,\n        style: this.formatStyle\n      }).format(value, resolvedUnit);\n    } catch {\n      return iso;\n    }\n  }\n\n  #getSyncInterval(): number {\n    const iso = this.#dateValue;\n    if (!iso) return 60000;\n\n    const absDiff = Math.abs(new Date(iso).getTime() - Date.now());\n    if (absDiff < 60000) return 10000;\n    if (absDiff < 3600000) return 30000;\n    if (absDiff < 86400000) return 300000;\n    return 3600000;\n  }\n\n  #startSync() {\n    this.#stopSync();\n    if (!this.sync) return;\n\n    this.#timer = setTimeout(() => {\n      this.requestUpdate();\n      this.#startSync();\n    }, this.#getSyncInterval());\n  }\n\n  #stopSync() {\n    if (this.#timer !== undefined) {\n      clearTimeout(this.#timer);\n      this.#timer = undefined;\n    }\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    if (this.sync) this.#startSync();\n  }\n\n  disconnectedCallback() {\n    this.#stopSync();\n    super.disconnectedCallback();\n  }\n\n  updated(changed: Map<string, unknown>) {\n    if (changed.has('sync')) {\n      if (this.sync) {\n        this.#startSync();\n      } else {\n        this.#stopSync();\n      }\n    }\n  }\n\n  render() {\n    return html`<time internal-host datetime=${this.#dateValue}>${this.#formattedRelativeTime}<slot @slotchange=${this.#onSlotChange} hidden></slot></time>`;\n  }\n\n  #onSlotChange() {\n    this.requestUpdate();\n  }\n}\n"],"mappings":"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"}

package/dist/format-truncate/format-truncate2.js

@@ -1,25 +1,25 @@
-import { attachInternals as e } from "../internal/utils/a11y.js";
-import { typeSSR as t } from "../internal/controllers/type-ssr.controller.js";
-import { useStyles as n } from "../internal/styles/index.js";
-import r from "../_virtual/_@oxc-project_runtime@0.155.0/helpers/esm/decorate.js";
-import { normalizeTruncateString as i, normalizeTruncateText as a, truncateText as o } from "./utils.js";
-import s from "./format-truncate.js";
-import { LitElement as c, html as l } from "lit";
-import { property as u } from "lit/decorators/property.js";
+import { typeSSR as e } from "../internal/controllers/type-ssr.controller.js";
+import t from "../_virtual/_@oxc-project_runtime@0.155.0/helpers/esm/decorate.js";
+import { normalizeTruncateString as n, normalizeTruncateText as r, truncateText as i } from "./utils.js";
+import a from "./format-truncate.js";
+import { attachInternals as o } from "@nvidia-elements/foundations/internal/a11y";
+import { LitElement as s, html as c } from "lit";
+import { property as l } from "lit/decorators/property.js";
+import { useStyles as u } from "@nvidia-elements/foundations/internal/styles";
 // src/format-truncate/format-truncate.ts
-var d = class extends c {
+var d = class extends s {
 	constructor(...e) {
 		super(...e), this.position = "start", this.strategy = "character", this.bias = "end", this.preserve = 6, this.#r = Infinity, this.#u = () => {
 			this.requestUpdate();
 		};
 	}
 	static {
-		this.styles = n([s]);
+		this.styles = u([a]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-format-truncate",
-			version: "2.23.4"
+			version: "2.23.5"
 		};
 	}
 	#e;
@@ -27,7 +27,7 @@ var d = class extends c {
 	#n;
 	#r;
 	connectedCallback() {
-		super.connectedCallback(), e(this), this.#r = Infinity, this.#l(), this.requestUpdate();
+		super.connectedCallback(), o(this), this.#r = Infinity, this.#l(), this.requestUpdate();
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback(), this.#t?.disconnect(), this.#n !== void 0 && this.ownerDocument.defaultView?.cancelAnimationFrame(this.#n), this.#n = void 0;
@@ -37,17 +37,17 @@ var d = class extends c {
 	}
 	render() {
 		let e = this.#i, t = this.#a(e);
-		return t === e ? this.removeAttribute("title") : this.title !== e && (this.title = e), l`<span internal-host aria-hidden="true">${t}</span><span sizing-host aria-hidden="true">${e}</span><slot @slotchange="${this.#u}"></slot>`;
+		return t === e ? this.removeAttribute("title") : this.title !== e && (this.title = e), c`<span internal-host aria-hidden="true">${t}</span><span sizing-host aria-hidden="true">${e}</span><slot @slotchange="${this.#u}"></slot>`;
 	}
 	get #i() {
 		let e = this.shadowRoot?.querySelector("slot:not([name])");
-		if (e) return a(e.assignedNodes({ flatten: !0 }));
+		if (e) return r(e.assignedNodes({ flatten: !0 }));
 		let t = Array.from(this.childNodes ?? []).filter(p);
-		return t.length ? a(t) : i(this.textContent ?? "");
+		return t.length ? r(t) : n(this.textContent ?? "");
 	}
 	#a(e) {
 		let t = this.#o();
-		return o(e, {
+		return i(e, {
 			position: this.position,
 			strategy: this.strategy,
 			bias: this.bias,
@@ -90,19 +90,19 @@ var d = class extends c {
 	}
 	#u;
 };
-r([u({
+t([l({
 	type: String,
 	reflect: !0
-})], d.prototype, "position", void 0), r([u({
+})], d.prototype, "position", void 0), t([l({
 	type: String,
 	reflect: !0
-})], d.prototype, "strategy", void 0), r([u({
+})], d.prototype, "strategy", void 0), t([l({
 	type: String,
 	reflect: !0
-})], d.prototype, "bias", void 0), r([u({
+})], d.prototype, "bias", void 0), t([l({
 	type: Number,
 	reflect: !0
-})], d.prototype, "preserve", void 0), d = r([t()], d);
+})], d.prototype, "preserve", void 0), d = t([e()], d);
 function f(e) {
 	let t = Number.parseFloat(e);
 	return Number.isFinite(t) ? t : 0;

package/dist/format-truncate/format-truncate2.js.map

@@ -1 +1 @@
-{"version":3,"file":"format-truncate2.js","names":["styles","_decorate","__decorate","format_truncate_default","FormatTruncate","LitElement","_args","#availableWidth","#onSlotChange","useStyles","attachInternals","#observeAvailableWidth","#resizeObserver","#resizeFrame","text","#slottedText","truncatedText","#renderText","slot","normalizeTruncateText","nodes","isDefaultSlotNode","normalizeTruncateString","measureText","#createTextMeasurer","truncateText","view","context","#textMeasurementContext","computedStyles","letterSpacing","cssPixelValue","wordSpacing","graphemeSegmenter","#measureText","graphemeSegments","whitespaceCount","#measurementContext","entry","entries","property","typeSSR","parsed","value","isElementNode","node"],"sources":["../../src/format-truncate/format-truncate.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { TemplateResult } from 'lit';\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { attachInternals, useStyles, typeSSR } from '@nvidia-elements/core/internal';\nimport { normalizeTruncateString, normalizeTruncateText, truncateText } from './utils.js';\nimport styles from './format-truncate.css?inline';\n\n/**\n * @element nve-format-truncate\n * @description Truncates text at its start, center, or end while preserving the full text for assistive technology.\n * @documentation https://nvidia.github.io/elements/docs/elements/format-truncate/\n * @since 0.0.0\n * @entrypoint \\@nvidia-elements/core/format-truncate\n * @slot - Text to truncate. The component flattens, trims, and normalizes mixed text and element nodes.\n * @beta\n */\n@typeSSR()\nexport class FormatTruncate extends LitElement {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-format-truncate',\n    version: '0.0.0'\n  };\n\n  /**\n   * Location of the ellipsis. Use start or end to preserve one edge, or center to preserve both edges.\n   */\n  @property({ type: String, reflect: true }) position: 'start' | 'center' | 'end' = 'start';\n\n  /**\n   * Text unit used for center truncation. Character preserves graphemes, word preserves words, and path preserves path segments.\n   */\n  @property({ type: String, reflect: true }) strategy: 'character' | 'word' | 'path' = 'character';\n\n  /**\n   * Edge favored by center truncation. The favored edge keeps at least the configured number of units.\n   */\n  @property({ type: String, reflect: true }) bias: 'start' | 'end' = 'end';\n\n  /**\n   * Number of strategy units retained at the biased edge during center truncation.\n   */\n  @property({ type: Number, reflect: true }) preserve = 6;\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  #measurementContext?: CanvasRenderingContext2D | null;\n  #resizeObserver?: ResizeObserver;\n  #resizeFrame?: number;\n  #availableWidth = Number.POSITIVE_INFINITY;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    attachInternals(this);\n    this.#availableWidth = Number.POSITIVE_INFINITY;\n    this.#observeAvailableWidth();\n    this.requestUpdate();\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#resizeObserver?.disconnect();\n    if (this.#resizeFrame !== undefined) this.ownerDocument.defaultView?.cancelAnimationFrame(this.#resizeFrame);\n    this.#resizeFrame = undefined;\n  }\n\n  connectedMoveCallback(): void {\n    this.#availableWidth = Number.POSITIVE_INFINITY;\n    this.#observeAvailableWidth();\n    this.requestUpdate();\n  }\n\n  override render(): TemplateResult {\n    const text = this.#slottedText;\n    const truncatedText = this.#renderText(text);\n\n    if (truncatedText !== text) {\n      if (this.title !== text) this.title = text;\n    } else this.removeAttribute('title');\n\n    return html`<span internal-host aria-hidden=\"true\">${truncatedText}</span><span sizing-host aria-hidden=\"true\">${text}</span><slot @slotchange=${this.#onSlotChange}></slot>`;\n  }\n\n  get #slottedText(): string {\n    const slot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot:not([name])');\n    if (slot) return normalizeTruncateText(slot.assignedNodes({ flatten: true }));\n\n    const nodes = Array.from(this.childNodes ?? []).filter(isDefaultSlotNode);\n    return nodes.length ? normalizeTruncateText(nodes) : normalizeTruncateString(this.textContent ?? '');\n  }\n\n  #renderText(text: string): string {\n    const measureText = this.#createTextMeasurer();\n\n    return truncateText(text, {\n      position: this.position,\n      strategy: this.strategy,\n      bias: this.bias,\n      preserve: this.preserve,\n      availableWidth: this.#availableWidth,\n      measureText\n    });\n  }\n\n  #createTextMeasurer(): (text: string) => number {\n    const view = this.ownerDocument?.defaultView;\n    const context = this.#textMeasurementContext;\n    if (!view || !context) return () => 0;\n\n    const computedStyles = view.getComputedStyle(this);\n    context.font = computedStyles.font;\n\n    const letterSpacing = cssPixelValue(computedStyles.letterSpacing);\n    const wordSpacing = cssPixelValue(computedStyles.wordSpacing);\n    const graphemeSegmenter = new Intl.Segmenter(undefined, { granularity: 'grapheme' });\n\n    return text => this.#measureText(text, { context, letterSpacing, wordSpacing, graphemeSegmenter });\n  }\n\n  #measureText(\n    text: string,\n    {\n      context,\n      letterSpacing,\n      wordSpacing,\n      graphemeSegmenter\n    }: {\n      context: CanvasRenderingContext2D;\n      letterSpacing: number;\n      wordSpacing: number;\n      graphemeSegmenter: Intl.Segmenter;\n    }\n  ): number {\n    const graphemeSegments = graphemeSegmenter.segment(text);\n    const whitespaceCount = Array.from(text.matchAll(/\\s/gu)).length;\n\n    return (\n      context.measureText(text).width +\n      Math.max(0, Array.from(graphemeSegments).length - 1) * letterSpacing +\n      whitespaceCount * wordSpacing\n    );\n  }\n\n  get #textMeasurementContext(): CanvasRenderingContext2D | null {\n    if (this.#measurementContext === undefined) {\n      this.#measurementContext = this.ownerDocument?.createElement('canvas').getContext('2d') ?? null;\n    }\n\n    return this.#measurementContext;\n  }\n\n  #observeAvailableWidth(): void {\n    if (typeof ResizeObserver === 'undefined') return;\n\n    this.#resizeObserver ??= new ResizeObserver(entries => {\n      const entry = entries[0];\n      if (this.isConnected && entry) {\n        // Content-box measurements avoid synchronous geometry reads between sibling Lit updates.\n        this.#availableWidth = entry.contentRect.width;\n        const view = this.ownerDocument.defaultView;\n        if (view && this.#resizeFrame === undefined) {\n          this.#resizeFrame = view.requestAnimationFrame(() => {\n            this.#resizeFrame = undefined;\n            if (this.isConnected) this.requestUpdate();\n          });\n        }\n      }\n    });\n    this.#resizeObserver.disconnect();\n    this.#resizeObserver.observe(this);\n  }\n\n  #onSlotChange = (): void => {\n    this.requestUpdate();\n  };\n}\n\nfunction cssPixelValue(value: string): number {\n  const parsed = Number.parseFloat(value);\n  return Number.isFinite(parsed) ? parsed : 0;\n}\n\nfunction isDefaultSlotNode(node: Node): boolean {\n  return !isElementNode(node) || !node.getAttribute('slot');\n}\n\nfunction isElementNode(node: Node): node is Element {\n  return node.nodeType === 1;\n}\n"],"mappings":"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"}
+{"version":3,"file":"format-truncate2.js","names":["styles","_decorate","__decorate","format_truncate_default","FormatTruncate","LitElement","_args","#availableWidth","#onSlotChange","useStyles","attachInternals","#observeAvailableWidth","#resizeObserver","#resizeFrame","text","#slottedText","truncatedText","#renderText","slot","normalizeTruncateText","nodes","isDefaultSlotNode","normalizeTruncateString","measureText","#createTextMeasurer","truncateText","view","context","#textMeasurementContext","computedStyles","letterSpacing","cssPixelValue","wordSpacing","graphemeSegmenter","#measureText","graphemeSegments","whitespaceCount","#measurementContext","entry","entries","property","typeSSR","parsed","value","isElementNode","node"],"sources":["../../src/format-truncate/format-truncate.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { TemplateResult } from 'lit';\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { typeSSR } from '@nvidia-elements/core/internal';\nimport { attachInternals } from '@nvidia-elements/foundations/internal/a11y';\nimport { useStyles } from '@nvidia-elements/foundations/internal/styles';\nimport { normalizeTruncateString, normalizeTruncateText, truncateText } from './utils.js';\nimport styles from './format-truncate.css?inline';\n\n/**\n * @element nve-format-truncate\n * @description Truncates text at its start, center, or end while preserving the full text for assistive technology.\n * @documentation https://nvidia.github.io/elements/docs/elements/format-truncate/\n * @since 0.0.0\n * @entrypoint \\@nvidia-elements/core/format-truncate\n * @slot - Text to truncate. The component flattens, trims, and normalizes mixed text and element nodes.\n * @beta\n */\n@typeSSR()\nexport class FormatTruncate extends LitElement {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-format-truncate',\n    version: '0.0.0'\n  };\n\n  /**\n   * Location of the ellipsis. Use start or end to preserve one edge, or center to preserve both edges.\n   */\n  @property({ type: String, reflect: true }) position: 'start' | 'center' | 'end' = 'start';\n\n  /**\n   * Text unit used for center truncation. Character preserves graphemes, word preserves words, and path preserves path segments.\n   */\n  @property({ type: String, reflect: true }) strategy: 'character' | 'word' | 'path' = 'character';\n\n  /**\n   * Edge favored by center truncation. The favored edge keeps at least the configured number of units.\n   */\n  @property({ type: String, reflect: true }) bias: 'start' | 'end' = 'end';\n\n  /**\n   * Number of strategy units retained at the biased edge during center truncation.\n   */\n  @property({ type: Number, reflect: true }) preserve = 6;\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  #measurementContext?: CanvasRenderingContext2D | null;\n  #resizeObserver?: ResizeObserver;\n  #resizeFrame?: number;\n  #availableWidth = Number.POSITIVE_INFINITY;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    attachInternals(this);\n    this.#availableWidth = Number.POSITIVE_INFINITY;\n    this.#observeAvailableWidth();\n    this.requestUpdate();\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.#resizeObserver?.disconnect();\n    if (this.#resizeFrame !== undefined) this.ownerDocument.defaultView?.cancelAnimationFrame(this.#resizeFrame);\n    this.#resizeFrame = undefined;\n  }\n\n  connectedMoveCallback(): void {\n    this.#availableWidth = Number.POSITIVE_INFINITY;\n    this.#observeAvailableWidth();\n    this.requestUpdate();\n  }\n\n  override render(): TemplateResult {\n    const text = this.#slottedText;\n    const truncatedText = this.#renderText(text);\n\n    if (truncatedText !== text) {\n      if (this.title !== text) this.title = text;\n    } else this.removeAttribute('title');\n\n    return html`<span internal-host aria-hidden=\"true\">${truncatedText}</span><span sizing-host aria-hidden=\"true\">${text}</span><slot @slotchange=${this.#onSlotChange}></slot>`;\n  }\n\n  get #slottedText(): string {\n    const slot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot:not([name])');\n    if (slot) return normalizeTruncateText(slot.assignedNodes({ flatten: true }));\n\n    const nodes = Array.from(this.childNodes ?? []).filter(isDefaultSlotNode);\n    return nodes.length ? normalizeTruncateText(nodes) : normalizeTruncateString(this.textContent ?? '');\n  }\n\n  #renderText(text: string): string {\n    const measureText = this.#createTextMeasurer();\n\n    return truncateText(text, {\n      position: this.position,\n      strategy: this.strategy,\n      bias: this.bias,\n      preserve: this.preserve,\n      availableWidth: this.#availableWidth,\n      measureText\n    });\n  }\n\n  #createTextMeasurer(): (text: string) => number {\n    const view = this.ownerDocument?.defaultView;\n    const context = this.#textMeasurementContext;\n    if (!view || !context) return () => 0;\n\n    const computedStyles = view.getComputedStyle(this);\n    context.font = computedStyles.font;\n\n    const letterSpacing = cssPixelValue(computedStyles.letterSpacing);\n    const wordSpacing = cssPixelValue(computedStyles.wordSpacing);\n    const graphemeSegmenter = new Intl.Segmenter(undefined, { granularity: 'grapheme' });\n\n    return text => this.#measureText(text, { context, letterSpacing, wordSpacing, graphemeSegmenter });\n  }\n\n  #measureText(\n    text: string,\n    {\n      context,\n      letterSpacing,\n      wordSpacing,\n      graphemeSegmenter\n    }: {\n      context: CanvasRenderingContext2D;\n      letterSpacing: number;\n      wordSpacing: number;\n      graphemeSegmenter: Intl.Segmenter;\n    }\n  ): number {\n    const graphemeSegments = graphemeSegmenter.segment(text);\n    const whitespaceCount = Array.from(text.matchAll(/\\s/gu)).length;\n\n    return (\n      context.measureText(text).width +\n      Math.max(0, Array.from(graphemeSegments).length - 1) * letterSpacing +\n      whitespaceCount * wordSpacing\n    );\n  }\n\n  get #textMeasurementContext(): CanvasRenderingContext2D | null {\n    if (this.#measurementContext === undefined) {\n      this.#measurementContext = this.ownerDocument?.createElement('canvas').getContext('2d') ?? null;\n    }\n\n    return this.#measurementContext;\n  }\n\n  #observeAvailableWidth(): void {\n    if (typeof ResizeObserver === 'undefined') return;\n\n    this.#resizeObserver ??= new ResizeObserver(entries => {\n      const entry = entries[0];\n      if (this.isConnected && entry) {\n        // Content-box measurements avoid synchronous geometry reads between sibling Lit updates.\n        this.#availableWidth = entry.contentRect.width;\n        const view = this.ownerDocument.defaultView;\n        if (view && this.#resizeFrame === undefined) {\n          this.#resizeFrame = view.requestAnimationFrame(() => {\n            this.#resizeFrame = undefined;\n            if (this.isConnected) this.requestUpdate();\n          });\n        }\n      }\n    });\n    this.#resizeObserver.disconnect();\n    this.#resizeObserver.observe(this);\n  }\n\n  #onSlotChange = (): void => {\n    this.requestUpdate();\n  };\n}\n\nfunction cssPixelValue(value: string): number {\n  const parsed = Number.parseFloat(value);\n  return Number.isFinite(parsed) ? parsed : 0;\n}\n\nfunction isDefaultSlotNode(node: Node): boolean {\n  return !isElementNode(node) || !node.getAttribute('slot');\n}\n\nfunction isElementNode(node: Node): node is Element {\n  return node.nodeType === 1;\n}\n"],"mappings":"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"}

package/dist/forms/control/control2.js

@@ -1,20 +1,21 @@
 import { appendRootNodeStyle as e, getAttributeListChanges as t } from "../../internal/utils/dom.js";
-import { associateAriaDescribedBy as n, associateDataList as r, associateLabel as i, attachInternals as a } from "../../internal/utils/a11y.js";
-import { typeSSR as o } from "../../internal/controllers/type-ssr.controller.js";
-import { hostAttr as s } from "../../internal/decorators/host-attr.js";
-import { useStyles as c } from "../../internal/styles/index.js";
-import l from "../../_virtual/_@oxc-project_runtime@0.155.0/helpers/esm/decorate.js";
-import { inputQuery as u, setupControlStates as d, setupControlStatusStates as f, setupControlValidationStates as p } from "../utils/states.js";
-import { setupControlLayoutStates as m } from "../utils/layout.js";
-import h from "./control.global.js";
-import g from "./control.js";
-import { LitElement as _, html as v, isServer as y, nothing as b } from "lit";
-import { property as x } from "lit/decorators/property.js";
-import { I18nController as S } from "@nvidia-elements/foundations/internal/i18n";
+import { typeSSR as n } from "../../internal/controllers/type-ssr.controller.js";
+import { hostAttr as r } from "../../internal/decorators/host-attr.js";
+import { associateAriaDescribedBy as i, associateDataList as a, associateLabel as o } from "../../internal/utils/a11y.js";
+import s from "../../_virtual/_@oxc-project_runtime@0.155.0/helpers/esm/decorate.js";
+import { inputQuery as c, setupControlStates as l, setupControlStatusStates as u, setupControlValidationStates as d } from "../utils/states.js";
+import { setupControlLayoutStates as f } from "../utils/layout.js";
+import p from "./control.global.js";
+import m from "./control.js";
+import { attachInternals as h } from "@nvidia-elements/foundations/internal/a11y";
+import { LitElement as g, html as _, isServer as v, nothing as y } from "lit";
+import { property as b } from "lit/decorators/property.js";
+import { I18nController as x } from "@nvidia-elements/foundations/internal/i18n";
+import { useStyles as S } from "@nvidia-elements/foundations/internal/styles";
 // src/forms/control/control.ts
-var C = class extends _ {
+var C = class extends g {
 	constructor(...e) {
-		super(...e), this.fitText = !1, this.fitContent = !1, this.#e = new S(this, this.i18nDefaults), this.i18n = this.#e.i18n, this.nveControl = "", this.#i = [], this._associateDatalist = !0, this.#a = () => {
+		super(...e), this.fitText = !1, this.fitContent = !1, this.#e = new x(this, this.i18nDefaults), this.i18n = this.#e.i18n, this.nveControl = "", this.#i = [], this._associateDatalist = !0, this.#a = () => {
 			this.#f(), this.input && this.#i.length === 0 && this.#l();
 		}, this.#u = () => {
 			this.#f(), this.#p();
@@ -32,33 +33,33 @@ var C = class extends _ {
 	}
 	#r;
 	get input() {
-		if (!y && !this.#r) {
+		if (!v && !this.#r) {
 			let e = this.querySelector("slot")?.assignedElements()?.find((e) => e.matches("input, select, selectmenu, textarea, [nve-control]")) ?? Array.from(this.shadowRoot.querySelector("slot")?.assignedElements({ flatten: !0 }) ?? []).find((e) => e.matches("input, select, selectmenu, textarea, [nve-control]"));
-			this.#r = e || this.querySelector(u);
+			this.#r = e || this.querySelector(c);
 		}
 		return this.#r;
 	}
 	get prefixContent() {
-		return b;
+		return y;
 	}
 	get suffixContent() {
-		return b;
+		return y;
 	}
 	#i;
 	static {
-		this.styles = c([g]);
+		this.styles = S([m]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-control",
-			version: "2.23.4"
+			version: "2.23.5"
 		};
 	}
 	render() {
-		return this.nveControl === "inline" ? v`<div internal-host part="_internal-host"><div input part="_input"><slot interaction-state></slot></div><slot name="label" part="_label"></slot><slot name="messages" part="_messages"></slot></div>` : v`<div internal-host part="_internal-host"><slot name="label" part="_label"></slot><div input part="_input">${this.prefixContent}<slot></slot>${this.suffixContent}</div><slot name="messages" part="_messages"></slot></div>`;
+		return this.nveControl === "inline" ? _`<div internal-host part="_internal-host"><div input part="_input"><slot interaction-state></slot></div><slot name="label" part="_label"></slot><slot name="messages" part="_messages"></slot></div>` : _`<div internal-host part="_internal-host"><slot name="label" part="_label"></slot><div input part="_input">${this.prefixContent}<slot></slot>${this.suffixContent}</div><slot name="messages" part="_messages"></slot></div>`;
 	}
 	connectedCallback() {
-		super.connectedCallback(), a(this), e(this, h), this.shadowRoot.addEventListener("slotchange", this.#a);
+		super.connectedCallback(), h(this), e(this, p), this.shadowRoot.addEventListener("slotchange", this.#a);
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback(), this.shadowRoot.removeEventListener("slotchange", this.#a), this.shadowRoot.removeEventListener("slotchange", this.#u), this.#i.forEach((e) => e.disconnect()), this.#i.length = 0;
@@ -81,7 +82,7 @@ var C = class extends _ {
 		return e instanceof HTMLInputElement && (e.type === "checkbox" || e.type === "radio");
 	}
 	#l() {
-		this.#i.push(...p(this, this.#n), ...d(this), ...f(this, this.#n), m(this), t(this, ["hidden", "status"], () => this.#f())), this.#d(), this.#p(), this.shadowRoot.addEventListener("slotchange", this.#u);
+		this.#i.push(...d(this, this.#n), ...l(this), ...u(this, this.#n), f(this), t(this, ["hidden", "status"], () => this.#f())), this.#d(), this.#p(), this.shadowRoot.addEventListener("slotchange", this.#u);
 	}
 	#u;
 	#d() {
@@ -91,7 +92,7 @@ var C = class extends _ {
 		this.input && (this.toggleAttribute("multiple", this.input?.multiple), this.input?.hasAttribute("size") ? this.setAttribute("size", "") : this.removeAttribute("size"));
 	}
 	#p() {
-		this.#m(), i(this.#t, this.input), n(Array.from(this.#n), this.input), this._associateDatalist && r(this.querySelector("datalist"), this.input);
+		this.#m(), o(this.#t, this.input), i(Array.from(this.#n), this.input), this._associateDatalist && a(this.querySelector("datalist"), this.input);
 	}
 	#m() {
 		let e = this.querySelector("label") || this.shadowRoot.querySelector("slot").assignedNodes({ flatten: !0 }).find((e) => e.tagName === "LABEL");
@@ -103,21 +104,21 @@ var C = class extends _ {
 		} catch {}
 	}
 };
-l([x({ type: String })], C.prototype, "status", void 0), l([x({
+s([b({ type: String })], C.prototype, "status", void 0), s([b({
 	type: String,
 	reflect: !0
-})], C.prototype, "layout", void 0), l([x({
+})], C.prototype, "layout", void 0), s([b({
 	type: Boolean,
 	reflect: !0,
 	attribute: "fit-text"
-})], C.prototype, "fitText", void 0), l([x({
+})], C.prototype, "fitText", void 0), s([b({
 	type: Boolean,
 	reflect: !0,
 	attribute: "fit-content"
-})], C.prototype, "fitContent", void 0), l([x({ type: Object })], C.prototype, "i18n", void 0), l([x({
+})], C.prototype, "fitContent", void 0), s([b({ type: Object })], C.prototype, "i18n", void 0), s([b({
 	type: String,
 	reflect: !0
-})], C.prototype, "prominence", void 0), l([s({ attribute: "nve-control" })], C.prototype, "nveControl", void 0), C = l([o()], C);
+})], C.prototype, "prominence", void 0), s([r({ attribute: "nve-control" })], C.prototype, "nveControl", void 0), C = s([n()], C);
 export { C as Control };
 
 //# sourceMappingURL=control2.js.map

package/dist/forms/control/control2.js.map

@@ -1 +1 @@
-{"version":3,"file":"control2.js","names":["styles","globalStyles","_decorate","__decorate","control_global_default","control_default","Control","LitElement","_args","#i18nController","I18nController","#observers","#onRootSlotchange","#updateStyleStates","#setupInput","#onInputSlotchange","#updateAssociations","#label","#messages","isServer","#input","slotted","i","inputQuery","nothing","useStyles","attachInternals","appendRootNodeStyle","observer","#resetInputValue","input","#resetSelectValue","#isCheckedInput","hasDefaultSelection","option","setupControlValidationStates","setupControlStates","setupControlStatusStates","setupControlLayoutStates","getAttributeListChanges","#polyfillShowPicker","#assignLabel","associateLabel","associateAriaDescribedBy","associateDataList","label","property","hostAttr","typeSSR"],"sources":["../../../src/forms/control/control.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { TemplateResult } from 'lit';\nimport { LitElement, html, nothing, isServer } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport {\n  attachInternals,\n  useStyles,\n  associateLabel,\n  associateAriaDescribedBy,\n  associateDataList,\n  appendRootNodeStyle,\n  getAttributeListChanges,\n  hostAttr,\n  typeSSR\n} from '@nvidia-elements/core/internal';\nimport { I18nController, type I18nDefaults } from '@nvidia-elements/foundations/internal/i18n';\nimport type { ControlMessage } from '../control-message/control-message.js';\nimport {\n  setupControlValidationStates,\n  setupControlStates,\n  setupControlStatusStates,\n  inputQuery,\n  type ControlStateCleanup\n} from '../utils/states.js';\nimport { setupControlLayoutStates } from '../utils/layout.js';\nimport globalStyles from './control.global.css?inline';\nimport styles from './control.css?inline';\n\ninterface ResettableControl {\n  getAttribute: Element['getAttribute'];\n  value: string;\n}\n\ntype ControlInput = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement | ResettableControl;\n\n/**\n * @element nve-control\n * @description Wraps a form input with its associated label and validation messages, managing layout and accessibility associations.\n * @documentation https://nvidia.github.io/elements/docs/elements/control/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/forms\n * @slot - Control input element\n * @slot label - Label element\n * @cssprop --cursor\n * @cssprop --accent-color\n * @cssprop --color\n * @cssprop --label-color\n * @cssprop --label-width\n * @cssprop --label-font-weight\n * @cssprop --label-font-size\n * @cssprop --control-width\n * @cssprop --control-height\n\n * @aria https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals\n * @package true\n */\n@typeSSR()\nexport class Control extends LitElement {\n  /** Set current visual state for control. This overrides any validation states active. */\n  @property({ type: String }) status: 'warning' | 'error' | 'success' | 'disabled';\n\n  /** Set current control + label + control message layout. Layouts will collapse based on available container space. */\n  @property({ type: String, reflect: true }) layout:\n    | 'vertical'\n    | 'vertical-inline'\n    | 'horizontal'\n    | 'horizontal-inline';\n\n  /** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */\n  @property({ type: Boolean, reflect: true, attribute: 'fit-text' }) fitText = false;\n\n  /** Sets the input to match native default content block */\n  @property({ type: Boolean, reflect: true, attribute: 'fit-content' }) fitContent = false;\n\n  /** Component-specific defaults supplied by a derived control. */\n  protected get i18nDefaults(): I18nDefaults {\n    return {};\n  }\n\n  #i18nController: I18nController<this> = new I18nController<this>(this, this.i18nDefaults);\n\n  /** Enables internal string values to update for internationalization. */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  /** Set the visual prominence of the control */\n  @property({ type: String, reflect: true }) prominence: 'muted';\n\n  get #label() {\n    return this.shadowRoot\n      ?.querySelector<HTMLSlotElement>('slot[name=\"label\"]')\n      ?.assignedElements({ flatten: true })?.[0] as HTMLLabelElement;\n  }\n\n  get #messages() {\n    return (this.shadowRoot\n      ?.querySelector<HTMLSlotElement>('slot[name=\"messages\"]')\n      ?.assignedElements({ flatten: true }) ?? []) as ControlMessage[];\n  }\n\n  #input: HTMLInputElement;\n\n  /** @private */\n  get input(): HTMLInputElement {\n    if (!isServer && !this.#input) {\n      const slotted =\n        this.querySelector('slot')\n          ?.assignedElements()\n          ?.find(i => i.matches(inputQuery)) ??\n        Array.from(this.shadowRoot!.querySelector('slot')?.assignedElements({ flatten: true }) ?? []).find(i =>\n          i.matches(inputQuery)\n        );\n      this.#input = (slotted ? slotted : this.querySelector(inputQuery)) as HTMLInputElement;\n    }\n\n    return this.#input;\n  }\n\n  /** @private */\n  protected get prefixContent(): typeof nothing | TemplateResult {\n    return nothing;\n  }\n\n  /** @private */\n  protected get suffixContent(): typeof nothing | TemplateResult {\n    return nothing;\n  }\n\n  @hostAttr({ attribute: 'nve-control' }) protected nveControl = '';\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  #observers: (MutationObserver | ResizeObserver | ControlStateCleanup)[] = [];\n\n  protected _associateDatalist = true;\n\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-control',\n    version: '0.0.0'\n  };\n\n  render() {\n    return this.nveControl !== 'inline'\n      ? html`\n      <div internal-host part=\"_internal-host\">\n        <slot name=\"label\" part=\"_label\"></slot>\n        <div input part=\"_input\">\n          ${this.prefixContent}\n          <slot></slot>\n          ${this.suffixContent}\n        </div>\n        <slot name=\"messages\" part=\"_messages\"></slot>\n      </div>\n    `\n      : html`\n      <div internal-host part=\"_internal-host\">\n        <div input part=\"_input\"><slot interaction-state></slot></div>\n        <slot name=\"label\" part=\"_label\"></slot>\n        <slot name=\"messages\" part=\"_messages\"></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    appendRootNodeStyle(this, globalStyles);\n    this.shadowRoot!.addEventListener('slotchange', this.#onRootSlotchange);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.shadowRoot!.removeEventListener('slotchange', this.#onRootSlotchange);\n    this.shadowRoot!.removeEventListener('slotchange', this.#onInputSlotchange);\n    this.#observers.forEach(observer => observer.disconnect());\n    this.#observers.length = 0;\n  }\n\n  #onRootSlotchange = () => {\n    this.#updateStyleStates();\n\n    if (this.input && this.#observers.length === 0) {\n      this.#setupInput();\n    }\n  };\n\n  /** Resets control value to initial attribute value and clears any active validation rules. */\n  reset() {\n    this.#resetInputValue(this.input);\n    this.requestUpdate();\n    this.dispatchEvent(new CustomEvent('reset', { bubbles: true, composed: true }));\n  }\n\n  #resetInputValue(input: ControlInput) {\n    if (input instanceof HTMLSelectElement) {\n      this.#resetSelectValue(input);\n      return;\n    }\n\n    if (this.#isCheckedInput(input)) {\n      input.checked = input.defaultChecked;\n      input.indeterminate = false;\n      return;\n    }\n\n    input.value =\n      input instanceof HTMLInputElement || input instanceof HTMLTextAreaElement\n        ? input.defaultValue\n        : (input.getAttribute('value') ?? '');\n  }\n\n  #resetSelectValue(input: HTMLSelectElement) {\n    const hasDefaultSelection = Array.from(input.options).some(option => option.defaultSelected);\n    Array.from(input.options).forEach(option => (option.selected = option.defaultSelected));\n    if (!input.multiple && !hasDefaultSelection) input.selectedIndex = 0;\n  }\n\n  #isCheckedInput(input: ControlInput): input is HTMLInputElement {\n    return input instanceof HTMLInputElement && (input.type === 'checkbox' || input.type === 'radio');\n  }\n\n  #setupInput() {\n    this.#observers.push(\n      ...setupControlValidationStates(this, this.#messages),\n      ...setupControlStates(this),\n      ...setupControlStatusStates(this, this.#messages),\n      setupControlLayoutStates(this),\n      getAttributeListChanges(this, ['hidden', 'status'], () => this.#updateStyleStates())\n    );\n\n    this.#polyfillShowPicker();\n    this.#updateAssociations();\n    this.shadowRoot!.addEventListener('slotchange', this.#onInputSlotchange);\n  }\n\n  #onInputSlotchange = () => {\n    this.#updateStyleStates();\n    this.#updateAssociations();\n  };\n\n  #polyfillShowPicker() {\n    if (!this.input.showPicker) {\n      this.input.showPicker = () => this.input.focus();\n    }\n  }\n\n  #updateStyleStates() {\n    if (this.input) {\n      this.toggleAttribute('multiple', this.input?.multiple);\n      this.input?.hasAttribute('size') ? this.setAttribute('size', '') : this.removeAttribute('size');\n    }\n  }\n\n  #updateAssociations() {\n    this.#assignLabel();\n    associateLabel(this.#label, this.input);\n    associateAriaDescribedBy(Array.from(this.#messages), this.input);\n\n    if (this._associateDatalist) {\n      associateDataList(this.querySelector<HTMLDataListElement>('datalist')!, this.input);\n    }\n  }\n\n  #assignLabel() {\n    const label =\n      this.querySelector('label') ||\n      (this.shadowRoot!.querySelector('slot')!\n        .assignedNodes({ flatten: true })\n        .find((i: Node) => (i as HTMLElement).tagName === 'LABEL') as HTMLLabelElement);\n    if (label) {\n      label.slot = 'label';\n    }\n  }\n\n  protected showPicker() {\n    try {\n      this.input.showPicker();\n    } catch {\n      //\n    }\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"control2.js","names":["styles","globalStyles","_decorate","__decorate","control_global_default","control_default","Control","LitElement","_args","#i18nController","I18nController","#observers","#onRootSlotchange","#updateStyleStates","#setupInput","#onInputSlotchange","#updateAssociations","#label","#messages","isServer","#input","slotted","i","inputQuery","nothing","useStyles","attachInternals","appendRootNodeStyle","observer","#resetInputValue","input","#resetSelectValue","#isCheckedInput","hasDefaultSelection","option","setupControlValidationStates","setupControlStates","setupControlStatusStates","setupControlLayoutStates","getAttributeListChanges","#polyfillShowPicker","#assignLabel","associateLabel","associateAriaDescribedBy","associateDataList","label","property","hostAttr","typeSSR"],"sources":["../../../src/forms/control/control.ts"],"sourcesContent":["// SPDX-FileCopyrightText: Copyright (c) 2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { TemplateResult } from 'lit';\nimport { LitElement, html, nothing, isServer } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport {\n  associateLabel,\n  associateAriaDescribedBy,\n  associateDataList,\n  appendRootNodeStyle,\n  getAttributeListChanges,\n  hostAttr,\n  typeSSR\n} from '@nvidia-elements/core/internal';\nimport { attachInternals } from '@nvidia-elements/foundations/internal/a11y';\nimport { useStyles } from '@nvidia-elements/foundations/internal/styles';\nimport { I18nController, type I18nDefaults } from '@nvidia-elements/foundations/internal/i18n';\nimport type { ControlMessage } from '../control-message/control-message.js';\nimport {\n  setupControlValidationStates,\n  setupControlStates,\n  setupControlStatusStates,\n  inputQuery,\n  type ControlStateCleanup\n} from '../utils/states.js';\nimport { setupControlLayoutStates } from '../utils/layout.js';\nimport globalStyles from './control.global.css?inline';\nimport styles from './control.css?inline';\n\ninterface ResettableControl {\n  getAttribute: Element['getAttribute'];\n  value: string;\n}\n\ntype ControlInput = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement | ResettableControl;\n\n/**\n * @element nve-control\n * @description Wraps a form input with its associated label and validation messages, managing layout and accessibility associations.\n * @documentation https://nvidia.github.io/elements/docs/elements/control/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/forms\n * @slot - Control input element\n * @slot label - Label element\n * @cssprop --cursor\n * @cssprop --accent-color\n * @cssprop --color\n * @cssprop --label-color\n * @cssprop --label-width\n * @cssprop --label-font-weight\n * @cssprop --label-font-size\n * @cssprop --control-width\n * @cssprop --control-height\n\n * @aria https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals\n * @package true\n */\n@typeSSR()\nexport class Control extends LitElement {\n  /** Set current visual state for control. This overrides any validation states active. */\n  @property({ type: String }) status: 'warning' | 'error' | 'success' | 'disabled';\n\n  /** Set current control + label + control message layout. Layouts will collapse based on available container space. */\n  @property({ type: String, reflect: true }) layout:\n    | 'vertical'\n    | 'vertical-inline'\n    | 'horizontal'\n    | 'horizontal-inline';\n\n  /** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */\n  @property({ type: Boolean, reflect: true, attribute: 'fit-text' }) fitText = false;\n\n  /** Sets the input to match native default content block */\n  @property({ type: Boolean, reflect: true, attribute: 'fit-content' }) fitContent = false;\n\n  /** Component-specific defaults supplied by a derived control. */\n  protected get i18nDefaults(): I18nDefaults {\n    return {};\n  }\n\n  #i18nController: I18nController<this> = new I18nController<this>(this, this.i18nDefaults);\n\n  /** Enables internal string values to update for internationalization. */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  /** Set the visual prominence of the control */\n  @property({ type: String, reflect: true }) prominence: 'muted';\n\n  get #label() {\n    return this.shadowRoot\n      ?.querySelector<HTMLSlotElement>('slot[name=\"label\"]')\n      ?.assignedElements({ flatten: true })?.[0] as HTMLLabelElement;\n  }\n\n  get #messages() {\n    return (this.shadowRoot\n      ?.querySelector<HTMLSlotElement>('slot[name=\"messages\"]')\n      ?.assignedElements({ flatten: true }) ?? []) as ControlMessage[];\n  }\n\n  #input: HTMLInputElement;\n\n  /** @private */\n  get input(): HTMLInputElement {\n    if (!isServer && !this.#input) {\n      const slotted =\n        this.querySelector('slot')\n          ?.assignedElements()\n          ?.find(i => i.matches(inputQuery)) ??\n        Array.from(this.shadowRoot!.querySelector('slot')?.assignedElements({ flatten: true }) ?? []).find(i =>\n          i.matches(inputQuery)\n        );\n      this.#input = (slotted ? slotted : this.querySelector(inputQuery)) as HTMLInputElement;\n    }\n\n    return this.#input;\n  }\n\n  /** @private */\n  protected get prefixContent(): typeof nothing | TemplateResult {\n    return nothing;\n  }\n\n  /** @private */\n  protected get suffixContent(): typeof nothing | TemplateResult {\n    return nothing;\n  }\n\n  @hostAttr({ attribute: 'nve-control' }) protected nveControl = '';\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  #observers: (MutationObserver | ResizeObserver | ControlStateCleanup)[] = [];\n\n  protected _associateDatalist = true;\n\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-control',\n    version: '0.0.0'\n  };\n\n  render() {\n    return this.nveControl !== 'inline'\n      ? html`\n      <div internal-host part=\"_internal-host\">\n        <slot name=\"label\" part=\"_label\"></slot>\n        <div input part=\"_input\">\n          ${this.prefixContent}\n          <slot></slot>\n          ${this.suffixContent}\n        </div>\n        <slot name=\"messages\" part=\"_messages\"></slot>\n      </div>\n    `\n      : html`\n      <div internal-host part=\"_internal-host\">\n        <div input part=\"_input\"><slot interaction-state></slot></div>\n        <slot name=\"label\" part=\"_label\"></slot>\n        <slot name=\"messages\" part=\"_messages\"></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    appendRootNodeStyle(this, globalStyles);\n    this.shadowRoot!.addEventListener('slotchange', this.#onRootSlotchange);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.shadowRoot!.removeEventListener('slotchange', this.#onRootSlotchange);\n    this.shadowRoot!.removeEventListener('slotchange', this.#onInputSlotchange);\n    this.#observers.forEach(observer => observer.disconnect());\n    this.#observers.length = 0;\n  }\n\n  #onRootSlotchange = () => {\n    this.#updateStyleStates();\n\n    if (this.input && this.#observers.length === 0) {\n      this.#setupInput();\n    }\n  };\n\n  /** Resets control value to initial attribute value and clears any active validation rules. */\n  reset() {\n    this.#resetInputValue(this.input);\n    this.requestUpdate();\n    this.dispatchEvent(new CustomEvent('reset', { bubbles: true, composed: true }));\n  }\n\n  #resetInputValue(input: ControlInput) {\n    if (input instanceof HTMLSelectElement) {\n      this.#resetSelectValue(input);\n      return;\n    }\n\n    if (this.#isCheckedInput(input)) {\n      input.checked = input.defaultChecked;\n      input.indeterminate = false;\n      return;\n    }\n\n    input.value =\n      input instanceof HTMLInputElement || input instanceof HTMLTextAreaElement\n        ? input.defaultValue\n        : (input.getAttribute('value') ?? '');\n  }\n\n  #resetSelectValue(input: HTMLSelectElement) {\n    const hasDefaultSelection = Array.from(input.options).some(option => option.defaultSelected);\n    Array.from(input.options).forEach(option => (option.selected = option.defaultSelected));\n    if (!input.multiple && !hasDefaultSelection) input.selectedIndex = 0;\n  }\n\n  #isCheckedInput(input: ControlInput): input is HTMLInputElement {\n    return input instanceof HTMLInputElement && (input.type === 'checkbox' || input.type === 'radio');\n  }\n\n  #setupInput() {\n    this.#observers.push(\n      ...setupControlValidationStates(this, this.#messages),\n      ...setupControlStates(this),\n      ...setupControlStatusStates(this, this.#messages),\n      setupControlLayoutStates(this),\n      getAttributeListChanges(this, ['hidden', 'status'], () => this.#updateStyleStates())\n    );\n\n    this.#polyfillShowPicker();\n    this.#updateAssociations();\n    this.shadowRoot!.addEventListener('slotchange', this.#onInputSlotchange);\n  }\n\n  #onInputSlotchange = () => {\n    this.#updateStyleStates();\n    this.#updateAssociations();\n  };\n\n  #polyfillShowPicker() {\n    if (!this.input.showPicker) {\n      this.input.showPicker = () => this.input.focus();\n    }\n  }\n\n  #updateStyleStates() {\n    if (this.input) {\n      this.toggleAttribute('multiple', this.input?.multiple);\n      this.input?.hasAttribute('size') ? this.setAttribute('size', '') : this.removeAttribute('size');\n    }\n  }\n\n  #updateAssociations() {\n    this.#assignLabel();\n    associateLabel(this.#label, this.input);\n    associateAriaDescribedBy(Array.from(this.#messages), this.input);\n\n    if (this._associateDatalist) {\n      associateDataList(this.querySelector<HTMLDataListElement>('datalist')!, this.input);\n    }\n  }\n\n  #assignLabel() {\n    const label =\n      this.querySelector('label') ||\n      (this.shadowRoot!.querySelector('slot')!\n        .assignedNodes({ flatten: true })\n        .find((i: Node) => (i as HTMLElement).tagName === 'LABEL') as HTMLLabelElement);\n    if (label) {\n      label.slot = 'label';\n    }\n  }\n\n  protected showPicker() {\n    try {\n      this.input.showPicker();\n    } catch {\n      //\n    }\n  }\n}\n"],"mappings":"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"}

package/dist/forms/control-group/control-group2.js

@@ -1,43 +1,44 @@
-import { associateAriaDescribedBy as e, associateAriaLabel as t, associateControlGroup as n, attachInternals as r } from "../../internal/utils/a11y.js";
-import { useStyles as i } from "../../internal/styles/index.js";
-import a from "../../_virtual/_@oxc-project_runtime@0.155.0/helpers/esm/decorate.js";
-import { inputQuery as o, setupControlGroupStates as s, setupControlStatusStates as c } from "../utils/states.js";
-import { setupControlLayoutStates as l } from "../utils/layout.js";
-import u from "./control-group.js";
-import { LitElement as d, html as f } from "lit";
-import { property as p } from "lit/decorators/property.js";
+import { associateAriaDescribedBy as e, associateAriaLabel as t, associateControlGroup as n } from "../../internal/utils/a11y.js";
+import r from "../../_virtual/_@oxc-project_runtime@0.155.0/helpers/esm/decorate.js";
+import { inputQuery as i, setupControlGroupStates as a, setupControlStatusStates as o } from "../utils/states.js";
+import { setupControlLayoutStates as s } from "../utils/layout.js";
+import c from "./control-group.js";
+import { attachInternals as l } from "@nvidia-elements/foundations/internal/a11y";
+import { LitElement as u, html as d } from "lit";
+import { property as f } from "lit/decorators/property.js";
+import { useStyles as p } from "@nvidia-elements/foundations/internal/styles";
 // src/forms/control-group/control-group.ts
-var m = class extends d {
+var m = class extends u {
 	get label() {
 		return this.querySelector?.("label");
 	}
 	get inputs() {
-		return this.querySelectorAll ? Array.from(this.querySelectorAll(o)) : [];
+		return this.querySelectorAll ? Array.from(this.querySelectorAll(i)) : [];
 	}
 	get #e() {
 		return this.querySelectorAll ? Array.from(this.querySelectorAll("nve-control-message")) : [];
 	}
 	#t = [];
 	static {
-		this.styles = i([u]);
+		this.styles = p([c]);
 	}
 	static {
 		this.metadata = {
 			tag: "nve-control-group",
-			version: "2.23.4"
+			version: "2.23.5"
 		};
 	}
 	render() {
-		return f`<div internal-host class="${this.#e.length ? "" : "no-messages"} ${this.label ? "" : "no-label"}"><slot name="label"></slot><slot class="input-slot"></slot><slot name="messages"></slot></div>`;
+		return d`<div internal-host class="${this.#e.length ? "" : "no-messages"} ${this.label ? "" : "no-label"}"><slot name="label"></slot><slot class="input-slot"></slot><slot name="messages"></slot></div>`;
 	}
 	connectedCallback() {
-		super.connectedCallback(), r(this), this._internals.role = "group";
+		super.connectedCallback(), l(this), this._internals.role = "group";
 	}
 	firstUpdated(e) {
 		super.firstUpdated(e), this.#t = [
+			a(this),
 			s(this),
-			l(this),
-			...c(this, this.#e)
+			...o(this, this.#e)
 		], this.#n(), this.shadowRoot.addEventListener("slotchange", () => this.#n());
 	}
 	disconnectedCallback() {
@@ -50,10 +51,10 @@ var m = class extends d {
 		this.label && (this.label.slot = "label");
 	}
 };
-a([p({
+r([f({
 	type: String,
 	reflect: !0
-})], m.prototype, "layout", void 0), a([p({
+})], m.prototype, "layout", void 0), r([f({
 	type: String,
 	reflect: !0
 })], m.prototype, "prominence", void 0);

package/dist/forms/control-group/control-group2.js.map

@@ -1 +1 @@
-{"version":3,"file":"control-group2.js","names":["styles","_decorate","__decorate","control_group_default","ControlGroup","LitElement","inputQuery","#messages","useStyles","attachInternals","props","#observers","setupControlGroupStates","setupControlLayoutStates","setupControlStatusStates","#updateAssociations","observer","#assignLabel","associateAriaLabel","associateAriaDescribedBy","associateControlGroup","property"],"sources":["../../../src/forms/control-group/control-group.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 {\n  attachInternals,\n  useStyles,\n  associateAriaLabel,\n  associateAriaDescribedBy,\n  associateControlGroup\n} from '@nvidia-elements/core/internal';\nimport type { ControlMessage } from '../control-message/control-message.js';\nimport {\n  setupControlStatusStates,\n  setupControlGroupStates,\n  inputQuery,\n  type ControlStateCleanup\n} from '../utils/states.js';\nimport { setupControlLayoutStates } from '../utils/layout.js';\nimport styles from './control-group.css?inline';\n\n/**\n * @element nve-control-group\n * @description Groups many related form controls under a shared label and validation context for semantically linked inputs.\n * @documentation https://nvidia.github.io/elements/docs/elements/control/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/forms\n * @slot - Control input elements\n * @cssprop --color\n * @cssprop --label-color\n * @cssprop --label-text-transform\n * @cssprop --label-font-weight\n * @cssprop --label-font-size\n * @aria https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals\n * @package true\n */\nexport class ControlGroup extends LitElement {\n  /** Set each slotted control + label + control message layout */\n  @property({ type: String, reflect: true }) layout:\n    | 'vertical'\n    | 'vertical-inline'\n    | 'horizontal'\n    | 'horizontal-inline';\n\n  /** Set the visual prominence of the control group */\n  @property({ type: String, reflect: true }) prominence: 'muted';\n\n  /** Returns the label associated with the control group. */\n  get label() {\n    return this.querySelector?.<HTMLLabelElement>('label');\n  }\n\n  /** Returns the input elements associated with the control group. */\n  get inputs() {\n    return this.querySelectorAll ? Array.from(this.querySelectorAll<HTMLInputElement>(inputQuery)) : [];\n  }\n\n  get #messages() {\n    return this.querySelectorAll ? Array.from(this.querySelectorAll<ControlMessage>('nve-control-message')) : [];\n  }\n\n  #observers: (MutationObserver | ResizeObserver | ControlStateCleanup)[] = [];\n\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-control-group',\n    version: '0.0.0'\n  };\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  render() {\n    return html`\n      <div internal-host class=\"${this.#messages.length ? '' : 'no-messages'} ${this.label ? '' : 'no-label'}\">\n        <slot name=\"label\"></slot>\n        <slot class=\"input-slot\"></slot>\n        <slot name=\"messages\"></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'group';\n  }\n\n  firstUpdated(props: PropertyValues<this>) {\n    super.firstUpdated(props);\n    this.#observers = [\n      setupControlGroupStates(this),\n      setupControlLayoutStates(this),\n      ...setupControlStatusStates(this, this.#messages)\n    ];\n    this.#updateAssociations();\n    this.shadowRoot!.addEventListener('slotchange', () => this.#updateAssociations());\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.#observers.forEach(observer => observer.disconnect());\n  }\n\n  #updateAssociations() {\n    this.#assignLabel();\n    associateAriaLabel(this.label as HTMLElement, this);\n    associateAriaDescribedBy(Array.from(this.querySelectorAll<ControlMessage>('nve-control-message')), this);\n    associateControlGroup(Array.from(this.inputs));\n  }\n\n  #assignLabel() {\n    if (this.label) {\n      this.label.slot = 'label';\n    }\n  }\n}\n"],"mappings":";;;;;;;;;AAsCA,IAAaI,IAAb,cAAkCC,EAAW;CAY3C,IAAI,QAAQ;EACV,OAAO,KAAK,gBAAkC,OAAO;CACvD;CAGA,IAAI,SAAS;EACX,OAAO,KAAK,mBAAmB,MAAM,KAAK,KAAK,iBAAmCC,CAAU,CAAC,IAAI,CAAC;CACpG;CAEA,IAAIC,KAAY;EACd,OAAO,KAAK,mBAAmB,MAAM,KAAK,KAAK,iBAAiC,qBAAqB,CAAC,IAAI,CAAC;CAC7G;CAEA,KAA0E,CAAC;;EAE3D,KAAA,SAAAC,EAAU,CAACR,CAAM,CAAC;;;EAEP,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;CAKA,SAAS;EACP,OAAO,CAAI,6BACmB,KAAKO,GAAU,SAAS,KAAK,cAAc,GAAG,KAAK,QAAQ,KAAK,WAAW;CAM3G;CAEA,oBAAoB;EAGlB,AAFA,MAAM,kBAAkB,GACxBE,EAAgB,IAAI,GACpB,KAAK,WAAW,OAAO;CACzB;CAEA,aAAa,GAA6B;EAQxC,AAPA,MAAM,aAAaC,CAAK,GACxB,KAAKC,KAAa;GAChBC,EAAwB,IAAI;GAC5BC,EAAyB,IAAI;GAC7B,GAAGC,EAAyB,MAAM,KAAKP,EAAS;EAClD,GACA,KAAKQ,GAAoB,GACzB,KAAK,WAAY,iBAAiB,oBAAoB,KAAKA,GAAoB,CAAC;CAClF;CAEA,uBAAuB;EAErB,AADA,MAAM,qBAAqB,GAC3B,KAAKJ,GAAW,SAAQ,MAAYK,EAAS,WAAW,CAAC;CAC3D;CAEA,KAAsB;EAIpB,AAHA,KAAKC,GAAa,GAClBC,EAAmB,KAAK,OAAsB,IAAI,GAClDC,EAAyB,MAAM,KAAK,KAAK,iBAAiC,qBAAqB,CAAC,GAAG,IAAI,GACvGC,EAAsB,MAAM,KAAK,KAAK,MAAM,CAAC;CAC/C;CAEA,KAAe;EACb,AAAI,KAAK,UACP,KAAK,MAAM,OAAO;CAEtB;AACF;AA/EGnB,EAAA,CAAAoB,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAAjB,EAAA,WAAA,UAAA,KAAA,CAAA,GAOxCH,EAAA,CAAAoB,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAAjB,EAAA,WAAA,cAAA,KAAA,CAAA"}
+{"version":3,"file":"control-group2.js","names":["styles","_decorate","__decorate","control_group_default","ControlGroup","LitElement","inputQuery","#messages","useStyles","attachInternals","props","#observers","setupControlGroupStates","setupControlLayoutStates","setupControlStatusStates","#updateAssociations","observer","#assignLabel","associateAriaLabel","associateAriaDescribedBy","associateControlGroup","property"],"sources":["../../../src/forms/control-group/control-group.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 { associateAriaLabel, associateAriaDescribedBy, associateControlGroup } from '@nvidia-elements/core/internal';\nimport { attachInternals } from '@nvidia-elements/foundations/internal/a11y';\nimport { useStyles } from '@nvidia-elements/foundations/internal/styles';\nimport type { ControlMessage } from '../control-message/control-message.js';\nimport {\n  setupControlStatusStates,\n  setupControlGroupStates,\n  inputQuery,\n  type ControlStateCleanup\n} from '../utils/states.js';\nimport { setupControlLayoutStates } from '../utils/layout.js';\nimport styles from './control-group.css?inline';\n\n/**\n * @element nve-control-group\n * @description Groups many related form controls under a shared label and validation context for semantically linked inputs.\n * @documentation https://nvidia.github.io/elements/docs/elements/control/\n * @since 0.3.0\n * @entrypoint \\@nvidia-elements/core/forms\n * @slot - Control input elements\n * @cssprop --color\n * @cssprop --label-color\n * @cssprop --label-text-transform\n * @cssprop --label-font-weight\n * @cssprop --label-font-size\n * @aria https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals\n * @package true\n */\nexport class ControlGroup extends LitElement {\n  /** Set each slotted control + label + control message layout */\n  @property({ type: String, reflect: true }) layout:\n    | 'vertical'\n    | 'vertical-inline'\n    | 'horizontal'\n    | 'horizontal-inline';\n\n  /** Set the visual prominence of the control group */\n  @property({ type: String, reflect: true }) prominence: 'muted';\n\n  /** Returns the label associated with the control group. */\n  get label() {\n    return this.querySelector?.<HTMLLabelElement>('label');\n  }\n\n  /** Returns the input elements associated with the control group. */\n  get inputs() {\n    return this.querySelectorAll ? Array.from(this.querySelectorAll<HTMLInputElement>(inputQuery)) : [];\n  }\n\n  get #messages() {\n    return this.querySelectorAll ? Array.from(this.querySelectorAll<ControlMessage>('nve-control-message')) : [];\n  }\n\n  #observers: (MutationObserver | ResizeObserver | ControlStateCleanup)[] = [];\n\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-control-group',\n    version: '0.0.0'\n  };\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  render() {\n    return html`\n      <div internal-host class=\"${this.#messages.length ? '' : 'no-messages'} ${this.label ? '' : 'no-label'}\">\n        <slot name=\"label\"></slot>\n        <slot class=\"input-slot\"></slot>\n        <slot name=\"messages\"></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'group';\n  }\n\n  firstUpdated(props: PropertyValues<this>) {\n    super.firstUpdated(props);\n    this.#observers = [\n      setupControlGroupStates(this),\n      setupControlLayoutStates(this),\n      ...setupControlStatusStates(this, this.#messages)\n    ];\n    this.#updateAssociations();\n    this.shadowRoot!.addEventListener('slotchange', () => this.#updateAssociations());\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.#observers.forEach(observer => observer.disconnect());\n  }\n\n  #updateAssociations() {\n    this.#assignLabel();\n    associateAriaLabel(this.label as HTMLElement, this);\n    associateAriaDescribedBy(Array.from(this.querySelectorAll<ControlMessage>('nve-control-message')), this);\n    associateControlGroup(Array.from(this.inputs));\n  }\n\n  #assignLabel() {\n    if (this.label) {\n      this.label.slot = 'label';\n    }\n  }\n}\n"],"mappings":";;;;;;;;;;AAkCA,IAAaI,IAAb,cAAkCC,EAAW;CAY3C,IAAI,QAAQ;EACV,OAAO,KAAK,gBAAkC,OAAO;CACvD;CAGA,IAAI,SAAS;EACX,OAAO,KAAK,mBAAmB,MAAM,KAAK,KAAK,iBAAmCC,CAAU,CAAC,IAAI,CAAC;CACpG;CAEA,IAAIC,KAAY;EACd,OAAO,KAAK,mBAAmB,MAAM,KAAK,KAAK,iBAAiC,qBAAqB,CAAC,IAAI,CAAC;CAC7G;CAEA,KAA0E,CAAC;;EAE3D,KAAA,SAAAC,EAAU,CAACR,CAAM,CAAC;;;EAEP,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;CAKA,SAAS;EACP,OAAO,CAAI,6BACmB,KAAKO,GAAU,SAAS,KAAK,cAAc,GAAG,KAAK,QAAQ,KAAK,WAAW;CAM3G;CAEA,oBAAoB;EAGlB,AAFA,MAAM,kBAAkB,GACxBE,EAAgB,IAAI,GACpB,KAAK,WAAW,OAAO;CACzB;CAEA,aAAa,GAA6B;EAQxC,AAPA,MAAM,aAAaC,CAAK,GACxB,KAAKC,KAAa;GAChBC,EAAwB,IAAI;GAC5BC,EAAyB,IAAI;GAC7B,GAAGC,EAAyB,MAAM,KAAKP,EAAS;EAClD,GACA,KAAKQ,GAAoB,GACzB,KAAK,WAAY,iBAAiB,oBAAoB,KAAKA,GAAoB,CAAC;CAClF;CAEA,uBAAuB;EAErB,AADA,MAAM,qBAAqB,GAC3B,KAAKJ,GAAW,SAAQ,MAAYK,EAAS,WAAW,CAAC;CAC3D;CAEA,KAAsB;EAIpB,AAHA,KAAKC,GAAa,GAClBC,EAAmB,KAAK,OAAsB,IAAI,GAClDC,EAAyB,MAAM,KAAK,KAAK,iBAAiC,qBAAqB,CAAC,GAAG,IAAI,GACvGC,EAAsB,MAAM,KAAK,KAAK,MAAM,CAAC;CAC/C;CAEA,KAAe;EACb,AAAI,KAAK,UACP,KAAK,MAAM,OAAO;CAEtB;AACF;AA/EGnB,EAAA,CAAAoB,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAAjB,EAAA,WAAA,UAAA,KAAA,CAAA,GAOxCH,EAAA,CAAAoB,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAAjB,EAAA,WAAA,cAAA,KAAA,CAAA"}