@nvidia-elements/core 2.18.1 → 2.18.2

package/dist/button/button2.js

@@ -12,7 +12,7 @@ var s = class extends o(r) {
 	static {
 		this.metadata = {
 			tag: "nve-button",
-			version: "2.18.1"
+			version: "2.18.2"
 		};
 	}
 	render() {

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

@@ -7,7 +7,7 @@ import type { KeynavListConfig, Interaction, Size } from '@nvidia-elements/core/
  * @documentation https://nvidia.github.io/elements/docs/elements/button-group/
  * @since 0.16.0
  * @entrypoint \@nvidia-elements/core/button-group
- * @slot - default slot for `nve-button` or `nve-icon-button`
+ * @slot - default slot for `nve-button`, `nve-icon-button`, `nve-divider`, `nve-media-seek-button`, or `nve-media-pause-button`
  * @cssprop --background
  * @cssprop --border-radius
  * @cssprop --padding

package/dist/button-group/button-group2.js

@@ -26,11 +26,13 @@ var f = class extends c {
 	static {
 		this.metadata = {
 			tag: "nve-button-group",
-			version: "2.18.1",
+			version: "2.18.2",
 			children: [
 				"nve-button",
 				"nve-icon-button",
-				"nve-divider"
+				"nve-divider",
+				"nve-media-seek-button",
+				"nve-media-pause-button"
 			]
 		};
 	}

package/dist/button-group/button-group2.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-group2.js","names":[],"sources":["../../src/button-group/button-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 { queryAssignedElements } from 'lit/decorators/query-assigned-elements.js';\nimport type { KeynavListConfig, Interaction, Size } from '@nvidia-elements/core/internal';\nimport {\n  attachInternals,\n  keyNavigationList,\n  useStyles,\n  audit,\n  appendRootNodeStyle\n} from '@nvidia-elements/core/internal';\nimport type { IconButton } from '@nvidia-elements/core/icon-button';\nimport type { Button } from '@nvidia-elements/core/button';\nimport type { Divider } from '@nvidia-elements/core/divider';\nimport styles from './button-group.css?inline';\nimport globalStyles from './button-group.global.css?inline';\n\n/**\n * @element nve-button-group\n * @description A button group organizes related buttons and can support either mutually exclusive single or multi selection. Prefer usage within toolbars.\n * @documentation https://nvidia.github.io/elements/docs/elements/button-group/\n * @since 0.16.0\n * @entrypoint \\@nvidia-elements/core/button-group\n * @slot - default slot for `nve-button` or `nve-icon-button`\n * @cssprop --background\n * @cssprop --border-radius\n * @cssprop --padding\n * @cssprop --gap\n * @cssprop --width\n * @cssprop --height\n * @cssprop --color\n * @aria https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/group_role\n */\n@audit()\n@keyNavigationList<ButtonGroup>()\nexport class ButtonGroup extends LitElement {\n  /** @private */\n  get keynavListConfig(): KeynavListConfig {\n    return {\n      items: this.#buttons,\n      layout: this.orientation\n    };\n  }\n\n  /** By default the button group is stateless. Add the `behavior-select` attribute and set to `single` or `multi` to enable stateful selction handling. */\n  @property({ type: String, attribute: 'behavior-select' }) behaviorSelect: 'single' | 'multi';\n\n  /** Set the style of the button group using the `container` property. Options are the default display when omitting the attribute, `flat` or `rounded`. */\n  @property({ type: String, reflect: true }) container?: 'flat' | 'rounded';\n\n  /** Determines the orientation direction of the group. Vertical groups support icon buttons only. */\n  @property({ type: String, reflect: true }) orientation?: 'horizontal' | 'vertical' = 'horizontal';\n\n  /** Use the `interaction` property on `button-group` in combination with `divider` for color-coded split buttons */\n  @property({ type: String, reflect: true }) interaction: Interaction;\n\n  /** Determines size of button */\n  @property({ type: String, reflect: true }) size?: Size;\n\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-button-group',\n    version: '0.0.0',\n    children: ['nve-button', 'nve-icon-button', 'nve-divider']\n  };\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  @queryAssignedElements({ selector: 'nve-divider' }) private dividers!: Divider[];\n\n  @queryAssignedElements({ selector: 'nve-icon-button' }) private iconButtons!: IconButton[];\n\n  @queryAssignedElements({ selector: 'nve-button' }) private buttons!: Button[];\n\n  get #buttons() {\n    return [...this.iconButtons, ...this.buttons];\n  }\n\n  render() {\n    return html`\n      <div internal-host>\n        <slot @slotchange=${this.#syncStyleStates}></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    appendRootNodeStyle(this, globalStyles);\n    this._internals.role = 'group';\n    this.addEventListener('click', this.#onClick);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('click', this.#onClick);\n  }\n\n  #onClick = (e: Event) => this.#selectButton(e.target as HTMLElement & { pressed?: boolean });\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n    this.#syncStyleStates();\n  }\n\n  #syncStyleStates() {\n    if (this.container === 'flat') {\n      this.#buttons.forEach(btn => (btn.container = 'flat'));\n    }\n\n    if (this.interaction) {\n      this.#buttons.forEach(btn => (btn.interaction = this.interaction));\n    }\n\n    this.dividers.length ? this._internals.states.add('split') : this._internals.states.delete('split');\n  }\n\n  #selectButton(button: HTMLElement & { pressed?: boolean }) {\n    if (!button.matches?.('nve-button, nve-icon-button')) {\n      return;\n    }\n\n    if (this.behaviorSelect === 'single') {\n      this.#buttons.forEach(i => (i.pressed = false));\n      button.pressed = true;\n    } else if (this.behaviorSelect === 'multi') {\n      button.pressed = !button.pressed;\n    }\n  }\n}\n"],"mappings":";;;;;;;;;;;;AAuCO,IAAM,IAAN,cAA0B,EAAW;;EAkE9B,aAlDyE,KAAA,cAAA,cAkDzE,KAAA,MAAA,MAAa,KAAK,GAAc,EAAE,MAA6C;;CAhE3F,IAAI,mBAAqC;EACvC,OAAO;GACL,OAAO,KAAK;GACZ,QAAQ,KAAK;EACf;CACF;;EAiBgB,KAAA,SAAA,EAAU,CAAC,CAAM,CAAC;;;EAEP,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;GACT,UAAU;IAAC;IAAc;IAAmB;GAAa;EAC3D;;CAWA,IAAI,KAAW;EACb,OAAO,CAAC,GAAG,KAAK,aAAa,GAAG,KAAK,OAAO;CAC9C;CAEA,SAAS;EACP,OAAO,CAAI,yCAEa,KAAK,GAAiB;CAGhD;CAEA,oBAAoB;EAKlB,AAJA,MAAM,kBAAkB,GACxB,EAAgB,IAAI,GACpB,EAAoB,MAAM,CAAY,GACtC,KAAK,WAAW,OAAO,SACvB,KAAK,iBAAiB,SAAS,KAAK,EAAQ;CAC9C;CAEA,uBAAuB;EAErB,AADA,MAAM,qBAAqB,GAC3B,KAAK,oBAAoB,SAAS,KAAK,EAAQ;CACjD;CAEA;CAEA,QAAQ,GAA6B;EAEnC,AADA,MAAM,QAAQ,CAAK,GACnB,KAAK,GAAiB;CACxB;CAEA,KAAmB;EASjB,AARI,KAAK,cAAc,UACrB,KAAK,GAAS,SAAQ,MAAQ,EAAI,YAAY,MAAO,GAGnD,KAAK,eACP,KAAK,GAAS,SAAQ,MAAQ,EAAI,cAAc,KAAK,WAAY,GAGnE,KAAK,SAAS,SAAS,KAAK,WAAW,OAAO,IAAI,OAAO,IAAI,KAAK,WAAW,OAAO,OAAO,OAAO;CACpG;CAEA,GAAc,GAA6C;EACpD,EAAO,UAAU,6BAA6B,MAI/C,KAAK,mBAAmB,YAC1B,KAAK,GAAS,SAAQ,MAAM,EAAE,UAAU,EAAM,GAC9C,EAAO,UAAU,MACR,KAAK,mBAAmB,YACjC,EAAO,UAAU,CAAC,EAAO;CAE7B;AACF;AAvFG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,WAAW;AAAkB,CAAC,CAAA,GAAA,EAAA,WAAA,kBAAA,KAAA,CAAA,GAGvD,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,aAAA,KAAA,CAAA,GAGxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,eAAA,KAAA,CAAA,GAGxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,eAAA,KAAA,CAAA,GAGxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,GAaxC,EAAA,CAAA,EAAsB,EAAE,UAAU,cAAc,CAAC,CAAA,GAAA,EAAA,WAAA,YAAA,KAAA,CAAA,GAEjD,EAAA,CAAA,EAAsB,EAAE,UAAU,kBAAkB,CAAC,CAAA,GAAA,EAAA,WAAA,eAAA,KAAA,CAAA,GAErD,EAAA,CAAA,EAAsB,EAAE,UAAU,aAAa,CAAC,CAAA,GAAA,EAAA,WAAA,WAAA,KAAA,CAAA,GAzClD,IAAA,EAAA,CAAA,EAAM,GACN,EAA+B,CAAA,GAAA,CAAA"}
+{"version":3,"file":"button-group2.js","names":[],"sources":["../../src/button-group/button-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 { queryAssignedElements } from 'lit/decorators/query-assigned-elements.js';\nimport type { KeynavListConfig, Interaction, Size } from '@nvidia-elements/core/internal';\nimport {\n  attachInternals,\n  keyNavigationList,\n  useStyles,\n  audit,\n  appendRootNodeStyle\n} from '@nvidia-elements/core/internal';\nimport type { IconButton } from '@nvidia-elements/core/icon-button';\nimport type { Button } from '@nvidia-elements/core/button';\nimport type { Divider } from '@nvidia-elements/core/divider';\nimport styles from './button-group.css?inline';\nimport globalStyles from './button-group.global.css?inline';\n\n/**\n * @element nve-button-group\n * @description A button group organizes related buttons and can support either mutually exclusive single or multi selection. Prefer usage within toolbars.\n * @documentation https://nvidia.github.io/elements/docs/elements/button-group/\n * @since 0.16.0\n * @entrypoint \\@nvidia-elements/core/button-group\n * @slot - default slot for `nve-button`, `nve-icon-button`, `nve-divider`, `nve-media-seek-button`, or `nve-media-pause-button`\n * @cssprop --background\n * @cssprop --border-radius\n * @cssprop --padding\n * @cssprop --gap\n * @cssprop --width\n * @cssprop --height\n * @cssprop --color\n * @aria https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/group_role\n */\n@audit()\n@keyNavigationList<ButtonGroup>()\nexport class ButtonGroup extends LitElement {\n  /** @private */\n  get keynavListConfig(): KeynavListConfig {\n    return {\n      items: this.#buttons,\n      layout: this.orientation\n    };\n  }\n\n  /** By default the button group is stateless. Add the `behavior-select` attribute and set to `single` or `multi` to enable stateful selction handling. */\n  @property({ type: String, attribute: 'behavior-select' }) behaviorSelect: 'single' | 'multi';\n\n  /** Set the style of the button group using the `container` property. Options are the default display when omitting the attribute, `flat` or `rounded`. */\n  @property({ type: String, reflect: true }) container?: 'flat' | 'rounded';\n\n  /** Determines the orientation direction of the group. Vertical groups support icon buttons only. */\n  @property({ type: String, reflect: true }) orientation?: 'horizontal' | 'vertical' = 'horizontal';\n\n  /** Use the `interaction` property on `button-group` in combination with `divider` for color-coded split buttons */\n  @property({ type: String, reflect: true }) interaction: Interaction;\n\n  /** Determines size of button */\n  @property({ type: String, reflect: true }) size?: Size;\n\n  static styles = useStyles([styles]);\n\n  static readonly metadata = {\n    tag: 'nve-button-group',\n    version: '0.0.0',\n    children: ['nve-button', 'nve-icon-button', 'nve-divider', 'nve-media-seek-button', 'nve-media-pause-button']\n  };\n\n  /** @private */\n  declare _internals: ElementInternals;\n\n  @queryAssignedElements({ selector: 'nve-divider' }) private dividers!: Divider[];\n\n  @queryAssignedElements({ selector: 'nve-icon-button' }) private iconButtons!: IconButton[];\n\n  @queryAssignedElements({ selector: 'nve-button' }) private buttons!: Button[];\n\n  get #buttons() {\n    return [...this.iconButtons, ...this.buttons];\n  }\n\n  render() {\n    return html`\n      <div internal-host>\n        <slot @slotchange=${this.#syncStyleStates}></slot>\n      </div>\n    `;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    attachInternals(this);\n    appendRootNodeStyle(this, globalStyles);\n    this._internals.role = 'group';\n    this.addEventListener('click', this.#onClick);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('click', this.#onClick);\n  }\n\n  #onClick = (e: Event) => this.#selectButton(e.target as HTMLElement & { pressed?: boolean });\n\n  updated(props: PropertyValues<this>) {\n    super.updated(props);\n    this.#syncStyleStates();\n  }\n\n  #syncStyleStates() {\n    if (this.container === 'flat') {\n      this.#buttons.forEach(btn => (btn.container = 'flat'));\n    }\n\n    if (this.interaction) {\n      this.#buttons.forEach(btn => (btn.interaction = this.interaction));\n    }\n\n    this.dividers.length ? this._internals.states.add('split') : this._internals.states.delete('split');\n  }\n\n  #selectButton(button: HTMLElement & { pressed?: boolean }) {\n    if (!button.matches?.('nve-button, nve-icon-button')) {\n      return;\n    }\n\n    if (this.behaviorSelect === 'single') {\n      this.#buttons.forEach(i => (i.pressed = false));\n      button.pressed = true;\n    } else if (this.behaviorSelect === 'multi') {\n      button.pressed = !button.pressed;\n    }\n  }\n}\n"],"mappings":";;;;;;;;;;;;AAuCO,IAAM,IAAN,cAA0B,EAAW;;EAkE9B,aAlDyE,KAAA,cAAA,cAkDzE,KAAA,MAAA,MAAa,KAAK,GAAc,EAAE,MAA6C;;CAhE3F,IAAI,mBAAqC;EACvC,OAAO;GACL,OAAO,KAAK;GACZ,QAAQ,KAAK;EACf;CACF;;EAiBgB,KAAA,SAAA,EAAU,CAAC,CAAM,CAAC;;;EAEP,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;GACT,UAAU;IAAC;IAAc;IAAmB;IAAe;IAAyB;GAAwB;EAC9G;;CAWA,IAAI,KAAW;EACb,OAAO,CAAC,GAAG,KAAK,aAAa,GAAG,KAAK,OAAO;CAC9C;CAEA,SAAS;EACP,OAAO,CAAI,yCAEa,KAAK,GAAiB;CAGhD;CAEA,oBAAoB;EAKlB,AAJA,MAAM,kBAAkB,GACxB,EAAgB,IAAI,GACpB,EAAoB,MAAM,CAAY,GACtC,KAAK,WAAW,OAAO,SACvB,KAAK,iBAAiB,SAAS,KAAK,EAAQ;CAC9C;CAEA,uBAAuB;EAErB,AADA,MAAM,qBAAqB,GAC3B,KAAK,oBAAoB,SAAS,KAAK,EAAQ;CACjD;CAEA;CAEA,QAAQ,GAA6B;EAEnC,AADA,MAAM,QAAQ,CAAK,GACnB,KAAK,GAAiB;CACxB;CAEA,KAAmB;EASjB,AARI,KAAK,cAAc,UACrB,KAAK,GAAS,SAAQ,MAAQ,EAAI,YAAY,MAAO,GAGnD,KAAK,eACP,KAAK,GAAS,SAAQ,MAAQ,EAAI,cAAc,KAAK,WAAY,GAGnE,KAAK,SAAS,SAAS,KAAK,WAAW,OAAO,IAAI,OAAO,IAAI,KAAK,WAAW,OAAO,OAAO,OAAO;CACpG;CAEA,GAAc,GAA6C;EACpD,EAAO,UAAU,6BAA6B,MAI/C,KAAK,mBAAmB,YAC1B,KAAK,GAAS,SAAQ,MAAM,EAAE,UAAU,EAAM,GAC9C,EAAO,UAAU,MACR,KAAK,mBAAmB,YACjC,EAAO,UAAU,CAAC,EAAO;CAE7B;AACF;AAvFG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,WAAW;AAAkB,CAAC,CAAA,GAAA,EAAA,WAAA,kBAAA,KAAA,CAAA,GAGvD,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,aAAA,KAAA,CAAA,GAGxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,eAAA,KAAA,CAAA,GAGxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,eAAA,KAAA,CAAA,GAGxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,GAaxC,EAAA,CAAA,EAAsB,EAAE,UAAU,cAAc,CAAC,CAAA,GAAA,EAAA,WAAA,YAAA,KAAA,CAAA,GAEjD,EAAA,CAAA,EAAsB,EAAE,UAAU,kBAAkB,CAAC,CAAA,GAAA,EAAA,WAAA,eAAA,KAAA,CAAA,GAErD,EAAA,CAAA,EAAsB,EAAE,UAAU,aAAa,CAAC,CAAA,GAAA,EAAA,WAAA,WAAA,KAAA,CAAA,GAzClD,IAAA,EAAA,CAAA,EAAM,GACN,EAA+B,CAAA,GAAA,CAAA"}

package/dist/card/card2.js

@@ -16,7 +16,7 @@ var d = class extends c {
 	static {
 		this.metadata = {
 			tag: "nve-card",
-			version: "2.18.1"
+			version: "2.18.2"
 		};
 	}
 	render() {
@@ -37,7 +37,7 @@ var f = class extends c {
 	static {
 		this.metadata = {
 			tag: "nve-card-header",
-			version: "2.18.1",
+			version: "2.18.2",
 			parents: ["nve-card"]
 		};
 	}
@@ -45,7 +45,7 @@ var f = class extends c {
 		return l`<header internal-host><div class="content"><slot></slot></div></header>`;
 	}
 };
-r([t()], f.prototype, "slot", void 0), f = r([e()], f);
+r([t()], f.prototype, "slot", void 0);
 var p = class extends c {
 	static {
 		this.styles = n([o]);
@@ -53,16 +53,14 @@ var p = class extends c {
 	static {
 		this.metadata = {
 			tag: "nve-card-content",
-			version: "2.18.1",
+			version: "2.18.2",
 			parents: ["nve-card"]
 		};
 	}
 	render() {
 		return l`<slot></slot>`;
 	}
-};
-p = r([e()], p);
-var m = class extends c {
+}, m = class extends c {
 	constructor(...e) {
 		super(...e), this.slot = "footer";
 	}
@@ -72,7 +70,7 @@ var m = class extends c {
 	static {
 		this.metadata = {
 			tag: "nve-card-footer",
-			version: "2.18.1",
+			version: "2.18.2",
 			parents: ["nve-card"]
 		};
 	}
@@ -80,7 +78,7 @@ var m = class extends c {
 		return l`<footer internal-host><slot></slot></footer>`;
 	}
 };
-r([t()], m.prototype, "slot", void 0), m = r([e()], m);
+r([t()], m.prototype, "slot", void 0);
 //#endregion
 export { d as Card, p as CardContent, m as CardFooter, f as CardHeader };
 

package/dist/card/card2.js.map

@@ -1 +1 @@
-{"version":3,"file":"card2.js","names":[],"sources":["../../src/card/card.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 { audit, hostAttr, useStyles } from '@nvidia-elements/core/internal';\nimport cardStyleSheet from './card.css?inline';\nimport cardHeaderStyleSheet from './card-header.css?inline';\nimport cardContentStyleSheet from './card-content.css?inline';\nimport cardFooterStyleSheet from './card-footer.css?inline';\n\n/**\n * @element nve-card\n * @description A container for content representing a single entity.\n * @documentation https://nvidia.github.io/elements/docs/elements/card/\n * @since 0.1.3\n * @entrypoint \\@nvidia-elements/core/card\n * @slot - use `<nve-card-header>`,`<nve-card-content>`,`<nve-card-footer>` for card content layout\n * @cssprop --background\n * @cssprop --color\n * @cssprop --border-radius\n * @cssprop --box-shadow\n * @cssprop --border\n * @aria https://github.com/w3c/aria-practices/issues\n */\n@audit()\nexport class Card extends LitElement implements ContainerElement {\n  /** flat (embed into parent container) or full (width of viewport) */\n  @property({ type: String, reflect: true }) container?: 'flat' | 'full';\n\n  static styles = useStyles([cardStyleSheet]);\n\n  static readonly metadata = {\n    tag: 'nve-card',\n    version: '0.0.0'\n  };\n\n  render() {\n    return html`\n      <div internal-host>\n        <slot name=\"header\"></slot>\n\n        <slot></slot>\n\n        <slot name=\"footer\"></slot>\n      </div>\n    `;\n  }\n}\n\n/**\n * @element nve-card-header\n * @description Displays the title and optional actions at the top of a card, establishing the card's identity and purpose.\n * @documentation https://nvidia.github.io/elements/docs/elements/card/\n * @since 0.1.3\n * @entrypoint \\@nvidia-elements/core/card\n * @slot - Card title, supporting text, and optional action controls.\n * @cssprop --padding\n * @cssprop --border-bottom\n * @cssprop --line-height\n * @cssprop --gap\n * @aria https://github.com/w3c/aria-practices/issues\n */\n@audit()\nexport class CardHeader extends LitElement {\n  static styles = useStyles([cardHeaderStyleSheet]);\n\n  static readonly metadata = {\n    tag: 'nve-card-header',\n    version: '0.0.0',\n    parents: ['nve-card']\n  };\n\n  /** @private */\n  @hostAttr() slot = 'header';\n\n  render() {\n    return html`\n      <header internal-host>\n        <div class=\"content\">\n          <slot></slot>\n        </div>\n      </header>\n    `;\n  }\n}\n\n/**\n * @element nve-card-content\n * @description Contains the primary body content of a card, providing a structured region for the main information or media.\n * @documentation https://nvidia.github.io/elements/docs/elements/card/\n * @since 0.1.3\n * @entrypoint \\@nvidia-elements/core/card\n * @slot - This is a default/unnamed slot for card content\n * @cssprop --padding\n * @aria https://github.com/w3c/aria-practices/issues\n */\n@audit()\nexport class CardContent extends LitElement {\n  static styles = useStyles([cardContentStyleSheet]);\n\n  static readonly metadata = {\n    tag: 'nve-card-content',\n    version: '0.0.0',\n    parents: ['nve-card']\n  };\n\n  render() {\n    return html`\n      <slot></slot>\n    `;\n  }\n}\n\n/**\n * @element nve-card-footer\n * @description Provides a designated area at the bottom of a card for actions, metadata, or supplementary information.\n * @documentation https://nvidia.github.io/elements/docs/elements/card/\n * @since 0.1.3\n * @entrypoint \\@nvidia-elements/core/card\n * @slot - This is a default/unnamed slot for card footer content\n * @cssprop --padding\n * @cssprop --border-top\n * @aria https://github.com/w3c/aria-practices/issues\n */\n@audit()\nexport class CardFooter extends LitElement {\n  static styles = useStyles([cardFooterStyleSheet]);\n\n  static readonly metadata = {\n    tag: 'nve-card-footer',\n    version: '0.0.0',\n    parents: ['nve-card']\n  };\n\n  /** @private */\n  @hostAttr() slot = 'footer';\n\n  render() {\n    return html`\n      <footer internal-host>\n        <slot></slot>\n      </footer>\n    `;\n  }\n}\n"],"mappings":";;;;;;;;;;;AA2BO,IAAM,IAAN,cAAmB,EAAuC;;EAI/C,KAAA,SAAA,EAAU,CAAC,CAAc,CAAC;;;EAEf,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;CAEA,SAAS;EACP,OAAO,CAAI;CASb;AACF;AApBG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,aAAA,KAAA,CAAA,GAH1C,IAAA,EAAA,CAAA,EAAM,CAAA,GAAA,CAAA;AAuCA,IAAM,IAAN,cAAyB,EAAW;;EAUtB,aAAA,KAAA,OAAA;;;EATH,KAAA,SAAA,EAAU,CAAC,CAAoB,CAAC;;;EAErB,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;GACT,SAAS,CAAC,UAAU;EACtB;;CAKA,SAAS;EACP,OAAO,CAAI;CAOb;AACF;AAXG,EAAA,CAAA,EAAS,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,GAXX,IAAA,EAAA,CAAA,EAAM,CAAA,GAAA,CAAA;AAmCA,IAAM,IAAN,cAA0B,EAAW;;EAC1B,KAAA,SAAA,EAAU,CAAC,CAAqB,CAAC;;;EAEtB,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;GACT,SAAS,CAAC,UAAU;EACtB;;CAEA,SAAS;EACP,OAAO,CAAI;CAGb;AACF;AAfC,IAAA,EAAA,CAAA,EAAM,CAAA,GAAA,CAAA;AA6BA,IAAM,IAAN,cAAyB,EAAW;;EAUtB,aAAA,KAAA,OAAA;;;EATH,KAAA,SAAA,EAAU,CAAC,CAAoB,CAAC;;;EAErB,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;GACT,SAAS,CAAC,UAAU;EACtB;;CAKA,SAAS;EACP,OAAO,CAAI;CAKb;AACF;AATG,EAAA,CAAA,EAAS,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,GAXX,IAAA,EAAA,CAAA,EAAM,CAAA,GAAA,CAAA"}
+{"version":3,"file":"card2.js","names":[],"sources":["../../src/card/card.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 { audit, hostAttr, useStyles } from '@nvidia-elements/core/internal';\nimport cardStyleSheet from './card.css?inline';\nimport cardHeaderStyleSheet from './card-header.css?inline';\nimport cardContentStyleSheet from './card-content.css?inline';\nimport cardFooterStyleSheet from './card-footer.css?inline';\n\n/**\n * @element nve-card\n * @description A container for content representing a single entity.\n * @documentation https://nvidia.github.io/elements/docs/elements/card/\n * @since 0.1.3\n * @entrypoint \\@nvidia-elements/core/card\n * @slot - use `<nve-card-header>`,`<nve-card-content>`,`<nve-card-footer>` for card content layout\n * @cssprop --background\n * @cssprop --color\n * @cssprop --border-radius\n * @cssprop --box-shadow\n * @cssprop --border\n * @aria https://github.com/w3c/aria-practices/issues\n */\n@audit()\nexport class Card extends LitElement implements ContainerElement {\n  /** flat (embed into parent container) or full (width of viewport) */\n  @property({ type: String, reflect: true }) container?: 'flat' | 'full';\n\n  static styles = useStyles([cardStyleSheet]);\n\n  static readonly metadata = {\n    tag: 'nve-card',\n    version: '0.0.0'\n  };\n\n  render() {\n    return html`\n      <div internal-host>\n        <slot name=\"header\"></slot>\n\n        <slot></slot>\n\n        <slot name=\"footer\"></slot>\n      </div>\n    `;\n  }\n}\n\n/**\n * @element nve-card-header\n * @description Displays the title and optional actions at the top of a card, establishing the card's identity and purpose.\n * @documentation https://nvidia.github.io/elements/docs/elements/card/\n * @since 0.1.3\n * @entrypoint \\@nvidia-elements/core/card\n * @slot - Card title, supporting text, and optional action controls.\n * @cssprop --padding\n * @cssprop --border-bottom\n * @cssprop --line-height\n * @cssprop --gap\n * @aria https://github.com/w3c/aria-practices/issues\n */\nexport class CardHeader extends LitElement {\n  static styles = useStyles([cardHeaderStyleSheet]);\n\n  static readonly metadata = {\n    tag: 'nve-card-header',\n    version: '0.0.0',\n    parents: ['nve-card']\n  };\n\n  /** @private */\n  @hostAttr() slot = 'header';\n\n  render() {\n    return html`\n      <header internal-host>\n        <div class=\"content\">\n          <slot></slot>\n        </div>\n      </header>\n    `;\n  }\n}\n\n/**\n * @element nve-card-content\n * @description Contains the primary body content of a card, providing a structured region for the main information or media.\n * @documentation https://nvidia.github.io/elements/docs/elements/card/\n * @since 0.1.3\n * @entrypoint \\@nvidia-elements/core/card\n * @slot - This is a default/unnamed slot for card content\n * @cssprop --padding\n * @aria https://github.com/w3c/aria-practices/issues\n */\nexport class CardContent extends LitElement {\n  static styles = useStyles([cardContentStyleSheet]);\n\n  static readonly metadata = {\n    tag: 'nve-card-content',\n    version: '0.0.0',\n    parents: ['nve-card']\n  };\n\n  render() {\n    return html`\n      <slot></slot>\n    `;\n  }\n}\n\n/**\n * @element nve-card-footer\n * @description Provides a designated area at the bottom of a card for actions, metadata, or supplementary information.\n * @documentation https://nvidia.github.io/elements/docs/elements/card/\n * @since 0.1.3\n * @entrypoint \\@nvidia-elements/core/card\n * @slot - This is a default/unnamed slot for card footer content\n * @cssprop --padding\n * @cssprop --border-top\n * @aria https://github.com/w3c/aria-practices/issues\n */\nexport class CardFooter extends LitElement {\n  static styles = useStyles([cardFooterStyleSheet]);\n\n  static readonly metadata = {\n    tag: 'nve-card-footer',\n    version: '0.0.0',\n    parents: ['nve-card']\n  };\n\n  /** @private */\n  @hostAttr() slot = 'footer';\n\n  render() {\n    return html`\n      <footer internal-host>\n        <slot></slot>\n      </footer>\n    `;\n  }\n}\n"],"mappings":";;;;;;;;;;;AA2BO,IAAM,IAAN,cAAmB,EAAuC;;EAI/C,KAAA,SAAA,EAAU,CAAC,CAAc,CAAC;;;EAEf,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;EACX;;CAEA,SAAS;EACP,OAAO,CAAI;CASb;AACF;AApBG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,aAAA,KAAA,CAAA,GAH1C,IAAA,EAAA,CAAA,EAAM,CAAA,GAAA,CAAA;AAsCP,IAAa,IAAb,cAAgC,EAAW;;EAUtB,aAAA,KAAA,OAAA;;;EATH,KAAA,SAAA,EAAU,CAAC,CAAoB,CAAC;;;EAErB,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;GACT,SAAS,CAAC,UAAU;EACtB;;CAKA,SAAS;EACP,OAAO,CAAI;CAOb;AACF;AAXG,EAAA,CAAA,EAAS,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA;AAuBZ,IAAa,IAAb,cAAiC,EAAW;;EAC1B,KAAA,SAAA,EAAU,CAAC,CAAqB,CAAC;;;EAEtB,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;GACT,SAAS,CAAC,UAAU;EACtB;;CAEA,SAAS;EACP,OAAO,CAAI;CAGb;AACF,GAaa,IAAb,cAAgC,EAAW;;EAUtB,aAAA,KAAA,OAAA;;;EATH,KAAA,SAAA,EAAU,CAAC,CAAoB,CAAC;;;EAErB,KAAA,WAAA;GACzB,KAAK;GACL,SAAS;GACT,SAAS,CAAC,UAAU;EACtB;;CAKA,SAAS;EACP,OAAO,CAAI;CAKb;AACF;AATG,EAAA,CAAA,EAAS,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA"}

package/dist/chat-message/chat-message2.js

@@ -13,7 +13,7 @@ var l = class extends o {
 	static {
 		this.metadata = {
 			tag: "nve-chat-message",
-			version: "2.18.1"
+			version: "2.18.2"
 		};
 	}
 	render() {

package/dist/checkbox/checkbox-group2.js

@@ -12,7 +12,7 @@ var o = class extends i {
 	static {
 		this.metadata = {
 			tag: "nve-checkbox-group",
-			version: "2.18.1",
+			version: "2.18.2",
 			children: [
 				"label",
 				"nve-control-message",

package/dist/checkbox/checkbox2.js

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

package/dist/color/color2.js

@@ -21,7 +21,7 @@ var f = class extends a {
 	static {
 		this.metadata = {
 			tag: "nve-color",
-			version: "2.18.1"
+			version: "2.18.2"
 		};
 	}
 	static {

package/dist/combobox/combobox2.js

@@ -31,7 +31,7 @@ var S = class extends l {
 	static {
 		this.metadata = {
 			tag: "nve-combobox",
-			version: "2.18.1"
+			version: "2.18.2"
 		};
 	}
 	static {

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

@@ -32,7 +32,7 @@ var p = class extends a {
 	static {
 		this.metadata = {
 			tag: "nve-copy-button",
-			version: "2.18.1"
+			version: "2.18.2"
 		};
 	}
 	static {

package/dist/custom-elements-jsx.d.ts

@@ -1260,9 +1260,9 @@ export type FormatNumberProps = {
   "sign-display"?: "auto" | "never" | "always" | "exceptZero" | undefined;
   /** Grouping separators: 'auto' | 'always' | 'min2' | 'true' | 'false'. */
   "use-grouping"?: "auto" | "always" | "min2" | "true" | "false" | boolean | undefined;
-  /** Pad fraction output to at least this many digits (0-20). */
+  /** Pad fraction output to at least this many digits (0-100). */
   "minimum-fraction-digits"?: number | undefined;
-  /** Round fraction output to at most this many digits (0-20). */
+  /** Round fraction output to at most this many digits (0-100). */
   "maximum-fraction-digits"?: number | undefined;
   /** Pad integer output to at least this many digits (1-21). */
   "minimum-integer-digits"?: number | undefined;
@@ -1292,9 +1292,9 @@ When both are present, this property takes precedence. */
   signDisplay?: "auto" | "never" | "always" | "exceptZero" | undefined;
   /** Grouping separators: 'auto' | 'always' | 'min2' | 'true' | 'false'. */
   useGrouping?: "auto" | "always" | "min2" | "true" | "false" | boolean | undefined;
-  /** Pad fraction output to at least this many digits (0-20). */
+  /** Pad fraction output to at least this many digits (0-100). */
   minimumFractionDigits?: number | undefined;
-  /** Round fraction output to at most this many digits (0-20). */
+  /** Round fraction output to at most this many digits (0-100). */
   maximumFractionDigits?: number | undefined;
   /** Pad integer output to at least this many digits (1-21). */
   minimumIntegerDigits?: number | undefined;
@@ -4358,7 +4358,7 @@ export type CustomElements = {
    *
    *
    * ### **Slots:**
-   *  - _default_ - default slot for `nve-button` or `nve-icon-button`
+   *  - _default_ - default slot for `nve-button`, `nve-icon-button`, `nve-divider`, `nve-media-seek-button`, or `nve-media-pause-button`
    *
    * ### **CSS Properties:**
    *  - **--background** - undefined _(default: undefined)_

package/dist/custom-elements-vue.d.ts

@@ -1133,9 +1133,9 @@ type FormatNumberProps = {
   "sign-display"?: "auto" | "never" | "always" | "exceptZero" | undefined;
   /** Grouping separators: 'auto' | 'always' | 'min2' | 'true' | 'false'. */
   "use-grouping"?: "auto" | "always" | "min2" | "true" | "false" | boolean | undefined;
-  /** Pad fraction output to at least this many digits (0-20). */
+  /** Pad fraction output to at least this many digits (0-100). */
   "minimum-fraction-digits"?: number | undefined;
-  /** Round fraction output to at most this many digits (0-20). */
+  /** Round fraction output to at most this many digits (0-100). */
   "maximum-fraction-digits"?: number | undefined;
   /** Pad integer output to at least this many digits (1-21). */
   "minimum-integer-digits"?: number | undefined;
@@ -1165,9 +1165,9 @@ When both are present, this property takes precedence. */
   signDisplay?: "auto" | "never" | "always" | "exceptZero" | undefined;
   /** Grouping separators: 'auto' | 'always' | 'min2' | 'true' | 'false'. */
   useGrouping?: "auto" | "always" | "min2" | "true" | "false" | boolean | undefined;
-  /** Pad fraction output to at least this many digits (0-20). */
+  /** Pad fraction output to at least this many digits (0-100). */
   minimumFractionDigits?: number | undefined;
-  /** Round fraction output to at most this many digits (0-20). */
+  /** Round fraction output to at most this many digits (0-100). */
   maximumFractionDigits?: number | undefined;
   /** Pad integer output to at least this many digits (1-21). */
   minimumIntegerDigits?: number | undefined;
@@ -4111,7 +4111,7 @@ export type CustomElements = {
    *
    *
    * ### **Slots:**
-   *  - _default_ - default slot for `nve-button` or `nve-icon-button`
+   *  - _default_ - default slot for `nve-button`, `nve-icon-button`, `nve-divider`, `nve-media-seek-button`, or `nve-media-pause-button`
    *
    * ### **CSS Properties:**
    *  - **--background** - undefined _(default: undefined)_

package/dist/custom-elements.json

@@ -3136,7 +3136,7 @@
           ],
           "slots": [
             {
-              "description": "default slot for `nve-button` or `nve-icon-button`",
+              "description": "default slot for `nve-button`, `nve-icon-button`, `nve-divider`, `nve-media-seek-button`, or `nve-media-pause-button`",
               "name": ""
             }
           ],
@@ -3389,7 +3389,7 @@
             "since": "0.16.0",
             "status": "stable",
             "behavior": "container",
-            "markdown": "## nve-button-group\n\nA button group organizes related buttons and can support either mutually exclusive single or multi selection. Prefer usage within toolbars.\n\n### Example\n\n```html\n<nve-button-group>\n  <nve-icon-button selected icon-name=\"copy\"></nve-icon-button>\n  <nve-icon-button icon-name=\"add-comment\"></nve-icon-button>\n  <nve-icon-button icon-name=\"download\"></nve-icon-button>\n</nve-button-group>\n```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/button-group/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | default slot for `nve-button` or `nve-icon-button` |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| behaviorSelect (behavior-select) | `'single' \\| 'multi'` | By default the button group is stateless. Add the `behavior-select` attribute and set to `single` or `multi` to enable stateful selction handling. |\n| container | `'flat' \\| 'rounded' \\| undefined` | Set the style of the button group using the `container` property. Options are the default display when omitting the attribute, `flat` or `rounded`. |\n| interaction | `'emphasis' \\| 'destructive'` | The Interaction type provides a way to show the intent of an interactive element. This can help users quickly understand what each interaction does and reduce the potential for confusion or errors. - `emphasis` Shows the interaction targets emphasis or highlighting primary actions. - `destructive` Shows the interaction targets destructive actions such as deleting or removing. |\n| orientation | `'horizontal' \\| 'vertical' \\| undefined` | Controls the directional flow of the element's layout and interaction pattern. - `horizontal` Element orients horizontally with left-to-right flow. - `vertical` Element orients vertically with top-to-bottom flow. |\n| size | `'sm' \\| 'md' \\| 'lg' \\| undefined` | Controls the visual scale of an element to match its importance and available space. - `sm` Compact size for dense layouts or secondary elements with less visual prominence. - `md` Standard size that works well in most contexts and provides balanced visibility. - `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. |\n\n### CSS Properties\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| --background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --border-radius | `string` | [MDN](https://mdn.dev/CSS/border-radius) |\n| --color | `string` | [MDN](https://mdn.dev/CSS/color) |\n| --gap | `string` | [MDN](https://mdn.dev/CSS/gap) |\n| --height | `string` | [MDN](https://mdn.dev/CSS/height) |\n| --padding | `string` | [MDN](https://mdn.dev/CSS/padding) |\n| --width | `string` | [MDN](https://mdn.dev/CSS/width) |"
+            "markdown": "## nve-button-group\n\nA button group organizes related buttons and can support either mutually exclusive single or multi selection. Prefer usage within toolbars.\n\n### Example\n\n```html\n<nve-button-group>\n  <nve-icon-button selected icon-name=\"copy\"></nve-icon-button>\n  <nve-icon-button icon-name=\"add-comment\"></nve-icon-button>\n  <nve-icon-button icon-name=\"download\"></nve-icon-button>\n</nve-button-group>\n```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/button-group/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | default slot for `nve-button`, `nve-icon-button`, `nve-divider`, `nve-media-seek-button`, or `nve-media-pause-button` |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| behaviorSelect (behavior-select) | `'single' \\| 'multi'` | By default the button group is stateless. Add the `behavior-select` attribute and set to `single` or `multi` to enable stateful selction handling. |\n| container | `'flat' \\| 'rounded' \\| undefined` | Set the style of the button group using the `container` property. Options are the default display when omitting the attribute, `flat` or `rounded`. |\n| interaction | `'emphasis' \\| 'destructive'` | The Interaction type provides a way to show the intent of an interactive element. This can help users quickly understand what each interaction does and reduce the potential for confusion or errors. - `emphasis` Shows the interaction targets emphasis or highlighting primary actions. - `destructive` Shows the interaction targets destructive actions such as deleting or removing. |\n| orientation | `'horizontal' \\| 'vertical' \\| undefined` | Controls the directional flow of the element's layout and interaction pattern. - `horizontal` Element orients horizontally with left-to-right flow. - `vertical` Element orients vertically with top-to-bottom flow. |\n| size | `'sm' \\| 'md' \\| 'lg' \\| undefined` | Controls the visual scale of an element to match its importance and available space. - `sm` Compact size for dense layouts or secondary elements with less visual prominence. - `md` Standard size that works well in most contexts and provides balanced visibility. - `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. |\n\n### CSS Properties\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| --background | `string` | [MDN](https://mdn.dev/CSS/background) |\n| --border-radius | `string` | [MDN](https://mdn.dev/CSS/border-radius) |\n| --color | `string` | [MDN](https://mdn.dev/CSS/color) |\n| --gap | `string` | [MDN](https://mdn.dev/CSS/gap) |\n| --height | `string` | [MDN](https://mdn.dev/CSS/height) |\n| --padding | `string` | [MDN](https://mdn.dev/CSS/padding) |\n| --width | `string` | [MDN](https://mdn.dev/CSS/width) |"
           }
         }
       ],
@@ -15134,7 +15134,7 @@
                   }
                 ]
               },
-              "description": "Pad fraction output to at least this many digits (0-20).",
+              "description": "Pad fraction output to at least this many digits (0-100).",
               "attribute": "minimum-fraction-digits"
             },
             {
@@ -15150,7 +15150,7 @@
                   }
                 ]
               },
-              "description": "Round fraction output to at most this many digits (0-20).",
+              "description": "Round fraction output to at most this many digits (0-100).",
               "attribute": "maximum-fraction-digits"
             },
             {
@@ -15462,7 +15462,7 @@
                   }
                 ]
               },
-              "description": "Pad fraction output to at least this many digits (0-20).",
+              "description": "Pad fraction output to at least this many digits (0-100).",
               "fieldName": "minimumFractionDigits"
             },
             {
@@ -15477,7 +15477,7 @@
                   }
                 ]
               },
-              "description": "Round fraction output to at most this many digits (0-20).",
+              "description": "Round fraction output to at most this many digits (0-100).",
               "fieldName": "maximumFractionDigits"
             },
             {
@@ -15518,7 +15518,7 @@
             "since": "0.0.0",
             "status": "stable",
             "behavior": "content",
-            "markdown": "## nve-format-number\n\nA localized number formatter for currencies, percentages, units, and compact notation, backed by Intl.NumberFormat.\nProvide a `currency` attribute when `formatStyle` is `currency`, and a `unit` attribute when `formatStyle` is `unit`.\n\n### Example\n\n```html\n<nve-format-number>1234567.89</nve-format-number>\n```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/format-number/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | Numeric string to format (such as 1234567 or 1234.56). Serves as fallback before hydration. |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| compactDisplay (compact-display) | `'short' \\| 'long' \\| undefined` | Compact notation display: 'short' \\| 'long'. Only applies when notation is compact. |\n| currency | `string \\| undefined` | ISO 4217 currency code (such as USD or EUR). Required when formatStyle is currency. |\n| currencyDisplay (currency-display) | `'symbol' \\| 'code' \\| 'name' \\| 'narrowSymbol' \\| undefined` | Currency display style: 'symbol' \\| 'code' \\| 'name' \\| 'narrowSymbol'. |\n| currencySign (currency-sign) | `'standard' \\| 'accounting' \\| undefined` | Currency sign style: 'standard' \\| 'accounting'. |\n| formatStyle (format-style) | `'decimal' \\| 'currency' \\| 'percent' \\| 'unit'` | Formatting style: 'decimal' \\| 'currency' \\| 'percent' \\| 'unit'. |\n| locale | `string \\| undefined` | Language tag (such as en-US, de-DE). Defaults to document.documentElement.lang or browser default. |\n| maximumFractionDigits (maximum-fraction-digits) | `number \\| undefined` | Round fraction output to at most this many digits (0-20). |\n| minimumFractionDigits (minimum-fraction-digits) | `number \\| undefined` | Pad fraction output to at least this many digits (0-20). |\n| minimumIntegerDigits (minimum-integer-digits) | `number \\| undefined` | Pad integer output to at least this many digits (1-21). |\n| notation | `'standard' \\| 'scientific' \\| 'engineering' \\| 'compact' \\| undefined` | Number notation: 'standard' \\| 'scientific' \\| 'engineering' \\| 'compact'. |\n| number | `string \\| undefined` | Optional numeric string for values supplied by JavaScript or bound data. By default, the component formats the element's text content, which also serves as the SSR fallback. When both are present, this property takes precedence. |\n| signDisplay (sign-display) | `'auto' \\| 'never' \\| 'always' \\| 'exceptZero' \\| undefined` | Sign display: 'auto' \\| 'never' \\| 'always' \\| 'exceptZero'. |\n| unit | `string \\| undefined` | Unit identifier (such as kilometer or byte). Required when formatStyle is unit. |\n| unitDisplay (unit-display) | `'short' \\| 'long' \\| 'narrow' \\| undefined` | Unit display style: 'short' \\| 'long' \\| 'narrow'. |\n| useGrouping (use-grouping) | `'auto' \\| 'always' \\| 'min2' \\| 'true' \\| 'false' \\| boolean \\| undefined` | Grouping separators: 'auto' \\| 'always' \\| 'min2' \\| 'true' \\| 'false'. |"
+            "markdown": "## nve-format-number\n\nA localized number formatter for currencies, percentages, units, and compact notation, backed by Intl.NumberFormat.\nProvide a `currency` attribute when `formatStyle` is `currency`, and a `unit` attribute when `formatStyle` is `unit`.\n\n### Example\n\n```html\n<nve-format-number>1234567.89</nve-format-number>\n```\n\n### Import\n\n```javascript\nimport '@nvidia-elements/core/format-number/define.js';\n```\n\n### Slots\n\n| name | value | description |\n| ---- | ----- | ----------- |\n| (default) | `string` | Numeric string to format (such as 1234567 or 1234.56). Serves as fallback before hydration. |\n\n### Properties / Attributes\n\n| property (attribute) | value | description |\n| -------------------- | ----- | ----------- |\n| compactDisplay (compact-display) | `'short' \\| 'long' \\| undefined` | Compact notation display: 'short' \\| 'long'. Only applies when notation is compact. |\n| currency | `string \\| undefined` | ISO 4217 currency code (such as USD or EUR). Required when formatStyle is currency. |\n| currencyDisplay (currency-display) | `'symbol' \\| 'code' \\| 'name' \\| 'narrowSymbol' \\| undefined` | Currency display style: 'symbol' \\| 'code' \\| 'name' \\| 'narrowSymbol'. |\n| currencySign (currency-sign) | `'standard' \\| 'accounting' \\| undefined` | Currency sign style: 'standard' \\| 'accounting'. |\n| formatStyle (format-style) | `'decimal' \\| 'currency' \\| 'percent' \\| 'unit'` | Formatting style: 'decimal' \\| 'currency' \\| 'percent' \\| 'unit'. |\n| locale | `string \\| undefined` | Language tag (such as en-US, de-DE). Defaults to document.documentElement.lang or browser default. |\n| maximumFractionDigits (maximum-fraction-digits) | `number \\| undefined` | Round fraction output to at most this many digits (0-100). |\n| minimumFractionDigits (minimum-fraction-digits) | `number \\| undefined` | Pad fraction output to at least this many digits (0-100). |\n| minimumIntegerDigits (minimum-integer-digits) | `number \\| undefined` | Pad integer output to at least this many digits (1-21). |\n| notation | `'standard' \\| 'scientific' \\| 'engineering' \\| 'compact' \\| undefined` | Number notation: 'standard' \\| 'scientific' \\| 'engineering' \\| 'compact'. |\n| number | `string \\| undefined` | Optional numeric string for values supplied by JavaScript or bound data. By default, the component formats the element's text content, which also serves as the SSR fallback. When both are present, this property takes precedence. |\n| signDisplay (sign-display) | `'auto' \\| 'never' \\| 'always' \\| 'exceptZero' \\| undefined` | Sign display: 'auto' \\| 'never' \\| 'always' \\| 'exceptZero'. |\n| unit | `string \\| undefined` | Unit identifier (such as kilometer or byte). Required when formatStyle is unit. |\n| unitDisplay (unit-display) | `'short' \\| 'long' \\| 'narrow' \\| undefined` | Unit display style: 'short' \\| 'long' \\| 'narrow'. |\n| useGrouping (use-grouping) | `'auto' \\| 'always' \\| 'min2' \\| 'true' \\| 'false' \\| boolean \\| undefined` | Grouping separators: 'auto' \\| 'always' \\| 'min2' \\| 'true' \\| 'false'. |"
           }
         }
       ],
@@ -25699,6 +25699,22 @@
           "description": "",
           "name": "AuditController",
           "members": [
+            {
+              "kind": "field",
+              "name": "#counted",
+              "privacy": "private",
+              "type": {
+                "text": "boolean",
+                "_sourceAliases": [],
+                "values": [
+                  {
+                    "value": "boolean",
+                    "description": ""
+                  }
+                ]
+              },
+              "default": "false"
+            },
             {
               "kind": "field",
               "name": "#hostAuditState",
@@ -25753,11 +25769,6 @@
                 }
               ]
             },
-            {
-              "kind": "method",
-              "name": "#auditSlots",
-              "privacy": "private"
-            },
             {
               "kind": "method",
               "name": "#auditParentElement",
@@ -29170,19 +29181,12 @@
         },
         {
           "kind": "function",
-          "name": "getInvalidSlottedChildrenWarning",
+          "name": "getMultiplePageWarning",
           "parameters": [
             {
-              "name": "localName",
-              "type": {
-                "text": "string",
-                "_sourceAliases": []
-              }
-            },
-            {
-              "name": "allowed",
+              "name": "count",
               "type": {
-                "text": "Array<string>",
+                "text": "number",
                 "_sourceAliases": []
               }
             }
@@ -29291,9 +29295,9 @@
         },
         {
           "kind": "js",
-          "name": "getInvalidSlottedChildrenWarning",
+          "name": "getMultiplePageWarning",
           "declaration": {
-            "name": "getInvalidSlottedChildrenWarning",
+            "name": "getMultiplePageWarning",
             "module": "/src/internal/utils/audit-logs.js"
           }
         },
@@ -29351,24 +29355,6 @@
       "kind": "javascript-module",
       "path": "/src/internal/utils/audit.js",
       "declarations": [
-        {
-          "kind": "function",
-          "name": "auditSlots",
-          "return": {
-            "type": {
-              "text": "[Element[], string[]]"
-            }
-          },
-          "parameters": [
-            {
-              "name": "host",
-              "type": {
-                "text": "HTMLElement & { constructor: { metadata?: { children?: string[]; disallowedChildren?: string[] } } }",
-                "_sourceAliases": []
-              }
-            }
-          ]
-        },
         {
           "kind": "function",
           "name": "auditParentElement",
@@ -29389,14 +29375,6 @@
         }
       ],
       "exports": [
-        {
-          "kind": "js",
-          "name": "auditSlots",
-          "declaration": {
-            "name": "auditSlots",
-            "module": "/src/internal/utils/audit.js"
-          }
-        },
         {
           "kind": "js",
           "name": "auditParentElement",

package/dist/data.html.json

@@ -378,7 +378,7 @@
     },
     {
       "name": "nve-button-group",
-      "description": "A button group organizes related buttons and can support either mutually exclusive single or multi selection. Prefer usage within toolbars.\n---\n\n\n### **Slots:**\n - _default_ - default slot for `nve-button` or `nve-icon-button`\n\n### **CSS Properties:**\n - **--background** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/background) _(default: undefined)_\n- **--border-radius** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius) _(default: undefined)_\n- **--padding** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/padding) _(default: undefined)_\n- **--gap** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/gap) _(default: undefined)_\n- **--width** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/width) _(default: undefined)_\n- **--height** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/height) _(default: undefined)_\n- **--color** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/color) _(default: undefined)_",
+      "description": "A button group organizes related buttons and can support either mutually exclusive single or multi selection. Prefer usage within toolbars.\n---\n\n\n### **Slots:**\n - _default_ - default slot for `nve-button`, `nve-icon-button`, `nve-divider`, `nve-media-seek-button`, or `nve-media-pause-button`\n\n### **CSS Properties:**\n - **--background** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/background) _(default: undefined)_\n- **--border-radius** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius) _(default: undefined)_\n- **--padding** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/padding) _(default: undefined)_\n- **--gap** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/gap) _(default: undefined)_\n- **--width** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/width) _(default: undefined)_\n- **--height** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/height) _(default: undefined)_\n- **--color** - [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/color) _(default: undefined)_",
       "attributes": [
         {
           "name": "behavior-select",
@@ -1963,12 +1963,12 @@
         },
         {
           "name": "minimum-fraction-digits",
-          "description": "Pad fraction output to at least this many digits (0-20).",
+          "description": "Pad fraction output to at least this many digits (0-100).",
           "values": []
         },
         {
           "name": "maximum-fraction-digits",
-          "description": "Round fraction output to at most this many digits (0-20).",
+          "description": "Round fraction output to at most this many digits (0-100).",
           "values": []
         },
         {

package/dist/data.snippets.json

@@ -188,6 +188,33 @@
     "description": "Dialog is a component that appears above main content. A modal dialog is used to display critical information that requires users attention.",
     "body": "<nve-dialog size=\"${6:md}\" closable>\n  <nve-dialog-header>\n    <h3 nve-text=\"heading semibold\">${1:Title}</h3>\n  </nve-dialog-header>\n  <p nve-text=\"body\">${2:Content}</p>\n  <nve-dialog-footer>\n    <nve-button>${3:Cancel}</nve-button>\n    <nve-button interaction=\"${4:emphasis}\">${5:OK}</nve-button>\n  </nve-dialog-footer>\n</nve-dialog>\n$0\n"
   },
+  "Card": {
+    "srcFile": "card.snippets.html",
+    "prefix": [
+      "card"
+    ],
+    "type": "pattern",
+    "description": "Basic Card with header and footer",
+    "body": "<nve-card>\n  <nve-card-header>\n    <div>\n      <h2>${1:Title}</h2>\n      <p>${2:Sub Title}</p>\n    </div>\n  </nve-card-header>\n  <nve-card-content>\n    ${3:\n    <p>card content</p>\n    }\n  </nve-card-content>\n  <nve-card-footer>\n    <nve-button style=\"margin-left: auto\">Action</nve-button>\n  </nve-card-footer>\n</nve-card>\n"
+  },
+  "Media Card": {
+    "srcFile": "card.snippets.html",
+    "prefix": [
+      "media-card"
+    ],
+    "type": "pattern",
+    "description": "Basic media Card with card content and card footer",
+    "body": "<nve-card style=\"height: 100%; width: 100%;\">\n  <img alt=\"example visualization for media card demo\" loading=\"lazy\" style=\"width: 100%; height: 100%; object-fit: cover;\">\n  <nve-card-content>\n    ${1:\n    <p>•︎•︎•︎ •︎•︎•︎ •︎•︎•︎</p>\n    }\n  </nve-card-content>\n  <nve-card-footer>\n    <div nve-layout=\"grid span-items:6 gap:xs\">\n      <nve-button>${2:•︎•︎•︎•︎•︎•︎}</nve-button>\n      <nve-button>${3:•︎•︎•︎•︎•︎•︎}</nve-button>\n    </div>\n  </nve-card-footer>\n</nve-card>\n"
+  },
+  "Media Card Grid": {
+    "srcFile": "card.snippets.html",
+    "prefix": [
+      "media-card-grid"
+    ],
+    "type": "pattern",
+    "description": "Grid layout with 3 media cards",
+    "body": "<section nve-layout=\"grid span-items:4 gap:md\">\n  <nve-card style=\"height: 100%; width: 100%;\">\n    <img alt=\"example visualization for media card 1\" loading=\"lazy\" style=\"width: 100%; height: 100%; object-fit: cover;\">\n    <nve-card-content>\n      ${1:\n      <p>•︎•︎•︎ •︎•︎•︎ •︎•︎•︎</p>\n      }\n    </nve-card-content>\n    <nve-card-footer>\n      <div nve-layout=\"grid span-items:6 gap:xs\">\n        <nve-button>${2:•︎•︎•︎•︎•︎•︎}</nve-button>\n        <nve-button>${3:•︎•︎•︎•︎•︎•︎}</nve-button>\n      </div>\n    </nve-card-footer>\n  </nve-card>\n\n  <nve-card style=\"height: 100%; width: 100%;\">\n    <img alt=\"example visualization for media card 2\" loading=\"lazy\" style=\"width: 100%; height: 100%; object-fit: cover;\">\n    <nve-card-content>\n      ${4:\n      <p>•︎•︎•︎ •︎•︎•︎ •︎•︎•︎</p>\n      }\n    </nve-card-content>\n    <nve-card-footer>\n      <div nve-layout=\"grid span-items:6 gap:xs\">\n        <nve-button>${5:•︎•︎•︎•︎•︎•︎}</nve-button>\n        <nve-button>${6:•︎•︎•︎•︎•︎•︎}</nve-button>\n      </div>\n    </nve-card-footer>\n  </nve-card>\n\n  <nve-card style=\"height: 100%; width: 100%;\">\n    <img alt=\"example visualization for media card 3\" loading=\"lazy\" style=\"width: 100%; height: 100%; object-fit: cover;\">\n    <nve-card-content>\n      ${7:\n      <p>•︎•︎•︎ •︎•︎•︎ •︎•︎•︎</p>\n      }\n    </nve-card-content>\n    <nve-card-footer>\n      <div nve-layout=\"grid span-items:6 gap:xs\">\n        <nve-button>${8:•︎•︎•︎•︎•︎•︎}</nve-button>\n        <nve-button>${9:•︎•︎•︎•︎•︎•︎}</nve-button>\n      </div>\n    </nve-card-footer>\n  </nve-card>\n</section>\n"
+  },
   "Button Group": {
     "srcFile": "button-group.snippets.html",
     "prefix": [
@@ -224,33 +251,6 @@
     "description": "Simple vertical button group with three icon buttons.",
     "body": "<nve-button-group orientation=\"vertical\">\n  <nve-icon-button icon-name=\"${1:copy}\"></nve-icon-button>\n  <nve-icon-button icon-name=\"${2:add-comment}\"></nve-icon-button>\n  <nve-icon-button icon-name=\"${3:download}\"></nve-icon-button>\n</nve-button-group>\n"
   },
-  "Card": {
-    "srcFile": "card.snippets.html",
-    "prefix": [
-      "card"
-    ],
-    "type": "pattern",
-    "description": "Basic Card with header and footer",
-    "body": "<nve-card>\n  <nve-card-header>\n    <div>\n      <h2>${1:Title}</h2>\n      <p>${2:Sub Title}</p>\n    </div>\n  </nve-card-header>\n  <nve-card-content>\n    ${3:\n    <p>card content</p>\n    }\n  </nve-card-content>\n  <nve-card-footer>\n    <nve-button style=\"margin-left: auto\">Action</nve-button>\n  </nve-card-footer>\n</nve-card>\n"
-  },
-  "Media Card": {
-    "srcFile": "card.snippets.html",
-    "prefix": [
-      "media-card"
-    ],
-    "type": "pattern",
-    "description": "Basic media Card with card content and card footer",
-    "body": "<nve-card style=\"height: 100%; width: 100%;\">\n  <img alt=\"example visualization for media card demo\" loading=\"lazy\" style=\"width: 100%; height: 100%; object-fit: cover;\">\n  <nve-card-content>\n    ${1:\n    <p>•︎•︎•︎ •︎•︎•︎ •︎•︎•︎</p>\n    }\n  </nve-card-content>\n  <nve-card-footer>\n    <div nve-layout=\"grid span-items:6 gap:xs\">\n      <nve-button>${2:•︎•︎•︎•︎•︎•︎}</nve-button>\n      <nve-button>${3:•︎•︎•︎•︎•︎•︎}</nve-button>\n    </div>\n  </nve-card-footer>\n</nve-card>\n"
-  },
-  "Media Card Grid": {
-    "srcFile": "card.snippets.html",
-    "prefix": [
-      "media-card-grid"
-    ],
-    "type": "pattern",
-    "description": "Grid layout with 3 media cards",
-    "body": "<section nve-layout=\"grid span-items:4 gap:md\">\n  <nve-card style=\"height: 100%; width: 100%;\">\n    <img alt=\"example visualization for media card 1\" loading=\"lazy\" style=\"width: 100%; height: 100%; object-fit: cover;\">\n    <nve-card-content>\n      ${1:\n      <p>•︎•︎•︎ •︎•︎•︎ •︎•︎•︎</p>\n      }\n    </nve-card-content>\n    <nve-card-footer>\n      <div nve-layout=\"grid span-items:6 gap:xs\">\n        <nve-button>${2:•︎•︎•︎•︎•︎•︎}</nve-button>\n        <nve-button>${3:•︎•︎•︎•︎•︎•︎}</nve-button>\n      </div>\n    </nve-card-footer>\n  </nve-card>\n\n  <nve-card style=\"height: 100%; width: 100%;\">\n    <img alt=\"example visualization for media card 2\" loading=\"lazy\" style=\"width: 100%; height: 100%; object-fit: cover;\">\n    <nve-card-content>\n      ${4:\n      <p>•︎•︎•︎ •︎•︎•︎ •︎•︎•︎</p>\n      }\n    </nve-card-content>\n    <nve-card-footer>\n      <div nve-layout=\"grid span-items:6 gap:xs\">\n        <nve-button>${5:•︎•︎•︎•︎•︎•︎}</nve-button>\n        <nve-button>${6:•︎•︎•︎•︎•︎•︎}</nve-button>\n      </div>\n    </nve-card-footer>\n  </nve-card>\n\n  <nve-card style=\"height: 100%; width: 100%;\">\n    <img alt=\"example visualization for media card 3\" loading=\"lazy\" style=\"width: 100%; height: 100%; object-fit: cover;\">\n    <nve-card-content>\n      ${7:\n      <p>•︎•︎•︎ •︎•︎•︎ •︎•︎•︎</p>\n      }\n    </nve-card-content>\n    <nve-card-footer>\n      <div nve-layout=\"grid span-items:6 gap:xs\">\n        <nve-button>${8:•︎•︎•︎•︎•︎•︎}</nve-button>\n        <nve-button>${9:•︎•︎•︎•︎•︎•︎}</nve-button>\n      </div>\n    </nve-card-footer>\n  </nve-card>\n</section>\n"
-  },
   "Alert Group": {
     "srcFile": "alert.snippets.html",
     "prefix": [

package/dist/date/date2.js

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

package/dist/datetime/datetime2.js

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