@nvidia-elements/core 2.0.4 → 2.1.0

package/dist/gauge/gauge2.js

@@ -0,0 +1,106 @@
+import { I18nController as e } from "../internal/controllers/i18n.controller.js";
+import { attachInternals as t } from "../internal/utils/a11y.js";
+import { useStyles as n } from "../internal/styles/index.js";
+import r from "../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
+import i from "./gauge.js";
+import { LitElement as a, html as o } from "lit";
+import { property as s } from "lit/decorators/property.js";
+import { styleMap as c } from "lit/directives/style-map.js";
+//#region src/gauge/gauge.ts
+var l = 200, u = 100 / 110.93, d = {
+	default: {
+		center: 64,
+		path: "M 27.23 100.77 A 52 52 0 1 1 100.77 100.77",
+		radius: 52,
+		start: {
+			x: 27.23,
+			y: 100.77
+		},
+		startAngle: 135,
+		sweepAngle: 270,
+		surfaceHeight: 128,
+		viewBox: "8.53 8.53 110.93 95.7"
+	},
+	half: {
+		center: 64,
+		path: "M 12 64 A 52 52 0 0 1 116 64",
+		radius: 52,
+		start: {
+			x: 12,
+			y: 64
+		},
+		startAngle: 180,
+		sweepAngle: 180,
+		surfaceHeight: 64,
+		viewBox: "8.53 8.53 110.93 58.93"
+	}
+}, f = (e) => ({
+	"--_progress": e,
+	"--_dash-progress": `${e * u}cqw`,
+	"--_dash-gap": `${l * u}cqw`
+}), p = (e, t, n) => ({
+	[`--_${e}-angle`]: `${t}deg`,
+	[`--_${e}-origin`]: `${n.center}px ${n.center}px`,
+	[`--_${e}-start-angle`]: `${n.startAngle}deg`
+}), m = class extends a {
+	constructor(...t) {
+		super(...t), this.value = 0, this.max = 100, this.status = "neutral", this.thumb = "fill", this.#e = new e(this), this.i18n = this.#e.i18n;
+	}
+	static {
+		this.styles = n([i]);
+	}
+	static {
+		this.metadata = {
+			tag: "nve-gauge",
+			version: "2.1.0"
+		};
+	}
+	#e;
+	#t() {
+		let e = this.max, t = e !== void 0 && Number.isFinite(e) && e > 0 ? e : 100;
+		return {
+			value: Number.isFinite(this.value) ? Math.min(Math.max(this.value, 0), t) : 0,
+			max: t
+		};
+	}
+	render() {
+		let e = this.#r(), { value: t, max: n } = this.#t(), r = t / n * 100, i = this.#i(), a = this.#n(e, r), s = i === "fill", u = r > 0 && (i === "fill" || i === "dot");
+		return o`<div internal-host><svg viewBox="${e.viewBox}" role="presentation" aria-hidden="true"><defs><mask id="background-mask" maskUnits="userSpaceOnUse" x="0" y="0" width="128" height="${e.surfaceHeight}"><path pathLength="100" d="${e.path}" class="background"></path></mask><mask id="fill-mask" maskUnits="userSpaceOnUse" x="0" y="0" width="128" height="${e.surfaceHeight}"><path pathLength="100" d="${e.path}" class="gauge" ?empty="${r <= 0}" style="${c(f(r))}" stroke-dasharray="${`${r} ${l}`}"></path></mask></defs><foreignObject width="128" height="${e.surfaceHeight}" mask="url(#background-mask)"><div xmlns="http://www.w3.org/1999/xhtml" class="background-surface"></div></foreignObject><foreignObject class="fill-layer" width="128" height="${e.surfaceHeight}" mask="url(#fill-mask)" ?hidden="${!s}"><div xmlns="http://www.w3.org/1999/xhtml" class="fill-surface"></div></foreignObject><circle class="fill-dot-start" cx="${e.start.x}" cy="${e.start.y}" ?hidden="${!(s && r > 0)}"></circle><circle class="fill-dot-end" cx="${e.center + e.radius}" cy="${e.center}" ?hidden="${!u}" style="${c(p("dot", a, e))}"></circle><g class="needle" ?hidden="${i !== "needle"}" style="${c(p("needle", a, e))}"><line class="needle-line" x1="${e.center}" y1="${e.center}" x2="${e.center + 40}" y2="${e.center}"></line><circle class="needle-hub" cx="${e.center}" cy="${e.center}"></circle></g></svg><slot></slot></div>`;
+	}
+	connectedCallback() {
+		super.connectedCallback(), t(this), this._internals.role = "progressbar";
+	}
+	updated(e) {
+		super.updated(e);
+		let { value: t, max: n } = this.#t();
+		this._internals.ariaValueNow = `${t}`, this._internals.ariaValueMax = `${n}`;
+		let { status: r } = this, i = r !== void 0 && r !== "neutral" && r !== "accent" ? this.i18n[r] : void 0;
+		this._internals.ariaLabel = i ?? this.i18n.information ?? null;
+	}
+	#n(e, t) {
+		return e.startAngle + e.sweepAngle * (t / 100);
+	}
+	#r() {
+		return this.shape === "half" ? d.half : d.default;
+	}
+	#i() {
+		return this.thumb === "dot" || this.thumb === "needle" ? this.thumb : "fill";
+	}
+};
+r([s({ type: Number })], m.prototype, "value", void 0), r([s({ type: Number })], m.prototype, "max", void 0), r([s({
+	type: String,
+	reflect: !0
+})], m.prototype, "status", void 0), r([s({
+	type: String,
+	reflect: !0
+})], m.prototype, "shape", void 0), r([s({
+	type: String,
+	reflect: !0
+})], m.prototype, "thumb", void 0), r([s({
+	type: String,
+	reflect: !0
+})], m.prototype, "size", void 0), r([s({ type: Object })], m.prototype, "i18n", void 0);
+//#endregion
+export { m as Gauge };
+
+//# sourceMappingURL=gauge2.js.map

package/dist/gauge/gauge2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"gauge2.js","names":["#i18nController","#geometry","#normalizedValues","#normalizedThumb","#angleAtProgress"],"sources":["../../src/gauge/gauge.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 { styleMap } from 'lit/directives/style-map.js';\nimport type { Size, SupportStatus } from '@nvidia-elements/core/internal';\nimport { attachInternals, I18nController, useStyles } from '@nvidia-elements/core/internal';\nimport styles from './gauge.css?inline';\n\nconst GAUGE_DASH_GAP = 200;\nconst GAUGE_DASH_SCALE = 100 / 110.93;\n\nconst GAUGE_GEOMETRY = {\n  default: {\n    center: 64,\n    path: 'M 27.23 100.77 A 52 52 0 1 1 100.77 100.77',\n    radius: 52,\n    start: { x: 27.23, y: 100.77 },\n    startAngle: 135,\n    sweepAngle: 270,\n    surfaceHeight: 128,\n    viewBox: '8.53 8.53 110.93 95.7'\n  },\n  half: {\n    center: 64,\n    path: 'M 12 64 A 52 52 0 0 1 116 64',\n    radius: 52,\n    start: { x: 12, y: 64 },\n    startAngle: 180,\n    sweepAngle: 180,\n    surfaceHeight: 64,\n    viewBox: '8.53 8.53 110.93 58.93'\n  }\n} as const;\n\ntype GaugeGeometry = (typeof GAUGE_GEOMETRY)[keyof typeof GAUGE_GEOMETRY];\n\nconst fillMaskStyle = (progress: number) => ({\n  '--_progress': progress,\n  '--_dash-progress': `${progress * GAUGE_DASH_SCALE}cqw`,\n  '--_dash-gap': `${GAUGE_DASH_GAP * GAUGE_DASH_SCALE}cqw`\n});\n\nconst thumbStyle = (thumb: 'dot' | 'needle', progressAngle: number, geometry: GaugeGeometry) => ({\n  [`--_${thumb}-angle`]: `${progressAngle}deg`,\n  [`--_${thumb}-origin`]: `${geometry.center}px ${geometry.center}px`,\n  [`--_${thumb}-start-angle`]: `${geometry.startAngle}deg`\n});\n\n/**\n * @element nve-gauge\n * @description Use a gauge to show system resource usage.\n * @since 2.0.4\n * @entrypoint \\@nvidia-elements/core/gauge\n * @slot - Content to display in the gauge center.\n * @cssprop --track-width\n * @cssprop --accent-color\n * @cssprop --background\n * @cssprop --needle-background\n * @cssprop --track-background\n * @cssprop --thumb-background\n * @cssprop --color\n * @cssprop --width\n * @cssprop --height\n * @cssprop --font-size\n * @cssprop --gap\n * @aria https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/progressbar_role\n * @stable false\n */\nexport class Gauge extends LitElement {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-gauge',\n    version: '0.0.0'\n  };\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  /** The current `value` of the gauge. */\n  @property({ type: Number }) value = 0;\n\n  /** The `max` value of the gauge that the `value` is proportionally scaled to. */\n  @property({ type: Number }) max? = 100;\n\n  /** Four visual treatments represent the `status` of tasks. */\n  @property({ type: String, reflect: true }) status?: SupportStatus | 'neutral' = 'neutral';\n\n  /** Determines the gauge shape. Set `half` for a compact semi-circular arc. */\n  @property({ type: String, reflect: true }) shape?: 'half';\n\n  /** Controls the value indicator. Set `dot` for only the end dot or `needle` for a pointer. */\n  @property({ type: String, reflect: true }) thumb: 'fill' | 'dot' | 'needle' = 'fill';\n\n  /** T-shirt `size` of the gauge. */\n  @property({ type: String, reflect: true }) size?: Size;\n\n  #i18nController: I18nController<this> = new I18nController<this>(this);\n\n  /** Enables updating internal string values for internationalization. */\n  @property({ type: Object }) i18n = this.#i18nController.i18n;\n\n  #normalizedValues() {\n    const sourceMax = this.max;\n    const max = sourceMax !== undefined && Number.isFinite(sourceMax) && sourceMax > 0 ? sourceMax : 100;\n    const value = Number.isFinite(this.value) ? Math.min(Math.max(this.value, 0), max) : 0;\n    return { value, max };\n  }\n\n  render() {\n    const geometry = this.#geometry();\n    const { value, max } = this.#normalizedValues();\n    const progress = (value / max) * 100;\n    const thumb = this.#normalizedThumb();\n    const progressAngle = this.#angleAtProgress(geometry, progress);\n    const showFill = thumb === 'fill';\n    const showDot = progress > 0 && (thumb === 'fill' || thumb === 'dot');\n\n    return html`\n      <div internal-host>\n        <svg viewBox=${geometry.viewBox} role=\"presentation\" aria-hidden=\"true\">\n          <defs>\n            <mask id=\"background-mask\" maskUnits=\"userSpaceOnUse\" x=\"0\" y=\"0\" width=\"128\" height=${geometry.surfaceHeight}>\n              <path pathLength=\"100\" d=${geometry.path} class=\"background\"></path>\n            </mask>\n            <mask id=\"fill-mask\" maskUnits=\"userSpaceOnUse\" x=\"0\" y=\"0\" width=\"128\" height=${geometry.surfaceHeight}>\n              <path pathLength=\"100\" d=${geometry.path} class=\"gauge\"\n                ?empty=${progress <= 0}\n                style=${styleMap(fillMaskStyle(progress))}\n                stroke-dasharray=${`${progress} ${GAUGE_DASH_GAP}`}>\n              </path>\n            </mask>\n          </defs>\n          <foreignObject width=\"128\" height=${geometry.surfaceHeight} mask=\"url(#background-mask)\">\n            <div xmlns=\"http://www.w3.org/1999/xhtml\" class=\"background-surface\"></div>\n          </foreignObject>\n          <foreignObject class=\"fill-layer\" width=\"128\" height=${geometry.surfaceHeight} mask=\"url(#fill-mask)\" ?hidden=${!showFill}>\n            <div xmlns=\"http://www.w3.org/1999/xhtml\" class=\"fill-surface\"></div>\n          </foreignObject>\n          <circle class=\"fill-dot-start\" cx=${geometry.start.x} cy=${geometry.start.y} ?hidden=${!(showFill && progress > 0)}></circle>\n          <circle class=\"fill-dot-end\" cx=${geometry.center + geometry.radius} cy=${geometry.center}\n            ?hidden=${!showDot}\n            style=${styleMap(thumbStyle('dot', progressAngle, geometry))}>\n          </circle>\n          <g class=\"needle\"\n            ?hidden=${thumb !== 'needle'}\n            style=${styleMap(thumbStyle('needle', progressAngle, geometry))}>\n            <line class=\"needle-line\" x1=${geometry.center} y1=${geometry.center} x2=${geometry.center + 40} y2=${geometry.center}></line>\n            <circle class=\"needle-hub\" cx=${geometry.center} cy=${geometry.center}></circle>\n          </g>\n        </svg>\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'progressbar';\n  }\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n    const { value, max } = this.#normalizedValues();\n    this._internals.ariaValueNow = `${value}`;\n    this._internals.ariaValueMax = `${max}`;\n    const { status } = this;\n    const statusLabel =\n      status !== undefined && status !== 'neutral' && status !== 'accent' ? this.i18n[status] : undefined;\n    this._internals.ariaLabel = statusLabel ?? this.i18n.information ?? null;\n  }\n\n  #angleAtProgress(geometry: GaugeGeometry, progress: number) {\n    return geometry.startAngle + geometry.sweepAngle * (progress / 100);\n  }\n\n  #geometry() {\n    return this.shape === 'half' ? GAUGE_GEOMETRY.half : GAUGE_GEOMETRY.default;\n  }\n\n  #normalizedThumb() {\n    return this.thumb === 'dot' || this.thumb === 'needle' ? this.thumb : 'fill';\n  }\n}\n"],"mappings":"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"}

package/dist/gauge/index.d.ts

@@ -0,0 +1 @@
+export * from './gauge.js';

package/dist/gauge/index.js

@@ -0,0 +1,2 @@
+import { Gauge as e } from "./gauge2.js";
+export { e as Gauge };

package/dist/grid/cell/cell.d.ts

@@ -19,13 +19,13 @@ import { LitElement } from 'lit';
  * @aria https://www.w3.org/WAI/ARIA/apg/patterns/grid/
  */
 export declare class GridCell extends LitElement {
-    static styles: import('lit').CSSResult[];
+    static styles: import("lit").CSSResult[];
     static readonly metadata: {
         tag: string;
         version: string;
     };
     /** @private */
     _internals: ElementInternals;
-    render(): import('lit').TemplateResult<1>;
+    render(): import("lit").TemplateResult<1>;
     connectedCallback(): void;
 }

package/dist/grid/cell/cell2.js

@@ -10,7 +10,7 @@ var a = class extends r {
 	static {
 		this.metadata = {
 			tag: "nve-grid-cell",
-			version: "2.0.4"
+			version: "2.1.0"
 		};
 	}
 	render() {

package/dist/grid/column/column.d.ts

@@ -1,4 +1,5 @@
-import { PropertyValues, LitElement } from 'lit';
+import type { PropertyValues } from 'lit';
+import { LitElement } from 'lit';
 /**
  * @element nve-grid-column
  * @description Defines a column header within a grid, specifying the column's label, width, and alignment for all cells beneath it.
@@ -39,14 +40,14 @@ export declare class GridColumn extends LitElement {
      * @private
      */
     ariaColIndex: string;
-    static styles: import('lit').CSSResult[];
+    static styles: import("lit").CSSResult[];
     static readonly metadata: {
         tag: string;
         version: string;
     };
     /** @private */
     _internals: ElementInternals;
-    render(): import('lit').TemplateResult<1>;
+    render(): import("lit").TemplateResult<1>;
     connectedCallback(): void;
     disconnectedCallback(): void;
     willUpdate(props: PropertyValues<this>): void;

package/dist/grid/column/column2.js

@@ -1,7 +1,7 @@
 import { appendRootNodeStyle as e } from "../../internal/utils/dom.js";
 import { attachInternals as t } from "../../internal/utils/a11y.js";
 import { useStyles as n } from "../../internal/styles/index.js";
-import { __decorate as r } from "../../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorate.js";
+import r from "../../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
 import i from "./column.js";
 import { LitElement as a, html as o } from "lit";
 import { property as s } from "lit/decorators/property.js";
@@ -13,7 +13,7 @@ var c = class r extends a {
 	static {
 		this.metadata = {
 			tag: "nve-grid-column",
-			version: "2.0.4"
+			version: "2.1.0"
 		};
 	}
 	get #e() {

package/dist/grid/column/column2.js.map

@@ -1 +1 @@
-{"version":3,"file":"column2.js","names":["#grid","#onSort","#computeColumnAlignment","#computeColumnPositions","#positionStylesheet","#buildFixedStyles","#buildBorderStyle"],"sources":["../../../src/grid/column/column.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 { useStyles, attachInternals, appendRootNodeStyle } from '@nvidia-elements/core/internal';\nimport type { Grid } from '@nvidia-elements/core/grid';\nimport styles from './column.css?inline';\n\n/**\n * @element nve-grid-column\n * @description Defines a column header within a grid, specifying the column's label, width, and alignment for all cells beneath it.\n * @since 0.11.0\n * @entrypoint \\@nvidia-elements/core/grid\n * @slot - default slot for content\n * @slot actions - slot for column actions\n * @cssprop --color\n * @cssprop --padding\n * @cssprop --font-weight\n * @cssprop --font-size\n * @cssprop --height\n * @cssprop --min-width\n * @cssprop --justify-content\n * @cssprop --border-left\n * @cssprop --border-right\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/grid/\n */\nexport class GridColumn extends LitElement {\n  /**\n   * Only set a fixed px width when you know the grid width. Most cases this should remain unset.\n   * If the total width of all columns is less than the grid width then the last column fills the remaining space.\n   * By default column widths are evenly divided unless width is explicitly provided.\n   */\n  @property({ type: String, reflect: true }) width: string;\n\n  /**\n   * Set the `position` property or attribute to `fixed` or `sticky` to make the column fixed or sticky.\n   * Fixed columns do not scroll horizontally with the grid. Sticky columns scroll horizontally with the grid\n   * until the column reaches the edge of the grid.\n   */\n  @property({ type: String, reflect: true }) position: 'fixed' | 'sticky' | '';\n\n  /**\n   * Control the content alignment within a given column.\n   */\n  @property({ type: String, reflect: true, attribute: 'column-align' }) columnAlign: 'start' | 'center' | 'end';\n\n  /**\n   * @private\n   */\n  @property({ type: String, reflect: true, attribute: 'aria-colindex' }) ariaColIndex: string; // eslint-disable-line local/reserved-property-names\n\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-grid-column',\n    version: '0.0.0'\n  };\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  get #grid() {\n    return this.parentElement!.parentElement as Grid;\n  }\n\n  render() {\n    return html`\n      <div internal-host focusable=\"active\">\n        <slot></slot>\n        <slot name=\"actions\"></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'columnheader';\n    this.addEventListener('sort', this.#onSort);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('sort', this.#onSort);\n  }\n\n  #onSort = (e: Event) => {\n    this.ariaSort = (e as CustomEvent<{ next: string }>).detail.next;\n  };\n\n  willUpdate(props: PropertyValues<this>) {\n    if (props.has('width') && this.width && Number.isFinite(Number(this.width))) {\n      this.width = `${this.width}px`; // eslint-disable-line local/stateless-property\n    }\n  }\n\n  async updated(props: PropertyValues<this>) {\n    super.updated(props);\n\n    if (props.get('columnAlign') !== this.columnAlign) {\n      this.#computeColumnAlignment();\n    }\n\n    if (props.get('position') !== this.position) {\n      this.#computeColumnPositions();\n    }\n\n    if (props.get('ariaColIndex') !== this.ariaColIndex) {\n      this.#computeColumnPositions();\n      this.#computeColumnAlignment();\n    }\n\n    if (props.get('width') !== this.width) {\n      this.dispatchEvent(new CustomEvent('nve-grid-column-resize', { bubbles: true, composed: true }));\n    }\n  }\n\n  #positionStylesheet: CSSStyleSheet;\n\n  #computeColumnPositions() {\n    if (this.position !== 'fixed') {\n      this.removeAttribute('left');\n      this.removeAttribute('right');\n      this.#positionStylesheet?.replaceSync('');\n      return;\n    }\n\n    const { side, positionStyle, borderStyle } = this.#buildFixedStyles();\n    const combinedStyle = `${positionStyle}\\n${borderStyle}`;\n\n    if (this.#positionStylesheet) {\n      this.#positionStylesheet.replaceSync(combinedStyle);\n    } else {\n      this.#positionStylesheet = appendRootNodeStyle(this.#grid, combinedStyle);\n    }\n\n    this.setAttribute(side, '');\n  }\n\n  #buildFixedStyles() {\n    const columns = Array.from(this.parentElement!.querySelectorAll<GridColumn>(GridColumn.metadata.tag));\n    const rightColumns = columns.slice(columns.indexOf(this) + 1, columns.length);\n    const position = this.getBoundingClientRect();\n    const gridPosition = this.#grid.getBoundingClientRect();\n    const side = this.offsetLeft < gridPosition.width / 2 ? 'left' : 'right';\n    const leftStyle = position.left - gridPosition.left;\n    const rightStyle = rightColumns.reduce((width, c) => width + c.getBoundingClientRect().width, 0);\n    const selector = `[id='${this.#grid.id}'] nve-grid-column:nth-of-type(${this.ariaColIndex}),\n        [id='${this.#grid.id}'] nve-grid-cell:nth-of-type(${this.ariaColIndex})`;\n\n    const positionStyle = `\n        ${selector} {\n          position: sticky;\n          z-index: 99;\n          ${side === 'left' ? `left: ${leftStyle}px;` : `right: ${rightStyle}px;`}\n        }\n      `;\n\n    const borderStyle = this.#buildBorderStyle(selector, side);\n    return { side, positionStyle, borderStyle };\n  }\n\n  #buildBorderStyle(selector: string, side: 'left' | 'right') {\n    const isLastLeft = side === 'left' && (this.nextElementSibling as GridColumn)?.position !== this.position;\n    const isLastRight = side === 'right' && (this.previousElementSibling as GridColumn)?.position !== this.position;\n\n    if (!isLastLeft && !isLastRight) {\n      return '';\n    }\n\n    return `\n        ${selector} {\n          box-shadow: var(--scroll-shadow);\n          clip-path: inset(0px ${isLastLeft ? '-4px' : '0'} 0px ${isLastRight ? '-4px' : '0'});\n          --border-${side === 'right' ? 'left' : 'right'}: var(--nve-ref-border-width-sm) solid var(--nve-ref-border-color-muted);\n        }\n      `;\n  }\n\n  #computeColumnAlignment() {\n    if (this.columnAlign !== undefined) {\n      appendRootNodeStyle(\n        this.#grid,\n        `[id='${this.#grid.id}'] nve-grid-column:nth-of-type(${this.ariaColIndex}),\n        [id='${this.#grid.id}'] nve-grid-cell:nth-of-type(${this.ariaColIndex}) {\n          --justify-content: ${this.columnAlign}\n        }`\n      );\n    }\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"column2.js","names":["#grid","#onSort","#computeColumnAlignment","#computeColumnPositions","#positionStylesheet","#buildFixedStyles","#buildBorderStyle"],"sources":["../../../src/grid/column/column.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 { useStyles, attachInternals, appendRootNodeStyle } from '@nvidia-elements/core/internal';\nimport type { Grid } from '@nvidia-elements/core/grid';\nimport styles from './column.css?inline';\n\n/**\n * @element nve-grid-column\n * @description Defines a column header within a grid, specifying the column's label, width, and alignment for all cells beneath it.\n * @since 0.11.0\n * @entrypoint \\@nvidia-elements/core/grid\n * @slot - default slot for content\n * @slot actions - slot for column actions\n * @cssprop --color\n * @cssprop --padding\n * @cssprop --font-weight\n * @cssprop --font-size\n * @cssprop --height\n * @cssprop --min-width\n * @cssprop --justify-content\n * @cssprop --border-left\n * @cssprop --border-right\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/grid/\n */\nexport class GridColumn extends LitElement {\n  /**\n   * Only set a fixed px width when you know the grid width. Most cases this should remain unset.\n   * If the total width of all columns is less than the grid width then the last column fills the remaining space.\n   * By default column widths are evenly divided unless width is explicitly provided.\n   */\n  @property({ type: String, reflect: true }) width: string;\n\n  /**\n   * Set the `position` property or attribute to `fixed` or `sticky` to make the column fixed or sticky.\n   * Fixed columns do not scroll horizontally with the grid. Sticky columns scroll horizontally with the grid\n   * until the column reaches the edge of the grid.\n   */\n  @property({ type: String, reflect: true }) position: 'fixed' | 'sticky' | '';\n\n  /**\n   * Control the content alignment within a given column.\n   */\n  @property({ type: String, reflect: true, attribute: 'column-align' }) columnAlign: 'start' | 'center' | 'end';\n\n  /**\n   * @private\n   */\n  @property({ type: String, reflect: true, attribute: 'aria-colindex' }) ariaColIndex: string; // eslint-disable-line local/reserved-property-names\n\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-grid-column',\n    version: '0.0.0'\n  };\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  get #grid() {\n    return this.parentElement!.parentElement as Grid;\n  }\n\n  render() {\n    return html`\n      <div internal-host focusable=\"active\">\n        <slot></slot>\n        <slot name=\"actions\"></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'columnheader';\n    this.addEventListener('sort', this.#onSort);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('sort', this.#onSort);\n  }\n\n  #onSort = (e: Event) => {\n    this.ariaSort = (e as CustomEvent<{ next: string }>).detail.next;\n  };\n\n  willUpdate(props: PropertyValues<this>) {\n    if (props.has('width') && this.width && Number.isFinite(Number(this.width))) {\n      this.width = `${this.width}px`; // eslint-disable-line local/stateless-property\n    }\n  }\n\n  async updated(props: PropertyValues<this>) {\n    super.updated(props);\n\n    if (props.get('columnAlign') !== this.columnAlign) {\n      this.#computeColumnAlignment();\n    }\n\n    if (props.get('position') !== this.position) {\n      this.#computeColumnPositions();\n    }\n\n    if (props.get('ariaColIndex') !== this.ariaColIndex) {\n      this.#computeColumnPositions();\n      this.#computeColumnAlignment();\n    }\n\n    if (props.get('width') !== this.width) {\n      this.dispatchEvent(new CustomEvent('nve-grid-column-resize', { bubbles: true, composed: true }));\n    }\n  }\n\n  #positionStylesheet: CSSStyleSheet;\n\n  #computeColumnPositions() {\n    if (this.position !== 'fixed') {\n      this.removeAttribute('left');\n      this.removeAttribute('right');\n      this.#positionStylesheet?.replaceSync('');\n      return;\n    }\n\n    const { side, positionStyle, borderStyle } = this.#buildFixedStyles();\n    const combinedStyle = `${positionStyle}\\n${borderStyle}`;\n\n    if (this.#positionStylesheet) {\n      this.#positionStylesheet.replaceSync(combinedStyle);\n    } else {\n      this.#positionStylesheet = appendRootNodeStyle(this.#grid, combinedStyle);\n    }\n\n    this.setAttribute(side, '');\n  }\n\n  #buildFixedStyles() {\n    const columns = Array.from(this.parentElement!.querySelectorAll<GridColumn>(GridColumn.metadata.tag));\n    const rightColumns = columns.slice(columns.indexOf(this) + 1, columns.length);\n    const position = this.getBoundingClientRect();\n    const gridPosition = this.#grid.getBoundingClientRect();\n    const side = this.offsetLeft < gridPosition.width / 2 ? 'left' : 'right';\n    const leftStyle = position.left - gridPosition.left;\n    const rightStyle = rightColumns.reduce((width, c) => width + c.getBoundingClientRect().width, 0);\n    const selector = `[id='${this.#grid.id}'] nve-grid-column:nth-of-type(${this.ariaColIndex}),\n        [id='${this.#grid.id}'] nve-grid-cell:nth-of-type(${this.ariaColIndex})`;\n\n    const positionStyle = `\n        ${selector} {\n          position: sticky;\n          z-index: 99;\n          ${side === 'left' ? `left: ${leftStyle}px;` : `right: ${rightStyle}px;`}\n        }\n      `;\n\n    const borderStyle = this.#buildBorderStyle(selector, side);\n    return { side, positionStyle, borderStyle };\n  }\n\n  #buildBorderStyle(selector: string, side: 'left' | 'right') {\n    const isLastLeft = side === 'left' && (this.nextElementSibling as GridColumn)?.position !== this.position;\n    const isLastRight = side === 'right' && (this.previousElementSibling as GridColumn)?.position !== this.position;\n\n    if (!isLastLeft && !isLastRight) {\n      return '';\n    }\n\n    return `\n        ${selector} {\n          box-shadow: var(--scroll-shadow);\n          clip-path: inset(0px ${isLastLeft ? '-4px' : '0'} 0px ${isLastRight ? '-4px' : '0'});\n          --border-${side === 'right' ? 'left' : 'right'}: var(--nve-ref-border-width-sm) solid var(--nve-ref-border-color-muted);\n        }\n      `;\n  }\n\n  #computeColumnAlignment() {\n    if (this.columnAlign !== undefined) {\n      appendRootNodeStyle(\n        this.#grid,\n        `[id='${this.#grid.id}'] nve-grid-column:nth-of-type(${this.ariaColIndex}),\n        [id='${this.#grid.id}'] nve-grid-cell:nth-of-type(${this.ariaColIndex}) {\n          --justify-content: ${this.columnAlign}\n        }`\n      );\n    }\n  }\n}\n"],"mappings":"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"}

package/dist/grid/define.d.ts

@@ -1,4 +1,4 @@
-import { Grid, GridColumn, GridRow, GridCell, GridFooter, GridHeader, GridPlaceholder } from '.';
+import { Grid, GridColumn, GridRow, GridCell, GridFooter, GridHeader, GridPlaceholder } from '@nvidia-elements/core/grid';
 declare global {
     interface HTMLElementTagNameMap {
         'nve-grid': Grid;

package/dist/grid/footer/footer.d.ts

@@ -12,7 +12,7 @@ import { LitElement } from 'lit';
  * @aria https://www.w3.org/WAI/ARIA/apg/patterns/grid/
  */
 export declare class GridFooter extends LitElement {
-    static styles: import('lit').CSSResult[];
+    static styles: import("lit").CSSResult[];
     static readonly metadata: {
         tag: string;
         version: string;
@@ -21,6 +21,6 @@ export declare class GridFooter extends LitElement {
     /** @private */
     _internals: ElementInternals;
     slot: string;
-    render(): import('lit').TemplateResult<1>;
+    render(): import("lit").TemplateResult<1>;
     connectedCallback(): void;
 }

package/dist/grid/footer/footer2.js

@@ -1,7 +1,7 @@
 import { attachInternals as e } from "../../internal/utils/a11y.js";
 import { hostAttr as t } from "../../internal/decorators/host-attr.js";
 import { useStyles as n } from "../../internal/styles/index.js";
-import { __decorate as r } from "../../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorate.js";
+import r from "../../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
 import i from "./footer.js";
 import { LitElement as a, html as o } from "lit";
 //#region src/grid/footer/footer.ts
@@ -15,7 +15,7 @@ var s = class extends a {
 	static {
 		this.metadata = {
 			tag: "nve-grid-footer",
-			version: "2.0.4"
+			version: "2.1.0"
 		};
 	}
 	static {

package/dist/grid/grid.d.ts

@@ -1,5 +1,6 @@
 import { LitElement } from 'lit';
-import { ContainerElement, StateScrollConfig } from '../internal';
+import type { ContainerElement } from '@nvidia-elements/core/internal';
+import { type StateScrollConfig } from '@nvidia-elements/core/internal';
 import { GridHeader } from './header/header.js';
 import { GridColumn } from './column/column.js';
 import { GridRow } from './row/row.js';
@@ -31,7 +32,7 @@ export declare class Grid extends LitElement implements ContainerElement {
      * Determine style variant stripe rows
      */
     stripe: boolean;
-    static styles: import('lit').CSSResult[];
+    static styles: import("lit").CSSResult[];
     static readonly metadata: {
         tag: string;
         version: string;
@@ -40,13 +41,13 @@ export declare class Grid extends LitElement implements ContainerElement {
     static elementDefinitions: {};
     get keynavGridConfig(): {
         columns: GridColumn[];
-        rows: (GridRow | GridHeader)[];
-        cells: (GridColumn | GridCell)[];
+        rows: (GridHeader | GridRow)[];
+        cells: (GridCell | GridColumn)[];
     };
     get stateScrollConfig(): StateScrollConfig;
     /** @private */
     _internals: ElementInternals;
-    render(): import('lit').TemplateResult<1>;
+    render(): import("lit").TemplateResult<1>;
     connectedCallback(): void;
     /**
      * Scroll to a specific position in the grid.

package/dist/grid/grid2.js

@@ -4,7 +4,7 @@ import { keyNavigationGrid as r } from "../internal/controllers/keynav-grid.cont
 import { attachInternals as i } from "../internal/utils/a11y.js";
 import { stateScroll as a } from "../internal/controllers/state-scroll.controller.js";
 import { useStyles as o } from "../internal/styles/index.js";
-import { __decorate as s } from "../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorate.js";
+import s from "../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
 import { GridPlaceholder as c } from "./placeholder/placeholder2.js";
 import { GridColumn as l } from "./column/column2.js";
 import { GridCell as u } from "./cell/cell2.js";
@@ -23,7 +23,7 @@ var y = class extends g {
 	static {
 		this.metadata = {
 			tag: "nve-grid",
-			version: "2.0.4",
+			version: "2.1.0",
 			children: [
 				d.metadata.tag,
 				f.metadata.tag,

package/dist/grid/grid2.js.map

@@ -1 +1 @@
-{"version":3,"file":"grid2.js","names":["#columns","#header","#rows","#cells"],"sources":["../../src/grid/grid.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 type { ContainerElement } from '@nvidia-elements/core/internal';\nimport {\n  keyNavigationGrid,\n  stateScroll,\n  type StateScrollConfig,\n  useStyles,\n  attachInternals,\n  appendRootNodeStyle,\n  generateId,\n  audit\n} from '@nvidia-elements/core/internal';\nimport { GridPlaceholder } from './placeholder/placeholder.js';\nimport { GridHeader } from './header/header.js';\nimport { GridColumn } from './column/column.js';\nimport { GridFooter } from './footer/footer.js';\nimport { GridRow } from './row/row.js';\nimport { GridCell } from './cell/cell.js';\nimport styles from './grid.css?inline';\nimport globalStyles from './grid.global.css?inline';\n\n/**\n * @element nve-grid\n * @description A versatile table/datagrid component with built-in keyboard navigation for displaying and interacting with structured data. Use it for anything from simple read-only tables to fully interactive, spreadsheet experiences.\n * @since 0.11.0\n * @entrypoint \\@nvidia-elements/core/grid\n * @slot - default slot for content\n * @slot footer - slot for grid-footer or toolbar\n * @cssprop --background\n * @cssprop --color\n * @cssprop --border-radius\n * @cssprop --box-shadow\n * @cssprop --font-size\n * @cssprop --row-height - fixed height of each row\n * @cssprop --scroll-height - height of the scrollable area\n\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/grid/\n */\n@audit()\n@stateScroll<Grid>()\n@keyNavigationGrid<Grid>()\nexport class Grid extends LitElement implements ContainerElement {\n  /**\n   * Determines the container styles of component. Flat nests the grid within other containers. Full spans the full edge-to-edge viewport width.\n   */\n  @property({ type: String, reflect: true }) container?: 'flat' | 'full';\n\n  /**\n   * Determine style variant stripe rows\n   */\n  @property({ type: Boolean, reflect: true }) stripe: boolean;\n\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-grid',\n    version: '0.0.0',\n    children: [GridRow.metadata.tag, GridHeader.metadata.tag, GridFooter.metadata.tag, GridPlaceholder.metadata.tag]\n  };\n\n  static elementDefinitions = {};\n\n  get keynavGridConfig() {\n    return {\n      columns: this.#columns,\n      rows: [this.#header!, ...this.#rows],\n      cells: [...this.#columns, ...this.#cells]\n    };\n  }\n\n  get stateScrollConfig(): StateScrollConfig {\n    return {\n      target: this.shadowRoot?.querySelector<HTMLElement>('[part=\"_scrollbox\"]') ?? undefined\n    };\n  }\n\n  get #rows() {\n    return Array.from(this.querySelectorAll<GridRow>(GridRow.metadata.tag));\n  }\n\n  get #header() {\n    return this.querySelector<GridHeader>(GridHeader.metadata.tag);\n  }\n\n  get #columns() {\n    return Array.from(this.querySelectorAll<GridColumn>(GridColumn.metadata.tag));\n  }\n\n  get #cells() {\n    return Array.from(this.querySelectorAll<GridCell>(GridCell.metadata.tag));\n  }\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  render() {\n    return html`\n      <div internal-host>\n        <div part=\"_scrollbox\">\n          <slot></slot>\n        </div>\n        <slot name=\"footer\"></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'grid';\n    this.id ||= generateId();\n    appendRootNodeStyle(this, globalStyles);\n  }\n\n  /**\n   * Scroll to a specific position in the grid.\n   */\n  scrollTo(options?: ScrollToOptions): Promise<void>;\n  scrollTo(x: number, y: number): Promise<void>;\n  async scrollTo(...args: [options?: ScrollToOptions] | [x: number, y: number]): Promise<void> {\n    await this.shadowRoot!.querySelector('[part=\"_scrollbox\"]')?.scrollTo(...(args as [ScrollToOptions]));\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AA6CO,IAAA,IAAA,cAAmB,EAAuC;;gBAW/C,EAAU,CAAC,CAAM,CAAC;;;kBAEP;GACzB,KAAK;GACL,SAAS;GACT,UAAU;IAAC,EAAQ,SAAS;IAAK,EAAW,SAAS;IAAK,EAAW,SAAS;IAAK,EAAgB,SAAS;GAAG;EACjH;;;4BAE4B,CAAC;;CAE7B,IAAI,mBAAmB;EACrB,OAAO;GACL,SAAS,KAAKA;GACd,MAAM,CAAC,KAAKC,IAAU,GAAG,KAAKC,EAAK;GACnC,OAAO,CAAC,GAAG,KAAKF,IAAU,GAAG,KAAKG,EAAM;EAC1C;CACF;CAEA,IAAI,oBAAuC;EACzC,OAAO,EACL,QAAQ,KAAK,YAAY,cAA2B,uBAAqB,KAAK,KAAA,EAChF;CACF;CAEA,IAAID,KAAQ;EACV,OAAO,MAAM,KAAK,KAAK,iBAA0B,EAAQ,SAAS,GAAG,CAAC;CACxE;CAEA,IAAID,KAAU;EACZ,OAAO,KAAK,cAA0B,EAAW,SAAS,GAAG;CAC/D;CAEA,IAAID,KAAW;EACb,OAAO,MAAM,KAAK,KAAK,iBAA6B,EAAW,SAAS,GAAG,CAAC;CAC9E;CAEA,IAAIG,KAAS;EACX,OAAO,MAAM,KAAK,KAAK,iBAA2B,EAAS,SAAS,GAAG,CAAC;CAC1E;CAKA,SAAS;EACP,OAAO,CAAI;CAQb;CAEA,oBAAoB;EAKlB,AAJA,MAAM,kBAAkB,GACxB,EAAgB,IAAI,GACpB,KAAK,WAAW,OAAO,QACvB,KAAK,OAAO,EAAW,GACvB,EAAoB,MAAM,CAAY;CACxC;CAOA,MAAM,SAAS,GAAG,GAA2E;EAC3F,MAAM,KAAK,WAAY,cAAc,uBAAqB,GAAG,SAAS,GAAI,CAA0B;CACtG;AACF;GA7EG,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,aAAA,KAAA,CAAA,MAKxC,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA;CAZ3C,EAAM;CACN,EAAkB;CAClB,EAAwB"}
+{"version":3,"file":"grid2.js","names":["#columns","#header","#rows","#cells"],"sources":["../../src/grid/grid.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 type { ContainerElement } from '@nvidia-elements/core/internal';\nimport {\n  keyNavigationGrid,\n  stateScroll,\n  type StateScrollConfig,\n  useStyles,\n  attachInternals,\n  appendRootNodeStyle,\n  generateId,\n  audit\n} from '@nvidia-elements/core/internal';\nimport { GridPlaceholder } from './placeholder/placeholder.js';\nimport { GridHeader } from './header/header.js';\nimport { GridColumn } from './column/column.js';\nimport { GridFooter } from './footer/footer.js';\nimport { GridRow } from './row/row.js';\nimport { GridCell } from './cell/cell.js';\nimport styles from './grid.css?inline';\nimport globalStyles from './grid.global.css?inline';\n\n/**\n * @element nve-grid\n * @description A versatile table/datagrid component with built-in keyboard navigation for displaying and interacting with structured data. Use it for anything from simple read-only tables to fully interactive, spreadsheet experiences.\n * @since 0.11.0\n * @entrypoint \\@nvidia-elements/core/grid\n * @slot - default slot for content\n * @slot footer - slot for grid-footer or toolbar\n * @cssprop --background\n * @cssprop --color\n * @cssprop --border-radius\n * @cssprop --box-shadow\n * @cssprop --font-size\n * @cssprop --row-height - fixed height of each row\n * @cssprop --scroll-height - height of the scrollable area\n\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/grid/\n */\n@audit()\n@stateScroll<Grid>()\n@keyNavigationGrid<Grid>()\nexport class Grid extends LitElement implements ContainerElement {\n  /**\n   * Determines the container styles of component. Flat nests the grid within other containers. Full spans the full edge-to-edge viewport width.\n   */\n  @property({ type: String, reflect: true }) container?: 'flat' | 'full';\n\n  /**\n   * Determine style variant stripe rows\n   */\n  @property({ type: Boolean, reflect: true }) stripe: boolean;\n\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-grid',\n    version: '0.0.0',\n    children: [GridRow.metadata.tag, GridHeader.metadata.tag, GridFooter.metadata.tag, GridPlaceholder.metadata.tag]\n  };\n\n  static elementDefinitions = {};\n\n  get keynavGridConfig() {\n    return {\n      columns: this.#columns,\n      rows: [this.#header!, ...this.#rows],\n      cells: [...this.#columns, ...this.#cells]\n    };\n  }\n\n  get stateScrollConfig(): StateScrollConfig {\n    return {\n      target: this.shadowRoot?.querySelector<HTMLElement>('[part=\"_scrollbox\"]') ?? undefined\n    };\n  }\n\n  get #rows() {\n    return Array.from(this.querySelectorAll<GridRow>(GridRow.metadata.tag));\n  }\n\n  get #header() {\n    return this.querySelector<GridHeader>(GridHeader.metadata.tag);\n  }\n\n  get #columns() {\n    return Array.from(this.querySelectorAll<GridColumn>(GridColumn.metadata.tag));\n  }\n\n  get #cells() {\n    return Array.from(this.querySelectorAll<GridCell>(GridCell.metadata.tag));\n  }\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  render() {\n    return html`\n      <div internal-host>\n        <div part=\"_scrollbox\">\n          <slot></slot>\n        </div>\n        <slot name=\"footer\"></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'grid';\n    this.id ||= generateId();\n    appendRootNodeStyle(this, globalStyles);\n  }\n\n  /**\n   * Scroll to a specific position in the grid.\n   */\n  scrollTo(options?: ScrollToOptions): Promise<void>;\n  scrollTo(x: number, y: number): Promise<void>;\n  async scrollTo(...args: [options?: ScrollToOptions] | [x: number, y: number]): Promise<void> {\n    await this.shadowRoot!.querySelector('[part=\"_scrollbox\"]')?.scrollTo(...(args as [ScrollToOptions]));\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AA6CO,IAAA,IAAA,cAAmB,EAAuC;;gBAW/C,EAAU,CAAC,CAAM,CAAC;;;kBAEP;GACzB,KAAK;GACL,SAAS;GACT,UAAU;IAAC,EAAQ,SAAS;IAAK,EAAW,SAAS;IAAK,EAAW,SAAS;IAAK,EAAgB,SAAS;GAAG;EACjH;;;4BAE4B,CAAC;;CAE7B,IAAI,mBAAmB;EACrB,OAAO;GACL,SAAS,KAAKA;GACd,MAAM,CAAC,KAAKC,IAAU,GAAG,KAAKC,EAAK;GACnC,OAAO,CAAC,GAAG,KAAKF,IAAU,GAAG,KAAKG,EAAM;EAC1C;CACF;CAEA,IAAI,oBAAuC;EACzC,OAAO,EACL,QAAQ,KAAK,YAAY,cAA2B,uBAAqB,KAAK,KAAA,EAChF;CACF;CAEA,IAAID,KAAQ;EACV,OAAO,MAAM,KAAK,KAAK,iBAA0B,EAAQ,SAAS,GAAG,CAAC;CACxE;CAEA,IAAID,KAAU;EACZ,OAAO,KAAK,cAA0B,EAAW,SAAS,GAAG;CAC/D;CAEA,IAAID,KAAW;EACb,OAAO,MAAM,KAAK,KAAK,iBAA6B,EAAW,SAAS,GAAG,CAAC;CAC9E;CAEA,IAAIG,KAAS;EACX,OAAO,MAAM,KAAK,KAAK,iBAA2B,EAAS,SAAS,GAAG,CAAC;CAC1E;CAKA,SAAS;EACP,OAAO,CAAI;CAQb;CAEA,oBAAoB;EAKlB,AAJA,MAAM,kBAAkB,GACxB,EAAgB,IAAI,GACpB,KAAK,WAAW,OAAO,QACvB,KAAK,OAAO,EAAW,GACvB,EAAoB,MAAM,CAAY;CACxC;CAOA,MAAM,SAAS,GAAG,GAA2E;EAC3F,MAAM,KAAK,WAAY,cAAc,uBAAqB,CAAC,EAAE,SAAS,GAAI,CAA0B;CACtG;AACF;GA7EG,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,aAAA,KAAA,CAAA,MAKxC,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA;CAZ3C,EAAM;CACN,EAAkB;CAClB,EAAwB"}

package/dist/grid/header/header.d.ts

@@ -1,4 +1,5 @@
-import { PropertyValues, LitElement } from 'lit';
+import type { PropertyValues } from 'lit';
+import { LitElement } from 'lit';
 import { GridColumn } from '../column/column.js';
 /**
  * @element nve-grid-header
@@ -13,7 +14,7 @@ import { GridColumn } from '../column/column.js';
  */
 export declare class GridHeader extends LitElement {
     #private;
-    static styles: import('lit').CSSResult[];
+    static styles: import("lit").CSSResult[];
     static readonly metadata: {
         tag: string;
         version: string;
@@ -23,7 +24,7 @@ export declare class GridHeader extends LitElement {
     _internals: ElementInternals;
     /** @private */
     columns: GridColumn[];
-    render(): import('lit').TemplateResult<1>;
+    render(): import("lit").TemplateResult<1>;
     connectedCallback(): void;
     disconnectedCallback(): void;
     firstUpdated(props: PropertyValues<this>): Promise<void>;

package/dist/grid/header/header2.js

@@ -4,7 +4,7 @@ import { debounce as n } from "../../internal/utils/events.js";
 import { LogService as r } from "../../internal/services/log.service.js";
 import { attachInternals as i } from "../../internal/utils/a11y.js";
 import { useStyles as a } from "../../internal/styles/index.js";
-import { __decorate as o } from "../../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorate.js";
+import o from "../../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
 import s from "./header.js";
 import { GridColumn as c } from "../column/column2.js";
 import { GridCell as l } from "../cell/cell2.js";
@@ -19,7 +19,7 @@ var m = class extends d {
 	static {
 		this.metadata = {
 			tag: "nve-grid-header",
-			version: "2.0.4",
+			version: "2.1.0",
 			children: [c.metadata.tag]
 		};
 	}

package/dist/grid/header/header2.js.map

@@ -1 +1 @@
-{"version":3,"file":"header2.js","names":["#grid","#computeColumnWidths","#onColumnResize","#resizeObserver","#validateColumns"],"sources":["../../../src/grid/header/header.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 { queryAssignedElements } from 'lit/decorators/query-assigned-elements.js';\nimport {\n  useStyles,\n  attachInternals,\n  debounce,\n  LogService,\n  audit,\n  GlobalStateService\n} from '@nvidia-elements/core/internal';\nimport styles from './header.css?inline';\nimport { GridColumn } from '../column/column.js';\nimport type { Grid } from '../grid.js';\nimport { GridRow } from '../row/row.js';\nimport { GridCell } from '../cell/cell.js';\n\n/**\n * @element nve-grid-header\n * @description Contains the column headers of a grid, managing column widths and providing structural context for the data rows below.\n * @since 0.11.0\n * @entrypoint \\@nvidia-elements/core/grid\n * @slot - default slot for `nve-grid-column`\n * @cssprop --background\n * @cssprop --border-bottom\n * @cssprop --padding\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/grid/\n */\n@audit()\nexport class GridHeader extends LitElement {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-grid-header',\n    version: '0.0.0',\n    children: [GridColumn.metadata.tag]\n  };\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  /** @private */\n  @queryAssignedElements({\n    selector: GridColumn.metadata.tag,\n    flatten: true\n  })\n  columns!: GridColumn[];\n\n  get #grid() {\n    return this.parentElement as Grid;\n  }\n\n  render() {\n    return html`\n      <div internal-host>\n        <slot @slotchange=${() => this.#computeColumnWidths()}></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'row';\n    this.addEventListener('nve-grid-column-resize', this.#onColumnResize);\n    this.#resizeObserver ??= new ResizeObserver(debounce(() => this.#computeColumnWidths(), 100));\n    this.#resizeObserver.observe(this);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('nve-grid-column-resize', this.#onColumnResize);\n    this.#resizeObserver?.disconnect();\n  }\n\n  #onColumnResize = () => {\n    void this.#computeColumnWidths();\n  };\n\n  #resizeObserver?: ResizeObserver;\n\n  async firstUpdated(props: PropertyValues<this>) {\n    super.firstUpdated(props);\n    await this.updateComplete;\n    this.#validateColumns();\n  }\n\n  async #computeColumnWidths() {\n    await this.updateComplete;\n    this.columns.forEach((c, i) => (c.ariaColIndex = `${i + 1}`));\n    this.#grid.style.setProperty('--grid-auto-flow', 'initial');\n    this.#grid.style.setProperty('--grid-template-column', this.columns.map((_, i) => `var(--c${i})`).join(' '));\n\n    // compute initial column width\n    this.columns.forEach((c, i) => this.#grid.style.setProperty(`--c${i}`, c.width ? c.width : `1fr`));\n\n    // compute column width based on content\n    await this.updateComplete;\n    const widths = this.columns.map(c => (c.width ? c.width : `minmax(auto, ${c.getBoundingClientRect().width}px)`));\n    widths.forEach((w, i) => this.#grid.style.setProperty(`--c${i}`, w));\n  }\n\n  #validateColumns() {\n    if (GlobalStateService.state.env !== 'production') {\n      const cells = this.#grid.querySelector(GridRow.metadata.tag)?.querySelectorAll(GridCell.metadata.tag);\n      if (this.columns && cells && this.columns.length !== cells.length) {\n        LogService.error(`grid-column (${this.columns.length}) and grid-cell (${cells.length}) count mismatch`);\n      }\n    }\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;AAgCO,IAAA,IAAA,cAAyB,EAAW;;gBACzB,EAAU,CAAC,CAAM,CAAC;;;kBAEP;GACzB,KAAK;GACL,SAAS;GACT,UAAU,CAAC,EAAW,SAAS,GAAG;EACpC;;CAYA,IAAIA,KAAQ;EACV,OAAO,KAAK;CACd;CAEA,SAAS;EACP,OAAO,CAAI,+CAEmB,KAAKC,GAAqB,EAAE;CAG5D;CAEA,oBAAoB;EAMlB,AALA,MAAM,kBAAkB,GACxB,EAAgB,IAAI,GACpB,KAAK,WAAW,OAAO,OACvB,KAAK,iBAAiB,0BAA0B,KAAKC,EAAe,GACpE,KAAKC,OAAoB,IAAI,eAAe,QAAe,KAAKF,GAAqB,GAAG,GAAG,CAAC,GAC5F,KAAKE,GAAgB,QAAQ,IAAI;CACnC;CAEA,uBAAuB;EAGrB,AAFA,MAAM,qBAAqB,GAC3B,KAAK,oBAAoB,0BAA0B,KAAKD,EAAe,GACvE,KAAKC,IAAiB,WAAW;CACnC;CAEA,WAAwB;EACtB,KAAUF,GAAqB;CACjC;CAEA;CAEA,MAAM,aAAa,GAA6B;EAG9C,AAFA,MAAM,aAAa,CAAK,GACxB,MAAM,KAAK,gBACX,KAAKG,GAAiB;CACxB;CAEA,MAAMH,KAAuB;EAY3B,AAXA,MAAM,KAAK,gBACX,KAAK,QAAQ,SAAS,GAAG,MAAO,EAAE,eAAe,GAAG,IAAI,GAAI,GAC5D,KAAKD,GAAM,MAAM,YAAY,oBAAoB,SAAS,GAC1D,KAAKA,GAAM,MAAM,YAAY,0BAA0B,KAAK,QAAQ,KAAK,GAAG,MAAM,UAAU,EAAE,EAAE,EAAE,KAAK,GAAG,CAAC,GAG3G,KAAK,QAAQ,SAAS,GAAG,MAAM,KAAKA,GAAM,MAAM,YAAY,MAAM,KAAK,EAAE,QAAQ,EAAE,QAAQ,KAAK,CAAC,GAGjG,MAAM,KAAK,gBAEX,KADoB,QAAQ,KAAI,MAAM,EAAE,QAAQ,EAAE,QAAQ,gBAAgB,EAAE,sBAAsB,EAAE,MAAM,IAC1G,EAAO,SAAS,GAAG,MAAM,KAAKA,GAAM,MAAM,YAAY,MAAM,KAAK,CAAC,CAAC;CACrE;CAEA,KAAmB;EACjB,IAAI,EAAmB,MAAM,QAAQ,cAAc;GACjD,IAAM,IAAQ,KAAKA,GAAM,cAAc,EAAQ,SAAS,GAAG,GAAG,iBAAiB,EAAS,SAAS,GAAG;GACpG,AAAI,KAAK,WAAW,KAAS,KAAK,QAAQ,WAAW,EAAM,UACzD,EAAW,MAAM,gBAAgB,KAAK,QAAQ,OAAO,mBAAmB,EAAM,OAAO,iBAAiB;EAE1G;CACF;AACF;GApEG,EAAsB;CACrB,UAAU,EAAW,SAAS;CAC9B,SAAS;AACX,CAAC,CAAA,GAAA,EAAA,WAAA,WAAA,KAAA,CAAA,UAjBF,EAAM,CAAA,GAAA,CAAA"}
+{"version":3,"file":"header2.js","names":["#grid","#computeColumnWidths","#onColumnResize","#resizeObserver","#validateColumns"],"sources":["../../../src/grid/header/header.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 { queryAssignedElements } from 'lit/decorators/query-assigned-elements.js';\nimport {\n  useStyles,\n  attachInternals,\n  debounce,\n  LogService,\n  audit,\n  GlobalStateService\n} from '@nvidia-elements/core/internal';\nimport styles from './header.css?inline';\nimport { GridColumn } from '../column/column.js';\nimport type { Grid } from '../grid.js';\nimport { GridRow } from '../row/row.js';\nimport { GridCell } from '../cell/cell.js';\n\n/**\n * @element nve-grid-header\n * @description Contains the column headers of a grid, managing column widths and providing structural context for the data rows below.\n * @since 0.11.0\n * @entrypoint \\@nvidia-elements/core/grid\n * @slot - default slot for `nve-grid-column`\n * @cssprop --background\n * @cssprop --border-bottom\n * @cssprop --padding\n * @aria https://www.w3.org/WAI/ARIA/apg/patterns/grid/\n */\n@audit()\nexport class GridHeader extends LitElement {\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-grid-header',\n    version: '0.0.0',\n    children: [GridColumn.metadata.tag]\n  };\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  /** @private */\n  @queryAssignedElements({\n    selector: GridColumn.metadata.tag,\n    flatten: true\n  })\n  columns!: GridColumn[];\n\n  get #grid() {\n    return this.parentElement as Grid;\n  }\n\n  render() {\n    return html`\n      <div internal-host>\n        <slot @slotchange=${() => this.#computeColumnWidths()}></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    this._internals.role = 'row';\n    this.addEventListener('nve-grid-column-resize', this.#onColumnResize);\n    this.#resizeObserver ??= new ResizeObserver(debounce(() => this.#computeColumnWidths(), 100));\n    this.#resizeObserver.observe(this);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('nve-grid-column-resize', this.#onColumnResize);\n    this.#resizeObserver?.disconnect();\n  }\n\n  #onColumnResize = () => {\n    void this.#computeColumnWidths();\n  };\n\n  #resizeObserver?: ResizeObserver;\n\n  async firstUpdated(props: PropertyValues<this>) {\n    super.firstUpdated(props);\n    await this.updateComplete;\n    this.#validateColumns();\n  }\n\n  async #computeColumnWidths() {\n    await this.updateComplete;\n    this.columns.forEach((c, i) => (c.ariaColIndex = `${i + 1}`));\n    this.#grid.style.setProperty('--grid-auto-flow', 'initial');\n    this.#grid.style.setProperty('--grid-template-column', this.columns.map((_, i) => `var(--c${i})`).join(' '));\n\n    // compute initial column width\n    this.columns.forEach((c, i) => this.#grid.style.setProperty(`--c${i}`, c.width ? c.width : `1fr`));\n\n    // compute column width based on content\n    await this.updateComplete;\n    const widths = this.columns.map(c => (c.width ? c.width : `minmax(auto, ${c.getBoundingClientRect().width}px)`));\n    widths.forEach((w, i) => this.#grid.style.setProperty(`--c${i}`, w));\n  }\n\n  #validateColumns() {\n    if (GlobalStateService.state.env !== 'production') {\n      const cells = this.#grid.querySelector(GridRow.metadata.tag)?.querySelectorAll(GridCell.metadata.tag);\n      if (this.columns && cells && this.columns.length !== cells.length) {\n        LogService.error(`grid-column (${this.columns.length}) and grid-cell (${cells.length}) count mismatch`);\n      }\n    }\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;AAgCO,IAAA,IAAA,cAAyB,EAAW;;gBACzB,EAAU,CAAC,CAAM,CAAC;;;kBAEP;GACzB,KAAK;GACL,SAAS;GACT,UAAU,CAAC,EAAW,SAAS,GAAG;EACpC;;CAYA,IAAIA,KAAQ;EACV,OAAO,KAAK;CACd;CAEA,SAAS;EACP,OAAO,CAAI,+CAEmB,KAAKC,GAAqB,EAAE;CAG5D;CAEA,oBAAoB;EAMlB,AALA,MAAM,kBAAkB,GACxB,EAAgB,IAAI,GACpB,KAAK,WAAW,OAAO,OACvB,KAAK,iBAAiB,0BAA0B,KAAKC,EAAe,GACpE,KAAKC,OAAoB,IAAI,eAAe,QAAe,KAAKF,GAAqB,GAAG,GAAG,CAAC,GAC5F,KAAKE,GAAgB,QAAQ,IAAI;CACnC;CAEA,uBAAuB;EAGrB,AAFA,MAAM,qBAAqB,GAC3B,KAAK,oBAAoB,0BAA0B,KAAKD,EAAe,GACvE,KAAKC,IAAiB,WAAW;CACnC;CAEA,WAAwB;EACtB,KAAUF,GAAqB;CACjC;CAEA;CAEA,MAAM,aAAa,GAA6B;EAG9C,AAFA,MAAM,aAAa,CAAK,GACxB,MAAM,KAAK,gBACX,KAAKG,GAAiB;CACxB;CAEA,MAAMH,KAAuB;EAY3B,AAXA,MAAM,KAAK,gBACX,KAAK,QAAQ,SAAS,GAAG,MAAO,EAAE,eAAe,GAAG,IAAI,GAAI,GAC5D,KAAKD,GAAM,MAAM,YAAY,oBAAoB,SAAS,GAC1D,KAAKA,GAAM,MAAM,YAAY,0BAA0B,KAAK,QAAQ,KAAK,GAAG,MAAM,UAAU,EAAE,EAAE,CAAC,CAAC,KAAK,GAAG,CAAC,GAG3G,KAAK,QAAQ,SAAS,GAAG,MAAM,KAAKA,GAAM,MAAM,YAAY,MAAM,KAAK,EAAE,QAAQ,EAAE,QAAQ,KAAK,CAAC,GAGjG,MAAM,KAAK,gBAEX,KADoB,QAAQ,KAAI,MAAM,EAAE,QAAQ,EAAE,QAAQ,gBAAgB,EAAE,sBAAsB,CAAC,CAAC,MAAM,IAC1G,CAAA,CAAO,SAAS,GAAG,MAAM,KAAKA,GAAM,MAAM,YAAY,MAAM,KAAK,CAAC,CAAC;CACrE;CAEA,KAAmB;EACjB,IAAI,EAAmB,MAAM,QAAQ,cAAc;GACjD,IAAM,IAAQ,KAAKA,GAAM,cAAc,EAAQ,SAAS,GAAG,CAAC,EAAE,iBAAiB,EAAS,SAAS,GAAG;GACpG,AAAI,KAAK,WAAW,KAAS,KAAK,QAAQ,WAAW,EAAM,UACzD,EAAW,MAAM,gBAAgB,KAAK,QAAQ,OAAO,mBAAmB,EAAM,OAAO,iBAAiB;EAE1G;CACF;AACF;GApEG,EAAsB;CACrB,UAAU,EAAW,SAAS;CAC9B,SAAS;AACX,CAAC,CAAA,GAAA,EAAA,WAAA,WAAA,KAAA,CAAA,UAjBF,EAAM,CAAA,GAAA,CAAA"}

package/dist/grid/placeholder/placeholder.d.ts

@@ -10,13 +10,13 @@ import { LitElement } from 'lit';
  * @aria https://www.w3.org/WAI/ARIA/apg/patterns/grid/
  */
 export declare class GridPlaceholder extends LitElement {
-    static styles: import('lit').CSSResult[];
+    static styles: import("lit").CSSResult[];
     static readonly metadata: {
         tag: string;
         version: string;
     };
     /** @private */
     _internals: ElementInternals;
-    render(): import('lit').TemplateResult<1>;
+    render(): import("lit").TemplateResult<1>;
     connectedCallback(): void;
 }

package/dist/grid/placeholder/placeholder2.js

@@ -10,7 +10,7 @@ var a = class extends r {
 	static {
 		this.metadata = {
 			tag: "nve-grid-placeholder",
-			version: "2.0.4"
+			version: "2.1.0"
 		};
 	}
 	render() {

package/dist/grid/row/row.d.ts

@@ -14,7 +14,7 @@ export declare class GridRow extends LitElement {
      * Setting the `selected` property or attribute to `true` shows the row in a selected state.
      */
     selected: boolean;
-    static styles: import('lit').CSSResult[];
+    static styles: import("lit").CSSResult[];
     static readonly metadata: {
         tag: string;
         version: string;
@@ -22,6 +22,6 @@ export declare class GridRow extends LitElement {
     };
     /** @private */
     _internals: ElementInternals;
-    render(): import('lit').TemplateResult<1>;
+    render(): import("lit").TemplateResult<1>;
     connectedCallback(): void;
 }

package/dist/grid/row/row2.js

@@ -2,7 +2,7 @@ import { audit as e } from "../../internal/controllers/audit.controller.js";
 import { attachInternals as t } from "../../internal/utils/a11y.js";
 import { stateSelected as n } from "../../internal/controllers/state-selected.controller.js";
 import { useStyles as r } from "../../internal/styles/index.js";
-import { __decorate as i } from "../../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorate.js";
+import i from "../../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
 import { GridCell as a } from "../cell/cell2.js";
 import o from "./row.js";
 import { LitElement as s, html as c } from "lit";
@@ -15,7 +15,7 @@ var u = class extends s {
 	static {
 		this.metadata = {
 			tag: "nve-grid-row",
-			version: "2.0.4",
+			version: "2.1.0",
 			children: [a.metadata.tag]
 		};
 	}

package/dist/icon/define.d.ts

@@ -1,4 +1,4 @@
-import { Icon } from '.';
+import { Icon } from '@nvidia-elements/core/icon';
 declare global {
     interface HTMLElementTagNameMap {
         'nve-icon': Icon;

package/dist/icon/icon.d.ts

@@ -1,6 +1,7 @@
-import { PropertyValues, LitElement } from 'lit';
-import { Size } from '../internal';
-import { IconName, IconSVG } from './icons.js';
+import type { PropertyValues } from 'lit';
+import { LitElement } from 'lit';
+import type { Size } from '@nvidia-elements/core/internal';
+import type { IconName, IconSVG } from './icons.js';
 export type { IconName, IconSVG } from './icons.js';
 declare global {
     var _NVE_SSR_ICON_REGISTRY: Record<string, string> | undefined;
@@ -35,7 +36,7 @@ export declare class Icon extends LitElement {
      */
     name?: IconName;
     private svg;
-    static styles: import('lit').CSSResult[];
+    static styles: import("lit").CSSResult[];
     static readonly metadata: {
         tag: string;
         version: string;
@@ -48,7 +49,7 @@ export declare class Icon extends LitElement {
     private static get registeredIcon();
     /** @private */
     _internals: ElementInternals;
-    render(): import('lit').TemplateResult<1>;
+    render(): import("lit").TemplateResult<1>;
     connectedCallback(): void;
     disconnectedCallback(): void;
     static add(icons: {

package/dist/icon/icon2.js

@@ -3,7 +3,7 @@ import { attachInternals as t } from "../internal/utils/a11y.js";
 import { useStyles as n } from "../internal/styles/index.js";
 import { ICON_IMPORTS as r } from "./icons.js";
 import i from "./icon.js";
-import { __decorate as a } from "../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorate.js";
+import a from "../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/decorate.js";
 import { LitElement as o, html as s, isServer as c } from "lit";
 import { property as l } from "lit/decorators/property.js";
 import { unsafeSVG as u } from "lit/directives/unsafe-svg.js";
@@ -16,7 +16,7 @@ var f = class e extends o {
 	static {
 		this.metadata = {
 			tag: "nve-icon",
-			version: "2.0.4"
+			version: "2.1.0"
 		};
 	}
 	static {
@@ -94,7 +94,7 @@ a([l({
 })], f.prototype, "name", void 0), a([d()], f.prototype, "svg", void 0);
 function p(t) {
 	if (typeof globalThis.customElements?.get == "function") {
-		let n = e(t.metadata.version), i = e("2.0.4");
+		let n = e(t.metadata.version), i = e("2.1.0");
 		n.minor <= i.minor && n.major <= i.major && (t._icons = {
 			...t._icons,
 			...r